Splitter Component - #737

primefaces · Dec 3, 2020 · ff72e63 · ff72e63
1 parent 5323d88
commit ff72e63
Show file tree

Hide file tree

Showing 48 changed files with 2,030 additions and 818 deletions.
diff --git a/exports/splitter.d.ts b/exports/splitter.d.ts
@@ -0,0 +1 @@
+export * from './components/splitter/Splitter';
diff --git a/exports/splitter.js b/exports/splitter.js
@@ -0,0 +1,3 @@
+'use strict';
+module.exports = require('./components/splitter/Splitter.vue');
+
diff --git a/exports/splitterpanel.d.ts b/exports/splitterpanel.d.ts
@@ -0,0 +1 @@
+export * from './components/splitterpanel/SplitterPanel';
diff --git a/exports/splitterpanel.js b/exports/splitterpanel.js
@@ -0,0 +1,3 @@
+'use strict';
+module.exports = require('./components/splitterpanel/SplitterPanel.vue');
+
diff --git a/public/themes/arya-blue/theme.css b/public/themes/arya-blue/theme.css
@@ -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;

diff --git a/public/themes/arya-green/theme.css b/public/themes/arya-green/theme.css
@@ -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;

diff --git a/public/themes/arya-orange/theme.css b/public/themes/arya-orange/theme.css
@@ -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;

diff --git a/public/themes/arya-purple/theme.css b/public/themes/arya-purple/theme.css
@@ -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;