deepcrayon/lila
deepcrayon/lila
1
0
Fork 0
Code Releases Activity

try new style for homepage featured tournaments

Browse source
This commit is contained in:
Thibault Duplessis 2019-04-25 13:36:23 +07:00
parent b39a757045
commit 0284b45fcc
5 changed files with 44 additions and 28 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

14
ui/common/css/abstract/_extends.scss
View file

@ -31,6 +31,20 @@
@extend %page-text-shadow !optional;
}
%metal {
@include metal;
}
%metal-hover {
@include metal-hover;
}
%page-metal {
@include page-metal;
}
%page-metal-hover {
@include page-metal;
}
%active {
background: $c-accent;
color: #fff;

15
ui/common/css/theme/_dark.scss
View file

@ -85,13 +85,14 @@ $text-shadow: none;
}
@mixin metal-hover {
background: linear-gradient(to bottom, hsl(0, 0, 25), hsl(0, 0, 22) 100%);
color: $c-font-clear;
}
@mixin page-metal {
@include metal;
}
@mixin page-metal-hover {
@include metal-hover;
}
@mixin theme-style { }
%metal {
@include metal;
}
%metal-hover {
@include metal-hover;
}

16
ui/common/css/theme/_light.scss
View file

@ -13,11 +13,13 @@ $theme-dark: false;
text-shadow: $text-shadow;
}
@mixin theme-style { }
@mixin page-metal {
background: linear-gradient(to bottom, mix($c-link, hsl(0, 0%, 100%), 20%) 0%, mix($c-link, hsl(0, 0%, 94%), 20%) 100%);
text-shadow: $text-shadow;
}
@mixin page-metal-hover {
background: linear-gradient(to bottom, mix($c-link, #fff, 25%) 0%, mix($c-link, c-light($c-bg-page, 90%), 25%) 100%);
text-shadow: $text-shadow;
}
%metal {
@include metal;
}
%metal-hover {
@include metal-hover;
}
@mixin theme-style { }

14
ui/common/css/theme/_transp.scss
View file

@ -36,6 +36,13 @@ $text-shadow: 0 0 3px #000;
background: linear-gradient(to bottom, hsla(0, 0, 0, .45), hsla(0, 0, 0, .55) 100%);
}
@mixin page-metal {
@include metal;
}
@mixin page-metal-hover {
@include metal-hover;
}
@mixin theme-style {
body.transp {
&::before {
@ -53,10 +60,3 @@ $text-shadow: 0 0 3px #000;
}
}
}
%metal {
@include metal;
}
%metal-hover {
@include metal-hover;
}

13
ui/lobby/css/_spotlight.scss
View file

@ -1,22 +1,19 @@
.lobby__spotlights {
@extend %box-radius-force;
@extend %box-neat-force;
flex: 0 0 auto;
}
.tour-spotlight {
@extend %flex-center-nowrap, %nowrap-hidden;
@extend %flex-center-nowrap, %nowrap-hidden, %page-metal;
flex: 0 0 auto;
padding: .3em;
opacity: 0.8;
@include transition();
background: $c-bg-low;
text-shadow: $text-shadow;
color: $c-font;
border-bottom: 1px solid $c-bg-page;
&.invert,
&.event-spotlight,
&:hover {
background: $c-primary;
color: $c-primary-over;
@extend %page-metal-hover;
text-shadow: none;
}
&:hover {
@ -36,7 +33,9 @@
i.img::before {
color: #fff;
font-size: 50px;
text-shadow: 1px 1px 3px rgba(0,0,0,0.3);
@if $theme-light {
text-shadow: 1px 1px 2px $c-link;
}
}
.name {
margin-top: 1px;