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

Splitter Component - #737

pull/744/head
Cagatay Civici 2020-12-03 16:49:18 +03:00
parent 5323d88810
commit ff72e63bf0
48 changed files with 2030 additions and 818 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
exports/splitter.d.ts vendored Normal file
View File

@ -0,0 +1 @@
export * from './components/splitter/Splitter';

3
exports/splitter.js Normal file
View File

@ -0,0 +1,3 @@
'use strict';
module.exports = require('./components/splitter/Splitter.vue');

1
exports/splitterpanel.d.ts vendored Normal file
View File

@ -0,0 +1 @@
export * from './components/splitterpanel/SplitterPanel';

3
exports/splitterpanel.js Normal file
View File

@ -0,0 +1,3 @@
'use strict';
module.exports = require('./components/splitterpanel/SplitterPanel.vue');

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

@ -2804,6 +2804,30 @@
padding: 1rem;
}
.p-divider .p-divider-content {
background-color: #1e1e1e;
}
.p-divider.p-divider-horizontal {
margin: 1rem 0;
padding: 0 1rem;
}
.p-divider.p-divider-horizontal:before {
border-top: 1px #383838;
}
.p-divider.p-divider-horizontal .p-divider-content {
padding: 0 0.5rem;
}
.p-divider.p-divider-vertical {
margin: 0 1rem;
padding: 1rem 0;
}
.p-divider.p-divider-vertical:before {
border-left: 1px #383838;
}
.p-divider.p-divider-vertical .p-divider-content {
padding: 0.5rem 0;
}
.p-panel .p-panel-header {
border: 1px solid #383838;
padding: 1rem;
@ -2859,6 +2883,23 @@
border: 0 none;
}
.p-splitter {
border: 1px solid #383838;
background: #1e1e1e;
border-radius: 3px;
color: rgba(255, 255, 255, 0.87);
}
.p-splitter .p-splitter-gutter {
transition: background-color 0.2s, color 0.2s, box-shadow 0.2s;
background: rgba(255, 255, 255, 0.03);
}
.p-splitter .p-splitter-gutter .p-splitter-gutter-handle {
background: #383838;
}
.p-splitter.p-splitter-resizing .p-splitter-gutter {
background: #383838;
}
.p-tabview .p-tabview-nav {
background: transparent;
border: 1px solid #383838;
@ -4338,30 +4379,6 @@
background: rgba(0, 0, 0, 0.4);
}
.p-divider .p-divider-content {
background-color: #1e1e1e;
}
.p-divider.p-divider-horizontal {
margin: 1rem 0;
padding: 0 1rem;
}
.p-divider.p-divider-horizontal:before {
border-top: 1px #383838;
}
.p-divider.p-divider-horizontal .p-divider-content {
padding: 0 0.5rem;
}
.p-divider.p-divider-vertical {
margin: 0 1rem;
padding: 1rem 0;
}
.p-divider.p-divider-vertical:before {
border-left: 1px #383838;
}
.p-divider.p-divider-vertical .p-divider-content {
padding: 0.5rem 0;
}
.p-inplace .p-inplace-display {
padding: 0.5rem 0.5rem;
border-radius: 3px;

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

@ -2804,6 +2804,30 @@
padding: 1rem;
}
.p-divider .p-divider-content {
background-color: #1e1e1e;
}
.p-divider.p-divider-horizontal {
margin: 1rem 0;
padding: 0 1rem;
}
.p-divider.p-divider-horizontal:before {
border-top: 1px #383838;
}
.p-divider.p-divider-horizontal .p-divider-content {
padding: 0 0.5rem;
}
.p-divider.p-divider-vertical {
margin: 0 1rem;
padding: 1rem 0;
}
.p-divider.p-divider-vertical:before {
border-left: 1px #383838;
}
.p-divider.p-divider-vertical .p-divider-content {
padding: 0.5rem 0;
}
.p-panel .p-panel-header {
border: 1px solid #383838;
padding: 1rem;
@ -2859,6 +2883,23 @@
border: 0 none;
}
.p-splitter {
border: 1px solid #383838;
background: #1e1e1e;
border-radius: 3px;
color: rgba(255, 255, 255, 0.87);
}
.p-splitter .p-splitter-gutter {
transition: background-color 0.2s, color 0.2s, box-shadow 0.2s;
background: rgba(255, 255, 255, 0.03);
}
.p-splitter .p-splitter-gutter .p-splitter-gutter-handle {
background: #383838;
}
.p-splitter.p-splitter-resizing .p-splitter-gutter {
background: #383838;
}
.p-tabview .p-tabview-nav {
background: transparent;
border: 1px solid #383838;
@ -4338,30 +4379,6 @@
background: rgba(0, 0, 0, 0.4);
}
.p-divider .p-divider-content {
background-color: #1e1e1e;
}
.p-divider.p-divider-horizontal {
margin: 1rem 0;
padding: 0 1rem;
}
.p-divider.p-divider-horizontal:before {
border-top: 1px #383838;
}
.p-divider.p-divider-horizontal .p-divider-content {
padding: 0 0.5rem;
}
.p-divider.p-divider-vertical {
margin: 0 1rem;
padding: 1rem 0;
}
.p-divider.p-divider-vertical:before {
border-left: 1px #383838;
}
.p-divider.p-divider-vertical .p-divider-content {
padding: 0.5rem 0;
}
.p-inplace .p-inplace-display {
padding: 0.5rem 0.5rem;
border-radius: 3px;

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

@ -2804,6 +2804,30 @@
padding: 1rem;
}
.p-divider .p-divider-content {
background-color: #1e1e1e;
}
.p-divider.p-divider-horizontal {
margin: 1rem 0;
padding: 0 1rem;
}
.p-divider.p-divider-horizontal:before {
border-top: 1px #383838;
}
.p-divider.p-divider-horizontal .p-divider-content {
padding: 0 0.5rem;
}
.p-divider.p-divider-vertical {
margin: 0 1rem;
padding: 1rem 0;
}
.p-divider.p-divider-vertical:before {
border-left: 1px #383838;
}
.p-divider.p-divider-vertical .p-divider-content {
padding: 0.5rem 0;
}
.p-panel .p-panel-header {
border: 1px solid #383838;
padding: 1rem;
@ -2859,6 +2883,23 @@
border: 0 none;
}
.p-splitter {
border: 1px solid #383838;
background: #1e1e1e;
border-radius: 3px;
color: rgba(255, 255, 255, 0.87);
}
.p-splitter .p-splitter-gutter {
transition: background-color 0.2s, color 0.2s, box-shadow 0.2s;
background: rgba(255, 255, 255, 0.03);
}
.p-splitter .p-splitter-gutter .p-splitter-gutter-handle {
background: #383838;
}
.p-splitter.p-splitter-resizing .p-splitter-gutter {
background: #383838;
}
.p-tabview .p-tabview-nav {
background: transparent;
border: 1px solid #383838;
@ -4338,30 +4379,6 @@
background: rgba(0, 0, 0, 0.4);
}
.p-divider .p-divider-content {
background-color: #1e1e1e;
}
.p-divider.p-divider-horizontal {
margin: 1rem 0;
padding: 0 1rem;
}
.p-divider.p-divider-horizontal:before {
border-top: 1px #383838;
}
.p-divider.p-divider-horizontal .p-divider-content {
padding: 0 0.5rem;
}
.p-divider.p-divider-vertical {
margin: 0 1rem;
padding: 1rem 0;
}
.p-divider.p-divider-vertical:before {
border-left: 1px #383838;
}
.p-divider.p-divider-vertical .p-divider-content {
padding: 0.5rem 0;
}
.p-inplace .p-inplace-display {
padding: 0.5rem 0.5rem;
border-radius: 3px;

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

@ -2804,6 +2804,30 @@
padding: 1rem;
}
.p-divider .p-divider-content {
background-color: #1e1e1e;
}
.p-divider.p-divider-horizontal {
margin: 1rem 0;
padding: 0 1rem;
}
.p-divider.p-divider-horizontal:before {
border-top: 1px #383838;
}
.p-divider.p-divider-horizontal .p-divider-content {
padding: 0 0.5rem;
}
.p-divider.p-divider-vertical {
margin: 0 1rem;
padding: 1rem 0;
}
.p-divider.p-divider-vertical:before {
border-left: 1px #383838;
}
.p-divider.p-divider-vertical .p-divider-content {
padding: 0.5rem 0;
}
.p-panel .p-panel-header {
border: 1px solid #383838;
padding: 1rem;
@ -2859,6 +2883,23 @@
border: 0 none;
}
.p-splitter {
border: 1px solid #383838;
background: #1e1e1e;
border-radius: 3px;
color: rgba(255, 255, 255, 0.87);
}
.p-splitter .p-splitter-gutter {
transition: background-color 0.2s, color 0.2s, box-shadow 0.2s;
background: rgba(255, 255, 255, 0.03);
}
.p-splitter .p-splitter-gutter .p-splitter-gutter-handle {
background: #383838;
}
.p-splitter.p-splitter-resizing .p-splitter-gutter {
background: #383838;
}
.p-tabview .p-tabview-nav {
background: transparent;
border: 1px solid #383838;
@ -4338,30 +4379,6 @@
background: rgba(0, 0, 0, 0.4);
}
.p-divider .p-divider-content {
background-color: #1e1e1e;
}
.p-divider.p-divider-horizontal {
margin: 1rem 0;
padding: 0 1rem;
}
.p-divider.p-divider-horizontal:before {
border-top: 1px #383838;
}
.p-divider.p-divider-horizontal .p-divider-content {
padding: 0 0.5rem;
}
.p-divider.p-divider-vertical {
margin: 0 1rem;
padding: 1rem 0;
}
.p-divider.p-divider-vertical:before {
border-left: 1px #383838;
}
.p-divider.p-divider-vertical .p-divider-content {
padding: 0.5rem 0;
}
.p-inplace .p-inplace-display {
padding: 0.5rem 0.5rem;
border-radius: 3px;

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

@ -2816,6 +2816,30 @@
padding: 1.25rem;
}
.p-divider .p-divider-content {
background-color: #2a323d;
}
.p-divider.p-divider-horizontal {
margin: 1rem 0;
padding: 0 1rem;
}
.p-divider.p-divider-horizontal:before {
border-top: 1px #3f4b5b;
}
.p-divider.p-divider-horizontal .p-divider-content {
padding: 0 0.5rem;
}
.p-divider.p-divider-vertical {
margin: 0 1rem;
padding: 1rem 0;
}
.p-divider.p-divider-vertical:before {
border-left: 1px #3f4b5b;
}
.p-divider.p-divider-vertical .p-divider-content {
padding: 0.5rem 0;
}
.p-panel .p-panel-header {
border: 1px solid #3f4b5b;
padding: 1rem 1.25rem;
@ -2871,6 +2895,23 @@
border: 0 none;
}
.p-splitter {
border: 1px solid #3f4b5b;
background: #2a323d;
border-radius: 4px;
color: rgba(255, 255, 255, 0.87);
}
.p-splitter .p-splitter-gutter {
transition: color 0.15s, box-shadow 0.15s;
background: rgba(255, 255, 255, 0.04);
}
.p-splitter .p-splitter-gutter .p-splitter-gutter-handle {
background: #3f4b5b;
}
.p-splitter.p-splitter-resizing .p-splitter-gutter {
background: #3f4b5b;
}
.p-tabview .p-tabview-nav {
background: transparent;
border: 1px solid #3f4b5b;
@ -4350,30 +4391,6 @@
background: rgba(0, 0, 0, 0.4);
}
.p-divider .p-divider-content {
background-color: #2a323d;
}
.p-divider.p-divider-horizontal {
margin: 1rem 0;
padding: 0 1rem;
}
.p-divider.p-divider-horizontal:before {
border-top: 1px #3f4b5b;
}
.p-divider.p-divider-horizontal .p-divider-content {
padding: 0 0.5rem;
}
.p-divider.p-divider-vertical {
margin: 0 1rem;
padding: 1rem 0;
}
.p-divider.p-divider-vertical:before {
border-left: 1px #3f4b5b;
}
.p-divider.p-divider-vertical .p-divider-content {
padding: 0.5rem 0;
}
.p-inplace .p-inplace-display {
padding: 0.5rem 0.75rem;
border-radius: 4px;

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

@ -2816,6 +2816,30 @@
padding: 1.25rem;
}
.p-divider .p-divider-content {
background-color: #2a323d;
}
.p-divider.p-divider-horizontal {
margin: 1rem 0;
padding: 0 1rem;
}
.p-divider.p-divider-horizontal:before {
border-top: 1px #3f4b5b;
}
.p-divider.p-divider-horizontal .p-divider-content {
padding: 0 0.5rem;
}
.p-divider.p-divider-vertical {
margin: 0 1rem;
padding: 1rem 0;
}
.p-divider.p-divider-vertical:before {
border-left: 1px #3f4b5b;
}
.p-divider.p-divider-vertical .p-divider-content {
padding: 0.5rem 0;
}
.p-panel .p-panel-header {
border: 1px solid #3f4b5b;
padding: 1rem 1.25rem;
@ -2871,6 +2895,23 @@
border: 0 none;
}
.p-splitter {
border: 1px solid #3f4b5b;
background: #2a323d;
border-radius: 4px;
color: rgba(255, 255, 255, 0.87);
}
.p-splitter .p-splitter-gutter {
transition: color 0.15s, box-shadow 0.15s;
background: rgba(255, 255, 255, 0.04);
}
.p-splitter .p-splitter-gutter .p-splitter-gutter-handle {
background: #3f4b5b;
}
.p-splitter.p-splitter-resizing .p-splitter-gutter {
background: #3f4b5b;
}
.p-tabview .p-tabview-nav {
background: transparent;
border: 1px solid #3f4b5b;
@ -4350,30 +4391,6 @@
background: rgba(0, 0, 0, 0.4);
}
.p-divider .p-divider-content {
background-color: #2a323d;
}
.p-divider.p-divider-horizontal {
margin: 1rem 0;
padding: 0 1rem;
}
.p-divider.p-divider-horizontal:before {
border-top: 1px #3f4b5b;
}
.p-divider.p-divider-horizontal .p-divider-content {
padding: 0 0.5rem;
}
.p-divider.p-divider-vertical {
margin: 0 1rem;
padding: 1rem 0;
}
.p-divider.p-divider-vertical:before {
border-left: 1px #3f4b5b;
}
.p-divider.p-divider-vertical .p-divider-content {
padding: 0.5rem 0;
}
.p-inplace .p-inplace-display {
padding: 0.5rem 0.75rem;
border-radius: 4px;

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

@ -2816,6 +2816,30 @@
padding: 1.25rem;
}
.p-divider .p-divider-content {
background-color: #ffffff;
}
.p-divider.p-divider-horizontal {
margin: 1rem 0;
padding: 0 1rem;
}
.p-divider.p-divider-horizontal:before {
border-top: 1px #dee2e6;
}
.p-divider.p-divider-horizontal .p-divider-content {
padding: 0 0.5rem;
}
.p-divider.p-divider-vertical {
margin: 0 1rem;
padding: 1rem 0;
}
.p-divider.p-divider-vertical:before {
border-left: 1px #dee2e6;
}
.p-divider.p-divider-vertical .p-divider-content {
padding: 0.5rem 0;
}
.p-panel .p-panel-header {
border: 1px solid #dee2e6;
padding: 1rem 1.25rem;
@ -2871,6 +2895,23 @@
border: 0 none;
}
.p-splitter {
border: 1px solid #dee2e6;
background: #ffffff;
border-radius: 4px;
color: #212529;
}
.p-splitter .p-splitter-gutter {
transition: box-shadow 0.15s;
background: #efefef;
}
.p-splitter .p-splitter-gutter .p-splitter-gutter-handle {
background: #dee2e6;
}
.p-splitter.p-splitter-resizing .p-splitter-gutter {
background: #dee2e6;
}
.p-tabview .p-tabview-nav {
background: transparent;
border: 1px solid #dee2e6;
@ -4350,30 +4391,6 @@
background: rgba(0, 0, 0, 0.4);
}
.p-divider .p-divider-content {
background-color: #ffffff;
}
.p-divider.p-divider-horizontal {
margin: 1rem 0;
padding: 0 1rem;
}
.p-divider.p-divider-horizontal:before {
border-top: 1px #dee2e6;
}
.p-divider.p-divider-horizontal .p-divider-content {
padding: 0 0.5rem;
}
.p-divider.p-divider-vertical {
margin: 0 1rem;
padding: 1rem 0;
}
.p-divider.p-divider-vertical:before {
border-left: 1px #dee2e6;
}
.p-divider.p-divider-vertical .p-divider-content {
padding: 0.5rem 0;
}
.p-inplace .p-inplace-display {
padding: 0.5rem 0.75rem;
border-radius: 4px;

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

@ -2816,6 +2816,30 @@
padding: 1.25rem;
}
.p-divider .p-divider-content {
background-color: #ffffff;
}
.p-divider.p-divider-horizontal {
margin: 1rem 0;
padding: 0 1rem;
}
.p-divider.p-divider-horizontal:before {
border-top: 1px #dee2e6;
}
.p-divider.p-divider-horizontal .p-divider-content {
padding: 0 0.5rem;
}
.p-divider.p-divider-vertical {
margin: 0 1rem;
padding: 1rem 0;
}
.p-divider.p-divider-vertical:before {
border-left: 1px #dee2e6;
}
.p-divider.p-divider-vertical .p-divider-content {
padding: 0.5rem 0;
}
.p-panel .p-panel-header {
border: 1px solid #dee2e6;
padding: 1rem 1.25rem;
@ -2871,6 +2895,23 @@
border: 0 none;
}
.p-splitter {
border: 1px solid #dee2e6;
background: #ffffff;
border-radius: 4px;
color: #212529;
}
.p-splitter .p-splitter-gutter {
transition: box-shadow 0.15s;
background: #efefef;
}
.p-splitter .p-splitter-gutter .p-splitter-gutter-handle {
background: #dee2e6;
}
.p-splitter.p-splitter-resizing .p-splitter-gutter {
background: #dee2e6;
}
.p-tabview .p-tabview-nav {
background: transparent;
border: 1px solid #dee2e6;
@ -4350,30 +4391,6 @@
background: rgba(0, 0, 0, 0.4);
}
.p-divider .p-divider-content {
background-color: #ffffff;
}
.p-divider.p-divider-horizontal {
margin: 1rem 0;
padding: 0 1rem;
}
.p-divider.p-divider-horizontal:before {
border-top: 1px #dee2e6;
}
.p-divider.p-divider-horizontal .p-divider-content {
padding: 0 0.5rem;
}
.p-divider.p-divider-vertical {
margin: 0 1rem;
padding: 1rem 0;
}
.p-divider.p-divider-vertical:before {
border-left: 1px #dee2e6;
}
.p-divider.p-divider-vertical .p-divider-content {
padding: 0.5rem 0;
}
.p-inplace .p-inplace-display {
padding: 0.5rem 0.75rem;
border-radius: 4px;

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

@ -2779,6 +2779,30 @@
padding: 1rem;
}
.p-divider .p-divider-content {
background-color: #ffffff;
}
.p-divider.p-divider-horizontal {
margin: 1rem 0;
padding: 0 1rem;
}
.p-divider.p-divider-horizontal:before {
border-top: 1px #edebe9;
}
.p-divider.p-divider-horizontal .p-divider-content {
padding: 0 0.5rem;
}
.p-divider.p-divider-vertical {
margin: 0 1rem;
padding: 1rem 0;
}
.p-divider.p-divider-vertical:before {
border-left: 1px #edebe9;
}
.p-divider.p-divider-vertical .p-divider-content {
padding: 0.5rem 0;
}
.p-panel .p-panel-header {
border: 1px solid #a19f9d;
padding: 1rem;
@ -2834,6 +2858,23 @@
border: 0 none;
}
.p-splitter {
border: 1px solid #a19f9d;
background: #ffffff;
border-radius: 2px;
color: #323130;
}
.p-splitter .p-splitter-gutter {
transition: background-color 0.2s, color 0.2s, box-shadow 0.2s;
background: #faf9f8;
}
.p-splitter .p-splitter-gutter .p-splitter-gutter-handle {
background: #edebe9;
}
.p-splitter.p-splitter-resizing .p-splitter-gutter {
background: #edebe9;
}
.p-tabview .p-tabview-nav {
background: #ffffff;
border: 0 none;
@ -4289,30 +4330,6 @@
background: rgba(0, 0, 0, 0.4);
}
.p-divider .p-divider-content {
background-color: #ffffff;
}
.p-divider.p-divider-horizontal {
margin: 1rem 0;
padding: 0 1rem;
}
.p-divider.p-divider-horizontal:before {
border-top: 1px #edebe9;
}
.p-divider.p-divider-horizontal .p-divider-content {
padding: 0 0.5rem;
}
.p-divider.p-divider-vertical {
margin: 0 1rem;
padding: 1rem 0;
}
.p-divider.p-divider-vertical:before {
border-left: 1px #edebe9;
}
.p-divider.p-divider-vertical .p-divider-content {
padding: 0.5rem 0;
}
.p-inplace .p-inplace-display {
padding: 0.5rem 0.5rem;
border-radius: 2px;

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

@ -2791,6 +2791,30 @@
padding: 0.571rem 1rem;
}
.p-divider .p-divider-content {
background-color: #323232;
}
.p-divider.p-divider-horizontal {
margin: 1rem 0;
padding: 0 1rem;
}
.p-divider.p-divider-horizontal:before {
border-top: 1px #4b4b4b;
}
.p-divider.p-divider-horizontal .p-divider-content {
padding: 0 0.5rem;
}
.p-divider.p-divider-vertical {
margin: 0 1rem;
padding: 1rem 0;
}
.p-divider.p-divider-vertical:before {
border-left: 1px #4b4b4b;
}
.p-divider.p-divider-vertical .p-divider-content {
padding: 0.5rem 0;
}
.p-panel .p-panel-header {
border: 1px solid #191919;
padding: 0.857rem 1rem;
@ -2846,6 +2870,23 @@
border: 0 none;
}
.p-splitter {
border: 1px solid #191919;
background: #323232;
border-radius: 3px;
color: #dedede;
}
.p-splitter .p-splitter-gutter {
transition: background-color 0.2s, color 0.2s, box-shadow 0.2s;
background: #191919;
}
.p-splitter .p-splitter-gutter .p-splitter-gutter-handle {
background: #4b4b4b;
}
.p-splitter.p-splitter-resizing .p-splitter-gutter {
background: #4b4b4b;
}
.p-tabview .p-tabview-nav {
background: transparent;
border: 0 none;
@ -4301,30 +4342,6 @@
background: rgba(0, 0, 0, 0.4);
}
.p-divider .p-divider-content {
background-color: #323232;
}
.p-divider.p-divider-horizontal {
margin: 1rem 0;
padding: 0 1rem;
}
.p-divider.p-divider-horizontal:before {
border-top: 1px #4b4b4b;
}
.p-divider.p-divider-horizontal .p-divider-content {
padding: 0 0.5rem;
}
.p-divider.p-divider-vertical {
margin: 0 1rem;
padding: 1rem 0;
}
.p-divider.p-divider-vertical:before {
border-left: 1px #4b4b4b;
}
.p-divider.p-divider-vertical .p-divider-content {
padding: 0.5rem 0;
}
.p-inplace .p-inplace-display {
padding: 0.429rem 0.429rem;
border-radius: 3px;

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

@ -2791,6 +2791,30 @@
padding: 0.571rem 1rem;
}
.p-divider .p-divider-content {
background-color: #323232;
}
.p-divider.p-divider-horizontal {
margin: 1rem 0;
padding: 0 1rem;
}
.p-divider.p-divider-horizontal:before {
border-top: 1px #4b4b4b;
}
.p-divider.p-divider-horizontal .p-divider-content {
padding: 0 0.5rem;
}
.p-divider.p-divider-vertical {
margin: 0 1rem;
padding: 1rem 0;
}
.p-divider.p-divider-vertical:before {
border-left: 1px #4b4b4b;
}
.p-divider.p-divider-vertical .p-divider-content {
padding: 0.5rem 0;
}
.p-panel .p-panel-header {
border: 1px solid #191919;
padding: 0.857rem 1rem;
@ -2846,6 +2870,23 @@
border: 0 none;
}
.p-splitter {
border: 1px solid #191919;
background: #323232;
border-radius: 3px;
color: #dedede;
}
.p-splitter .p-splitter-gutter {
transition: background-color 0.2s, color 0.2s, box-shadow 0.2s;
background: #191919;
}
.p-splitter .p-splitter-gutter .p-splitter-gutter-handle {
background: #4b4b4b;
}
.p-splitter.p-splitter-resizing .p-splitter-gutter {
background: #4b4b4b;
}
.p-tabview .p-tabview-nav {
background: transparent;
border: 0 none;
@ -4301,30 +4342,6 @@
background: rgba(0, 0, 0, 0.4);
}
.p-divider .p-divider-content {
background-color: #323232;
}
.p-divider.p-divider-horizontal {
margin: 1rem 0;
padding: 0 1rem;
}
.p-divider.p-divider-horizontal:before {
border-top: 1px #4b4b4b;
}
.p-divider.p-divider-horizontal .p-divider-content {
padding: 0 0.5rem;
}
.p-divider.p-divider-vertical {
margin: 0 1rem;
padding: 1rem 0;
}
.p-divider.p-divider-vertical:before {
border-left: 1px #4b4b4b;
}
.p-divider.p-divider-vertical .p-divider-content {
padding: 0.5rem 0;
}
.p-inplace .p-inplace-display {
padding: 0.429rem 0.429rem;
border-radius: 3px;

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

@ -2791,6 +2791,30 @@
padding: 0.571rem 1rem;
}
.p-divider .p-divider-content {
background-color: #323232;
}
.p-divider.p-divider-horizontal {
margin: 1rem 0;
padding: 0 1rem;
}
.p-divider.p-divider-horizontal:before {
border-top: 1px #4b4b4b;
}
.p-divider.p-divider-horizontal .p-divider-content {
padding: 0 0.5rem;
}
.p-divider.p-divider-vertical {
margin: 0 1rem;
padding: 1rem 0;
}
.p-divider.p-divider-vertical:before {
border-left: 1px #4b4b4b;
}
.p-divider.p-divider-vertical .p-divider-content {
padding: 0.5rem 0;
}
.p-panel .p-panel-header {
border: 1px solid #191919;
padding: 0.857rem 1rem;
@ -2846,6 +2870,23 @@
border: 0 none;
}
.p-splitter {
border: 1px solid #191919;
background: #323232;
border-radius: 3px;
color: #dedede;
}
.p-splitter .p-splitter-gutter {
transition: background-color 0.2s, color 0.2s, box-shadow 0.2s;
background: #191919;
}
.p-splitter .p-splitter-gutter .p-splitter-gutter-handle {
background: #4b4b4b;
}
.p-splitter.p-splitter-resizing .p-splitter-gutter {
background: #4b4b4b;
}
.p-tabview .p-tabview-nav {
background: transparent;
border: 0 none;
@ -4301,30 +4342,6 @@
background: rgba(0, 0, 0, 0.4);
}
.p-divider .p-divider-content {
background-color: #323232;
}
.p-divider.p-divider-horizontal {
margin: 1rem 0;
padding: 0 1rem;
}
.p-divider.p-divider-horizontal:before {
border-top: 1px #4b4b4b;
}
.p-divider.p-divider-horizontal .p-divider-content {
padding: 0 0.5rem;
}
.p-divider.p-divider-vertical {
margin: 0 1rem;
padding: 1rem 0;
}
.p-divider.p-divider-vertical:before {
border-left: 1px #4b4b4b;
}
.p-divider.p-divider-vertical .p-divider-content {
padding: 0.5rem 0;
}
.p-inplace .p-inplace-display {
padding: 0.429rem 0.429rem;
border-radius: 3px;

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

@ -2791,6 +2791,30 @@
padding: 0.571rem 1rem;
}
.p-divider .p-divider-content {
background-color: #323232;
}
.p-divider.p-divider-horizontal {
margin: 1rem 0;
padding: 0 1rem;
}
.p-divider.p-divider-horizontal:before {
border-top: 1px #4b4b4b;
}
.p-divider.p-divider-horizontal .p-divider-content {
padding: 0 0.5rem;
}
.p-divider.p-divider-vertical {
margin: 0 1rem;
padding: 1rem 0;
}
.p-divider.p-divider-vertical:before {
border-left: 1px #4b4b4b;
}
.p-divider.p-divider-vertical .p-divider-content {
padding: 0.5rem 0;
}
.p-panel .p-panel-header {
border: 1px solid #191919;
padding: 0.857rem 1rem;
@ -2846,6 +2870,23 @@
border: 0 none;
}
.p-splitter {
border: 1px solid #191919;
background: #323232;
border-radius: 3px;
color: #dedede;
}
.p-splitter .p-splitter-gutter {
transition: background-color 0.2s, color 0.2s, box-shadow 0.2s;
background: #191919;
}
.p-splitter .p-splitter-gutter .p-splitter-gutter-handle {
background: #4b4b4b;
}
.p-splitter.p-splitter-resizing .p-splitter-gutter {
background: #4b4b4b;
}
.p-tabview .p-tabview-nav {
background: transparent;
border: 0 none;
@ -4301,30 +4342,6 @@
background: rgba(0, 0, 0, 0.4);
}
.p-divider .p-divider-content {
background-color: #323232;
}
.p-divider.p-divider-horizontal {
margin: 1rem 0;
padding: 0 1rem;
}
.p-divider.p-divider-horizontal:before {
border-top: 1px #4b4b4b;
}
.p-divider.p-divider-horizontal .p-divider-content {
padding: 0 0.5rem;
}
.p-divider.p-divider-vertical {
margin: 0 1rem;
padding: 1rem 0;
}
.p-divider.p-divider-vertical:before {
border-left: 1px #4b4b4b;
}
.p-divider.p-divider-vertical .p-divider-content {
padding: 0.5rem 0;
}
.p-inplace .p-inplace-display {
padding: 0.429rem 0.429rem;
border-radius: 3px;

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

@ -2828,6 +2828,30 @@
padding: 1rem;
}
.p-divider .p-divider-content {
background-color: #1e1e1e;
}
.p-divider.p-divider-horizontal {
margin: 1.25rem 0;
padding: 0 1.25rem;
}
.p-divider.p-divider-horizontal:before {
border-top: 1px rgba(255, 255, 255, 0.12);
}
.p-divider.p-divider-horizontal .p-divider-content {
padding: 0 0.5rem;
}
.p-divider.p-divider-vertical {
margin: 0 1.25rem;
padding: 1.25rem 0;
}
.p-divider.p-divider-vertical:before {
border-left: 1px rgba(255, 255, 255, 0.12);
}
.p-divider.p-divider-vertical .p-divider-content {
padding: 0.5rem 0;
}
.p-panel .p-panel-header {
border: 1px solid rgba(255, 255, 255, 0.12);
padding: 1rem;
@ -2883,6 +2907,23 @@
border: 0 none;
}
.p-splitter {
border: 1px solid rgba(255, 255, 255, 0.12);
background: #1e1e1e;
border-radius: 4px;
color: rgba(255, 255, 255, 0.87);
}
.p-splitter .p-splitter-gutter {
transition: background-color 0.2s, color 0.2s, box-shadow 0.2s;
background: rgba(255, 255, 255, 0.04);
}
.p-splitter .p-splitter-gutter .p-splitter-gutter-handle {
background: rgba(255, 255, 255, 0.12);
}
.p-splitter.p-splitter-resizing .p-splitter-gutter {
background: rgba(255, 255, 255, 0.12);
}
.p-tabview .p-tabview-nav {
background: transparent;
border: solid rgba(255, 255, 255, 0.12);
@ -4362,30 +4403,6 @@
background: rgba(0, 0, 0, 0.32);
}
.p-divider .p-divider-content {
background-color: #1e1e1e;
}
.p-divider.p-divider-horizontal {
margin: 1.25rem 0;
padding: 0 1.25rem;
}
.p-divider.p-divider-horizontal:before {
border-top: 1px rgba(255, 255, 255, 0.12);
}
.p-divider.p-divider-horizontal .p-divider-content {
padding: 0 0.5rem;
}
.p-divider.p-divider-vertical {
margin: 0 1.25rem;
padding: 1.25rem 0;
}
.p-divider.p-divider-vertical:before {
border-left: 1px rgba(255, 255, 255, 0.12);
}
.p-divider.p-divider-vertical .p-divider-content {
padding: 0.5rem 0;
}
.p-inplace .p-inplace-display {
padding: 1rem 1rem;
border-radius: 4px;

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

@ -2828,6 +2828,30 @@
padding: 1rem;
}
.p-divider .p-divider-content {
background-color: #1e1e1e;
}
.p-divider.p-divider-horizontal {
margin: 1.25rem 0;
padding: 0 1.25rem;
}
.p-divider.p-divider-horizontal:before {
border-top: 1px rgba(255, 255, 255, 0.12);
}
.p-divider.p-divider-horizontal .p-divider-content {
padding: 0 0.5rem;
}
.p-divider.p-divider-vertical {
margin: 0 1.25rem;
padding: 1.25rem 0;
}
.p-divider.p-divider-vertical:before {
border-left: 1px rgba(255, 255, 255, 0.12);
}
.p-divider.p-divider-vertical .p-divider-content {
padding: 0.5rem 0;
}
.p-panel .p-panel-header {
border: 1px solid rgba(255, 255, 255, 0.12);
padding: 1rem;
@ -2883,6 +2907,23 @@
border: 0 none;
}
.p-splitter {
border: 1px solid rgba(255, 255, 255, 0.12);
background: #1e1e1e;
border-radius: 4px;
color: rgba(255, 255, 255, 0.87);
}
.p-splitter .p-splitter-gutter {
transition: background-color 0.2s, color 0.2s, box-shadow 0.2s;
background: rgba(255, 255, 255, 0.04);
}
.p-splitter .p-splitter-gutter .p-splitter-gutter-handle {
background: rgba(255, 255, 255, 0.12);
}
.p-splitter.p-splitter-resizing .p-splitter-gutter {
background: rgba(255, 255, 255, 0.12);
}
.p-tabview .p-tabview-nav {
background: transparent;
border: solid rgba(255, 255, 255, 0.12);
@ -4362,30 +4403,6 @@
background: rgba(0, 0, 0, 0.32);
}
.p-divider .p-divider-content {
background-color: #1e1e1e;
}
.p-divider.p-divider-horizontal {
margin: 1.25rem 0;
padding: 0 1.25rem;
}
.p-divider.p-divider-horizontal:before {
border-top: 1px rgba(255, 255, 255, 0.12);
}
.p-divider.p-divider-horizontal .p-divider-content {
padding: 0 0.5rem;
}
.p-divider.p-divider-vertical {
margin: 0 1.25rem;
padding: 1.25rem 0;
}
.p-divider.p-divider-vertical:before {
border-left: 1px rgba(255, 255, 255, 0.12);
}
.p-divider.p-divider-vertical .p-divider-content {
padding: 0.5rem 0;
}
.p-inplace .p-inplace-display {
padding: 1rem 1rem;
border-radius: 4px;

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

@ -2828,6 +2828,30 @@
padding: 1rem;
}
.p-divider .p-divider-content {
background-color: #ffffff;
}
.p-divider.p-divider-horizontal {
margin: 1.25rem 0;
padding: 0 1.25rem;
}
.p-divider.p-divider-horizontal:before {
border-top: 1px rgba(0, 0, 0, 0.12);
}
.p-divider.p-divider-horizontal .p-divider-content {
padding: 0 0.5rem;
}
.p-divider.p-divider-vertical {
margin: 0 1.25rem;
padding: 1.25rem 0;
}
.p-divider.p-divider-vertical:before {
border-left: 1px rgba(0, 0, 0, 0.12);
}
.p-divider.p-divider-vertical .p-divider-content {
padding: 0.5rem 0;
}
.p-panel .p-panel-header {
border: 1px solid #e0e0e0;
padding: 1rem;
@ -2883,6 +2907,23 @@
border: 0 none;
}
.p-splitter {
border: 1px solid #e0e0e0;
background: #ffffff;
border-radius: 4px;
color: #000001;
}
.p-splitter .p-splitter-gutter {
transition: background-color 0.2s, color 0.2s, box-shadow 0.2s;
background: rgba(0, 0, 0, 0.04);
}
.p-splitter .p-splitter-gutter .p-splitter-gutter-handle {
background: rgba(0, 0, 0, 0.12);
}
.p-splitter.p-splitter-resizing .p-splitter-gutter {
background: rgba(0, 0, 0, 0.12);
}
.p-tabview .p-tabview-nav {
background: #ffffff;
border: solid rgba(0, 0, 0, 0.12);
@ -4362,30 +4403,6 @@
background: rgba(0, 0, 0, 0.32);
}
.p-divider .p-divider-content {
background-color: #ffffff;
}
.p-divider.p-divider-horizontal {
margin: 1.25rem 0;
padding: 0 1.25rem;
}
.p-divider.p-divider-horizontal:before {
border-top: 1px rgba(0, 0, 0, 0.12);
}
.p-divider.p-divider-horizontal .p-divider-content {
padding: 0 0.5rem;
}
.p-divider.p-divider-vertical {
margin: 0 1.25rem;
padding: 1.25rem 0;
}
.p-divider.p-divider-vertical:before {
border-left: 1px rgba(0, 0, 0, 0.12);
}
.p-divider.p-divider-vertical .p-divider-content {
padding: 0.5rem 0;
}
.p-inplace .p-inplace-display {
padding: 1rem 1rem;
border-radius: 4px;

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

@ -2828,6 +2828,30 @@
padding: 1rem;
}
.p-divider .p-divider-content {
background-color: #ffffff;
}
.p-divider.p-divider-horizontal {
margin: 1.25rem 0;
padding: 0 1.25rem;
}
.p-divider.p-divider-horizontal:before {
border-top: 1px rgba(0, 0, 0, 0.12);
}
.p-divider.p-divider-horizontal .p-divider-content {
padding: 0 0.5rem;
}
.p-divider.p-divider-vertical {
margin: 0 1.25rem;
padding: 1.25rem 0;
}
.p-divider.p-divider-vertical:before {
border-left: 1px rgba(0, 0, 0, 0.12);
}
.p-divider.p-divider-vertical .p-divider-content {
padding: 0.5rem 0;
}
.p-panel .p-panel-header {
border: 1px solid #e0e0e0;
padding: 1rem;
@ -2883,6 +2907,23 @@
border: 0 none;
}
.p-splitter {
border: 1px solid #e0e0e0;
background: #ffffff;
border-radius: 4px;
color: #000001;
}
.p-splitter .p-splitter-gutter {
transition: background-color 0.2s, color 0.2s, box-shadow 0.2s;
background: rgba(0, 0, 0, 0.04);
}
.p-splitter .p-splitter-gutter .p-splitter-gutter-handle {
background: rgba(0, 0, 0, 0.12);
}
.p-splitter.p-splitter-resizing .p-splitter-gutter {
background: rgba(0, 0, 0, 0.12);
}
.p-tabview .p-tabview-nav {
background: #ffffff;
border: solid rgba(0, 0, 0, 0.12);
@ -4362,30 +4403,6 @@
background: rgba(0, 0, 0, 0.32);
}
.p-divider .p-divider-content {
background-color: #ffffff;
}
.p-divider.p-divider-horizontal {
margin: 1.25rem 0;
padding: 0 1.25rem;
}
.p-divider.p-divider-horizontal:before {
border-top: 1px rgba(0, 0, 0, 0.12);
}
.p-divider.p-divider-horizontal .p-divider-content {
padding: 0 0.5rem;
}
.p-divider.p-divider-vertical {
margin: 0 1.25rem;
padding: 1.25rem 0;
}
.p-divider.p-divider-vertical:before {
border-left: 1px rgba(0, 0, 0, 0.12);
}
.p-divider.p-divider-vertical .p-divider-content {
padding: 0.5rem 0;
}
.p-inplace .p-inplace-display {
padding: 1rem 1rem;
border-radius: 4px;

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

@ -2828,6 +2828,30 @@
padding: 0.75rem;
}
.p-divider .p-divider-content {
background-color: #1e1e1e;
}
.p-divider.p-divider-horizontal {
margin: 1rem 0;
padding: 0 1rem;
}
.p-divider.p-divider-horizontal:before {
border-top: 1px rgba(255, 255, 255, 0.12);
}
.p-divider.p-divider-horizontal .p-divider-content {
padding: 0 0.5rem;
}
.p-divider.p-divider-vertical {
margin: 0 1rem;
padding: 1rem 0;
}
.p-divider.p-divider-vertical:before {
border-left: 1px rgba(255, 255, 255, 0.12);
}
.p-divider.p-divider-vertical .p-divider-content {
padding: 0.5rem 0;
}
.p-panel .p-panel-header {
border: 1px solid rgba(255, 255, 255, 0.12);
padding: 0.75rem;
@ -2883,6 +2907,23 @@
border: 0 none;
}
.p-splitter {
border: 1px solid rgba(255, 255, 255, 0.12);
background: #1e1e1e;
border-radius: 4px;
color: rgba(255, 255, 255, 0.87);
}
.p-splitter .p-splitter-gutter {
transition: background-color 0.2s, color 0.2s, box-shadow 0.2s;
background: rgba(255, 255, 255, 0.04);
}
.p-splitter .p-splitter-gutter .p-splitter-gutter-handle {
background: rgba(255, 255, 255, 0.12);
}
.p-splitter.p-splitter-resizing .p-splitter-gutter {
background: rgba(255, 255, 255, 0.12);
}
.p-tabview .p-tabview-nav {
background: transparent;
border: solid rgba(255, 255, 255, 0.12);
@ -4362,30 +4403,6 @@
background: rgba(0, 0, 0, 0.32);
}
.p-divider .p-divider-content {
background-color: #1e1e1e;
}
.p-divider.p-divider-horizontal {
margin: 1rem 0;
padding: 0 1rem;
}
.p-divider.p-divider-horizontal:before {
border-top: 1px rgba(255, 255, 255, 0.12);
}
.p-divider.p-divider-horizontal .p-divider-content {
padding: 0 0.5rem;
}
.p-divider.p-divider-vertical {
margin: 0 1rem;
padding: 1rem 0;
}
.p-divider.p-divider-vertical:before {
border-left: 1px rgba(255, 255, 255, 0.12);
}
.p-divider.p-divider-vertical .p-divider-content {
padding: 0.5rem 0;
}
.p-inplace .p-inplace-display {
padding: 1rem 1rem;
border-radius: 4px;

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

@ -2828,6 +2828,30 @@
padding: 0.75rem;
}
.p-divider .p-divider-content {
background-color: #1e1e1e;
}
.p-divider.p-divider-horizontal {
margin: 1rem 0;
padding: 0 1rem;
}
.p-divider.p-divider-horizontal:before {
border-top: 1px rgba(255, 255, 255, 0.12);
}
.p-divider.p-divider-horizontal .p-divider-content {
padding: 0 0.5rem;
}
.p-divider.p-divider-vertical {
margin: 0 1rem;
padding: 1rem 0;
}
.p-divider.p-divider-vertical:before {
border-left: 1px rgba(255, 255, 255, 0.12);
}
.p-divider.p-divider-vertical .p-divider-content {
padding: 0.5rem 0;
}
.p-panel .p-panel-header {
border: 1px solid rgba(255, 255, 255, 0.12);
padding: 0.75rem;
@ -2883,6 +2907,23 @@
border: 0 none;
}
.p-splitter {
border: 1px solid rgba(255, 255, 255, 0.12);
background: #1e1e1e;
border-radius: 4px;
color: rgba(255, 255, 255, 0.87);
}
.p-splitter .p-splitter-gutter {
transition: background-color 0.2s, color 0.2s, box-shadow 0.2s;
background: rgba(255, 255, 255, 0.04);
}
.p-splitter .p-splitter-gutter .p-splitter-gutter-handle {
background: rgba(255, 255, 255, 0.12);
}
.p-splitter.p-splitter-resizing .p-splitter-gutter {
background: rgba(255, 255, 255, 0.12);
}
.p-tabview .p-tabview-nav {
background: transparent;
border: solid rgba(255, 255, 255, 0.12);
@ -4362,30 +4403,6 @@
background: rgba(0, 0, 0, 0.32);
}
.p-divider .p-divider-content {
background-color: #1e1e1e;
}
.p-divider.p-divider-horizontal {
margin: 1rem 0;
padding: 0 1rem;
}
.p-divider.p-divider-horizontal:before {
border-top: 1px rgba(255, 255, 255, 0.12);
}
.p-divider.p-divider-horizontal .p-divider-content {
padding: 0 0.5rem;
}
.p-divider.p-divider-vertical {
margin: 0 1rem;
padding: 1rem 0;
}
.p-divider.p-divider-vertical:before {
border-left: 1px rgba(255, 255, 255, 0.12);
}
.p-divider.p-divider-vertical .p-divider-content {
padding: 0.5rem 0;
}
.p-inplace .p-inplace-display {
padding: 1rem 1rem;
border-radius: 4px;

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

@ -2828,6 +2828,30 @@
padding: 0.75rem;
}
.p-divider .p-divider-content {
background-color: #ffffff;
}
.p-divider.p-divider-horizontal {
margin: 1rem 0;
padding: 0 1rem;
}
.p-divider.p-divider-horizontal:before {
border-top: 1px rgba(0, 0, 0, 0.12);
}
.p-divider.p-divider-horizontal .p-divider-content {
padding: 0 0.5rem;
}
.p-divider.p-divider-vertical {
margin: 0 1rem;
padding: 1rem 0;
}
.p-divider.p-divider-vertical:before {
border-left: 1px rgba(0, 0, 0, 0.12);
}
.p-divider.p-divider-vertical .p-divider-content {
padding: 0.5rem 0;
}
.p-panel .p-panel-header {
border: 1px solid #e0e0e0;
padding: 0.75rem;
@ -2883,6 +2907,23 @@
border: 0 none;
}
.p-splitter {
border: 1px solid #e0e0e0;
background: #ffffff;
border-radius: 4px;
color: #000001;
}
.p-splitter .p-splitter-gutter {
transition: background-color 0.2s, color 0.2s, box-shadow 0.2s;
background: rgba(0, 0, 0, 0.04);
}
.p-splitter .p-splitter-gutter .p-splitter-gutter-handle {
background: rgba(0, 0, 0, 0.12);
}
.p-splitter.p-splitter-resizing .p-splitter-gutter {
background: rgba(0, 0, 0, 0.12);
}
.p-tabview .p-tabview-nav {
background: #ffffff;
border: solid rgba(0, 0, 0, 0.12);
@ -4362,30 +4403,6 @@
background: rgba(0, 0, 0, 0.32);
}
.p-divider .p-divider-content {
background-color: #ffffff;
}
.p-divider.p-divider-horizontal {
margin: 1rem 0;
padding: 0 1rem;
}
.p-divider.p-divider-horizontal:before {
border-top: 1px rgba(0, 0, 0, 0.12);
}
.p-divider.p-divider-horizontal .p-divider-content {
padding: 0 0.5rem;
}
.p-divider.p-divider-vertical {
margin: 0 1rem;
padding: 1rem 0;
}
.p-divider.p-divider-vertical:before {
border-left: 1px rgba(0, 0, 0, 0.12);
}
.p-divider.p-divider-vertical .p-divider-content {
padding: 0.5rem 0;
}
.p-inplace .p-inplace-display {
padding: 1rem 1rem;
border-radius: 4px;

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

@ -2828,6 +2828,30 @@
padding: 0.75rem;
}
.p-divider .p-divider-content {
background-color: #ffffff;
}
.p-divider.p-divider-horizontal {
margin: 1rem 0;
padding: 0 1rem;
}
.p-divider.p-divider-horizontal:before {
border-top: 1px rgba(0, 0, 0, 0.12);
}
.p-divider.p-divider-horizontal .p-divider-content {
padding: 0 0.5rem;
}
.p-divider.p-divider-vertical {
margin: 0 1rem;
padding: 1rem 0;
}
.p-divider.p-divider-vertical:before {
border-left: 1px rgba(0, 0, 0, 0.12);
}
.p-divider.p-divider-vertical .p-divider-content {
padding: 0.5rem 0;
}
.p-panel .p-panel-header {
border: 1px solid #e0e0e0;
padding: 0.75rem;
@ -2883,6 +2907,23 @@
border: 0 none;
}
.p-splitter {
border: 1px solid #e0e0e0;
background: #ffffff;
border-radius: 4px;
color: #000001;
}
.p-splitter .p-splitter-gutter {
transition: background-color 0.2s, color 0.2s, box-shadow 0.2s;
background: rgba(0, 0, 0, 0.04);
}
.p-splitter .p-splitter-gutter .p-splitter-gutter-handle {
background: rgba(0, 0, 0, 0.12);
}
.p-splitter.p-splitter-resizing .p-splitter-gutter {
background: rgba(0, 0, 0, 0.12);
}
.p-tabview .p-tabview-nav {
background: #ffffff;
border: solid rgba(0, 0, 0, 0.12);
@ -4362,30 +4403,6 @@
background: rgba(0, 0, 0, 0.32);
}
.p-divider .p-divider-content {
background-color: #ffffff;
}
.p-divider.p-divider-horizontal {
margin: 1rem 0;
padding: 0 1rem;
}
.p-divider.p-divider-horizontal:before {
border-top: 1px rgba(0, 0, 0, 0.12);
}
.p-divider.p-divider-horizontal .p-divider-content {
padding: 0 0.5rem;
}
.p-divider.p-divider-vertical {
margin: 0 1rem;
padding: 1rem 0;
}
.p-divider.p-divider-vertical:before {
border-left: 1px rgba(0, 0, 0, 0.12);
}
.p-divider.p-divider-vertical .p-divider-content {
padding: 0.5rem 0;
}
.p-inplace .p-inplace-display {
padding: 1rem 1rem;
border-radius: 4px;

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

@ -2779,6 +2779,30 @@
padding: 0.571rem 1rem;
}
.p-divider .p-divider-content {
background-color: #ffffff;
}
.p-divider.p-divider-horizontal {
margin: 1rem 0;
padding: 0 1rem;
}
.p-divider.p-divider-horizontal:before {
border-top: 1px #c8c8c8;
}
.p-divider.p-divider-horizontal .p-divider-content {
padding: 0 0.5rem;
}
.p-divider.p-divider-vertical {
margin: 0 1rem;
padding: 1rem 0;
}
.p-divider.p-divider-vertical:before {
border-left: 1px #c8c8c8;
}
.p-divider.p-divider-vertical .p-divider-content {
padding: 0.5rem 0;
}
.p-panel .p-panel-header {
border: 1px solid #007ad9;
padding: 0.857rem 1rem;
@ -2834,6 +2858,23 @@
border: 0 none;
}
.p-splitter {
border: 1px solid #c8c8c8;
background: #ffffff;
border-radius: 3px;
color: #333333;
}
.p-splitter .p-splitter-gutter {
transition: background-color 0.2s, color 0.2s, box-shadow 0.2s;
background: #eaeaea;
}
.p-splitter .p-splitter-gutter .p-splitter-gutter-handle {
background: #d8dae2;
}
.p-splitter.p-splitter-resizing .p-splitter-gutter {
background: #d8dae2;
}
.p-tabview .p-tabview-nav {
background: transparent;
border: 0 none;
@ -4289,30 +4330,6 @@
background: rgba(0, 0, 0, 0.4);
}
.p-divider .p-divider-content {
background-color: #ffffff;
}
.p-divider.p-divider-horizontal {
margin: 1rem 0;
padding: 0 1rem;
}
.p-divider.p-divider-horizontal:before {
border-top: 1px #c8c8c8;
}
.p-divider.p-divider-horizontal .p-divider-content {
padding: 0 0.5rem;
}
.p-divider.p-divider-vertical {
margin: 0 1rem;
padding: 1rem 0;
}
.p-divider.p-divider-vertical:before {
border-left: 1px #c8c8c8;
}
.p-divider.p-divider-vertical .p-divider-content {
padding: 0.5rem 0;
}
.p-inplace .p-inplace-display {
padding: 0.429rem 0.429rem;
border-radius: 3px;

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

@ -2791,6 +2791,30 @@
padding: 0.571rem 1rem;
}
.p-divider .p-divider-content {
background-color: #ffffff;
}
.p-divider.p-divider-horizontal {
margin: 1rem 0;
padding: 0 1rem;
}
.p-divider.p-divider-horizontal:before {
border-top: 1px #c8c8c8;
}
.p-divider.p-divider-horizontal .p-divider-content {
padding: 0 0.5rem;
}
.p-divider.p-divider-vertical {
margin: 0 1rem;
padding: 1rem 0;
}
.p-divider.p-divider-vertical:before {
border-left: 1px #c8c8c8;
}
.p-divider.p-divider-vertical .p-divider-content {
padding: 0.5rem 0;
}
.p-panel .p-panel-header {
border: 1px solid #333333;
padding: 0.857rem 1rem;
@ -2846,6 +2870,23 @@
border: 0 none;
}
.p-splitter {
border: 1px solid #c8c8c8;
background: #ffffff;
border-radius: 3px;
color: #333333;
}
.p-splitter .p-splitter-gutter {
transition: background-color 0.2s, color 0.2s, box-shadow 0.2s;
background: #eaeaea;
}
.p-splitter .p-splitter-gutter .p-splitter-gutter-handle {
background: #d8dae2;
}
.p-splitter.p-splitter-resizing .p-splitter-gutter {
background: #d8dae2;
}
.p-tabview .p-tabview-nav {
background: transparent;
border: 0 none;
@ -4301,30 +4342,6 @@
background: rgba(0, 0, 0, 0.4);
}
.p-divider .p-divider-content {
background-color: #ffffff;
}
.p-divider.p-divider-horizontal {
margin: 1rem 0;
padding: 0 1rem;
}
.p-divider.p-divider-horizontal:before {
border-top: 1px #c8c8c8;
}
.p-divider.p-divider-horizontal .p-divider-content {
padding: 0 0.5rem;
}
.p-divider.p-divider-vertical {
margin: 0 1rem;
padding: 1rem 0;
}
.p-divider.p-divider-vertical:before {
border-left: 1px #c8c8c8;
}
.p-divider.p-divider-vertical .p-divider-content {
padding: 0.5rem 0;
}
.p-inplace .p-inplace-display {
padding: 0.429rem 0.429rem;
border-radius: 3px;

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

@ -2791,6 +2791,30 @@
padding: 0.571rem 1rem;
}
.p-divider .p-divider-content {
background-color: #ffffff;
}
.p-divider.p-divider-horizontal {
margin: 1rem 0;
padding: 0 1rem;
}
.p-divider.p-divider-horizontal:before {
border-top: 1px #c8c8c8;
}
.p-divider.p-divider-horizontal .p-divider-content {
padding: 0 0.5rem;
}
.p-divider.p-divider-vertical {
margin: 0 1rem;
padding: 1rem 0;
}
.p-divider.p-divider-vertical:before {
border-left: 1px #c8c8c8;
}
.p-divider.p-divider-vertical .p-divider-content {
padding: 0.5rem 0;
}
.p-panel .p-panel-header {
border: 1px solid #c8c8c8;
padding: 0.857rem 1rem;
@ -2846,6 +2870,23 @@
border: 0 none;
}
.p-splitter {
border: 1px solid #c8c8c8;
background: #ffffff;
border-radius: 3px;
color: #333333;
}
.p-splitter .p-splitter-gutter {
transition: background-color 0.2s, color 0.2s, box-shadow 0.2s;
background: #eaeaea;
}
.p-splitter .p-splitter-gutter .p-splitter-gutter-handle {
background: #d8dae2;
}
.p-splitter.p-splitter-resizing .p-splitter-gutter {
background: #d8dae2;
}
.p-tabview .p-tabview-nav {
background: transparent;
border: 0 none;
@ -4301,30 +4342,6 @@
background: rgba(0, 0, 0, 0.4);
}
.p-divider .p-divider-content {
background-color: #ffffff;
}
.p-divider.p-divider-horizontal {
margin: 1rem 0;
padding: 0 1rem;
}
.p-divider.p-divider-horizontal:before {
border-top: 1px #c8c8c8;
}
.p-divider.p-divider-horizontal .p-divider-content {
padding: 0 0.5rem;
}
.p-divider.p-divider-vertical {
margin: 0 1rem;
padding: 1rem 0;
}
.p-divider.p-divider-vertical:before {
border-left: 1px #c8c8c8;
}
.p-divider.p-divider-vertical .p-divider-content {
padding: 0.5rem 0;
}
.p-inplace .p-inplace-display {
padding: 0.429rem 0.429rem;
border-radius: 3px;

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

@ -2791,6 +2791,30 @@
padding: 0.571rem 1rem;
}
.p-divider .p-divider-content {
background-color: #ffffff;
}
.p-divider.p-divider-horizontal {
margin: 1rem 0;
padding: 0 1rem;
}
.p-divider.p-divider-horizontal:before {
border-top: 1px #c8c8c8;
}
.p-divider.p-divider-horizontal .p-divider-content {
padding: 0 0.5rem;
}
.p-divider.p-divider-vertical {
margin: 0 1rem;
padding: 1rem 0;
}
.p-divider.p-divider-vertical:before {
border-left: 1px #c8c8c8;
}
.p-divider.p-divider-vertical .p-divider-content {
padding: 0.5rem 0;
}
.p-panel .p-panel-header {
border: 1px solid #c8c8c8;
padding: 0.857rem 1rem;
@ -2846,6 +2870,23 @@
border: 0 none;
}
.p-splitter {
border: 1px solid #c8c8c8;
background: #ffffff;
border-radius: 3px;
color: #333333;
}
.p-splitter .p-splitter-gutter {
transition: background-color 0.2s, color 0.2s, box-shadow 0.2s;
background: #eaeaea;
}
.p-splitter .p-splitter-gutter .p-splitter-gutter-handle {
background: #d8dae2;
}
.p-splitter.p-splitter-resizing .p-splitter-gutter {
background: #d8dae2;
}
.p-tabview .p-tabview-nav {
background: transparent;
border: 0 none;
@ -4301,30 +4342,6 @@
background: rgba(0, 0, 0, 0.4);
}
.p-divider .p-divider-content {
background-color: #ffffff;
}
.p-divider.p-divider-horizontal {
margin: 1rem 0;
padding: 0 1rem;
}
.p-divider.p-divider-horizontal:before {
border-top: 1px #c8c8c8;
}
.p-divider.p-divider-horizontal .p-divider-content {
padding: 0 0.5rem;
}
.p-divider.p-divider-vertical {
margin: 0 1rem;
padding: 1rem 0;
}
.p-divider.p-divider-vertical:before {
border-left: 1px #c8c8c8;
}
.p-divider.p-divider-vertical .p-divider-content {
padding: 0.5rem 0;
}
.p-inplace .p-inplace-display {
padding: 0.429rem 0.429rem;
border-radius: 3px;

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

@ -2779,6 +2779,30 @@
padding: 0.571rem 1rem;
}
.p-divider .p-divider-content {
background-color: #ffffff;
}
.p-divider.p-divider-horizontal {
margin: 1rem 0;
padding: 0 1rem;
}
.p-divider.p-divider-horizontal:before {
border-top: 1px #dadada;
}
.p-divider.p-divider-horizontal .p-divider-content {
padding: 0 0.5rem;
}
.p-divider.p-divider-vertical {
margin: 0 1rem;
padding: 1rem 0;
}
.p-divider.p-divider-vertical:before {
border-left: 1px #dadada;
}
.p-divider.p-divider-vertical .p-divider-content {
padding: 0.5rem 0;
}
.p-panel .p-panel-header {
border: 1px solid #7B95A3;
padding: 0.857rem 1rem;
@ -2834,6 +2858,23 @@
border: 0 none;
}
.p-splitter {
border: 1px solid #dadada;
background: #ffffff;
border-radius: 2px;
color: #666666;
}
.p-splitter .p-splitter-gutter {
transition: background-color 0.2s, color 0.2s, box-shadow 0.2s;
background: #eaeaea;
}
.p-splitter .p-splitter-gutter .p-splitter-gutter-handle {
background: #dadada;
}
.p-splitter.p-splitter-resizing .p-splitter-gutter {
background: #dadada;
}
.p-tabview .p-tabview-nav {
background: transparent;
border: 0 none;
@ -4289,30 +4330,6 @@
background: rgba(0, 0, 0, 0.4);
}
.p-divider .p-divider-content {
background-color: #ffffff;
}
.p-divider.p-divider-horizontal {
margin: 1rem 0;
padding: 0 1rem;
}
.p-divider.p-divider-horizontal:before {
border-top: 1px #dadada;
}
.p-divider.p-divider-horizontal .p-divider-content {
padding: 0 0.5rem;
}
.p-divider.p-divider-vertical {
margin: 0 1rem;
padding: 1rem 0;
}
.p-divider.p-divider-vertical:before {
border-left: 1px #dadada;
}
.p-divider.p-divider-vertical .p-divider-content {
padding: 0.5rem 0;
}
.p-inplace .p-inplace-display {
padding: 0.429rem 0.429rem;
border-radius: 2px;

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

@ -2804,6 +2804,30 @@
padding: 1rem;
}
.p-divider .p-divider-content {
background-color: #ffffff;
}
.p-divider.p-divider-horizontal {
margin: 1rem 0;
padding: 0 1rem;
}
.p-divider.p-divider-horizontal:before {
border-top: 1px #dee2e6;
}
.p-divider.p-divider-horizontal .p-divider-content {
padding: 0 0.5rem;
}
.p-divider.p-divider-vertical {
margin: 0 1rem;
padding: 1rem 0;
}
.p-divider.p-divider-vertical:before {
border-left: 1px #dee2e6;
}
.p-divider.p-divider-vertical .p-divider-content {
padding: 0.5rem 0;
}
.p-panel .p-panel-header {
border: 1px solid #dee2e6;
padding: 1rem;
@ -2859,6 +2883,23 @@
border: 0 none;
}
.p-splitter {
border: 1px solid #dee2e6;
background: #ffffff;
border-radius: 3px;
color: #495057;
}
.p-splitter .p-splitter-gutter {
transition: background-color 0.2s, color 0.2s, box-shadow 0.2s;
background: #f8f9fa;
}
.p-splitter .p-splitter-gutter .p-splitter-gutter-handle {
background: #dee2e6;
}
.p-splitter.p-splitter-resizing .p-splitter-gutter {
background: #dee2e6;
}
.p-tabview .p-tabview-nav {
background: #ffffff;
border: 1px solid #dee2e6;
@ -4338,30 +4379,6 @@
background: rgba(0, 0, 0, 0.4);
}
.p-divider .p-divider-content {
background-color: #ffffff;
}
.p-divider.p-divider-horizontal {
margin: 1rem 0;
padding: 0 1rem;
}
.p-divider.p-divider-horizontal:before {
border-top: 1px #dee2e6;
}
.p-divider.p-divider-horizontal .p-divider-content {
padding: 0 0.5rem;
}
.p-divider.p-divider-vertical {
margin: 0 1rem;
padding: 1rem 0;
}
.p-divider.p-divider-vertical:before {
border-left: 1px #dee2e6;
}
.p-divider.p-divider-vertical .p-divider-content {
padding: 0.5rem 0;
}
.p-inplace .p-inplace-display {
padding: 0.5rem 0.5rem;
border-radius: 3px;

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

@ -2804,6 +2804,30 @@
padding: 1rem;
}
.p-divider .p-divider-content {
background-color: #ffffff;
}
.p-divider.p-divider-horizontal {
margin: 1rem 0;
padding: 0 1rem;
}
.p-divider.p-divider-horizontal:before {
border-top: 1px #dee2e6;
}
.p-divider.p-divider-horizontal .p-divider-content {
padding: 0 0.5rem;
}
.p-divider.p-divider-vertical {
margin: 0 1rem;
padding: 1rem 0;
}
.p-divider.p-divider-vertical:before {
border-left: 1px #dee2e6;
}
.p-divider.p-divider-vertical .p-divider-content {
padding: 0.5rem 0;
}
.p-panel .p-panel-header {
border: 1px solid #dee2e6;
padding: 1rem;
@ -2859,6 +2883,23 @@
border: 0 none;
}
.p-splitter {
border: 1px solid #dee2e6;
background: #ffffff;
border-radius: 3px;
color: #495057;
}
.p-splitter .p-splitter-gutter {
transition: background-color 0.2s, color 0.2s, box-shadow 0.2s;
background: #f8f9fa;
}
.p-splitter .p-splitter-gutter .p-splitter-gutter-handle {
background: #dee2e6;
}
.p-splitter.p-splitter-resizing .p-splitter-gutter {
background: #dee2e6;
}
.p-tabview .p-tabview-nav {
background: #ffffff;
border: 1px solid #dee2e6;
@ -4338,30 +4379,6 @@
background: rgba(0, 0, 0, 0.4);
}
.p-divider .p-divider-content {
background-color: #ffffff;
}
.p-divider.p-divider-horizontal {
margin: 1rem 0;
padding: 0 1rem;
}
.p-divider.p-divider-horizontal:before {
border-top: 1px #dee2e6;
}
.p-divider.p-divider-horizontal .p-divider-content {
padding: 0 0.5rem;
}
.p-divider.p-divider-vertical {
margin: 0 1rem;
padding: 1rem 0;
}
.p-divider.p-divider-vertical:before {
border-left: 1px #dee2e6;
}
.p-divider.p-divider-vertical .p-divider-content {
padding: 0.5rem 0;
}
.p-inplace .p-inplace-display {
padding: 0.5rem 0.5rem;
border-radius: 3px;

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

@ -2804,6 +2804,30 @@
padding: 1rem;
}
.p-divider .p-divider-content {
background-color: #ffffff;
}
.p-divider.p-divider-horizontal {
margin: 1rem 0;
padding: 0 1rem;
}
.p-divider.p-divider-horizontal:before {
border-top: 1px #dee2e6;
}
.p-divider.p-divider-horizontal .p-divider-content {
padding: 0 0.5rem;
}
.p-divider.p-divider-vertical {
margin: 0 1rem;
padding: 1rem 0;
}
.p-divider.p-divider-vertical:before {
border-left: 1px #dee2e6;
}
.p-divider.p-divider-vertical .p-divider-content {
padding: 0.5rem 0;
}
.p-panel .p-panel-header {
border: 1px solid #dee2e6;
padding: 1rem;
@ -2859,6 +2883,23 @@
border: 0 none;
}
.p-splitter {
border: 1px solid #dee2e6;
background: #ffffff;
border-radius: 3px;
color: #495057;
}
.p-splitter .p-splitter-gutter {
transition: background-color 0.2s, color 0.2s, box-shadow 0.2s;
background: #f8f9fa;
}
.p-splitter .p-splitter-gutter .p-splitter-gutter-handle {
background: #dee2e6;
}
.p-splitter.p-splitter-resizing .p-splitter-gutter {
background: #dee2e6;
}
.p-tabview .p-tabview-nav {
background: #ffffff;
border: 1px solid #dee2e6;
@ -4338,30 +4379,6 @@
background: rgba(0, 0, 0, 0.4);
}
.p-divider .p-divider-content {
background-color: #ffffff;
}
.p-divider.p-divider-horizontal {
margin: 1rem 0;
padding: 0 1rem;
}
.p-divider.p-divider-horizontal:before {
border-top: 1px #dee2e6;
}
.p-divider.p-divider-horizontal .p-divider-content {
padding: 0 0.5rem;
}
.p-divider.p-divider-vertical {
margin: 0 1rem;
padding: 1rem 0;
}
.p-divider.p-divider-vertical:before {
border-left: 1px #dee2e6;
}
.p-divider.p-divider-vertical .p-divider-content {
padding: 0.5rem 0;
}
.p-inplace .p-inplace-display {
padding: 0.5rem 0.5rem;
border-radius: 3px;

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

@ -2804,6 +2804,30 @@
padding: 1rem;
}
.p-divider .p-divider-content {
background-color: #ffffff;
}
.p-divider.p-divider-horizontal {
margin: 1rem 0;
padding: 0 1rem;
}
.p-divider.p-divider-horizontal:before {
border-top: 1px #dee2e6;
}
.p-divider.p-divider-horizontal .p-divider-content {
padding: 0 0.5rem;
}
.p-divider.p-divider-vertical {
margin: 0 1rem;
padding: 1rem 0;
}
.p-divider.p-divider-vertical:before {
border-left: 1px #dee2e6;
}
.p-divider.p-divider-vertical .p-divider-content {
padding: 0.5rem 0;
}
.p-panel .p-panel-header {
border: 1px solid #dee2e6;
padding: 1rem;
@ -2859,6 +2883,23 @@
border: 0 none;
}
.p-splitter {
border: 1px solid #dee2e6;
background: #ffffff;
border-radius: 3px;
color: #495057;
}
.p-splitter .p-splitter-gutter {
transition: background-color 0.2s, color 0.2s, box-shadow 0.2s;
background: #f8f9fa;
}
.p-splitter .p-splitter-gutter .p-splitter-gutter-handle {
background: #dee2e6;
}
.p-splitter.p-splitter-resizing .p-splitter-gutter {
background: #dee2e6;
}
.p-tabview .p-tabview-nav {
background: #ffffff;
border: 1px solid #dee2e6;
@ -4338,30 +4379,6 @@
background: rgba(0, 0, 0, 0.4);
}
.p-divider .p-divider-content {
background-color: #ffffff;
}
.p-divider.p-divider-horizontal {
margin: 1rem 0;
padding: 0 1rem;
}
.p-divider.p-divider-horizontal:before {
border-top: 1px #dee2e6;
}
.p-divider.p-divider-horizontal .p-divider-content {
padding: 0 0.5rem;
}
.p-divider.p-divider-vertical {
margin: 0 1rem;
padding: 1rem 0;
}
.p-divider.p-divider-vertical:before {
border-left: 1px #dee2e6;
}
.p-divider.p-divider-vertical .p-divider-content {
padding: 0.5rem 0;
}
.p-inplace .p-inplace-display {
padding: 0.5rem 0.5rem;
border-radius: 3px;

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

@ -2804,6 +2804,30 @@
padding: 1rem;
}
.p-divider .p-divider-content {
background-color: #1f2d40;
}
.p-divider.p-divider-horizontal {
margin: 1rem 0;
padding: 0 1rem;
}
.p-divider.p-divider-horizontal:before {
border-top: 1px #304562;
}
.p-divider.p-divider-horizontal .p-divider-content {
padding: 0 0.5rem;
}
.p-divider.p-divider-vertical {
margin: 0 1rem;
padding: 1rem 0;
}
.p-divider.p-divider-vertical:before {
border-left: 1px #304562;
}
.p-divider.p-divider-vertical .p-divider-content {
padding: 0.5rem 0;
}
.p-panel .p-panel-header {
border: 1px solid #304562;
padding: 1rem;
@ -2859,6 +2883,23 @@
border: 0 none;
}
.p-splitter {
border: 1px solid #304562;
background: #1f2d40;
border-radius: 3px;
color: rgba(255, 255, 255, 0.87);
}
.p-splitter .p-splitter-gutter {
transition: background-color 0.2s, color 0.2s, box-shadow 0.2s;
background: rgba(255, 255, 255, 0.03);
}
.p-splitter .p-splitter-gutter .p-splitter-gutter-handle {
background: #304562;
}
.p-splitter.p-splitter-resizing .p-splitter-gutter {
background: #304562;
}
.p-tabview .p-tabview-nav {
background: transparent;
border: 1px solid #304562;
@ -4338,30 +4379,6 @@
background: rgba(0, 0, 0, 0.4);
}
.p-divider .p-divider-content {
background-color: #1f2d40;
}
.p-divider.p-divider-horizontal {
margin: 1rem 0;
padding: 0 1rem;
}
.p-divider.p-divider-horizontal:before {
border-top: 1px #304562;
}
.p-divider.p-divider-horizontal .p-divider-content {
padding: 0 0.5rem;
}
.p-divider.p-divider-vertical {
margin: 0 1rem;
padding: 1rem 0;
}
.p-divider.p-divider-vertical:before {
border-left: 1px #304562;
}
.p-divider.p-divider-vertical .p-divider-content {
padding: 0.5rem 0;
}
.p-inplace .p-inplace-display {
padding: 0.5rem 0.5rem;
border-radius: 3px;

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

@ -2804,6 +2804,30 @@
padding: 1rem;
}
.p-divider .p-divider-content {
background-color: #1f2d40;
}
.p-divider.p-divider-horizontal {
margin: 1rem 0;
padding: 0 1rem;
}
.p-divider.p-divider-horizontal:before {
border-top: 1px #304562;
}
.p-divider.p-divider-horizontal .p-divider-content {
padding: 0 0.5rem;
}
.p-divider.p-divider-vertical {
margin: 0 1rem;
padding: 1rem 0;
}
.p-divider.p-divider-vertical:before {
border-left: 1px #304562;
}
.p-divider.p-divider-vertical .p-divider-content {
padding: 0.5rem 0;
}
.p-panel .p-panel-header {
border: 1px solid #304562;
padding: 1rem;
@ -2859,6 +2883,23 @@
border: 0 none;
}
.p-splitter {
border: 1px solid #304562;
background: #1f2d40;
border-radius: 3px;
color: rgba(255, 255, 255, 0.87);
}
.p-splitter .p-splitter-gutter {
transition: background-color 0.2s, color 0.2s, box-shadow 0.2s;
background: rgba(255, 255, 255, 0.03);
}
.p-splitter .p-splitter-gutter .p-splitter-gutter-handle {
background: #304562;
}
.p-splitter.p-splitter-resizing .p-splitter-gutter {
background: #304562;
}
.p-tabview .p-tabview-nav {
background: transparent;
border: 1px solid #304562;
@ -4338,30 +4379,6 @@
background: rgba(0, 0, 0, 0.4);
}
.p-divider .p-divider-content {
background-color: #1f2d40;
}
.p-divider.p-divider-horizontal {
margin: 1rem 0;
padding: 0 1rem;
}
.p-divider.p-divider-horizontal:before {
border-top: 1px #304562;
}
.p-divider.p-divider-horizontal .p-divider-content {
padding: 0 0.5rem;
}
.p-divider.p-divider-vertical {
margin: 0 1rem;
padding: 1rem 0;
}
.p-divider.p-divider-vertical:before {
border-left: 1px #304562;
}
.p-divider.p-divider-vertical .p-divider-content {
padding: 0.5rem 0;
}
.p-inplace .p-inplace-display {
padding: 0.5rem 0.5rem;
border-radius: 3px;

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

@ -2804,6 +2804,30 @@
padding: 1rem;
}
.p-divider .p-divider-content {
background-color: #1f2d40;
}
.p-divider.p-divider-horizontal {
margin: 1rem 0;
padding: 0 1rem;
}
.p-divider.p-divider-horizontal:before {
border-top: 1px #304562;
}
.p-divider.p-divider-horizontal .p-divider-content {
padding: 0 0.5rem;
}
.p-divider.p-divider-vertical {
margin: 0 1rem;
padding: 1rem 0;
}
.p-divider.p-divider-vertical:before {
border-left: 1px #304562;
}
.p-divider.p-divider-vertical .p-divider-content {
padding: 0.5rem 0;
}
.p-panel .p-panel-header {
border: 1px solid #304562;
padding: 1rem;
@ -2859,6 +2883,23 @@
border: 0 none;
}
.p-splitter {
border: 1px solid #304562;
background: #1f2d40;
border-radius: 3px;
color: rgba(255, 255, 255, 0.87);
}
.p-splitter .p-splitter-gutter {
transition: background-color 0.2s, color 0.2s, box-shadow 0.2s;
background: rgba(255, 255, 255, 0.03);
}
.p-splitter .p-splitter-gutter .p-splitter-gutter-handle {
background: #304562;
}
.p-splitter.p-splitter-resizing .p-splitter-gutter {
background: #304562;
}
.p-tabview .p-tabview-nav {
background: transparent;
border: 1px solid #304562;
@ -4338,30 +4379,6 @@
background: rgba(0, 0, 0, 0.4);
}
.p-divider .p-divider-content {
background-color: #1f2d40;
}
.p-divider.p-divider-horizontal {
margin: 1rem 0;
padding: 0 1rem;
}
.p-divider.p-divider-horizontal:before {
border-top: 1px #304562;
}
.p-divider.p-divider-horizontal .p-divider-content {
padding: 0 0.5rem;
}
.p-divider.p-divider-vertical {
margin: 0 1rem;
padding: 1rem 0;
}
.p-divider.p-divider-vertical:before {
border-left: 1px #304562;
}
.p-divider.p-divider-vertical .p-divider-content {
padding: 0.5rem 0;
}
.p-inplace .p-inplace-display {
padding: 0.5rem 0.5rem;
border-radius: 3px;

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

@ -2804,6 +2804,30 @@
padding: 1rem;
}
.p-divider .p-divider-content {
background-color: #1f2d40;
}
.p-divider.p-divider-horizontal {
margin: 1rem 0;
padding: 0 1rem;
}
.p-divider.p-divider-horizontal:before {
border-top: 1px #304562;
}
.p-divider.p-divider-horizontal .p-divider-content {
padding: 0 0.5rem;
}
.p-divider.p-divider-vertical {
margin: 0 1rem;
padding: 1rem 0;
}
.p-divider.p-divider-vertical:before {
border-left: 1px #304562;
}
.p-divider.p-divider-vertical .p-divider-content {
padding: 0.5rem 0;
}
.p-panel .p-panel-header {
border: 1px solid #304562;
padding: 1rem;
@ -2859,6 +2883,23 @@
border: 0 none;
}
.p-splitter {
border: 1px solid #304562;
background: #1f2d40;
border-radius: 3px;
color: rgba(255, 255, 255, 0.87);
}
.p-splitter .p-splitter-gutter {
transition: background-color 0.2s, color 0.2s, box-shadow 0.2s;
background: rgba(255, 255, 255, 0.03);
}
.p-splitter .p-splitter-gutter .p-splitter-gutter-handle {
background: #304562;
}
.p-splitter.p-splitter-resizing .p-splitter-gutter {
background: #304562;
}
.p-tabview .p-tabview-nav {
background: transparent;
border: 1px solid #304562;
@ -4338,30 +4379,6 @@
background: rgba(0, 0, 0, 0.4);
}
.p-divider .p-divider-content {
background-color: #1f2d40;
}
.p-divider.p-divider-horizontal {
margin: 1rem 0;
padding: 0 1rem;
}
.p-divider.p-divider-horizontal:before {
border-top: 1px #304562;
}
.p-divider.p-divider-horizontal .p-divider-content {
padding: 0 0.5rem;
}
.p-divider.p-divider-vertical {
margin: 0 1rem;
padding: 1rem 0;
}
.p-divider.p-divider-vertical:before {
border-left: 1px #304562;
}
.p-divider.p-divider-vertical .p-divider-content {
padding: 0.5rem 0;
}
.p-inplace .p-inplace-display {
padding: 0.5rem 0.5rem;
border-radius: 3px;

3
src/AppMenu.vue
View File

@ -166,8 +166,10 @@
<router-link to="/accordion">Accordion</router-link>
<router-link to="/card">Card</router-link>
<router-link to="/deferredcontent">Deferred</router-link>
<router-link to="/divider">Divider <Tag value="New"></Tag></router-link>
<router-link to="/fieldset">Fieldset</router-link>
<router-link to="/panel">Panel</router-link>
<router-link to="/splitter">Splitter <Tag value="New"></Tag></router-link>
<router-link to="/scrollpanel">ScrollPanel</router-link>
<router-link to="/tabview">TabView</router-link>
<router-link to="/toolbar">Toolbar</router-link>
@ -251,7 +253,6 @@
<router-link to="/avatar">Avatar <Tag value="New"></Tag></router-link>
<router-link to="/badge">Badge <Tag value="New"></Tag></router-link>
<router-link to="/blockui">BlockUI</router-link>
<router-link to="/divider">Divider <Tag value="New"></Tag></router-link>
<router-link to="/inplace">Inplace</router-link>
<router-link to="/scrolltop">ScrollTop <Tag value="New"></Tag></router-link>
<router-link to="/skeleton">Skeleton <Tag value="New"></Tag></router-link>

8
src/components/splitter/Splitter.d.ts vendored Normal file
View File

@ -0,0 +1,8 @@
import Vue from 'vue';
declare class Splitter extends Vue {
layout?: string;
gutterSize?: number;
}
export default Splitter;

226
src/components/splitter/Splitter.vue Normal file
View File

@ -0,0 +1,226 @@
<template>
<div :class="containerClass">
<template v-for="(panel,i) of panels" :key="i" class="p-splitter-panel">
<component :is="panel"></component>
<div ref="gutter" class="p-splitter-gutter" v-if="i !== (panels.length -1)" :style="gutterStyle" @mousedown="onGutterMouseDown($event)">
<div class="p-splitter-gutter-handle"></div>
</div>
</template>
</div>
</template>
<script>
import DomHandler from '../utils/DomHandler';
export default {
name: 'splitter',
props: {
layout: {
type: String,
default: 'horizontal'
},
gutterSize: {
type: Number,
default: 4
}
},
dragging: false,
mouseMoveListener: null,
mouseUpListener: null,
size: null,
startPos: null,
prevPanelElement: null,
nextPanelElement: null,
nextPanelSize: null,
prevPanelSize: null,
mounted() {
this.initialize();
},
beforeUnmount() {
this.clear();
this.unbindListeners();
},
methods: {
isSplitterPanel(child) {
return child.type.name === 'splitterpanel';
},
initialize() {
if (this.panels && this.panels.length) {
let children = [...this.$el.children].filter(child => DomHandler.hasClass(child, 'p-splitter-panel'));
this.panels.forEach((panel, i) => {
let panelSize = panel.props && panel.props.size ? panel.props.size: null;
if (panelSize)
children[i].style.flexBasis = 'calc(' + panelSize + '% - ' + ((this.panels.length - 1) * this.gutterSize) + 'px)';
else
children[i].style.flexBasis = 'calc(' + (100 / this.panels.length) + '% - ' + ((this.panels.length - 1) * this.gutterSize) + 'px)';
});
}
},
onGutterMouseDown(event) {
this.size = this.horizontal ? DomHandler.getWidth(this.$el) : DomHandler.getHeight(this.$el);
this.dragging = true;
this.startPos = this.layout === 'horizontal' ? event.pageX : event.pageY;
this.prevPanelElement = event.currentTarget.previousElementSibling;
this.nextPanelElement = event.currentTarget.nextElementSibling;
this.prevPanelSize = 100 * (this.horizontal ? DomHandler.getOuterWidth(this.prevPanelElement, true): DomHandler.getOuterHeight(this.prevPanelElement, true)) / this.size;
this.nextPanelSize = 100 * (this.horizontal ? DomHandler.getOuterWidth(this.nextPanelElement, true): DomHandler.getOuterHeight(this.nextPanelElement, true)) / this.size;
DomHandler.addClass(this.$el, 'p-splitter-resizing');
this.bindListeners();
},
bindListeners() {
if (!this.mouseMoveListener) {
this.mouseMoveListener = event => {
let newPos;
if (this.horizontal)
newPos = (event.pageX * 100 / this.size) - (this.startPos * 100 / this.size);
else
newPos = (event.pageY * 100 / this.size) - (this.startPos * 100 / this.size);
let newPrevPanelSize = this.prevPanelSize + newPos;
let newNextPanelSize = this.nextPanelSize - newPos;
if (this.validateResize(newPrevPanelSize, newNextPanelSize)) {
this.prevPanelElement.style.flexBasis = 'calc(' + newPrevPanelSize + '% - ' + ((this.panels.length - 1) * this.gutterSize) + 'px)';
this.nextPanelElement.style.flexBasis = 'calc(' + newNextPanelSize + '% - ' + ((this.panels.length - 1) * this.gutterSize) + 'px)';
}
};
document.addEventListener('mousemove', this.mouseMoveListener);
}
if (!this.mouseUpListener) {
this.mouseUpListener = () => {
this.clear();
this.unbindListeners();
};
document.addEventListener('mouseup', this.mouseUpListener);
}
},
validateResize(newPrevPanelSize, newNextPanelSize) {
if (this.panels[0].props && this.panels[0].props.minSize && this.panels[0].props.minSize > newPrevPanelSize) {
return false;
}
if (this.panels[1].props && this.panels[1].props.minSize && this.panels[1].props.minSize > newNextPanelSize) {
return false;
}
return true;
},
unbindListeners() {
if (this.mouseMoveListener) {
document.removeEventListener('mousemove', this.mouseMoveListener);
this.mouseMoveListener = null;
}
if (this.mouseUpListener) {
document.removeEventListener('mouseup', this.mouseUpListener);
this.mouseUpListener = null;
}
},
clear() {
this.dragging = false;
this.size = null;
this.startPos = null;
this.prevPanelElement = null;
this.nextPanelElement = null;
this.prevPanelSize = null;
this.nextPanelSize = null;
DomHandler.removeClass(this.$el, 'p-splitter-resizing');
}
},
computed: {
containerClass() {
return ['p-splitter p-component', 'p-splitter-' + this.layout];
},
panels() {
const panels = [];
this.$slots.default().forEach(child => {
if (this.isSplitterPanel(child)) {
panels.push(child);
}
else if (child.children.length > 0) {
child.children.forEach(nestedChild => {
if (this.isSplitterPanel(nestedChild)) {
panels.push(nestedChild)
}
});
}
}
)
return panels;
},
gutterStyle() {
if (this.horizontal)
return {width: this.gutterSize + 'px'};
else
return {height: this.gutterSize + 'px'};
},
horizontal() {
return this.layout === 'horizontal';
}
}
}
</script>
<style>
.p-splitter {
display: flex;
flex-wrap: nowrap;
}
.p-splitter-vertical {
flex-direction: column;
}
.p-splitter-panel {
flex-grow: 1;
}
.p-splitter-panel-nested {
display: flex;
}
.p-splitter-panel .p-splitter {
flex-grow: 1;
border: 0 none;
}
.p-splitter-gutter {
flex-grow: 0;
flex-shrink: 0;
display: flex;
align-items: center;
justify-content: center;
cursor: col-resize;
}
.p-splitter-horizontal.p-splitter-resizing {
cursor: col-resize;
user-select: none;
}
.p-splitter-horizontal > .p-splitter-gutter > .p-splitter-gutter-handle {
height: 24px;
width: 100%;
}
.p-splitter-horizontal > .p-splitter-gutter {
cursor: col-resize;
}
.p-splitter-vertical.p-splitter-resizing {
cursor: row-resize;
user-select: none;
}
.p-splitter-vertical > .p-splitter-gutter {
cursor: row-resize;
}
.p-splitter-vertical > .p-splitter-gutter > .p-splitter-gutter-handle {
width: 24px;
height: 100%;
}
</style>

8
src/components/splitterpanel/SplitterPanel.d.ts vendored Normal file
View File

@ -0,0 +1,8 @@
import Vue from 'vue';
declare class SplitterPanel extends Vue {
size?: number;
minSize?: number;
}
export default SplitterPanel;

31
src/components/splitterpanel/SplitterPanel.vue Normal file
View File

@ -0,0 +1,31 @@
<template>
<div ref="container" :class="containerClass">
<slot></slot>
</div>
</template>
<script>
export default {
name: 'splitterpanel',
props: {
size: {
type: Number,
default: null
},
minSize: {
type: Number,
default: null
}
},
computed: {
containerClass() {
return ['p-splitter-panel', {'p-splitter-panel-nested': this.isNested}];
},
isNested() {
return this.$slots.default().some(child => {
return child.type.name === 'splitter';
});
}
}
}
</script>

4
src/main.js
View File

@ -68,6 +68,8 @@ import Skeleton from './components/skeleton/Skeleton';
import Slider from './components/slider/Slider';
import Sidebar from './components/sidebar/Sidebar';
import SplitButton from './components/splitbutton/SplitButton';
import Splitter from './components/splitter/Splitter';
import SplitterPanel from './components/splitterpanel/SplitterPanel';
import Steps from './components/steps/Steps';
import TabMenu from './components/tabmenu/TabMenu';
import TabView from './components/tabview/TabView';
@ -180,6 +182,8 @@ app.component('Slider', Slider);
app.component('Sidebar', Sidebar);
app.component('Skeleton', Skeleton);
app.component('SplitButton', SplitButton);
app.component('Splitter', Splitter);
app.component('SplitterPanel', SplitterPanel);
app.component('Steps', Steps);
app.component('TabView', TabView);
app.component('TabPanel', TabPanel);

5
src/router/index.js
View File

@ -392,6 +392,11 @@ const routes = [
name: 'skeleton',
component: () => import('../views/skeleton/SkeletonDemo.vue')
},
{
path: '/splitter',
name: 'splitter',
component: () => import('../views/splitter/SplitterDemo.vue')
},
{
path: '/listbox',
name: 'listbox',

3
src/views/progressbar/ProgressBarDoc.vue
View File

@ -44,6 +44,7 @@ data() {
</code></pre>
<h5>Properties</h5>
<p>Any property as style and class are passed to the main container element. Following are the additional properties to configure the component.</p>
<div class="doc-tablewrapper">
<table class="doc-table">
<thead>
@ -117,7 +118,7 @@ data() {
</TabPanel>
<TabPanel header="Source">
<a href="https://github.com/primefaces/primevue/tree/master/src/views/prograssbar" class="btn-viewsource" target="_blank" rel="noopener noreferrer">
<a href="https://github.com/primefaces/primevue/tree/master/src/views/progressbar" class="btn-viewsource" target="_blank" rel="noopener noreferrer">
<span>View on GitHub</span>
</a>
<pre v-code>

74
src/views/splitter/SplitterDemo.vue Normal file
View File

@ -0,0 +1,74 @@
<template>
<div>
<div class="content-section introduction">
<div class="feature-intro">
<h1>Splitter</h1>
<p>Splitter is utilized to separate and resize panels.</p>
</div>
</div>
<div class="content-section implementation">
<div class="card">
<h5>Horizontal</h5>
<Splitter style="height: 300px">
<SplitterPanel class="p-d-flex p-ai-center p-jc-center">
Panel 1
</SplitterPanel>
<SplitterPanel class="p-d-flex p-ai-center p-jc-center">
Panel 2
</SplitterPanel>
</Splitter>
</div>
<div class="card">
<h5>Vertical</h5>
<Splitter style="height: 300px" layout="vertical">
<SplitterPanel class="p-d-flex p-ai-center p-jc-center">
Panel 1
</SplitterPanel>
<SplitterPanel class="p-d-flex p-ai-center p-jc-center">
Panel 2
</SplitterPanel>
</Splitter>
</div>
<div class="card">
<h5>Nested</h5>
<Splitter style="height: 300px">
<SplitterPanel class="p-d-flex p-ai-center p-jc-center" :size="20" :minSize="10">
Panel 1
</SplitterPanel>
<SplitterPanel :size="80">
<Splitter layout="vertical">
<SplitterPanel class="p-d-flex p-ai-center p-jc-center" :size="15">
Panel 2
</SplitterPanel>
<SplitterPanel :size="85">
<Splitter>
<SplitterPanel class="p-d-flex p-ai-center p-jc-center" :size="20">
Panel 3
</SplitterPanel>
<SplitterPanel class="p-d-flex p-ai-center p-jc-center" :size="80">
Panel 4
</SplitterPanel>
</Splitter>
</SplitterPanel>
</Splitter>
</SplitterPanel>
</Splitter>
</div>
</div>
<SplitterDoc />
</div>
</template>
<script>
import SplitterDoc from './SplitterDoc';
export default {
components: {
'SplitterDoc': SplitterDoc
}
}
</script>

268
src/views/splitter/SplitterDoc.vue Normal file
View File

@ -0,0 +1,268 @@
<template>
<div class="content-section documentation">
<TabView>
<TabPanel header="Documentation">
<h5>Import</h5>
<pre v-code.script>
<code>
import Splitter from 'primevue/splitter';
import SplitterPanel from 'primevue/splitterpanel';
</code></pre>
<h5>Getting Started</h5>
<p>Splitter requires two SplitterPanel components to wrap.</p>
<pre v-code>
<code>
&lt;Splitter style="height: 300px"&gt;
&lt;SplitterPanel&gt;
Panel 1
&lt;/SplitterPanel&gt;
&lt;SplitterPanel&gt;
Panel 2
&lt;/SplitterPanel&gt;
&lt;/Splitter&gt;
</code></pre>
<h5>Layout</h5>
<p>Default orientation is configured with the <i>layout</i> property and default is the "horizontal" whereas other alternative is the "vertical".</p>
<pre v-code>
<code>
&lt;Splitter style="height: 300px" layout="vertical"&gt;
&lt;SplitterPanel&gt;
Panel 1
&lt;/SplitterPanel&gt;
&lt;SplitterPanel&gt;
Panel 2
&lt;/SplitterPanel&gt;
&lt;/Splitter&gt;
</code></pre>
<h5>Initial Sizes</h5>
<p>When no size is defined, panels are split 50/50, use the <i>size</i> property to give relative widths e.g. 20/80.</p>
<pre v-code>
<code>
&lt;Splitter style="height: 300px"&gt;
&lt;SplitterPanel :size="20" &gt;
Panel 1
&lt;/SplitterPanel&gt;
&lt;SplitterPanel :size="80"&gt;
Panel 2
&lt;/SplitterPanel&gt;
&lt;/Splitter&gt;
</code></pre>
<h5>Minimum Size</h5>
<p>Minimum size defines the lowest boundary for the size of a panel.</p>
<pre v-code>
<code>
&lt;Splitter style="height: 300px"&gt;
&lt;SplitterPanel :size="20" :minSize="10"&gt;
Panel 1
&lt;/SplitterPanel&gt;
&lt;SplitterPanel :size="80" :minSize="20"&gt;
Panel 2
&lt;/SplitterPanel&gt;
&lt;/Splitter&gt;
</code></pre>
<h5>Nested Panels</h5>
<p>Splitters can be combined to create advanced layouts.</p>
<pre v-code>
<code>
&lt;Splitter style="height: 300px"&gt;
&lt;SplitterPanel class="p-d-flex p-ai-center p-jc-center" :size="20" :minSize="10"&gt;
Panel 1
&lt;/SplitterPanel&gt;
&lt;SplitterPanel :size="80"&gt;
&lt;Splitter layout="vertical"&gt;
&lt;SplitterPanel class="p-d-flex p-ai-center p-jc-center" :size="15"&gt;
Panel 2
&lt;/SplitterPanel&gt;
&lt;SplitterPanel :size="85"&gt;
&lt;Splitter&gt;
&lt;SplitterPanel class="p-d-flex p-ai-center p-jc-center" :size="20"&gt;
Panel 3
&lt;/SplitterPanel&gt;
&lt;SplitterPanel class="p-d-flex p-ai-center p-jc-center" :size="80"&gt;
Panel 4
&lt;/SplitterPanel&gt;
&lt;/Splitter&gt;
&lt;/SplitterPanel&gt;
&lt;/Splitter&gt;
&lt;/SplitterPanel&gt;
&lt;/Splitter&gt;
</code></pre>
<h5>Properties of SplitterPanel</h5>
<p>Any property as style and class are passed to the main container element. Following are the additional properties to configure the component.</p>
<div class="doc-tablewrapper">
<table class="doc-table">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th>Default</th>
<th>Description</th>
</tr>
</thead>
<tbody>
<tr>
<td>size</td>
<td>number</td>
<td>null</td>
<td>Size of the element relative to 100%.</td>
</tr>
<tr>
<td>minSize</td>
<td>number</td>
<td>null</td>
<td>Minimum size of the element relative to 100%.</td>
</tr>
</tbody>
</table>
</div>
<h5>Properties of Splitter</h5>
<p>Any property as style and class are passed to the main container element. Following are the additional properties to configure the component.</p>
<div class="doc-tablewrapper">
<table class="doc-table">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th>Default</th>
<th>Description</th>
</tr>
</thead>
<tbody>
<tr>
<td>layout</td>
<td>string</td>
<td>horizontal</td>
<td>Orientation of the panels, valid values are "horizontal" and "vertical".</td>
</tr>
<tr>
<td>gutterSize</td>
<td>number</td>
<td>4</td>
<td>Size of the divider in pixels.</td>
</tr>
</tbody>
</table>
</div>
<h5>Styling</h5>
<p>Following is the list of structural style classes, for theming classes visit <router-link to="/theming">theming</router-link> page.</p>
<div class="doc-tablewrapper">
<table class="doc-table">
<thead>
<tr>
<th>Name</th>
<th>Element</th>
</tr>
</thead>
<tbody>
<tr>
<td>p-splitter</td>
<td>Container element.</td>
</tr>
<tr>
<td>p-splitter</td>
<td>Container element during resize.</td>
</tr>
<tr>
<td>p-splitter-horizontal</td>
<td>Container element with horizontal layout.</td>
</tr>
<tr>
<td>p-splitter-vertical</td>
<td>Container element with vertical layout.</td>
</tr>
<tr>
<td>p-splitter-panel</td>
<td>Splitter panel element.</td>
</tr>
<tr>
<td>p-splitter-gutter</td>
<td>Gutter element to use when resizing the panels.</td>
</tr>
<tr>
<td>p-splitter-gutter-handle</td>
<td>Handl element of the gutter.</td>
</tr>
</tbody>
</table>
</div>
<h5>Dependencies</h5>
<p>None.</p>
</TabPanel>
<TabPanel header="Source">
<a href="https://github.com/primefaces/primevue/tree/master/src/views/splitter" class="btn-viewsource" target="_blank" rel="noopener noreferrer">
<span>View on GitHub</span>
</a>
<pre v-code>
<code><template v-pre>
&lt;div class="card"&gt;
&lt;h5&gt;Horizontal&lt;/h5&gt;
&lt;Splitter style="height: 300px"&gt;
&lt;SplitterPanel class="p-d-flex p-ai-center p-jc-center"&gt;
Panel 1
&lt;/SplitterPanel&gt;
&lt;SplitterPanel class="p-d-flex p-ai-center p-jc-center"&gt;
Panel 2
&lt;/SplitterPanel&gt;
&lt;/Splitter&gt;
&lt;/div&gt;
&lt;div class="card"&gt;
&lt;h5&gt;Vertical&lt;/h5&gt;
&lt;Splitter style="height: 300px" layout="vertical"&gt;
&lt;SplitterPanel class="p-d-flex p-ai-center p-jc-center"&gt;
Panel 1
&lt;/SplitterPanel&gt;
&lt;SplitterPanel class="p-d-flex p-ai-center p-jc-center"&gt;
Panel 2
&lt;/SplitterPanel&gt;
&lt;/Splitter&gt;
&lt;/div&gt;
&lt;div class="card"&gt;
&lt;h5&gt;Nested&lt;/h5&gt;
&lt;Splitter style="height: 300px"&gt;
&lt;SplitterPanel class="p-d-flex p-ai-center p-jc-center" :size="20" :minSize="10"&gt;
Panel 1
&lt;/SplitterPanel&gt;
&lt;SplitterPanel :size="80"&gt;
&lt;Splitter layout="vertical"&gt;
&lt;SplitterPanel class="p-d-flex p-ai-center p-jc-center" :size="15"&gt;
Panel 2
&lt;/SplitterPanel&gt;
&lt;SplitterPanel :size="85"&gt;
&lt;Splitter&gt;
&lt;SplitterPanel class="p-d-flex p-ai-center p-jc-center" :size="20"&gt;
Panel 3
&lt;/SplitterPanel&gt;
&lt;SplitterPanel class="p-d-flex p-ai-center p-jc-center" :size="80"&gt;
Panel 4
&lt;/SplitterPanel&gt;
&lt;/Splitter&gt;
&lt;/SplitterPanel&gt;
&lt;/Splitter&gt;
&lt;/SplitterPanel&gt;
&lt;/Splitter&gt;
&lt;/div&gt;
</template>
</code></pre>
</TabPanel>
</TabView>
</div>
</template>