update sharkey css
This commit is contained in:
parent
484c611feb
commit
7f1b05d431
2 changed files with 136 additions and 97 deletions
|
|
@ -1,113 +1,152 @@
|
|||
/* 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;
|
||||
}
|
||||
#sharkey_app {
|
||||
[class^="visitor-root-"] {
|
||||
[class^="visitor-main-"] {
|
||||
/* home button should be more visible */
|
||||
[class^="visitor-homeButton-"] {
|
||||
background: var(--MI_THEME-accent) !important;
|
||||
color: var(--MI_THEME-fgOnAccent) !important;
|
||||
}
|
||||
|
||||
[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);
|
||||
}
|
||||
/* 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;
|
||||
}
|
||||
[class^="pages-welcome-entrance-a-misskey-"] {
|
||||
width: 120px !important;
|
||||
}
|
||||
}
|
||||
|
||||
/* give logo blurred background */
|
||||
[class^="pages-welcome-entrance-a-logoWrapper-"]::before {
|
||||
-webkit-backdrop-filter: var(--MI-blur, blur(15px));
|
||||
backdrop-filter: var(--MI-blur, blur(15px));
|
||||
background: var(--MI_THEME-acrylicPanel);
|
||||
border-radius: var(--MI-radius-ellipse);
|
||||
content: '';
|
||||
height: 6.5rem;
|
||||
left: -1rem;
|
||||
position: absolute;
|
||||
top: -1rem;
|
||||
width: 10.6rem;
|
||||
z-index: -5;
|
||||
}
|
||||
|
||||
/* the main instance info page thing */
|
||||
[class^="pages-welcome-entrance-a-contents-"] {
|
||||
margin-left: auto !important;
|
||||
margin-right: auto !important;
|
||||
padding: 130px 0;
|
||||
/* 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-"] {
|
||||
animation: animatebg 100s linear infinite;
|
||||
background-image: url("https://cdn.booping.synth.download/assets/synth+grid+bg.png") !important;
|
||||
background-repeat: repeat;
|
||||
background-size: auto;
|
||||
height: 100% !important;
|
||||
left: 0 !important;
|
||||
opacity: .8;
|
||||
top: 0 !important;
|
||||
width: 100% !important;
|
||||
}
|
||||
|
||||
/* 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;
|
||||
/* 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 {
|
||||
-webkit-backdrop-filter: var(--MI-blur, blur(15px));
|
||||
backdrop-filter: var(--MI-blur, blur(15px));
|
||||
background: var(--MI_THEME-acrylicPanel);
|
||||
border-radius: var(--MI-radius-ellipse);
|
||||
content: '';
|
||||
height: 129.1rem;
|
||||
left: -1.7rem;
|
||||
position: absolute;
|
||||
top: .5rem;
|
||||
transition: padding .2s;
|
||||
width: 34.1rem;
|
||||
}
|
||||
|
||||
/* 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-"] {
|
||||
animation: animatebg 100s linear infinite;
|
||||
background-image: url("https://cdn.booping.synth.download/assets/synth+grid+bg.png") !important;
|
||||
background-repeat: repeat;
|
||||
background-size: auto;
|
||||
height: 100% !important;
|
||||
left: 0 !important;
|
||||
opacity: .8;
|
||||
top: 0 !important;
|
||||
width: 100% !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;
|
||||
} */
|
||||
/* animation for the background on the landing page */
|
||||
@keyframes animatebg {
|
||||
0% { background-position: 0px 0px; }
|
||||
100% { background-position: -960px -960px; }
|
||||
}
|
||||
|
||||
/* expand the timeline widget view */
|
||||
[class^="MkVisitorDashboard-tl-"] {
|
||||
[class^="MkVisitorDashboard-tlBody-"] {
|
||||
height: 50rem !important;
|
||||
/* 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;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* federation scrolling bar thingy */
|
||||
[class^="pages-welcome-entrance-a-federation-"] {
|
||||
bottom: unset !important;
|
||||
top: 16px !important;
|
||||
z-index: 50 !important;
|
||||
}
|
||||
}
|
||||
/* any other styling - not specifically only applied to the visitor page/related */
|
||||
|
||||
/* 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;
|
||||
/* re-enable the pfps next to sharkey styled note boosts */
|
||||
[class^="SkNote-renote-"] {
|
||||
[class^="_noSelect MkAvatar-root-"] {
|
||||
display: unset !important;
|
||||
}
|
||||
}
|
||||
|
||||
[class^="visitor-side-"] {
|
||||
[class^="visitor-banner-"] {
|
||||
animation: unset !important;
|
||||
}
|
||||
/* thin border around reactions that aren't selectable */
|
||||
[class^="MkReactionsViewer-reaction-root-"]:not([class*="MkReactionsViewer-reaction-canToggle-"]) {
|
||||
border: solid 1px var(--MI_THEME-divider);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -1 +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: 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;}[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;}}[class^="visitor-side-"] {[class^="visitor-banner-"] {animation: unset !important;}}}}
|
||||
#sharkey_app {[class^="visitor-root-"] {[class^="visitor-main-"] {[class^="visitor-homeButton-"] {background: var(--MI_THEME-accent) !important;color: var(--MI_THEME-fgOnAccent) !important;}[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^="pages-welcome-entrance-a-misskey-"] {width: 120px !important;}}[class^="pages-welcome-entrance-a-logoWrapper-"]::before {-webkit-backdrop-filter: var(--MI-blur, blur(15px));backdrop-filter: var(--MI-blur, blur(15px));background: var(--MI_THEME-acrylicPanel);border-radius: var(--MI-radius-ellipse);content: '';height: 6.5rem;left: -1rem;position: absolute;top: -1rem;width: 10.6rem;z-index: -5;}[class^="MkFeaturedPhotos-root-"] {animation: animatebg 100s linear infinite;background-image: url("https://cdn.booping.synth.download/assets/synth+grid+bg.png") !important;background-repeat: repeat;background-size: auto;height: 100% !important;left: 0 !important;opacity: .8;top: 0 !important;width: 100% !important;}[class^="pages-welcome-entrance-a-contents-"] {margin-left: auto !important;margin-right: auto !important;padding: 130px 0;[class^="MkVisitorDashboard-root-"]::before {-webkit-backdrop-filter: var(--MI-blur, blur(15px));backdrop-filter: var(--MI-blur, blur(15px));background: var(--MI_THEME-acrylicPanel);border-radius: var(--MI-radius-ellipse);content: '';height: 129.1rem;left: -1.7rem;position: absolute;top: .5rem;transition: padding .2s;width: 34.1rem;}[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-"] {animation: animatebg 100s linear infinite;background-image: url("https://cdn.booping.synth.download/assets/synth+grid+bg.png") !important;background-repeat: repeat;background-size: auto;height: 100% !important;left: 0 !important;opacity: .8;top: 0 !important;width: 100% !important;}}}@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;}}[class^="visitor-side-"] {[class^="visitor-banner-"] {animation: unset !important;}}}}}[class^="SkNote-renote-"] {[class^="_noSelect MkAvatar-root-"] {display: unset !important;}}[class^="MkReactionsViewer-reaction-root-"]:not([class*="MkReactionsViewer-reaction-canToggle-"]) {border: solid 1px var(--MI_THEME-divider);}}
|
||||
Loading…
Add table
Add a link
Reference in a new issue