archive/attract
0
0
Fork 0
Code Issues 7 Pull Requests Projects Releases Wiki Activity

Replace duplicated status-{{status}} classes for a nice Sass mixin

Browse Source 
Set the color for a specified property
1: $property: e.g. background-color
2: $where: ':before', ' .class-name', etc.
3: $variation: 'light', 'dark', or empty
e.g. @include status-color-property(background-color, ':before', 'light')
This commit is contained in:
Pablo Vazquez
2016-09-29 17:28:04 +02:00
parent e3e6657cf9
commit 37c0c23e83
4 changed files with 80 additions and 140 deletions
Download Patch File Download Diff File Expand all files Collapse all files

30
src/styles/_shots.sass
View File

@@ -39,31 +39,7 @@
.table-cell:last-child
box-shadow: inset -5px 0 0 $color-primary
&.status
&-invalid
.shot-status
background-color: $color-status-invalid-dark
&-todo
.shot-status
background-color: $color-status-todo-dark
&-in_progress
.shot-status
background-color: $color-status-in_progress-dark
&-on_hold
.shot-status
background-color: $color-status-on_hold-dark
&-approved
.shot-status
background-color: $color-status-approved-dark
&-cbb
.shot-status
background-color: $color-status-cbb-dark
&-final
.shot-status
background-color: $color-status-final-dark
&-review
.shot-status
background-color: $color-status-review-dark
@include status-color-property(background-color, ' .shot-status')
.table-cell
text-align: center
@@ -98,9 +74,11 @@
height: 100%
padding: 0 15px
transition: all 150ms ease-in-out
+status-background-color-before
@include status-color-property(background-color, ':before')
&:before
background-color: $color-background /* overriden by status-{{status}} */
display: block
content: ''
position: absolute