diff --git a/tildes/scss/modules/_btn.scss b/tildes/scss/modules/_btn.scss index 29939ff..5e807c5 100644 --- a/tildes/scss/modules/_btn.scss +++ b/tildes/scss/modules/_btn.scss @@ -68,3 +68,49 @@ border: 1px solid; } } + +.btn-post { + display: flex; + flex-wrap: wrap; + align-items: center; + justify-content: space-between; + margin: 0; + padding: 0.2rem; + + // The buttons don't need to be spaced widely on a desktop + @media (min-width: $size-md) { + justify-content: left; + } + + li { + margin-top: 0; + } + + // Combined with flex-wrap: wrap, this should put any form on its own line + form { + min-width: 100%; + } +} + +.btn-post-action { + @include min-touch-size; + + display: flex; + padding: 0.2rem 0.4rem; + + background: none; + border: 0; + + justify-content: center; + align-items: center; + + font-weight: bold; + font-size: 0.6rem; + line-height: 0.6rem; + + cursor: pointer; +} + +.btn-post-action-used { + text-decoration: underline; +} diff --git a/tildes/scss/modules/_comment.scss b/tildes/scss/modules/_comment.scss index 7ff5fbe..7066059 100644 --- a/tildes/scss/modules/_comment.scss +++ b/tildes/scss/modules/_comment.scss @@ -167,7 +167,7 @@ .comment-tree-replies, .comment-text, .comment-votes, - .post-buttons { + .btn-post { display: none; } diff --git a/tildes/scss/modules/_post-buttons.scss b/tildes/scss/modules/_post-buttons.scss deleted file mode 100644 index 3ec2da3..0000000 --- a/tildes/scss/modules/_post-buttons.scss +++ /dev/null @@ -1,45 +0,0 @@ -// Copyright (c) 2018 Tildes contributors -// SPDX-License-Identifier: AGPL-3.0-or-later - -.post-buttons { - display: flex; - flex-wrap: wrap; - align-items: center; - justify-content: space-between; - margin: 0; - padding: 0.2rem; - - // The buttons don't need to be spaced widely on a desktop - @media (min-width: $size-md) { - justify-content: left; - } - - li { - margin-top: 0; - } - - // Combined with flex-wrap: wrap, this should put any form on its own line - form { - min-width: 100%; - } -} - -.post-button { - @include min-touch-size; - - display: flex; - padding: 0.2rem 0.4rem; - - justify-content: center; - align-items: center; - - font-weight: bold; - font-size: 0.6rem; - line-height: 0.6rem; - - cursor: pointer; -} - -.post-button-used { - text-decoration: underline; -} diff --git a/tildes/scss/styles.scss b/tildes/scss/styles.scss index d32e0df..ca8d258 100644 --- a/tildes/scss/styles.scss +++ b/tildes/scss/styles.scss @@ -23,7 +23,6 @@ @import 'modules/nav'; @import 'modules/pagination'; @import 'modules/post'; -@import 'modules/post-buttons'; @import 'modules/settings'; @import 'modules/sidebar'; @import 'modules/site-footer'; diff --git a/tildes/scss/themes/_theme_base.scss b/tildes/scss/themes/_theme_base.scss index 4be070e..5ddb8d6 100644 --- a/tildes/scss/themes/_theme_base.scss +++ b/tildes/scss/themes/_theme_base.scss @@ -163,6 +163,18 @@ } } + .btn-post-action { + color: map-get($theme, "foreground-secondary"); + + &:hover { + color: map-get($theme, "foreground-extreme"); + } + } + + .btn-post-action-used { + color: map-get($theme, "button-used"); + } + .btn-comment-label-exemplary { @include labelbutton(map-get($theme, "comment-label-exemplary")); } @@ -335,18 +347,6 @@ } } - .post-button { - color: map-get($theme, "foreground-secondary"); - - &:hover { - color: map-get($theme, "foreground-extreme"); - } - } - - .post-button-used { - color: map-get($theme, "button-used"); - } - .sidebar-controls { background-color: map-get($theme, "background-secondary"); } diff --git a/tildes/static/js/behaviors/comment-label-button.js b/tildes/static/js/behaviors/comment-label-button.js index e9f4a9f..a0c073c 100644 --- a/tildes/static/js/behaviors/comment-label-button.js +++ b/tildes/static/js/behaviors/comment-label-button.js @@ -76,7 +76,7 @@ $.onmount('[data-js-comment-label-button]', function() { // update Intercooler so it knows about these new elements Intercooler.processNodes(clone); - $comment.find(".post-buttons").first().after(clone); + $comment.find(".btn-post").first().after(clone); }); }); diff --git a/tildes/static/js/behaviors/comment-reply-button.js b/tildes/static/js/behaviors/comment-reply-button.js index 28d1630..7827464 100644 --- a/tildes/static/js/behaviors/comment-reply-button.js +++ b/tildes/static/js/behaviors/comment-reply-button.js @@ -72,7 +72,7 @@ $.onmount('[data-js-comment-reply-button]', function() { $(cancelButton).on('click', function (event) { // re-enable click/hover events on the reply button $(this).parents('.comment').first() - .find('.post-button[name=reply]').first() + .find('.btn-post-action[name=reply]').first() .css('pointer-events', 'auto'); }); buttonDiv.appendChild(cancelButton); diff --git a/tildes/tildes/templates/macros/comments.jinja2 b/tildes/tildes/templates/macros/comments.jinja2 index 1b674f1..17bbd13 100644 --- a/tildes/tildes/templates/macros/comments.jinja2 +++ b/tildes/tildes/templates/macros/comments.jinja2 @@ -161,10 +161,10 @@ {% endif %} - + {% if request.has_permission('vote', comment) %} {% if comment.user_voted is defined and comment.user_voted %} -
  • +
  • {% endif %} {% if request.has_permission('edit', comment) %} -
  • + >Edit {% endif %} {% if request.has_permission('delete', comment) %} -
  • + >Delete {% endif %} {% if request.has_permission('bookmark', comment) %} {% if comment.bookmark_created_time %} -
  • + {% endif %} {% if request.has_permission("remove", comment) %}
  • {% if not comment.is_removed %} - Remove + >Remove {% else %} - Un-remove + >Un-remove {% endif %}
  • {% endif %} {% if request.has_permission('reply', comment) %} -
  • Reply
  • +
  • {% endif %}
    {% endif %} diff --git a/tildes/tildes/templates/topic.jinja2 b/tildes/tildes/templates/topic.jinja2 index e3a41f1..e3a2915 100644 --- a/tildes/tildes/templates/topic.jinja2 +++ b/tildes/tildes/templates/topic.jinja2 @@ -67,81 +67,81 @@ {% endif %} {% if request.has_any_permission(('edit', 'delete', 'tag', 'lock', 'move', 'edit_title', 'remove', 'bookmark'), topic) %} - + {% if request.has_permission('edit', topic) %} -
  • + >Edit {% endif %} {% if request.has_permission('tag', topic) %} -
  • + data-ic-target=".topic-full .btn-post:first + .btn-post-settings" + >Tag {% endif %} {% if request.has_permission('delete', topic) %} -
  • + >Delete {% endif %} {% if request.has_permission('move', topic) %} -
  • {% endif %} {% if request.has_permission('edit_title', topic) %} -
  • {% endif %} {% if request.has_permission('lock', topic) %}
  • {% if not topic.is_locked %} - Lock + >Lock {% else %} - Unlock + >Unlock {% endif %}
  • {% endif %} @@ -149,21 +149,21 @@ {% if request.has_permission('bookmark', topic) %}
  • {% if not topic.bookmark_created_time %} - Bookmark + >Bookmark {% else %} - Unbookmark + >Unbookmark {% endif %}
  • {% endif %} @@ -171,28 +171,28 @@ {% if request.has_permission("remove", topic) %}
  • {% if not topic.is_removed %} - Remove + >Remove {% else %} - Un-remove + >Un-remove {% endif %}
  • {% endif %}
    -
    +
    {% endif %} {% if topic.is_locked %}