[Resolved] List Style Posts On Category/Archive On Mobile (Custom Mobile Archive Layout)

Home Forums Support List Style Posts On Category/Archive On Mobile (Custom Mobile Archive Layout)

Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
    Posts
  • #896469
    Simon

    I have found that on mobile, a list style of posts is much more user friendly than the tradition image over content.

    I just thought i would share the code I used to do it as I have not seen any reference to it anywhere else on here. Maybe if you see anything majorly wrong with it let me know.

    The result will have your mobile category pages looking like this does on desktop:
    https://generatepress.com/category/development/

    Code:

    @media (max-width: 768px) {
    .archive .post-image {
      float: left;
      margin-top: 0em!important;
      margin-bottom: 0em!important
      margin-left:0px;
      margin-right: 1em;
        }
    .archive .post {
      margin-bottom: 0px;
        }
    .archive .post-image img {
      max-width: 100px;
      vertical-align: middle;
        }
    .archive .inside-article {
      border-bottom: 1px solid #e2e2e2;
    	}
    .archive h2.entry-title {
      font-size: 16px;
    	}
    .archive .meta-area-2 {
      font-size: 13px;
    	}
    .archive .entry-summary {
      display: none;
    	}

    Cheers,
    Simon

    #896623
    Tom
    Lead Developer
    Lead Developer

    Awesome – looks great! Thanks for sharing 🙂

Viewing 2 posts - 1 through 2 (of 2 total)
  • You must be logged in to reply to this topic.