{
  "@context":[
    "https://www.w3.org/ns/activitystreams",
    {"Hashtag":"as:Hashtag"}
  ],
  "published":"2024-06-08T11:18:03.598Z",
  "attributedTo":"https://social.jayvii.de/actors/jayvii",
  "replies":"https://social.jayvii.de/objects/yfemmKNkPV4/replies",
  "to":["https://www.w3.org/ns/activitystreams#Public"],
  "cc":["https://social.jayvii.de/actors/jayvii/followers"],
  "content":"<p>Did some more <a href=\"https://social.jayvii.de/tags/CSS\" class=\"hashtag\" rel=\"tag\">#CSS</a> hacking on my <a href=\"https://social.jayvii.de/tags/stagit\" class=\"hashtag\" rel=\"tag\">#stagit</a> server: <a href=\"https://src.jayvii.de\">src.jayvii.de</a> <a href=\"https://social.jayvii.de/tags/git\" class=\"hashtag\" rel=\"tag\">#git</a> <a href=\"https://social.jayvii.de/tags/selfhosting\" class=\"hashtag\" rel=\"tag\">#selfhosting</a></p><p>The table-layout scheme used by stagit is simplistic and gives a great quick overview over repos, commits, etc. But it just doesn't work well on mobile devices and looks awfully outdated.</p><p>So I reform the tables to a more modern GitLab-inspired look just with a few lines of CSS.</p><p>Here are a few before and after screenshots:</p><figure><img src=\"https://social.jayvii.de/uploads/c2c7a782/a92b/4aa7/1.png\" width=\"780\" height=\"834\"><figcaption>Image description 1: Screenshots of the repository index page in mobile mode. On the left side is the old version with \"normal\" table. Each repository is listed as a single row of a table. The text overflows to the right, so the description is only partially visible and repository-owner and date of last commit are not visible at all. On the right side is the new version, which looks a lot more modern by giving each field full-width, meaning that each \"row\" of the table is not below each other rather than next to each other. Separating lines between each repository as well as repository names styled as headlines make differentiation easy and give it a more modern look.</figcaption></figure><figure><img src=\"https://social.jayvii.de/uploads/f82f7172/94a5/4135/1.png\" width=\"790\" height=\"842\"><figcaption>Image description 2: Two screenshots of the commit log of the \"stagit-jayvii.de\" repository, which is similarly layed out as on the first image of this post. On the left side is the old version, whereas commit messages are only partially visible due to overflowing text and comitting user as well as number of modified files and lines are not visible at all. On the right side is the new vertically aligned version, which makes browsing the commits of a repository on mobile devices a lot easier.</figcaption></figure>",
  "mediaType":"text/html",
  "attachment":[{"url":"https://social.jayvii.de/uploads/c2c7a782/a92b/4aa7/1.png","mediaType":"image/png"},{"url":"https://social.jayvii.de/uploads/f82f7172/94a5/4135/1.png","mediaType":"image/png"}],
  "tag":[
      {"type":"Hashtag","name":"#CSS","href":"https://social.jayvii.de/tags/CSS"},
      {"type":"Hashtag","name":"#stagit","href":"https://social.jayvii.de/tags/stagit"},
      {"type":"Hashtag","name":"#git","href":"https://social.jayvii.de/tags/git"},
      {"type":"Hashtag","name":"#selfhosting","href":"https://social.jayvii.de/tags/selfhosting"}
  ],
  "type":"Note",
  "id":"https://social.jayvii.de/objects/yfemmKNkPV4"
}