@mediusinc/mng-commons-layout 6.0.0-rc.5 → 6.0.0-rc.7

package/scss/theme/theme-base/components/menu/_breadcrumb.scss

@@ -1,42 +0,0 @@
-.p-breadcrumb {
-    background: $breadcrumbBg;
-    border: $breadcrumbBorder;
-    border-radius: $borderRadius;
-    padding: $breadcrumbPadding;
-
-    .p-breadcrumb-list {
-        li {
-            .p-menuitem-link {
-                transition: $listItemTransition;
-                border-radius: $borderRadius;
-
-                &:focus-visible {
-                    @include focused();
-                }
-
-                .p-menuitem-text {
-                    color: $breadcrumbItemTextColor;
-                }
-
-                .p-menuitem-icon {
-                    color: $breadcrumbItemIconColor;
-                }
-            }
-
-            &.p-menuitem-separator {
-                margin: 0 $inlineSpacing 0 $inlineSpacing;
-                color: $breadcrumbSeparatorColor;
-            }
-
-            &:last-child {
-                .p-menuitem-text {
-                    color: $breadcrumbLastItemTextColor;
-                }
-
-                .p-menuitem-icon {
-                    color: $breadcrumbLastItemIconColor;
-                }
-            }
-        }
-    }
-}

package/scss/theme/theme-base/components/menu/_contextmenu.scss

@@ -1,39 +0,0 @@
-.p-contextmenu {
-    padding: $verticalMenuPadding;
-    background: $overlayMenuBg;
-    color: $menuTextColor;
-    border: $overlayMenuBorder;
-    box-shadow: $overlayMenuShadow;
-    border-radius: $borderRadius;
-    width: $menuWidth;
-
-    .p-contextmenu-root-list {
-        outline: 0 none;
-    }
-
-    .p-submenu-list {
-        padding: $verticalMenuPadding;
-        background: $overlayMenuBg;
-        border: $overlayMenuBorder;
-        box-shadow: $overlayMenuShadow;
-        border-radius: $borderRadius;
-    }
-
-    .p-menuitem {
-        @include menuitem();
-    }
-
-    .p-menuitem-separator {
-        border-top: $divider;
-        margin: $menuSeparatorMargin;
-    }
-
-    .p-submenu-icon {
-        font-size: $menuitemSubmenuIconFontSize;
-
-        &.p-icon {
-            width: $menuitemSubmenuIconFontSize;
-            height: $menuitemSubmenuIconFontSize;
-        }
-    }
-}

package/scss/theme/theme-base/components/menu/_dock.scss

@@ -1,95 +0,0 @@
-.p-dock {
-    .p-dock-list-container {
-        background: $dockBg;
-        border: $dockBorder;
-        padding: $dockPadding;
-        border-radius: $dockBorderRadius;
-
-        .p-dock-list {
-            outline: 0 none;
-        }
-    }
-
-    .p-dock-item {
-        padding: $dockItemPadding;
-        border-radius: $dockItemBorderRadius;
-
-        &.p-focus {
-            @include focused-listitem();
-        }
-    }
-
-    .p-dock-link {
-        width: $dockActionWidth;
-        height: $dockActionHeight;
-    }
-
-    &.p-dock-top,
-    &.p-dock-bottom {
-        .p-dock-item-second-prev,
-        .p-dock-item-second-next {
-            margin: 0 $dockSecondItemsMargin;
-        }
-
-        .p-dock-item-prev,
-        .p-dock-item-next {
-            margin: 0 $dockFirstItemsMargin;
-        }
-
-        .p-dock-item-current {
-            margin: 0 $dockCurrentItemMargin;
-        }
-    }
-
-    &.p-dock-left,
-    &.p-dock-right {
-        .p-dock-item-second-prev,
-        .p-dock-item-second-next {
-            margin: $dockSecondItemsMargin 0;
-        }
-
-        .p-dock-item-prev,
-        .p-dock-item-next {
-            margin: $dockFirstItemsMargin 0;
-        }
-
-        .p-dock-item-current {
-            margin: $dockCurrentItemMargin 0;
-        }
-    }
-}
-
-@media screen and (max-width: 960px) {
-    .p-dock {
-        &.p-dock-top,
-        &.p-dock-bottom {
-            .p-dock-list-container {
-                overflow-x: auto;
-                width: 100%;
-
-                .p-dock-list {
-                    margin: 0 auto;
-                }
-            }
-        }
-
-        &.p-dock-left,
-        &.p-dock-right {
-            .p-dock-list-container {
-                overflow-y: auto;
-                height: 100%;
-
-                .p-dock-list {
-                    margin: auto 0;
-                }
-            }
-        }
-
-        .p-dock-list {
-            .p-dock-item {
-                transform: none;
-                margin: 0;
-            }
-        }
-    }
-}

