js/webawesome
1
0
Fork 0
mirror of https://github.com/shoelace-style/webawesome.git synced 2026-01-12 12:09:26 +00:00
Code Issues Packages Projects Releases Wiki Activity

Add button vars and scope modifiers

Browse Source
This commit is contained in:
Cory LaViska
2017-08-11 17:04:29 -04:00
parent f70b1a2120
commit fd4b9fc56d
3 changed files with 15 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
dist/shoelace.css vendored
View File

File diff suppressed because one or more lines are too long

10
source/css/buttons.css
View File

@@ -11,7 +11,7 @@ button,
background-color: var(--button-bg-color-primary);
border-radius: var(--button-border-radius);
border: none;
height: var(--input-height);
height: var(--button-height);
line-height: 1;
user-select: none;
vertical-align: middle;
@@ -24,14 +24,14 @@ button,
}
.button-small {
font-size: calc(var(--button-font-size) * .8);
height: var(--input-height-small);
--button-font-size: var(--button-font-size-small);
--button-height: var(--button-height-small);
padding: calc(var(--component-spacing) * .25) calc(var(--component-spacing) * .5);
}
.button-big {
font-size: calc(var(--button-font-size) * 1.2);
height: var(--input-height-big);
--button-font-size: var(--button-font-size-big);
--button-height: var(--button-height-big);
padding: calc(var(--component-spacing) * .75) calc(var(--component-spacing) * 1);
}

11
source/css/variables.css
View File

@@ -133,9 +133,14 @@
--badge-spacing-y: .2em;
/* Buttons */
--button-font-family: inherit;
--button-font-weight: inherit;
--button-font-size: var(--font-size);
--button-font-family: var(--input-font-family);
--button-font-weight: var(--input-font-weight);
--button-font-size: var(--input-font-size);
--button-font-size-small: var(--input-font-size-small);
--button-font-size-big: var(--input-font-size-big);
--button-height: var(--input-height);
--button-height-small: var(--input-height-small);
--button-height-big: var(--input-height-big);
--button-color: var(--color-white);
--button-border-radius: var(--component-border-radius);
--button-box-shadow: inset 0 2px 0 rgba(255, 255, 255, .1), inset 0 -2px 0 rgba(0, 0, 0, .1);