update synth.download css

This commit is contained in:
Ruben 2025-05-10 03:18:51 -05:00
commit a36e3da19e
No known key found for this signature in database
GPG key ID: AE181294E97E4802
2 changed files with 39 additions and 68 deletions

View file

@ -1,15 +1,15 @@
/* this SHOULD just be the landing page, and shouldn't effect anything else */
#sharkey_app .mk-app {
.main .contents:has([class^="pages-welcome-timeline-root-"]) {
#sharkey_app [class^="visitor-root-"] {
[class^="visitor-main-"] [class^="visitor-content-"] {
/* multiple elements i'd prefer hidden
* shape1 and shape2 refer to the weird shape things on the left
* pages-welcome-timeline-root refers to the scrolling and very buggy timeline on the right */
.shape1, .shape2, [class^="pages-welcome-timeline-root-"] {
[class^="pages-welcome-entrance-a-shape1-"], [class^="pages-welcome-entrance-a-shape2-"], [class^="pages-welcome-timeline-root-"] {
display: none;
}
/* color text appropriately */
.logo-wrapper {
[class^="pages-welcome-entrance-a-logoWrapper-"] [class^="pages-welcome-entrance-a-poweredBy-"] {
color: var(--MI_THEME-fg);
}
@ -24,22 +24,23 @@
width: 100% !important;
height: 100% !important;
opacity: .8;
animation: animatebg 60s linear infinite;
animation: animatebg 100s linear infinite;
}
/* the main instance info page thing */
.contents {
[class^="pages-welcome-entrance-a-contents-"] {
margin-left: auto !important;
margin-right: auto !important;
padding: 130px 0;
/* larger width so the contents of the instance info doesn't end up being squished inside with the background */
width: min(480px,100% - 32px);
transition: width .2s;
/* margins around the instance info stuff to fit the background */
[class^="MkVisitorDashboard-root-"] {
padding: 1.5rem;
/* blurred background effect behind instance information */
[class^="MkVisitorDashboard-root-"]::before {
position: absolute;
content: '';
top: .5rem;
left: -1.7rem;
width: 34rem;
height: 132.4rem;
background: var(--MI_THEME-acrylicPanel);
-webkit-backdrop-filter: var(--MI-blur, blur(15px));
backdrop-filter: var(--MI-blur, blur(15px));
@ -47,53 +48,43 @@
transition: padding .2s;
}
/* instance stats - i don't like these being displayed right on the front page */
[class^="MkVisitorDashboard-stats-"] {
display: none !important;
/* instance stats - i don't like these being displayed right on the front page
* disabled, nice to keep probably
* [class^="MkVisitorDashboard-stats-"] {
* display: none !important;
} */
/* expand the timeline widget view */
[class^="MkVisitorDashboard-tl-"] {
[class^="MkVisitorDashboard-tlBody-"] {
height: 50rem !important;
}
}
}
/* federation scrolling bar thingy */
.federation {
[class^="pages-welcome-entrance-a-federation-"] {
bottom: unset !important;
top: 16px !important;
z-index: 50 !important;
}
/* expand the timeline widget view */
[class^="MkVisitorDashboard-tl-"] {
[class^="MkVisitorDashboard-tlBody-"] {
height: 600px !important;
}
}
}
/* contents on the sidebar, usually only visible when viewing content directly while logged out */
.side:has(.dashboard) {
background: unset !important;
/* sidebar */
[class^="visitor-side-"] {
background: linear-gradient(var(--MI_THEME-bg), var(--MI_THEME-accent));
/* reuse the banner as the background */
.banner {
/* banner image */
[class^="visitor-banner-"] {
background-image: url("https://booping.s3.us-east-005.backblazeb2.com/assets/synth+grid+bg.png") !important;
height: 100%;
background-repeat: repeat;
background-size: auto;
aspect-ratio: unset !important;
top: 0 !important;
left: 0 !important;
width: 100% !important;
height: 100% !important;
opacity: .8;
animation: animatebg 60s linear infinite;
}
.dashboard {
[class^="MkVisitorDashboard-root-"] {
/* repeating our edits from above */
[class^="MkVisitorDashboard-stats-"] {
display: none !important;
}
[class^="MkVisitorDashboard-tl-"] [class^="MkVisitorDashboard-tlBody-"] {
height: 600px !important;
}
}
animation: animatebg 100s linear infinite;
}
}
}
@ -104,34 +95,13 @@
100% { background-position: -960px -960px; }
}
/* shrinks down the blur margins on instance info if display is small enough */
@media screen and (max-width: 515px) {
.main .contents {
.contents {
/* restore original values */
width: min(430px,100% - 32px) !important;
transition: width .2s;
/* margins around the instance info stuff to fit the background */
[class^="MkVisitorDashboard-root-"] {
padding: .5rem !important;
transition: padding .2s;
}
}
}
}
/* disable the background animation if browser doesn't want animations */
@media (prefers-reduced-motion) {
.main .contents:has([class^="pages-welcome-timeline-root-"]) {
#sharkey_app [class^="visitor-root-"] {
[class^="visitor-main-"] [class^="visitor-content-"] {
[class^="MkFeaturedPhotos-root-"] {
animation: unset !important;
}
}
.side:has(.dashboard) {
.banner {
animation: unset !important;
}
}
}

View file

@ -0,0 +1 @@
#sharkey_app [class^="visitor-root-"] {[class^="visitor-main-"] [class^="visitor-content-"] {[class^="pages-welcome-entrance-a-shape1-"], [class^="pages-welcome-entrance-a-shape2-"], [class^="pages-welcome-timeline-root-"] {display: none;}[class^="pages-welcome-entrance-a-logoWrapper-"] [class^="pages-welcome-entrance-a-poweredBy-"] {color: var(--MI_THEME-fg);}[class^="MkFeaturedPhotos-root-"] {background-image: url("https://booping.s3.us-east-005.backblazeb2.com/assets/synth+grid+bg.png") !important;background-repeat: repeat;background-size: auto;top: 0 !important;left: 0 !important;width: 100% !important;height: 100% !important;opacity: .8;animation: animatebg 100s linear infinite;}[class^="pages-welcome-entrance-a-contents-"] {margin-left: auto !important;margin-right: auto !important;padding: 130px 0;[class^="MkVisitorDashboard-root-"]::before {position: absolute;content: '';top: .5rem;left: -1.7rem;width: 34rem;height: 132.4rem;background: var(--MI_THEME-acrylicPanel);-webkit-backdrop-filter: var(--MI-blur, blur(15px));backdrop-filter: var(--MI-blur, blur(15px));border-radius: var(--MI-radius-ellipse);transition: padding .2s;}[class^="MkVisitorDashboard-tl-"] {[class^="MkVisitorDashboard-tlBody-"] {height: 50rem !important;}}}[class^="pages-welcome-entrance-a-federation-"] {bottom: unset !important;top: 16px !important;z-index: 50 !important;}}[class^="visitor-side-"] {background: linear-gradient(var(--MI_THEME-bg), var(--MI_THEME-accent));[class^="visitor-banner-"] {background-image: url("https://booping.s3.us-east-005.backblazeb2.com/assets/synth+grid+bg.png") !important;background-repeat: repeat;background-size: auto;top: 0 !important;left: 0 !important;width: 100% !important;height: 100% !important;opacity: .8;animation: animatebg 100s linear infinite;}}}@keyframes animatebg {0% {background-position: 0px 0px;}100% {background-position: -960px -960px;}}@media (prefers-reduced-motion) {#sharkey_app [class^="visitor-root-"] {[class^="visitor-main-"] [class^="visitor-content-"] {[class^="MkFeaturedPhotos-root-"] {animation: unset !important;}}}}