package/scss/theme/theme-base/components/menu/_megamenu.scss

@@ -1,55 +0,0 @@
-.p-megamenu {
-    padding: $horizontalMenuPadding;
-    background: $horizontalMenuBg;
-    color: $horizontalMenuTextColor;
-    border: $horizontalMenuBorder;
-    border-radius: $borderRadius;
-
-    .p-megamenu-root-list {
-        outline: 0 none;
-    }
-
-    .p-menuitem {
-        @include menuitem();
-    }
-
-    .p-megamenu-panel {
-        background: $overlayMenuBg;
-        color: $menuTextColor;
-        border: $overlayMenuBorder;
-        box-shadow: $overlayMenuShadow;
-    }
-
-    .p-submenu-header {
-        margin: $submenuHeaderMargin;
-        padding: $submenuHeaderPadding;
-        color: $submenuHeaderTextColor;
-        background: $submenuHeaderBg;
-        font-weight: $submenuHeaderFontWeight;
-        border-top-right-radius: $borderRadius;
-        border-top-left-radius: $borderRadius;
-    }
-
-    .p-submenu-list {
-        padding: $verticalMenuPadding;
-        width: $menuWidth;
-
-        .p-menuitem-separator {
-            border-top: $divider;
-            margin: $menuSeparatorMargin;
-        }
-    }
-
-    &.p-megamenu-vertical {
-        width: $menuWidth;
-        padding: $verticalMenuPadding;
-    }
-
-    &.p-megamenu-horizontal {
-        .p-megamenu-root-list {
-            > .p-menuitem {
-                @include horizontal-rootmenuitem();
-            }
-        }
-    }
-}

package/scss/theme/theme-base/components/menu/_menu.scss

@@ -1,37 +0,0 @@
-.p-menu {
-    padding: $verticalMenuPadding;
-    background: $menuBg;
-    color: $menuTextColor;
-    border: $menuBorder;
-    border-radius: $borderRadius;
-    width: $menuWidth;
-
-    .p-menuitem {
-        @include menuitem();
-    }
-
-    &.p-menu-overlay {
-        background: $overlayMenuBg;
-        border: $overlayMenuBorder;
-        box-shadow: $overlayMenuShadow;
-    }
-
-    .p-submenu-header {
-        margin: $submenuHeaderMargin;
-        padding: $submenuHeaderPadding;
-        color: $submenuHeaderTextColor;
-        background: $submenuHeaderBg;
-        font-weight: $submenuHeaderFontWeight;
-        border-top-right-radius: $submenuHeaderBorderRadius;
-        border-top-left-radius: $submenuHeaderBorderRadius;
-    }
-
-    .p-menuitem-separator {
-        border-top: $divider;
-        margin: $menuSeparatorMargin;
-    }
-
-    .p-menuitem-badge {
-        @include menuitem-badge();
-    }
-}

package/scss/theme/theme-base/components/menu/_menubar.scss

