style: add button labels for mobile devices

This commit is contained in:
grandeljay 2023-09-24 17:28:02 +02:00
parent 079060b459
commit 7076aa32c4
3 changed files with 16 additions and 42 deletions

View file

@ -349,24 +349,6 @@
} }
} }
.wishlist .ui.card > .content > .extra.buttons > .ui.labeled.icon.button > i.icon {
display: contents;
}
@media (min-width: 512px) {
.wishlist .ui.card > .content > .extra.buttons > .ui.labeled.icon.button > i.icon {
display: revert;
}
}
.wishlist .ui.card > .content > .extra.buttons > .ui.labeled.icon.button > span {
display: none;
}
@media (min-width: 512px) {
.wishlist .ui.card > .content > .extra.buttons > .ui.labeled.icon.button > span {
display: revert;
}
}
/** Overlay */ /** Overlay */
.ui.card .dimmer, .ui.card .dimmer,
.ui.cards > .card .dimmer { .ui.cards > .card .dimmer {

View file

@ -57,10 +57,15 @@
/** Actions */ /** Actions */
.ui.modal.wish-details > .actions { .ui.modal.wish-details > .actions {
display: flex; display: flex;
flex-flow: row wrap; flex-flow: column nowrap;
gap: 0.25em; gap: 0.25em;
padding: 1rem !important; padding: 1rem !important;
} }
@media (min-width: 768px) {
.ui.modal.wish-details > .actions {
flex-direction: row;
}
}
.ui.modal.wish-details > .actions .button { .ui.modal.wish-details > .actions .button {
margin: 0; margin: 0;
@ -76,26 +81,3 @@
flex: 0 1 auto; flex: 0 1 auto;
} }
} }
.ui.modal.wish-details > .actions .button i {
display: contents;
}
@media (min-width: 768px) {
.ui.modal.wish-details > .actions .button i {
display: none;
}
}
@media (min-width: 1024px) {
.ui.modal.wish-details > .actions .button i {
display: inline;
}
}
.ui.modal.wish-details > .actions .button span {
display: none;
}
@media (min-width: 768px) {
.ui.modal.wish-details > .actions .button span {
display: inline;
}
}

View file

@ -181,6 +181,16 @@ $page->navigation();
?> ?>
</li> </li>
</ul> </ul>
<h3 class="ui header"><?= __('Changed') ?></h3>
<ul>
<li>
<?php
/** TRANSLATORS: Changelog: Changed */
echo __('Added button labels for mobile devices');
?>
</li>
</ul>
</div> </div>
</div> </div>