# HG changeset patch # User Thomas Junk # Date 1543825708 -3600 # Node ID ef388dcbb946bb1818e2c7264dee9bd2655f8b2f # Parent 6f2219d942d6e70876ab69c2801d5544055e5cca refac: reverting unecessary port from scss to sass Rationale: Although sass might be easier on the eyes because of lesser curly braces the tooling (autoformat, completion, error highlighting etc) is much more elaborate for scss. diff -r 6f2219d942d6 -r ef388dcbb946 client/src/assets/application.sass --- a/client/src/assets/application.sass Fri Nov 30 18:00:05 2018 +0100 +++ /dev/null Thu Jan 01 00:00:00 1970 +0000 @@ -1,91 +0,0 @@ -/* This is Free Software under GNU Affero General Public License v >= 3.0 - * without warranty, see README.md and license for details. - * - * SPDX-License-Identifier: AGPL-3.0-or-later - * License-Filename: LICENSES/AGPL-3.0.txt - * - * Copyright (C) 2018 by via donau - * – Österreichische Wasserstraßen-Gesellschaft mbH - * Software engineering by Intevation GmbH - * - * Author(s): - * Thomas Junk - * Markus Kottländer - */ - -$shadow-xs: 0 0.1rem 0.5rem rgba(0, 0, 0, 0.2) -$border-radius: 0.25rem -$icon-height: 2rem -$icon-width: 2rem -$large-offset: 2rem -$offset: 1rem -$sidebar-width: 15rem -$slight-transparent: 0.96 -$small-offset: 0.5rem -$smaller: 0.9rem -$transition-fast: 0.3s -$x-large-offset: 3rem -$xx-large-offset: 5rem -$color-info: #17a2b8 - -a - color: $color-info - &:hover, - &:active, - &:focus - color: darken($color-info, 13) - -.w-90 - width: 90% - -.w-95 - width: 95% - -.debug - border: 1px solid red - -%fully-centered - position: absolute - top: 50% - left: 50% - transform: translate(-50%, -50%) - -.ui-element - pointer-events: auto - -.shadow-xs - box-shadow: $shadow-xs - -.box - opacity: $slight-transparent - max-height: 0 - max-width: 0 - overflow: hidden - margin-left: 0 - margin-right: 0 - margin-bottom: 0 - box-shadow: $shadow-xs - transition: max-width .4s, max-height .4s, margin-left .4s, margin-right .4s, margin-bottom .4s - -.box h6, -.contextbox h6 - color: $color-info - font-weight: bold - -.expanded - max-height: 999px - max-width: 999px - margin-left: 0.5rem - margin-right: 0.5rem - margin-bottom: 1rem - -// needed to fix the whitespace problem of -// https://github.com/Polyconseil/vue-gettext/issues/80 -// use like -// link -// contributors. -// -// done centrally, so we can fix it centrally for better vue-gettext version -.fix-trans-space - &:before - content: " " diff -r 6f2219d942d6 -r ef388dcbb946 client/src/assets/application.scss --- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/client/src/assets/application.scss Mon Dec 03 09:28:28 2018 +0100 @@ -0,0 +1,105 @@ +/* This is Free Software under GNU Affero General Public License v >= 3.0; + * without warranty, see README.md and license for details. + * + * SPDX-License-Identifier: AGPL-3.0-or-later + * License-Filename: LICENSES/AGPL-3.0.txt + * + * Copyright (C) 2018 by via donau + * – Österreichische Wasserstraßen-Gesellschaft mbH + * Software engineering by Intevation GmbH + * + * Author(s): + * Thomas Junk + * Markus Kottländer + */ + +$shadow-xs: 0 0.1rem 0.5rem rgba(0, 0, 0, 0.2); +$border-radius: 0.25rem; +$icon-height: 2rem; +$icon-width: 2rem; +$large-offset: 2rem; +$offset: 1rem; +$sidebar-width: 15rem; +$slight-transparent: 0.96; +$small-offset: 0.5rem; +$smaller: 0.9rem; +$transition-fast: 0.3s; +$x-large-offset: 3rem; +$xx-large-offset: 5rem; +$color-info: #17a2b8; + +a { + color: $color-info; +} + +a:hover, +a:active, +a:focus { + color: darken($color-info, 13); +} + +.w-90 { + width: 90%; +} + +.w-95 { + width: 95%; +} + +.debug { + border: 1px solid red; +} + +%fully-centered { + position: absolute; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); +} + +.ui-element { + pointer-events: auto; +} + +.shadow-xs { + box-shadow: $shadow-xs; +} + +.box { + opacity: $slight-transparent; + max-height: 0; + max-width: 0; + overflow: hidden; + margin-left: 0; + margin-right: 0; + margin-bottom: 0; + box-shadow: $shadow-xs; + transition: max-width 0.4s, max-height 0.4s, margin-left 0.4s, + margin-right 0.4s, margin-bottom 0.4s; +} + +.box h6, +.contextbox h6 { + color: $color-info; + font-weight: bold; +} + +.expanded { + max-height: 999px; + max-width: 999px; + margin-left: 0.5rem; + margin-right: 0.5rem; + margin-bottom: 1rem; +} + +// needed to fix the whitespace problem of +// https://github.com/Polyconseil/vue-gettext/issues/80; +// use like +// link +// contributors. +// +// done centrally, so we can fix it centrally for better vue-gettext version +.fix-trans-space, +.fix-trans-space:before { + content: " "; +} diff -r 6f2219d942d6 -r ef388dcbb946 client/src/assets/tooltip.sass --- a/client/src/assets/tooltip.sass Fri Nov 30 18:00:05 2018 +0100 +++ /dev/null Thu Jan 01 00:00:00 1970 +0000 @@ -1,106 +0,0 @@ -/* This is Free Software under GNU Affero General Public License v >= 3.0 - * without warranty, see README.md and license for details. - * - * SPDX-License-Identifier: AGPL-3.0-or-later - * License-Filename: LICENSES/AGPL-3.0.txt - * - * Copyright (C) 2018 by via donau - * – Österreichische Wasserstraßen-Gesellschaft mbH - * Software engineering by Intevation GmbH - * - * Author(s): - * Thomas Junk - */ -.tooltip - display: block !important - z-index: 10000 - - .tooltip-inner - background: black - color: white - border-radius: 16px - padding: 5px 10px 4px - - .tooltip-arrow - width: 0 - height: 0 - border-style: solid - position: absolute - margin: 5px - border-color: black - z-index: 1 - - &[x-placement^="top"] - margin-bottom: 5px - - .tooltip-arrow - border-width: 5px 5px 0 5px - border-left-color: transparent !important - border-right-color: transparent !important - border-bottom-color: transparent !important - bottom: -5px - left: calc(50% - 5px) - margin-top: 0 - margin-bottom: 0 - - &[x-placement^="bottom"] - margin-top: 5px - - .tooltip-arrow - border-width: 0 5px 5px 5px - border-left-color: transparent !important - border-right-color: transparent !important - border-top-color: transparent !important - top: -5px - left: calc(50% - 5px) - margin-top: 0 - margin-bottom: 0 - - &[x-placement^="right"] - margin-left: 5px - - .tooltip-arrow - border-width: 5px 5px 5px 0 - border-left-color: transparent !important - border-top-color: transparent !important - border-bottom-color: transparent !important - left: -5px - top: calc(50% - 5px) - margin-left: 0 - margin-right: 0 - - &[x-placement^="left"] - margin-right: 5px - - .tooltip-arrow - border-width: 5px 0 5px 5px - border-top-color: transparent !important - border-right-color: transparent !important - border-bottom-color: transparent !important - right: -5px - top: calc(50% - 5px) - margin-left: 0 - margin-right: 0 - - &.popover - $color: #f9f9f9 - - .popover-inner - background: $color - color: black - padding: 24px - border-radius: 5px - box-shadow: 0 5px 30px rgba(black, 0.1) - - .popover-arrow - border-color: $color - - &[aria-hidden="true"] - visibility: hidden - opacity: 0 - transition: opacity 0.15s, visibility 0.15s - - &[aria-hidden="false"] - visibility: visible - opacity: 1 - transition: opacity 0.15s diff -r 6f2219d942d6 -r ef388dcbb946 client/src/assets/tooltip.scss --- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/client/src/assets/tooltip.scss Mon Dec 03 09:28:28 2018 +0100 @@ -0,0 +1,118 @@ +/* This is Free Software under GNU Affero General Public License v >= 3.0 + * without warranty, see README.md and license for details. + * + * SPDX-License-Identifier: AGPL-3.0-or-later + * License-Filename: LICENSES/AGPL-3.0.txt + * + * Copyright (C) 2018 by via donau + * – Österreichische Wasserstraßen-Gesellschaft mbH + * Software engineering by Intevation GmbH + * + * Author(s): + * Thomas Junk + */ +.tooltip { + display: block !important; + z-index: 10000; +} + +.tooltip .tooltip-inner { + background: black; + color: white; + border-radius: 16px; + padding: 5px 10px 4px; +} + +.tooltip .tooltip-arrow { + width: 0; + height: 0; + border-style: solid; + position: absolute; + margin: 5px; + border-color: black; + z-index: 1; +} + +.tooltip[x-placement^="top"] { + margin-bottom: 5px; +} + +.tooltip[x-placement^="top"] .tooltip-arrow { + border-width: 5px 5px 0 5px; + border-left-color: transparent !important; + border-right-color: transparent !important; + border-bottom-color: transparent !important; + bottom: -5px; + left: calc(50% - 5px); + margin-top: 0; + margin-bottom: 0; +} + +.tooltip[x-placement^="bottom"] { + margin-top: 5px; +} + +.tooltip[x-placement^="bottom"] .tooltip-arrow { + border-width: 0 5px 5px 5px; + border-left-color: transparent !important; + border-right-color: transparent !important; + border-top-color: transparent !important; + top: -5px; + left: calc(50% - 5px); + margin-top: 0; + margin-bottom: 0; +} + +.tooltip[x-placement^="right"] { + margin-left: 5px; +} + +.tooltip[x-placement^="right"] .tooltip-arrow { + border-width: 5px 5px 5px 0; + border-left-color: transparent !important; + border-top-color: transparent !important; + border-bottom-color: transparent !important; + left: -5px; + top: calc(50% - 5px); + margin-left: 0; + margin-right: 0; +} + +.tooltip[x-placement^="left"] { + margin-right: 5px; +} + +.tooltip[x-placement^="left"] .tooltip-arrow { + border-width: 5px 0 5px 5px; + border-top-color: transparent !important; + border-right-color: transparent !important; + border-bottom-color: transparent !important; + right: -5px; + top: calc(50% - 5px); + margin-left: 0; + margin-right: 0; +} + +.tooltip.popover .popover-inner { + background: #f9f9f9; + color: black; + padding: 24px; + border-radius: 5px; + box-shadow: 0 5px 30px rgba(black, 0.1); +} + +.tooltip.popover .popover-arrow { + border-color: #f9f9f9; +} + +.tooltip[aria-hidden="true"] { + visibility: hidden; + opacity: 0; + transition: opacity 0.15s, visibility 0.15s; +} + +.tooltip[aria-hidden="false"] { + visibility: visible; + opacity: 1; + transition: opacity 0.15s; +} diff -r 6f2219d942d6 -r ef388dcbb946 client/src/components/admin/usermanagement/Usermanagement.vue --- a/client/src/components/admin/usermanagement/Usermanagement.vue Fri Nov 30 18:00:05 2018 +0100 +++ b/client/src/components/admin/usermanagement/Usermanagement.vue Mon Dec 03 09:28:28 2018 +0100 @@ -80,70 +80,87 @@ -