Update CSS

Now it's mostly CSS 2.1 compliant. All the images now use the height
attribute to limit the size on browsers that don't support CSS.

6 files changed, 14 insertions, 14 deletions

diff --git a/templates/emoji.tmpl b/templates/emoji.tmpl
index cbffc7b..7359d81 100644
--- a/templates/emoji.tmpl
+++ b/templates/emoji.tmpl
@@ -5,7 +5,7 @@
 <div class="emoji-list-container">
 	{{range .Emojis}}
 	<div class="emoji-item">
-		<img class="emoji" src="{{.URL}}" alt="{{.ShortCode}}" />
+		<img class="emoji" src="{{.URL}}" alt="{{.ShortCode}}" height="32" />
 		<div class="emoji-shortcode">:{{.ShortCode}}:</div>
 	</div>
 	{{end}}
diff --git a/templates/nav.tmpl b/templates/nav.tmpl
index 3386a7b..cfac439 100644
--- a/templates/nav.tmpl
+++ b/templates/nav.tmpl
@@ -3,7 +3,7 @@
 <div class="user-info">
 	<div class="user-info-img-container">
 		<a class="img-link" href="/timeline/home" title="home">
-			<img class="user-info-img" src="{{.User.AvatarStatic}}" alt="profile-avatar" />
+			<img class="user-info-img" src="{{.User.AvatarStatic}}" alt="profile-avatar" height="64" />
 		</a>
 	</div>
 	<div class="user-info-details-container">
diff --git a/templates/notification.tmpl b/templates/notification.tmpl
index 227bc57..2943847 100644
--- a/templates/notification.tmpl
+++ b/templates/notification.tmpl
@@ -19,13 +19,13 @@
 {{range .Notifications}}
 <div class="notification-container {{if .Pleroma}}{{if not .Pleroma.IsSeen}}unread{{end}}{{end}}">
 	{{if eq .Type "follow"}}
-	<div class="notification-follow-container">
+	<div>
 		<div class="status-profile-img-container">
 			<a class="img-link" href="/user/{{.Account.ID}}">
-				<img class="status-profile-img" src="{{.Account.AvatarStatic}}" title="{{.Account.Acct}}" alt="profile-avatar" />
+				<img class="status-profile-img" src="{{.Account.AvatarStatic}}" title="{{.Account.Acct}}" alt="profile-avatar" height="48" />
 			</a>
 		</div>
-		<div>
+		<div class="notification-follow">
 			<div class="notification-info-text">
 				<span class="status-dname"> {{EmojiFilter .Account.DisplayName .Account.Emojis}} </span>  
 				<span> followed you </span>
@@ -45,7 +45,7 @@
 	{{else if eq .Type "reblog"}}
 	<div class="retweet-info">
 		<a class="img-link" href="/user/{{.Account.ID}}">
-			<img class="status-profile-img" src="{{.Account.AvatarStatic}}" title="{{.Account.Acct}}" alt="avatar" />
+			<img class="status-profile-img" src="{{.Account.AvatarStatic}}" title="{{.Account.Acct}}" alt="avatar" height="48" />
 		</a>
 		<span class="status-dname"> {{EmojiFilter .Account.DisplayName .Account.Emojis}} </span>  
 		<span> retweeted your post </span>
@@ -58,7 +58,7 @@
 	{{else if eq .Type "favourite"}}
 	<div class="retweet-info">
 		<a class="img-link" href="/user/{{.Account.ID}}">
-			<img class="status-profile-img" src="{{.Account.AvatarStatic}}" title="{{.Account.Acct}}" alt="avatar" />
+			<img class="status-profile-img" src="{{.Account.AvatarStatic}}" title="{{.Account.Acct}}" alt="avatar" height="48" />
 		</a>
 		<span class="status-dname"> {{EmojiFilter .Account.DisplayName .Account.Emojis}} </span>  
 		<span> liked your post </span>
