Improve icon for dark mode

This commit is contained in:
Matthias 2020-12-29 16:17:05 +01:00
parent 65117a7f5f
commit 29abcd0720
3 changed files with 19 additions and 2 deletions

Binary file not shown.

After

Width:  |  Height:  |  Size: 37 KiB

View File

@ -1,5 +1,9 @@
// global main style
.logo-svg {
background-color: #000000;
}
[data-theme="dark"] {
$bg-dark: #3c3c3c;
$bg-darker: darken($bg-dark, 5%);
@ -12,7 +16,7 @@
color: $fg-color;
}
.card {
border-color: $bg-dark;
border-color: lighten($bg-dark, 10%);
}
.card-body {
background: $bg-dark;
@ -65,6 +69,9 @@
color: $fg-color;
}
.logo-svg {
background-color: $fg-color;
}
textarea {
color: $fg-color;
background: $bg-dark;
@ -72,6 +79,8 @@
}
html.ft-theme-transition,
html.ft-theme-transition *,
html.ft-theme-transition *:before,

View File

@ -1,6 +1,7 @@
<template>
<div class="home">
<img alt="Freqtrade logo" src="../assets/freqtrade-logo.png" />
<!-- <img alt="Freqtrade logo" src="../assets/freqtrade-logo.png" width="450px" class="my-5" /> -->
<div alt="Freqtrade logo" class="logo-svg my-5 mx-auto" />
<div>
<h1>Welcome to the Freqtrade UI</h1>
</div>
@ -26,4 +27,11 @@ export default class Home extends Vue {}
.home {
margin-top: 1.5em;
}
.logo-svg {
-webkit-mask: url(../assets/freqtrade-logo-mask.png) no-repeat center;
mask: url(../assets/freqtrade-logo-mask.png) no-repeat center;
mask-size: contain;
width: 250px;
height: 250px;
}
</style>