Fix CSS issues

master
r 2 years ago
parent c733ab970a
commit f4e85c571a
  1. 67
      static/style.css
  2. 23
      templates/notification.tmpl
  3. 3
      templates/status.tmpl
  4. 2
      templates/userlist.tmpl

@ -1,10 +1,11 @@
.status-container-container {
margin: 12px 0 12px -4px;
margin: 0 -4px 12px -4px;
padding: 4px;
border-left: 4px solid transparent;
}
.status-container-container:target {
.status-container-container:target,
.status-container-container.unread {
border-color: #777777;
}
@ -20,7 +21,11 @@
margin: 4px 0;
max-height: 600px;
overflow: auto;
word-wrap: anywhere;
overflow-wrap: break-word;
}
.status-name {
overflow-wrap: break-word;
}
.status-content p {
@ -40,7 +45,8 @@
}
.status-media-container {
margin: 4px 0;
margin: 5px 0 -5px 0;
overflow: auto;
}
.status-profile-img-container {
@ -64,6 +70,8 @@
.status {
display: inline-block;
vertical-align: top;
flex: 1;
min-width: 0;
}
.status-dname {
@ -106,6 +114,7 @@
.page-title {
font-size: 18pt;
margin: 8px 0;
}
.post-form {
@ -126,6 +135,7 @@
.retweet-info {
margin: 0 0 4px 24px;
overflow-wrap: break-word;
}
.retweet-info .status-profile-img {
@ -159,16 +169,6 @@
font-size: 13pt;
}
.notification-container {
margin: 16px 0 16px -4px;
padding: 0 4px;
border-left: 4px solid transparent;
}
.notification-container.unread {
border-color: #777777;
}
.notification-info-text span {
vertical-align: middle;
}
@ -195,6 +195,10 @@
font-size: 10pt
}
.status-reply-container {
word-break: break-all;
}
.status-reply-container .fa {
font-size: 10pt;
vertical-align: sub;
@ -252,7 +256,11 @@
}
.user-profile-decription {
margin: 4px 0;
margin: 8px 0;
}
.user-profile-decription p {
margin: 0;
}
.d-inline {
@ -301,12 +309,13 @@ a:hover,
}
.status-nsfw-overlay {
height: 100%;
width: 100%;
background: black;
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
margin-bottom: 5px;
}
.img-link:hover .status-nsfw-overlay {
@ -347,6 +356,7 @@ img.emoji {
min-width: 32px;
vertical-align: middle;
object-fit: contain;
margin: 0;
}
.status-dname img.emoji {
@ -390,7 +400,6 @@ img.emoji {
}
.user-list-container {
margin: 8px 0;
}
.user-list-item {
@ -444,7 +453,7 @@ img.emoji {
}
.search-form {
margin: 16px 0 16px 0;
margin: 12px 0;
}
.more-container {
@ -459,7 +468,6 @@ img.emoji {
background-color: #ffffff;
padding: 2px 4px;
border: 1px solid #aaaaaa;
right: 0;
}
.more-container:hover .more-content {
@ -472,6 +480,12 @@ img.emoji {
margin: 2px;
}
.poll-form {
margin-top: 5px;
overflow: auto;
overflow-wrap: break-word;
}
.poll-form button[type=submit] {
margin-top: 6px;
}
@ -480,19 +494,22 @@ img.emoji {
margin-top: 6px;
}
.notification-title-container>* {
display: inline;
.notification-title-container {
margin: 8px 0;
}
.notification-title {
font-size: 18pt;
margin-right: 8px;
.notification-text {
vertical-align: middle;
}
.notification-refresh {
margin-right: 8px;
}
.notification-read {
display: inline-block;
}
.no-data-found {
margin: 12px 0;
}

@ -1,15 +1,15 @@
{{with .Data}}
{{template "header.tmpl" (WithContext .CommonData $.Ctx)}}
<div class="notification-title-container">
<div class="notification-title">
<span class="page-title">
Notifications
{{if and (not $.Ctx.AntiDopamineMode) (gt .UnreadCount 0)}}
({{.UnreadCount }})
{{end}}
</div>
</span>
<a class="notification-refresh" href="/notifications" target="_self" accesskey="R" title="Refresh (R)">refresh</a>
{{if .ReadID}}
<form action="/notifications/read?max_id={{.ReadID}}" method="post" target="_self">
<form class="notification-read" action="/notifications/read?max_id={{.ReadID}}" method="post" target="_self">
<input type="hidden" name="csrf_token" value="{{$.Ctx.CSRFToken}}">
<input type="submit" value="read" class="btn-link" accesskey="C" title="Clear unread notifications (C)">
</form>
@ -17,7 +17,7 @@
</div>
{{range .Notifications}}
<div class="notification-container {{if .Pleroma}}{{if not .Pleroma.IsSeen}}unread{{end}}{{end}}">
<div class="status-container-container {{if .Pleroma}}{{if not .Pleroma.IsSeen}}unread{{end}}{{end}}">
{{if eq .Type "follow"}}
<div class="notification-follow-container">
<div class="status-profile-img-container">
@ -28,9 +28,8 @@
<div class="notification-follow">
<div class="notification-info-text">
<span class="status-dname"> {{EmojiFilter .Account.DisplayName .Account.Emojis}} </span>
<span> followed you </span>
<span>
- <time datetime="{{FormatTimeRFC3339 .CreatedAt}}" title="{{FormatTimeRFC822 .CreatedAt}}">{{TimeSince .CreatedAt}}</time>
<span class="notification-text"> followed you -
<time datetime="{{FormatTimeRFC3339 .CreatedAt}}" title="{{FormatTimeRFC822 .CreatedAt}}">{{TimeSince .CreatedAt}}</time>
</span>
</div>
<div>
@ -50,9 +49,8 @@
<a href="/user/{{.Account.ID}}">
<span class="status-uname"> @{{.Account.Acct}} </span>
</a>
<span> retweeted your post </span>
<span>
- <time datetime="{{FormatTimeRFC3339 .CreatedAt}}" title="{{FormatTimeRFC822 .CreatedAt}}">{{TimeSince .CreatedAt}}</time>
<span class="notification-text"> retweeted your post -
<time datetime="{{FormatTimeRFC3339 .CreatedAt}}" title="{{FormatTimeRFC822 .CreatedAt}}">{{TimeSince .CreatedAt}}</time>
</span>
</div>
{{template "status" (WithContext .Status $.Ctx)}}
@ -65,9 +63,8 @@
<a href="/user/{{.Account.ID}}">
<span class="status-uname"> @{{.Account.Acct}} </span>
</a>
<span> liked your post </span>
<span>
- <time datetime="{{FormatTimeRFC3339 .CreatedAt}}" title="{{FormatTimeRFC822 .CreatedAt}}">{{TimeSince .CreatedAt}}</time>
<span class="notification-text"> liked your post -
<time datetime="{{FormatTimeRFC3339 .CreatedAt}}" title="{{FormatTimeRFC822 .CreatedAt}}">{{TimeSince .CreatedAt}}</time>
</span>
</div>
{{template "status" (WithContext .Status $.Ctx)}}

@ -89,6 +89,7 @@
{{if .Content}}
<div class="status-content"> {{StatusContentFilter .SpoilerText .Content .Emojis .Mentions}} </div>
{{end}}
{{if .MediaAttachments}}
<div class="status-media-container">
{{range .MediaAttachments}}
@ -132,9 +133,9 @@
{{else}}
<a href="{{.URL}}" target="_blank" title="{{.Description}}"> [attachment] </a>
{{end}}
{{end}}
</div>
{{end}}
{{if .Poll}}
<form class="poll-form" action="/vote/{{.Poll.ID}}" method="POST" target="_self">
<input type="hidden" name="csrf_token" value="{{$.Ctx.CSRFToken}}">

@ -1,5 +1,5 @@
{{with .Data}}
<div class="user-list-container">
<div>
{{range .}}
<div class="user-list-item">
<div class="user-list-profile-img">

Loading…
Cancel
Save