diff --git a/templates/status.tmpl b/templates/status.tmpl
index de0909b..7d510e2 100644
--- a/templates/status.tmpl
+++ b/templates/status.tmpl
@@ -3,7 +3,7 @@
 	{{if .Reblog}}
 	<div class="retweet-info">
 		<a class="img-link" href="/user/{{.Account.ID}}">
-			<img class="status-profile-img" src="{{.Account.AvatarStatic}}" title="{{.Account.Acct}}" alt="avatar" />
+			<img class="status-profile-img" src="{{.Account.AvatarStatic}}" title="{{.Account.Acct}}" alt="avatar" height="24" />
 		</a>
 		<span class="status-dname"> {{EmojiFilter .Account.DisplayName .Account.Emojis}} </span>  
 		retweeted
@@ -15,7 +15,7 @@
 	<div class="status-container status-{{.ID}}" data-id="{{.ID}}">
 		<div class="status-profile-img-container">
 			<a class="img-link" href="/user/{{.Account.ID}}">
-				<img class="status-profile-img" src="{{.Account.AvatarStatic}}" title="{{.Account.Acct}}" alt="avatar" />
+				<img class="status-profile-img" src="{{.Account.AvatarStatic}}" title="{{.Account.Acct}}" alt="avatar" height="48" />
 			</a>
 		</div>
 		<div class="status"> 
@@ -81,7 +81,7 @@
 				<a href="{{.URL}}" target="_blank" title="{{.Description}}"> [image] </a>
 				{{else}}
 				<a class="img-link" href="{{.URL}}" target="_blank" title="{{.Description}}">
-					<img class="status-image" src="{{.URL}}" alt="status-image" />
+					<img class="status-image" src="{{.URL}}" alt="status-image" height="240" />
 					{{if (and $.Ctx.MaskNSFW $s.Sensitive)}}
 					<div class="status-nsfw-overlay"></div>
 					{{end}}
@@ -103,7 +103,7 @@
 				<a href="{{.URL}}" target="_blank" title="{{.Description}}"> [video] </a>
 				{{else}}
 				<div class="status-video-container" title="{{.Description}}">
-					<video class="status-video" controls>
+					<video class="status-video" controls height="240">
 						<source src="{{.URL}}">
 						<a href="{{.URL}}" target="_blank"> [video] </a>
 					</video>
@@ -211,7 +211,7 @@
 						{{end}}
 					</a>
 				</div>
-				<div class="status-action">
+				<div class="status-action status-action-last">
 					<a class="status-time" href="{{if not .ShowReplies}}/thread/{{.ID}}{{end}}#status-{{.ID}}"
 						{{if $.Ctx.ThreadInNewTab}}target="_blank"{{end}}> 
 						<time datetime="{{FormatTimeRFC3339 .CreatedAt}}" title="{{FormatTimeRFC822 .CreatedAt}}"> 
diff --git a/templates/user.tmpl b/templates/user.tmpl
index f6750c6..4fe7fd1 100644
--- a/templates/user.tmpl
+++ b/templates/user.tmpl
@@ -6,7 +6,7 @@
 <div>
 	<div class="user-profile-img-container">
 		<a class="img-link" href="{{.User.AvatarStatic}}" target="_blank">
-			<img class="user-profile-img" src="{{.User.AvatarStatic}}" alt="profile-avatar" />
+			<img class="user-profile-img" src="{{.User.AvatarStatic}}" alt="profile-avatar" height="96" />
 		</a>
 	</div>
 	<div class="user-profile-details-container">
diff --git a/templates/userlist.tmpl b/templates/userlist.tmpl
index b4e8cd0..0a44202 100644
--- a/templates/userlist.tmpl
+++ b/templates/userlist.tmpl
@@ -4,7 +4,7 @@
 	<div class="user-list-item">
 		<div>
 			<a class="img-link" href="/user/{{.ID}}">
-				<img class="status-profile-img" src="{{.AvatarStatic}}" title="{{.Acct}}" alt="avatar" />
+				<img class="status-profile-img" src="{{.AvatarStatic}}" title="{{.Acct}}" alt="avatar" height="48" />
 			</a>
 		</div>
 		<div>