From f5fa2c997fd4514c326b1c261f26014779114abd Mon Sep 17 00:00:00 2001 From: "Luna D." Date: Fri, 3 May 2024 22:59:29 +0200 Subject: [PATCH] more stuff --- assets/css/elements/button.css | 2 +- assets/css/elements/form.css | 2 +- assets/css/elements/list.css | 6 ++++ assets/css/themes/dark-blue.css | 10 +++--- assets/css/views/staff.css | 4 +++ assets/css/views/tag.css | 11 ++++++ .../templates/admin/report/show.html.slime | 2 +- .../templates/admin/user/_form.html.slime | 35 +++++++++---------- .../templates/image/_options.html.slime | 2 +- .../templates/image/_source.html.slime | 2 +- .../templates/image/_tags.html.slime | 11 +++--- .../templates/image/reporting/show.html.slime | 2 +- .../layout/_flash_warnings.html.slime | 14 ++++++++ .../templates/staff/index.html.slime | 6 ++-- lib/philomena_web/views/admin/user_view.ex | 2 +- lib/philomena_web/views/staff_view.ex | 8 +++++ 16 files changed, 83 insertions(+), 36 deletions(-) diff --git a/assets/css/elements/button.css b/assets/css/elements/button.css index 4fe8c594..61687500 100644 --- a/assets/css/elements/button.css +++ b/assets/css/elements/button.css @@ -2,7 +2,7 @@ .button--$(type) { color: var(--$(type)-link-color) !important; border-color: var(--$(type)-border-color); - background: var(--$(type)-dark-color); + background: var(--$(type)-muted-color); } .button--$(type).button--important { diff --git a/assets/css/elements/form.css b/assets/css/elements/form.css index 30de212d..35cb7983 100644 --- a/assets/css/elements/form.css +++ b/assets/css/elements/form.css @@ -17,7 +17,7 @@ form .form--two_column > .field, form .form--two_column > li { gap: var(--padding-normal); } -form .field > .with_error { +form .with_error { display: block; } diff --git a/assets/css/elements/list.css b/assets/css/elements/list.css index de432fa5..e9ff42ed 100644 --- a/assets/css/elements/list.css +++ b/assets/css/elements/list.css @@ -1,3 +1,9 @@ ul, ol { + padding: 0; list-style-type: none; } + +.horizontal-list { + display: flex; + gap: var(--padding-normal); +} diff --git a/assets/css/themes/dark-blue.css b/assets/css/themes/dark-blue.css index 45a96dce..9a3cd1af 100644 --- a/assets/css/themes/dark-blue.css +++ b/assets/css/themes/dark-blue.css @@ -3,11 +3,11 @@ $text-color: #e0e0e0; $primary-color: #284371; $secondary-color: #546c99; -$danger-color: #672a21; -$warning-color: #684f2c; +$danger-color: #6d2a20; +$warning-color: #715227; $success-color: #25603e; -$information-color: #205861; -$special-color: #561e5e; +$information-color: #1c606a; +$special-color: #65206e; $upvote-color: #5b9b26; $downvote-color: #da3412; @@ -61,7 +61,7 @@ $spoiler-color: #0f0f0f; --secondary-border-color: hsl(from $secondary-color h s calc(l + 5)); --secondary-muted-color: hsl(from $secondary-color h s calc(l - 17)); --secondary-dark-color: hsl(from $secondary-color h calc(s - 5) calc(l - 25)); - --secondary-link-color: hsl(from $secondary-color h s calc(l + 55)); + --secondary-link-color: hsl(from $secondary-color h s calc(l + 40)); --upvote-color: $upvote-color; --downvote-color: $downvote-color; diff --git a/assets/css/views/staff.css b/assets/css/views/staff.css index 048f216d..4680dfce 100644 --- a/assets/css/views/staff.css +++ b/assets/css/views/staff.css @@ -42,6 +42,10 @@ margin-top: 1rem; } +.staff-block__category i { + margin-right: var(--padding-normal); +} + .staff-block__user-description { overflow: hidden; text-overflow: ellipsis; diff --git a/assets/css/views/tag.css b/assets/css/views/tag.css index 8ac31b4f..fd7c2c9e 100644 --- a/assets/css/views/tag.css +++ b/assets/css/views/tag.css @@ -102,3 +102,14 @@ .js-imagelist-info { margin-bottom: var(--padding-normal); } + +.tagsinput { + display: flex; + gap: var(--padding-small); + flex-wrap: wrap; + background: var(--primary-dark-color); +} + +.tagsinput .tag { + padding: 0 var(--padding-small); +} diff --git a/lib/philomena_web/templates/admin/report/show.html.slime b/lib/philomena_web/templates/admin/report/show.html.slime index aaedeef2..9bd93710 100644 --- a/lib/philomena_web/templates/admin/report/show.html.slime +++ b/lib/philomena_web/templates/admin/report/show.html.slime @@ -35,7 +35,7 @@ article.block.communication p = if @report.user do - => link "Send PM", to: Routes.conversation_path(@conn, :new, recipient: @report.user.name), class: "button button--link" + => link "Send PM", to: Routes.conversation_path(@conn, :new, recipient: @report.user.name), class: "button" = if @report.open do => link "Close", to: Routes.admin_report_close_path(@conn, :create, @report), class: "button", data: [method: "post"] diff --git a/lib/philomena_web/templates/admin/user/_form.html.slime b/lib/philomena_web/templates/admin/user/_form.html.slime index aa0bca35..2d90d700 100644 --- a/lib/philomena_web/templates/admin/user/_form.html.slime +++ b/lib/philomena_web/templates/admin/user/_form.html.slime @@ -24,40 +24,39 @@ .field label Secondary banner: .with_error = select f, :secondary_role, [[key: "-", value: ""], "Site Developer", "Devops", "Philomena Contributor", "Public Relations"], class: "input" - .field - label Hide staff banner: - .with_error = checkbox f, :hide_default_role, class: "checkbox" - .field - label Senior staff: - .with_error = checkbox f, :senior_staff, class: "checkbox" - .field - label Bypass rate limits: - .with_error = checkbox f, :bypass_rate_limits, class: "checkbox" .field label Avatar .with_error - = link "Remove avatar", to: Routes.admin_user_avatar_path(@conn, :delete, @user), class: "button", data: [method: "delete", confirm: "Are you really, really sure?"] + = link to: Routes.admin_user_avatar_path(@conn, :delete, @user), class: "button button--danger", data: [method: "delete", confirm: "Are you really, really sure?"] do + i.fa.fa-trash + | Remove .block .block__header i.fa.fa-user-check span General user flags .block__content - ul - p - strong> Be careful when issuing these permissions to staff members! - | Staff members with relevant roles may have these permissions anyway. Issuing them may break things, such as tag aliasing. + ul.form--two_column + li + .with_error = checkbox f, :hide_default_role, class: "checkbox" + label Hide staff banner + li + .with_error = checkbox f, :senior_staff, class: "checkbox" + label Senior staff + li + .with_error = checkbox f, :bypass_rate_limits, class: "checkbox" + label Bypass rate limits ul.form--two_column = collection_checkboxes f, :roles, filtered_roles(general_permissions(), @roles), mapper: &checkbox_mapper/6 - .block - .block__header.warning + .block.block--warning + .block__header i.fa.fa-handshake-angle span Special roles for assistants .block__content ul.form--two_column = collection_checkboxes f, :roles, filtered_roles(assistant_permissions(), @roles), mapper: &checkbox_mapper/6 - .block - .block__header.danger + .block.block--danger + .block__header i.fa.fa-gavel span Special roles for moderators .block__content diff --git a/lib/philomena_web/templates/image/_options.html.slime b/lib/philomena_web/templates/image/_options.html.slime index b6906ea3..d7cbc741 100644 --- a/lib/philomena_web/templates/image/_options.html.slime +++ b/lib/philomena_web/templates/image/_options.html.slime @@ -88,7 +88,7 @@ .block__tab.hidden data-tab="administration" .block.block--danger - a.button.button--link> href=Routes.image_scratchpad_path(@conn, :edit, @image) + a.button> href=Routes.image_scratchpad_path(@conn, :edit, @image) i.far.fa-edit = if present?(@image.scratchpad) do strong> Mod notes: diff --git a/lib/philomena_web/templates/image/_source.html.slime b/lib/philomena_web/templates/image/_source.html.slime index dcc9d577..16fe8687 100644 --- a/lib/philomena_web/templates/image/_source.html.slime +++ b/lib/philomena_web/templates/image/_source.html.slime @@ -54,7 +54,7 @@ - else ' Add = if @source_change_count > 0 do - a.button.button--link href=Routes.image_source_change_path(@conn, :index, @image) title="Source history" + a.button href=Routes.image_source_change_path(@conn, :index, @image) title="Source history" i.fa.fa-history> spanspan.hide-mobile> History | ( diff --git a/lib/philomena_web/templates/image/_tags.html.slime b/lib/philomena_web/templates/image/_tags.html.slime index f393ddee..fa5f8e0c 100644 --- a/lib/philomena_web/templates/image/_tags.html.slime +++ b/lib/philomena_web/templates/image/_tags.html.slime @@ -19,7 +19,7 @@ = hidden_input f, :old_tag_input, value: tag_input - .field + .field.flex__column = label f, :tag_input do ' Separate tags with commas. Use 'artist:name' tags to identify artists. Got questions? Check the a> href="/pages/tags" tag guidelines @@ -31,7 +31,7 @@ = error_tag f, :tag_input = if !@conn.assigns.current_user do - .block.block--fixed.block--warning + .block.block--warning.block--fixed strong em Hang on a sec… br @@ -44,9 +44,12 @@ ul.horizontal-list li .actions - = submit "Save tags", class: "button", id: "edit_save_button", data: [disable_with: raw("Saving…")] + = submit class: "button", id: "edit_save_button", data: [disable_with: raw("Saving…")] do + i.fa.fa-floppy-disk> + ' Save tags li button.button.js-tag-sauce-toggle data-click-toggle=".tagsauce, .js-imageform" data-click-focus=".js-taginput-plain:not(.hidden), .js-taginput-input" + i.fa.fa-xmark> ' Cancel .block.js-tagtable data-target="[name="image[tag_input]"]" @@ -66,7 +69,7 @@ i.fas.fa-edit> ' Edit = if @tag_change_count > 0 do - a.button.button--link href=Routes.image_tag_change_path(@conn, :index, @image) title="Tag history" + a.button href=Routes.image_tag_change_path(@conn, :index, @image) title="Tag history" i.fa.fa-history> | History ( = @tag_change_count diff --git a/lib/philomena_web/templates/image/reporting/show.html.slime b/lib/philomena_web/templates/image/reporting/show.html.slime index 5a18b6c8..274b07eb 100644 --- a/lib/philomena_web/templates/image/reporting/show.html.slime +++ b/lib/philomena_web/templates/image/reporting/show.html.slime @@ -1,5 +1,5 @@ a href=Routes.image_report_path(@conn, :new, @image) - button.button.button--link + button.button i.fa.fa-exclamation-triangle> ' General reporting diff --git a/lib/philomena_web/templates/layout/_flash_warnings.html.slime b/lib/philomena_web/templates/layout/_flash_warnings.html.slime index 065c67fc..db13d000 100644 --- a/lib/philomena_web/templates/layout/_flash_warnings.html.slime +++ b/lib/philomena_web/templates/layout/_flash_warnings.html.slime @@ -10,6 +10,20 @@ a href=notice.link = notice.link_text +/ A lil disclaimer because people love to panic. += if not vite_reload?() do + .flash.flash--special + .flash__icon + i.fa.fa-dragon + .flash__message + strong> Here be dragons! + ' This is a work-in-progress branch of the site code. At current state, it is approximately + em> 40 percent + ' finished. Everything is subject to change, and will probably be changed. + ' Keep calm and don't freak out if something looks ugly/broken - it will be fixed. + a href="https://derpibooru.org/forums/meta/topics/so-you-found-the-redesign?post_id=5609737" + | Check out this topic for more info, the FAQ, and to yell at me about this. + noscript.flash.flash--warning .flash__icon i.fa.fa-check diff --git a/lib/philomena_web/templates/staff/index.html.slime b/lib/philomena_web/templates/staff/index.html.slime index 8b862231..e7c44ff4 100644 --- a/lib/philomena_web/templates/staff/index.html.slime +++ b/lib/philomena_web/templates/staff/index.html.slime @@ -26,7 +26,9 @@ h1 Staff - header = to_string(header) = if Enum.any?(users) do - div class="block block--fixed staff-block__category #{category_class(header)}" = header + div class="block block--fixed staff-block__category #{category_class(header)}" + i class="fa #{category_icon(header)}" + = header p.staff-block__description i.fa.fa-fw.fa-info-circle> = category_description(header) @@ -42,7 +44,7 @@ h1 Staff p b = user.name .staff-block__info - = link to: Routes.conversation_path(@conn, :new, recipient: user.name), class: "button" do + = link to: Routes.conversation_path(@conn, :new, recipient: user.name), class: "button button--secondary" do i.fa.fa-envelope> ' Send PM hr.staff-block__separator diff --git a/lib/philomena_web/views/admin/user_view.ex b/lib/philomena_web/views/admin/user_view.ex index 5bbc2d86..dec77bee 100644 --- a/lib/philomena_web/views/admin/user_view.ex +++ b/lib/philomena_web/views/admin/user_view.ex @@ -46,7 +46,7 @@ defmodule PhilomenaWeb.Admin.UserView do def description("moderator", "Tag"), do: "Manage tag details" def description("admin", "Tag"), do: "Alias tags" - def description("batch_update", "Tag"), do: "Update tags in batches" + def description("batch_update", "Tag"), do: "Update tags in batches (do not issue to staff members)" def description("moderator", "User"), do: "Manage users and wipe votes" def description("admin", "Role"), do: "Manage permissions" diff --git a/lib/philomena_web/views/staff_view.ex b/lib/philomena_web/views/staff_view.ex index c4fa6c40..6ef46389 100644 --- a/lib/philomena_web/views/staff_view.ex +++ b/lib/philomena_web/views/staff_view.ex @@ -35,6 +35,14 @@ defmodule PhilomenaWeb.StaffView do def category_class("Assistants"), do: "block--special" def category_class(_), do: "" + def category_icon("Administrators"), do: "fa-medal" + def category_icon("Technical Team"), do: "fa-screwdriver-wrench" + def category_icon("Public Relations"), do: "fa-comment-medical" + def category_icon("Moderators"), do: "fa-gavel" + def category_icon("Assistants"), do: "fa-handshake-angle" + def category_icon("Others"), do: "fa-user-tie" + def category_icon(_), do: "" + def staff_description(%{description: desc}) when desc not in [nil, ""] do [part] = Regex.run(@desc_regex, desc, capture: :all_but_first) String.slice(part, 0, 240)