diff options
Diffstat (limited to 'src/components/Widgets')
4 files changed, 18 insertions, 31 deletions
diff --git a/src/components/Widgets/RecentPosts/RecentPosts.module.scss b/src/components/Widgets/RecentPosts/RecentPosts.module.scss index 95ad7fe..dc580a1 100644 --- a/src/components/Widgets/RecentPosts/RecentPosts.module.scss +++ b/src/components/Widgets/RecentPosts/RecentPosts.module.scss @@ -37,11 +37,11 @@ border: fun.convert-px(3) solid var(--color-primary); border-radius: fun.convert-px(5); box-shadow: fun.convert-px(1) fun.convert-px(1) fun.convert-px(1) - var(--color-shadow-light), + var(--color-shadow), fun.convert-px(1) fun.convert-px(2) fun.convert-px(2) fun.convert-px(-2) - var(--color-shadow-light), + var(--color-shadow), fun.convert-px(3) fun.convert-px(4) fun.convert-px(5) fun.convert-px(-4) - var(--color-shadow-light); + var(--color-shadow); transition: all 0.3s ease-in-out 0s; &:hover, @@ -53,13 +53,13 @@ &:hover, &:focus { box-shadow: fun.convert-px(1) fun.convert-px(1) fun.convert-px(1) - var(--color-shadow-lighter), + var(--color-shadow-light), fun.convert-px(1) fun.convert-px(2) fun.convert-px(2) fun.convert-px(-2) - var(--color-shadow-lighter), + var(--color-shadow-light), fun.convert-px(3) fun.convert-px(4) fun.convert-px(5) fun.convert-px(-4) - var(--color-shadow-lighter), + var(--color-shadow-light), fun.convert-px(7) fun.convert-px(10) fun.convert-px(12) fun.convert-px(-3) - var(--color-shadow-lighter); + var(--color-shadow-light); transform: scale(1.05); } @@ -70,7 +70,7 @@ } &:active { - box-shadow: 0 0 0 0 var(--color-shadow-light); + box-shadow: 0 0 0 0 var(--color-shadow); transform: scale(0.95); .title { @@ -83,7 +83,7 @@ width: 100%; height: clamp(fun.convert-px(100), 20vw, fun.convert-px(150)); position: relative; - border: fun.convert-px(1) solid var(--color-border-light); + border: fun.convert-px(1) solid var(--color-border); } .meta { diff --git a/src/components/Widgets/Sharing/Sharing.module.scss b/src/components/Widgets/Sharing/Sharing.module.scss index 3477c88..c05a56b 100644 --- a/src/components/Widgets/Sharing/Sharing.module.scss +++ b/src/components/Widgets/Sharing/Sharing.module.scss @@ -22,28 +22,15 @@ align-items: center; padding: var(--spacing-2xs) var(--spacing-xs); border-radius: fun.convert-px(3); - color: var(--color-fg-inverted); font-weight: 600; text-decoration: none; - text-shadow: fun.convert-px(2) fun.convert-px(1) fun.convert-px(1) - var(--color-shadow-dark); transition: all 0.3s ease-in-out 0s; - @include mix.media("screen") { - @include mix.dimensions("sm") { - font-size: var(--font-size-sm); - } - } - &:hover, &:focus { color: hsl(0, 0%, 100%); transform: translateX(#{fun.convert-px(-3)}) translateY(#{fun.convert-px(-3)}); - - @include mix.motion("reduce") { - text-decoration: underline; - } } &:active { diff --git a/src/components/Widgets/SocialMedia/SocialMedia.module.scss b/src/components/Widgets/SocialMedia/SocialMedia.module.scss index c8ad759..5dfdcb7 100644 --- a/src/components/Widgets/SocialMedia/SocialMedia.module.scss +++ b/src/components/Widgets/SocialMedia/SocialMedia.module.scss @@ -15,24 +15,24 @@ height: 3em; background: none; box-shadow: fun.convert-px(1) fun.convert-px(1) fun.convert-px(1) - var(--color-shadow-light), + var(--color-shadow), fun.convert-px(1) fun.convert-px(2) fun.convert-px(2) fun.convert-px(-1) - var(--color-shadow-light), + var(--color-shadow), fun.convert-px(3) fun.convert-px(4) fun.convert-px(4) fun.convert-px(-3) - var(--color-shadow-light), + var(--color-shadow), 0 0 0 0 var(--color-shadow); transition: all 0.3s linear 0s; &:hover, &:focus { box-shadow: fun.convert-px(1) fun.convert-px(1) fun.convert-px(1) - var(--color-shadow-light), + var(--color-shadow), fun.convert-px(1) fun.convert-px(1) fun.convert-px(2) fun.convert-px(-1) - var(--color-shadow-lighter), + var(--color-shadow-light), fun.convert-px(3) fun.convert-px(3) fun.convert-px(4) fun.convert-px(-4) - var(--color-shadow-lighter), + var(--color-shadow-light), fun.convert-px(6) fun.convert-px(6) fun.convert-px(10) fun.convert-px(-3) - var(--color-shadow-light); + var(--color-shadow); transform: scale(1.15); } @@ -41,7 +41,7 @@ } &:active { - box-shadow: 0 0 0 0 var(--color-shadow-light); + box-shadow: 0 0 0 0 var(--color-shadow); outline: none; transform: scale(0.9); } diff --git a/src/components/Widgets/ToC/ToC.module.scss b/src/components/Widgets/ToC/ToC.module.scss index a296659..a863a34 100644 --- a/src/components/Widgets/ToC/ToC.module.scss +++ b/src/components/Widgets/ToC/ToC.module.scss @@ -16,7 +16,7 @@ width: 100%; padding: var(--spacing-2xs) var(--spacing-sm); background: none; - border-bottom: fun.convert-px(1) solid var(--color-border-lighter); + border-bottom: fun.convert-px(1) solid var(--color-border-light); text-decoration: underline solid transparent 0; transition: all 0.16s ease-in-out 0s, text-decoration-color 0s; |