diff --git a/static/style.css b/static/style.css index 2863ade..7e57c32 100644 --- a/static/style.css +++ b/static/style.css @@ -103,9 +103,10 @@ h3,h4,h5,h6{ height:36px; border:1px solid var(--504945); background:var(--282828); - border-radius:2px; + border-radius:6px; margin-bottom:10px; position:relative; + transition: 0.32s border; } .searchbox .wrapper{ @@ -141,6 +142,7 @@ h3,h4,h5,h6{ .searchbox:focus-within{ border:1px solid var(--928374); + transition: 0.32s border; } .autocomplete{ @@ -195,9 +197,12 @@ h3,h4,h5,h6{ text-decoration:underline; } -.tabs .tab.selected{ - border-bottom:2px solid var(--bdae93); -} +.tabs .tab.selected { + border-bottom: none; + background: var(--bdae93); + color: var(--1d2021); + border-radius: 6px; + } /* Filters */ .filters{ @@ -296,6 +301,31 @@ h3,h4,h5,h6{ font-size:12px; } + +.background span { + content: ""; + position: fixed; + top: 0px; + left: 0px; + width: 100%; + height: 100%; + backdrop-filter: blur(32px) contrast(0.5) brightness(0.2) saturate(0.42); + z-index: 0; + transition: 0.3s opacity; +} +img[src="/petals_dark.webp"] { + position: fixed !important; + z-index: -1; + top: 0px !important; + left: 0px !important; + width: 100% !important; + height: 100%; + object-fit: cover; + object-position: center; + transform: inherit !important; + transition: 0.15s opacity; +} + #mcaptcha__widget-container { width: 300px; height: 90px; @@ -314,7 +344,7 @@ h3,h4,h5,h6{ } .footer-start p, .footer-end p { display: flex; - gap: 6px; + gap: 12px; } @media screen and (max-width: 930px) { @@ -448,6 +478,7 @@ h3,h4,h5,h6{ /* text-result */ .web .text-result{ margin-bottom:30px; + position: relative; } .web .description{ @@ -469,8 +500,31 @@ h3,h4,h5,h6{ position:relative; } +.url { + background: var(--3c3836); + border-radius: 3rem; + width: max-content; + padding: 2px 12px 6px 12px; + font-size: 0px; + display: flex; + align-items: center; +} +.part:nth-child(3) { + font-size: 12px; + margin: 2px 0px -2px 0px; +} +.web .text-result .greentext { + position: absolute !important; + top: 5px !important; + right: 0px !important; + font-size: 12px !important; +} + +.url span { + display: none !important; +} + .web .url .part{ - font-size:15px; text-decoration:none; color:var(--928374); } @@ -498,7 +552,7 @@ h3,h4,h5,h6{ .web .text-result .title{ font-size:18px; color:var(--bdae93); - margin-bottom:7px; + margin-bottom:6px 0px 12px 0px !important; } .web .text-result a:visited .title{ @@ -575,8 +629,8 @@ h3,h4,h5,h6{ .web .favicon img, .favicon-dropdown img{ margin:3px 7px 0 0; - width:16px; - height:16px; + width:12px; + height:12px; font-size:12px; line-height:16px; text-align:center; @@ -635,14 +689,15 @@ h3,h4,h5,h6{ /* Next page */ .nextpage{ - margin:0 0 30px; - text-align:center; - display:block; - padding:10px; - border:1px solid var(--504945); - border-radius:2px; - text-decoration:none; - color:var(--bdae93); + margin: 0 0 30px; + text-align: center; + display: block; + border: 1px solid var(--504945); + border-radius: 3rem; + color: var(--bdae93); + width: max-content; + padding: 12px 24px; + text-decoration: none; } .nextpage:hover{ @@ -757,7 +812,7 @@ table tr a:last-child{ .web .spoiler-button{ display:block; border:1px solid var(--504945); - border-radius:2px; + border-radius:6px; line-height:30px; padding:0 7px; text-align:center; @@ -786,7 +841,7 @@ table tr a:last-child{ font-size:15px; color:var(--928374); background:var(--282828); - border:1px dashed var(--504945); + border-radius: 6px; } .web .info-table td{ @@ -801,7 +856,7 @@ table tr a:last-child{ } .web .info-table tr:nth-child(even){ - background:var(--1d2021); + background:var(--3c3836); } .web .sublinks{