From e82b47a7294f7226dbd04eef6d37b5e7c1bd8613 Mon Sep 17 00:00:00 2001 From: video-prize-ranch Date: Tue, 20 Dec 2022 19:35:48 -0500 Subject: [PATCH] CSS cleanup --- static/css/album.css | 23 ++------------- static/css/base.css | 57 +++++++++++++++++++++----------------- static/css/comments.css | 4 --- static/css/embed.css | 9 +----- static/css/error.css | 6 ---- static/css/frontpage.css | 11 ++++++-- static/css/normalize.css | 2 ++ static/css/privacy.css | 29 ++++--------------- static/css/tag.css | 19 ++----------- static/css/user.css | 12 +------- views/embed.hbs | 4 +-- views/errors/404.hbs | 2 ++ views/errors/429.hbs | 2 ++ views/frontpage.hbs | 10 ------- views/gifv.hbs | 2 +- views/partials/comment.hbs | 12 ++++---- views/partials/footer.hbs | 2 +- views/partials/head.hbs | 1 + views/partials/header.hbs | 2 +- views/partials/post.hbs | 13 +++++---- views/post.hbs | 14 +++++----- views/privacy.hbs | 12 ++++---- views/tag.hbs | 4 +-- views/user.hbs | 4 +-- 24 files changed, 93 insertions(+), 163 deletions(-) create mode 100644 static/css/normalize.css diff --git a/static/css/album.css b/static/css/album.css index e98e7cf..5ae15c3 100644 --- a/static/css/album.css +++ b/static/css/album.css @@ -1,17 +1,11 @@ -h1 { - margin: 0; +p { + margin: 0.4rem 0; } .pfp { border-radius: 100%; } -.post__media { - display: flex; - align-items: center; - flex-direction: column; -} - .post__media video, .post__media img { margin: 1em 0; @@ -24,20 +18,7 @@ h1 { align-self: flex-start; } -.imageMeta__wrapper, -.imageMeta__item, -.imageMeta { - display: flex; - gap: 12px; - align-items: center; -} - -.imageMeta__item { - gap: 4px; -} - .imageMeta__wrapper { - gap: 1rem; margin-top: 0.5em; } diff --git a/static/css/base.css b/static/css/base.css index d60231f..3a7e6b1 100644 --- a/static/css/base.css +++ b/static/css/base.css @@ -1,41 +1,55 @@ +h1, h2, h3 { + margin: 0; +} + a { color: #E0E0E0; font-weight: 600; text-decoration: none; } -a > h2 { - color: white; -} - -h2, h3, p { - margin: 0; -} - body { background-color: #212121; color: white; font-size: 18px; font-family: -apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, helvetica, Ubuntu, roboto, noto, arial, sans-serif; + margin: 0 24vw; } nav { - display: flex; - align-items: center; + margin: 0.75rem; } .logo, .icon { filter: invert(1) hue-rotate(180deg); } -section, -header, -main { - margin: 0 24vw; +.text-center { + text-align: center; } -.errorTitle { - text-align: center; +.flex { + display: flex; +} +.flex-center { + align-items: center; + justify-content: center; +} +.flex-center-y { + align-items: center; +} +.flex-col { + flex-direction: column; +} + +.p-2 { + padding: 0.5rem; +} +.gap-2 { + gap: 0.5rem; +} +.gap-4 { + gap: 1rem; } .posts { @@ -65,12 +79,6 @@ main { overflow: hidden; } -.post__meta { - padding: 6px; - display: flex; - gap: 10px; -} - .pageSelector { display: flex; justify-content: space-between; @@ -78,15 +86,12 @@ main { } footer { - display: flex; - justify-content: center; - flex-direction: row; gap: 5rem; margin: 2em 0; } @media only screen and (max-width: 812px) { - section, header, main { + body { margin: 0 !important; } } \ No newline at end of file diff --git a/static/css/comments.css b/static/css/comments.css index c336577..9ed3160 100644 --- a/static/css/comments.css +++ b/static/css/comments.css @@ -1,14 +1,10 @@ .comment { - display: flex; - flex-direction: column; gap: 0.5em; } .comments { margin-top: 1em; gap: 0.25em; - display: flex; - flex-direction: column; } .replies { diff --git a/static/css/embed.css b/static/css/embed.css index f205b06..a96c80c 100644 --- a/static/css/embed.css +++ b/static/css/embed.css @@ -13,7 +13,7 @@ body { .media { display: flex; - overflow: scroll; + overflow: auto; gap: 1rem; align-items: center; height: 90vh; @@ -33,15 +33,8 @@ body { width: 100%; } -.logoContainer { - display: flex; - align-items: center; -} - .views { - display: flex; gap: 4px; - align-items: center; } .postDetails { diff --git a/static/css/error.css b/static/css/error.css index 98ebede..e204146 100644 --- a/static/css/error.css +++ b/static/css/error.css @@ -6,12 +6,6 @@ h2 { margin-bottom: 0; } -main { - display: flex; - align-items: center; - flex-direction: column; -} - code { display: block; padding: 0.75em; diff --git a/static/css/frontpage.css b/static/css/frontpage.css index eb775ba..eb1f3c4 100644 --- a/static/css/frontpage.css +++ b/static/css/frontpage.css @@ -1,8 +1,13 @@ +h1, h2, h3 { + margin: 0.4em 0; +} + code { - background-color: #424242; - padding: 2px; + padding: 0.15rem; + font-size: 0.95em; + background-color: #383838; border-radius: 4px; - font-size: 0.9em; + font-family: Menlo, Consolas, Monaco, Liberation Mono, Lucida Console, monospace; } summary { diff --git a/static/css/normalize.css b/static/css/normalize.css new file mode 100644 index 0000000..8879071 --- /dev/null +++ b/static/css/normalize.css @@ -0,0 +1,2 @@ +/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */ +html{line-height:1.2;-webkit-text-size-adjust:100%}body{margin:0}main{display:block}h1{font-size:2em;margin:.67em 0}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace,monospace;font-size:1em}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none} \ No newline at end of file diff --git a/static/css/privacy.css b/static/css/privacy.css index 5dd1b1f..b327fcb 100644 --- a/static/css/privacy.css +++ b/static/css/privacy.css @@ -1,11 +1,11 @@ -main { - margin: 0 24vw -} - p { margin: 1em 0 } +h1, h2, h3 { + margin: 0.4em 0; +} + ul { list-style: outside none none; padding: 0; @@ -17,19 +17,13 @@ ul { height: 36px; } -.badgeWrapper { +.badge { margin: 0 10vw } -.badge { +.badge div { background-color: #3b3b3b; border-radius: 8px; - display: flex; - flex-direction: column; - align-items: center; - gap: 0.25em; - padding: 1em; - text-align: center; } .badge h2 { @@ -47,15 +41,4 @@ ul { user-select: none; color: #2b95f2; font-weight: 700; -} - -.addInfo { - margin-top: 1em; -} - -@media only screen and (max-width: 812px) { - .badgeWrapper, - main { - margin: 0 - } } \ No newline at end of file diff --git a/static/css/tag.css b/static/css/tag.css index 08dfd2e..faf6241 100644 --- a/static/css/tag.css +++ b/static/css/tag.css @@ -1,4 +1,4 @@ -main { +body { margin: 0 12vw; } @@ -7,22 +7,7 @@ main { border-radius: 12px; } -.tagMeta__info { - display: flex; - flex-direction: column; - gap: 10px; - text-align: center; - justify-content: center; - align-items: center; -} - -.tagMeta__sort { - display: flex; - flex-direction: column; - gap: 4px; -} - -.tagMeta__sort a { +a { font-weight: 400; color: #fff; } \ No newline at end of file diff --git a/static/css/user.css b/static/css/user.css index 706b1a2..f5f87ce 100644 --- a/static/css/user.css +++ b/static/css/user.css @@ -1,4 +1,4 @@ -main { +body { margin: 0 12vw; } @@ -7,16 +7,6 @@ main { border-radius: 12px; } -.userMeta__upper { - display: flex; - gap: 10px; - align-items: center; -} - -.userMeta__upper__bio { - margin-top: 1em; -} - .pfp { border-radius: 100%; } \ No newline at end of file diff --git a/views/embed.hbs b/views/embed.hbs index d8dba19..7de6609 100644 --- a/views/embed.hbs +++ b/views/embed.hbs @@ -29,12 +29,12 @@

{{post.Title}}

{{/if}} -
+
Views

{{post.Views}}

-
+
diff --git a/views/errors/404.hbs b/views/errors/404.hbs index eb19da4..58e6c0a 100644 --- a/views/errors/404.hbs +++ b/views/errors/404.hbs @@ -4,6 +4,8 @@ {{> 'partials/head' }} + + 404 Not Found - rimgo diff --git a/views/errors/429.hbs b/views/errors/429.hbs index 1b15f16..d366939 100644 --- a/views/errors/429.hbs +++ b/views/errors/429.hbs @@ -4,6 +4,8 @@ {{> 'partials/head' }} + + Rate limited by Imgur - rimgo diff --git a/views/frontpage.hbs b/views/frontpage.hbs index ca701a8..b35159d 100644 --- a/views/frontpage.hbs +++ b/views/frontpage.hbs @@ -16,7 +16,6 @@

An alternative frontend for Imgur. Originally based on rimgu.

-

Features

  • Lightweight
    • @@ -29,7 +28,6 @@

    Comparison

    Comparing rimgo to Imgur.

    -

    Speed

    Tested using Google PageSpeed Insights.

    @@ -60,33 +58,25 @@
    -

    Privacy

    Imgur collects information about your device and uses tracking cookies for advertising, this is mentioned in their privacy policy. Blacklight found 31 trackers and 87 third-party cookies.

    -

    See what cookies and trackers Imgur uses and where your data gets sent: https://themarkup.org/blacklight?url=imgur.com

    -

    Usage

    Just replace imgur.com or i.imgur.com with {{domain}} (add stack/ before the media ID for i.stack.imgur.com). You can setup automatic redirects using LibRedirect (recommended) or Redirector.

    -
    {{#if force_webp}}

    To download images as their original filetype, add ?no_webp=1 to the end of the image URL.

    {{/if}} -

    Automatically redirect links

    -

    LibRedirect

    Use LibRedirect to automatically redirect Imgur links to rimgo!

    -

    GreaseMonkey script

    There is a script to redirect Imgur links to rimgo. https://codeberg.org/zortazert/GreaseMonkey-Redirect/src/branch/main/imgur-to-rimgo.user.js

    -

    Redirector

    You can use the Redirector extension to redirect Imgur links to rimgo with the configuration below:

      diff --git a/views/gifv.hbs b/views/gifv.hbs index b2ab018..f101fd0 100644 --- a/views/gifv.hbs +++ b/views/gifv.hbs @@ -18,7 +18,7 @@
download -
+
diff --git a/views/partials/comment.hbs b/views/partials/comment.hbs index 93c8337..f8dd8ff 100644 --- a/views/partials/comment.hbs +++ b/views/partials/comment.hbs @@ -1,4 +1,4 @@ -
+
{{#noteq this.User.Username "[deleted]"}} @@ -7,20 +7,20 @@ {{/noteq}} {{#equal this.User.Username "[deleted]"}} -

[deleted]

+

[deleted]

{{/equal}}
- {{{this.Comment}}} -

+

{{{this.Comment}}}

+
{{this.RelTime}} {{#if this.DeletedAt}} (deleted {{this.DeletedAt}}) {{/if}} - | + | Likes {{this.Upvotes}} Dislikes {{this.Downvotes}} -

+
{{#each this.Comments}} diff --git a/views/partials/footer.hbs b/views/partials/footer.hbs index fcc2173..93376c1 100644 --- a/views/partials/footer.hbs +++ b/views/partials/footer.hbs @@ -1,4 +1,4 @@ -