diff options
| author | sadbeast <sadbeast@sadbeast.com> | 2024-01-31 17:47:56 -0800 |
|---|---|---|
| committer | sadbeast <sadbeast@sadbeast.com> | 2024-01-31 17:47:56 -0800 |
| commit | 332ec93366315fa1ed7b4acd7a3407c96e8ddfa7 (patch) | |
| tree | 6ae553317f12a7a6a29c849c8805ffab96436dc2 /app/assets/stylesheets/components/_card.scss | |
| download | td-332ec93366315fa1ed7b4acd7a3407c96e8ddfa7.tar.gz td-332ec93366315fa1ed7b4acd7a3407c96e8ddfa7.tar.bz2 | |
Diffstat (limited to 'app/assets/stylesheets/components/_card.scss')
| -rw-r--r-- | app/assets/stylesheets/components/_card.scss | 36 |
1 files changed, 36 insertions, 0 deletions
diff --git a/app/assets/stylesheets/components/_card.scss b/app/assets/stylesheets/components/_card.scss new file mode 100644 index 0000000..924415e --- /dev/null +++ b/app/assets/stylesheets/components/_card.scss @@ -0,0 +1,36 @@ +/** + * Card (<article>) + */ + +article { + margin: var(--block-spacing-vertical) 0; + padding: var(--block-spacing-vertical) var(--block-spacing-horizontal); + border-radius: var(--border-radius); + background: var(--card-background-color); + box-shadow: var(--card-box-shadow); + + > header, + > footer { + margin-right: calc(var(--block-spacing-horizontal) * -1); + margin-left: calc(var(--block-spacing-horizontal) * -1); + padding: calc(var(--block-spacing-vertical) * 0.66) + var(--block-spacing-horizontal); + background-color: var(--card-sectionning-background-color); + } + + > header { + margin-top: calc(var(--block-spacing-vertical) * -1); + margin-bottom: var(--block-spacing-vertical); + border-bottom: var(--border-width) solid var(--card-border-color); + border-top-right-radius: var(--border-radius); + border-top-left-radius: var(--border-radius); + } + + > footer { + margin-top: var(--block-spacing-vertical); + margin-bottom: calc(var(--block-spacing-vertical) * -1); + border-top: var(--border-width) solid var(--card-border-color); + border-bottom-right-radius: var(--border-radius); + border-bottom-left-radius: var(--border-radius); + } +} |