Fossil SCM
In single-line edit mode, wrap the chat buttons if the screen is not "wide enough." Give the edit field a min-width of (experimentally) 24em.
Commit
3ca1ec524861466b8d9383f089b0b1b92f2d6eeade5413643579462a212743bc
Parent
ac6e7ae9da579b6…
1 file changed
+4
+4
| --- src/style.chat.css | ||
| +++ src/style.chat.css | ||
| @@ -220,10 +220,13 @@ | ||
| 220 | 220 | body.chat #chat-input-line { |
| 221 | 221 | display: flex; |
| 222 | 222 | flex-direction: row; |
| 223 | 223 | margin-bottom: 0.25em; |
| 224 | 224 | align-items: stretch; |
| 225 | +} | |
| 226 | +body.chat #chat-input-line.single-line { | |
| 227 | + flex-wrap: wrap; | |
| 225 | 228 | } |
| 226 | 229 | body.chat #chat-edit-buttons { |
| 227 | 230 | display: flex; |
| 228 | 231 | flex-direction: column; |
| 229 | 232 | justify-content: space-between; |
| @@ -245,10 +248,11 @@ | ||
| 245 | 248 | } |
| 246 | 249 | body.chat #chat-input-line > input[type=text], |
| 247 | 250 | body.chat #chat-input-line > textarea { |
| 248 | 251 | flex: 5 1 auto; |
| 249 | 252 | max-width: revert; |
| 253 | + min-width: 24em; | |
| 250 | 254 | } |
| 251 | 255 | /* Widget holding the file selection control and preview */ |
| 252 | 256 | body.chat #chat-input-file-area { |
| 253 | 257 | display: flex; |
| 254 | 258 | flex-direction: row; |
| 255 | 259 |
| --- src/style.chat.css | |
| +++ src/style.chat.css | |
| @@ -220,10 +220,13 @@ | |
| 220 | body.chat #chat-input-line { |
| 221 | display: flex; |
| 222 | flex-direction: row; |
| 223 | margin-bottom: 0.25em; |
| 224 | align-items: stretch; |
| 225 | } |
| 226 | body.chat #chat-edit-buttons { |
| 227 | display: flex; |
| 228 | flex-direction: column; |
| 229 | justify-content: space-between; |
| @@ -245,10 +248,11 @@ | |
| 245 | } |
| 246 | body.chat #chat-input-line > input[type=text], |
| 247 | body.chat #chat-input-line > textarea { |
| 248 | flex: 5 1 auto; |
| 249 | max-width: revert; |
| 250 | } |
| 251 | /* Widget holding the file selection control and preview */ |
| 252 | body.chat #chat-input-file-area { |
| 253 | display: flex; |
| 254 | flex-direction: row; |
| 255 |
| --- src/style.chat.css | |
| +++ src/style.chat.css | |
| @@ -220,10 +220,13 @@ | |
| 220 | body.chat #chat-input-line { |
| 221 | display: flex; |
| 222 | flex-direction: row; |
| 223 | margin-bottom: 0.25em; |
| 224 | align-items: stretch; |
| 225 | } |
| 226 | body.chat #chat-input-line.single-line { |
| 227 | flex-wrap: wrap; |
| 228 | } |
| 229 | body.chat #chat-edit-buttons { |
| 230 | display: flex; |
| 231 | flex-direction: column; |
| 232 | justify-content: space-between; |
| @@ -245,10 +248,11 @@ | |
| 248 | } |
| 249 | body.chat #chat-input-line > input[type=text], |
| 250 | body.chat #chat-input-line > textarea { |
| 251 | flex: 5 1 auto; |
| 252 | max-width: revert; |
| 253 | min-width: 24em; |
| 254 | } |
| 255 | /* Widget holding the file selection control and preview */ |
| 256 | body.chat #chat-input-file-area { |
| 257 | display: flex; |
| 258 | flex-direction: row; |
| 259 |