diff options
Diffstat (limited to 'assets/css/components/_project.scss')
-rw-r--r-- | assets/css/components/_project.scss | 16 |
1 files changed, 10 insertions, 6 deletions
diff --git a/assets/css/components/_project.scss b/assets/css/components/_project.scss index 4f4cd1b..04efb1e 100644 --- a/assets/css/components/_project.scss +++ b/assets/css/components/_project.scss | |||
@@ -25,14 +25,21 @@ | |||
25 | &:visited { | 25 | &:visited { |
26 | color: currentColor; | 26 | color: currentColor; |
27 | text-decoration: none; | 27 | text-decoration: none; |
28 | 28 | ||
29 | &:hover { | 29 | &:hover { |
30 | @include element('picture') { | 30 | @include element('picture') { |
31 | opacity: .75; | 31 | opacity: .75; |
32 | } | 32 | } |
33 | 33 | ||
34 | @include element('card') { | 34 | @include element('card') { |
35 | transform: translateY(-1em); | 35 | transform: translateY(#{prop(--card --dims --hover-offset, $global: true)}); |
36 | background-color: prop(--card --colors --hover --bg, $global: true); | ||
37 | color: prop(--card --colors --hover --fg, $global: true); | ||
38 | |||
39 | small, | ||
40 | strong { | ||
41 | color: prop(--card --colors --hover --fg, $global: true); | ||
42 | } | ||
36 | } | 43 | } |
37 | } | 44 | } |
38 | } | 45 | } |
@@ -56,14 +63,11 @@ | |||
56 | bottom: 1em; | 63 | bottom: 1em; |
57 | min-width: 15em; | 64 | min-width: 15em; |
58 | max-width: calc(100% - 2em); | 65 | max-width: calc(100% - 2em); |
59 | transform: translateY(0); | 66 | box-shadow: 0 .3em 1em rgba(#000, .15); |
60 | transition: transform .2s; | ||
61 | box-shadow: 0 .3em 1em rgba(#000, .25); | ||
62 | } | 67 | } |
63 | 68 | ||
64 | @include element('picture') { | 69 | @include element('picture') { |
65 | transition: opacity .2s; | 70 | transition: opacity .2s; |
66 | opacity: 1; | ||
67 | } | 71 | } |
68 | 72 | ||
69 | @include media('<=sm') { | 73 | @include media('<=sm') { |