Modifications to about pages

www/styles/screen.css

@@ -115,6 +115,7 @@ audio, video {
  filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/img/icon/rss.png', sizingMethod='scale');
  -ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/img/icon/rss.png', sizingMethod='scale')";
 }
+
 .usericon, .buddyicon {
  width: 1em;
  height: 1em;
@@ -125,6 +126,37 @@ audio, video {
  border-radius: 50%;
  padding-right: unset !important;
 }
+.circle, .usericon, .buddyicon {
+ border-radius: 50%;
+}
+.portrait {
+ position: absolute;
+ background-color: white;
+ border: solid black 5px;
+ height: 10rem;
+ width: 10rem;
+ background-size: cover;
+ top: 13.5rem;
+}
+.banner {
+ position: relative;
+ padding: .5rem;
+ box-sizing: border-box;
+ resize: horizontal;
+ overflow: clip;
+ max-width: 45rem;
+ min-height: 25rem;
+ width: 100%;
+ background-repeat: no-repeat;
+ background-position: top center;
+ margin-left: auto;
+ margin-right: auto;
+}
+.banner > #postData {
+ position: absolute;
+ bottom: 5rem;
+ left: 12rem;
+}
 .avatar {
  width: 3em;
  height: 3em;

www/templates/posts.tx

@@ -72,11 +72,18 @@
                 <div style="background-image:url(<: $post.href :>);" class="responsive preview"></div>
             : }
             : if ( $post.wallpaper ) {
-                <div style="background-image:url(<: $post.wallpaper :>);">
-                    <div style="background-image:url(<: $post.preview :>);" class="responsive preview usericon"></div>
+                <div style="background-image:url(<: $post.wallpaper :>);" class="banner">
+                    <div style="background-image:url(<: $post.preview :>);" class="circle portrait"></div>
+            : }
+            : if( $post.data ) {
+                <div id="postData"><: $post.data :></div>
+            : }
+            : elsif( mark_raw ) {
+                <div id="postData"><: mark_raw :></div>
+            : }
+            : if( $post.wallpaper ) {
                 </div>
             : }
-            : $post.data | mark_raw;
             : if ( $can_edit ) {
             <br />
             <a style="display: inline-block;" onclick="switchMenu('<: $post.id :>-<: $post.version :>');">[Edit]</a>