site/assets/synth.download/sharkey/sharkey.css
Ruben cf6d7a89ad
All checks were successful
/ build (push) Successful in 31s
disable animation for sidebar as well
2025-05-10 03:42:49 -05:00

113 lines
3.8 KiB
CSS

/* this SHOULD just be the landing page, and shouldn't effect anything else */
#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 */
[class^="pages-welcome-entrance-a-shape1-"], [class^="pages-welcome-entrance-a-shape2-"], [class^="pages-welcome-timeline-root-"] {
display: none;
}
/* color text appropriately */
[class^="pages-welcome-entrance-a-logoWrapper-"] [class^="pages-welcome-entrance-a-poweredBy-"] {
color: var(--MI_THEME-fg);
}
/* re-centers the background due to shape1/2 being removed
* as well as also replacing it with one that allows us to animate it with a pattern */
[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;
}
/* the main instance info page thing */
[class^="pages-welcome-entrance-a-contents-"] {
margin-left: auto !important;
margin-right: auto !important;
padding: 130px 0;
/* blurred background effect behind instance information */
[class^="MkVisitorDashboard-root-"]::before {
position: absolute;
content: '';
top: .5rem;
left: -1.7rem;
width: 34.1rem;
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;
}
/* 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 */
[class^="pages-welcome-entrance-a-federation-"] {
bottom: unset !important;
top: 16px !important;
z-index: 50 !important;
}
}
/* sidebar */
[class^="visitor-side-"] {
background: linear-gradient(var(--MI_THEME-bg), var(--MI_THEME-accent));
/* banner image */
[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;
}
}
}
/* animation for the background on the landing page */
@keyframes animatebg {
0% { background-position: 0px 0px; }
100% { background-position: -960px -960px; }
}
/* disable the background animation if browser doesn't want animations */
@media (prefers-reduced-motion) {
#sharkey_app [class^="visitor-root-"] {
[class^="visitor-main-"] [class^="visitor-content-"] {
[class^="MkFeaturedPhotos-root-"] {
animation: unset !important;
}
}
[class^="visitor-side-"] {
[class^="visitor-banner-"] {
animation: unset !important;
}
}
}
}