rancher
/
dashboard
mirror of https://github.com/rancher/dashboard.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Use inline icon, so we can change the color to be primary

This commit is contained in:
Neil MacDougall 2021-05-21 13:42:11 +01:00
parent 08f53b205f
commit 29c55196e4
6 changed files with 44 additions and 55 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

25
assets/brand/suse/local-cluster.svg
View File

@ -1,25 +0,0 @@
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 25.2.3, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
viewBox="0 0 100 100" style="enable-background:new 0 0 100 100;" xml:space="preserve">
<style type="text/css">
.st0{fill:#139448;}
.st1{fill:#32B979;}
</style>
<g>
<g>
<path class="st0" d="M26.0862026,44.4953918H8.6165142c-5.5818157,0-9.3979139-4.6252708-8.4802637-10.1311035l2.858391-17.210701
C3.912292,11.6477556,6.1382647,7.1128125,7.8419709,7.1128125s3.1788611,4.5368752,3.1788611,10.1186218v4.4837742
c0,5.5817471,4.4044495,9.5409164,9.9862652,9.5409164h5.0791054V44.4953918z"/>
</g>
<path class="st1" d="M63.0214729,92.8871841H37.0862045c-6.0751343,0-11.0000019-4.9248657-11.0000019-11V30.3864384
c0-6.0751324,4.9248676-11,11.0000019-11h25.9352684c6.0751305,0,11.0000038,4.9248676,11.0000038,11v51.5007477
C74.0214767,87.9623184,69.0966034,92.8871841,63.0214729,92.8871841z"/>
<g>
<path class="st0" d="M73.9137955,44.4953918h17.4696884c5.5818176,0,9.3979187-4.6252708,8.4802628-10.1311035
l-2.8583908-17.210701c-0.9176483-5.5058317-3.1436234-10.0407753-4.8473282-10.0407753
s-3.1788635,4.5368752-3.1788635,10.1186218v4.4837742c0,5.5817471-4.4044418,9.5409164-9.9862595,9.5409164h-5.0791092
V44.4953918z"/>
</g>
</g>
</svg>
Side by Side

Before

Width:  |  Height:  |  Size: 1.4 KiB

25
assets/images/pl/local-cluster.svg
View File

@ -1,25 +0,0 @@
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 25.2.3, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
viewBox="0 0 100 100" style="enable-background:new 0 0 100 100;" xml:space="preserve">
<style type="text/css">
.st0{fill:#0D5E8C;}
.st1{fill:#0071BC;}
</style>
<g>
<g>
<path class="st0" d="M26.0862026,44.4953918H8.6165142c-5.5818157,0-9.3979139-4.6252708-8.4802637-10.1311035l2.858391-17.210701
C3.912292,11.6477556,6.1382647,7.1128125,7.8419709,7.1128125s3.1788611,4.5368752,3.1788611,10.1186218v4.4837742
c0,5.5817471,4.4044495,9.5409164,9.9862652,9.5409164h5.0791054V44.4953918z"/>
</g>
<path class="st1" d="M63.0214729,92.8871841H37.0862045c-6.0751343,0-11.0000019-4.9248657-11.0000019-11V30.3864384
c0-6.0751324,4.9248676-11,11.0000019-11h25.9352684c6.0751305,0,11.0000038,4.9248676,11.0000038,11v51.5007477
C74.0214767,87.9623184,69.0966034,92.8871841,63.0214729,92.8871841z"/>
<g>
<path class="st0" d="M73.9137955,44.4953918h17.4696884c5.5818176,0,9.3979187-4.6252708,8.4802628-10.1311035
l-2.8583908-17.210701c-0.9176483-5.5058317-3.1436234-10.0407753-4.8473282-10.0407753
s-3.1788635,4.5368752-3.1788635,10.1186218v4.4837742c0,5.5817471-4.4044418,9.5409164-9.9862595,9.5409164h-5.0791092
V44.4953918z"/>
</g>
</g>
</svg>
Side by Side

Before

Width:  |  Height:  |  Size: 1.4 KiB

28
components/RancherProviderIcon.vue Normal file
View File

@ -0,0 +1,28 @@
<script>
export default {};
</script>
<template>
<!-- eslint-disable -->
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 100 100" style="enable-background:new 0 0 100 100;" xml:space="preserve">
<style type="text/css">
.rancher-icon-fill{fill: var(--primary);}
</style>
<g>
<g>
<path class="rancher-icon-fill" d="M26.0862026,44.4953918H8.6165142c-5.5818157,0-9.3979139-4.6252708-8.4802637-10.1311035l2.858391-17.210701
C3.912292,11.6477556,6.1382647,7.1128125,7.8419709,7.1128125s3.1788611,4.5368752,3.1788611,10.1186218v4.4837742
c0,5.5817471,4.4044495,9.5409164,9.9862652,9.5409164h5.0791054V44.4953918z"/>
</g>
<path class="rancher-icon-fill" d="M63.0214729,92.8871841H37.0862045c-6.0751343,0-11.0000019-4.9248657-11.0000019-11V30.3864384
c0-6.0751324,4.9248676-11,11.0000019-11h25.9352684c6.0751305,0,11.0000038,4.9248676,11.0000038,11v51.5007477
C74.0214767,87.9623184,69.0966034,92.8871841,63.0214729,92.8871841z"/>
<g>
<path class="rancher-icon-fill" d="M73.9137955,44.4953918h17.4696884c5.5818176,0,9.3979187-4.6252708,8.4802628-10.1311035
l-2.8583908-17.210701c-0.9176483-5.5058317-3.1436234-10.0407753-4.8473282-10.0407753
s-3.1788635,4.5368752-3.1788635,10.1186218v4.4837742c0,5.5817471-4.4044418,9.5409164-9.9862595,9.5409164h-5.0791092
V44.4953918z"/>
</g>
</g>
</svg>
</template>

6
components/nav/Header.vue
View File

@ -6,6 +6,7 @@ import { isMac } from '@/utils/platform';
import Import from '@/components/Import';
import BrandImage from '@/components/BrandImage';
import { getProduct } from '@/config/private-label';
import RancherProviderIcon from '@/components/RancherProviderIcon';
import NamespaceFilter from './NamespaceFilter';
import WorkspaceSwitcher from './WorkspaceSwitcher';
import TopLevelMenu from './TopLevelMenu';
@ -21,7 +22,8 @@ export default {
Import,
TopLevelMenu,
Jump,
BrandImage
BrandImage,
RancherProviderIcon,
},
props: {
@ -126,7 +128,7 @@ export default {
<div class="menu-spacer"></div>
<div v-if="!simple" class="product">
<div v-if="currentProduct && currentProduct.showClusterSwitcher" class="cluster">
<BrandImage v-if="currentCluster.isLocal" file-name="local-cluster.svg" class="mr-10" width="25" />
<RancherProviderIcon v-if="currentCluster.isLocal" class="mr-10" width="25" />
<img v-else-if="currentCluster" class="cluster-os-logo" :src="currentCluster.providerLogo" />
<div v-if="currentCluster" class="cluster-name">
{{ currentCluster.spec.displayName }}

12
components/nav/TopLevelMenu.vue
View File

@ -1,5 +1,6 @@
<script>
import BrandImage from '@/components/BrandImage';
import RancherProviderIcon from '@/components/RancherProviderIcon';
import { mapGetters } from 'vuex';
import { MANAGEMENT } from '@/config/types';
import { mapPref, DEV } from '@/store/prefs';
@ -15,7 +16,7 @@ const MAX_CLUSTERS_TO_SHOW = 4;
export default {
components: { BrandImage },
components: { BrandImage, RancherProviderIcon },
data() {
const { displayVersion, fullVersion } = getVersionInfo(this.$store);
@ -203,7 +204,7 @@ export default {
class="cluster selector option"
:to="{ name: 'c-cluster', params: { cluster: c.id } }"
>
<BrandImage v-if="c.isLocal" file-name="local-cluster.svg" />
<RancherProviderIcon v-if="c.isLocal" width="25" class="rancher-provider-icon" />
<img v-else :src="c.logo" />
<div>{{ c.label }}</div>
</nuxt-link>
@ -308,6 +309,12 @@ export default {
background: var(--primary-hover-bg);
border-radius: 5px;
text-decoration: none;
.rancher-provider-icon {
.rancher-icon-fill {
fill: var(--primary-hover-text);;
}
}
}
.localeSelector {
@ -323,6 +330,7 @@ export default {
outline: 0;
}
}
</style>
<style lang="scss" scoped>

3
models/management.cattle.io.cluster.js
View File

@ -8,6 +8,7 @@ import { eachLimit } from '@/utils/promise';
import { addParams } from '@/utils/url';
import { isEmpty } from '@/utils/object';
import { KONTAINER_TO_DRIVER } from './management.cattle.io.kontainerdriver';
import { CopySnapshotRequest } from '@aws-sdk/client-ec2';
// See translation file cluster.providers for list of providers
// If the logo is not named with the provider name, add an override here
@ -169,7 +170,7 @@ export default {
},
isLocal() {
return this.id === 'local';
return this.spec?.internal === true;
},
providerLogo() {