@@ -1,140 +0,0 @@
-.p-menubar {
-    padding: $horizontalMenuPadding;
-    background: $horizontalMenuBg;
-    color: $horizontalMenuTextColor;
-    border: $horizontalMenuBorder;
-    border-radius: $borderRadius;
-
-    .p-menubar-root-list {
-        outline: 0 none;
-
-        > .p-menuitem {
-            @include horizontal-rootmenuitem();
-        }
-    }
-
-    .p-menuitem {
-        @include menuitem();
-    }
-
-    .p-submenu-list {
-        padding: $verticalMenuPadding;
-        background: $overlayMenuBg;
-        border: $overlayMenuBorder;
-        box-shadow: $overlayMenuShadow;
-        width: $menuWidth;
-
-        .p-menuitem-separator {
-            border-top: $divider;
-            margin: $menuSeparatorMargin;
-        }
-
-        .p-submenu-icon {
-            font-size: $menuitemSubmenuIconFontSize;
-        }
-    }
-}
-
-@media screen and (max-width: 960px) {
-    .p-menubar {
-        position: relative;
-
-        .p-menubar-button {
-            display: flex;
-            width: $actionIconWidth;
-            height: $actionIconHeight;
-            color: $horizontalMenuRootMenuitemIconColor;
-            border-radius: $actionIconBorderRadius;
-            transition: $actionIconTransition;
-
-            &:hover {
-                color: $horizontalMenuRootMenuitemIconHoverColor;
-                background: $horizontalMenuRootMenuitemHoverBg;
-            }
-
-            &:focus {
-                @include focused();
-            }
-        }
-
-        .p-menubar-root-list {
-            position: absolute;
-            display: none;
-            padding: $verticalMenuPadding;
-            background: $overlayMenuBg;
-            border: $overlayMenuBorder;
-            box-shadow: $overlayMenuShadow;
-            width: 100%;
-
-            .p-menuitem-separator {
-                border-top: $divider;
-                margin: $menuSeparatorMargin;
-            }
-
-            .p-submenu-icon {
-                font-size: $menuitemSubmenuIconFontSize;
-            }
-
-            .p-menuitem {
-                width: 100%;
-                position: static;
-
-                .p-menuitem-content {
-                    .p-menuitem-link {
-                        .p-submenu-icon {
-                            margin-left: auto;
-                            transition: transform $transitionDuration;
-                        }
-                    }
-                }
-
-                &.p-menuitem-active {
-                    > .p-menuitem-content {
-                        > .p-menuitem-link {
-                            > .p-submenu-icon {
-                                transform: rotate(-180deg);
-                            }
-                        }
-                    }
-                }
-            }
-
-            .p-submenu-list {
-                width: 100%;
-                position: static;
-                box-shadow: none;
-                border: 0 none;
-
-                .p-submenu-icon {
-                    transition: transform $transitionDuration;
-                    transform: rotate(90deg);
-                }
-
-                .p-menuitem-active {
-                    > .p-menuitem-content {
-                        > .p-menuitem-link {
-                            > .p-submenu-icon {
-                                transform: rotate(-90deg);
-                            }
-                        }
-                    }
-                }
-            }
-
-            .p-menuitem {
-                width: 100%;
-                position: static;
-            }
-
-            @include nested-submenu-indents(nth($menuitemPadding, 1), 2, 10);
-        }
-
-        &.p-menubar-mobile-active .p-menubar-root-list {
-            display: flex;
-            flex-direction: column;
-            top: 100%;
-            left: 0;
-            z-index: 1;
-        }
-    }
-}

package/scss/theme/theme-base/components/menu/_panelmenu.scss

@@ -1,153 +0,0 @@
-.p-panelmenu {
-    .p-panelmenu-header {
-        outline: 0 none;
-
-        .p-panelmenu-header-content {
-            border: $accordionHeaderBorder;
-            color: $accordionHeaderTextColor;
-            background: $accordionHeaderBg;
-            border-radius: $borderRadius;
-            transition: $listItemTransition;
-
-            .p-panelmenu-header-action {
-                color: $accordionHeaderTextColor;
-                padding: $accordionHeaderPadding;
-                font-weight: $accordionHeaderFontWeight;
-
-                .p-submenu-icon {
-                    margin-right: $inlineSpacing;
-                }
-
-                .p-menuitem-icon {
-                    margin-right: $inlineSpacing;
-                }
-            }
-        }
-
-        &:not(.p-disabled) {
-            &:focus-visible {
-                .p-panelmenu-header-content {
-                    @include focused-inset();
-                }
-            }
-        }
-
-        &:not(.p-highlight):not(.p-disabled):hover {
-            .p-panelmenu-header-content {
-                background: $accordionHeaderHoverBg;
-                border-color: $accordionHeaderHoverBorderColor;
-                color: $accordionHeaderTextHoverColor;
-            }
-        }
-
-        &:not(.p-disabled).p-highlight {
-            .p-panelmenu-header-content {
-                background: $accordionHeaderActiveBg;
-                border-color: $accordionHeaderActiveBorderColor;
-                color: $accordionHeaderTextActiveColor;
-                border-bottom-right-radius: 0;
-                border-bottom-left-radius: 0;
-                margin-bottom: 0;
-            }
-
-            &:hover {
-                .p-panelmenu-header-content {
-                    border-color: $accordionHeaderActiveHoverBorderColor;
-                    background: $accordionHeaderActiveHoverBg;
-                    color: $accordionHeaderTextActiveHoverColor;
-                }
-            }
-        }
-    }
-
-    .p-panelmenu-content {
-        padding: $verticalMenuPadding;
-        border: $accordionContentBorder;
-        background: $accordionContentBg;
-        color: $accordionContentTextColor;
-        border-top: 0;
-        border-top-right-radius: 0;
-        border-top-left-radius: 0;
-        border-bottom-right-radius: $borderRadius;
-        border-bottom-left-radius: $borderRadius;
-
-        .p-panelmenu-root-list {
-            outline: 0 none;
-        }
-
-        .p-menuitem {
-            @include menuitem();
-
-            .p-menuitem-content {
-                .p-menuitem-link {
-                    .p-submenu-icon {
-                        margin-right: $inlineSpacing;
-                    }
-                }
-            }
-        }
-
-        .p-menuitem-separator {
-            border-top: $divider;
-            margin: $menuSeparatorMargin;
-        }
-
-        .p-submenu-list:not(.p-panelmenu-root-list) {
-            padding: $treeNodeChildrenPadding;
-        }
-    }
-
-    .p-panelmenu-panel {
-        margin-bottom: $accordionSpacing;
-
-        @if $accordionSpacing == 0 {
-            .p-panelmenu-header {
-                .p-panelmenu-header-content {
-                    border-radius: 0;
-                }
-            }
-
-            .p-panelmenu-content {
-                border-radius: 0;
-            }
-
-            &:not(:first-child) {
-                .p-panelmenu-header {
-                    .p-panelmenu-header-content {
-                        border-top: 0 none;
-                    }
-
-                    &:not(.p-highlight):not(.p-disabled):hover,
-                    &:not(.p-disabled).p-highlight:hover {
-                        .p-panelmenu-header-content {
-                            border-top: 0 none;
-                        }
-                    }
-                }
-            }
-
-            &:first-child {
-                .p-panelmenu-header {
-                    .p-panelmenu-header-content {
-                        border-top-right-radius: $borderRadius;
-                        border-top-left-radius: $borderRadius;
-                    }
-                }
-            }
-
-            &:last-child {
-                .p-panelmenu-header:not(.p-highlight) {
-                    .p-panelmenu-header-content {
-                        border-bottom-right-radius: $borderRadius;
-                        border-bottom-left-radius: $borderRadius;
-                    }
-                }
-
-                .p-panelmenu-content {
-                    border-bottom-right-radius: $borderRadius;
-                    border-bottom-left-radius: $borderRadius;
-                }
-            }
-        }
-    }
-}

