diff --git a/src/assets/css/default.css b/src/assets/css/default.css index 2d704856..e48c0861 100644 --- a/src/assets/css/default.css +++ b/src/assets/css/default.css @@ -1,6 +1,6 @@ :root { --lineHeight: 1.4285; - --wishPreviewHeight: min(30vh, 224px); + --wishPreviewHeight: min(30vh, 192px); --dimmerZIndex: 100; } @@ -75,7 +75,7 @@ figure { */ .wishlist .ui.card { --padding: 0.91666667em; - --buttonsHeight: calc(1em + 1.50em + 0.78571429em * 2 - 3px); + --buttonsHeight: calc((.92857143rem + 0.78571429em * 2) * 2 + 0.25em + 0.75em * 2 - 4px); } .wishlist .ui.card:focus-within { z-index: calc(var(--dimmerZIndex) + 2); @@ -84,6 +84,25 @@ figure { .wishlist .ui.fluid.card.stretch { height: 100%; } +.wishlist .ui.fluid.card.stretch::before { + position: absolute; + right: 0; + left: 0; + bottom: 0; + + height: 4em; + width: 100%; + + content: ''; + border-radius: .28571429rem; + + background-image: linear-gradient(0deg, rgba(255, 255, 255, 1) 0.75em, rgba(255, 255, 255, 0.9) 45%, rgba(255, 255, 255, 0) 100%); +} +@media (prefers-color-scheme: dark) { + .wishlist .ui.fluid.card.stretch::before { + background-image: linear-gradient(0deg, rgba(17, 17, 17, 1) 0.75em, rgba(17, 17, 17, 0.9) 45%, rgba(17, 17, 17, 0) 100%); + } +} /** Image */ .wishlist .ui.card > .image > svg { @@ -160,7 +179,7 @@ figure { /** Provider */ .wishlist .ui.card > .image, .wishlist .ui.card > .image > span.provider { - border-radius: .33333333rem .33333333rem 0 0; + border-radius: .28571429rem .28571429rem 0 0; } .wishlist .ui.card > .image > img.favicon, @@ -247,7 +266,7 @@ figure { /** Content */ .wishlist .ui.card > .content:not(.extra) { - height: calc(0.75 * var(--wishPreviewHeight)); + height: 20vh; overflow: auto; } @@ -289,24 +308,6 @@ figure { background-color: inherit; z-index: 2; } -.wishlist .ui.card > .extra.buttons::before { - position: absolute; - right: 0; - left: 0; - bottom: 100%; - - height: 4em; - width: 100%; - - content: ''; - - background-image: linear-gradient(0deg, rgba(255, 255, 255, 1) 0.75em, rgba(255, 255, 255, 0.9) 45%, rgba(255, 255, 255, 0) 100%); -} -@media (prefers-color-scheme: dark) { - .wishlist .ui.card > .extra.buttons::before { - background-image: linear-gradient(0deg, rgba(17, 17, 17, 1) 0.75em, rgba(17, 17, 17, 0.9) 45%, rgba(17, 17, 17, 0) 100%); - } -} @media (hover: hover) { .wishlist .ui.card > .extra.buttons { diff --git a/src/assets/css/default/dark.css b/src/assets/css/default/dark.css index 72d1ba8e..17366209 100644 --- a/src/assets/css/default/dark.css +++ b/src/assets/css/default/dark.css @@ -119,7 +119,7 @@ /** Buttons */ .wishlist .ui.card > .extra.buttons { - background-color: #111 !important; + background-color: transparent; } /** Dimmer */ diff --git a/src/classes/wish.php b/src/classes/wish.php index 29dce7e1..b068a2f6 100644 --- a/src/classes/wish.php +++ b/src/classes/wish.php @@ -245,6 +245,13 @@ class Wish + + + + +