31
Some really quick hacked together Stylish styles for Lemmy, sort of in the style of old.reddit.com
()
h5, .h5{
font-size: 1rem !important;
}
.post-title h5{
font-size:0.9rem !important;
}
.btn {
font-size:0.75rem !important;
}
#app > .mt-4 > .container-lg hr.my-3 {
display: none;
}
#app > div > .container-lg {
max-width: 100% !important;
}
#app > nav > .container-lg {
max-width: 100% !important;
}
.post-listing{
background-color: rgba(255,255,255,0.023);
margin: 0.4rem 0 !important;
padding: 0.3rem 1rem !important;
border: solid 1px rgba(255,255,255,0.2);
border-radius:0.5rem;
}
/* user profile listing */
.container-lg > .row > .col-12 > div > div > .comments > .comment {
/*background-color: rgba(255,255,255,0.023);
margin: 0.4rem 0 !important;
padding: 0.3rem 1rem !important;
border: solid 1px rgba(255,255,255,0.2);
border-radius:0.5rem;*/
}
.container-lg > .row > .col-12 > div > div > .comments > .comment > .details{
/*padding:0 !important;
margin:0 !important;*/
}
.container-lg > .row > .col-12 > div > div > .comments > .comment > .details > div > div:first-child{
display:flex !important;
width:100%;
}
.container-lg > .row > .col-12 > div > div > .comments > .comment > .details > div > div:first-child > a.mr-2{
flex:1;
}
/* bottom row of post listing right (comments, star, etc.) */
.post-listing .row .col-12 .d-flex:last-child{
margin-bottom:0 !important;
}
.post-listing picture img.rounded-circle{
width:1.25rem;
height:1.25rem;
}
.post-listing .d-none .row .col-sm-2 {
max-width:150px;
}
.post-listing .d-none .row .col-sm-9 {
display:flex;
align-items:center;
}
#app > .mt-4.p-0.fl-1 {
margin-top:0rem !important;
}
#app > .mt-4 > .container-lg {
margin:0;
padding:0;
}
/* post index layout */
#app > .mt-4 > .container-lg > .row {
display: flex;
flex-wrap:nowrap;
margin: 0 !important;
}
#app > .mt-4 > .container-lg > .row > main {
display: flex;
flex-wrap:wrap;
flex-basis:calc(100% - 450px);
max-width:100%;
}
/* post layout */
#app > .mt-4 > .container-lg > .row > aside{
display: flex;
flex-basis:450px;
font-size:0.7rem;
}
#app > .mt-4 > .container-lg > .row > .col-md-8 {
width:calc(100% - 450px);
}
#app > .mt-4 > .container-lg > .row > .col-md-4 {
width:450px;
}
.comments .comments {
border-left: solid 1px rgba(255,255,255,0.15);
}
.comment {
margin-left: 1rem !important;
}
.comment .details > div > div > .md-div > p {
font-size:0.9rem;
}
.comment .comment-node {
background-color:rgba(255,255,255,0.028);
border:solid 1px rgba(255,255,255,0.3);
margin-bottom:3px;
padding:0.25rem 0.5rem !important;
border-radius:0.5rem;
}
.comment-node > .ml-2 {
margin:0 !important;
}
.main-content-wrapper{
width:100%;
}
.vote-bar{
max-width:80px;
}
.navbar-light .navbar-nav .nav-link {
background-color: rgba(255,255,255,0.03);
margin-right: 0.5rem;
}
I'll probably keep tweaking these, stay tuned.
Oh that's exactly what I've been wanting! Just added it into my instance's default theme. Thanks!
If you're doing that definitely make sure to check for updates ๐