archive/pillar
0
0
Fork 0
Code Issues 42 Pull Requests Projects Releases Wiki Activity

CSS: $primary-accent color and gradient utils

Browse Source
This commit is contained in:
Pablo Vazquez
2018-09-15 05:40:29 +02:00
parent 35a22cab4b
commit b0311af6b5
6 changed files with 19 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
src/styles/_apps_base.sass
View File

@@ -411,10 +411,12 @@ $loader-bar-height: 2px
position: absolute position: absolute
visibility: hidden visibility: hidden
width: 100% width: 100%
z-index: 20
&:before &:before
animation: none animation: none
background-color: $primary background-color: $primary
background-image: linear-gradient(to right, $primary-accent, $primary)
content: '' content: ''
display: block display: block
height: $loader-bar-height height: $loader-bar-height
@@ -452,3 +454,4 @@ $loader-bar-height: 2px
.progress-bar .progress-bar
background-color: $primary background-color: $primary
background-image: linear-gradient(to right, $primary-accent, $primary)

3
src/styles/_config.sass
View File

@@ -30,6 +30,7 @@ $color-primary: #009eff !default
$color-primary-light: hsl(hue($color-primary), 30%, 90%) !default $color-primary-light: hsl(hue($color-primary), 30%, 90%) !default
$color-primary-dark: hsl(hue($color-primary), 80%, 30%) !default $color-primary-dark: hsl(hue($color-primary), 80%, 30%) !default
$color-primary-accent: hsl(hue($color-primary), 100%, 50%) !default $color-primary-accent: hsl(hue($color-primary), 100%, 50%) !default
$primary-accent: #0bd
$color-secondary: #f42942 !default $color-secondary: #f42942 !default
$color-secondary-light: hsl(hue($color-secondary), 30%, 90%) !default $color-secondary-light: hsl(hue($color-secondary), 30%, 90%) !default
@@ -156,3 +157,5 @@ $tooltip-max-width: auto
$tooltip-opacity: 1 $tooltip-opacity: 1
$nav-link-height: 37px $nav-link-height: 37px
$navbar-padding-x: 0
$navbar-padding-y: 0

5
src/styles/_notifications.sass
View File

@@ -24,13 +24,16 @@
color: $color-secondary color: $color-secondary
#notifications-toggle #notifications-toggle
color: $color-text
cursor: pointer cursor: pointer
font-size: 1.5em
position: relative position: relative
user-select: none user-select: none
> i:before > i:before
content: '\e815' content: '\e815'
font-size: 1.3em
position: relative
top: 2px
&.has-notifications &.has-notifications
> i:before > i:before

2
src/styles/_project.sass
View File

@@ -77,6 +77,8 @@ body.workshops
a a
color: $primary color: $primary
i
+active-gradient
a a
align-items: center align-items: center

7
src/styles/_utils.sass
View File

@@ -659,6 +659,9 @@
.user-select-none .user-select-none
user-select: none user-select: none
.pointer-events-none
pointer-events: none
// Bootstrap has .img-fluid, a class to limit the width of an image to 100%. // Bootstrap has .img-fluid, a class to limit the width of an image to 100%.
// .imgs-fluid below is to be applied on a parent container when we can't add // .imgs-fluid below is to be applied on a parent container when we can't add
// classes to the images themselves. e.g. the blog. // classes to the images themselves. e.g. the blog.
@@ -677,7 +680,7 @@
-webkit-text-fill-color: transparent -webkit-text-fill-color: transparent
=active-gradient =active-gradient
+text-gradient(#0cc, $primary) +text-gradient($primary-accent, $primary)
&:before &:before
+text-gradient(#0cc, $primary) +text-gradient($primary-accent, $primary)

3
src/styles/components/_card.sass
View File

@@ -98,6 +98,7 @@
i i
opacity: .2 opacity: .2
/* Tiny label for cards. e.g. 'WATCHED' on videos. */
.card-label .card-label
background-color: rgba($black, .5) background-color: rgba($black, .5)
border-radius: 3px border-radius: 3px
@@ -105,7 +106,7 @@
display: block display: block
font-size: $font-size-xxs font-size: $font-size-xxs
left: 5px left: 5px
top: -25px top: -27px // enough to be above the progress-bar
position: absolute position: absolute
padding: 1px 5px padding: 1px 5px
z-index: 1 z-index: 1