Skip to content

Commit

Permalink
Remove glow
Browse files Browse the repository at this point in the history
  • Loading branch information
@cetincakiroglu
cetincakiroglu committed Apr 29, 2024
1 parent 234744f commit 0475e48
Show file tree
Hide file tree
Showing 2 changed files with 53 additions and 18 deletions.
69 changes: 52 additions & 17 deletions src/assets/showcase/styles/layout/layout.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -107,22 +107,26 @@
}

.layout-light {
--primary-color-default:var(--primary-600);
--primary-color-inverse-default:var(--surface-0);
--topbar-sticky-bg:rgba(255,255,255,.7);
--card-border: 1px solid var(--surface-border);
--card-bg: var(--surface-card);
--glow-image: url(https://www.primefaces.org/cdn/primeng/images/layout/pattern.png), radial-gradient(50% 50% at center top, var(--primary-100) 0%, #ffffff 100%);
--glow-image: url(https://www.primefaces.org/cdn/primeng/images/layout/pattern.png);
--glow-blend: hard-light, multiply;
--topbar-border: rgba(0,0,0,.05);
--mobile-menu-bg: var(--surface-overlay);
--demo-code-bg: var(--surface-700);
--demo-code-bg: var(--surface-800);
--demo-code-button-color: var(--surface-300);
--demo-code-button-hover-bg: rgba(255,255,255,.1);
--demo-code-button-hover-color: var(--surface-100);
--doc-highlight-text-bg: var(--primary-100);
--doc-highlight-text-color: var(--primary-900);
--doc-highlight-text-bg: var(--surface-200);
--doc-highlight-text-color: var(--surface-700);
}

.layout-dark {
--primary-color-default:var(--primary-400);
--primary-color-inverse-default:var(--gray-900);
--topbar-sticky-bg:rgba(0,0,0,.3);
--card-border: 0 none;
--card-bg: var(--surface-card);
Expand All @@ -134,8 +138,8 @@
--demo-code-button-color: var(--surface-500);
--demo-code-button-hover-bg: rgba(255,255,255,.1);
--demo-code-button-hover-color: var(--surface-700);
--doc-highlight-text-bg: var(--highlight-bg);
--doc-highlight-text-color: var(--highlight-text-color);
--doc-highlight-text-bg: var(--surface-50);
--doc-highlight-text-color: var(--surface-500);
}

html {
Expand Down Expand Up @@ -350,6 +354,7 @@ button {
color: var(--surface-900);
font-weight: 600;
transition: all 0.2s;
position: relative;
border-radius: var(--border-radius);
}
.layout-sidebar .layout-menu > li > button .menu-icon,
Expand All @@ -363,6 +368,8 @@ button {
align-items: center;
justify-content: center;
transition: all 0.2s;
position: relative;
background-color: transparent;
}
.layout-sidebar .layout-menu > li > button .menu-icon i,
.layout-sidebar .layout-menu > li > a .menu-icon i {
Expand All @@ -374,21 +381,25 @@ button {
color: var(--surface-700);
margin-left: auto;
}
.layout-sidebar .layout-menu > li > button:hover .menu-icon,
.layout-sidebar .layout-menu > li > a:hover .menu-icon {
background-color: var(--surface-card);
}
.layout-sidebar .layout-menu > li > button:hover .menu-icon i,
.layout-sidebar .layout-menu > li > a:hover .menu-icon i {
color: var(--primary-color);
color: var(--primary-color-default);
}
.layout-sidebar .layout-menu > li > button:hover .menu-toggle-icon,
.layout-sidebar .layout-menu > li > a:hover .menu-toggle-icon {
color: var(--surface-900);
}
.layout-sidebar .layout-menu > li > button.router-link-active,
.layout-sidebar .layout-menu > li > a.router-link-active {
color: var(--primary-color);
color: var(--primary-color-default);
}
.layout-sidebar .layout-menu > li > button.router-link-active > .menu-icon i,
.layout-sidebar .layout-menu > li > a.router-link-active > .menu-icon i {
color: var(--primary-color);
color: var(--primary-color-default);
}
.layout-sidebar .layout-menu > li > button:focus-visible,
.layout-sidebar .layout-menu > li > a:focus-visible {
Expand All @@ -407,9 +418,11 @@ button {
transition: all 0.2s;
font-weight: 450;
display: flex;
align-items: center;
padding: 0.5rem 0.5rem 0.5rem 1rem;
color: var(--surface-700);
transition: all 0.2s;
position: relative;
}
.layout-sidebar .layout-menu > li > div ol li a:focus-visible {
outline: 0 none;
Expand All @@ -420,8 +433,8 @@ button {
border-left-color: var(--surface-500);
}
.layout-sidebar .layout-menu > li > div ol li a.router-link-active {
color: var(--primary-color);
border-left-color: var(--primary-color);
color: var(--primary-color-default);
border-left-color: var(--primary-color-default);
}
.layout-sidebar .layout-menu > li > div ol li ol {
margin: 0;
Expand All @@ -433,6 +446,15 @@ button {
.layout-sidebar .layout-menu > li > div ol li:has(.menu-child-category):first-child {
margin-top: 0rem;
}
.layout-sidebar .layout-menu .p-tag {
position: absolute;
right: 0;
top: 50%;
transform: translateY(-50%);
}
.layout-sidebar .layout-menu .p-tag .p-tag-value {
line-height: 1;
}
.layout-sidebar .layout-menu .menu-child-category {
display: flex;
padding: 0.5rem 0.5rem 0.5rem 0;
Expand Down Expand Up @@ -576,12 +598,12 @@ button {
padding: 0.5rem 1rem;
}
.layout-config .p-selectbutton .p-button:first-child {
border-top-left-radius: 30px;
border-bottom-left-radius: 30px;
border-top-left-radius: 6px;
border-bottom-left-radius: 6px;
}
.layout-config .p-selectbutton .p-button:last-child {
border-top-right-radius: 30px;
border-bottom-right-radius: 30px;
border-top-right-radius: 6px;
border-bottom-right-radius: 6px;
}
.layout-config button:focus-visible {
outline: 0 none;
Expand Down Expand Up @@ -1225,8 +1247,9 @@ pre[class*=language-] code {
max-width: 1728px;
margin: 0 auto;
}

.layout-topbar-inner,
.layout-footer {
.layout-footer {
max-width: 1728px;
margin: 0 auto;
}
Expand Down Expand Up @@ -1256,9 +1279,10 @@ pre[class*=language-] code {
height: 1rem;
}
.layout-topbar-inner .DocSearch-Button .DocSearch-Button-Placeholder,
.layout-topbar-inner .DocSearch-Button .DocSearch-Button-Keys {
.layout-topbar-inner .DocSearch-Button .DocSearch-Button-Keys {
display: none;
}

.layout-sidebar {
top: 0;
left: 0;
Expand All @@ -1278,9 +1302,11 @@ pre[class*=language-] code {
opacity: 1;
transform: translateX(0);
}

.layout-news-active .layout-sidebar {
top: 0;
}

.layout-mask {
background-color: rgba(0, 0, 0, 0.1);
}
Expand All @@ -1294,9 +1320,11 @@ pre[class*=language-] code {
background-color: rgba(0, 0, 0, 0.4);
transition: background-color 0.5s;
}

.doc-section-nav {
display: none;
}

.video-container {
position: relative;
width: 100%;
Expand All @@ -1310,14 +1338,17 @@ pre[class*=language-] code {
width: 100%;
height: 100%;
}

.layout-content {
padding-left: 2rem;
padding-right: 2rem;
}

.layout-footer {
padding-left: 2rem;
padding-right: 2rem;
}

.blocked-scroll {
overflow: hidden;
padding-right: var(--scrollbar-width);
Expand All @@ -1339,21 +1370,25 @@ pre[class*=language-] code {
.layout-topbar-inner .layout-topbar-icon {
display: inline-flex;
}

.layout-content {
padding-left: 1rem;
padding-right: 1rem;
}

.layout-footer {
padding-left: 1rem;
padding-right: 1rem;
}

.doc-tabmenu li {
flex: 1 1 0;
}
.doc-tabmenu li button {
width: 100%;
min-width: auto;
}

.layout-news {
padding-left: 1rem;
padding-right: 1rem;
Expand Down
2 changes: 1 addition & 1 deletion src/assets/showcase/styles/layout/variables/main/_light.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@
--topbar-sticky-bg:rgba(255,255,255,.7);
--card-border: 1px solid var(--surface-border);
--card-bg: var(--surface-card);
--glow-image: url(https://www.primefaces.org/cdn/primeng/images/layout/pattern.png), radial-gradient(50% 50% at center top, var(--primary-100) 0%, #ffffff 100%);
--glow-image: url(https://www.primefaces.org/cdn/primeng/images/layout/pattern.png);
--glow-blend: hard-light, multiply;
--topbar-border: rgba(0,0,0,.05);
--mobile-menu-bg: var(--surface-overlay);
Expand Down

0 comments on commit 0475e48

Please sign in to comment.