Skip to content

Commit 9be1e6f

Browse files
author
Adrian Bece
committed
Add padding
1 parent a79ffc2 commit 9be1e6f

File tree

4 files changed

+18
-10
lines changed

4 files changed

+18
-10
lines changed

dist/clay.css

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

dist/clay.css.map

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

dist/clay.scss

Lines changed: 8 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,19 +1,22 @@
11
/* --- DEFAULT VALUES --- */
22
$default-background: rgba(0, 0, 0, 0.005);
33
$default-border-radius: 32px;
4-
$default-shadow-outset: 16px 0 48px 0 rgba(0, 0, 0, 0.5);
5-
$default-shadow-inset-primary: -8px -8px 16px 0 rgba(0, 0, 0, 0.6);
6-
$default-shadow-inset-secondary: 0px 12px 24px 0 rgb(255, 255, 255);
4+
$default-shadow-outset: 8px 8px 16px 0 rgba(0, 0, 0, 0.25);
5+
$default-shadow-inset-primary: -8px -8px 16px 0 rgba(0, 0, 0, 0.25);
6+
$default-shadow-inset-secondary: 8px 8px 16px 0 rgba(255, 255, 255, 0.2);
7+
$default-padding: $default-border-radius;
78

89
/* --- MIXIN --- */
910
@mixin clay(
1011
$background: $default-background,
1112
$border-radius: $default-border-radius,
1213
$shadow-outset: $default-shadow-outset,
1314
$shadow-inset-primary: $default-shadow-inset-primary,
14-
$shadow-inset-secondary: $default-shadow-inset-secondary
15+
$shadow-inset-secondary: $default-shadow-inset-secondary,
16+
$padding: $default-padding
1517
) {
1618
background-color: $background;
19+
padding: $padding;
1720
border-radius: var(--clay-border-radius, 32px);
1821
box-shadow: $shadow-outset, inset $shadow-inset-primary, inset $shadow-inset-secondary;
1922
}
@@ -22,6 +25,7 @@ $default-shadow-inset-secondary: 0px 12px 24px 0 rgb(255, 255, 255);
2225
.clay {
2326
@include clay(
2427
$background: var(--clay-background, $default-background),
28+
$padding: var(--clay-padding, $default-padding),
2529
$border-radius: var(--clay-border-radius, $default-border-radius),
2630
$shadow-outset: var(--clay-shadow-outset, $default-shadow-outset),
2731
$shadow-inset-primary: var(--clay-shadow-inset-primary, $default-shadow-inset-primary),

src/clay.scss

Lines changed: 8 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,19 +1,22 @@
11
/* --- DEFAULT VALUES --- */
22
$default-background: rgba(0, 0, 0, 0.005);
33
$default-border-radius: 32px;
4-
$default-shadow-outset: 16px 0 48px 0 rgba(0, 0, 0, 0.5);
5-
$default-shadow-inset-primary: -8px -8px 16px 0 rgba(0, 0, 0, 0.6);
6-
$default-shadow-inset-secondary: 0px 12px 24px 0 rgb(255, 255, 255);
4+
$default-shadow-outset: 8px 8px 16px 0 rgba(0, 0, 0, 0.25);
5+
$default-shadow-inset-primary: -8px -8px 16px 0 rgba(0, 0, 0, 0.25);
6+
$default-shadow-inset-secondary: 8px 8px 16px 0 rgba(255, 255, 255, 0.2);
7+
$default-padding: $default-border-radius;
78

89
/* --- MIXIN --- */
910
@mixin clay(
1011
$background: $default-background,
1112
$border-radius: $default-border-radius,
1213
$shadow-outset: $default-shadow-outset,
1314
$shadow-inset-primary: $default-shadow-inset-primary,
14-
$shadow-inset-secondary: $default-shadow-inset-secondary
15+
$shadow-inset-secondary: $default-shadow-inset-secondary,
16+
$padding: $default-padding
1517
) {
1618
background-color: $background;
19+
padding: $padding;
1720
border-radius: var(--clay-border-radius, 32px);
1821
box-shadow: $shadow-outset, inset $shadow-inset-primary, inset $shadow-inset-secondary;
1922
}
@@ -22,6 +25,7 @@ $default-shadow-inset-secondary: 0px 12px 24px 0 rgb(255, 255, 255);
2225
.clay {
2326
@include clay(
2427
$background: var(--clay-background, $default-background),
28+
$padding: var(--clay-padding, $default-padding),
2529
$border-radius: var(--clay-border-radius, $default-border-radius),
2630
$shadow-outset: var(--clay-shadow-outset, $default-shadow-outset),
2731
$shadow-inset-primary: var(--clay-shadow-inset-primary, $default-shadow-inset-primary),

0 commit comments

Comments
 (0)