web/satellite: onb cli flow's access grant flow
Added Generated AG, Install CLI and Import AG components Change-Id: I5757ce4b82a17fdf807c346059ee26ff42be11ef
This commit is contained in:
Vitalii Shpital
parent
97a5c58ce4
commit
54c60fab47
@ -2,13 +2,209 @@
|
||||
// See LICENSE for copying information.
|
||||
|
||||
<template>
|
||||
<div class="cli-install" />
|
||||
<CLIFlowContainer
|
||||
:on-back-click="onBackClick"
|
||||
:on-next-click="onNextClick"
|
||||
title="Install Uplink CLI"
|
||||
>
|
||||
<template #icon>
|
||||
<Icon />
|
||||
</template>
|
||||
<template #content class="cli-install">
|
||||
<p class="cli-install__msg">Install the Uplink CLI binary for your OS.</p>
|
||||
<OSContainer is-install-step="true">
|
||||
<template #windows>
|
||||
<div class="cli-install__windows">
|
||||
<h2 class="cli-install__macos__sub-title">
|
||||
1. Download the
|
||||
<a href="https://github.com/storj/storj/releases/download/v1.34.3/uplink_windows_amd64.zip">
|
||||
Windows Uplink Binary
|
||||
</a>
|
||||
zip file
|
||||
</h2>
|
||||
<p class="cli-install__windows__msg">
|
||||
2. In the Downloads folder, right-click and select "Extract all".
|
||||
</p>
|
||||
<p class="cli-install__windows__msg">3. Extract to Desktop.</p>
|
||||
<p class="cli-install__windows__msg">
|
||||
4. Once extracted, do not open the file, as it can only be accessed via command line.
|
||||
</p>
|
||||
<p class="cli-install__windows__msg">
|
||||
5. Open
|
||||
<b class="cli-install__windows__msg__bold">Windows PowerShell</b>
|
||||
and continue on to the next step.
|
||||
</p>
|
||||
</div>
|
||||
</template>
|
||||
<template #linux>
|
||||
<div class="cli-install__linux">
|
||||
<h1 class="cli-install__linux__title">AMD64</h1>
|
||||
<h2 class="cli-install__linux__sub-title">Curl Download</h2>
|
||||
<div class="cli-install__linux__commands">
|
||||
<p class="cli-install__linux__commands__item">
|
||||
curl -L https://github.com/storj/storj/releases/latest/download/uplink_linux_amd64.zip -o uplink_linux_amd64.zip
|
||||
</p>
|
||||
<p class="cli-install__linux__commands__item">
|
||||
unzip -o uplink_linux_amd64.zip
|
||||
</p>
|
||||
<p class="cli-install__linux__commands__item">
|
||||
chmod 755 uplink
|
||||
</p>
|
||||
<p class="cli-install__linux__commands__item">
|
||||
sudo mv uplink /usr/local/bin/uplink
|
||||
</p>
|
||||
</div>
|
||||
<a class="cli-install__linux__link" href="https://github.com/storj/storj/releases/latest/download/uplink_linux_amd64.zip">
|
||||
Linux AMD64 Uplink Binary
|
||||
</a>
|
||||
<h1 class="cli-install__linux__title margin-top">ARM</h1>
|
||||
<h2 class="cli-install__linux__sub-title">Curl Download</h2>
|
||||
<div class="cli-install__linux__commands">
|
||||
<p class="cli-install__linux__commands__item">
|
||||
curl -L https://github.com/storj/storj/releases/latest/download/uplink_linux_arm.zip -o uplink_linux_arm.zip
|
||||
</p>
|
||||
<p class="cli-install__linux__commands__item">
|
||||
unzip -o uplink_linux_arm.zip
|
||||
</p>
|
||||
<p class="cli-install__linux__commands__item">
|
||||
chmod 755 uplink
|
||||
</p>
|
||||
<p class="cli-install__linux__commands__item">
|
||||
sudo mv uplink /usr/local/bin/uplink
|
||||
</p>
|
||||
</div>
|
||||
<a class="cli-install__linux__link" href="https://github.com/storj/storj/releases/latest/download/uplink_linux_arm.zip">
|
||||
Linux ARM Uplink Binary
|
||||
</a>
|
||||
</div>
|
||||
</template>
|
||||
<template #macos>
|
||||
<div class="cli-install__macos">
|
||||
<h2 class="cli-install__macos__sub-title">Curl Download</h2>
|
||||
<div class="cli-install__macos__commands">
|
||||
<p class="cli-install__macos__commands__item">
|
||||
curl -L https://github.com/storj/storj/releases/latest/download/uplink_darwin_amd64.zip -o uplink_darwin_amd64.zip
|
||||
</p>
|
||||
<p class="cli-install__macos__commands__item">
|
||||
unzip -o uplink_darwin_amd64.zip
|
||||
</p>
|
||||
<p class="cli-install__macos__commands__item">
|
||||
chmod 755 uplink
|
||||
</p>
|
||||
<p class="cli-install__macos__commands__item">
|
||||
sudo mv uplink /usr/local/bin/uplink
|
||||
</p>
|
||||
</div>
|
||||
<a class="cli-install__macos__link" href="https://github.com/storj/storj/releases/latest/download/uplink_darwin_amd64.zip">
|
||||
macOS Uplink Binary
|
||||
</a>
|
||||
</div>
|
||||
</template>
|
||||
</OSContainer>
|
||||
</template>
|
||||
</CLIFlowContainer>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { Component, Vue } from 'vue-property-decorator';
|
||||
|
||||
import { RouteConfig } from "@/router";
|
||||
|
||||
import CLIFlowContainer from "@/components/onboardingTour/steps/common/CLIFlowContainer.vue";
|
||||
import OSContainer from "@/components/onboardingTour/steps/common/OSContainer.vue";
|
||||
|
||||
import Icon from '@/../static/images/onboardingTour/cliSetupStep.svg';
|
||||
|
||||
// @vue/component
|
||||
@Component
|
||||
export default class CLIInstall extends Vue {}
|
||||
@Component({
|
||||
components: {
|
||||
CLIFlowContainer,
|
||||
Icon,
|
||||
OSContainer,
|
||||
}
|
||||
})
|
||||
export default class CLIInstall extends Vue {
|
||||
/**
|
||||
* Holds on back button click logic.
|
||||
*/
|
||||
public async onBackClick(): Promise<void> {
|
||||
await this.$router.push(RouteConfig.OnboardingTour.with(RouteConfig.OnbCLIStep.with(RouteConfig.GeneratedAG)).path);
|
||||
}
|
||||
|
||||
/**
|
||||
* Holds on next button click logic.
|
||||
*/
|
||||
public async onNextClick(): Promise<void> {
|
||||
await this.$router.push(RouteConfig.OnboardingTour.with(RouteConfig.OnbCLIStep.with(RouteConfig.ImportAG)).path);
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.cli-install {
|
||||
font-family: 'font_regular', sans-serif;
|
||||
|
||||
&__msg {
|
||||
font-size: 18px;
|
||||
line-height: 32px;
|
||||
letter-spacing: 0.15px;
|
||||
color: #4e4b66;
|
||||
}
|
||||
|
||||
&__macos,
|
||||
&__linux,
|
||||
&__windows {
|
||||
border: 1px solid rgb(230, 236, 241);
|
||||
display: block;
|
||||
padding: 24px;
|
||||
background: rgb(255, 255, 255);
|
||||
border-radius: 0 6px 6px;
|
||||
|
||||
&__title {
|
||||
font-size: 20px;
|
||||
margin-bottom: 24px;
|
||||
}
|
||||
|
||||
&__sub-title {
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
&__title,
|
||||
&__sub-title {
|
||||
line-height: 1.5;
|
||||
font-family: 'font_medium', sans-serif;
|
||||
}
|
||||
|
||||
&__commands {
|
||||
color: rgb(230, 236, 241);
|
||||
margin: 32px 0;
|
||||
padding: 24px;
|
||||
overflow: auto;
|
||||
font-size: 14px;
|
||||
background: rgb(24, 48, 85);
|
||||
|
||||
&__item {
|
||||
white-space: nowrap;
|
||||
}
|
||||
}
|
||||
|
||||
&__link {
|
||||
color: rgb(55, 111, 255);
|
||||
}
|
||||
|
||||
&__msg {
|
||||
font-size: 15px;
|
||||
line-height: 1.625;
|
||||
margin-top: 20px;
|
||||
|
||||
&__bold {
|
||||
font-family: 'font_medium', sans-serif;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.margin-top {
|
||||
margin-top: 24px;
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -36,12 +36,13 @@
|
||||
<script lang="ts">
|
||||
import { Component, Vue } from 'vue-property-decorator';
|
||||
|
||||
import { RouteConfig } from "@/router";
|
||||
|
||||
import CLIFlowContainer from "@/components/onboardingTour/steps/common/CLIFlowContainer.vue";
|
||||
import OSContainer from "@/components/onboardingTour/steps/common/OSContainer.vue";
|
||||
import TabWithCopy from "@/components/onboardingTour/steps/common/TabWithCopy.vue";
|
||||
|
||||
import Icon from '@/../static/images/onboardingTour/generateAGStep.svg';
|
||||
import {RouteConfig} from "@/router";
|
||||
|
||||
// @vue/component
|
||||
@Component({
|
||||
|
||||
@ -2,13 +2,158 @@
|
||||
// See LICENSE for copying information.
|
||||
|
||||
<template>
|
||||
<div class="generated" />
|
||||
<CLIFlowContainer
|
||||
:on-back-click="onBackClick"
|
||||
:on-next-click="onNextClick"
|
||||
title="Access Grant Generated"
|
||||
>
|
||||
<template #icon>
|
||||
<Icon />
|
||||
</template>
|
||||
<template #content class="generated">
|
||||
<p class="generated__msg">
|
||||
Your first access grant is created. Now copy and save the Access Grant, as it will only appear once.
|
||||
</p>
|
||||
<div class="generated__download">
|
||||
<p class="generated__download__label" @click="onDownloadClick">Download as a text file</p>
|
||||
<VInfo
|
||||
class="generated__download__info-button"
|
||||
title="Download the access grant"
|
||||
text="This will make a text file with the access grant, so that you can easily import it later into the Uplink CLI."
|
||||
>
|
||||
<InfoIcon class="generated__download__info-button__image" />
|
||||
</VInfo>
|
||||
</div>
|
||||
<h3 class="generated__label">Access Grant</h3>
|
||||
<ValueWithCopy label="Access Grant" :value="accessGrant" />
|
||||
</template>
|
||||
</CLIFlowContainer>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { Component, Vue } from 'vue-property-decorator';
|
||||
|
||||
import { RouteConfig } from "@/router";
|
||||
import { Download } from "@/utils/download";
|
||||
|
||||
import CLIFlowContainer from "@/components/onboardingTour/steps/common/CLIFlowContainer.vue";
|
||||
import ValueWithCopy from "@/components/onboardingTour/steps/common/ValueWithCopy.vue";
|
||||
import VInfo from "@/components/common/VInfo.vue";
|
||||
|
||||
import Icon from "@/../static/images/onboardingTour/generatedStep.svg";
|
||||
import InfoIcon from "@/../static/images/common/greyInfo.svg";
|
||||
|
||||
// @vue/component
|
||||
@Component
|
||||
export default class GeneratedAG extends Vue {}
|
||||
@Component({
|
||||
components: {
|
||||
Icon,
|
||||
CLIFlowContainer,
|
||||
ValueWithCopy,
|
||||
VInfo,
|
||||
InfoIcon,
|
||||
}
|
||||
})
|
||||
export default class GeneratedAG extends Vue {
|
||||
/**
|
||||
* Lifecycle hook before initial render.
|
||||
* Redirects to encrypt your data step if there is no AG to show.
|
||||
*/
|
||||
public async beforeMount(): Promise<void> {
|
||||
if (!this.accessGrant) {
|
||||
await this.onBackClick();
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Holds on back button click logic.
|
||||
*/
|
||||
public async onBackClick(): Promise<void> {
|
||||
await this.$router.push(RouteConfig.OnboardingTour.with(RouteConfig.OnbCLIStep.with(RouteConfig.EncryptYourData)).path);
|
||||
}
|
||||
|
||||
/**
|
||||
* Holds on next button click logic.
|
||||
*/
|
||||
public async onNextClick(): Promise<void> {
|
||||
await this.$router.push(RouteConfig.OnboardingTour.with(RouteConfig.OnbCLIStep.with(RouteConfig.CLIInstall)).path);
|
||||
}
|
||||
|
||||
/**
|
||||
* Holds on download access grant button click logic.
|
||||
* Downloads a file with the access called access-grant-<timestamp>.key
|
||||
*/
|
||||
public onDownloadClick(): void {
|
||||
const ts = new Date();
|
||||
const filename = 'access-grant-' + ts.toJSON() + '.txt';
|
||||
|
||||
Download.file(this.accessGrant, filename);
|
||||
|
||||
this.$notify.success('Access Grant was downloaded successfully');
|
||||
}
|
||||
|
||||
/**
|
||||
* Returns AG from store.
|
||||
*/
|
||||
public get accessGrant(): string {
|
||||
return this.$store.state.accessGrantsModule.onboardingAccessGrant;
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.generated {
|
||||
font-family: 'font_regular', sans-serif;
|
||||
|
||||
&__msg {
|
||||
font-size: 18px;
|
||||
line-height: 32px;
|
||||
letter-spacing: 0.15px;
|
||||
color: #4e4b66;
|
||||
}
|
||||
|
||||
&__label {
|
||||
font-family: 'font_bold', sans-serif;
|
||||
font-size: 16px;
|
||||
line-height: 21px;
|
||||
color: #354049;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
&__download {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-end;
|
||||
margin-top: 20px;
|
||||
|
||||
&__label {
|
||||
font-family: 'font_medium', sans-serif;
|
||||
font-size: 16px;
|
||||
line-height: 19px;
|
||||
color: #0068dc;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
&__info-button {
|
||||
margin-left: 10px;
|
||||
max-height: 18px;
|
||||
|
||||
&__image {
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
::v-deep .info__box__message {
|
||||
min-width: 345px;
|
||||
|
||||
&__title {
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
|
||||
&__regular-text {
|
||||
font-size: 12px;
|
||||
line-height: 21px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -2,13 +2,79 @@
|
||||
// See LICENSE for copying information.
|
||||
|
||||
<template>
|
||||
<div class="import" />
|
||||
<CLIFlowContainer
|
||||
:on-back-click="onBackClick"
|
||||
:on-next-click="onNextClick"
|
||||
title="Import Your Access Grant"
|
||||
>
|
||||
<template #icon>
|
||||
<Icon />
|
||||
</template>
|
||||
<template #content class="import">
|
||||
<p class="import__msg">
|
||||
To import the Access Grant that you created earlier, it needs to be saved in a plain text file.
|
||||
</p>
|
||||
<OSContainer>
|
||||
<template #windows>
|
||||
<TabWithCopy value="./uplink.exe import <file_name>.txt" />
|
||||
</template>
|
||||
<template #linux>
|
||||
<TabWithCopy value="uplink import <file_name>.txt" />
|
||||
</template>
|
||||
<template #macos>
|
||||
<TabWithCopy value="uplink import <file_name>.txt" />
|
||||
</template>
|
||||
</OSContainer>
|
||||
</template>
|
||||
</CLIFlowContainer>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { Component, Vue } from 'vue-property-decorator';
|
||||
|
||||
import { RouteConfig } from "@/router";
|
||||
|
||||
import CLIFlowContainer from "@/components/onboardingTour/steps/common/CLIFlowContainer.vue";
|
||||
import OSContainer from "@/components/onboardingTour/steps/common/OSContainer.vue";
|
||||
import TabWithCopy from "@/components/onboardingTour/steps/common/TabWithCopy.vue";
|
||||
|
||||
import Icon from '@/../static/images/onboardingTour/importStep.svg';
|
||||
|
||||
// @vue/component
|
||||
@Component
|
||||
export default class ImportAG extends Vue {}
|
||||
@Component({
|
||||
components: {
|
||||
CLIFlowContainer,
|
||||
Icon,
|
||||
OSContainer,
|
||||
TabWithCopy,
|
||||
}
|
||||
})
|
||||
export default class ImportAG extends Vue {
|
||||
/**
|
||||
* Holds on back button click logic.
|
||||
*/
|
||||
public async onBackClick(): Promise<void> {
|
||||
await this.$router.push(RouteConfig.OnboardingTour.with(RouteConfig.OnbCLIStep.with(RouteConfig.CLIInstall)).path);
|
||||
}
|
||||
|
||||
/**
|
||||
* Holds on next button click logic.
|
||||
*/
|
||||
public async onNextClick(): Promise<void> {
|
||||
await this.$router.push(RouteConfig.OnboardingTour.with(RouteConfig.OnbCLIStep.with(RouteConfig.CreateBucket)).path);
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.import {
|
||||
font-family: 'font_regular', sans-serif;
|
||||
|
||||
&__msg {
|
||||
font-size: 18px;
|
||||
line-height: 32px;
|
||||
letter-spacing: 0.15px;
|
||||
color: #4e4b66;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -9,14 +9,14 @@
|
||||
<div class="flow-container__buttons">
|
||||
<VButton
|
||||
class="flow-container__buttons__back"
|
||||
label="< Back>"
|
||||
label="< Back"
|
||||
height="64px"
|
||||
border-radius="52px"
|
||||
is-grey-blue="true"
|
||||
:on-press="onBackClick"
|
||||
/>
|
||||
<VButton
|
||||
label="Next >>"
|
||||
label="Next >"
|
||||
height="64px"
|
||||
border-radius="52px"
|
||||
:on-press="onNextClick"
|
||||
|
||||
@ -4,9 +4,15 @@
|
||||
<template>
|
||||
<div class="os">
|
||||
<div class="os__tabs">
|
||||
<p class="os__tabs__choice" :class="{active: isWindows}" @click="setIsWindows">Windows</p>
|
||||
<p class="os__tabs__choice" :class="{active: isLinux}" @click="setIsLinux">Linux</p>
|
||||
<p class="os__tabs__choice" :class="{active: isMacOS}" @click="setIsMacOS">macOS</p>
|
||||
<p class="os__tabs__choice" :class="{active: isWindows && !isInstallStep, 'active-install-step': isWindows && isInstallStep}" @click="setIsWindows">
|
||||
Windows
|
||||
</p>
|
||||
<p class="os__tabs__choice" :class="{active: isLinux && !isInstallStep, 'active-install-step': isLinux && isInstallStep}" @click="setIsLinux">
|
||||
Linux
|
||||
</p>
|
||||
<p class="os__tabs__choice" :class="{active: isMacOS && !isInstallStep, 'active-install-step': isMacOS && isInstallStep}" @click="setIsMacOS">
|
||||
macOS
|
||||
</p>
|
||||
</div>
|
||||
<slot v-if="isWindows" name="windows" />
|
||||
<slot v-if="isLinux" name="linux" />
|
||||
@ -15,11 +21,14 @@
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { Component, Vue } from 'vue-property-decorator';
|
||||
import { Component, Prop, Vue } from 'vue-property-decorator';
|
||||
|
||||
// @vue/component
|
||||
@Component
|
||||
export default class OSContainer extends Vue {
|
||||
@Prop({ default: false })
|
||||
public readonly isInstallStep: boolean;
|
||||
|
||||
public isWindows = false;
|
||||
public isLinux = false;
|
||||
public isMacOS = false;
|
||||
@ -82,6 +91,7 @@ export default class OSContainer extends Vue {
|
||||
border-top: 1px solid rgb(230, 236, 241);
|
||||
border-left: 1px solid rgb(230, 236, 241);
|
||||
border-right: 1px solid rgb(230, 236, 241);
|
||||
margin-bottom: -1px;
|
||||
|
||||
&__choice {
|
||||
background-color: #f5f7f9;
|
||||
@ -105,4 +115,9 @@ export default class OSContainer extends Vue {
|
||||
background: rgb(24, 48, 85);
|
||||
color: #e6ecf1;
|
||||
}
|
||||
|
||||
.active-install-step {
|
||||
background: #fff;
|
||||
color: #242a31;
|
||||
}
|
||||
</style>
|
||||
|
||||
12
web/satellite/static/images/onboardingTour/generatedStep.svg
Normal file
12
web/satellite/static/images/onboardingTour/generatedStep.svg
Normal file
@ -0,0 +1,12 @@
|
||||
<svg width="91" height="108" viewBox="0 0 91 108" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M27.2515 30.8379L47.1303 50.7166V97.8125H0V30.8379L27.2515 30.8379Z" fill="#0149FF"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M27.2555 50.7168L27.2555 30.838L47.1343 50.7168L27.2555 50.7168Z" fill="#00127F"/>
|
||||
<path d="M72.2774 16.7515L81.1709 25.645L90.0644 16.7515L81.1709 7.85803L72.2774 16.7515Z" fill="#FFC600"/>
|
||||
<path d="M50.1523 27.2377V34.9238H57.8385V27.2377H50.1523Z" fill="#00E567"/>
|
||||
<path d="M30.7741 6.86976L36.209 12.3047L41.6439 6.86976L36.209 1.43483L30.7741 6.86976Z" fill="#FF458B"/>
|
||||
<path d="M14 17.2704V22.1616H18.8912V17.2704H14Z" fill="#0149FF"/>
|
||||
<circle cx="47" cy="89.25" r="18" fill="#00D459"/>
|
||||
<path d="M38.0467 90.6089C37.1637 89.726 37.1637 88.2945 38.0467 87.4116C38.9296 86.5287 40.3611 86.5287 41.244 87.4116L46.5729 92.7405C47.4559 93.6234 47.4559 95.0549 46.5729 95.9378C45.69 96.8208 44.2585 96.8208 43.3756 95.9378L38.0467 90.6089Z" fill="white"/>
|
||||
<path d="M46.5729 95.9378C45.69 96.8208 44.2585 96.8208 43.3756 95.9378C42.4927 95.0549 42.4927 93.6234 43.3756 92.7405L52.9676 83.1484C53.8506 82.2655 55.2821 82.2655 56.165 83.1484C57.0479 84.0314 57.0479 85.4629 56.165 86.3458L46.5729 95.9378Z" fill="white"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M37.9984 64.8363L35.1154 67.5134L33.8295 66.2778L32.4777 67.5134L30.7435 66.2778L29.5201 67.5134L28.2608 66.2778L26.7257 67.5134L24.0972 67.5132L22.0154 71.1187C21.6475 71.7558 20.9677 72.1483 20.232 72.1483H14.1667C13.4309 72.1483 12.7511 71.7558 12.3832 71.1187L9.35059 65.866C8.98273 65.2288 8.98273 64.4438 9.35059 63.8067L12.3832 58.5539C12.7511 57.9168 13.4309 57.5243 14.1667 57.5243L20.232 57.5243C20.9677 57.5243 21.6475 57.9168 22.0154 58.554L24.0972 62.159L35.1154 62.1592L37.9984 64.8363ZM16.9934 64.8363C16.9934 63.5853 15.9792 62.5711 14.7281 62.5711C13.4771 62.5711 12.4629 63.5853 12.4629 64.8363C12.4629 66.0874 13.4771 67.1016 14.7281 67.1016C15.9792 67.1016 16.9934 66.0874 16.9934 64.8363Z" fill="white"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 2.1 KiB |
19
web/satellite/static/images/onboardingTour/importStep.svg
Normal file
19
web/satellite/static/images/onboardingTour/importStep.svg
Normal file
@ -0,0 +1,19 @@
|
||||
<svg width="91" height="109" viewBox="0 0 91 109" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M27.2515 31.0005L47.1303 50.8792V97.9751H0V31.0005L27.2515 31.0005Z" fill="#0149FF"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M27.2555 50.8794L27.2555 31.0006L47.1343 50.8794L27.2555 50.8794Z" fill="#00127F"/>
|
||||
<g clip-path="url(#clip0)">
|
||||
<path d="M72.2774 16.9141L81.1709 25.8076L90.0644 16.9141L81.1709 8.02063L72.2774 16.9141Z" fill="#FFC600"/>
|
||||
<path d="M50.1523 27.4003V35.0864H57.8385V27.4003H50.1523Z" fill="#00E567"/>
|
||||
<path d="M30.7741 7.03236L36.209 12.4673L41.6439 7.03236L36.209 1.59743L30.7741 7.03236Z" fill="#FF458B"/>
|
||||
<path d="M14 17.433V22.3242H18.8912V17.433H14Z" fill="#0149FF"/>
|
||||
</g>
|
||||
<circle cx="47.2857" cy="89.8018" r="18.2857" fill="#D9E0EE"/>
|
||||
<path d="M45.6001 84.2007L39.6001 90.2007L45.6001 96.2007" stroke="#00127F" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M39.6 90.2007L54 90.2007" stroke="#00127F" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M37.9984 64.9989L35.1154 67.676L33.8295 66.4404L32.4777 67.676L30.7435 66.4404L29.5201 67.676L28.2608 66.4404L26.7257 67.676L24.0972 67.6758L22.0154 71.2813C21.6475 71.9184 20.9677 72.3109 20.232 72.3109H14.1667C13.4309 72.3109 12.7511 71.9184 12.3832 71.2813L9.35059 66.0286C8.98273 65.3914 8.98273 64.6064 9.35059 63.9693L12.3832 58.7165C12.7511 58.0794 13.4309 57.6869 14.1667 57.6869L20.232 57.6869C20.9677 57.6869 21.6475 58.0794 22.0154 58.7165L24.0972 62.3216L35.1154 62.3218L37.9984 64.9989ZM16.9934 64.9989C16.9934 63.7479 15.9792 62.7337 14.7281 62.7337C13.4771 62.7337 12.4629 63.7479 12.4629 64.9989C12.4629 66.25 13.4771 67.2642 14.7281 67.2642C15.9792 67.2642 16.9934 66.25 16.9934 64.9989Z" fill="white"/>
|
||||
<defs>
|
||||
<clipPath id="clip0">
|
||||
<rect width="77" height="35" fill="white" transform="translate(14 0.912598)"/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 2.0 KiB |
Loading…
Reference in New Issue
Block a user