vertumnus
/
primevue-mirror
mirror of https://github.com/primefaces/primevue.git
1
0
Fork 0
Code Packages Releases Activity

Refactor #6682 - For Menubar

pull/6697/head
tugcekucukoglu 2024-10-31 10:13:43 +03:00
parent 97fb1bbe73
commit 03c9826afc
1 changed files with 33 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

39
packages/primevue/src/menubar/style/MenubarStyle.js
View File

@ -77,6 +77,12 @@ const theme = ({ dt }) => `
height: ${dt('menubar.submenu.icon.size')}; height: ${dt('menubar.submenu.icon.size')};
} }
.p-menubar-submenu .p-menubar-submenu-icon:dir(rtl) {
margin-left: 0;
margin-right: auto;
transform: rotate(180deg);
}
.p-menubar-item.p-focus > .p-menubar-item-content { .p-menubar-item.p-focus > .p-menubar-item-content {
color: ${dt('menubar.item.focus.color')}; color: ${dt('menubar.item.focus.color')};
background: ${dt('menubar.item.focus.background')}; background: ${dt('menubar.item.focus.background')};
@ -132,24 +138,34 @@ const theme = ({ dt }) => `
} }
.p-menubar-submenu .p-menubar-separator { .p-menubar-submenu .p-menubar-separator {
border-top: 1px solid ${dt('menubar.separator.border.color')}; border-block-start: 1px solid ${dt('menubar.separator.border.color')};
} }
.p-menubar-submenu .p-menubar-item { .p-menubar-submenu .p-menubar-item {
position: relative; position: relative;
} }
.p-menubar-submenu > .p-menubar-item-active > .p-menubar-submenu { .p-menubar-submenu > .p-menubar-item-active > .p-menubar-submenu {
display: block; display: block;
left: 100%; left: 100%;
top: 0; top: 0;
} }
.p-menubar-submenu > .p-menubar-item-active > .p-menubar-submenu:dir(rtl) {
left: auto;
right: 100%;
}
.p-menubar-end { .p-menubar-end {
margin-left: auto; margin-left: auto;
align-self: center; align-self: center;
} }
.p-menubar-end:dir(rtl) {
margin-left: 0;
margin-right: auto;
}
.p-menubar-button { .p-menubar-button {
display: none; display: none;
justify-content: center; justify-content: center;
@ -201,6 +217,11 @@ const theme = ({ dt }) => `
gap: ${dt('menubar.submenu.gap')}; gap: ${dt('menubar.submenu.gap')};
} }
.p-menubar-mobile .p-menubar-root-list:dir(rtl) {
left: auto;
right: 0;
}
.p-menubar-mobile .p-menubar-root-list > .p-menubar-item > .p-menubar-item-content > .p-menubar-item-link { .p-menubar-mobile .p-menubar-root-list > .p-menubar-item > .p-menubar-item-content > .p-menubar-item-link {
padding: ${dt('menubar.item.padding')}; padding: ${dt('menubar.item.padding')};
} }
@ -215,7 +236,7 @@ const theme = ({ dt }) => `
} }
.p-menubar-mobile .p-menubar-root-list .p-menubar-separator { .p-menubar-mobile .p-menubar-root-list .p-menubar-separator {
border-top: 1px solid ${dt('menubar.separator.border.color')}; border-block-start: 1px solid ${dt('menubar.separator.border.color')};
} }
.p-menubar-mobile .p-menubar-root-list > .p-menubar-item > .p-menubar-item-content .p-menubar-submenu-icon { .p-menubar-mobile .p-menubar-root-list > .p-menubar-item > .p-menubar-item-content .p-menubar-submenu-icon {
@ -223,6 +244,12 @@ const theme = ({ dt }) => `
transition: transform 0.2s; transition: transform 0.2s;
} }
.p-menubar-mobile .p-menubar-root-list > .p-menubar-item > .p-menubar-item-content .p-menubar-submenu-icon:dir(rtl),
.p-menubar-mobile .p-menubar-submenu-icon:dir(rtl) {
margin-left: 0;
margin-right: auto;
}
.p-menubar-mobile .p-menubar-root-list > .p-menubar-item-active > .p-menubar-item-content .p-menubar-submenu-icon { .p-menubar-mobile .p-menubar-root-list > .p-menubar-item-active > .p-menubar-item-content .p-menubar-submenu-icon {
transform: rotate(-180deg); transform: rotate(-180deg);
} }
@ -232,7 +259,7 @@ const theme = ({ dt }) => `
transform: rotate(90deg); transform: rotate(90deg);
} }
.p-menubar-mobile .p-menubar-item-active > .p-menubar-item-content .p-menubar-submenu-icon { .p-menubar-mobile .p-menubar-item-active > .p-menubar-item-content .p-menubar-submenu-icon {
transform: rotate(-90deg); transform: rotate(-90deg);
} }
@ -241,8 +268,8 @@ const theme = ({ dt }) => `
position: static; position: static;
box-shadow: none; box-shadow: none;
border: 0 none; border: 0 none;
padding-left: ${dt('menubar.submenu.mobile.indent')}; padding-inline-start: ${dt('menubar.submenu.mobile.indent')};
padding-right: 0; padding-inline-end: 0;
} }
`; `;