diff --git a/assets/less/manage/classes/header.less b/assets/less/manage/classes/header.less index c2f2127a..542c59fe 100644 --- a/assets/less/manage/classes/header.less +++ b/assets/less/manage/classes/header.less @@ -6,7 +6,7 @@ &__wrapper { display: flex; - max-width: 1200px; + max-width: var(--site-max-width); margin: 0 auto; } diff --git a/assets/less/manage/classes/user-listing.less b/assets/less/manage/classes/user-listing.less deleted file mode 100644 index effb74c2..00000000 --- a/assets/less/manage/classes/user-listing.less +++ /dev/null @@ -1,27 +0,0 @@ -.user-listing { - flex-direction: row; - flex-wrap: wrap; - justify-content: center; - - &__entry { - margin: 2px; - min-width: 296px; - - &__content { - display: flex; - } - } - - &__info { - display: flex; - flex-grow: 1; - flex-shrink: 1; - } - - &__avatar { - width: 46px; - height: 46px; - flex-grow: 0; - flex-shrink: 0; - } -} diff --git a/assets/less/manage/main.less b/assets/less/manage/main.less index 8bcf8437..248061d7 100644 --- a/assets/less/manage/main.less +++ b/assets/less/manage/main.less @@ -2,8 +2,5 @@ @import "classes/header"; @import "classes/listing"; -@import "classes/user-listing"; -@import "classes/permissions"; - @import "classes/changelog-change"; @import "classes/changelog-tags"; diff --git a/assets/less/mio/classes/header.less b/assets/less/mio/classes/header.less index 59c69d08..a600ef8a 100644 --- a/assets/less/mio/classes/header.less +++ b/assets/less/mio/classes/header.less @@ -7,7 +7,7 @@ display: flex; align-items: center; padding: 3px 1px; - max-width: @site-max-width; + max-width: var(--site-max-width); @media (max-width: @site-mobile-width) { flex-direction: column; diff --git a/assets/less/mio/classes/heading.less b/assets/less/mio/classes/heading.less deleted file mode 100644 index 1f373d16..00000000 --- a/assets/less/mio/classes/heading.less +++ /dev/null @@ -1,5 +0,0 @@ -.heading { - &--1 { - line-height: 1.2em; - } -} diff --git a/assets/less/mio/classes/input/select.less b/assets/less/mio/classes/input/select.less index cf2478b9..bb36be7b 100644 --- a/assets/less/mio/classes/input/select.less +++ b/assets/less/mio/classes/input/select.less @@ -1,8 +1,10 @@ .input__select { border: 1px solid #aaa; padding: 1px; + margin: 1px; background: #fff; color: #111; + min-width: 150px; &:focus { border-color: #9475b2; diff --git a/assets/less/mio/classes/management.less b/assets/less/mio/classes/management.less new file mode 100644 index 00000000..fd847b26 --- /dev/null +++ b/assets/less/mio/classes/management.less @@ -0,0 +1,13 @@ +.management { + display: flex; + + &__navigation { + flex: 0 0 auto; + width: 300px; + margin-right: 2px; + } + + &__content { + flex: 1 1 auto; + } +} diff --git a/assets/less/mio/classes/members/user.less b/assets/less/mio/classes/members/user.less deleted file mode 100644 index 2835d984..00000000 --- a/assets/less/mio/classes/members/user.less +++ /dev/null @@ -1,93 +0,0 @@ -.members__user { - display: flex; - text-decoration: none; - color: inherit; - - margin: 1px; - padding: 5px; - background-color: #fbeeff; - border: 1px solid #9475b2; - box-shadow: 0 1px 2px #9475b2; - width: 396px; - transition: background-color .2s, box-shadow .2s; - z-index: 1; - - &:hover { - box-shadow: 0 1px 1em #9475b2; - background-color: #ecddee; - z-index: 2; - } - - &__avatar { - width: 100px; - height: 100px; - flex: 0 0 auto; - box-shadow: 0 1px 2px #9475b2; - margin-right: 5px; - } - - &__info { - display: flex; - flex-direction: column; - justify-content: center; - flex: 1 1 auto; - } - - &__name { - font-size: 1.5em; - line-height: 1.3em; - } - - &__sub { - font-size: .9em; - display: flex; - align-items: baseline; - vertical-align: middle; - } - - &__title { - flex: 1 1 auto; - margin-left: 2px; - } - - &__country { - flex: 0 0 auto; - display: flex; - align-items: baseline; - vertical-align: middle; - - &__name { - margin-right: 2px; - } - - &__flag { - margin-right: 4px; - } - } - - &__supporter { - background-image: url('https://static.flash.moe/images/tenshi.png'); - width: 37px; - height: 11px; - font-size: 0; - margin-right: 2px; - } - - &__stats { - display: flex; - justify-content: space-evenly; - font-size: .9em; - line-height: 1.5em; - } - - &__stat { - width: 50%; - margin-right: 2px; - display: inline-flex; - - &__title { - font-weight: 700; - flex-grow: 1; - } - } -} diff --git a/assets/less/mio/classes/members/users.less b/assets/less/mio/classes/members/users.less deleted file mode 100644 index d1e62af0..00000000 --- a/assets/less/mio/classes/members/users.less +++ /dev/null @@ -1,8 +0,0 @@ -.members__users { - - &__content { - margin: 1px; - display: flex; - flex-wrap: wrap; - } -} diff --git a/assets/less/mio/classes/pagination.less b/assets/less/mio/classes/pagination.less index 18aa67cd..a60135d5 100644 --- a/assets/less/mio/classes/pagination.less +++ b/assets/less/mio/classes/pagination.less @@ -4,6 +4,12 @@ padding: 1px; border: 1px solid #9475b2; + &__wrapper { + background-color: #fbeeff; + margin: 2px 0; + box-shadow: 0 1px 2px #9475b2; + } + &__separator { flex-grow: 1; flex-shrink: 1; diff --git a/assets/less/manage/classes/permissions.less b/assets/less/mio/classes/permissions.less similarity index 71% rename from assets/less/manage/classes/permissions.less rename to assets/less/mio/classes/permissions.less index 05d63e31..a7617c83 100644 --- a/assets/less/manage/classes/permissions.less +++ b/assets/less/mio/classes/permissions.less @@ -5,14 +5,15 @@ &__line { display: flex; - font-size: 1.1em; - line-height: 1.4em; + font-size: .9em; + line-height: 1.2em; &--header { font-size: 1.2em; - line-height: 1.5em; - border-bottom: 1px solid #333; + line-height: 1.4em; + border-bottom: 1px solid #9475b2; padding-bottom: 1px; + font-family: @mio-font-heading; &:not(:first-child) { margin-top: 4px; @@ -25,6 +26,10 @@ padding: 4px; } + &__line:not(&__line--header) &__title { + border-bottom: 1px solid #ded5e7; + } + &__input { cursor: pointer; } @@ -36,7 +41,7 @@ &--radio { cursor: pointer; - border-left: 1px solid #333; + border-left: 1px solid #9475b2; } &--yes:hover { diff --git a/assets/less/mio/classes/side-navigation.less b/assets/less/mio/classes/side-navigation.less new file mode 100644 index 00000000..582ca470 --- /dev/null +++ b/assets/less/mio/classes/side-navigation.less @@ -0,0 +1,25 @@ +.side-navigation { + list-style: none; + padding: 2px 5px; + + &:not(.side-navigation--layer-0) { + padding-left: 1em; + } + + &__title { + color: #306; + font-family: @mio-font-heading; + display: block; + font-weight: 700; + } + + &__link { + display: block; + text-decoration: none; + color: inherit; + + &:hover { + text-decoration: underline; + } + } +} diff --git a/assets/less/mio/classes/usercard.less b/assets/less/mio/classes/usercard.less new file mode 100644 index 00000000..8c595770 --- /dev/null +++ b/assets/less/mio/classes/usercard.less @@ -0,0 +1,90 @@ +.usercard { + box-shadow: 0 1px 2px #9475b2; + width: 300px; + height: 70px; + transition: box-shadow .5s; + z-index: 1; + color: #fff; + + &:hover { + box-shadow: 0 1px 1em #9475b2; + z-index: 2; + } + + &__background { + position: absolute; + left: 0; + top: 0; + height: 100%; + width: 100%; + background-color: #9475b2; + background-size: cover; + background-repeat: no-repeat; + background-position: center; + } + + &__container { + padding: 4px; + height: 100%; + width: 100%; + //border: 1px solid #9475b2; + pointer-events: none; + display: flex; + background-color: rgba(0, 0, 0, .7); + } + + &__avatar { + width: 60px; + height: 60px; + flex: 0 0 auto; + margin-right: 5px; + } + + &__content { + display: flex; + flex-direction: column; + justify-content: center; + flex: 1 1 auto; + } + + &__name { + font-size: 1.4em; + line-height: 1.4em; + } + + &__info { + font-size: .9em; + display: flex; + align-items: baseline; + vertical-align: middle; + } + + &__item { + margin-left: 2px; + color: inherit; + text-decoration: none; + + &--active { + pointer-events: auto; + } + + &--title { + flex: 1 1 auto; + } + + &--country { + flex: 0 0 auto; + align-items: baseline; + vertical-align: middle; + margin-right: 4px; + } + + &--donator { + flex: 0 0 auto; + background-image: url('https://static.flash.moe/images/tenshi.png'); + width: 37px; + height: 11px; + font-size: 0; + } + } +} diff --git a/assets/less/mio/classes/userlist.less b/assets/less/mio/classes/userlist.less new file mode 100644 index 00000000..3f41cf4f --- /dev/null +++ b/assets/less/mio/classes/userlist.less @@ -0,0 +1,14 @@ +.userlist { + display: flex; + flex-wrap: wrap; + justify-content: center; + + &__item { + margin: 2px; + } + + &__selection { + margin: 6px; + text-align: center; + } +} diff --git a/assets/less/mio/main.less b/assets/less/mio/main.less index 815131cb..9350bc30 100644 --- a/assets/less/mio/main.less +++ b/assets/less/mio/main.less @@ -3,11 +3,16 @@ @site-max-width: 1200px; @site-mobile-width: 800px; +:root { + --site-max-width: @site-max-width; +} + * { margin: 0; padding: 0; box-sizing: border-box; position: relative; + outline-style: none; } html, @@ -24,7 +29,7 @@ body { color: #000; &__wrapper { - max-width: @site-max-width; + max-width: var(--site-max-width); width: 100%; margin: 0 auto; padding: 1px; @@ -49,9 +54,10 @@ body { @import "classes/avatar"; @import "classes/container"; @import "classes/flag"; -@import "classes/heading"; @import "classes/navigation"; @import "classes/pagination"; +@import "classes/management"; +@import "classes/side-navigation"; // Specific styles @import "classes/footer"; @@ -59,6 +65,7 @@ body { @import "classes/profile"; @import "classes/index"; @import "classes/changelog"; +@import "classes/permissions"; // Settings @import "classes/settings/description"; @@ -87,9 +94,9 @@ body { @import "classes/forum/topic"; @import "classes/forum/topics"; -// Member listing -@import "classes/members/user"; -@import "classes/members/users"; +// User stuff +@import "classes/usercard"; +@import "classes/userlist"; // Comments @import "classes/comment"; // entries diff --git a/public/manage/users.php b/public/manage/users.php index fb7cc880..f08b35d4 100644 --- a/public/manage/users.php +++ b/public/manage/users.php @@ -29,7 +29,8 @@ switch ($_GET['v'] ?? null) { $getManageUsers = Database::prepare(' SELECT - u.`user_id`, u.`username`, + u.`user_id`, u.`username`, u.`user_country`, r.`role_id`, + COALESCE(u.`user_title`, r.`role_title`, r.`role_name`) as `user_title`, COALESCE(u.`user_colour`, r.`role_colour`) as `user_colour` FROM `msz_users` as u LEFT JOIN `msz_roles` as r diff --git a/public/members.php b/public/members.php index 02bb888e..0edbbed2 100644 --- a/public/members.php +++ b/public/members.php @@ -4,7 +4,7 @@ use Misuzu\Database; require_once __DIR__ . '/../misuzu.php'; $usersOffset = max((int)($_GET['o'] ?? 0), 0); -$usersTake = max(min((int)($_GET['t'] ?? 15), 30), 6); +$usersTake = 30; $roleId = (int)($_GET['r'] ?? MSZ_ROLE_MAIN); $orderBy = strtolower($_GET['ss'] ?? ''); @@ -86,22 +86,9 @@ $roles = Database::query(' $getUsers = Database::prepare(" SELECT - u.`user_id`, u.`username`, u.`user_country`, - u.`created_at` as `user_joined`, u.`last_seen` as `user_last_seen`, - COALESCE(u.`user_title`, r.`role_title`) as `user_title`, - COALESCE(u.`user_colour`, r.`role_colour`) as `user_colour`, - ( - SELECT COUNT(`topic_id`) - FROM `msz_forum_topics` - WHERE `user_id` = u.`user_id` - AND `topic_deleted` IS NULL - ) as `user_topic_count`, - ( - SELECT COUNT(`post_id`) - FROM `msz_forum_posts` - WHERE `user_id` = u.`user_id` - AND `post_deleted` IS NULL - ) as `user_post_count` + u.`user_id`, u.`username`, u.`user_country`, r.`role_id`, + COALESCE(u.`user_title`, r.`role_title`, r.`role_name`) as `user_title`, + COALESCE(u.`user_colour`, r.`role_colour`) as `user_colour` FROM `msz_users` as u LEFT JOIN `msz_roles` as r ON r.`role_id` = u.`display_role` diff --git a/src/manage.php b/src/manage.php index 35e9655a..484b27c6 100644 --- a/src/manage.php +++ b/src/manage.php @@ -25,8 +25,6 @@ function manage_get_menu(int $userId): array $perms['general'], MSZ_GENERAL_PERM_MANAGE_EMOTICONS | MSZ_GENERAL_PERM_MANAGE_SETTINGS )) { - $menu['General'][] = '_'; - if (perms_check($perms['general'], MSZ_GENERAL_PERM_MANAGE_EMOTICONS)) { $menu['General']['Emoticons'] = '/manage/index.php?v=emoticons'; } @@ -55,8 +53,6 @@ function manage_get_menu(int $userId): array $perms['user'], MSZ_USER_PERM_MANAGE_REPORTS | MSZ_USER_PERM_MANAGE_RESTRICTIONS | MSZ_USER_PERM_MANAGE_BLACKLISTS )) { - $menu['Users'][] = '_'; - if (perms_check($perms['user'], MSZ_USER_PERM_MANAGE_REPORTS)) { $menu['Users']['Reports'] = '/manage/users.php?v=reports'; } diff --git a/templates/manage/changelog/action_edit.twig b/templates/manage/changelog/action_edit.twig index e941ffae..4e5c6e40 100644 --- a/templates/manage/changelog/action_edit.twig +++ b/templates/manage/changelog/action_edit.twig @@ -1,6 +1,6 @@ {% extends 'manage/changelog/master.twig' %} -{% block content %} +{% block manage_content %}

diff --git a/templates/manage/changelog/actions.twig b/templates/manage/changelog/actions.twig index 09f3bc1e..69e958af 100644 --- a/templates/manage/changelog/actions.twig +++ b/templates/manage/changelog/actions.twig @@ -1,7 +1,7 @@ {% extends 'manage/changelog/master.twig' %} -{% from 'manage/macros.twig' import pagination %} +{% from 'macros.twig' import pagination %} -{% block content %} +{% block manage_content %}
Create new action
diff --git a/templates/manage/changelog/change_edit.twig b/templates/manage/changelog/change_edit.twig index f7256308..cd282306 100644 --- a/templates/manage/changelog/change_edit.twig +++ b/templates/manage/changelog/change_edit.twig @@ -1,6 +1,6 @@ {% extends 'manage/changelog/master.twig' %} -{% block content %} +{% block manage_content %}

diff --git a/templates/manage/changelog/changes.twig b/templates/manage/changelog/changes.twig index 8c47c8c9..ac4b2230 100644 --- a/templates/manage/changelog/changes.twig +++ b/templates/manage/changelog/changes.twig @@ -1,7 +1,7 @@ {% extends 'manage/changelog/master.twig' %} -{% from 'manage/macros.twig' import pagination %} +{% from 'macros.twig' import pagination %} -{% block content %} +{% block manage_content %}
Create new change
diff --git a/templates/manage/changelog/tag_edit.twig b/templates/manage/changelog/tag_edit.twig index ec27ee94..b62d29e3 100644 --- a/templates/manage/changelog/tag_edit.twig +++ b/templates/manage/changelog/tag_edit.twig @@ -1,6 +1,6 @@ {% extends 'manage/changelog/master.twig' %} -{% block content %} +{% block manage_content %}

diff --git a/templates/manage/changelog/tags.twig b/templates/manage/changelog/tags.twig index 5f59c931..e3943f45 100644 --- a/templates/manage/changelog/tags.twig +++ b/templates/manage/changelog/tags.twig @@ -1,7 +1,7 @@ {% extends 'manage/changelog/master.twig' %} -{% from 'manage/macros.twig' import pagination %} +{% from 'macros.twig' import pagination %} -{% block content %} +{% block manage_content %}
Create new tag
diff --git a/templates/manage/general/overview.twig b/templates/manage/general/overview.twig index 94ff0cfe..482f7357 100644 --- a/templates/manage/general/overview.twig +++ b/templates/manage/general/overview.twig @@ -1,8 +1,8 @@ {% extends 'manage/general/master.twig' %} -{% block content %} +{% block manage_content %}
-
The Broom Closet
+
Overview
Welcome to Manage, here you can manage things.
diff --git a/templates/manage/macros.twig b/templates/manage/macros.twig index 2b2990f8..61de54e7 100644 --- a/templates/manage/macros.twig +++ b/templates/manage/macros.twig @@ -1,95 +1,19 @@ -{% macro pagination_segment(url_window, base_url, currentPage) %} - {% for page, url in url_window %} -
  • - - {{ page }} - -
    • - {% endfor %} -{% endmacro %} +{% macro manage_navigation(navi, level) %} + {% from _self import manage_navigation %} + {% set level = level|default(0) %} -{% macro pagination(itemCount, itemRange, currentOffset, baseUrl, classPrefix, alwaysRender, useRanges, offsetParam, pageRange) %} - {% set alwaysRender = alwaysRender|default(false) %} - - {% if alwaysRender or itemCount > itemRange %} - {% set classPrefix = classPrefix|default('') %} - {% set separator = '%3F' in baseUrl|default('')|url_encode ? '&' : '?' %} - {% set baseUrl = baseUrl ~ separator %} - {% set pageCount = (itemCount / itemRange)|round(0, 'ceil') %} - {% set currentPage = currentOffset // itemRange %} - {% set useRanges = useRanges|default(true) %} - {% set offsetParam = offsetParam|default(useRanges ? 'o' : 'p') %} - {% set pageRange = pageRange|default(3) %} - -
      - {% if currentPage < 1 %} -
    • - - « - -
      • -
    • - - ‹ - -
      • - {% else %} - {% set firstUrl = baseUrl|slice(0, (baseUrl|length) - (separator|length)) %} - -
    • - - « - -
      • -
    • - -
      • - {% endif %} - -
    • - - {% set paginationStart = currentPage - pageRange %} - {% set paginationStop = currentPage + pageRange %} - - {% for i in paginationStart..paginationStop %} - {% if i >= 0 and i < pageCount %} -
    • - - {{ i + 1 }} - -
      • +
        + {% for name, value in navi %} +
      • + {% if value is iterable %} + {{ name }} + {{ manage_navigation(value, level + 1) }} + {% else %} + {{ name }} {% endif %} - {% endfor %} - -
      • - - {% if currentPage >= pageCount - 1 %} -
      • - - › - -
        • -
      • - - » - -
        • - {% else %} -
      • - -
        • -
      • - - » - -
        • - {% endif %} -
      - {% endif %} + + {% endfor %} +
    {% endmacro %} {% macro permissions_table(permissions) %} diff --git a/templates/manage/master.twig b/templates/manage/master.twig index c11cde77..d0a8a1a6 100644 --- a/templates/manage/master.twig +++ b/templates/manage/master.twig @@ -1,51 +1,30 @@ {% extends 'master.twig' %} +{% from 'manage/macros.twig' import manage_navigation %} {% set title = 'Broom Closet' %} {% set is_manage = true %} -{% block before_content %} - +
    {% endblock %} diff --git a/templates/manage/users/listing.twig b/templates/manage/users/listing.twig index 45cf40da..372e6daf 100644 --- a/templates/manage/users/listing.twig +++ b/templates/manage/users/listing.twig @@ -1,19 +1,13 @@ {% extends 'manage/users/master.twig' %} -{% from 'manage/macros.twig' import pagination %} +{% from 'macros.twig' import pagination %} +{% from 'user/macros.twig' import user_card %} -{% block content %} -
    +{% block manage_content %} +
    {% for user in manage_users %} - -
    -
    -
    - {{ user.username }} -
    -
    -
    -
    -     +
    + {{ user_card(user, '?v=view&u=%d', '?v=role&r=%d') }} +
    {% endfor %}
    diff --git a/templates/manage/users/roles.twig b/templates/manage/users/roles.twig index 68427e19..33f9836f 100644 --- a/templates/manage/users/roles.twig +++ b/templates/manage/users/roles.twig @@ -1,7 +1,7 @@ {% extends 'manage/users/master.twig' %} -{% from 'manage/macros.twig' import pagination %} +{% from 'macros.twig' import pagination %} -{% block content %} +{% block manage_content %} {% if can_manage_roles %}
    Create new Role diff --git a/templates/manage/users/roles_create.twig b/templates/manage/users/roles_create.twig index 8900dff9..ba795287 100644 --- a/templates/manage/users/roles_create.twig +++ b/templates/manage/users/roles_create.twig @@ -1,7 +1,7 @@ {% extends 'manage/users/master.twig' %} {% from 'manage/macros.twig' import permissions_table %} -{% block content %} +{% block manage_content %}

    @@ -40,7 +40,10 @@

    -

    Colour

    +
    + +
    +
    Colour
    -

    Additional

    +
    + +
    +
    Additional