Makes the card view on Reddit bigger
/* ==UserStyle==
@name Reddit - Big Card View
@namespace 1N07
@version 3.0.1
@description Makes the card view on Reddit bigger
@author 1N07
@preprocessor uso
@advanced text cardWidth "CardContainerWidthCSS" "75%"
@advanced text cardHeight "CardContentHeightCSS" "70vh"
==/UserStyle== */
@-moz-document domain("reddit.com") {
.subgrid-container {
max-width: calc(100vw - 272px);
width: calc(100vw - 272px);
}
.main-container {
justify-content: center;
}
#main-content {
max-width: calc(100% - 1rem - 316px);
width: /*[[cardWidth]]*/;
}
#right-sidebar-container:has(> aside) {
display: none;
}
#main-content:has(+ #right-sidebar-container > aside) {
max-width: 100%;
}
/*Single image post height*/
#main-content [slot='post-media-container'] shreddit-aspect-ratio{
--max-height: min(100%, /*[[cardHeight]]*/) !important;
}
/*multi image post height*/
/*
Can't be done currently. Relevant element (faceplate-carousel-evolved) is in shadow DOM. Will need a JS solution.
Might convert this whole style to a userscript later that just injects CSS to where I want...
*/
/*temp - shows multiple iamges in a carousel at a time. Reddit only loads x images though...*/
#main-content [slot='post-media-container'] gallery-carousel ul > li {
width: auto !important;
visibility: visible !important;
}
}