diff --git a/projects/admin/src/app/menu/menu-app/menu-app.component.html b/projects/admin/src/app/menu/menu-app/menu-app.component.html index 836d0f9fc..c5219bb77 100644 --- a/projects/admin/src/app/menu/menu-app/menu-app.component.html +++ b/projects/admin/src/app/menu/menu-app/menu-app.component.html @@ -15,6 +15,29 @@ along with this program. If not, see . --> + + + @if (item.icon) { + + } + {{ item.label }} + @if (item.shortcut) { + + {{ item.shortcut }} + + } + @if (item.items) { + + } + + diff --git a/projects/admin/src/app/menu/menu-app/menu-app.component.scss b/projects/admin/src/app/menu/menu-app/menu-app.component.scss new file mode 100644 index 000000000..c88f72b0c --- /dev/null +++ b/projects/admin/src/app/menu/menu-app/menu-app.component.scss @@ -0,0 +1,24 @@ +/* + * RERO ILS UI + * Copyright (C) 2021-2024 RERO + * + * This program is free software: you can redistribute it and/or modify + * it under the terms of the GNU Affero General Public License as published by + * the Free Software Foundation, version 3 of the License. + * + * This program is distributed in the hope that it will be useful, + * but WITHOUT ANY WARRANTY; without even the implied warranty of + * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the + * GNU Affero General Public License for more details. + * + * You should have received a copy of the GNU Affero General Public License + * along with this program. If not, see . + */ + +admin-menu-app { + p-menubarsub { + ul.p-submenu-list { + min-width: 250px; + } + } +} diff --git a/projects/admin/src/app/menu/menu-dashboard/menu-dashboard.component.html b/projects/admin/src/app/menu/menu-dashboard/menu-dashboard.component.html index cb719e21c..3e9cc7d19 100644 --- a/projects/admin/src/app/menu/menu-dashboard/menu-dashboard.component.html +++ b/projects/admin/src/app/menu/menu-dashboard/menu-dashboard.component.html @@ -14,22 +14,24 @@ You should have received a copy of the GNU Affero General Public License along with this program. If not, see . --> -
+
@for (item of items; track item) {
-
- @if (item.icon) { - - } - {{ item.label }} -
+ +
+ @if (item.icon) { + + } + {{ item.label }} +
+ @for (menuItem of item.items; track menuItem) { - - + + {{ item.label }} @if (item.shortcut) { - + {{ item.shortcut }} } - @if (hasSubmenu) { - + @if (item.items) { + } diff --git a/projects/admin/src/app/menu/menu-dashboard/menu-dashboard.component.scss b/projects/admin/src/app/menu/menu-dashboard/menu-dashboard.component.scss new file mode 100644 index 000000000..ed959d938 --- /dev/null +++ b/projects/admin/src/app/menu/menu-dashboard/menu-dashboard.component.scss @@ -0,0 +1,30 @@ +/* + * RERO ILS UI + * Copyright (C) 2021-2024 RERO + * + * This program is free software: you can redistribute it and/or modify + * it under the terms of the GNU Affero General Public License as published by + * the Free Software Foundation, version 3 of the License. + * + * This program is distributed in the hope that it will be useful, + * but WITHOUT ANY WARRANTY; without even the implied warranty of + * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the + * GNU Affero General Public License for more details. + * + * You should have received a copy of the GNU Affero General Public License + * along with this program. If not, see . + */ + + admin-menu-dashboard { + p-card { + div.p-card-body { + @extend .px-1, .py-3; + } + } + + p-tieredmenu { + div.p-tieredmenu { + border: 0; + } + } + } diff --git a/projects/admin/src/app/menu/menu-definition/menu-app.ts b/projects/admin/src/app/menu/menu-definition/menu-app.ts index 6938f50e5..4ef99eb59 100644 --- a/projects/admin/src/app/menu/menu-definition/menu-app.ts +++ b/projects/admin/src/app/menu/menu-definition/menu-app.ts @@ -460,9 +460,10 @@ export const MENU_APP: MenuItem[] = [ }, { name: 'Migrations', - router_link: ['/', 'migrations', 'records', 'migrations'], - attributes: { id: 'permissions-menu' }, - extras: { iconClass: 'fa fa-cloud-upload' }, + translateLabel: 'Migrations', + id: MENU_IDS.APP.ADMIN.MIGRATION, + icon: 'fa fa-cloud-upload', + routerLink: ['/', 'migrations', 'records', 'migrations'], access: { permissions: [PERMISSIONS.MIG_ACCESS] } diff --git a/projects/admin/src/app/menu/menu-definition/menu-ids.ts b/projects/admin/src/app/menu/menu-definition/menu-ids.ts index e8a18ac3a..118a2e97d 100644 --- a/projects/admin/src/app/menu/menu-definition/menu-ids.ts +++ b/projects/admin/src/app/menu/menu-definition/menu-ids.ts @@ -29,6 +29,7 @@ export const MENU_IDS = { CIRCULATION_POLICY: 'app-admin-circulation-policy', ITEM_TYPE: 'app-admin-item-type', LIBRARY: 'app-admin-library', + MIGRATION: 'app-admin-migration', MY_LIBRARY: 'app-admin-library', MY_ORGANISATION: 'app-admin-organisation', PATRON_TYPE: 'app-admin-patron-type', diff --git a/projects/admin/src/app/menu/menu-display/menu-display.component.html b/projects/admin/src/app/menu/menu-display/menu-display.component.html index 7b6101d30..10c5fab8b 100644 --- a/projects/admin/src/app/menu/menu-display/menu-display.component.html +++ b/projects/admin/src/app/menu/menu-display/menu-display.component.html @@ -17,7 +17,13 @@ @if (item.routerLink && !item.url) { - + @if (item.icon) { } @@ -26,12 +32,18 @@ } @if (item.shortcut) { - {{ item.shortcut }} + {{ item.shortcut }} } } @if (item.url && !item.routerLink) { - + @if (item.icon) { } @@ -40,7 +52,7 @@ } @if (item.shortcut) { - {{ item.shortcut }} + {{ item.shortcut }} } } diff --git a/projects/admin/src/app/scss/styles.scss b/projects/admin/src/app/scss/styles.scss index db4c3f570..05065c413 100644 --- a/projects/admin/src/app/scss/styles.scss +++ b/projects/admin/src/app/scss/styles.scss @@ -25,393 +25,396 @@ } @layer bootstrap, rero-ils-ui, primeng; -@import '../../../../shared/src/scss/styles.scss'; @import 'font-awesome/scss/font-awesome'; -@layer bootstrap { -@import 'variables'; -@import 'bootstrap/scss/bootstrap'; -@import 'bootstrap/scss/_functions'; -@import 'bootstrap/scss/_mixins'; -@import 'bootstrap/scss/_variables'; - - -html [type=button] { - -webkit-appearance: none; -} -body { - height: 100vh; // With block page body div to flex-grow-1 -} -header { - position: relative; -} - -.field-required:before { - @extend .mr-1; - @extend .font-weight-bold; - @extend .text-danger; - content: "*"; -} - -// BUTTONS & BUTTON-LINKS ----------------------- -button:disabled:hover { - cursor: not-allowed; -} -button.disabled { - cursor: not-allowed !important; -} -.btn-link.btn-outline-primary:hover { - color: #fff !important; - text-decoration: none !important; -} - -.label-title:after { - content: ":" -} - -.no-data { - font-style: italic; - color: $gray-500; -} - -.raw-data { - font-size: .75rem; - font-family: "Courier New"; - &:before { - content: '['; - } - &:after { - content: ']'; - } -} - - -.rero-ils-logo { - max-height: $navbar-brand-height; - margin: 7px 0; -} - -.rero-ils-page-body { - height: calc(100vh - 0px); - overflow: auto; -} - -.rero-ils-footer { - height: $footer-height; -} - -.rero-ils-page-body { - height: calc(100vh - 0px); - overflow: auto; -} - -.list-group-item:last-child { - border-bottom: 0; -} - - -span.no-data { - font-style: italic; - color: lightgray; - cursor: not-allowed; -} - -// Data list into brief view -dl.brief-view dd { - margin-bottom: 0; -} - -json-schema-form { - input.ng-valid, - textarea.ng-valid { - border-left: 5px solid $form_valid; - } - - input.ng-invalid, - textarea.ng-invalid { - border-left: 5px solid $form_error; /* red */ - } - - .required::after { - content: " *"; - color: $form_required; - } - - a.collapsed i.fa-caret-down { - transform: rotate(-90deg); - } -} - -.rero-ils-person small { - font-size: $font-size-very-small; - vertical-align: top; -} - - -/* SHOW MORE BUTTON ====================================================== */ -.btn-show-more { - border: $border-width solid $border-color; - border-radius: 2rem; - height: 30px; - min-width: 30px; - background-color: $white; - margin-right: map-get($spacers, 3); - font-size: $font-size-base; - - &.btn-expanded::before { - font-family: 'FontAwesome'; - font-weight: 100; - content: " \f0d7"; - } - - &.btn-collapsed::before { - font-family: 'FontAwesome'; - font-weight: 100; - content: " \f0da"; - } -} -.card-header .btn-show-more { - border-color: $card-border-color; - font-size: $font-size-base; - margin-right: map-get($spacers, 2); -} - -// DEBUG PANELS ============================================================================ -pre { - border: $border-width solid $border-color; - padding: map-get($spacers, 2); - position: relative; - - - legend { - position: absolute; - top:0; - right: 0; - padding: map-get($spacers, 1) map-get($spacers, 2); - background-color: $border-color; - border-bottom-left-radius: $border-radius-lg; - font-size: $font-size-sm; - width: inherit; - } -} - -// source: https://codepen.io/superjaberwocky/pen/AXdEWj -.callout { - border: 1px solid #eee; - border-left-width: 5px !important; - border-radius: 3px; - h4 { - margin-top: 0; - margin-bottom: 5px; - } - p:last-child { - margin-bottom: 0; - } - code { - border-radius: 3px; - } - & + .bs-callout { - margin-top: -5px; - } -} -@each $name,$color in (primary,$primary),(success,$success),(danger,$danger),(warning,$warning),(info,$info), (dark,$dark) { - .callout-#{$name} { - border-color: $color !important; - h4 { - color: $color; - } - } - .callout-bg-#{$name} { - background-color: theme-color-level(#{$name}, -10) !important; - - *[class*='btn-outline-']:not(:hover) { - background-color: white; - } - } -} - -.events-timeline { - position: relative; - .timeline-event { - .event-timestamp { - color: $secondary; - font-size: 0.75rem; - } - .event-content { - &:before { - content: ''; - background: $secondary; - position: absolute; - left: -.5rem; - top: .25rem; - width: 1px; - height: 100%; - z-index: 400; - } - &:hover .more-detail{ - display: block; - } - .row { - margin-bottom: 1rem; - line-height: 1.1; - &:first-child:after { - content: ' '; - background-color: white; - display: inline-block; - position: absolute; - border-radius: 50%; - border: 1px solid $secondary; - left: calc(-.75rem - 1px); - top: .25rem; - width: .75rem; - height: .75rem; - z-index: 400; - } - &.event-highlight:first-child:after{ - border-color: $warning; - background-color: theme-color-level("warning", -10); - } - .label { - &:after { - content: ' '; - position: absolute; - border-top: 1px dashed #EEE; - top: calc(.55rem - 1px); - width: 100%; - } - } - } - .force-display { - display: block !important; - } - .more-detail { - display: none; - cursor: pointer; - } - } - } -} - -.informations { - position: relative; - padding-left: 3rem; - width: calc(100% - 3rem); - - .name { - font-weight: bold; - z-index: 0; - padding: 0; - - &::before { - content: ""; - border-top: 1px dotted $secondary; - width: calc(100% - .25rem); - position: absolute; - left: 0; - top: 1rem; - z-index: -1; - } - - span { - background-color: #FFF; - padding-right: .25rem; - display: inline; - } - } -} - -.card { - .card-header:not(:first-child) { - border-top: $card-border-width solid $card-border-color; - } - .card-header + .card-header { - border-top: none; - } -} - -// Adapt detailed views to not use screen width -.main-content{ - @extend .container; -} - -.rero-ils-editor-max-width { - @include media-breakpoint-up(lg) { - max-width: 500px; - } -} - -.rero-ils-editor-title > div > label { - font-weight: bold; -} - -.header:hover ~ .content { - background-color: #f8f9fa; - border-radius: 5px; -} - -.striped { - padding-top: 2px; -} - -.div-striped .striped:nth-of-type(odd) { - background: #F8F8F8; -} - -.div-striped .striped:nth-of-type(even) { - background: #FFFFFF; -} - -.div-striped .striped .row div:first-of-type { - padding-left: map-get($spacers, 4); -} - -// LIBRARY ==================================================================== -.exception-date { - - &.over-exception { - background-color: $gray-100; - - & > * { - color: $gray-500; - font-style: italic; - text-decoration: line-through; - } - .status i { - color: $gray-500 !important; - } - } - - &:hover{ - background-color: $gray-200; - } - & .btn:not(:hover) { - background-color: white; - } -} - -.modal-xl { - @extend .modal-lg; - width: 80%; -} - -// ENTITIES ==================================================================== -.entity-fields { - dt { - @extend .col-3; - @extend .label-title; - display: block; - float: left; - } - - dd { - @extend .col-9; - @extend .mb-0; - display: block; - float: left; - - ul { - @extend .list-unstyled; - @extend .mb-0 - } - } -} -} +@import '../../../../shared/src/scss/styles.scss'; +@import '../menu/menu-dashboard/menu-dashboard.component.scss'; +@import '../menu/menu-app/menu-app.component.scss'; + +// @layer bootstrap { +// @import 'variables'; +// @import 'bootstrap/scss/bootstrap'; +// @import 'bootstrap/scss/_functions'; +// @import 'bootstrap/scss/_mixins'; +// @import 'bootstrap/scss/_variables'; + + +// html [type=button] { +// -webkit-appearance: none; +// } +// body { +// height: 100vh; // With block page body div to flex-grow-1 +// } +// header { +// position: relative; +// } + +// .field-required:before { +// @extend .mr-1; +// @extend .font-weight-bold; +// @extend .text-danger; +// content: "*"; +// } + +// // BUTTONS & BUTTON-LINKS ----------------------- +// button:disabled:hover { +// cursor: not-allowed; +// } +// button.disabled { +// cursor: not-allowed !important; +// } +// .btn-link.btn-outline-primary:hover { +// color: #fff !important; +// text-decoration: none !important; +// } + +// .label-title:after { +// content: ":" +// } + +// .no-data { +// font-style: italic; +// color: $gray-500; +// } + +// .raw-data { +// font-size: .75rem; +// font-family: "Courier New"; +// &:before { +// content: '['; +// } +// &:after { +// content: ']'; +// } +// } + + +// .rero-ils-logo { +// max-height: $navbar-brand-height; +// margin: 7px 0; +// } + +// .rero-ils-page-body { +// height: calc(100vh - 0px); +// overflow: auto; +// } + +// .rero-ils-footer { +// height: $footer-height; +// } + +// .rero-ils-page-body { +// height: calc(100vh - 0px); +// overflow: auto; +// } + +// .list-group-item:last-child { +// border-bottom: 0; +// } + + +// span.no-data { +// font-style: italic; +// color: lightgray; +// cursor: not-allowed; +// } + +// // Data list into brief view +// dl.brief-view dd { +// margin-bottom: 0; +// } + +// json-schema-form { +// input.ng-valid, +// textarea.ng-valid { +// border-left: 5px solid $form_valid; +// } + +// input.ng-invalid, +// textarea.ng-invalid { +// border-left: 5px solid $form_error; /* red */ +// } + +// .required::after { +// content: " *"; +// color: $form_required; +// } + +// a.collapsed i.fa-caret-down { +// transform: rotate(-90deg); +// } +// } + +// .rero-ils-person small { +// font-size: $font-size-very-small; +// vertical-align: top; +// } + + +// /* SHOW MORE BUTTON ====================================================== */ +// .btn-show-more { +// border: $border-width solid $border-color; +// border-radius: 2rem; +// height: 30px; +// min-width: 30px; +// background-color: $white; +// margin-right: map-get($spacers, 3); +// font-size: $font-size-base; + +// &.btn-expanded::before { +// font-family: 'FontAwesome'; +// font-weight: 100; +// content: " \f0d7"; +// } + +// &.btn-collapsed::before { +// font-family: 'FontAwesome'; +// font-weight: 100; +// content: " \f0da"; +// } +// } +// .card-header .btn-show-more { +// border-color: $card-border-color; +// font-size: $font-size-base; +// margin-right: map-get($spacers, 2); +// } + +// // DEBUG PANELS ============================================================================ +// pre { +// border: $border-width solid $border-color; +// padding: map-get($spacers, 2); +// position: relative; + + +// legend { +// position: absolute; +// top:0; +// right: 0; +// padding: map-get($spacers, 1) map-get($spacers, 2); +// background-color: $border-color; +// border-bottom-left-radius: $border-radius-lg; +// font-size: $font-size-sm; +// width: inherit; +// } +// } + +// // source: https://codepen.io/superjaberwocky/pen/AXdEWj +// .callout { +// border: 1px solid #eee; +// border-left-width: 5px !important; +// border-radius: 3px; +// h4 { +// margin-top: 0; +// margin-bottom: 5px; +// } +// p:last-child { +// margin-bottom: 0; +// } +// code { +// border-radius: 3px; +// } +// & + .bs-callout { +// margin-top: -5px; +// } +// } +// @each $name,$color in (primary,$primary),(success,$success),(danger,$danger),(warning,$warning),(info,$info), (dark,$dark) { +// .callout-#{$name} { +// border-color: $color !important; +// h4 { +// color: $color; +// } +// } +// .callout-bg-#{$name} { +// background-color: theme-color-level(#{$name}, -10) !important; + +// *[class*='btn-outline-']:not(:hover) { +// background-color: white; +// } +// } +// } + +// .events-timeline { +// position: relative; +// .timeline-event { +// .event-timestamp { +// color: $secondary; +// font-size: 0.75rem; +// } +// .event-content { +// &:before { +// content: ''; +// background: $secondary; +// position: absolute; +// left: -.5rem; +// top: .25rem; +// width: 1px; +// height: 100%; +// z-index: 400; +// } +// &:hover .more-detail{ +// display: block; +// } +// .row { +// margin-bottom: 1rem; +// line-height: 1.1; +// &:first-child:after { +// content: ' '; +// background-color: white; +// display: inline-block; +// position: absolute; +// border-radius: 50%; +// border: 1px solid $secondary; +// left: calc(-.75rem - 1px); +// top: .25rem; +// width: .75rem; +// height: .75rem; +// z-index: 400; +// } +// &.event-highlight:first-child:after{ +// border-color: $warning; +// background-color: theme-color-level("warning", -10); +// } +// .label { +// &:after { +// content: ' '; +// position: absolute; +// border-top: 1px dashed #EEE; +// top: calc(.55rem - 1px); +// width: 100%; +// } +// } +// } +// .force-display { +// display: block !important; +// } +// .more-detail { +// display: none; +// cursor: pointer; +// } +// } +// } +// } + +// .informations { +// position: relative; +// padding-left: 3rem; +// width: calc(100% - 3rem); + +// .name { +// font-weight: bold; +// z-index: 0; +// padding: 0; + +// &::before { +// content: ""; +// border-top: 1px dotted $secondary; +// width: calc(100% - .25rem); +// position: absolute; +// left: 0; +// top: 1rem; +// z-index: -1; +// } + +// span { +// background-color: #FFF; +// padding-right: .25rem; +// display: inline; +// } +// } +// } + +// .card { +// .card-header:not(:first-child) { +// border-top: $card-border-width solid $card-border-color; +// } +// .card-header + .card-header { +// border-top: none; +// } +// } + +// // Adapt detailed views to not use screen width +// .main-content{ +// @extend .container; +// } + +// .rero-ils-editor-max-width { +// @include media-breakpoint-up(lg) { +// max-width: 500px; +// } +// } + +// .rero-ils-editor-title > div > label { +// font-weight: bold; +// } + +// .header:hover ~ .content { +// background-color: #f8f9fa; +// border-radius: 5px; +// } + +// .striped { +// padding-top: 2px; +// } + +// .div-striped .striped:nth-of-type(odd) { +// background: #F8F8F8; +// } + +// .div-striped .striped:nth-of-type(even) { +// background: #FFFFFF; +// } + +// .div-striped .striped .row div:first-of-type { +// padding-left: map-get($spacers, 4); +// } + +// // LIBRARY ==================================================================== +// .exception-date { + +// &.over-exception { +// background-color: $gray-100; + +// & > * { +// color: $gray-500; +// font-style: italic; +// text-decoration: line-through; +// } +// .status i { +// color: $gray-500 !important; +// } +// } + +// &:hover{ +// background-color: $gray-200; +// } +// & .btn:not(:hover) { +// background-color: white; +// } +// } + +// .modal-xl { +// @extend .modal-lg; +// width: 80%; +// } + +// // ENTITIES ==================================================================== +// .entity-fields { +// dt { +// @extend .col-3; +// @extend .label-title; +// display: block; +// float: left; +// } + +// dd { +// @extend .col-9; +// @extend .mb-0; +// display: block; +// float: left; + +// ul { +// @extend .list-unstyled; +// @extend .mb-0 +// } +// } +// } +// } diff --git a/projects/admin/src/app/widgets/frontpage/frontpage.component.html b/projects/admin/src/app/widgets/frontpage/frontpage.component.html index 1095de50f..bb1ad8fb4 100644 --- a/projects/admin/src/app/widgets/frontpage/frontpage.component.html +++ b/projects/admin/src/app/widgets/frontpage/frontpage.component.html @@ -1,6 +1,6 @@ -
-
-

RERO ILS administration

-
- +
+

RERO ILS administration

+