xwx.moe/el.xwx.moe
xwx.moe/ el.xwx.moe
1
0
Disbranĉigi 0
Fontkodo Issues Tirpetoj Actions Packages Projects Eldonoj Wiki Activity

minor rendering fix

This commit is contained in:
Daniel 2023-09-05 16:04:34 -04:00
parent 4365547867
commit 85788cb9ff
2 changed files with 3 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
components/Modal/Link/LinkDetails.tsx
View File

@ -76,9 +76,6 @@ export default function LinkDetails({ link, isOwnerOrMod }: Props) {
useEffect(() => { useEffect(() => {
const banner = document.getElementById("link-banner"); const banner = document.getElementById("link-banner");
const bannerInner = document.getElementById("link-banner-inner"); const bannerInner = document.getElementById("link-banner-inner");
const bannerOut = document.getElementById("link-banner-outside");
if (theme === "dark") bannerOut?.classList.toggle("banner-dark-mode");
if (colorPalette && banner && bannerInner) { if (colorPalette && banner && bannerInner) {
banner.style.background = `linear-gradient(to right, ${rgbToHex( banner.style.background = `linear-gradient(to right, ${rgbToHex(
@ -124,10 +121,9 @@ export default function LinkDetails({ link, isOwnerOrMod }: Props) {
return ( return (
<div <div
id="link-banner-outside"
className={`flex flex-col gap-3 sm:w-[35rem] w-80 ${ className={`flex flex-col gap-3 sm:w-[35rem] w-80 ${
isOwnerOrMod ? "" : "mt-12" isOwnerOrMod ? "" : "mt-12"
}`} } ${theme === "dark" ? "banner-dark-mode" : "banner-light-mode"}`}
> >
{!imageError && ( {!imageError && (
<div id="link-banner" className="link-banner h-32 -mx-5 -mt-5 relative"> <div id="link-banner" className="link-banner h-32 -mx-5 -mt-5 relative">

4
styles/globals.css
View File

@ -166,14 +166,14 @@
} }
/* For light mode */ /* For light mode */
.link-banner::after { .banner-light-mode .link-banner::after {
background-image: linear-gradient( background-image: linear-gradient(
to bottom, to bottom,
rgba(255, 255, 255, 0), rgba(255, 255, 255, 0),
rgba(255, 255, 255, 1) 90% rgba(255, 255, 255, 1) 90%
); );
} }
.link-banner::before { .banner-light-mode .link-banner::before {
background-image: linear-gradient( background-image: linear-gradient(
to top, to top,
rgba(255, 255, 255, 0), rgba(255, 255, 255, 0),