Improve css for mobile devices

diff --git a/static/main.css b/static/main.css
index 3ad86e8c14e5332cb5814a144d85fd70367d33ad..b3dce7a066705de4836d460888e354046b054979 100644 (file)
--- a/static/main.css
+++ b/static/main.css
@@ -1,5 +1,5 @@
 .status-container-container {
-       margin: 16px 0;
+       margin: 16px 0 16px -4px;
        padding: 0 4px;
        border-left: 4px solid transparent;
 }
@@ -14,6 +14,7 @@
 
 .status-content {
        margin: 4px 0 8px 0;
+       word-wrap: anywhere;
 }
 
 .status-content p {
@@ -90,6 +91,7 @@
 .status-image,
 .status-video {
        max-height: 180px;
+       max-width: 220px;
        width: auto;
 }
 
@@ -140,6 +142,7 @@
        padding: 4px;
        font-size: 11pt;
        font-family: initial;
+       max-width: 100%;
 }
 
 .pagination {
@@ -151,7 +154,7 @@
 }
 
 .notification-container {
-       margin: 16px 0;
+       margin: 16px 0 16px -4px;
        padding: 0 4px;
        border-left: 4px solid transparent;
 }
@@ -192,3 +195,15 @@
 .status-reply-info-divider {
        margin: 0 4px;
 }
+
+.post-content-container {
+       padding-right: 8px;
+}
+
+.error-text {
+       margin: 8px 0;
+}
+
+.post-attachment-div {
+       margin: 2px 0;
+}

diff --git a/templates/error.tmpl b/templates/error.tmpl
index b6943be938b3633c4491b38980102121af26195c..890b5a7f1f4baa8dd7bd19041a727fad57b31d4b 100644 (file)
--- a/templates/error.tmpl
+++ b/templates/error.tmpl
@@ -1,6 +1,9 @@
 {{template "header.tmpl"}}
-<h1> Error </h1>
-<div> {{.}} </div>
-<a href="/timeline"> Home </a>
+<div class="page-title"> Error </div>
+<div class="error-text"> {{.}} </div>
+<div>
+<a href="/timeline">Home</a>
+<a href="/signin">Sign In</a>
+</div>
 {{template "footer.tmpl"}}
 

diff --git a/templates/thread.tmpl b/templates/thread.tmpl
index 3ad5daea818c65989f04f149c6eeafc4714e4e9a..d4c88de59963995a5129cd6757370618d60bf8ce 100644 (file)
--- a/templates/thread.tmpl
+++ b/templates/thread.tmpl
@@ -8,12 +8,13 @@
 {{if eq .ID $.ReplyToID}}
 <form class="timeline-post-form" action="/post" method="POST" enctype="multipart/form-data">
        <input type="hidden" name="reply_to_id" value="{{$.ReplyToID}}" />
-       <label for="post-content"> Reply to {{.Account.DisplayName}} </label>
-       <br/>
-       <textarea id="post-content" name="content" class="post-content" cols="50" rows="5">{{$.ReplyContent}}</textarea>
-       <br/>
-       Attachments <input id="post-file-picker" type="file" name="attachments" multiple>
-       <br/>
+       <label for="post-content"> reply to {{.Account.DisplayName}} </label>
+       <div class="post-form-content-container">
+               <textarea id="post-content" name="content" class="post-content" cols="50" rows="5">{{$.ReplyContent}}</textarea>
+       </div>
+       <div>
+               Attachments <input id="post-file-picker" type="file" name="attachments" multiple>
+       </div>
        <button type="submit"> Post </button>
 </form>
 {{end}}

diff --git a/templates/timeline.tmpl b/templates/timeline.tmpl
index 53e3ad7f9db542fd295a01306d36ab75b6e1f4b4..fe426ded18d05037b44d7cdc9434b623c767cfe6 100644 (file)
--- a/templates/timeline.tmpl
+++ b/templates/timeline.tmpl
@@ -4,11 +4,12 @@
 
 <form class="timeline-post-form" action="/post" method="POST" enctype="multipart/form-data">
        <label for="post-content"> New Post </label>
-       <br/>
-       <textarea id="post-content" name="content" class="post-content" cols="50" rows="5"></textarea>
-       <br/>
-       Attachments <input id="post-file-picker" type="file" name="attachments" multiple>
-       <br/>
+       <div class="post-content-container">
+               <textarea id="post-content" name="content" class="post-content" cols="50" rows="5"></textarea>
+       </div>
+       <div class="post-attachment-div">
+               Attachments <input id="post-file-picker" type="file" name="attachments" multiple>
+       </div>
        <button type="submit"> Post </button>
 </form>