nice big buttons on mobile

This commit is contained in:
rimu 2024-01-17 18:46:03 +13:00
parent b072956289
commit 5d34feb0be
5 changed files with 77 additions and 17 deletions

View file

@ -668,13 +668,10 @@ fieldset legend {
.voting_buttons_new {
display: inline-block;
padding-left: 5px;
padding-right: 5px;
}
.voting_buttons_new .upvote_button, .voting_buttons_new .downvote_button {
display: inline-block;
padding-left: 5px;
padding-right: 5px;
padding: 5px 15px;
position: relative;
cursor: pointer;
color: rgba(var(--bs-link-color-rgb), var(--bs-link-opacity, 1));
@ -696,6 +693,32 @@ fieldset legend {
color: darkred;
font-weight: bold;
}
.voting_buttons_new .upvote_button {
top: 1px;
}
@media (min-width: 1280px) {
.voting_buttons_new .upvote_button {
padding-right: 5px;
}
}
.voting_buttons_new .upvote_button .htmx-indicator {
left: 13px;
top: 7px;
}
.voting_buttons_new .downvote_button {
top: 1px;
}
.voting_buttons_new .downvote_button .htmx-indicator {
left: 12px;
}
@media (min-width: 1280px) {
.voting_buttons_new .downvote_button {
padding-left: 5px;
}
.voting_buttons_new .downvote_button .htmx-indicator {
left: 2px;
}
}
.voting_buttons_new .htmx-indicator {
position: absolute;
left: 3px;
@ -824,7 +847,9 @@ fieldset legend {
.comment .comment_author a.unhide {
display: none;
text-decoration: none;
padding: 5px;
padding: 5px 15px;
position: relative;
top: 3px;
}
.comment .comment_actions {
margin-top: -10px;
@ -832,13 +857,18 @@ fieldset legend {
}
.comment .comment_actions a {
text-decoration: none;
padding: 5px 0;
}
.comment .comment_actions .hide_button {
display: inline-block;
}
.comment .comment_actions .hide_button a {
padding-left: 5px;
padding-right: 5px;
padding: 5px 15px;
}
.comment .comment_actions .notif_toggle {
text-decoration: none;
font-size: 87%;
padding: 5px 15px;
}
.comment .replies {
margin-top: 15px;

View file

@ -309,13 +309,10 @@ nav, etc which are used site-wide */
.voting_buttons_new {
display: inline-block;
padding-left: 5px;
padding-right: 5px;
.upvote_button, .downvote_button {
display: inline-block;
padding-left: 5px;
padding-right: 5px;
padding: 5px 15px;
position: relative;
cursor: pointer;
color: rgba(var(--bs-link-color-rgb),var(--bs-link-opacity,1));
@ -342,6 +339,31 @@ nav, etc which are used site-wide */
}
}
.upvote_button {
top: 1px;
@include breakpoint(laptop) {
padding-right: 5px;
}
.htmx-indicator {
left: 13px;
top: 7px;
}
}
.downvote_button {
top: 1px;
.htmx-indicator {
left: 12px;
}
@include breakpoint(laptop) {
padding-left: 5px;
.htmx-indicator {
left: 2px;
}
}
}
.htmx-indicator{
position: absolute;
left: 3px;
@ -485,7 +507,9 @@ nav, etc which are used site-wide */
a.unhide {
display: none;
text-decoration: none;
padding: 5px;
padding: 5px 15px;
position: relative;
top: 3px;
}
}
@ -494,16 +518,22 @@ nav, etc which are used site-wide */
position: relative;
a {
text-decoration: none;
padding: 5px 0;
}
.hide_button {
display: inline-block;
a {
padding-left: 5px;
padding-right: 5px;
padding: 5px 15px;
}
}
.notif_toggle {
text-decoration: none;
font-size: 87%;
padding: 5px 15px;
}
}
.replies {

View file

@ -625,7 +625,7 @@ nav.navbar {
display: block;
position: absolute;
bottom: 0;
right: 48px;
right: -16px;
width: 41px;
text-decoration: none;
}

View file

@ -249,7 +249,7 @@ nav.navbar {
display: block;
position: absolute;
bottom: 0;
right: 48px;
right: -16px;
width: 41px;
text-decoration: none;
}

View file

@ -1,4 +1,4 @@
<a href="{{ url_for('post.post_reply_notification', post_reply_id=comment['comment'].id) }}" rel="nofollow"
class="pl-2 small fe {{ 'fe-bell' if comment['comment'].notify_author else 'fe-no-bell' }} no-underline"
class="notif_toggle fe {{ 'fe-bell' if comment['comment'].notify_author else 'fe-no-bell' }}"
hx-post="{{ url_for('post.post_reply_notification', post_reply_id=comment['comment'].id) }}" hx-trigger="click throttle:1s" hx-swap="outerHTML"
title="{{ _('Notify about replies') }}"></a>