update button toggled state, apply it to emoji reactions
This commit is contained in:
parent
f0c4bb1193
commit
8462853269
@ -117,7 +117,9 @@ button {
|
|||||||
color: $fallback--text;
|
color: $fallback--text;
|
||||||
color: var(--btnToggledText, $fallback--text);
|
color: var(--btnToggledText, $fallback--text);
|
||||||
background-color: $fallback--fg;
|
background-color: $fallback--fg;
|
||||||
background-color: var(--btnToggled, $fallback--fg)
|
background-color: var(--btnToggled, $fallback--fg);
|
||||||
|
box-shadow: 0px 0px 4px 0px rgba(255, 255, 255, 0.3), 0px 1px 0px 0px rgba(0, 0, 0, 0.2) inset, 0px -1px 0px 0px rgba(255, 255, 255, 0.2) inset;
|
||||||
|
box-shadow: var(--buttonPressedShadow);
|
||||||
}
|
}
|
||||||
|
|
||||||
&.danger {
|
&.danger {
|
||||||
|
@ -4,7 +4,7 @@
|
|||||||
v-for="(reaction) in emojiReactions"
|
v-for="(reaction) in emojiReactions"
|
||||||
:key="reaction.emoji"
|
:key="reaction.emoji"
|
||||||
class="emoji-reaction btn btn-default"
|
class="emoji-reaction btn btn-default"
|
||||||
:class="{ 'picked-reaction': reactedWith(reaction.emoji) }"
|
:class="{ 'toggled': reactedWith(reaction.emoji) }"
|
||||||
@click="emojiOnClick(reaction.emoji, $event)"
|
@click="emojiOnClick(reaction.emoji, $event)"
|
||||||
>
|
>
|
||||||
<span class="reaction-emoji">{{ reaction.emoji }}</span>
|
<span class="reaction-emoji">{{ reaction.emoji }}</span>
|
||||||
@ -40,10 +40,4 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.picked-reaction {
|
|
||||||
border: 1px solid var(--link, $fallback--link);
|
|
||||||
margin-left: -1px; // offset the border, can't use inset shadows either
|
|
||||||
margin-right: calc(0.5em - 1px);
|
|
||||||
}
|
|
||||||
|
|
||||||
</style>
|
</style>
|
||||||
|
@ -460,6 +460,19 @@
|
|||||||
:label="$t('settings.text')"
|
:label="$t('settings.text')"
|
||||||
/>
|
/>
|
||||||
<ContrastRatio :contrast="previewContrast.btnDisabledText" />
|
<ContrastRatio :contrast="previewContrast.btnDisabledText" />
|
||||||
|
<h4>{{ $t('settings.style.advanced_colors.toggled') }}</h4>
|
||||||
|
<ColorInput
|
||||||
|
v-model="btnToggledColorLocal"
|
||||||
|
name="btnToggledColor"
|
||||||
|
:fallback="previewTheme.colors.btnToggled"
|
||||||
|
:label="$t('settings.background')"
|
||||||
|
/>
|
||||||
|
<ColorInput
|
||||||
|
v-model="btnToggledTextColorLocal"
|
||||||
|
name="btnToggledTextColor"
|
||||||
|
:fallback="previewTheme.colors.btnToggledText"
|
||||||
|
:label="$t('settings.text')"
|
||||||
|
/>
|
||||||
</div>
|
</div>
|
||||||
<div class="color-item">
|
<div class="color-item">
|
||||||
<h4>{{ $t('settings.style.advanced_colors.tabs') }}</h4>
|
<h4>{{ $t('settings.style.advanced_colors.tabs') }}</h4>
|
||||||
|
@ -2,6 +2,7 @@
|
|||||||
"_pleroma_theme_version": 2,
|
"_pleroma_theme_version": 2,
|
||||||
"name": "Redmond XX SE",
|
"name": "Redmond XX SE",
|
||||||
"source": {
|
"source": {
|
||||||
|
"themeEngineVersion": 3,
|
||||||
"shadows": {
|
"shadows": {
|
||||||
"panel": [
|
"panel": [
|
||||||
{
|
{
|
||||||
@ -276,6 +277,7 @@
|
|||||||
"topBar": "#000080",
|
"topBar": "#000080",
|
||||||
"topBarLink": "#ffffff",
|
"topBarLink": "#ffffff",
|
||||||
"btn": "#c0c0c0",
|
"btn": "#c0c0c0",
|
||||||
|
"btnToggled": "--btn",
|
||||||
"faint": "#3f3f3f",
|
"faint": "#3f3f3f",
|
||||||
"faintLink": "#404080",
|
"faintLink": "#404080",
|
||||||
"border": "#808080",
|
"border": "#808080",
|
||||||
|
@ -2,6 +2,7 @@
|
|||||||
"_pleroma_theme_version": 2,
|
"_pleroma_theme_version": 2,
|
||||||
"name": "Redmond XX",
|
"name": "Redmond XX",
|
||||||
"source": {
|
"source": {
|
||||||
|
"themeEngineVersion": 3,
|
||||||
"shadows": {
|
"shadows": {
|
||||||
"panel": [
|
"panel": [
|
||||||
{
|
{
|
||||||
@ -267,6 +268,7 @@
|
|||||||
"topBar": "#000080",
|
"topBar": "#000080",
|
||||||
"topBarLink": "#ffffff",
|
"topBarLink": "#ffffff",
|
||||||
"btn": "#c0c0c0",
|
"btn": "#c0c0c0",
|
||||||
|
"btnToggled": "--btn",
|
||||||
"faint": "#3f3f3f",
|
"faint": "#3f3f3f",
|
||||||
"faintLink": "#404080",
|
"faintLink": "#404080",
|
||||||
"border": "#808080",
|
"border": "#808080",
|
||||||
|
@ -2,6 +2,7 @@
|
|||||||
"_pleroma_theme_version": 2,
|
"_pleroma_theme_version": 2,
|
||||||
"name": "Redmond XXI",
|
"name": "Redmond XXI",
|
||||||
"source": {
|
"source": {
|
||||||
|
"themeEngineVersion": 3,
|
||||||
"shadows": {
|
"shadows": {
|
||||||
"panel": [
|
"panel": [
|
||||||
{
|
{
|
||||||
@ -249,6 +250,7 @@
|
|||||||
"topBar": "#042967",
|
"topBar": "#042967",
|
||||||
"topBarLink": "#ffffff",
|
"topBarLink": "#ffffff",
|
||||||
"btn": "#d6d6ce",
|
"btn": "#d6d6ce",
|
||||||
|
"btnToggled": "--btn",
|
||||||
"faint": "#3f3f3f",
|
"faint": "#3f3f3f",
|
||||||
"faintLink": "#404080",
|
"faintLink": "#404080",
|
||||||
"border": "#808080",
|
"border": "#808080",
|
||||||
|
Loading…
Reference in New Issue
Block a user