web/satellite: links and dropdowns for new navigation sidebar
Added nav links, resources and quick start dropdowns. Change-Id: I12f2afddd899621749bb00d0fed58f84a45701a3
This commit is contained in:
Vitalii Shpital
parent
b619ce6913
commit
0aab339d0d
@ -0,0 +1,58 @@
|
||||
// Copyright (C) 2021 Storj Labs, Inc.
|
||||
// See LICENSE for copying information.
|
||||
|
||||
<template>
|
||||
<div ref="dropdown" v-click-outside="close" class="side-dropdown" :style="style">
|
||||
<slot />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { Component, Prop, Vue } from 'vue-property-decorator';
|
||||
|
||||
// @vue/component
|
||||
@Component
|
||||
export default class GuidesDropdown extends Vue {
|
||||
@Prop({default: 0})
|
||||
private readonly yPosition: number;
|
||||
@Prop({default: 0})
|
||||
private readonly xPosition: number;
|
||||
@Prop({default: () => []})
|
||||
private readonly close: () => void;
|
||||
|
||||
private dropdownMiddle = 0;
|
||||
|
||||
/**
|
||||
* Mounted hook after initial render.
|
||||
* Calculates dropdowns Y middle point.
|
||||
*/
|
||||
public mounted(): void {
|
||||
this.dropdownMiddle = this.$refs.dropdown.getBoundingClientRect().height / 2;
|
||||
}
|
||||
|
||||
public $refs!: {
|
||||
dropdown: HTMLDivElement;
|
||||
}
|
||||
|
||||
/**
|
||||
* Returns top and left position of dropdown.
|
||||
*/
|
||||
public get style(): Record<string, string> {
|
||||
return { top: `${this.yPosition - this.dropdownMiddle}px`, left: `${this.xPosition}px` };
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.side-dropdown {
|
||||
position: absolute;
|
||||
background: #fff;
|
||||
border: 1px solid #f4f5f7;
|
||||
box-shadow: 0 0 32px rgba(0, 0, 0, 0.04);
|
||||
border-radius: 8px;
|
||||
padding: 14px 0;
|
||||
width: 390px;
|
||||
z-index: 1;
|
||||
cursor: default;
|
||||
}
|
||||
</style>
|
||||
@ -3,22 +3,132 @@
|
||||
|
||||
<template>
|
||||
<div v-if="!isNavigationHidden" class="navigation-area">
|
||||
<LogoIcon class="navigation-area__logo" @click.stop="onLogoClick" />
|
||||
<div class="navigation-area__edit">
|
||||
<NewProjectSelection />
|
||||
</div>
|
||||
<router-link
|
||||
v-for="navItem in navigation"
|
||||
:key="navItem.name"
|
||||
:aria-label="navItem.name"
|
||||
class="navigation-area__item-container"
|
||||
:to="navItem.path"
|
||||
>
|
||||
<div class="navigation-area__item-container__link">
|
||||
<component :is="navItem.icon" class="navigation-area__item-container__link__icon" />
|
||||
<p class="navigation-area__item-container__link__title">{{ navItem.name }}</p>
|
||||
<div class="navigation-area__wrap">
|
||||
<LogoIcon class="navigation-area__wrap__logo" @click.stop="onLogoClick" />
|
||||
<div class="navigation-area__wrap__edit">
|
||||
<NewProjectSelection />
|
||||
</div>
|
||||
</router-link>
|
||||
<router-link
|
||||
v-for="navItem in navigation"
|
||||
:key="navItem.name"
|
||||
:aria-label="navItem.name"
|
||||
class="navigation-area__wrap__item-container"
|
||||
:to="navItem.path"
|
||||
>
|
||||
<div class="navigation-area__wrap__item-container__left">
|
||||
<component :is="navItem.icon" class="navigation-area__wrap__item-container__left__image" />
|
||||
<p class="navigation-area__wrap__item-container__left__label">{{ navItem.name }}</p>
|
||||
</div>
|
||||
</router-link>
|
||||
<div class="navigation-area__wrap__border" />
|
||||
<div
|
||||
ref="resourcesContainer"
|
||||
class="navigation-area__wrap__item-container"
|
||||
:class="{ active: isResourcesDropdownShown }"
|
||||
@click.stop="toggleResourcesDropdown"
|
||||
>
|
||||
<div class="navigation-area__wrap__item-container__left">
|
||||
<ResourcesIcon class="navigation-area__wrap__item-container__left__image" />
|
||||
<p class="navigation-area__wrap__item-container__left__label">Resources</p>
|
||||
</div>
|
||||
<ArrowIcon />
|
||||
<GuidesDropdown
|
||||
v-if="isResourcesDropdownShown"
|
||||
:close="closeDropdowns"
|
||||
:y-position="resourcesDropdownYPos"
|
||||
:x-position="resourcesDropdownXPos"
|
||||
>
|
||||
<a
|
||||
class="dropdown-item"
|
||||
href="https://docs.storj.io/"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
>
|
||||
<DocsIcon class="dropdown-item__icon" />
|
||||
<div class="dropdown-item__text">
|
||||
<h2 class="dropdown-item__text__title">Docs</h2>
|
||||
<p class="dropdown-item__text__label">Documentation for Storj</p>
|
||||
</div>
|
||||
</a>
|
||||
<div class="dropdown-border" />
|
||||
<a
|
||||
class="dropdown-item"
|
||||
href="https://forum.storj.io/"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
>
|
||||
<ForumIcon class="dropdown-item__icon" />
|
||||
<div class="dropdown-item__text">
|
||||
<h2 class="dropdown-item__text__title">Forum</h2>
|
||||
<p class="dropdown-item__text__label">Join our global community</p>
|
||||
</div>
|
||||
</a>
|
||||
<div class="dropdown-border" />
|
||||
<a
|
||||
class="dropdown-item"
|
||||
href="https://supportdcs.storj.io/hc/en-us"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
>
|
||||
<SupportIcon class="dropdown-item__icon" />
|
||||
<div class="dropdown-item__text">
|
||||
<h2 class="dropdown-item__text__title">Support</h2>
|
||||
<p class="dropdown-item__text__label">Get technical support</p>
|
||||
</div>
|
||||
</a>
|
||||
</GuidesDropdown>
|
||||
</div>
|
||||
<div
|
||||
ref="quickStartContainer"
|
||||
class="navigation-area__wrap__item-container"
|
||||
:class="{ active: isQuickStartDropdownShown }"
|
||||
@click.stop="toggleQuickStartDropdown"
|
||||
>
|
||||
<div class="navigation-area__wrap__item-container__left">
|
||||
<QuickStartIcon class="navigation-area__wrap__item-container__left__image" />
|
||||
<p class="navigation-area__wrap__item-container__left__label">Quick Start</p>
|
||||
</div>
|
||||
<ArrowIcon />
|
||||
<GuidesDropdown
|
||||
v-if="isQuickStartDropdownShown"
|
||||
:close="closeDropdowns"
|
||||
:y-position="quickStartDropdownYPos"
|
||||
:x-position="quickStartDropdownXPos"
|
||||
>
|
||||
<router-link class="dropdown-item" :to="newProjectRoute">
|
||||
<NewProjectIcon class="dropdown-item__icon" />
|
||||
<div class="dropdown-item__text">
|
||||
<h2 class="dropdown-item__text__title">New Project</h2>
|
||||
<p class="dropdown-item__text__label">Create a new project.</p>
|
||||
</div>
|
||||
</router-link>
|
||||
<div class="dropdown-border" />
|
||||
<router-link class="dropdown-item" :to="createAGRoute">
|
||||
<CreateAGIcon class="dropdown-item__icon" />
|
||||
<div class="dropdown-item__text">
|
||||
<h2 class="dropdown-item__text__title">Create an Access Grant</h2>
|
||||
<p class="dropdown-item__text__label">Start the wizard to create a new access grant.</p>
|
||||
</div>
|
||||
</router-link>
|
||||
<div class="dropdown-border" />
|
||||
<router-link class="dropdown-item" :to="objectsRoute">
|
||||
<UploadInWebIcon class="dropdown-item__icon" />
|
||||
<div class="dropdown-item__text">
|
||||
<h2 class="dropdown-item__text__title">Upload in Web</h2>
|
||||
<p class="dropdown-item__text__label">Start uploading files in the web browser.</p>
|
||||
</div>
|
||||
</router-link>
|
||||
<div class="dropdown-border" />
|
||||
<router-link class="dropdown-item" :to="cliFlowRoute">
|
||||
<UploadInCLIIcon class="dropdown-item__icon" />
|
||||
<div class="dropdown-item__text">
|
||||
<h2 class="dropdown-item__text__title">Upload using CLI</h2>
|
||||
<p class="dropdown-item__text__label">Start guide for using the Uplink CLI.</p>
|
||||
</div>
|
||||
</router-link>
|
||||
</GuidesDropdown>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@ -26,35 +136,73 @@
|
||||
import { Component, Vue } from 'vue-property-decorator';
|
||||
|
||||
import NewProjectSelection from '@/components/navigation/newNavigationStructure/NewProjectSelection.vue';
|
||||
|
||||
import LogoIcon from '@/../static/images/logo.svg';
|
||||
import AccessGrantsIcon from '@/../static/images/navigation/apiKeys.svg';
|
||||
import DashboardIcon from '@/../static/images/navigation/dashboard.svg';
|
||||
import ObjectsIcon from '@/../static/images/navigation/objects.svg';
|
||||
import TeamIcon from '@/../static/images/navigation/team.svg';
|
||||
import GuidesDropdown from '@/components/navigation/newNavigationStructure/GuidesDropdown.vue';
|
||||
|
||||
import { RouteConfig } from '@/router';
|
||||
import { NavigationLink } from '@/types/navigation';
|
||||
import { APP_STATE_ACTIONS } from "@/utils/constants/actionNames";
|
||||
|
||||
import LogoIcon from '@/../static/images/logo.svg';
|
||||
import AccessGrantsIcon from '@/../static/images/navigation/accessGrants.svg';
|
||||
import DashboardIcon from '@/../static/images/navigation/projectDashboard.svg';
|
||||
import BucketsIcon from '@/../static/images/navigation/buckets.svg';
|
||||
import UsersIcon from '@/../static/images/navigation/users.svg';
|
||||
import ResourcesIcon from '@/../static/images/navigation/resources.svg';
|
||||
import QuickStartIcon from '@/../static/images/navigation/quickStart.svg';
|
||||
import ArrowIcon from '@/../static/images/navigation/arrowExpandRight.svg';
|
||||
import DocsIcon from '@/../static/images/navigation/docs.svg';
|
||||
import ForumIcon from '@/../static/images/navigation/forum.svg';
|
||||
import SupportIcon from '@/../static/images/navigation/support.svg';
|
||||
import NewProjectIcon from '@/../static/images/navigation/newProject.svg';
|
||||
import CreateAGIcon from '@/../static/images/navigation/createAccessGrant.svg';
|
||||
import UploadInCLIIcon from '@/../static/images/navigation/uploadInCLI.svg';
|
||||
import UploadInWebIcon from '@/../static/images/navigation/uploadInWeb.svg';
|
||||
|
||||
// @vue/component
|
||||
@Component({
|
||||
components: {
|
||||
NewProjectSelection,
|
||||
GuidesDropdown,
|
||||
LogoIcon,
|
||||
DashboardIcon,
|
||||
AccessGrantsIcon,
|
||||
TeamIcon,
|
||||
ObjectsIcon,
|
||||
UsersIcon,
|
||||
BucketsIcon,
|
||||
ResourcesIcon,
|
||||
QuickStartIcon,
|
||||
ArrowIcon,
|
||||
DocsIcon,
|
||||
ForumIcon,
|
||||
SupportIcon,
|
||||
NewProjectIcon,
|
||||
CreateAGIcon,
|
||||
UploadInCLIIcon,
|
||||
UploadInWebIcon,
|
||||
},
|
||||
})
|
||||
export default class NewNavigationArea extends Vue {
|
||||
private readonly TWENTY_PIXELS = 20;
|
||||
public readonly newProjectRoute = RouteConfig.CreateProject.path;
|
||||
public readonly createAGRoute = RouteConfig.AccessGrants.with(RouteConfig.CreateAccessGrant).path;
|
||||
public readonly objectsRoute = RouteConfig.Objects.path;
|
||||
public readonly cliFlowRoute = RouteConfig.OnboardingTour.with(RouteConfig.CLIStep.with(RouteConfig.APIKey)).path;
|
||||
|
||||
public resourcesDropdownYPos = 0;
|
||||
public resourcesDropdownXPos = 0;
|
||||
public quickStartDropdownYPos = 0;
|
||||
public quickStartDropdownXPos = 0;
|
||||
public navigation: NavigationLink[] = [
|
||||
RouteConfig.ProjectDashboard.withIcon(DashboardIcon),
|
||||
RouteConfig.Objects.withIcon(ObjectsIcon),
|
||||
RouteConfig.Objects.withIcon(BucketsIcon),
|
||||
RouteConfig.AccessGrants.withIcon(AccessGrantsIcon),
|
||||
RouteConfig.Users.withIcon(TeamIcon),
|
||||
RouteConfig.Users.withIcon(UsersIcon),
|
||||
];
|
||||
|
||||
public $refs!: {
|
||||
resourcesContainer: HTMLDivElement;
|
||||
quickStartContainer: HTMLDivElement;
|
||||
};
|
||||
|
||||
/**
|
||||
* Reloads page.
|
||||
*/
|
||||
@ -62,6 +210,79 @@ export default class NewNavigationArea extends Vue {
|
||||
location.reload();
|
||||
}
|
||||
|
||||
/**
|
||||
* Sets resources dropdown Y position depending on container's current position.
|
||||
* It is used to handle small screens.
|
||||
*/
|
||||
public setResourcesDropdownYPos(): void {
|
||||
const container = this.$refs.resourcesContainer.getBoundingClientRect();
|
||||
this.resourcesDropdownYPos = container.top + container.height / 2;
|
||||
}
|
||||
|
||||
/**
|
||||
* Sets resources dropdown X position depending on container's current position.
|
||||
* It is used to handle small screens.
|
||||
*/
|
||||
public setResourcesDropdownXPos(): void {
|
||||
this.resourcesDropdownXPos = this.$refs.resourcesContainer.getBoundingClientRect().width - this.TWENTY_PIXELS;
|
||||
}
|
||||
|
||||
/**
|
||||
* Sets quick start dropdown Y position depending on container's current position.
|
||||
* It is used to handle small screens.
|
||||
*/
|
||||
public setQuickStartDropdownYPos(): void {
|
||||
const container = this.$refs.quickStartContainer.getBoundingClientRect();
|
||||
this.quickStartDropdownYPos = container.top + container.height / 2;
|
||||
}
|
||||
|
||||
/**
|
||||
* Sets quick start dropdown X position depending on container's current position.
|
||||
* It is used to handle small screens.
|
||||
*/
|
||||
public setQuickStartDropdownXPos(): void {
|
||||
this.quickStartDropdownXPos = this.$refs.quickStartContainer.getBoundingClientRect().width - this.TWENTY_PIXELS;
|
||||
}
|
||||
|
||||
/**
|
||||
* Toggles resources dropdown visibility.
|
||||
*/
|
||||
public toggleResourcesDropdown(): void {
|
||||
this.setResourcesDropdownYPos()
|
||||
this.setResourcesDropdownXPos()
|
||||
this.$store.dispatch(APP_STATE_ACTIONS.TOGGLE_RESOURCES_DROPDOWN);
|
||||
}
|
||||
|
||||
/**
|
||||
* Toggles quick start dropdown visibility.
|
||||
*/
|
||||
public toggleQuickStartDropdown(): void {
|
||||
this.setQuickStartDropdownYPos()
|
||||
this.setQuickStartDropdownXPos()
|
||||
this.$store.dispatch(APP_STATE_ACTIONS.TOGGLE_QUICK_START_DROPDOWN);
|
||||
}
|
||||
|
||||
/**
|
||||
* Closes dropdowns.
|
||||
*/
|
||||
public closeDropdowns(): void {
|
||||
this.$store.dispatch(APP_STATE_ACTIONS.CLOSE_POPUPS);
|
||||
}
|
||||
|
||||
/**
|
||||
* Indicates if resources dropdown shown.
|
||||
*/
|
||||
public get isResourcesDropdownShown(): boolean {
|
||||
return this.$store.state.appStateModule.appState.isResourcesDropdownShown;
|
||||
}
|
||||
|
||||
/**
|
||||
* Indicates if quick start dropdown shown.
|
||||
*/
|
||||
public get isQuickStartDropdownShown(): boolean {
|
||||
return this.$store.state.appStateModule.appState.isQuickStartDropdownShown;
|
||||
}
|
||||
|
||||
/**
|
||||
* Indicates if navigation side bar is hidden.
|
||||
*/
|
||||
@ -92,68 +313,124 @@ export default class NewNavigationArea extends Vue {
|
||||
}
|
||||
|
||||
.navigation-area {
|
||||
padding: 40px 0 32px 0;
|
||||
min-width: 280px;
|
||||
max-width: 280px;
|
||||
background-color: #fff;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
font-family: 'font_regular', sans-serif;
|
||||
overflow-y: auto;
|
||||
|
||||
&__logo {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
&__edit {
|
||||
padding: 0 20px;
|
||||
margin: 32px 0;
|
||||
width: calc(100% - 40px);
|
||||
}
|
||||
|
||||
&__item-container {
|
||||
padding: 10px;
|
||||
width: calc(100% - 20px);
|
||||
&__wrap {
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
margin-bottom: 40px;
|
||||
text-decoration: none;
|
||||
overflow-x: hidden;
|
||||
overflow-y: auto;
|
||||
width: 100%;
|
||||
max-height: calc(100% - 72px);
|
||||
padding: 40px 0 32px 0;
|
||||
|
||||
&__link {
|
||||
&__logo {
|
||||
cursor: pointer;
|
||||
min-height: 37px;
|
||||
}
|
||||
|
||||
&__edit {
|
||||
padding: 0 20px;
|
||||
margin: 32px 0;
|
||||
width: calc(100% - 40px);
|
||||
}
|
||||
|
||||
&__item-container {
|
||||
padding: 22px 32px;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
border-left: 4px solid #fff;
|
||||
color: #56606d;
|
||||
font-weight: 500;
|
||||
position: static;
|
||||
cursor: pointer;
|
||||
box-sizing: border-box;
|
||||
|
||||
&__icon {
|
||||
min-width: 24px;
|
||||
}
|
||||
&__left {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
&__title {
|
||||
font-family: 'font_medium', sans-serif;
|
||||
font-size: 16px;
|
||||
line-height: 23px;
|
||||
color: #1b2533;
|
||||
margin: 0 0 0 18px;
|
||||
white-space: nowrap;
|
||||
&__label {
|
||||
font-size: 14px;
|
||||
line-height: 20px;
|
||||
margin-left: 24px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.router-link-active,
|
||||
&:hover {
|
||||
font-family: 'font_bold', sans-serif;
|
||||
background: #0068dc;
|
||||
border-radius: 6px;
|
||||
|
||||
.navigation-area__item-container__link__title {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.svg .navigation-svg-path:not(.white) {
|
||||
fill: #fff;
|
||||
}
|
||||
&__border {
|
||||
margin: 8px 24px;
|
||||
height: 1px;
|
||||
width: calc(100% - 48px);
|
||||
background: #ebeef1;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.active {
|
||||
font-weight: 600;
|
||||
border-color: #0149ff;
|
||||
background-color: #f7f8fb;
|
||||
color: #0149ff;
|
||||
|
||||
.navigation-area__wrap__item-container__left__image path {
|
||||
fill: #0149ff;
|
||||
}
|
||||
}
|
||||
|
||||
.navigation-area__wrap__item-container .router-link-active,
|
||||
.navigation-area__wrap__item-container:hover {
|
||||
font-weight: 600;
|
||||
border-color: #0149ff;
|
||||
background-color: #f7f8fb;
|
||||
color: #0149ff;
|
||||
|
||||
.navigation-area__wrap__item-container__left__image path {
|
||||
fill: #0149ff;
|
||||
}
|
||||
}
|
||||
|
||||
.dropdown-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-family: 'font_regular', sans-serif;
|
||||
padding: 10px 24px;
|
||||
|
||||
&__icon {
|
||||
margin-left: 15px;
|
||||
max-width: 37px;
|
||||
min-width: 37px;
|
||||
}
|
||||
|
||||
&__text {
|
||||
margin-left: 24px;
|
||||
|
||||
&__title {
|
||||
font-family: 'font_bold', sans-serif;
|
||||
font-size: 14px;
|
||||
line-height: 22px;
|
||||
color: #091c45;
|
||||
}
|
||||
|
||||
&__label {
|
||||
font-size: 12px;
|
||||
line-height: 21px;
|
||||
color: #091c45;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.dropdown-border {
|
||||
height: 1px;
|
||||
width: calc(100% - 48px);
|
||||
margin: 0 24px;
|
||||
background-color: #091c45;
|
||||
opacity: 0.1;
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -175,8 +175,6 @@ export default class NewProjectSelection extends Vue {
|
||||
* Closes select project dropdown.
|
||||
*/
|
||||
public closeDropdown(): void {
|
||||
if (!this.isDropdownShown) return;
|
||||
|
||||
this.$store.dispatch(APP_STATE_ACTIONS.CLOSE_POPUPS);
|
||||
}
|
||||
|
||||
|
||||
@ -32,7 +32,7 @@ let clickOutsideEvent: EventListener;
|
||||
Vue.directive('click-outside', {
|
||||
bind: function (el: HTMLElement, binding: DirectiveBinding, vnode: VNode) {
|
||||
clickOutsideEvent = function(event: Event): void {
|
||||
if (el === event.target || el.contains((event.target as Node))) {
|
||||
if (el === event.target || el.contains(event.target as Node)) {
|
||||
return;
|
||||
}
|
||||
|
||||
|
||||
@ -15,6 +15,7 @@ class ViewsState {
|
||||
public isAccountDropdownShown = false,
|
||||
public isSelectProjectDropdownShown = false,
|
||||
public isResourcesDropdownShown = false,
|
||||
public isQuickStartDropdownShown = false,
|
||||
public isSettingsDropdownShown = false,
|
||||
public isEditProjectDropdownShown = false,
|
||||
public isFreeCreditsDropdownShown = false,
|
||||
@ -69,6 +70,10 @@ export const appStateModule = {
|
||||
[APP_STATE_MUTATIONS.TOGGLE_RESOURCES_DROPDOWN](state: State): void {
|
||||
state.appState.isResourcesDropdownShown = !state.appState.isResourcesDropdownShown;
|
||||
},
|
||||
// Mutation changing resources dropdown visibility
|
||||
[APP_STATE_MUTATIONS.TOGGLE_QUICK_START_DROPDOWN](state: State): void {
|
||||
state.appState.isQuickStartDropdownShown = !state.appState.isQuickStartDropdownShown;
|
||||
},
|
||||
// Mutation changing settings dropdown visibility
|
||||
[APP_STATE_MUTATIONS.TOGGLE_SETTINGS_DROPDOWN](state: State): void {
|
||||
state.appState.isSettingsDropdownShown = !state.appState.isSettingsDropdownShown;
|
||||
@ -117,6 +122,7 @@ export const appStateModule = {
|
||||
state.appState.isAccountDropdownShown = false;
|
||||
state.appState.isSelectProjectDropdownShown = false;
|
||||
state.appState.isResourcesDropdownShown = false;
|
||||
state.appState.isQuickStartDropdownShown = false;
|
||||
state.appState.isSettingsDropdownShown = false;
|
||||
state.appState.isEditProjectDropdownShown = false;
|
||||
state.appState.isFreeCreditsDropdownShown = false;
|
||||
@ -183,6 +189,13 @@ export const appStateModule = {
|
||||
|
||||
commit(APP_STATE_MUTATIONS.TOGGLE_RESOURCES_DROPDOWN);
|
||||
},
|
||||
[APP_STATE_ACTIONS.TOGGLE_QUICK_START_DROPDOWN]: function ({commit, state}: AppContext): void {
|
||||
if (!state.appState.isQuickStartDropdownShown) {
|
||||
commit(APP_STATE_MUTATIONS.CLOSE_ALL);
|
||||
}
|
||||
|
||||
commit(APP_STATE_MUTATIONS.TOGGLE_QUICK_START_DROPDOWN);
|
||||
},
|
||||
[APP_STATE_ACTIONS.TOGGLE_SETTINGS_DROPDOWN]: function ({commit, state}: AppContext): void {
|
||||
if (!state.appState.isSettingsDropdownShown) {
|
||||
commit(APP_STATE_MUTATIONS.CLOSE_ALL);
|
||||
|
||||
@ -14,6 +14,7 @@ export const APP_STATE_MUTATIONS = {
|
||||
TOGGLE_ACCOUNT_DROPDOWN: 'TOGGLE_ACCOUNT_DROPDOWN',
|
||||
TOGGLE_SELECT_PROJECT_DROPDOWN: 'TOGGLE_SELECT_PROJECT_DROPDOWN',
|
||||
TOGGLE_RESOURCES_DROPDOWN: 'TOGGLE_RESOURCES_DROPDOWN',
|
||||
TOGGLE_QUICK_START_DROPDOWN: 'TOGGLE_QUICK_START_DROPDOWN',
|
||||
TOGGLE_SETTINGS_DROPDOWN: 'TOGGLE_SETTINGS_DROPDOWN',
|
||||
TOGGLE_EDIT_PROJECT_DROPDOWN: 'TOGGLE_EDIT_PROJECT_DROPDOWN',
|
||||
TOGGLE_FREE_CREDITS_DROPDOWN: 'TOGGLE_FREE_CREDITS_DROPDOWN',
|
||||
|
||||
@ -6,6 +6,7 @@ export const APP_STATE_ACTIONS = {
|
||||
TOGGLE_ACCOUNT: 'toggleAccountDropdown',
|
||||
TOGGLE_SELECT_PROJECT_DROPDOWN: 'toggleSelectProjectDropdown',
|
||||
TOGGLE_RESOURCES_DROPDOWN: 'toggleResourcesDropdown',
|
||||
TOGGLE_QUICK_START_DROPDOWN: 'toggleQuickStartDropdown',
|
||||
TOGGLE_SETTINGS_DROPDOWN: 'toggleSettingsDropdown',
|
||||
TOGGLE_EDIT_PROJECT_DROPDOWN: 'toggleEditProjectDropdown',
|
||||
TOGGLE_FREE_CREDITS_DROPDOWN: 'toggleFreeCreditsDropdown',
|
||||
|
||||
@ -0,0 +1,3 @@
|
||||
<svg width="10" height="10" viewBox="0 0 10 10" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M7.26677 4.73323C7.4105 4.87697 7.41401 5.10784 7.27728 5.25582L7.26677 5.26677L3.14403 9.3895C2.9967 9.53683 2.75783 9.53683 2.6105 9.3895C2.46676 9.24576 2.46326 9.0149 2.59998 8.86691L2.6105 8.85597L6.46651 5.00004L2.6105 1.14403C2.46676 1.00029 2.46326 0.769426 2.59998 0.621439L2.6105 0.610498C2.75423 0.466761 2.9851 0.463255 3.13309 0.59998L3.14403 0.610498L7.26677 4.73323Z" fill="#56606D"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 516 B |
@ -0,0 +1,6 @@
|
||||
<svg width="34" height="38" viewBox="0 0 34 38" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<ellipse cx="17.9189" cy="18.6427" rx="16.0811" ry="16.0887" fill="#376FFF"/>
|
||||
<ellipse cx="5.97297" cy="32.0244" rx="5.97297" ry="5.97581" fill="#FFC600"/>
|
||||
<ellipse cx="31.2943" cy="2.70723" rx="2.7057" ry="2.70699" fill="#00E075"/>
|
||||
<path d="M12.9204 14.5056C14.5309 14.5056 15.9325 15.4047 16.6508 16.7262H25.2414L27.2613 18.543L24.4335 20.7635L23.2216 19.5523L22.0097 20.7635L20.7977 19.5523L19.5858 20.7635H16.6508C15.9325 22.085 14.5309 22.9841 12.9204 22.9841C10.5778 22.9841 8.67868 21.0861 8.67868 18.7449C8.67868 16.4036 10.5778 14.5056 12.9204 14.5056ZM11.5065 17.5336C10.8371 17.5336 10.2946 18.0759 10.2946 18.7449C10.2946 19.4138 10.8371 19.9561 11.5065 19.9561C12.1758 19.9561 12.7184 19.4138 12.7184 18.7449C12.7184 18.0759 12.1758 17.5336 11.5065 17.5336Z" fill="#F3F5F8"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 908 B |
22
web/satellite/static/images/navigation/docs.svg
Normal file
22
web/satellite/static/images/navigation/docs.svg
Normal file
@ -0,0 +1,22 @@
|
||||
<svg width="32" height="24" viewBox="0 0 32 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<rect width="31.6484" height="24" rx="4" fill="white"/>
|
||||
<rect width="31.6484" height="24" rx="4" fill="#0038AB"/>
|
||||
<path d="M16 0H28C30.2091 0 32 1.79086 32 4V20C32 22.2091 30.2091 24 28 24H16V0Z" fill="white"/>
|
||||
<path d="M16 0H28C30.2091 0 32 1.79086 32 4V20C32 22.2091 30.2091 24 28 24H16V0Z" fill="#376FFF"/>
|
||||
<rect x="18.7253" y="13.2954" width="10.084" height="1.55139" rx="0.775695" fill="white"/>
|
||||
<rect x="18.7253" y="13.2954" width="10.084" height="1.55139" rx="0.775695" fill="white"/>
|
||||
<rect x="18.7253" y="9.4165" width="8.53264" height="1.55139" rx="0.775695" fill="white"/>
|
||||
<rect x="18.7253" y="9.4165" width="8.53264" height="1.55139" rx="0.775695" fill="white"/>
|
||||
<rect x="18.725" y="5.53784" width="4.65417" height="1.55139" rx="0.775695" fill="white"/>
|
||||
<rect x="18.725" y="5.53784" width="4.65417" height="1.55139" rx="0.775695" fill="white"/>
|
||||
<rect x="18.7253" y="17.1733" width="8.53264" height="1.55139" rx="0.775695" fill="white"/>
|
||||
<rect x="18.7253" y="17.1733" width="8.53264" height="1.55139" rx="0.775695" fill="white"/>
|
||||
<rect x="3.25122" y="13.2954" width="10.084" height="1.55139" rx="0.775695" fill="white"/>
|
||||
<rect x="3.25122" y="13.2954" width="10.084" height="1.55139" rx="0.775695" fill="white"/>
|
||||
<rect x="3.25122" y="9.4165" width="8.53264" height="1.55139" rx="0.775695" fill="white"/>
|
||||
<rect x="3.25122" y="9.4165" width="8.53264" height="1.55139" rx="0.775695" fill="white"/>
|
||||
<rect x="3.25159" y="5.53784" width="4.65417" height="1.55139" rx="0.775695" fill="white"/>
|
||||
<rect x="3.25159" y="5.53784" width="4.65417" height="1.55139" rx="0.775695" fill="white"/>
|
||||
<rect x="3.25122" y="17.1733" width="8.53264" height="1.55139" rx="0.775695" fill="white"/>
|
||||
<rect x="3.25122" y="17.1733" width="8.53264" height="1.55139" rx="0.775695" fill="white"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.9 KiB |
6
web/satellite/static/images/navigation/forum.svg
Normal file
6
web/satellite/static/images/navigation/forum.svg
Normal file
@ -0,0 +1,6 @@
|
||||
<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M15.8012 20.786C14.5505 22.4388 13.8086 24.498 13.8086 26.7305V27.2001H1.59998V25.7914C1.59998 21.3828 5.1739 17.8088 9.58256 17.8088C12.0959 17.8088 14.338 18.9704 15.8012 20.786Z" fill="#376FFF"/>
|
||||
<circle cx="9.77948" cy="11.3257" r="5.72565" fill="#00E075"/>
|
||||
<path d="M14.7478 25.7914C14.7478 21.3828 18.3217 17.8088 22.7304 17.8088V17.8088C27.1391 17.8088 30.713 21.3828 30.713 25.7914V27.2001H14.7478V25.7914Z" fill="#FF598B"/>
|
||||
<circle cx="22.8668" cy="11.3257" r="5.72565" fill="#FFC700"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 664 B |
5
web/satellite/static/images/navigation/newProject.svg
Normal file
5
web/satellite/static/images/navigation/newProject.svg
Normal file
@ -0,0 +1,5 @@
|
||||
<svg width="37" height="30" viewBox="0 0 50 30" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M6.07346 5.00025C6.07346 2.23883 8.31204 0.000244141 11.0735 0.000244141H38.3799C41.1414 0.000244141 43.3799 2.23882 43.3799 5.00024V26.4618H6.07346V5.00025Z" fill="#376FFF"/>
|
||||
<path d="M0 26.0281C0 27.7052 1.35952 29.0647 3.03658 29.0647H46.4162C48.0933 29.0647 49.4528 27.7052 49.4528 26.0281H0Z" fill="#0218A7"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M29.9326 19.5676C32.8075 16.6926 32.8075 12.0314 29.9326 9.15645C27.0576 6.28151 22.3964 6.28151 19.5214 9.15645C16.6465 12.0314 16.6465 16.6926 19.5214 19.5676C22.3964 22.4425 27.0576 22.4425 29.9326 19.5676ZM24.7269 10.2084C25.0798 10.2084 25.3659 10.4945 25.3659 10.8474V13.7228H28.2413C28.5942 13.7228 28.8803 14.0089 28.8803 14.3618C28.8803 14.7147 28.5942 15.0008 28.2413 15.0008H25.3659V17.8762C25.3659 18.2291 25.0798 18.5152 24.7269 18.5152C24.374 18.5152 24.0879 18.2291 24.0879 17.8762V15.0008H21.2124C20.8595 15.0008 20.5735 14.7147 20.5735 14.3618C20.5735 14.0089 20.8595 13.7228 21.2124 13.7228H24.0879V10.8474C24.0879 10.4945 24.374 10.2084 24.7269 10.2084Z" fill="white"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.1 KiB |
4
web/satellite/static/images/navigation/support.svg
Normal file
4
web/satellite/static/images/navigation/support.svg
Normal file
@ -0,0 +1,4 @@
|
||||
<svg width="32" height="25" viewBox="0 0 32 25" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M18.48 0.000244141C19.5845 0.000244141 20.48 0.895676 20.48 2.00025V10.8002C20.48 11.9048 19.5845 12.8002 18.48 12.8002H3.29094L-0.000488281 15.3602V10.8802H0.00155258C0.000509262 10.8537 -1.90735e-05 10.827 -1.90735e-05 10.8002V2.00024C-1.90735e-05 0.895675 0.895414 0.000244141 1.99998 0.000244141H18.48Z" fill="#003DC1"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M13.52 8.96021C12.4155 8.96021 11.52 9.85564 11.52 10.9602V19.7602C11.52 20.8648 12.4155 21.7602 13.52 21.7602H28.709L32.0005 24.3202V19.8402H31.9984C31.9995 19.8137 32 19.787 32 19.7602V10.9602C32 9.85564 31.1046 8.96021 30 8.96021H13.52Z" fill="#567BF7"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 792 B |
21
web/satellite/static/images/navigation/uploadInCLI.svg
Normal file
21
web/satellite/static/images/navigation/uploadInCLI.svg
Normal file
@ -0,0 +1,21 @@
|
||||
<svg width="37" height="30" viewBox="0 0 37 30" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g clip-path="url(#uploadInCLI)">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M8.91116 0.00585938H27.9689C31.0919 0.00585938 32.2243 0.326511 33.366 0.928627C34.5077 1.53074 35.4037 2.41432 36.0143 3.54018L36.0506 3.60774C36.6378 4.7115 36.9501 5.84438 36.9501 8.86239V20.8527L36.9497 21.0352C36.937 23.977 36.6127 25.0716 36.0143 26.1749C35.4037 27.3008 34.5077 28.1844 33.366 28.7865C32.2357 29.3826 31.1145 29.7028 28.062 29.7093H9.00425C5.88129 29.7093 4.74884 29.3886 3.60713 28.7865C2.46543 28.1844 1.56941 27.3008 0.958819 26.1749L0.922526 26.1074C0.341343 25.0149 0.0294655 23.8939 0.0230637 20.9445V8.86239C0.0230637 5.78278 0.348228 4.66604 0.958819 3.54018C1.56941 2.41432 2.46543 1.53074 3.60713 0.928627C4.73742 0.332532 5.85864 0.0123005 8.91116 0.00585938Z" fill="#0218A7"/>
|
||||
<path d="M5.56489 6.78853C6.54245 6.78853 7.33492 6.00706 7.33492 5.04307C7.33492 4.07908 6.54245 3.29761 5.56489 3.29761C4.58733 3.29761 3.79486 4.07908 3.79486 5.04307C3.79486 6.00706 4.58733 6.78853 5.56489 6.78853Z" fill="#FF458B"/>
|
||||
<path d="M10.875 6.78853C11.8525 6.78853 12.645 6.00706 12.645 5.04307C12.645 4.07908 11.8525 3.29761 10.875 3.29761C9.89741 3.29761 9.10494 4.07908 9.10494 5.04307C9.10494 6.00706 9.89741 6.78853 10.875 6.78853Z" fill="#FFC600"/>
|
||||
<path d="M16.1851 6.78853C17.1626 6.78853 17.9551 6.00706 17.9551 5.04307C17.9551 4.07908 17.1626 3.29761 16.1851 3.29761C15.2075 3.29761 14.415 4.07908 14.415 5.04307C14.415 6.00706 15.2075 6.78853 16.1851 6.78853Z" fill="#00E567"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M5.20366 9.1875H19.56C20.3298 9.1875 20.9553 9.79632 20.9686 10.5523L20.9688 10.5767C20.9688 11.344 20.338 11.966 19.56 11.966H5.20366C4.43388 11.966 3.8083 11.3572 3.79507 10.6012L3.79486 10.5767C3.79486 9.80949 4.4256 9.1875 5.20366 9.1875Z" fill="#276CFF"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M12.2477 14.0168H15.5349C16.3046 14.0168 16.9302 14.6257 16.9434 15.3817L16.9437 15.4061C16.9437 16.1733 16.3129 16.7953 15.5349 16.7953H12.2477C11.4779 16.7953 10.8523 16.1865 10.8391 15.4305L10.8389 15.4061C10.8389 14.6388 11.4696 14.0168 12.2477 14.0168Z" fill="#FF458B"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M20.7675 14.0168H24.0547C24.8245 14.0168 25.4501 14.6257 25.4633 15.3817L25.4635 15.4061C25.4635 16.1733 24.8328 16.7953 24.0547 16.7953H20.7675C19.9978 16.7953 19.3722 16.1865 19.3589 15.4305L19.3587 15.4061C19.3587 14.6388 19.9895 14.0168 20.7675 14.0168Z" fill="#00E567"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M29.2874 14.0168H32.5746C33.3444 14.0168 33.97 14.6257 33.9832 15.3817L33.9834 15.4061C33.9834 16.1733 33.3527 16.7953 32.5746 16.7953H29.2874C28.5176 16.7953 27.892 16.1865 27.8788 15.4305L27.8786 15.4061C27.8786 14.6388 28.5093 14.0168 29.2874 14.0168Z" fill="#00E567"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M24.7256 9.1875H28.4824C29.2521 9.1875 29.8777 9.79632 29.891 10.5523L29.8912 10.5767C29.8912 11.344 29.2604 11.966 28.4824 11.966H24.7256C23.9558 11.966 23.3302 11.3572 23.317 10.6012L23.3168 10.5767C23.3168 9.80949 23.9475 9.1875 24.7256 9.1875Z" fill="#276CFF"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M16.474 18.8459H24.0547C24.8245 18.8459 25.4501 19.4548 25.4633 20.2108L25.4635 20.2352C25.4635 21.0025 24.8328 21.6244 24.0547 21.6244H16.474C15.7043 21.6244 15.0787 21.0156 15.0655 20.2596L15.0652 20.2352C15.0652 19.4679 15.696 18.8459 16.474 18.8459Z" fill="#276CFF"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M16.474 23.6753H19.56C20.3298 23.6753 20.9553 24.2841 20.9686 25.0401L20.9688 25.0645C20.9688 25.8318 20.338 26.4538 19.56 26.4538H16.474C15.7043 26.4538 15.0787 25.845 15.0655 25.089L15.0652 25.0645C15.0652 24.2973 15.696 23.6753 16.474 23.6753Z" fill="#276CFF"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M24.7256 23.6753H28.4824C29.2521 23.6753 29.8777 24.2841 29.891 25.0401L29.8912 25.0645C29.8912 25.8318 29.2604 26.4538 28.4824 26.4538H24.7256C23.9558 26.4538 23.3302 25.845 23.317 25.089L23.3168 25.0645C23.3168 24.2973 23.9475 23.6753 24.7256 23.6753Z" fill="#FF458B"/>
|
||||
</g>
|
||||
<defs>
|
||||
<clipPath id="uploadInCLI">
|
||||
<rect width="37" height="30" fill="white" transform="translate(0 0.000244141)"/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 4.3 KiB |
26
web/satellite/static/images/navigation/uploadInWeb.svg
Normal file
26
web/satellite/static/images/navigation/uploadInWeb.svg
Normal file
@ -0,0 +1,26 @@
|
||||
<svg width="37" height="30" viewBox="0 0 37 30" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g clip-path="url(#uploadInWeb)">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M8.98732 0.00952148H28.1754C31.3197 0.00952148 32.4599 0.333375 33.6094 0.941503C34.7589 1.54963 35.6611 2.44204 36.2759 3.57914L36.3124 3.64737C36.9036 4.76215 37.218 5.90634 37.218 8.95449V21.0646L37.2176 21.2488C37.2048 24.22 36.8783 25.3255 36.2759 26.4399C35.6611 27.577 34.7589 28.4694 33.6094 29.0775C32.4714 29.6796 31.3425 30.003 28.2691 30.0095H9.08105C5.93673 30.0095 4.79653 29.6857 3.64702 29.0775C2.4975 28.4694 1.59536 27.577 0.980593 26.4399L0.944052 26.3717C0.358895 25.2683 0.0448844 24.136 0.0384388 21.1573V8.95449C0.0384388 5.84413 0.365827 4.71624 0.980593 3.57914C1.59536 2.44204 2.4975 1.54963 3.64702 0.941503C4.78504 0.339456 5.91393 0.016027 8.98732 0.00952148Z" fill="#EAEFF2"/>
|
||||
<mask id="uploadInWebMask" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="0" y="9" width="38" height="22">
|
||||
<path d="M0.0384388 9.53101H37.218V21.0644L37.2176 21.2487C37.2048 24.2199 36.8783 25.3254 36.2759 26.4398C35.6611 27.5769 34.7589 28.4693 33.6094 29.0774C32.4714 29.6795 31.3425 30.0029 28.2691 30.0094H9.08105C5.93673 30.0094 4.79653 29.6855 3.64702 29.0774C2.4975 28.4693 1.59536 27.5769 0.980593 26.4398L0.944052 26.3715C0.358895 25.2681 0.0448844 24.1359 0.0384388 21.1571V9.53101Z" fill="white"/>
|
||||
</mask>
|
||||
<g mask="url(#uploadInWebMask)">
|
||||
<path d="M0.0384388 9.53101H37.218V21.0644L37.2176 21.2487C37.2048 24.2199 36.8783 25.3254 36.2759 26.4398C35.6611 27.5769 34.7589 28.4693 33.6094 29.0774C32.4714 29.6795 31.3425 30.0029 28.2691 30.0094H9.08105C5.93673 30.0094 4.79653 29.6855 3.64702 29.0774C2.4975 28.4693 1.59536 27.5769 0.980593 26.4398L0.944052 26.3715C0.358895 25.2681 0.0448844 24.1359 0.0384388 21.1571V9.53101Z" fill="#D1D9DF"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M10.0081 9.53101V30.0094H9.08104C5.93673 30.0094 4.79653 29.6856 3.64702 29.0774C2.4975 28.4693 1.59536 27.5769 0.980593 26.4398L0.944052 26.3716C0.358895 25.2682 0.0448844 24.1359 0.0384388 21.1572V9.53101H10.0081Z" fill="#0149FF"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M14.2922 12.0693H32.4699C33.2533 12.0693 33.8883 12.6975 33.8883 13.4725V14.5912C33.8883 15.3661 33.2533 15.9943 32.4699 15.9943H14.2922C13.5088 15.9943 12.8738 15.3661 12.8738 14.5912V13.4725C12.8738 12.6975 13.5088 12.0693 14.2922 12.0693Z" fill="white"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M14.2922 17.5933H32.4699C33.2533 17.5933 33.8883 18.2215 33.8883 18.9964V20.1151C33.8883 20.89 33.2533 21.5182 32.4699 21.5182H14.2922C13.5088 21.5182 12.8738 20.89 12.8738 20.1151V18.9964C12.8738 18.2215 13.5088 17.5933 14.2922 17.5933Z" fill="white"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M14.2922 23.1174H32.4699C33.2533 23.1174 33.8883 23.7456 33.8883 24.5205V25.6393C33.8883 26.4142 33.2533 27.0424 32.4699 27.0424H14.2922C13.5088 27.0424 12.8738 26.4142 12.8738 25.6393V24.5205C12.8738 23.7456 13.5088 23.1174 14.2922 23.1174Z" fill="white"/>
|
||||
<path opacity="0.199481" fill-rule="evenodd" clip-rule="evenodd" d="M2.97656 12.0693H7.04657C7.82995 12.0693 8.46501 12.6975 8.46501 13.4725V13.5009C8.46501 14.2758 7.82995 14.904 7.04657 14.904H2.97656C2.20152 14.904 1.57166 14.2891 1.55835 13.5256L1.55813 13.4725C1.55813 12.6975 2.19319 12.0693 2.97656 12.0693Z" fill="white"/>
|
||||
<path opacity="0.199481" fill-rule="evenodd" clip-rule="evenodd" d="M2.97656 16.7212H7.04657C7.82995 16.7212 8.46501 17.3494 8.46501 18.1243V18.1527C8.46501 18.9277 7.82995 19.5559 7.04657 19.5559H2.97656C2.20152 19.5559 1.57166 18.941 1.55835 18.1774L1.55813 18.1243C1.55813 17.3494 2.19319 16.7212 2.97656 16.7212Z" fill="white"/>
|
||||
<path opacity="0.199481" fill-rule="evenodd" clip-rule="evenodd" d="M2.97656 21.3728H7.04657C7.82995 21.3728 8.46501 22.001 8.46501 22.7759V22.8044C8.46501 23.5793 7.82995 24.2075 7.04657 24.2075H2.97656C2.20152 24.2075 1.57166 23.5926 1.55835 22.829L1.55813 22.7759C1.55813 22.001 2.19319 21.3728 2.97656 21.3728Z" fill="white"/>
|
||||
</g>
|
||||
<path d="M5.61816 6.85977C6.60241 6.85977 7.4003 6.07049 7.4003 5.09688C7.4003 4.12326 6.60241 3.33398 5.61816 3.33398C4.63392 3.33398 3.83603 4.12326 3.83603 5.09688C3.83603 6.07049 4.63392 6.85977 5.61816 6.85977Z" fill="#FF458B"/>
|
||||
<path d="M10.9646 6.85977C11.9488 6.85977 12.7467 6.07049 12.7467 5.09688C12.7467 4.12326 11.9488 3.33398 10.9646 3.33398C9.98031 3.33398 9.18243 4.12326 9.18243 5.09688C9.18243 6.07049 9.98031 6.85977 10.9646 6.85977Z" fill="#FFC600"/>
|
||||
<path d="M16.311 6.85977C17.2952 6.85977 18.0931 6.07049 18.0931 5.09688C18.0931 4.12326 17.2952 3.33398 16.311 3.33398C15.3267 3.33398 14.5288 4.12326 14.5288 5.09688C14.5288 6.07049 15.3267 6.85977 16.311 6.85977Z" fill="#00E567"/>
|
||||
</g>
|
||||
<defs>
|
||||
<clipPath id="uploadInWeb">
|
||||
<rect width="37" height="30" fill="white" transform="translate(0 0.000244141)"/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 5.0 KiB |
Loading…
Reference in New Issue
Block a user