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

Refactor #6635

pull/6697/head
tugcekucukoglu 2024-10-31 20:24:54 +03:00
parent 4f9599791b
commit 19a5483eef
2 changed files with 15 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
apps/showcase/assets/styles/layout/_responsive.scss
View File

@ -48,7 +48,7 @@
.layout-sidebar { .layout-sidebar {
top: 0; top: 0;
left: 0; inset-inline-start: 0;
position: fixed; position: fixed;
z-index: 1102; z-index: 1102;
height: 100%; height: 100%;
@ -58,6 +58,10 @@
width: 300px; width: 300px;
opacity: 0; opacity: 0;
&:dir(rtl) {
transform: translateX(100%);
}
nav { nav {
padding: 1rem 1rem; padding: 1rem 1rem;
} }

19
apps/showcase/assets/styles/layout/_sidebar.scss
View File

@ -1,13 +1,13 @@
.layout-sidebar { .layout-sidebar {
position: sticky; position: sticky;
left: 0; inset-inline-start: 0;
top: 6rem; top: 6rem;
height: calc(100vh - 9rem); height: calc(100vh - 9rem);
user-select: none; user-select: none;
transition: transform .4s cubic-bezier(.05,.74,.2,.99), opacity .3s; transition: transform .4s cubic-bezier(.05,.74,.2,.99), opacity .3s;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
padding: 0 0 0 0; padding: 0;
flex: 0 0 250px; flex: 0 0 250px;
margin-inline-end: 4rem; margin-inline-end: 4rem;
overflow: auto; overflow: auto;
@ -18,8 +18,8 @@
} }
nav { nav {
padding: 0; padding-block: 0;
padding-inline-end: 1rem; padding-inline: 1rem 0;
margin: 0; margin: 0;
flex-grow: 1; flex-grow: 1;
} }
@ -37,7 +37,8 @@
display: flex; display: flex;
width: 100%; width: 100%;
align-items: center; align-items: center;
padding: .5rem 1px; padding-block: .5rem;
padding-inline: 1px;
color: var(--text-color); color: var(--text-color);
font-weight: 600; font-weight: 600;
transition: outline-color 0.2s; transition: outline-color 0.2s;
@ -47,7 +48,7 @@
font-size: 1rem; font-size: 1rem;
border: 0 none; border: 0 none;
margin: 0; margin: 0;
text-align: left; text-align: start;
cursor: pointer; cursor: pointer;
user-select: none; user-select: none;
--p-focus-ring-offset: -1px; --p-focus-ring-offset: -1px;
@ -106,8 +107,8 @@
overflow: hidden; overflow: hidden;
ol { ol {
margin: 0; margin-block: 0;
margin-inline-start: 1rem; margin-inline: 0 1rem;
padding: .25rem 0; padding: .25rem 0;
list-style: none; list-style: none;
@ -128,7 +129,7 @@
@include focus-visible(); @include focus-visible();
&:hover { &:hover {
border-left-color: var(--hover-border-color); border-inline-start-color: var(--hover-border-color);
} }
&.router-link-active { &.router-link-active {