me/offline-twitter
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Several visual improvements

Browse Source 
- make spacing around a tweet's reply-mentions container grow and shrink more appropriately
- fix double HTMX-spinner when a tweet has a quoted tweet
- add favicon
This commit is contained in:
Alessio 2024-02-18 15:06:40 -08:00
parent a7ce15ebd2
commit 90b9df15e5
4 changed files with 10 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
internal/webserver/static/styles.css
View File

@ -97,7 +97,7 @@ ul.inline-dotted-list li:last-child:after {
.htmx-spinner-container { .htmx-spinner-container {
display: none; display: none;
} }
.tweet.htmx-request .htmx-spinner-container { .tweet.htmx-request > .htmx-spinner-container {
display: revert; display: revert;
font-size: 3em; font-size: 3em;
position: absolute; position: absolute;
@ -184,8 +184,10 @@ ul.inline-dotted-list li:last-child:after {
.reply-mentions-container { .reply-mentions-container {
display: flex; display: flex;
align-items: center; align-items: center;
margin: 0 5em;
cursor: default; cursor: default;
flex-grow: 1;
justify-content: center;
flex-wrap: wrap;
} }
.reply-mentions { .reply-mentions {
padding: 0 0.5em; padding: 0 0.5em;
@ -325,6 +327,7 @@ p.posted-at {
float: right; float: right;
color: var(--color-twitter-text-gray); color: var(--color-twitter-text-gray);
font-size: 0.875em; font-size: 0.875em;
white-space: nowrap;
} }
.interactions-bar { .interactions-bar {
@ -421,7 +424,7 @@ ul.quick-links {
text-align: center; text-align: center;
color: var(--color-twitter-text-gray); color: var(--color-twitter-text-gray);
font-size: 1.2em; font-size: 1.2em;
margin: 1em 0; padding: 1em 0;
} }
.top-bar { .top-bar {
@ -453,6 +456,7 @@ ul.quick-links {
img.svg-icon { img.svg-icon {
width: 1.5em; width: 1.5em;
height: auto;
} }
svg { svg {
@ -785,6 +789,7 @@ ul.space-participants-list li {
.dm-message-reactions { .dm-message-reactions {
display: flex; display: flex;
padding: 0 4em; padding: 0 4em;
cursor: default;
} }
.our-message .dm-message-reactions { .our-message .dm-message-reactions {
flex-direction: row-reverse; flex-direction: row-reverse;

BIN
internal/webserver/static/twitter.ico Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 34 KiB

2
internal/webserver/tpl/includes/base.tpl
View File

@ -5,7 +5,7 @@
<meta charset='utf-8'> <meta charset='utf-8'>
<title>{{template "title" .}} | Offline Twitter</title> <title>{{template "title" .}} | Offline Twitter</title>
<link rel='stylesheet' href='/static/styles.css'> <link rel='stylesheet' href='/static/styles.css'>
<link rel='shortcut icon' href='/static/img/favicon.ico' type='image/x-icon'> <link rel='shortcut icon' href='/static/twitter.ico' type='image/x-icon'>
<link rel='stylesheet' href='/static/vendor/fonts.css'> <link rel='stylesheet' href='/static/vendor/fonts.css'>
<script src="/static/vendor/htmx.min.js" integrity="sha384-zUfuhFKKZCbHTY6aRR46gxiqszMk5tcHjsVFxnUo8VMus4kHGVdIYVbOYYNlKmHV" crossorigin="anonymous"></script> <script src="/static/vendor/htmx.min.js" integrity="sha384-zUfuhFKKZCbHTY6aRR46gxiqszMk5tcHjsVFxnUo8VMus4kHGVdIYVbOYYNlKmHV" crossorigin="anonymous"></script>
<script src="/static/vendor/htmx-extension-json-enc.js"></script> <script src="/static/vendor/htmx-extension-json-enc.js"></script>