diff options
Diffstat (limited to 'assets')
| -rw-r--r-- | assets/css/components/_card.scss | 14 | ||||
| -rw-r--r-- | assets/css/components/_project.scss | 2 |
2 files changed, 15 insertions, 1 deletions
diff --git a/assets/css/components/_card.scss b/assets/css/components/_card.scss index 9e73dd9..7bd76f3 100644 --- a/assets/css/components/_card.scss +++ b/assets/css/components/_card.scss | |||
| @@ -29,6 +29,16 @@ | |||
| 29 | background-color: prop(--colors --bg); | 29 | background-color: prop(--colors --bg); |
| 30 | line-height: 1.4; | 30 | line-height: 1.4; |
| 31 | 31 | ||
| 32 | &::after { | ||
| 33 | content: ''; | ||
| 34 | display: none; | ||
| 35 | position: absolute; | ||
| 36 | top: 100%; | ||
| 37 | left: 0; | ||
| 38 | width: 100%; | ||
| 39 | height: calc(-1 * #{prop(--dims --hover-offset)}); | ||
| 40 | } | ||
| 41 | |||
| 32 | small, | 42 | small, |
| 33 | strong { | 43 | strong { |
| 34 | transition: background-color .2s, color .2s; | 44 | transition: background-color .2s, color .2s; |
| @@ -43,6 +53,10 @@ | |||
| 43 | transform: translateY(#{prop(--dims --hover-offset)}); | 53 | transform: translateY(#{prop(--dims --hover-offset)}); |
| 44 | background-color: prop(--colors --hover --bg); | 54 | background-color: prop(--colors --hover --bg); |
| 45 | color: prop(--colors --hover --fg); | 55 | color: prop(--colors --hover --fg); |
| 56 | |||
| 57 | &::after { | ||
| 58 | display: block; | ||
| 59 | } | ||
| 46 | 60 | ||
| 47 | small, | 61 | small, |
| 48 | strong { | 62 | strong { |
diff --git a/assets/css/components/_project.scss b/assets/css/components/_project.scss index 04efb1e..301827c 100644 --- a/assets/css/components/_project.scss +++ b/assets/css/components/_project.scss | |||
| @@ -35,7 +35,7 @@ | |||
| 35 | transform: translateY(#{prop(--card --dims --hover-offset, $global: true)}); | 35 | transform: translateY(#{prop(--card --dims --hover-offset, $global: true)}); |
| 36 | background-color: prop(--card --colors --hover --bg, $global: true); | 36 | background-color: prop(--card --colors --hover --bg, $global: true); |
| 37 | color: prop(--card --colors --hover --fg, $global: true); | 37 | color: prop(--card --colors --hover --fg, $global: true); |
| 38 | 38 | ||
| 39 | small, | 39 | small, |
| 40 | strong { | 40 | strong { |
| 41 | color: prop(--card --colors --hover --fg, $global: true); | 41 | color: prop(--card --colors --hover --fg, $global: true); |
