YourWishes/domsPlace
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Moved Button design to appropriate variables.

Browse Source
This commit is contained in:
Dominic Masters
2018-05-14 08:44:24 +10:00
parent 696789c3ae
commit 1e55aa17e9
2 changed files with 21 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
public/styles/objects/_button.scss
View File

@ -3,6 +3,8 @@
* Clicky Tappy Touchy Buttons! * Clicky Tappy Touchy Buttons!
* *
* Dependencies: * Dependencies:
* styles/settings/animation.scss
* styles/settings/colors.scss
* styles/tools/_gradient.scss * styles/tools/_gradient.scss
* *
* *
@ -10,14 +12,18 @@
* 1.0.1 - 2018/05/14 * 1.0.1 - 2018/05/14
*/ */
.o-btn { .o-btn {
position: relative;
display: inline-block; display: inline-block;
cursor: pointer; cursor: pointer;
border: 1px solid #DDD; border: $s-color--btn-default__border;
border-radius: 4px; padding: 1em 1em;
padding: 0.5em 1.25em; transition: all 0.2s $s-animation--ease-out;
@include t-vertical-gradient(#FFF, #FBFBFB); @include t-horizontal-gradient($s-color--btn-default__top, $s-color--btn-default__bottom);
&:hover {
@include t-vertical-gradient($s-color--btn-default-hover__top, $s-color--btn-default-hover__bottom);
}
} }

9
public/styles/settings/colors.scss
View File

@ -42,3 +42,12 @@ $s-color--navbar__bar-active: $s-color--pastel-green;
//loader //loader
$s-color--loader: $s-color--swatch-blue; $s-color--loader: $s-color--swatch-blue;
/*** Buttons and Inputs ***/
//Button Default
$s-color--btn-default__top: #FFF;
$s-color--btn-default__bottom: #FBFBFB;
$s-color--btn-default__border: 1px solid #DDD;
$s-color--btn-default-hover__top: $s-color--btn-default__bottom;
$s-color--btn-default-hover__bottom: #EEE;