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

Updated glow and sync colors

pull/4666/head
Cagatay Civici 2023-10-19 22:09:48 +03:00
parent bcb78143c1
commit d19c26da7d
10 changed files with 17 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
assets/styles/layout/_code.scss
View File

@ -132,7 +132,6 @@ pre[class*="language-"] {
pre[class*="language-"] { pre[class*="language-"] {
code { code {
background: var(--demo-code-bg); background: var(--demo-code-bg);
transition: background-color .5s, border-color .5s;
} }
} }

1
assets/styles/layout/_content.scss
View File

@ -12,7 +12,6 @@
.card { .card {
background: var(--surface-card); background: var(--surface-card);
border: var(--card-border); border: var(--card-border);
transition: background-color .5s, border-color .5s;
padding: 2rem; padding: 2rem;
border-radius: 10px; border-radius: 10px;
margin-bottom: 1rem; margin-bottom: 1rem;

5
assets/styles/layout/_core.scss
View File

@ -12,7 +12,10 @@ body {
color: var(--text-color); color: var(--text-color);
-webkit-font-smoothing: antialiased; -webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale; -moz-osx-font-smoothing: grayscale;
transition: background-color .5s; }
.layout-wrapper {
background-color: var(--surface-ground);
} }
a { a {

2
assets/styles/layout/_doc.scss
View File

@ -82,7 +82,7 @@
opacity: 0.7; opacity: 0.7;
margin-left: 1rem; margin-left: 1rem;
display: none; display: none;
transition: opacity 0.3s, colors 0.3s; transition: opacity .3s, color .3s;
} }
&:hover { &:hover {

1
assets/styles/layout/_glow.scss
View File

@ -1,5 +1,6 @@
.landing, .layout-wrapper { .landing, .layout-wrapper {
background-image: var(--glow-image); background-image: var(--glow-image);
background-blend-mode: var(--glow-blend);
background-position: top center; background-position: top center;
background-repeat: no-repeat; background-repeat: no-repeat;
background-size: auto 20rem; background-size: auto 20rem;

5
assets/styles/layout/_topbar.scss
View File

@ -4,10 +4,11 @@
left: 0; left: 0;
width: calc(100% - var(--scrollbar-width, 0px)); width: calc(100% - var(--scrollbar-width, 0px));
z-index: 1100; z-index: 1100;
transition: background-color 1s; transition: background-color .5s, border-color .5s;
border-bottom: 1px solid var(--topbar-border); border-bottom: 1px solid transparent;
&.layout-topbar-sticky { &.layout-topbar-sticky {
border-bottom: 1px solid var(--surface-border);
background-color: var(--topbar-sticky-bg); background-color: var(--topbar-sticky-bg);
backdrop-filter: blur(8px); backdrop-filter: blur(8px);
} }

4
assets/styles/layout/landing/_main.scss
View File

@ -1,6 +1,5 @@
.landing { .landing {
background-color: var(--home-bg); background-color: var(--home-bg);
transition: background-color .5s;
scroll-behavior: smooth; scroll-behavior: smooth;
padding-top: 4rem; padding-top: 4rem;
@ -8,11 +7,10 @@
border: 1px solid var(--home-border-color); border: 1px solid var(--home-border-color);
border-radius: 10px; border-radius: 10px;
background-color: var(--home-box-bg); background-color: var(--home-box-bg);
transition: background-color .5s, border-color .5s;
} }
.linkbox { .linkbox {
transition: all 0.3s; transition: background-color .2s, border-color .2s;
display: inline-flex; display: inline-flex;
align-items: center; align-items: center;
color: var(--home-linkbox-text-color); color: var(--home-linkbox-text-color);

6
assets/styles/layout/variables/landing/_dark.scss
View File

@ -1,7 +1,7 @@
.landing.layout-dark { .landing.layout-dark {
--home-highlight-color:#10b981; --home-highlight-color:#6ee7b7;
--home-highlight-darker-color:#059669; --home-highlight-darker-color:#34d399;
--home-highlight-fore-color:#ffffff; --home-highlight-fore-color:#030712;
--home-bg:#111827; --home-bg:#111827;
--home-border-color:#424b57; --home-border-color:#424b57;
--home-primary-text-color:#ffffff; --home-primary-text-color:#ffffff;

3
assets/styles/layout/variables/main/_dark.scss
View File

@ -2,7 +2,8 @@
--topbar-sticky-bg:rgba(0,0,0,.3); --topbar-sticky-bg:rgba(0,0,0,.3);
--card-border: 0 none; --card-border: 0 none;
--card-bg: var(--surface-card); --card-bg: var(--surface-card);
--glow-image: url(https://www.primefaces.org/cdn/primevue/images/layout/top-pattern-light.png); --glow-image: url(https://www.primefaces.org/cdn/primevue/images/layout/pattern.png), radial-gradient(50% 50% at center -25px, var(--primary-color) 0%, #000000 100%);
--glow-blend: hard-light, color-dodge;
--topbar-border: var(--surface-border); --topbar-border: var(--surface-border);
--mobile-menu-bg: rgba(0,0,0,.3); --mobile-menu-bg: rgba(0,0,0,.3);
--demo-code-bg: var(--surface-card); --demo-code-bg: var(--surface-card);

3
assets/styles/layout/variables/main/_light.scss
View File

@ -2,7 +2,8 @@
--topbar-sticky-bg:rgba(255,255,255,.7); --topbar-sticky-bg:rgba(255,255,255,.7);
--card-border: 1px solid var(--surface-border); --card-border: 1px solid var(--surface-border);
--card-bg: var(--surface-card); --card-bg: var(--surface-card);
--glow-image: url(https://www.primefaces.org/cdn/primevue/images/layout/top-pattern-light.png); --glow-image: url(https://www.primefaces.org/cdn/primevue/images/layout/pattern.png), radial-gradient(50% 50% at center top, var(--primary-100) 0%, #ffffff 100%);
--glow-blend: hard-light, multiply;
--topbar-border: rgba(0,0,0,.05); --topbar-border: rgba(0,0,0,.05);
--mobile-menu-bg: var(--surface-overlay); --mobile-menu-bg: var(--surface-overlay);
--demo-code-bg: var(--surface-700); --demo-code-bg: var(--surface-700);