HTWK/htwkalender
1
1
Fork 0
mirror of https://gitlab.dit.htwk-leipzig.de/htwk-software/htwkalender.git synced 2025-08-11 14:13:49 +02:00
Code Issues Packages Projects Releases Wiki Activity

feat:#47 updated primevue theme for sass

Browse Source
This commit is contained in:
Elmar Kresse
2024-03-30 14:43:21 +01:00
parent d58b633159
commit d93287d732
104 changed files with 14548 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

222
frontend/public/primevue-sass-theme/theme-base/components/menu/_menubar.scss Normal file
View File

@@ -0,0 +1,222 @@
// core
.p-menubar {
display: flex;
align-items: center;
}
.p-menubar ul {
margin: 0;
padding: 0;
list-style: none;
}
.p-menubar .p-menuitem-link {
cursor: pointer;
display: flex;
align-items: center;
text-decoration: none;
overflow: hidden;
position: relative;
}
.p-menubar .p-menuitem-text {
line-height: 1;
}
.p-menubar .p-menuitem {
position: relative;
}
.p-menubar-root-list {
display: flex;
align-items: center;
flex-wrap: wrap;
}
.p-menubar-root-list > li ul {
display: none;
z-index: 1;
}
.p-menubar-root-list > .p-menuitem-active > .p-submenu-list {
display: block;
}
.p-menubar .p-submenu-list {
display: none;
position: absolute;
z-index: 1;
}
.p-menubar .p-submenu-list > .p-menuitem-active > .p-submenu-list {
display: block;
left: 100%;
top: 0;
}
.p-menubar .p-submenu-list .p-menuitem .p-menuitem-content .p-menuitem-link .p-submenu-icon {
margin-left: auto;
}
.p-menubar .p-menubar-end {
margin-left: auto;
align-self: center;
}
.p-menubar-button {
display: none;
cursor: pointer;
align-items: center;
justify-content: center;
text-decoration: none;
}
.p-menubar.p-menubar-mobile {
position: relative;
}
.p-menubar.p-menubar-mobile .p-menubar-button {
display: flex;
}
.p-menubar.p-menubar-mobile .p-menubar-root-list {
position: absolute;
display: none;
width: 100%;
}
.p-menubar.p-menubar-mobile .p-submenu-list {
width: 100%;
position: static;
box-shadow: none;
border: 0 none;
}
.p-menubar.p-menubar-mobile .p-menubar-root-list .p-menuitem {
width: 100%;
position: static;
}
.p-menubar.p-menubar-mobile-active .p-menubar-root-list {
display: flex;
flex-direction: column;
top: 100%;
left: 0;
z-index: 1;
}
// theme
.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;
min-width: $menuWidth;
border-radius: $borderRadius;
.p-menuitem-separator {
border-top: $divider;
margin: $menuSeparatorMargin;
}
.p-submenu-icon {
font-size: $menuitemSubmenuIconFontSize;
}
}
&.p-menubar-mobile {
.p-menubar-button {
width: $actionIconWidth;
height: $actionIconHeight;
color: $horizontalMenuRootMenuitemIconColor;
border-radius: $actionIconBorderRadius;
transition: $actionIconTransition;
outline-color: transparent;
&:hover {
color: $horizontalMenuRootMenuitemIconHoverColor;
background: $horizontalMenuRootMenuitemHoverBg;
}
&:focus {
@include focused();
}
}
.p-menubar-root-list {
padding: $verticalMenuPadding;
background: $overlayMenuBg;
border: $overlayMenuBorder;
box-shadow: $overlayMenuShadow;
.p-menuitem-separator {
border-top: $divider;
margin: $menuSeparatorMargin;
}
.p-submenu-icon {
font-size: $menuitemSubmenuIconFontSize;
}
.p-menuitem {
.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 {
.p-submenu-icon {
transition: transform $transitionDuration;
transform: rotate(90deg);
}
.p-menuitem-active {
> .p-menuitem-content {
> .p-menuitem-link {
> .p-submenu-icon {
transform: rotate(-90deg);
}
}
}
}
}
@include nested-submenu-indents(nth($menuitemPadding, 1), 2, 10);
}
}
}