From 1f3ed66f97445375ae178bd205634656cad3bf84 Mon Sep 17 00:00:00 2001 From: db-2001 Date: Sun, 29 Oct 2023 22:24:16 -0400 Subject: [PATCH] Fixes after merge broke some stuff --- Website/interaction.js | 10 ++++---- Website/styles/style_default.css | 40 +++++++++++--------------------- 2 files changed, 19 insertions(+), 31 deletions(-) diff --git a/Website/interaction.js b/Website/interaction.js index 38fdf89..859de7f 100644 --- a/Website/interaction.js +++ b/Website/interaction.js @@ -82,10 +82,10 @@ function Setup(){ ResetContent(); UpdateJobs(); GetSettings().then((json) => { - console.log(json); + //console.log(json); settingDownloadLocation.innerText = json.downloadLocation; settingApiUri.placeholder = apiUri; - console.log(json.styleSheet); + //console.log(json.styleSheet); if (json.styleSheet == 'hover') { settingMangaHoverCheckbox.checked = true; document.getElementById('pagestyle').setAttribute('href', 'styles/style_mangahover.css'); @@ -299,7 +299,7 @@ function OpenSettings(){ //console.log(json); settingDownloadLocation.innerText = json.downloadLocation; settingApiUri.placeholder = apiUri; - console.log(json.styleSheet); + //console.log(json.styleSheet); if (json.styleSheet == 'hover') { settingMangaHoverCheckbox.checked = true; document.getElementById('pagestyle').setAttribute('href', 'styles/style_mangahover.css'); @@ -368,10 +368,10 @@ function UpdateSettings(){ // If the checkbox is checked, set the style to style_mangahover.css and if (document.getElementById("mangaHoverCheckbox").checked == true){ ChangeStyleSheet('hover') - console.log('Changing theme to mangahover') + //console.log('Changing theme to mangahover') } else { ChangeStyleSheet('default'); - console.log('Changing theme to default') + //console.log('Changing theme to default') } if(settingKomgaUrl.value != "" && diff --git a/Website/styles/style_default.css b/Website/styles/style_default.css index f468079..19c0f52 100644 --- a/Website/styles/style_default.css +++ b/Website/styles/style_default.css @@ -1,4 +1,4 @@ -:root{ +:root{ --background-color: #030304; --second-background-color: #fff; --primary-color: #f5a9b8; @@ -208,29 +208,23 @@ publication{ flex-shrink: 0; } -publication:hover { - background-color: black; -} - -publication:hover > img { - opacity: 0.5; -} - -publication:hover > publication-information { - display: flex; - opacity:1; -} - publication::after{ content: ''; position: absolute; left: 0; top: 0; border-radius: 5px; width: 100%; height: 100%; + background: linear-gradient(rgba(0,0,0,0.8), rgba(0, 0, 0, 0.7),rgba(0, 0, 0, 0.2)); } publication-information { - display: none; + display: flex; + flex-direction: column; + justify-content: start; +} + +publication-details { + display: flex; flex-direction: column; justify-content: start; } @@ -240,6 +234,11 @@ publication-information * { color: var(--accent-color); } +publication-details * { + z-index: 1; + color: var(--accent-color); +} + connector-name{ width: fit-content; margin: 10px 0; @@ -251,17 +250,6 @@ publication-name{ font-weight: bold; } -publication-details { - display: flex; - flex-direction: column; - justify-content: start; -} - -publication-details * { - z-index: 1; - color: var(--accent-color); -} - publication img { position: absolute; top: 0;