Demo update

pull/358/head
cagataycivici 2020-06-26 18:58:49 +03:00
parent 97f4c43d53
commit 4c4f605d54
36 changed files with 174 additions and 101 deletions
public/themes
arya-blue
arya-green
arya-orange
arya-purple
luna-amber
luna-blue
luna-green
luna-pink
md-dark-deeppurple
md-dark-indigo
md-light-deeppurple
md-light-indigo
mdc-dark-deeppurple
mdc-dark-indigo
mdc-light-deeppurple
mdc-light-indigo
nova-accent
nova-alt
nova-vue
saga-blue
saga-green
saga-orange
vela-blue
vela-green
vela-orange
vela-purple

View File

@ -903,7 +903,7 @@
background: #1e1e1e;
color: rgba(255, 255, 255, 0.87);
border: 1px solid #383838;
box-shadow: 0px 11px 15px -7px rgba(0, 0, 0, 0.2), 0px 24px 38px 3px rgba(0, 0, 0, 0.14), 0px 9px 46px 8px rgba(0, 0, 0, 0.12);
box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.2), 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12);
border-radius: 3px;
}
.p-password-panel .p-password-meter {
@ -2780,7 +2780,7 @@
background: #383838;
color: rgba(255, 255, 255, 0.87);
padding: 0.5rem 0.5rem;
box-shadow: 0px 11px 15px -7px rgba(0, 0, 0, 0.2), 0px 24px 38px 3px rgba(0, 0, 0, 0.14), 0px 9px 46px 8px rgba(0, 0, 0, 0.12);
box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.2), 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12);
border-radius: 3px;
}
.p-tooltip.p-tooltip-right .p-tooltip-arrow {

View File

@ -903,7 +903,7 @@
background: #1e1e1e;
color: rgba(255, 255, 255, 0.87);
border: 1px solid #383838;
box-shadow: 0px 11px 15px -7px rgba(0, 0, 0, 0.2), 0px 24px 38px 3px rgba(0, 0, 0, 0.14), 0px 9px 46px 8px rgba(0, 0, 0, 0.12);
box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.2), 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12);
border-radius: 3px;
}
.p-password-panel .p-password-meter {
@ -2780,7 +2780,7 @@
background: #383838;
color: rgba(255, 255, 255, 0.87);
padding: 0.5rem 0.5rem;
box-shadow: 0px 11px 15px -7px rgba(0, 0, 0, 0.2), 0px 24px 38px 3px rgba(0, 0, 0, 0.14), 0px 9px 46px 8px rgba(0, 0, 0, 0.12);
box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.2), 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12);
border-radius: 3px;
}
.p-tooltip.p-tooltip-right .p-tooltip-arrow {

View File

@ -903,7 +903,7 @@
background: #1e1e1e;
color: rgba(255, 255, 255, 0.87);
border: 1px solid #383838;
box-shadow: 0px 11px 15px -7px rgba(0, 0, 0, 0.2), 0px 24px 38px 3px rgba(0, 0, 0, 0.14), 0px 9px 46px 8px rgba(0, 0, 0, 0.12);
box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.2), 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12);
border-radius: 3px;
}
.p-password-panel .p-password-meter {
@ -2780,7 +2780,7 @@
background: #383838;
color: rgba(255, 255, 255, 0.87);
padding: 0.5rem 0.5rem;
box-shadow: 0px 11px 15px -7px rgba(0, 0, 0, 0.2), 0px 24px 38px 3px rgba(0, 0, 0, 0.14), 0px 9px 46px 8px rgba(0, 0, 0, 0.12);
box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.2), 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12);
border-radius: 3px;
}
.p-tooltip.p-tooltip-right .p-tooltip-arrow {

View File

@ -903,7 +903,7 @@
background: #1e1e1e;
color: rgba(255, 255, 255, 0.87);
border: 1px solid #383838;
box-shadow: 0px 11px 15px -7px rgba(0, 0, 0, 0.2), 0px 24px 38px 3px rgba(0, 0, 0, 0.14), 0px 9px 46px 8px rgba(0, 0, 0, 0.12);
box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.2), 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12);
border-radius: 3px;
}
.p-password-panel .p-password-meter {
@ -2780,7 +2780,7 @@
background: #383838;
color: rgba(255, 255, 255, 0.87);
padding: 0.5rem 0.5rem;
box-shadow: 0px 11px 15px -7px rgba(0, 0, 0, 0.2), 0px 24px 38px 3px rgba(0, 0, 0, 0.14), 0px 9px 46px 8px rgba(0, 0, 0, 0.12);
box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.2), 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12);
border-radius: 3px;
}
.p-tooltip.p-tooltip-right .p-tooltip-arrow {

View File

@ -903,7 +903,7 @@
background: #323232;
color: #dedede;
border: 1px solid #191919;
box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.16);
box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.16);
border-radius: 3px;
}
.p-password-panel .p-password-meter {
@ -2763,7 +2763,7 @@
background: #4c4c4c;
color: #dedede;
padding: 0.429rem 0.429rem;
box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.16);
box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.16);
border-radius: 3px;
}
.p-tooltip.p-tooltip-right .p-tooltip-arrow {

View File

@ -903,7 +903,7 @@
background: #323232;
color: #dedede;
border: 1px solid #191919;
box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.16);
box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.16);
border-radius: 3px;
}
.p-password-panel .p-password-meter {
@ -2763,7 +2763,7 @@
background: #4c4c4c;
color: #dedede;
padding: 0.429rem 0.429rem;
box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.16);
box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.16);
border-radius: 3px;
}
.p-tooltip.p-tooltip-right .p-tooltip-arrow {

View File

@ -903,7 +903,7 @@
background: #323232;
color: #dedede;
border: 1px solid #191919;
box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.16);
box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.16);
border-radius: 3px;
}
.p-password-panel .p-password-meter {
@ -2763,7 +2763,7 @@
background: #4c4c4c;
color: #dedede;
padding: 0.429rem 0.429rem;
box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.16);
box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.16);
border-radius: 3px;
}
.p-tooltip.p-tooltip-right .p-tooltip-arrow {

View File

@ -903,7 +903,7 @@
background: #323232;
color: #dedede;
border: 1px solid #191919;
box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.16);
box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.16);
border-radius: 3px;
}
.p-password-panel .p-password-meter {
@ -2763,7 +2763,7 @@
background: #4c4c4c;
color: #dedede;
padding: 0.429rem 0.429rem;
box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.16);
box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.16);
border-radius: 3px;
}
.p-tooltip.p-tooltip-right .p-tooltip-arrow {

View File

@ -923,7 +923,7 @@
background: #1e1e1e;
color: rgba(255, 255, 255, 0.87);
border: 0 none;
box-shadow: 0 11px 15px -7px rgba(0, 0, 0, 0.2), 0 24px 38px 3px rgba(0, 0, 0, 0.14), 0 9px 46px 8px rgba(0, 0, 0, 0.12);
box-shadow: 0 5px 5px -3px rgba(0, 0, 0, 0.2), 0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12);
border-radius: 4px;
}
.p-password-panel .p-password-meter {
@ -2796,7 +2796,7 @@
background: #444444;
color: rgba(255, 255, 255, 0.87);
padding: 0.5rem;
box-shadow: 0 11px 15px -7px rgba(0, 0, 0, 0.2), 0 24px 38px 3px rgba(0, 0, 0, 0.14), 0 9px 46px 8px rgba(0, 0, 0, 0.12);
box-shadow: 0 5px 5px -3px rgba(0, 0, 0, 0.2), 0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12);
border-radius: 4px;
}
.p-tooltip.p-tooltip-right .p-tooltip-arrow {
@ -4754,7 +4754,7 @@
.p-tooltip .p-tooltip-text {
box-shadow: none;
font-size: 0.714rem;
font-size: 0.875rem;
}
.p-tooltip .p-tooltip-arrow {
display: none;

View File

@ -923,7 +923,7 @@
background: #1e1e1e;
color: rgba(255, 255, 255, 0.87);
border: 0 none;
box-shadow: 0 11px 15px -7px rgba(0, 0, 0, 0.2), 0 24px 38px 3px rgba(0, 0, 0, 0.14), 0 9px 46px 8px rgba(0, 0, 0, 0.12);
box-shadow: 0 5px 5px -3px rgba(0, 0, 0, 0.2), 0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12);
border-radius: 4px;
}
.p-password-panel .p-password-meter {
@ -2796,7 +2796,7 @@
background: #444444;
color: rgba(255, 255, 255, 0.87);
padding: 0.5rem;
box-shadow: 0 11px 15px -7px rgba(0, 0, 0, 0.2), 0 24px 38px 3px rgba(0, 0, 0, 0.14), 0 9px 46px 8px rgba(0, 0, 0, 0.12);
box-shadow: 0 5px 5px -3px rgba(0, 0, 0, 0.2), 0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12);
border-radius: 4px;
}
.p-tooltip.p-tooltip-right .p-tooltip-arrow {
@ -4754,7 +4754,7 @@
.p-tooltip .p-tooltip-text {
box-shadow: none;
font-size: 0.714rem;
font-size: 0.875rem;
}
.p-tooltip .p-tooltip-arrow {
display: none;

View File

@ -923,7 +923,7 @@
background: #ffffff;
color: #000001;
border: 0 none;
box-shadow: 0 11px 15px -7px rgba(0, 0, 0, 0.2), 0 24px 38px 3px rgba(0, 0, 0, 0.14), 0 9px 46px 8px rgba(0, 0, 0, 0.12);
box-shadow: 0 5px 5px -3px rgba(0, 0, 0, 0.2), 0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12);
border-radius: 4px;
}
.p-password-panel .p-password-meter {
@ -2796,7 +2796,7 @@
background: rgba(97, 97, 97, 0.9);
color: #ffffff;
padding: 0.5rem;
box-shadow: 0 11px 15px -7px rgba(0, 0, 0, 0.2), 0 24px 38px 3px rgba(0, 0, 0, 0.14), 0 9px 46px 8px rgba(0, 0, 0, 0.12);
box-shadow: 0 5px 5px -3px rgba(0, 0, 0, 0.2), 0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12);
border-radius: 4px;
}
.p-tooltip.p-tooltip-right .p-tooltip-arrow {
@ -4754,7 +4754,7 @@
.p-tooltip .p-tooltip-text {
box-shadow: none;
font-size: 0.714rem;
font-size: 0.875rem;
}
.p-tooltip .p-tooltip-arrow {
display: none;

View File

@ -923,7 +923,7 @@
background: #ffffff;
color: #000001;
border: 0 none;
box-shadow: 0 11px 15px -7px rgba(0, 0, 0, 0.2), 0 24px 38px 3px rgba(0, 0, 0, 0.14), 0 9px 46px 8px rgba(0, 0, 0, 0.12);
box-shadow: 0 5px 5px -3px rgba(0, 0, 0, 0.2), 0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12);
border-radius: 4px;
}
.p-password-panel .p-password-meter {
@ -2796,7 +2796,7 @@
background: rgba(97, 97, 97, 0.9);
color: #ffffff;
padding: 0.5rem;
box-shadow: 0 11px 15px -7px rgba(0, 0, 0, 0.2), 0 24px 38px 3px rgba(0, 0, 0, 0.14), 0 9px 46px 8px rgba(0, 0, 0, 0.12);
box-shadow: 0 5px 5px -3px rgba(0, 0, 0, 0.2), 0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12);
border-radius: 4px;
}
.p-tooltip.p-tooltip-right .p-tooltip-arrow {
@ -4754,7 +4754,7 @@
.p-tooltip .p-tooltip-text {
box-shadow: none;
font-size: 0.714rem;
font-size: 0.875rem;
}
.p-tooltip .p-tooltip-arrow {
display: none;

View File

@ -923,7 +923,7 @@
background: #1e1e1e;
color: rgba(255, 255, 255, 0.87);
border: 0 none;
box-shadow: 0 11px 15px -7px rgba(0, 0, 0, 0.2), 0 24px 38px 3px rgba(0, 0, 0, 0.14), 0 9px 46px 8px rgba(0, 0, 0, 0.12);
box-shadow: 0 5px 5px -3px rgba(0, 0, 0, 0.2), 0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12);
border-radius: 4px;
}
.p-password-panel .p-password-meter {
@ -2796,7 +2796,7 @@
background: #444444;
color: rgba(255, 255, 255, 0.87);
padding: 0.5rem;
box-shadow: 0 11px 15px -7px rgba(0, 0, 0, 0.2), 0 24px 38px 3px rgba(0, 0, 0, 0.14), 0 9px 46px 8px rgba(0, 0, 0, 0.12);
box-shadow: 0 5px 5px -3px rgba(0, 0, 0, 0.2), 0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12);
border-radius: 4px;
}
.p-tooltip.p-tooltip-right .p-tooltip-arrow {
@ -4754,7 +4754,7 @@
.p-tooltip .p-tooltip-text {
box-shadow: none;
font-size: 0.714rem;
font-size: 0.875rem;
}
.p-tooltip .p-tooltip-arrow {
display: none;

View File

@ -923,7 +923,7 @@
background: #1e1e1e;
color: rgba(255, 255, 255, 0.87);
border: 0 none;
box-shadow: 0 11px 15px -7px rgba(0, 0, 0, 0.2), 0 24px 38px 3px rgba(0, 0, 0, 0.14), 0 9px 46px 8px rgba(0, 0, 0, 0.12);
box-shadow: 0 5px 5px -3px rgba(0, 0, 0, 0.2), 0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12);
border-radius: 4px;
}
.p-password-panel .p-password-meter {
@ -2796,7 +2796,7 @@
background: #444444;
color: rgba(255, 255, 255, 0.87);
padding: 0.5rem;
box-shadow: 0 11px 15px -7px rgba(0, 0, 0, 0.2), 0 24px 38px 3px rgba(0, 0, 0, 0.14), 0 9px 46px 8px rgba(0, 0, 0, 0.12);
box-shadow: 0 5px 5px -3px rgba(0, 0, 0, 0.2), 0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12);
border-radius: 4px;
}
.p-tooltip.p-tooltip-right .p-tooltip-arrow {
@ -4754,7 +4754,7 @@
.p-tooltip .p-tooltip-text {
box-shadow: none;
font-size: 0.714rem;
font-size: 0.875rem;
}
.p-tooltip .p-tooltip-arrow {
display: none;

View File

@ -923,7 +923,7 @@
background: #ffffff;
color: #000001;
border: 0 none;
box-shadow: 0 11px 15px -7px rgba(0, 0, 0, 0.2), 0 24px 38px 3px rgba(0, 0, 0, 0.14), 0 9px 46px 8px rgba(0, 0, 0, 0.12);
box-shadow: 0 5px 5px -3px rgba(0, 0, 0, 0.2), 0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12);
border-radius: 4px;
}
.p-password-panel .p-password-meter {
@ -2796,7 +2796,7 @@
background: rgba(97, 97, 97, 0.9);
color: #ffffff;
padding: 0.5rem;
box-shadow: 0 11px 15px -7px rgba(0, 0, 0, 0.2), 0 24px 38px 3px rgba(0, 0, 0, 0.14), 0 9px 46px 8px rgba(0, 0, 0, 0.12);
box-shadow: 0 5px 5px -3px rgba(0, 0, 0, 0.2), 0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12);
border-radius: 4px;
}
.p-tooltip.p-tooltip-right .p-tooltip-arrow {
@ -4754,7 +4754,7 @@
.p-tooltip .p-tooltip-text {
box-shadow: none;
font-size: 0.714rem;
font-size: 0.875rem;
}
.p-tooltip .p-tooltip-arrow {
display: none;

View File

@ -923,7 +923,7 @@
background: #ffffff;
color: #000001;
border: 0 none;
box-shadow: 0 11px 15px -7px rgba(0, 0, 0, 0.2), 0 24px 38px 3px rgba(0, 0, 0, 0.14), 0 9px 46px 8px rgba(0, 0, 0, 0.12);
box-shadow: 0 5px 5px -3px rgba(0, 0, 0, 0.2), 0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12);
border-radius: 4px;
}
.p-password-panel .p-password-meter {
@ -2796,7 +2796,7 @@
background: rgba(97, 97, 97, 0.9);
color: #ffffff;
padding: 0.5rem;
box-shadow: 0 11px 15px -7px rgba(0, 0, 0, 0.2), 0 24px 38px 3px rgba(0, 0, 0, 0.14), 0 9px 46px 8px rgba(0, 0, 0, 0.12);
box-shadow: 0 5px 5px -3px rgba(0, 0, 0, 0.2), 0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12);
border-radius: 4px;
}
.p-tooltip.p-tooltip-right .p-tooltip-arrow {
@ -4754,7 +4754,7 @@
.p-tooltip .p-tooltip-text {
box-shadow: none;
font-size: 0.714rem;
font-size: 0.875rem;
}
.p-tooltip .p-tooltip-arrow {
display: none;

View File

@ -899,7 +899,7 @@
background: #ffffff;
color: #333333;
border: 1px solid #c8c8c8;
box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.16);
box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.16);
border-radius: 3px;
}
.p-password-panel .p-password-meter {
@ -2755,7 +2755,7 @@
background: #333333;
color: #ffffff;
padding: 0.429rem 0.429rem;
box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.16);
box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.16);
border-radius: 3px;
}
.p-tooltip.p-tooltip-right .p-tooltip-arrow {

View File

@ -903,7 +903,7 @@
background: #ffffff;
color: #333333;
border: 1px solid #c8c8c8;
box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.16);
box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.16);
border-radius: 3px;
}
.p-password-panel .p-password-meter {
@ -2763,7 +2763,7 @@
background: #333333;
color: #ffffff;
padding: 0.429rem 0.429rem;
box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.16);
box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.16);
border-radius: 3px;
}
.p-tooltip.p-tooltip-right .p-tooltip-arrow {

View File

@ -903,7 +903,7 @@
background: #ffffff;
color: #333333;
border: 1px solid #c8c8c8;
box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.16);
box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.16);
border-radius: 3px;
}
.p-password-panel .p-password-meter {
@ -2763,7 +2763,7 @@
background: #333333;
color: #ffffff;
padding: 0.429rem 0.429rem;
box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.16);
box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.16);
border-radius: 3px;
}
.p-tooltip.p-tooltip-right .p-tooltip-arrow {

View File

@ -903,7 +903,7 @@
background: #ffffff;
color: #333333;
border: 1px solid #c8c8c8;
box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.16);
box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.16);
border-radius: 3px;
}
.p-password-panel .p-password-meter {
@ -2763,7 +2763,7 @@
background: #333333;
color: #ffffff;
padding: 0.429rem 0.429rem;
box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.16);
box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.16);
border-radius: 3px;
}
.p-tooltip.p-tooltip-right .p-tooltip-arrow {

View File

@ -903,7 +903,7 @@
background: #ffffff;
color: #495057;
border: 0 none;
box-shadow: 0px 11px 15px -7px rgba(0, 0, 0, 0.2), 0px 24px 38px 3px rgba(0, 0, 0, 0.14), 0px 9px 46px 8px rgba(0, 0, 0, 0.12);
box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.2), 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12);
border-radius: 3px;
}
.p-password-panel .p-password-meter {
@ -2780,7 +2780,7 @@
background: #495057;
color: #ffffff;
padding: 0.5rem 0.5rem;
box-shadow: 0px 11px 15px -7px rgba(0, 0, 0, 0.2), 0px 24px 38px 3px rgba(0, 0, 0, 0.14), 0px 9px 46px 8px rgba(0, 0, 0, 0.12);
box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.2), 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12);
border-radius: 3px;
}
.p-tooltip.p-tooltip-right .p-tooltip-arrow {

View File

@ -903,7 +903,7 @@
background: #ffffff;
color: #495057;
border: 0 none;
box-shadow: 0px 11px 15px -7px rgba(0, 0, 0, 0.2), 0px 24px 38px 3px rgba(0, 0, 0, 0.14), 0px 9px 46px 8px rgba(0, 0, 0, 0.12);
box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.2), 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12);
border-radius: 3px;
}
.p-password-panel .p-password-meter {
@ -2780,7 +2780,7 @@
background: #495057;
color: #ffffff;
padding: 0.5rem 0.5rem;
box-shadow: 0px 11px 15px -7px rgba(0, 0, 0, 0.2), 0px 24px 38px 3px rgba(0, 0, 0, 0.14), 0px 9px 46px 8px rgba(0, 0, 0, 0.12);
box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.2), 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12);
border-radius: 3px;
}
.p-tooltip.p-tooltip-right .p-tooltip-arrow {

View File

@ -903,7 +903,7 @@
background: #ffffff;
color: #495057;
border: 0 none;
box-shadow: 0px 11px 15px -7px rgba(0, 0, 0, 0.2), 0px 24px 38px 3px rgba(0, 0, 0, 0.14), 0px 9px 46px 8px rgba(0, 0, 0, 0.12);
box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.2), 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12);
border-radius: 3px;
}
.p-password-panel .p-password-meter {
@ -2780,7 +2780,7 @@
background: #495057;
color: #ffffff;
padding: 0.5rem 0.5rem;
box-shadow: 0px 11px 15px -7px rgba(0, 0, 0, 0.2), 0px 24px 38px 3px rgba(0, 0, 0, 0.14), 0px 9px 46px 8px rgba(0, 0, 0, 0.12);
box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.2), 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12);
border-radius: 3px;
}
.p-tooltip.p-tooltip-right .p-tooltip-arrow {

View File

@ -902,7 +902,7 @@
background: #1f2d40;
color: rgba(255, 255, 255, 0.87);
border: 1px solid #304562;
box-shadow: 0px 11px 15px -7px rgba(0, 0, 0, 0.2), 0px 24px 38px 3px rgba(0, 0, 0, 0.14), 0px 9px 46px 8px rgba(0, 0, 0, 0.12);
box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.2), 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12);
border-radius: 3px;
}
.p-password-panel .p-password-meter {
@ -2779,7 +2779,7 @@
background: #304562;
color: rgba(255, 255, 255, 0.87);
padding: 0.5rem 0.5rem;
box-shadow: 0px 11px 15px -7px rgba(0, 0, 0, 0.2), 0px 24px 38px 3px rgba(0, 0, 0, 0.14), 0px 9px 46px 8px rgba(0, 0, 0, 0.12);
box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.2), 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12);
border-radius: 3px;
}
.p-tooltip.p-tooltip-right .p-tooltip-arrow {

View File

@ -902,7 +902,7 @@
background: #1f2d40;
color: rgba(255, 255, 255, 0.87);
border: 1px solid #304562;
box-shadow: 0px 11px 15px -7px rgba(0, 0, 0, 0.2), 0px 24px 38px 3px rgba(0, 0, 0, 0.14), 0px 9px 46px 8px rgba(0, 0, 0, 0.12);
box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.2), 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12);
border-radius: 3px;
}
.p-password-panel .p-password-meter {
@ -2779,7 +2779,7 @@
background: #304562;
color: rgba(255, 255, 255, 0.87);
padding: 0.5rem 0.5rem;
box-shadow: 0px 11px 15px -7px rgba(0, 0, 0, 0.2), 0px 24px 38px 3px rgba(0, 0, 0, 0.14), 0px 9px 46px 8px rgba(0, 0, 0, 0.12);
box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.2), 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12);
border-radius: 3px;
}
.p-tooltip.p-tooltip-right .p-tooltip-arrow {

View File

@ -902,7 +902,7 @@
background: #1f2d40;
color: rgba(255, 255, 255, 0.87);
border: 1px solid #304562;
box-shadow: 0px 11px 15px -7px rgba(0, 0, 0, 0.2), 0px 24px 38px 3px rgba(0, 0, 0, 0.14), 0px 9px 46px 8px rgba(0, 0, 0, 0.12);
box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.2), 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12);
border-radius: 3px;
}
.p-password-panel .p-password-meter {
@ -2779,7 +2779,7 @@
background: #304562;
color: rgba(255, 255, 255, 0.87);
padding: 0.5rem 0.5rem;
box-shadow: 0px 11px 15px -7px rgba(0, 0, 0, 0.2), 0px 24px 38px 3px rgba(0, 0, 0, 0.14), 0px 9px 46px 8px rgba(0, 0, 0, 0.12);
box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.2), 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12);
border-radius: 3px;
}
.p-tooltip.p-tooltip-right .p-tooltip-arrow {

View File

@ -902,7 +902,7 @@
background: #1f2d40;
color: rgba(255, 255, 255, 0.87);
border: 1px solid #304562;
box-shadow: 0px 11px 15px -7px rgba(0, 0, 0, 0.2), 0px 24px 38px 3px rgba(0, 0, 0, 0.14), 0px 9px 46px 8px rgba(0, 0, 0, 0.12);
box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.2), 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12);
border-radius: 3px;
}
.p-password-panel .p-password-meter {
@ -2779,7 +2779,7 @@
background: #304562;
color: rgba(255, 255, 255, 0.87);
padding: 0.5rem 0.5rem;
box-shadow: 0px 11px 15px -7px rgba(0, 0, 0, 0.2), 0px 24px 38px 3px rgba(0, 0, 0, 0.14), 0px 9px 46px 8px rgba(0, 0, 0, 0.12);
box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.2), 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12);
border-radius: 3px;
}
.p-tooltip.p-tooltip-right .p-tooltip-arrow {

View File

@ -18,6 +18,9 @@
<router-view/>
<app-footer />
</div>
<div class="app-theme">
<img :src="getLogo()" />
</div>
<Toast />
<Toast position="topleft" group="tl" />
<Toast position="bottomleft" group="bl" />
@ -37,9 +40,46 @@ export default {
return {
sidebarActive: false,
newsActive: false,
theme: 'saga-blue'
theme: 'saga-blue',
logoMap: {
'bootstrap4-light-blue': 'bootstrap4-light-blue.svg',
'bootstrap4-light-purple': 'bootstrap4-light-purple.svg',
'bootstrap4-dark-blue': 'bootstrap4-dark-blue.svg',
'bootstrap4-dark-purple': 'bootstrap4-dark-purple.svg',
'bootstrap4-dark-purple': 'bootstrap4-dark-purple.svg',
'md-light-indigo': 'md-light-indigo.svg',
'md-light-purple': 'md-light-purple.svg',
'md-dark-indigo': 'md-dark-indigo.svg',
'md-dark-indigo': 'md-dark-purple.svg',
'mdc-light-indigo': 'md-light-indigo.svg',
'mdc-light-purple': 'md-light-purple.svg',
'mdc-dark-indigo': 'md-dark-indigo.svg',
'mdc-dark-indigo': 'md-dark-purple.svg',
'saga-blue': 'saga-blue.png',
'saga-green': 'saga-green.png',
'saga-orange': 'saga-orange.png',
'saga-purple': 'saga-purple.png',
'vela-blue': 'vela-blue.png',
'vela-green': 'vela-green.png',
'vela-orange': 'vela-orange.png',
'vela-purple': 'vela-purple.png',
'arya-blue': 'arya-blue.png',
'arya-green': 'arya-green.png',
'arya-orange': 'arya-orange.png',
'arya-purple': 'arya-purple.png',
'nova': 'themeswitcher-nova.png',
'nova-alt': 'themeswitcher-nova-alt.png',
'nova-accent': 'themeswitcher-nova-accent.png',
'nova-vue': 'themeswitcher-nova-vue.png',
'luna-blue': 'themeswitcher-luna-blue.png',
'luna-green': 'themeswitcher-luna-green.png',
'luna-pink': 'themeswitcher-luna-pink.png',
'luna-amber': 'themeswitcher-luna-amber.png',
'rhea': 'themeswitcher-rhea.png'
}
}
},
mounted() {
if (this.isOutdatedIE()) {
this.$toast.add({severity: 'warn', summary: 'Limited Functionality', detail: 'Although PrimeVue supports IE11, ThemeSwitcher in this application cannot be not fully supported by your browser. Please use a modern browser for the best experience of the showcase.'});
@ -112,7 +152,11 @@ export default {
}
return false;
}
},
getLogo() {
var images = require.context('./assets/images/themes', false);
return images('./' + this.logoMap[this.theme]);
},
},
computed: {
containerClass() {

View File

@ -21,7 +21,7 @@
<li><a @click="changeTheme($event, 'bootstrap4-light-purple')"><img src="./assets/images/themes/bootstrap4-light-purple.svg" alt="Purple Light" /><span>Purple Light</span></a></li>
<li><a @click="changeTheme($event, 'bootstrap4-dark-blue')"><img src="./assets/images/themes/bootstrap4-dark-blue.svg" alt="Blue Dark" /><span>Blue Dark</span></a></li>
<li><a @click="changeTheme($event, 'bootstrap4-dark-purple')"><img src="./assets/images/themes/bootstrap4-dark-purple.svg" alt="Purple Dark" /><span>Purple Dark</span></a></li>
<li class="topbar-submenu-header">MATERIAL DESIGN</li>
<li><a @click="changeTheme($event, 'md-light-indigo')"><img src="./assets/images/themes/md-light-indigo.svg" alt="Indigo Light" /><span>Indigo Light</span></a></li>
<li><a @click="changeTheme($event, 'md-light-deeppurple')"><img src="./assets/images/themes/md-light-deeppurple.svg" alt="Deep Purple Light" /><span>Deep Purple Light</span></a></li>
@ -33,7 +33,7 @@
<li><a @click="changeTheme($event, 'mdc-light-deeppurple')"><img src="./assets/images/themes/md-light-deeppurple.svg" alt="Deep Purple Light" /><span>Deep Purple Light</span></a></li>
<li><a @click="changeTheme($event, 'mdc-dark-indigo')"><img src="./assets/images/themes/md-dark-indigo.svg" alt="Indigo Dark" /><span>Indigo Dark</span></a></li>
<li><a @click="changeTheme($event, 'mdc-dark-deeppurple')"><img src="./assets/images/themes/md-dark-deeppurple.svg" alt="Deep Purple Dark" /><span>Deep Purple Dark</span></a></li>
<li class="topbar-submenu-header">PRIMEONE</li>
<li><a @click="changeTheme($event, 'saga-blue')"><img src="./assets/images/themes/saga-blue.png" alt="Saga Blue" /><span>Saga Blue</span></a></li>
<li><a @click="changeTheme($event, 'saga-green')"><img src="./assets/images/themes/saga-green.png" alt="Saga Green" /><span>Saga Green</span></a></li>

View File

@ -204,4 +204,22 @@ h6 {
p {
line-height: 1.5;
margin: 0 0 1rem 0;
}
.app-theme {
background-color: var(--primary-color);
color: var(--primary-color-text);
position: fixed;
left: 285px;
top: 15px;
padding: .5rem;
z-index: 2000;
border-radius: 4px;
box-shadow: 0 2px 4px -1px rgba(0,0,0,.2), 0 4px 5px 0 rgba(0,0,0,.14), 0 1px 10px 0 rgba(0,0,0,.12);
width: 39px;
height: 39px;
img {
width: 25px;
}
}

View File

@ -136,6 +136,11 @@
transform: translate3d(0,0,0);
}
}
.app-theme {
right: 35px;
left: auto;
}
}
@media screen and (max-width: 640px) {

View File

@ -90,6 +90,7 @@
> ul {
position: absolute;
transform-origin: top;
top: 70px;
right: 0;
width: 275px;

View File

@ -7,5 +7,4 @@
@import './config';
@import './designer';
@import './home';
@import './responsive';
@import './core';
@import './responsive';

View File

@ -89,34 +89,40 @@ button {
user-select: none;
}
/* Overlay Animations */
/* Non vue overlay animations */
.p-input-overlay {
transform: translateY(5%);
opacity: 0;
transition: transform .3s, opacity .3s;
transform: scaleY(0.8);
transition: transform .12s cubic-bezier(0, 0, 0.2, 1), opacity .12s cubic-bezier(0, 0, 0.2, 1);
}
.p-input-overlay-visible {
transform: translateY(0);
opacity: 1;
transform: scaleY(1);
}
.p-input-overlay-hidden {
opacity: 0;
transform: translateY(5%);
transition: transform .3s, opacity .15s;
transform: scaleY(1);
transition: opacity .1s linear;
}
/* Vue based overlay animations */
.p-input-overlay-enter {
opacity: 0;
transform: scaleY(0.8);
}
/* Overlay Animations */
.p-input-overlay-enter,
.p-input-overlay-leave-to {
opacity: 0;
transform: translateY(5%);
}
.p-input-overlay-enter-active,
.p-input-overlay-enter-active {
transition: transform .12s cubic-bezier(0, 0, 0.2, 1), opacity .12s cubic-bezier(0, 0, 0.2, 1);
}
.p-input-overlay-leave-active {
transition: transform .3s, opacity .15s;
transition: opacity .1s linear;
}
/* Toggleable Content */

View File

@ -168,29 +168,21 @@ export default {
}
/* Animation */
.p-overlaypanel-enter,
.p-overlaypanel-enter {
opacity: 0;
transform: scaleY(0.8);
}
.p-overlaypanel-leave-to {
opacity: 0;
transform: translate3d(-50%, -25%, 0) scale(0.9);
}
.p-overlaypanel-enter-active,
.p-overlaypanel-enter-active {
transition: transform .12s cubic-bezier(0, 0, 0.2, 1), opacity .12s cubic-bezier(0, 0, 0.2, 1);
}
.p-overlaypanel-leave-active {
transition: all 400ms cubic-bezier(0.25, 0.8, 0.25, 1);
}
.p-overlaypanel-enter,
.p-overlaypanel-leave-to {
opacity: 0;
-webkit-transform: translateY(5%);
-ms-transform: translateY(5%);
transform: translateY(5%);
}
.p-overlaypanel-enter-active,
.p-overlaypanel-leave-active {
-webkit-transition: transform .3s, opacity .15s;
transition: transform .3s, opacity .15s;
transition: opacity .1s linear;
}
.p-overlaypanel:after, .p-overlaypanel:before {

View File

@ -187,10 +187,14 @@ export default class DomHandler {
let viewport = this.getViewport();
let top, left;
if (targetOffset.top + targetOuterHeight + elementOuterHeight > viewport.height)
if (targetOffset.top + targetOuterHeight + elementOuterHeight > viewport.height) {
top = targetOffset.top + windowScrollTop - elementOuterHeight;
else
element.style.transformOrigin = 'bottom';
}
else {
top = targetOuterHeight + targetOffset.top + windowScrollTop;
element.style.transformOrigin = 'top';
}
if (targetOffset.left + targetOuterWidth + elementOuterWidth > viewport.width)
left = targetOffset.left + windowScrollLeft + targetOuterWidth - elementOuterWidth;
@ -209,10 +213,14 @@ export default class DomHandler {
var viewport = this.getViewport();
var top, left;
if ((targetOffset.top + targetHeight + elementDimensions.height) > viewport.height)
if ((targetOffset.top + targetHeight + elementDimensions.height) > viewport.height) {
top = -1 * (elementDimensions.height);
else
element.style.transformOrigin = 'bottom';
}
else {
top = targetHeight;
element.style.transformOrigin = 'top';
}
if ((targetOffset.left + elementDimensions.width) > viewport.width)
left = targetWidth - elementDimensions.width;