diff --git a/assets/dist/_colors.css b/assets/dist/_colors.css index 0a0c7bb..6a5e0f8 100644 --- a/assets/dist/_colors.css +++ b/assets/dist/_colors.css @@ -1,20 +1,18 @@ :root { - --white1: #fafaff; - --white2: #b3b5c6; - --gray1: #2a2b2f; - --gray2: #35363b; - --gray3: #3a3b41; - --gray4: #45464e; - --gray5: #4d4e56; - --gray6: #575861; - --gray7: #5d5e67; - --gray8: #696a75; + --white1: #fff; + --white2: #777; + --gray1: #111; + --gray2: #222; + --gray3: #333; + --gray4: #444; + --gray5: #555; + --gray6: #666; --orange1: #fd6a00; --orange2: #ff853e; --blue1: #3a9fde; --blue2: #66befe; - --blue3: #89caff; + --blue3: #82d8fd; --error1: #860000; --error2: #ff9796; --error3: #dd2c2c; @@ -24,16 +22,16 @@ --info-bg: #b3ddff; --info-link: var(--error-link); --fg: var(--white1); - --bg: var(--gray1); + --bg: var(--gray2); --bg-trans: rgba(77, 78, 86, 0.62); - --bg-accent: var(--gray5); + --bg-accent: var(--gray3); --fg-accent: var(--blue3); --fg-reduced: var(--white2); --border-accent: var(--orange2); --link-fg: var(--fg-accent); --role-admin: var(--orange2); --role-mod: var(--blue2); - --profile-bg: var(--gray4); + --profile-bg: var(--gray3); --button-bg: var(--blue2); --button-fg: var(--gray1); --button-hover-bg: var(--blue3); @@ -42,15 +40,15 @@ --button-danger-hover-bg: var(--error2); --toot-bg: var(--gray3); --toot-info-bg: var(--gray2); - --toot-focus-bg: var(--gray5); - --toot-focus-info-bg: var(--gray4); + --toot-focus-bg: var(--gray3); + --toot-focus-info-bg: var(--gray3); --no-img-desc-bg: var(--orange1); --no-img-desc-fg: var(--gray1); --bg-sensitive: var(--gray1); --boxshadow: 0 0.4rem 1rem -0.1rem rgba(0,0,0,0.15); --boxshadow-border: 0.08rem solid var(--gray1); --avatar-border: var(gray); - --input-bg: var(--gray4); + --input-bg: var(--gray3); --input-disabled-bg: var(--gray2); --input-border: var(--blue1); --input-error-border: var(--error3); @@ -66,14 +64,14 @@ --error-bg: var(--error2); --list-entry-bg: var(--gray2); --list-entry-alternate-bg: var(--gray3); - --list-entry-hover-bg: var(--gray4); + --list-entry-hover-bg: var(--gray3); --plyr-color-main: var(--orange2); --plyr-video-background: var(--bg-accent); --plyr-badge-background: var(--bg-accent); --plyr-video-controls-background: var(--bg-accent); --plyr-badge-text-color: var(--fg); --plyr-badge-border-radius: var(--br); - --plyr-video-progress-buffered-background: var(--gray8) + --plyr-video-progress-buffered-background: var(--gray6) } /* diff --git a/assets/dist/base.css b/assets/dist/base.css index ddfd175..dd5ec18 100644 --- a/assets/dist/base.css +++ b/assets/dist/base.css @@ -323,24 +323,12 @@ summary { display: list-item; } -/* noto-sans-regular - latin */ - -/* standard border radius for nice squircles */ - -/* border radius for items that are framed/bordered - inside something with $br, eg avatar, header img */ - -/* Fork-Awesome 'fa-fw' fixed icon width - keep in sync with https://github.com/ForkAwesome/Fork-Awesome/blob/a99579ae3e735ee70e51ed62dfcee3172b5b2db7/css/fork-awesome.css#L50 -*/ - html, body { padding: 0; margin: 0; background: var(--bg); color: var(--fg); font-family: "Noto Sans", sans-serif; - scrollbar-color: var(--orange1) var(--gray3); } body { @@ -567,7 +555,7 @@ section.error pre { } section.oob-token code { - background: var(--gray1); + background: var(--gray2); padding: 0.5rem; margin: 0; border-radius: 0.3rem; @@ -683,7 +671,7 @@ footer a { padding: .6rem; font-weight: bold; background-color: var(--border-accent); - color: var(--gray1); + color: var(--gray2); } label { @@ -714,7 +702,7 @@ label { .list .header { border: 0.1rem solid transparent !important; /* for alignment with .entry border padding */ - background: var(--gray1) !important; + background: var(--gray2) !important; display: flex; font-weight: bold; } diff --git a/assets/dist/profile.css b/assets/dist/profile.css index 4085114..6dd2499 100644 --- a/assets/dist/profile.css +++ b/assets/dist/profile.css @@ -126,18 +126,16 @@ .profile .header .basic-info .role { background: var(--bg); color: var(--fg); - border: 0.13rem solid var(--bg); - grid-area: role; - align-self: center; - justify-self: start; - border-radius: var(--br); - padding: 0.3rem; - - line-height: 1.1rem; - font-size: 0.9rem; - font-variant: small-caps; - font-weight: bold; + border: 0.1rem solid var(--bg); + grid-area: role; + align-self: center; + justify-self: start; + border-radius: var(--br); + padding: 0.25rem 0.5rem 0.35rem 0.5rem; + line-height: 0.75rem; + font-size: 0.75rem; + font-variant: small-caps; } .profile .header .basic-info .role.admin { @@ -202,12 +200,7 @@ justify-self: end; } -.profile .toots .col-header .rss-icon { - display: block; - margin: -0.25rem 0; - } - -.profile .toots .col-header .rss-icon .fa { +.profile .rss-icon .fa { font-size: 2rem; -o-object-fit: contain; object-fit: contain; @@ -272,7 +265,7 @@ .profile .about-user .fields > span { } .profile .about-user .fields > span + b { - border-top: 0.1rem solid var(--gray2); + border-top: 0.1rem solid var(--gray1); } .profile .about-user .bio { @@ -292,10 +285,17 @@ .profile .accountstats > * { padding: 0.5rem; justify-self: center; + } + +.profile .accountstats > *, +.profile .accountstats > * > * { justify-content: center; text-align: center; + display: flex; + gap: 0.25rem; + line-height: 20px; } .profile .accountstats > b { - border-bottom: 0.1rem solid var(--gray2); + border-bottom: 0.1rem solid var(--gray1); } diff --git a/assets/dist/settings-style.css b/assets/dist/settings-style.css index 39a0dd0..f11e308 100644 --- a/assets/dist/settings-style.css +++ b/assets/dist/settings-style.css @@ -221,7 +221,7 @@ nav.menu-tree li.nested a.title { padding-left: 1rem; font-weight: normal; color: var(--fg); - background: var(--gray4); + background: var(--gray3); } nav.menu-tree li.nested a.title:focus { diff --git a/assets/dist/status.css b/assets/dist/status.css index 9264a11..f82b696 100644 --- a/assets/dist/status.css +++ b/assets/dist/status.css @@ -738,7 +738,7 @@ main { background-color: var(--gray2); } .toot .text .content code { - padding: 0.25rem; + padding: 0.25rem 0.5rem; border-radius: var(--br-inner); } .toot .text .content pre { @@ -945,3 +945,5 @@ main { .pswp__content .plyr { max-height: 100%; } + + diff --git a/readme.md b/readme.md index f6830f7..1735989 100644 --- a/readme.md +++ b/readme.md @@ -2,5 +2,6 @@ > custom templates for GoToSocial -as seen on my fediverse profile: -- https://dym.sh/@dym +as seen on my fediverse profile ( https://dym.sh/@dym ): + +![screenshot](./screenshot.png) \ No newline at end of file diff --git a/screenshot.png b/screenshot.png new file mode 100644 index 0000000..c80164c Binary files /dev/null and b/screenshot.png differ diff --git a/template/about.tmpl b/template/about.tmpl index f9b4b80..52cbcae 100644 --- a/template/about.tmpl +++ b/template/about.tmpl @@ -26,23 +26,22 @@