From 82f640896e1669d18fe03b01b87350d29220f19d Mon Sep 17 00:00:00 2001 From: Michael Weimann Date: Sat, 24 Jul 2021 20:42:19 +0200 Subject: [PATCH] migrate shift overview cards to panels migrate shift overview cards to panels --- includes/pages/user_shifts.php | 2 +- includes/view/ShiftCalendarRenderer.php | 16 ++++- includes/view/ShiftCalendarShiftRenderer.php | 55 +++++++++++------ resources/assets/themes/base.scss | 65 -------------------- resources/views/admin/log.twig | 2 +- resources/views/pages/settings/settings.twig | 2 +- resources/views/pages/user-shifts.html | 50 ++++++++------- 7 files changed, 79 insertions(+), 113 deletions(-) diff --git a/includes/pages/user_shifts.php b/includes/pages/user_shifts.php index e24c6d59..1fb6fad8 100644 --- a/includes/pages/user_shifts.php +++ b/includes/pages/user_shifts.php @@ -276,7 +276,7 @@ function view_user_shifts() . __('Description of the jobs.') . '', 'shifts_table' => msg() . $shiftCalendarRenderer->render(), - 'ical_text' => ical_hint(), + 'ical_text' => div('mt-3', ical_hint()), 'filter' => __('Filter'), 'filter_toggle' => __('shifts.filter.toggle'), 'set_yesterday' => __('Yesterday'), diff --git a/includes/view/ShiftCalendarRenderer.php b/includes/view/ShiftCalendarRenderer.php index a8f8b4c3..513b6a23 100644 --- a/includes/view/ShiftCalendarRenderer.php +++ b/includes/view/ShiftCalendarRenderer.php @@ -204,8 +204,13 @@ class ShiftCalendarRenderer $rendered_until += ShiftCalendarRenderer::SECONDS_PER_ROW; } + $bg = ''; + if (theme_type() === 'light') { + $bg = 'bg-light'; + } + return div('lane', [ - div('header', $lane->getHeader()), + div('header ' . $bg, $lane->getHeader()), $html ]); } @@ -244,8 +249,13 @@ class ShiftCalendarRenderer */ private function renderTimeLane() { + $bg = ''; + if (theme_type() === 'light') { + $bg = 'bg-light'; + } + $time_slot = [ - div('header', [ + div('header ' . $bg, [ __('Time') ]) ]; @@ -311,7 +321,7 @@ class ShiftCalendarRenderer */ private function renderLegend() { - return div('legend', [ + return div('legend mt-3', [ badge(__('Your shift'), 'primary'), badge(__('Help needed'), 'danger'), badge(__('Other angeltype needed / collides with my shifts'), 'warning'), diff --git a/includes/view/ShiftCalendarShiftRenderer.php b/includes/view/ShiftCalendarShiftRenderer.php index e23573e7..42542ae6 100644 --- a/includes/view/ShiftCalendarShiftRenderer.php +++ b/includes/view/ShiftCalendarShiftRenderer.php @@ -5,6 +5,9 @@ namespace Engelsystem; use Engelsystem\Models\Room; use Engelsystem\Models\User\User; +use function config; +use function theme_type; + /** * Renders a single shift for the shift calendar */ @@ -23,7 +26,7 @@ class ShiftCalendarShiftRenderer { $info_text = ''; if ($shift['title'] != '') { - $info_text = icon('info') . $shift['title'] . '
'; + $info_text = icon('info-circle') . $shift['title'] . '
'; } list($shift_signup_state, $shifts_row) = $this->renderShiftNeededAngeltypes( $shift, @@ -48,10 +51,10 @@ class ShiftCalendarShiftRenderer . ($blocks * ShiftCalendarRenderer::BLOCK_HEIGHT - ShiftCalendarRenderer::MARGIN) . 'px;', div( - 'shift panel panel-' . $class, + 'shift card bg-' . $class, [ $this->renderShiftHead($shift, $class, $shift_signup_state->getFreeEntries()), - div('panel-body', [ + div('card-body ' . $this->classBg(), [ $info_text, Room_name_render($room) ]), @@ -79,7 +82,7 @@ class ShiftCalendarShiftRenderer case ShiftSignupState::NOT_ARRIVED: case ShiftSignupState::NOT_YET: case ShiftSignupState::SHIFT_ENDED: - return 'default'; + return 'light'; case ShiftSignupState::ANGELTYPE: case ShiftSignupState::COLLIDES: @@ -133,7 +136,7 @@ class ShiftCalendarShiftRenderer } if (auth()->can('user_shifts_admin')) { - $html .= '
  • '; + $html .= '
  • '; $html .= button(shift_entry_create_link_admin($shift), icon('plus-lg') . __('Add more angels'), 'btn-sm' @@ -143,7 +146,7 @@ class ShiftCalendarShiftRenderer if ($html != '') { return [ $shift_signup_state, - '' + '' ]; } @@ -167,8 +170,8 @@ class ShiftCalendarShiftRenderer { $entry_list = []; foreach ($shift_entries as $entry) { - $style = $entry['freeloaded'] ? ' text-decoration: line-through;' : ''; - $entry_list[] = '' . User_Nick_render($entry) . ''; + $class = $entry['freeloaded'] ? 'text-decoration-line-through' : ''; + $entry_list[] = '' . User_Nick_render($entry) . ''; } $shift_signup_state = Shift_signup_allowed( $user, @@ -186,14 +189,14 @@ class ShiftCalendarShiftRenderer case ShiftSignupState::ADMIN: case ShiftSignupState::FREE: // When admin or free display a link + button for sign up - $entry_list[] = '' . $inner_text . ' ' . button( shift_entry_create_link($shift, $angeltype), - __('Sign up'), 'btn-sm btn-primary d-print-none' + __('Sign up'), 'btn-sm btn-primary text-nowrap d-print-none' ); break; @@ -240,8 +243,8 @@ class ShiftCalendarShiftRenderer break; } - $shifts_row = '
  • '; - $shifts_row .= '' . AngelType_name_render($angeltype) . ': '; + $shifts_row = '
  • '; + $shifts_row .= '' . AngelType_name_render($angeltype) . ': '; $shifts_row .= join(', ', $entry_list); $shifts_row .= '
    • '; return [ @@ -250,6 +253,20 @@ class ShiftCalendarShiftRenderer ]; } + /** + * Return the corresponding bg class + * + * @return string + */ + private function classBg(): string + { + if (theme_type() === 'light') { + return 'bg-white'; + } + + return 'bg-dark'; + } + /** * Renders the shift header * @@ -261,16 +278,16 @@ class ShiftCalendarShiftRenderer { $header_buttons = ''; if (auth()->can('admin_shifts')) { - $header_buttons = '
    ' . table_buttons([ + $header_buttons = '
    ' . table_buttons([ button( page_link_to('user_shifts', ['edit_shift' => $shift['SID']]), icon('pencil'), - "btn-$class btn-sm" + "btn-$class btn-sm border-light" ), button( page_link_to('user_shifts', ['delete_shift' => $shift['SID']]), icon('trash'), - "btn-$class btn-sm" + "btn-$class btn-sm border-light" ) ]) . '
    '; } @@ -278,12 +295,12 @@ class ShiftCalendarShiftRenderer . date('H:i', $shift['end']) . ' — ' . $shift['name']; - if($needed_angeltypes_count > 0) { - $shift_heading = '' . $needed_angeltypes_count . ' ' . $shift_heading; + if ($needed_angeltypes_count > 0) { + $shift_heading = '' . $needed_angeltypes_count . ' ' . $shift_heading; } - return div('panel-heading', [ - '' . $shift_heading . '', + return div('card-header d-flex align-items-center', [ + '' . $shift_heading . '', $header_buttons ]); } diff --git a/resources/assets/themes/base.scss b/resources/assets/themes/base.scss index 808fe7b6..14ec326f 100644 --- a/resources/assets/themes/base.scss +++ b/resources/assets/themes/base.scss @@ -170,7 +170,6 @@ table a > .icon-icon_angel { flex-shrink: 1; .header { - background: $dark; //@todo bs5 border-bottom: 1px solid $table-border-color; height: 30px; padding: 5px 5px 5px 16px; @@ -252,14 +251,6 @@ h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 { overflow-x: inherit; } -.inline-form-spacing { - margin-bottom: map-get($spacers, 3); -} - -.user-settings .settings-menu ul { - margin-top: map-get($spacers, 3); //@todo bs5 -} - span.ref-id[id] { padding-top: 50px; } @@ -352,59 +343,3 @@ span.ref-id[id] { } } } - -@media screen and (max-width: map-get($grid-breakpoints, 'xxl')) { - #navbar-offcanvas { - display: block; - position: absolute; - width: 90%; - height: calc(100vh - #{$navbar-height}); - max-height: unset; - left: 101%; - top: $navbar-height + 1; - // extra padding because mobile Safari displays a bottom bar hiding parts of the menu - padding-bottom: 75px; - - transition: left .3s ease-in-out; - - background: $light; // @todo bs5 - margin: 0 !important; // Overridden in theme with high specifity: - // .container > .navbar-header, - // .container-fluid > .navbar-header, - // .container > .navbar-collapse, - // .container-fluid > .navbar-collapse - - // Is open - &.collapse.in { - left: 10%; - display: block; - overflow-y: auto; - box-shadow: -5px 20px 20px 0 rgba(0, 0, 0, 0.5), 5px 0 5px -5px rgba(0, 0, 0, 0.5); - } - - // Hide current page in nav. - .nav > li.active { - display: none; - } - - .caret { - float: right; - margin-top: 7px; - } - } - - .navbar-toggle { - align-items: center; - font-size: 18px; - display: flex; - height: 38px; - justify-content: center; - padding: 0; - transform: none; - width: 38px; - - .icon-close { - padding: 0; - } - } -} diff --git a/resources/views/admin/log.twig b/resources/views/admin/log.twig index 59bec13d..bb723000 100644 --- a/resources/views/admin/log.twig +++ b/resources/views/admin/log.twig @@ -10,7 +10,7 @@
    -
    +
    {{ csrf() }} diff --git a/resources/views/pages/settings/settings.twig b/resources/views/pages/settings/settings.twig index 938b8ac0..1a9493c3 100644 --- a/resources/views/pages/settings/settings.twig +++ b/resources/views/pages/settings/settings.twig @@ -14,7 +14,7 @@
    -
      +
        {% for url,title in settings_menu %}
      • {{ __(title) }} diff --git a/resources/views/pages/user-shifts.html b/resources/views/pages/user-shifts.html index bd2179d5..e8828f0d 100644 --- a/resources/views/pages/user-shifts.html +++ b/resources/views/pages/user-shifts.html @@ -4,32 +4,36 @@

        %title%

        -
        %start_select%
        -
        -
        - -
        - +
        +
        %start_select%
        +
        +
        + +
        + +
        - – -
        %end_select%
        -
        -
        - -
        - +
        –
        +
        +
        %end_select%
        +
        +
        + +
        + +