Creepso/stremio-web
1
0
Fork 0
mirror of https://github.com/Stremio/stremio-web.git synced 2026-04-14 09:00:30 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

new color theme applied to board

Browse source
This commit is contained in:
nklhrstv 2020-03-04 17:38:54 +02:00
parent 30ecf2f805
commit 59cfcabba7
4 changed files with 21 additions and 11 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
src/common/Button/styles.less
View file

@ -1,6 +1,8 @@
@import (reference) '~stremio-colors/dist/less/stremio-colors.less';
.button-container {
outline-width: var(--focus-outline-size);
outline-color: var(--color-surfacelighter);
outline-color: @color-surface-light5;
outline-offset: calc(-1 * var(--focus-outline-size));
cursor: pointer;

2
src/common/MetaItem/styles.less
View file

@ -16,7 +16,7 @@
}
.meta-item-container {
padding: 0.8rem;
padding: 1rem;
overflow: visible;
&:hover, &:focus, &:global(.active), &:global(.selected) {

8
src/common/MetaRow/MetaRowPlaceholder/styles.less
View file

@ -1,9 +1,12 @@
@import (reference) '~stremio-colors/dist/less/stremio-colors.less';
.meta-row-placeholder-container {
.title-container {
max-height: 2.4em;
padding: 0 1rem;
margin-bottom: 2rem;
font-size: 1.5rem;
color: var(--color-surface);
color: @color-surface;
&:empty {
height: 1.2em;
@ -24,7 +27,7 @@
.meta-item {
flex: 1;
margin-right: 2rem;
margin: 1rem 3rem 1rem 1rem;
background-color: var(--color-placeholder);
.poster-container {
@ -40,6 +43,7 @@
.see-all-container {
flex: none;
margin: 1rem;
background-color: var(--color-placeholder);
}
}

18
src/common/MetaRow/styles.less
View file

@ -1,17 +1,21 @@
@import (reference) '~stremio-colors/dist/less/stremio-colors.less';
.meta-row-container {
overflow: visible;
.title-container {
max-height: 2.4em;
padding: 0 1rem;
margin-bottom: 2rem;
font-size: 1.5rem;
color: var(--color-surfacelighter);
color: @color-secondaryvariant2-light1;
}
.message-container {
max-height: 3.6em;
padding: 0 1rem;
font-size: 1.3rem;
color: var(--color-surfacelighter);
color: @color-secondaryvariant2-light1;
}
.content-container {
@ -50,11 +54,11 @@
flex-direction: row;
align-items: center;
justify-content: center;
padding: 1rem;
background-color: var(--color-backgroundlight);
margin: 1rem;
background-color: @color-background-light1;
&:hover, &:focus {
background-color: var(--color-backgroundlighter);
background-color: @color-background-light3;
}
.label {
@ -64,7 +68,7 @@
max-height: 2.4em;
font-size: 1.2rem;
text-align: center;
color: var(--color-surfacelighter);
color: @color-surface-light5;
}
.icon {
@ -72,7 +76,7 @@
width: 1.3rem;
height: 1.3rem;
margin-left: 0.3rem;
fill: var(--color-surfacelighter);
fill: @color-surface-light5;
}
}
}