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.04);
    margin: 0.25rem 0 !important;
    padding: 0.25rem 1rem !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 > .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;
}
.comment {
  margin-left: 1rem !important;
}
.comment .details > div > div > .md-div > p {
    font-size:0.9rem;
}

I’ll probably keep tweaking these, stay tuned.

  • joestaen@lemmy.world
    link
    fedilink
    arrow-up
    4
    ·
    1 year ago

    cheers for this

    i detest having content centered, so having this style + 80% magnification definitely sates my burning hatred for modern ui design

    • dx1@lemmy.worldOP
      link
      fedilink
      arrow-up
      3
      ·
      1 year ago

      You use an extension like Stylish to graft the CSS onto your favorite Lemmy instance’s CSS. Until they move everything around and it breaks at least.

  • Glunkbor@lemmy.world
    link
    fedilink
    arrow-up
    2
    ·
    1 year ago

    This is great, thank you! It feels more like old-reddit, as you said, and I think having this option would make it even easier for people to transition to Lemmy. Well done!

  • blevok@startrek.website
    link
    fedilink
    arrow-up
    1
    ·
    edit-2
    1 year ago

    I added this to make the gap between posts smaller.

    .my-3 {  
        margin-bottom: 0.2rem !important;
        margin-top: 0.2rem !important;
    }
    

    edit: For some reason this doesn’t seem to work on some instances, not sure why.

    • dx1@lemmy.worldOP
      link
      fedilink
      arrow-up
      1
      ·
      1 year ago

      If you’re looking for the hr my CSS is actually hiding those and doing margin+padding on the posts:

      #app > .mt-4 > .container-lg hr.my-3 {
         display: none;
      }
      

      although the selector may be too specific. IDK what “my-3” is but figured it might be too general.

      • blevok@startrek.website
        link
        fedilink
        arrow-up
        1
        ·
        1 year ago

        Yeah it’s the hr, which somehow i can still see. I have the same css on startrek.website and while it’s still not hidden there, setting the margin does work, but not on lemmy.world for some reason. I can see that both sites have the same class for the hr (my-3), so i’m kinda stumped at the moment.

        I also added the following to change the width and spacing of columns, and again it works on startrek.website, but not on lemmy.world. It’s really strange.

        .container,.container-lg,.container-md,.container-sm,.container-xl {
            max-width:1540px
        }
        .col-md-4 {
            flex: 0 0 25%;
            max-width: 25%
        }
        .col-md-8 {
            flex: 0 0 75%;
            max-width: 75%
        }
        
  • dx1@lemmy.worldOP
    link
    fedilink
    arrow-up
    1
    ·
    1 year ago

    Note Lemmy has a serious lack of properly marked up HTML, things like “.post-listing .title” don’t exist so there are nasty CSS selectors included here.

  • cereal7802@lemmy.game-files.net
    link
    fedilink
    arrow-up
    1
    ·
    1 year ago

    Might want to create a git repo for this (maybe other themes) and get it converted to a full fledged theme for lemmy. I tacked your changes onto the end of the darkly-red theme and seems to look nice. I was just too lazy to remove the bits from the original theme. A git repo would be good though since a lot of the responses suggest coming back for updates. Git will let people know if there is a change and they can see what they are as they change.

  • GreyCat134@lemmy.world
    link
    fedilink
    arrow-up
    0
    ·
    1 year ago

    I personally like how things are currently. A local front page for the instance I’m apart of and a front page of communities I subscribe to. If I want to see what’s going on in other instances I can go visit those.

    • dx1@lemmy.worldOP
      link
      fedilink
      arrow-up
      1
      ·
      1 year ago

      This doesn’t change that, it’s just that user styles only apply to a specific domain (usually).