diff --git a/src/App.scss b/src/App.scss index 219269a18..289add77e 100644 --- a/src/App.scss +++ b/src/App.scss @@ -411,6 +411,10 @@ nav { --__horizontal-gap: 0.75em; --__vertical-gap: 0.5em; + &.-non-interactive { + cursor: auto; + } + &.-active, &:hover { border-top-width: 1px; @@ -488,7 +492,8 @@ textarea { .input { &.unstyled { border-radius: 0; - background: none; + /* stylelint-disable-next-line declaration-no-important */ + background: none !important; box-shadow: none; height: unset; } @@ -528,6 +533,7 @@ textarea { &:checked + label::before { box-shadow: var(--shadow); background-color: var(--background); + color: var(--text); } &:disabled { @@ -541,7 +547,7 @@ textarea { + label::before { flex-shrink: 0; display: inline-block; - content: ""; + content: "•"; transition: box-shadow 200ms; width: 1.1em; height: 1.1em; diff --git a/src/components/attachment/attachment.scss b/src/components/attachment/attachment.scss index b1a3fa5ee..47660bf68 100644 --- a/src/components/attachment/attachment.scss +++ b/src/components/attachment/attachment.scss @@ -82,6 +82,13 @@ } } + .video-container { + border: none; + outline: none; + color: inherit; + background: transparent; + } + .audio-container { display: flex; align-items: flex-end; diff --git a/src/components/button_unstyled.style.js b/src/components/button_unstyled.style.js index a2d854aaa..a47701db7 100644 --- a/src/components/button_unstyled.style.js +++ b/src/components/button_unstyled.style.js @@ -4,7 +4,8 @@ export default { states: { disabled: ':disabled', hover: ':hover:not(:disabled)', - focused: ':focus-within' + focused: ':focus-within', + toggled: '.toggled' }, validInnerComponents: [ 'Text', diff --git a/src/components/list/list.vue b/src/components/list/list.vue index b8fcaf9d2..c885bacd9 100644 --- a/src/components/list/list.vue +++ b/src/components/list/list.vue @@ -7,7 +7,7 @@ v-for="item in items" :key="getKey(item)" class="list-item" - :class="getClass(item)" + :class="[getClass(item), nonInteractive ? '-non-interactive' : '']" role="listitem" > '' + }, + nonInteractive: { + type: Boolean, + default: false } } } diff --git a/src/components/list/list_item.style.js b/src/components/list/list_item.style.js index b00a16cfa..5c95da46c 100644 --- a/src/components/list/list_item.style.js +++ b/src/components/list/list_item.style.js @@ -3,7 +3,7 @@ export default { selector: '.list-item', states: { active: '.-active', - hover: ':hover' + hover: ':hover:not(.-non-interactive)' }, validInnerComponents: [ 'Text', diff --git a/src/components/poll/poll.vue b/src/components/poll/poll.vue index 57ec879a5..1e97b3cae 100644 --- a/src/components/poll/poll.vue +++ b/src/components/poll/poll.vue @@ -38,6 +38,7 @@ :aria-labelledby="`option-vote-${randomSeed}-${index}`" :aria-checked="choices[index]" @click="activateOption(index)" + class="input unstyled" >
- + @@ -87,7 +87,7 @@ :label="$t('user_card.followers')" :disabled="!user.followers_count" > - +