package/scss/theme/theme-base/components/menu/_slidemenu.scss

@@ -1,59 +0,0 @@
-.p-slidemenu {
-    padding: $verticalMenuPadding;
-    background: $menuBg;
-    color: $menuTextColor;
-    border: $menuBorder;
-    border-radius: $borderRadius;
-    width: $menuWidth;
-
-    .p-slidemenu-root-list {
-        outline: 0 none;
-    }
-
-    .p-submenu-list {
-        outline: 0 none;
-    }
-
-    .p-menuitem {
-        @include menuitem();
-    }
-
-    &.p-slidemenu-overlay {
-        background: $overlayMenuBg;
-        border: $overlayMenuBorder;
-        box-shadow: $overlayMenuShadow;
-    }
-
-    .p-slidemenu-list {
-        padding: $verticalMenuPadding;
-        background: $overlayMenuBg;
-        border: $overlayMenuBorder;
-        box-shadow: $overlayMenuShadow;
-    }
-
-    .p-menuitem-separator {
-        border-top: $divider;
-        margin: $menuSeparatorMargin;
-    }
-
-    .p-slidemenu-icon {
-        font-size: $menuitemSubmenuIconFontSize;
-    }
-
-    .p-icon {
-        width: $menuitemSubmenuIconFontSize;
-        height: $menuitemSubmenuIconFontSize;
-    }
-
-    .p-slidemenu-backward {
-        padding: $menuitemPadding;
-        color: $menuitemTextColor;
-        &:not(.p-disabled):focus {
-            @include focused-inset();
-        }
-    }
-
-    .p-menuitem-badge {
-        @include menuitem-badge();
-    }
-}

package/scss/theme/theme-base/components/menu/_steps.scss

@@ -1,56 +0,0 @@
-@use 'sass:math';
-
-.p-steps {
-    .p-steps-item {
-        .p-menuitem-link {
-            background: transparent;
-            transition: $listItemTransition;
-            border-radius: $borderRadius;
-            background: $stepsItemBg;
-
-            .p-steps-number {
-                color: $stepsItemNumberColor;
-                border: $stepsItemBorder;
-                background: $stepsItemBg;
-                min-width: $stepsItemNumberWidth;
-                height: $stepsItemNumberHeight;
-                line-height: $stepsItemNumberHeight;
-                font-size: $stepsItemNumberFontSize;
-                z-index: 1;
-                border-radius: $stepsItemNumberBorderRadius;
-            }
-
-            .p-steps-title {
-                margin-top: $inlineSpacing;
-                color: $stepsItemTextColor;
-            }
-
-            &:not(.p-disabled):focus-visible {
-                @include focused();
-            }
-        }
-
-        &.p-highlight {
-            .p-steps-number {
-                background: $highlightBg;
-                color: $highlightTextColor;
-            }
-
-            .p-steps-title {
-                font-weight: $stepsItemActiveFontWeight;
-                color: $textColor;
-            }
-        }
-
-        &:before {
-            content: ' ';
-            border-top: $divider;
-            width: 100%;
-            top: 50%;
-            left: 0;
-            display: block;
-            position: absolute;
-            margin-top: math.div(-1 * $stepsItemNumberHeight, 2);
-        }
-    }
-}