Accessibility: Add max-height to compose form
This commit is contained in:
parent
a59693be6e
commit
9de2e43b28
@ -1,7 +1,9 @@
|
||||
### 1.4.0rc2: 2024-04-04
|
||||
### 1.4.0rc3: 2024-04-04
|
||||
|
||||
* Fix a regression with z-index, autosuggest not clickable if compose form expanding
|
||||
* Make scrollbars more visible
|
||||
* Accessibility: Add max-height to compose form (thanks @rmattila74@mastodo.fi!)
|
||||
* Accessibility: Revert resize: true in compose form (thanks @rmattila74@mastodo.fi!)
|
||||
|
||||
### 1.3.9: 2023-04-04
|
||||
|
||||
|
44
style.css
44
style.css
@ -1,5 +1,5 @@
|
||||
/* Mastodon Bird UI by @rolle@mementomori.social
|
||||
1.4.0rc2 */
|
||||
1.4.0rc3 */
|
||||
|
||||
/* CSS variables */
|
||||
:root {
|
||||
@ -2072,8 +2072,24 @@ body.embed .button.logo-button:hover,
|
||||
}
|
||||
}
|
||||
|
||||
/* Compose form and reply indicator box, see https://mastodo.fi/@rmattila74/110140863513856240 */
|
||||
.layout-single-column .reply-indicator {
|
||||
max-height: 150px;
|
||||
}
|
||||
|
||||
.layout-single-column .compose-form .autosuggest-textarea__textarea {
|
||||
resize: both;
|
||||
/* stylelint-disable-next-line */
|
||||
max-height: 20vh !important; /* stylelint-disable-next-line */
|
||||
overflow-y: scroll !important;
|
||||
resize: none;
|
||||
}
|
||||
|
||||
@media (max-height: 1000px) {
|
||||
.layout-single-column .compose-form .autosuggest-textarea__textarea {
|
||||
/* stylelint-disable-next-line */
|
||||
max-height: 10vh !important;
|
||||
resize: none;
|
||||
}
|
||||
}
|
||||
|
||||
.layout-single-column .server-banner .button:hover,
|
||||
@ -3121,39 +3137,63 @@ body.embed .entry .detailed-status {
|
||||
}
|
||||
|
||||
/* Scrollbars */
|
||||
.layout-single-column textarea::-webkit-scrollbar,
|
||||
.layout-single-column .autosuggest-textarea__textarea::-webkit-scrollbar,
|
||||
.layout-single-column .reply-indicator::-webkit-scrollbar,
|
||||
.layout-single-column::-webkit-scrollbar {
|
||||
height: 6px;
|
||||
width: 6px;
|
||||
}
|
||||
|
||||
.layout-single-column textarea::-webkit-scrollbar-thumb,
|
||||
.layout-single-column .autosuggest-textarea__textarea::-webkit-scrollbar-thumb,
|
||||
.layout-single-column .reply-indicator::-webkit-scrollbar-thumb,
|
||||
.layout-single-column::-webkit-scrollbar-thumb {
|
||||
background-color: var(--color-border);
|
||||
border: 0px solid var(--color-border);
|
||||
border-radius: 50px;
|
||||
}
|
||||
|
||||
.layout-single-column textarea::-webkit-scrollbar-thumb:hover,
|
||||
.layout-single-column .autosuggest-textarea__textarea::-webkit-scrollbar-thumb:hover,
|
||||
.layout-single-column .reply-indicator::-webkit-scrollbar-thumb:hover,
|
||||
.layout-single-column::-webkit-scrollbar-thumb:hover {
|
||||
background-color: var(--color-light-purple);
|
||||
}
|
||||
|
||||
.layout-single-column textarea::-webkit-scrollbar-thumb:active,
|
||||
.layout-single-column .autosuggest-textarea__textarea::-webkit-scrollbar-thumb:active,
|
||||
.layout-single-column .reply-indicator::-webkit-scrollbar-thumb:active,
|
||||
.layout-single-column::-webkit-scrollbar-thumb:active {
|
||||
background-color: var(--color-bg);
|
||||
}
|
||||
|
||||
.layout-single-column textarea::-webkit-scrollbar-track,
|
||||
.layout-single-column .autosuggest-textarea__textarea::-webkit-scrollbar-track,
|
||||
.layout-single-column .reply-indicator::-webkit-scrollbar-track,
|
||||
.layout-single-column::-webkit-scrollbar-track {
|
||||
background-color: var(--color-bg);
|
||||
border: 0px solid var(--color-border);
|
||||
border-radius: 0;
|
||||
}
|
||||
|
||||
.layout-single-column textarea::-webkit-scrollbar-track:hover,
|
||||
.layout-single-column .autosuggest-textarea__textarea::-webkit-scrollbar-track:hover,
|
||||
.layout-single-column .reply-indicator::-webkit-scrollbar-track:hover,
|
||||
.layout-single-column::-webkit-scrollbar-track:hover {
|
||||
background-color: var(--color-bg);
|
||||
}
|
||||
|
||||
.layout-single-column textarea::-webkit-scrollbar-track:active,
|
||||
.layout-single-column .autosuggest-textarea__textarea::-webkit-scrollbar-track:active,
|
||||
.layout-single-column .reply-indicator::-webkit-scrollbar-track:active,
|
||||
.layout-single-column::-webkit-scrollbar-track:active {
|
||||
background-color: var(--color-bg);
|
||||
}
|
||||
|
||||
.layout-single-column textarea::-webkit-scrollbar-corner,
|
||||
.layout-single-column .autosuggest-textarea__textarea::-webkit-scrollbar-corner,
|
||||
.layout-single-column .reply-indicator::-webkit-scrollbar-corner,
|
||||
.layout-single-column::-webkit-scrollbar-corner {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
Loading…
x
Reference in New Issue
Block a user