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

Fixed #1500 - Tailwind theme

pull/1527/head
Cagatay Civici 2021-09-06 11:54:28 +03:00
parent de8194231a
commit 0804082e78
48 changed files with 5554 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
public/demo/images/themes/tailwind-light.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 3.5 KiB

3
public/themes/arya-blue/theme.css
View File

@ -3496,6 +3496,9 @@
outline-offset: 0;
box-shadow: 0 0 0 1px #93cbf9;
}
.p-fieldset.p-fieldset-toggleable .p-fieldset-legend a:hover {
color: rgba(255, 255, 255, 0.87);
}
.p-fieldset.p-fieldset-toggleable .p-fieldset-legend:hover {
background: rgba(255, 255, 255, 0.03);
border-color: #383838;

3
public/themes/arya-green/theme.css
View File

@ -3496,6 +3496,9 @@
outline-offset: 0;
box-shadow: 0 0 0 1px #a7d8a9;
}
.p-fieldset.p-fieldset-toggleable .p-fieldset-legend a:hover {
color: rgba(255, 255, 255, 0.87);
}
.p-fieldset.p-fieldset-toggleable .p-fieldset-legend:hover {
background: rgba(255, 255, 255, 0.03);
border-color: #383838;

3
public/themes/arya-orange/theme.css
View File

@ -3496,6 +3496,9 @@
outline-offset: 0;
box-shadow: 0 0 0 1px #ffe284;
}
.p-fieldset.p-fieldset-toggleable .p-fieldset-legend a:hover {
color: rgba(255, 255, 255, 0.87);
}
.p-fieldset.p-fieldset-toggleable .p-fieldset-legend:hover {
background: rgba(255, 255, 255, 0.03);
border-color: #383838;

3
public/themes/arya-purple/theme.css
View File

@ -3496,6 +3496,9 @@
outline-offset: 0;
box-shadow: 0 0 0 1px #cf95d9;
}
.p-fieldset.p-fieldset-toggleable .p-fieldset-legend a:hover {
color: rgba(255, 255, 255, 0.87);
}
.p-fieldset.p-fieldset-toggleable .p-fieldset-legend:hover {
background: rgba(255, 255, 255, 0.03);
border-color: #383838;

3
public/themes/bootstrap4-dark-blue/theme.css
View File

@ -3508,6 +3508,9 @@
outline-offset: 0;
box-shadow: 0 0 0 1px #e3f3fe;
}
.p-fieldset.p-fieldset-toggleable .p-fieldset-legend a:hover {
color: rgba(255, 255, 255, 0.87);
}
.p-fieldset.p-fieldset-toggleable .p-fieldset-legend:hover {
background: rgba(255, 255, 255, 0.04);
border-color: #3f4b5b;

3
public/themes/bootstrap4-dark-purple/theme.css
View File

@ -3508,6 +3508,9 @@
outline-offset: 0;
box-shadow: 0 0 0 1px #f0e6f5;
}
.p-fieldset.p-fieldset-toggleable .p-fieldset-legend a:hover {
color: rgba(255, 255, 255, 0.87);
}
.p-fieldset.p-fieldset-toggleable .p-fieldset-legend:hover {
background: rgba(255, 255, 255, 0.04);
border-color: #3f4b5b;

3
public/themes/bootstrap4-light-blue/theme.css
View File

@ -3508,6 +3508,9 @@
outline-offset: 0;
box-shadow: 0 0 0 0.2rem rgba(38, 143, 255, 0.5);
}
.p-fieldset.p-fieldset-toggleable .p-fieldset-legend a:hover {
color: #212529;
}
.p-fieldset.p-fieldset-toggleable .p-fieldset-legend:hover {
background: #e9ecef;
border-color: #dee2e6;

3
public/themes/bootstrap4-light-purple/theme.css
View File

@ -3508,6 +3508,9 @@
outline-offset: 0;
box-shadow: 0 0 0 0.2rem rgba(136, 60, 174, 0.5);
}
.p-fieldset.p-fieldset-toggleable .p-fieldset-legend a:hover {
color: #212529;
}
.p-fieldset.p-fieldset-toggleable .p-fieldset-legend:hover {
background: #e9ecef;
border-color: #dee2e6;

3
public/themes/fluent-light/theme.css
View File

@ -3471,6 +3471,9 @@
outline-offset: 0;
box-shadow: inset 0 0 0 1px #605e5c;
}
.p-fieldset.p-fieldset-toggleable .p-fieldset-legend a:hover {
color: #323130;
}
.p-fieldset.p-fieldset-toggleable .p-fieldset-legend:hover {
background: #f3f2f1;
border-color: #a19f9d;

3
public/themes/luna-amber/theme.css
View File

@ -3483,6 +3483,9 @@
outline-offset: 0;
box-shadow: 0 0 0 0.1rem white;
}
.p-fieldset.p-fieldset-toggleable .p-fieldset-legend a:hover {
color: #FFE082;
}
.p-fieldset.p-fieldset-toggleable .p-fieldset-legend:hover {
background: #191919;
border-color: #191919;

3
public/themes/luna-blue/theme.css
View File

@ -3483,6 +3483,9 @@
outline-offset: 0;
box-shadow: 0 0 0 0.1rem white;
}
.p-fieldset.p-fieldset-toggleable .p-fieldset-legend a:hover {
color: #81D4FA;
}
.p-fieldset.p-fieldset-toggleable .p-fieldset-legend:hover {
background: #191919;
border-color: #191919;

3
public/themes/luna-green/theme.css
View File

@ -3483,6 +3483,9 @@
outline-offset: 0;
box-shadow: 0 0 0 0.1rem white;
}
.p-fieldset.p-fieldset-toggleable .p-fieldset-legend a:hover {
color: #C5E1A5;
}
.p-fieldset.p-fieldset-toggleable .p-fieldset-legend:hover {
background: #191919;
border-color: #191919;

3
public/themes/luna-pink/theme.css
View File

@ -3483,6 +3483,9 @@
outline-offset: 0;
box-shadow: 0 0 0 0.1rem white;
}
.p-fieldset.p-fieldset-toggleable .p-fieldset-legend a:hover {
color: #F48FB1;
}
.p-fieldset.p-fieldset-toggleable .p-fieldset-legend:hover {
background: #191919;
border-color: #191919;

3
public/themes/md-dark-deeppurple/theme.css
View File

@ -3520,6 +3520,9 @@
outline-offset: 0;
box-shadow: none;
}
.p-fieldset.p-fieldset-toggleable .p-fieldset-legend a:hover {
color: rgba(255, 255, 255, 0.87);
}
.p-fieldset.p-fieldset-toggleable .p-fieldset-legend:hover {
background: rgba(255, 255, 255, 0.04);
border-color: rgba(255, 255, 255, 0.12);

3
public/themes/md-dark-indigo/theme.css
View File

@ -3520,6 +3520,9 @@
outline-offset: 0;
box-shadow: none;
}
.p-fieldset.p-fieldset-toggleable .p-fieldset-legend a:hover {
color: rgba(255, 255, 255, 0.87);
}
.p-fieldset.p-fieldset-toggleable .p-fieldset-legend:hover {
background: rgba(255, 255, 255, 0.04);
border-color: rgba(255, 255, 255, 0.12);

3
public/themes/md-light-deeppurple/theme.css
View File

@ -3520,6 +3520,9 @@
outline-offset: 0;
box-shadow: none;
}
.p-fieldset.p-fieldset-toggleable .p-fieldset-legend a:hover {
color: rgba(0, 0, 0, 0.87);
}
.p-fieldset.p-fieldset-toggleable .p-fieldset-legend:hover {
background: rgba(0, 0, 0, 0.04);
border-color: #e0e0e0;

3
public/themes/md-light-indigo/theme.css
View File

@ -3520,6 +3520,9 @@
outline-offset: 0;
box-shadow: none;
}
.p-fieldset.p-fieldset-toggleable .p-fieldset-legend a:hover {
color: rgba(0, 0, 0, 0.87);
}
.p-fieldset.p-fieldset-toggleable .p-fieldset-legend:hover {
background: rgba(0, 0, 0, 0.04);
border-color: #e0e0e0;

3
public/themes/mdc-dark-deeppurple/theme.css
View File

@ -3520,6 +3520,9 @@
outline-offset: 0;
box-shadow: none;
}
.p-fieldset.p-fieldset-toggleable .p-fieldset-legend a:hover {
color: rgba(255, 255, 255, 0.87);
}
.p-fieldset.p-fieldset-toggleable .p-fieldset-legend:hover {
background: rgba(255, 255, 255, 0.04);
border-color: rgba(255, 255, 255, 0.12);

3
public/themes/mdc-dark-indigo/theme.css
View File

@ -3520,6 +3520,9 @@
outline-offset: 0;
box-shadow: none;
}
.p-fieldset.p-fieldset-toggleable .p-fieldset-legend a:hover {
color: rgba(255, 255, 255, 0.87);
}
.p-fieldset.p-fieldset-toggleable .p-fieldset-legend:hover {
background: rgba(255, 255, 255, 0.04);
border-color: rgba(255, 255, 255, 0.12);

3
public/themes/mdc-light-deeppurple/theme.css
View File

@ -3520,6 +3520,9 @@
outline-offset: 0;
box-shadow: none;
}
.p-fieldset.p-fieldset-toggleable .p-fieldset-legend a:hover {
color: rgba(0, 0, 0, 0.87);
}
.p-fieldset.p-fieldset-toggleable .p-fieldset-legend:hover {
background: rgba(0, 0, 0, 0.04);
border-color: #e0e0e0;

3
public/themes/mdc-light-indigo/theme.css
View File

@ -3520,6 +3520,9 @@
outline-offset: 0;
box-shadow: none;
}
.p-fieldset.p-fieldset-toggleable .p-fieldset-legend a:hover {
color: rgba(0, 0, 0, 0.87);
}
.p-fieldset.p-fieldset-toggleable .p-fieldset-legend:hover {
background: rgba(0, 0, 0, 0.04);
border-color: #e0e0e0;

3
public/themes/nova-accent/theme.css
View File

@ -3471,6 +3471,9 @@
outline-offset: 0;
box-shadow: 0 0 0 0.2rem #8dcdff;
}
.p-fieldset.p-fieldset-toggleable .p-fieldset-legend a:hover {
color: #333333;
}
.p-fieldset.p-fieldset-toggleable .p-fieldset-legend:hover {
background: #dbdbdb;
border-color: #dbdbdb;

3
public/themes/nova-alt/theme.css
View File

@ -3483,6 +3483,9 @@
outline-offset: 0;
box-shadow: 0 0 0 0.2rem #8dcdff;
}
.p-fieldset.p-fieldset-toggleable .p-fieldset-legend a:hover {
color: #333333;
}
.p-fieldset.p-fieldset-toggleable .p-fieldset-legend:hover {
background: #dbdbdb;
border-color: #dbdbdb;

3
public/themes/nova-vue/theme.css
View File

@ -3483,6 +3483,9 @@
outline-offset: 0;
box-shadow: 0 0 0 0.2rem #c2e9d8;
}
.p-fieldset.p-fieldset-toggleable .p-fieldset-legend a:hover {
color: #333333;
}
.p-fieldset.p-fieldset-toggleable .p-fieldset-legend:hover {
background: #dbdbdb;
border-color: #dbdbdb;

3
public/themes/nova/theme.css
View File

@ -3483,6 +3483,9 @@
outline-offset: 0;
box-shadow: 0 0 0 0.2rem #8dcdff;
}
.p-fieldset.p-fieldset-toggleable .p-fieldset-legend a:hover {
color: #333333;
}
.p-fieldset.p-fieldset-toggleable .p-fieldset-legend:hover {
background: #dbdbdb;
border-color: #dbdbdb;

3
public/themes/rhea/theme.css
View File

@ -3471,6 +3471,9 @@
outline-offset: 0;
box-shadow: 0 0 0 0.2rem #e4e9ec;
}
.p-fieldset.p-fieldset-toggleable .p-fieldset-legend a:hover {
color: #ffffff;
}
.p-fieldset.p-fieldset-toggleable .p-fieldset-legend:hover {
background: #617c8a;
border-color: #617c8a;

3
public/themes/saga-blue/theme.css
View File

@ -3496,6 +3496,9 @@
outline-offset: 0;
box-shadow: 0 0 0 0.2rem #a6d5fa;
}
.p-fieldset.p-fieldset-toggleable .p-fieldset-legend a:hover {
color: #495057;
}
.p-fieldset.p-fieldset-toggleable .p-fieldset-legend:hover {
background: #e9ecef;
border-color: #dee2e6;

3
public/themes/saga-green/theme.css
View File

@ -3496,6 +3496,9 @@
outline-offset: 0;
box-shadow: 0 0 0 0.2rem #b7e0b8;
}
.p-fieldset.p-fieldset-toggleable .p-fieldset-legend a:hover {
color: #495057;
}
.p-fieldset.p-fieldset-toggleable .p-fieldset-legend:hover {
background: #e9ecef;
border-color: #dee2e6;

3
public/themes/saga-orange/theme.css
View File

@ -3496,6 +3496,9 @@
outline-offset: 0;
box-shadow: 0 0 0 0.2rem #ffe69c;
}
.p-fieldset.p-fieldset-toggleable .p-fieldset-legend a:hover {
color: #495057;
}
.p-fieldset.p-fieldset-toggleable .p-fieldset-legend:hover {
background: #e9ecef;
border-color: #dee2e6;

3
public/themes/saga-purple/theme.css
View File

@ -3496,6 +3496,9 @@
outline-offset: 0;
box-shadow: 0 0 0 0.2rem #df9eea;
}
.p-fieldset.p-fieldset-toggleable .p-fieldset-legend a:hover {
color: #495057;
}
.p-fieldset.p-fieldset-toggleable .p-fieldset-legend:hover {
background: #e9ecef;
border-color: #dee2e6;

BIN
public/themes/tailwind-light/fonts/Inter-Bold.woff Normal file
View File

Binary file not shown.

BIN
public/themes/tailwind-light/fonts/Inter-Bold.woff2 Normal file
View File

Binary file not shown.

BIN
public/themes/tailwind-light/fonts/Inter-Light.woff Normal file
View File

Binary file not shown.

BIN
public/themes/tailwind-light/fonts/Inter-Light.woff2 Normal file
View File

Binary file not shown.

BIN
public/themes/tailwind-light/fonts/Inter-Medium.woff Normal file
View File

Binary file not shown.

BIN
public/themes/tailwind-light/fonts/Inter-Medium.woff2 Normal file
View File

Binary file not shown.

BIN
public/themes/tailwind-light/fonts/Inter-Regular.woff Normal file
View File

Binary file not shown.

BIN
public/themes/tailwind-light/fonts/Inter-Regular.woff2 Normal file
View File

Binary file not shown.

BIN
public/themes/tailwind-light/fonts/Inter-SemiBold.woff Normal file
View File

Binary file not shown.

BIN
public/themes/tailwind-light/fonts/Inter-SemiBold.woff2 Normal file
View File

Binary file not shown.

5438
public/themes/tailwind-light/theme.css Normal file
View File

File diff suppressed because it is too large Load Diff

3
public/themes/vela-blue/theme.css
View File

@ -3496,6 +3496,9 @@
outline-offset: 0;
box-shadow: 0 0 0 1px #93cbf9;
}
.p-fieldset.p-fieldset-toggleable .p-fieldset-legend a:hover {
color: rgba(255, 255, 255, 0.87);
}
.p-fieldset.p-fieldset-toggleable .p-fieldset-legend:hover {
background: rgba(255, 255, 255, 0.03);
border-color: #304562;

3
public/themes/vela-green/theme.css
View File

@ -3496,6 +3496,9 @@
outline-offset: 0;
box-shadow: 0 0 0 1px #a7d8a9;
}
.p-fieldset.p-fieldset-toggleable .p-fieldset-legend a:hover {
color: rgba(255, 255, 255, 0.87);
}
.p-fieldset.p-fieldset-toggleable .p-fieldset-legend:hover {
background: rgba(255, 255, 255, 0.03);
border-color: #304562;

3
public/themes/vela-orange/theme.css
View File

@ -3496,6 +3496,9 @@
outline-offset: 0;
box-shadow: 0 0 0 1px #ffe284;
}
.p-fieldset.p-fieldset-toggleable .p-fieldset-legend a:hover {
color: rgba(255, 255, 255, 0.87);
}
.p-fieldset.p-fieldset-toggleable .p-fieldset-legend:hover {
background: rgba(255, 255, 255, 0.03);
border-color: #304562;

3
public/themes/vela-purple/theme.css
View File

@ -3496,6 +3496,9 @@
outline-offset: 0;
box-shadow: 0 0 0 1px #cf95d9;
}
.p-fieldset.p-fieldset-toggleable .p-fieldset-legend a:hover {
color: rgba(255, 255, 255, 0.87);
}
.p-fieldset.p-fieldset-toggleable .p-fieldset-legend:hover {
background: rgba(255, 255, 255, 0.03);
border-color: #304562;

12
src/AppConfigurator.vue
View File

@ -109,9 +109,19 @@
</div>
</div>
<h5>Tailwind</h5>
<div class="p-grid free-themes">
<div class="p-col-3">
<button class="p-link" type="button" @click="changeTheme($event, 'tailwind-light')">
<img src="demo/images/themes/tailwind-light.png" alt="Tailwind Light"/>
</button>
<span>Tailwind Light</span>
</div>
</div>
<h5>Fluent UI</h5>
<div class="p-grid free-themes">
<div class="p-col-3">
<div class="p-col-3">
<button class="p-link" type="button" @click="changeTheme($event, 'fluent-light')">
<img src="demo/images/themes/fluent-light.png" alt="Fluent Light"/>
</button>

3
src/AppTopBar.vue
View File

@ -42,6 +42,9 @@
<li><a @click="changeTheme($event, 'mdc-dark-indigo', true)"><img src="demo/images/themes/md-dark-indigo.svg" alt="Indigo Dark" /><span>Indigo Dark</span></a></li>
<li><a @click="changeTheme($event, 'mdc-dark-deeppurple', true)"><img src="demo/images/themes/md-dark-deeppurple.svg" alt="Deep Purple Dark" /><span>Deep Purple Dark</span></a></li>
<li class="topbar-submenu-header">TAILWIND</li>
<li><a @click="changeTheme($event, 'tailwind-light')"><img src="demo/images/themes/tailwind-light.png" alt="Tailwind Light" /><span>Tailwind Light</span></a></li>
<li class="topbar-submenu-header">FLUENT UI</li>
<li><a @click="changeTheme($event, 'fluent-light')"><img src="demo/images/themes/fluent-light.png" alt="Fluent Light" /><span>Fluent Light</span></a></li>