vitalif
/
react-toolbox
1
0
Fork 0
Code Issues Pull Requests Releases 12 Wiki Activity

More refactoring for sass variables

old
Javi Velasco 2015-10-21 01:05:57 +02:00
parent d109841c64
commit 786dd59c4c
9 changed files with 16 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
components/_globals.scss
View File

@ -1,10 +1,10 @@
//-- Color configuration
$color-divider: unquote("rgb(#{$palette-grey-200})") !default;
$color-background: unquote("rgb(#{$color-white})") !default;
$color-overlay: unquote("rgb(#{$color-black})");
$color-overlay-opacity: 0.5;
$color-text: unquote("rgb(#{$palette-grey-900})") !default;
$color-text-secondary: unquote("rgb(#{$palette-grey-600})") !default;
$color-overlay: unquote("rgb(#{$color-black})");
$color-overlay-opacity: 0.5;
$color-primary: $palette-blue-500 !default;
$color-primary-dark: $palette-blue-700 !default;
@ -15,7 +15,6 @@ $color-accent-contrast: $color-dark-contrast !default;
//-- Sizing
$unit: 1rem;
$border-radius: 0.2 * $unit;
// -- Fonts
$preferred-font: "Roboto", "Helvetica", "Arial", sans-serif !default;

1
components/dialog/_config.scss
View File

@ -1,3 +1,4 @@
$dialog-border-radius: .2 * $unit;
$dialog-color-title: unquote("rgb(#{$color-black})") !default;
$dialog-color-white: unquote("rgb(#{$color-white})") !default;
$dialog-content-padding: 2.4 * $unit;

14
components/dialog/style.scss
View File

@ -10,11 +10,11 @@
width: 100vw;
height: 100vh;
flex-direction: column;
align-items: center;
pointer-events: none;
justify-content: center;
align-content: center;
align-items: center;
> .content {
opacity: 0;
transform: translateY(-$dialog-translate-y);
@ -40,7 +40,7 @@
max-height: 96vh;
flex-direction: column;
background-color: $dialog-color-white;
border-radius: $border-radius;
border-radius: $dialog-border-radius;
box-shadow: $zdepth-shadow-5;
transition-delay: $animation-delay;
transition-timing-function: $animation-curve-default;
@ -50,22 +50,22 @@
.title {
@include typo-title();
flex-grow: 0;
margin-bottom: 1.6 * $unit;
color: $dialog-color-title;
flex-grow: 0;
}
.body {
flex-grow: 2;
padding: $dialog-content-padding;
overflow-y: scroll;
color: $color-text-secondary;
flex-grow: 2;
}
.navigation {
flex-grow: 0;
padding: $dialog-navigation-padding;
text-align: right;
flex-grow: 0;
}
.button {
@ -77,11 +77,9 @@
.active {
pointer-events: all;
> .overlay {
opacity: $color-overlay-opacity;
}
> .content {
opacity: 1;
transform: translateY(0%);

1
components/dropdown/_config.scss
View File

@ -4,3 +4,4 @@ $dropdown-color-primary: unquote("rgb(#{$color-primary})");
$dropdown-color-primary-contrast: unquote("rgb(#{$color-primary-contrast})");
$dropdown-value-hover-background: unquote("rgb(#{$palette-grey-200})");
$dropdown-overflow-max-height: 45vh;
$dropdown-value-border-radius: .2 * $unit;

2
components/dropdown/style.scss
View File

@ -50,7 +50,7 @@
overflow-y: scroll;
list-style: none;
background-color: $dropdown-color-white;
border-radius: $border-radius;
border-radius: $dropdown-value-border-radius;
transition-timing-function: $animation-curve-default;
transition-duration: $animation-duration;
transition-property: max-height, box-shadow;

3
components/menu/_config.scss
View File

@ -3,12 +3,11 @@ $menu-fade-duration: .2s !default;
$menu-ripple-delay: .3s !default;
$menu-background-color: unquote("rgb(#{$color-white})");
$menu-padding: .8 * $unit 0;
$menu-outline-border-radius: .2 * $unit;
$menu-item-hover-background: unquote("rgb(#{$palette-grey-200})");
$menu-item-icon-font-size: 2.4 * $unit;
$menu-item-icon-size: 1.6 * $menu-item-icon-font-size;
$menu-item-height: 4.8 * $unit;
$menu-item-padding: 1.6 * $unit;
$menu-item-font-size: 1.6 * $unit;
$menu-divider-height: (4.8 * $unit) / 4;

2
components/menu/style.menu.scss
View File

@ -82,7 +82,7 @@
left: 0;
display: block;
background-color: $menu-background-color;
border-radius: $border-radius;
border-radius: $menu-outline-border-radius;
}
.menu {

3
components/snackbar/_config.scss
View File

@ -1,5 +1,6 @@
$snackbar-background-color: $color-text !default;
$snackbar-border-radius: .2 * $unit;
$snackbar-button-offset: 4.8 * $unit;
$snackbar-color: unquote("rgb(#{$color-white})") !default;
$snackbar-horizontal-offset: 2.4 * $unit;
$snackbar-vertical-offset: 1.4 * $unit;
$snackbar-button-offset: 4.8 * $unit;

2
components/snackbar/style.scss
View File

@ -13,7 +13,7 @@
margin-top: $snackbar-vertical-offset;
color: $snackbar-color;
background-color: $snackbar-background-color;
border-radius: $border-radius;
border-radius: $snackbar-border-radius;
transition: all $animation-duration $animation-curve-default $animation-duration;
&.accept .button {
color: green;