From 603c227d75723d3321b202d91596cdc9fd736283 Mon Sep 17 00:00:00 2001 From: Volpeon Date: Wed, 22 Dec 2021 08:55:42 +0100 Subject: Fixed contrast issues --- assets/css/_vars.scss | 2 +- assets/css/components/_card.scss | 8 ++++++-- 2 files changed, 7 insertions(+), 3 deletions(-) (limited to 'assets/css') diff --git a/assets/css/_vars.scss b/assets/css/_vars.scss index cf4af60..f6929a2 100644 --- a/assets/css/_vars.scss +++ b/assets/css/_vars.scss @@ -107,7 +107,7 @@ $content--width: 44rem; $gray2: hsl(220, 5%, 88%); $gray3: hsl(220, 5%, 83%); $gray4: hsl(220, 5%, 68%); - $gray5: hsl(220, 5%, 47%); + $gray5: hsl(220, 5%, 44%); $gray6: hsl(220, 5%, 16%); $gray7: hsl(220, 5%, 0%); diff --git a/assets/css/components/_card.scss b/assets/css/components/_card.scss index e1f92b0..2e32a48 100644 --- a/assets/css/components/_card.scss +++ b/assets/css/components/_card.scss @@ -75,7 +75,9 @@ @include element('row') { @include modifier('hidden') { - opacity: 1; + visibility: visible; + transition: opacity .2s; + opacity: 1; } } @@ -119,16 +121,18 @@ } @include modifier('hidden') { + visibility: hidden; position: absolute; z-index: 10; right: 0; bottom: 0; left: 0; - transition: opacity .2s; + transition: opacity .2s, visibility 0s .2s; opacity: 0; background-color: prop(--colors --hover --bg); @media (hover: none) { + visibility: visible; position: static; opacity: 1; background-color: transparent; -- cgit v1.2.3-70-g09d2