Fossil SCM
Use CSS flex layout around the /forum editor textarea so that it will shrink and grow to fit the screen. The intent is making it easier to use on a mobile device.
Commit
268bb7394713e22ee4ab5cf9c1073be6b9d83eaa7f261c612d8c459ac2a32bac
Parent
77adf8dba1b17dd…
2 files changed
+12
-1
+3
-2
+12
-1
| --- src/default.css | ||
| +++ src/default.css | ||
| @@ -905,10 +905,17 @@ | ||
| 905 | 905 | padding: 1px; |
| 906 | 906 | } |
| 907 | 907 | div.forum_body p { |
| 908 | 908 | margin-top: 0; |
| 909 | 909 | } |
| 910 | +div.forum-editor-widget{ | |
| 911 | + display: flex; | |
| 912 | + flex-direction: column; | |
| 913 | +} | |
| 914 | +div.forum-editor-widget > textarea { | |
| 915 | + max-width: initial; | |
| 916 | +} | |
| 910 | 917 | td.form_label { |
| 911 | 918 | vertical-align: top; |
| 912 | 919 | text-align: right; |
| 913 | 920 | } |
| 914 | 921 | .debug { |
| @@ -966,12 +973,16 @@ | ||
| 966 | 973 | div.forumpost-single-controls { |
| 967 | 974 | /* UI controls along the bottom of a single post |
| 968 | 975 | ** in the thread view. */ |
| 969 | 976 | } |
| 970 | 977 | .forum div > form { |
| 978 | + width: 100%; | |
| 971 | 979 | margin: 0.5em 0; |
| 972 | - display: inline-block; | |
| 980 | + display: block; | |
| 981 | +} | |
| 982 | +.forum div > form > * { | |
| 983 | + margin-bottom: 0.35em; | |
| 973 | 984 | } |
| 974 | 985 | .forum-post-collapser { |
| 975 | 986 | /* Common style for the bottom-of-post and right-of-post |
| 976 | 987 | expand/collapse widgets. */ |
| 977 | 988 | font-size: 0.8em; |
| 978 | 989 |
| --- src/default.css | |
| +++ src/default.css | |
| @@ -905,10 +905,17 @@ | |
| 905 | padding: 1px; |
| 906 | } |
| 907 | div.forum_body p { |
| 908 | margin-top: 0; |
| 909 | } |
| 910 | td.form_label { |
| 911 | vertical-align: top; |
| 912 | text-align: right; |
| 913 | } |
| 914 | .debug { |
| @@ -966,12 +973,16 @@ | |
| 966 | div.forumpost-single-controls { |
| 967 | /* UI controls along the bottom of a single post |
| 968 | ** in the thread view. */ |
| 969 | } |
| 970 | .forum div > form { |
| 971 | margin: 0.5em 0; |
| 972 | display: inline-block; |
| 973 | } |
| 974 | .forum-post-collapser { |
| 975 | /* Common style for the bottom-of-post and right-of-post |
| 976 | expand/collapse widgets. */ |
| 977 | font-size: 0.8em; |
| 978 |
| --- src/default.css | |
| +++ src/default.css | |
| @@ -905,10 +905,17 @@ | |
| 905 | padding: 1px; |
| 906 | } |
| 907 | div.forum_body p { |
| 908 | margin-top: 0; |
| 909 | } |
| 910 | div.forum-editor-widget{ |
| 911 | display: flex; |
| 912 | flex-direction: column; |
| 913 | } |
| 914 | div.forum-editor-widget > textarea { |
| 915 | max-width: initial; |
| 916 | } |
| 917 | td.form_label { |
| 918 | vertical-align: top; |
| 919 | text-align: right; |
| 920 | } |
| 921 | .debug { |
| @@ -966,12 +973,16 @@ | |
| 973 | div.forumpost-single-controls { |
| 974 | /* UI controls along the bottom of a single post |
| 975 | ** in the thread view. */ |
| 976 | } |
| 977 | .forum div > form { |
| 978 | width: 100%; |
| 979 | margin: 0.5em 0; |
| 980 | display: block; |
| 981 | } |
| 982 | .forum div > form > * { |
| 983 | margin-bottom: 0.35em; |
| 984 | } |
| 985 | .forum-post-collapser { |
| 986 | /* Common style for the bottom-of-post and right-of-post |
| 987 | expand/collapse widgets. */ |
| 988 | font-size: 0.8em; |
| 989 |
+3
-2
| --- src/forum.c | ||
| +++ src/forum.c | ||
| @@ -1397,12 +1397,13 @@ | ||
| 1397 | 1397 | @ Title: <input type="input" name="title" value="%h(zTitle)" size="50" |
| 1398 | 1398 | @ maxlength="125"><br> |
| 1399 | 1399 | } |
| 1400 | 1400 | @ %z(href("%R/markup_help"))Markup style</a>: |
| 1401 | 1401 | mimetype_option_menu(zMimetype, "mimetype"); |
| 1402 | - @ <br><textarea aria-label="Content:" name="content" class="wikiedit" \ | |
| 1403 | - @ cols="80" rows="25" wrap="virtual">%h(zContent)</textarea><br> | |
| 1402 | + @ <div class="forum-editor-widget"> | |
| 1403 | + @ <textarea aria-label="Content:" name="content" class="wikiedit" \ | |
| 1404 | + @ cols="80" rows="25" wrap="virtual">%h(zContent)</textarea></div> | |
| 1404 | 1405 | } |
| 1405 | 1406 | |
| 1406 | 1407 | /* |
| 1407 | 1408 | ** WEBPAGE: forumpost_close hidden |
| 1408 | 1409 | ** WEBPAGE: forumpost_reopen hidden |
| 1409 | 1410 |
| --- src/forum.c | |
| +++ src/forum.c | |
| @@ -1397,12 +1397,13 @@ | |
| 1397 | @ Title: <input type="input" name="title" value="%h(zTitle)" size="50" |
| 1398 | @ maxlength="125"><br> |
| 1399 | } |
| 1400 | @ %z(href("%R/markup_help"))Markup style</a>: |
| 1401 | mimetype_option_menu(zMimetype, "mimetype"); |
| 1402 | @ <br><textarea aria-label="Content:" name="content" class="wikiedit" \ |
| 1403 | @ cols="80" rows="25" wrap="virtual">%h(zContent)</textarea><br> |
| 1404 | } |
| 1405 | |
| 1406 | /* |
| 1407 | ** WEBPAGE: forumpost_close hidden |
| 1408 | ** WEBPAGE: forumpost_reopen hidden |
| 1409 |
| --- src/forum.c | |
| +++ src/forum.c | |
| @@ -1397,12 +1397,13 @@ | |
| 1397 | @ Title: <input type="input" name="title" value="%h(zTitle)" size="50" |
| 1398 | @ maxlength="125"><br> |
| 1399 | } |
| 1400 | @ %z(href("%R/markup_help"))Markup style</a>: |
| 1401 | mimetype_option_menu(zMimetype, "mimetype"); |
| 1402 | @ <div class="forum-editor-widget"> |
| 1403 | @ <textarea aria-label="Content:" name="content" class="wikiedit" \ |
| 1404 | @ cols="80" rows="25" wrap="virtual">%h(zContent)</textarea></div> |
| 1405 | } |
| 1406 | |
| 1407 | /* |
| 1408 | ** WEBPAGE: forumpost_close hidden |
| 1409 | ** WEBPAGE: forumpost_reopen hidden |
| 1410 |