22 votes

Tildes Issue Log - February 2019

11 comments

  1. [5]
    Bauke Link
    And just like that February is already over! This month had a big milestone, going publicly-viewable and also includes a few graphs of the statistics I'm generating so far with more to come!...
    • Exemplary

    And just like that February is already over! This month had a big milestone, going publicly-viewable and also includes a few graphs of the statistics I'm generating so far with more to come! (reddit post)

    7 votes
    1. [4]
      cfabbro Link Parent
      Much appreciated, as always, Bauke. And hooray for Dracula! I still use your version on Desktop using Stylus, since it has some other nice design tweaks and is more colourful than the new native...

      Much appreciated, as always, Bauke. And hooray for Dracula! I still use your version on Desktop using Stylus, since it has some other nice design tweaks and is more colourful than the new native theme... but at least I can finally use a similar theme on mobile now too (since iOS safari has no Stylus equivalent) even if it is somewhat inferior to yours. ;)

      5 votes
      1. [3]
        Bauke Link Parent
        Believe it or not but I've actually switched to the official one. :P I do think some improvements can be made here and there but all in due time. I have been thinking of maybe taking the design...

        Believe it or not but I've actually switched to the official one. :P I do think some improvements can be made here and there but all in due time. I have been thinking of maybe taking the design tweaks from my Dracula and creating a separate style for it, so I can have the best of both worlds. ;D

        4 votes
        1. frickindeal Link Parent
          Yes, please. Baukula should become a native theme (name suggested by Deimos; I take no credit). I love the new native Dracula on mobile (Safari or Firefox on iOS), but everywhere else I use Stylus...

          Yes, please. Baukula should become a native theme (name suggested by Deimos; I take no credit). I love the new native Dracula on mobile (Safari or Firefox on iOS), but everywhere else I use Stylus to load your theme. The "lavender" background for comments is ideal in contrast to my eyes, and the color highlights are perfect. The native theme is a bit too dark on desktop, but it's a great alternative on mobile, especially on Firefox set to Night Mode.

          5 votes
        2. cfabbro Link Parent
          The muted colours in the native theme compared to the vibrant ones in yours bothers me quite a bit. WTB more hot pink and neon green! :P

          I do think some improvements can be made here and there but all in due time.

          The muted colours in the native theme compared to the vibrant ones in yours bothers me quite a bit. WTB more hot pink and neon green! :P

          4 votes
  2. [6]
    mftrhu Link
    The tables overflow on mobile, FYI. The last two ones (open and closed issues) are completely unreadable on my device.

    The tables overflow on mobile, FYI. The last two ones (open and closed issues) are completely unreadable on my device.

    5 votes
    1. [5]
      Bauke Link Parent
      Yeah, I know. It's an unforunate problem with using tables that I have no idea on how to fix, other than just completely hiding them. If you put your phone in landscape mode it should work better.

      Yeah, I know. It's an unforunate problem with using tables that I have no idea on how to fix, other than just completely hiding them. If you put your phone in landscape mode it should work better.

      4 votes
      1. [4]
        mftrhu Link Parent
        You could wrap them in a container with overflow: auto. I have this snippet in the stylesheet of my local wiki, from when I stumbled across the same issue when trying to read it on mobile. /*...

        You could wrap them in a container with overflow: auto. I have this snippet in the stylesheet of my local wiki, from when I stumbled across the same issue when trying to read it on mobile.

        /* Tables */
        .outer {
          width: 100%;
          overflow-x: auto;
          white-space: nowrap;
        }
        table { width: 100%; }
        

        I'm actually not sure just why it works anymore, but it seems fine to me.

        Edit: it miiiight cause the text to not be wrapped - on mobile right now, can't easily test it - so maybe put it in a media query?

        6 votes
        1. [3]
          Bauke Link Parent
          Doesn't seem like it changes anything for portrait mode, on landscape the table becomes smaller (no longer overflows) so it will fit inside the intended width. I don't know, when I first made it I...

          Doesn't seem like it changes anything for portrait mode, on landscape the table becomes smaller (no longer overflows) so it will fit inside the intended width. I don't know, when I first made it I tried getting it to show properly and what you see now is the closest I've gotten. They just need a lot of width to do that and portrait mode doesn't have enough of it unfortunately.

          If you're invested enough feel free to try to fix it yourself though, I'll check out any MRs to improve it. :P

          5 votes
          1. [2]
            mftrhu (edited ) Link Parent
            On desktop now, and I think I found the issue - both your common.css and your post.css files contain the following snippet: @media screen and (max-width: 500px) { [...] td { overflow:scroll;...
            • Exemplary x2

            On desktop now, and I think I found the issue - both your common.css and your post.css files contain the following snippet:

            @media screen and (max-width: 500px) {
            	[...]
            	td {
            		overflow:scroll;
            		white-space:nowrap;
            		text-overflow:clip;
            		max-width:20px
            	}
            }
            

            Removing the max-width from both stylesheets makes it so the table still overflows, but without the text overlapping.

            Adding the following inside the media query makes the tables scrollable.

            table {
                display: block;
                overflow-x: auto;
                white-space: nowrap;
            }
            

            (I'm also opening a merge request, BTW, but I don't have that much faith in myself when it comes to matters of the git)

            Edit: submitted. Here's to hoping I didn't mess anything up.

            6 votes
            1. Bauke Link Parent
              That fixed it, yep. Thank you so much! Merged it here. :D

              That fixed it, yep. Thank you so much! Merged it here. :D

              5 votes