@leapdev/gui 0.2.230 → 0.2.235

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.html CHANGED
@@ -4,7 +4,7 @@
4
4
  <meta charset="utf-8">
5
5
  <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
6
6
  <title>GUI v3</title>
7
- <link href="css/x1-leap.css?a84a8731d61ee9cbb638" rel="stylesheet"><link href="css/x1-titlex.css?a84a8731d61ee9cbb638" rel="stylesheet"><link href="css/x1-titlex-leap-design-fix.css?a84a8731d61ee9cbb638" rel="stylesheet"><link href="css/x1-leap-slim.css?a84a8731d61ee9cbb638" rel="stylesheet"><link href="css/x1-titlex-slim.css?a84a8731d61ee9cbb638" rel="stylesheet"><link href="css/x3-whitelabel.css?a84a8731d61ee9cbb638" rel="stylesheet"><link href="css/4d-leap.css?a84a8731d61ee9cbb638" rel="stylesheet"><link href="css/4d-lawconnect.css?a84a8731d61ee9cbb638" rel="stylesheet"><link href="css/4d-bylawyers.css?a84a8731d61ee9cbb638" rel="stylesheet"><link href="css/4d-leap-web.css?a84a8731d61ee9cbb638" rel="stylesheet"><link href="css/xsf-crx-leap.css?a84a8731d61ee9cbb638" rel="stylesheet"><link href="css/xsf-crx-lawconnect.css?a84a8731d61ee9cbb638" rel="stylesheet"><link href="css/bs-leap-slim.css?a84a8731d61ee9cbb638" rel="stylesheet"><link href="css/bs-leap.css?a84a8731d61ee9cbb638" rel="stylesheet"><link href="css/bs-titlex.css?a84a8731d61ee9cbb638" rel="stylesheet"><link href="css/bs-lawconnect.css?a84a8731d61ee9cbb638" rel="stylesheet"></head>
7
+ <link href="css/x1-leap.css?039b16940f8f7c43bc48" rel="stylesheet"><link href="css/x1-titlex.css?039b16940f8f7c43bc48" rel="stylesheet"><link href="css/x1-titlex-leap-design-fix.css?039b16940f8f7c43bc48" rel="stylesheet"><link href="css/x1-leap-slim.css?039b16940f8f7c43bc48" rel="stylesheet"><link href="css/x1-titlex-slim.css?039b16940f8f7c43bc48" rel="stylesheet"><link href="css/x3-whitelabel.css?039b16940f8f7c43bc48" rel="stylesheet"><link href="css/4d-leap.css?039b16940f8f7c43bc48" rel="stylesheet"><link href="css/4d-lawconnect.css?039b16940f8f7c43bc48" rel="stylesheet"><link href="css/4d-bylawyers.css?039b16940f8f7c43bc48" rel="stylesheet"><link href="css/4d-leap-web.css?039b16940f8f7c43bc48" rel="stylesheet"><link href="css/xsf-crx-leap.css?039b16940f8f7c43bc48" rel="stylesheet"><link href="css/xsf-crx-lawconnect.css?039b16940f8f7c43bc48" rel="stylesheet"><link href="css/bs-leap-slim.css?039b16940f8f7c43bc48" rel="stylesheet"><link href="css/bs-leap.css?039b16940f8f7c43bc48" rel="stylesheet"><link href="css/bs-titlex.css?039b16940f8f7c43bc48" rel="stylesheet"><link href="css/bs-lawconnect.css?039b16940f8f7c43bc48" rel="stylesheet"></head>
8
8
  <body class="container">
9
9
  <h1>
10
10
  h1. Bootstrap heading
@@ -27,5 +27,5 @@
27
27
  <div class="p-3 mb-2 bg-light text-dark">.bg-light</div>
28
28
  <div class="p-3 mb-2 bg-dark text-white">.bg-dark</div>
29
29
  <div class="p-3 mb-2 bg-white text-dark">.bg-white</div>
30
- <script type="text/javascript" src="app.js?a84a8731d61ee9cbb638"></script><script type="text/javascript" src="x1-leap.js?a84a8731d61ee9cbb638"></script><script type="text/javascript" src="x1-titlex.js?a84a8731d61ee9cbb638"></script><script type="text/javascript" src="x1-titlex-leap-design-fix.js?a84a8731d61ee9cbb638"></script><script type="text/javascript" src="x1-leap-slim.js?a84a8731d61ee9cbb638"></script><script type="text/javascript" src="x1-titlex-slim.js?a84a8731d61ee9cbb638"></script><script type="text/javascript" src="x3-whitelabel.js?a84a8731d61ee9cbb638"></script><script type="text/javascript" src="4d-leap.js?a84a8731d61ee9cbb638"></script><script type="text/javascript" src="4d-lawconnect.js?a84a8731d61ee9cbb638"></script><script type="text/javascript" src="4d-bylawyers.js?a84a8731d61ee9cbb638"></script><script type="text/javascript" src="4d-leap-web.js?a84a8731d61ee9cbb638"></script><script type="text/javascript" src="xsf-crx-leap.js?a84a8731d61ee9cbb638"></script><script type="text/javascript" src="xsf-crx-lawconnect.js?a84a8731d61ee9cbb638"></script><script type="text/javascript" src="bs-leap-slim.js?a84a8731d61ee9cbb638"></script><script type="text/javascript" src="bs-leap.js?a84a8731d61ee9cbb638"></script><script type="text/javascript" src="bs-titlex.js?a84a8731d61ee9cbb638"></script><script type="text/javascript" src="bs-lawconnect.js?a84a8731d61ee9cbb638"></script></body>
30
+ <script type="text/javascript" src="app.js?039b16940f8f7c43bc48"></script><script type="text/javascript" src="x1-leap.js?039b16940f8f7c43bc48"></script><script type="text/javascript" src="x1-titlex.js?039b16940f8f7c43bc48"></script><script type="text/javascript" src="x1-titlex-leap-design-fix.js?039b16940f8f7c43bc48"></script><script type="text/javascript" src="x1-leap-slim.js?039b16940f8f7c43bc48"></script><script type="text/javascript" src="x1-titlex-slim.js?039b16940f8f7c43bc48"></script><script type="text/javascript" src="x3-whitelabel.js?039b16940f8f7c43bc48"></script><script type="text/javascript" src="4d-leap.js?039b16940f8f7c43bc48"></script><script type="text/javascript" src="4d-lawconnect.js?039b16940f8f7c43bc48"></script><script type="text/javascript" src="4d-bylawyers.js?039b16940f8f7c43bc48"></script><script type="text/javascript" src="4d-leap-web.js?039b16940f8f7c43bc48"></script><script type="text/javascript" src="xsf-crx-leap.js?039b16940f8f7c43bc48"></script><script type="text/javascript" src="xsf-crx-lawconnect.js?039b16940f8f7c43bc48"></script><script type="text/javascript" src="bs-leap-slim.js?039b16940f8f7c43bc48"></script><script type="text/javascript" src="bs-leap.js?039b16940f8f7c43bc48"></script><script type="text/javascript" src="bs-titlex.js?039b16940f8f7c43bc48"></script><script type="text/javascript" src="bs-lawconnect.js?039b16940f8f7c43bc48"></script></body>
31
31
  </html>
@@ -232,7 +232,7 @@ $custom-select-box-shadow: $input-box-shadow;
232
232
  // Default select
233
233
  //
234
234
  $select-bg: $gray-var-4 !default;
235
- $select-border-color: $gray-var-8 !default;
235
+ $select-border-color: $border-color !default;
236
236
  $select-shadow-focus-color: transparent;
237
237
 
238
238
  // Default Range and Custom Range
@@ -659,10 +659,12 @@ bs-daterangepicker-container {
659
659
  border-top: transparent;
660
660
  padding: 0 1rem 1rem;
661
661
  justify-content: center;
662
+ margin-bottom: 0.5rem;
662
663
 
663
664
  .btn-clear-wrapper {
664
665
  padding: 0 0.5rem;
665
666
  .btn.btn-success {
667
+ min-width: auto;
666
668
  background-color: #FFFFFF;
667
669
  border-color: #7A7A7A;
668
670
  color: theme-color("primary");
@@ -675,6 +677,7 @@ bs-daterangepicker-container {
675
677
  }
676
678
  .btn-today-wrapper {
677
679
  .btn.btn-success {
680
+ min-width: auto;
678
681
  color: #FFFFFF;
679
682
  background-color: theme-color("primary");
680
683
  border-color:theme-color("primary");
@@ -43,17 +43,7 @@
43
43
  z-index: 1030;
44
44
  right: 0;
45
45
  left: 0;
46
-
47
- // &::before {
48
- // content: '';
49
- // background-color: theme-color("light");
50
- // display: block;
51
- // position: absolute;
52
- // top: 0;
53
- // bottom: 0;
54
- // right: calc((100vw - 100%) / -2);
55
- // left: calc((100vw - 100%) / -2);
56
- // }
46
+ transform: translateZ(0);
57
47
  }
58
48
 
59
49
  .page_footer {
@@ -109,4 +99,7 @@
109
99
  }
110
100
  }
111
101
 
102
+ .btn-group leap-button:not(:first-child) {
103
+ margin-left: 0.5rem;
104
+ }
112
105
  }
@@ -1,9 +1,10 @@
1
1
 
2
2
  // Specific to word-app
3
3
  .section-header {
4
- display: flex;
4
+ display: grid;
5
5
  margin: 0.5rem 0;
6
6
  align-items: center;
7
+ grid-template-columns: auto 1fr;
7
8
 
8
9
  .btn,
9
10
  .btn-link {
@@ -15,6 +16,15 @@
15
16
  }
16
17
  }
17
18
  .section_title {
19
+ > * {
20
+ width: auto;
21
+ overflow-wrap: break-word;
22
+ word-break: break-word;
23
+ white-space: break-word;
24
+ overflow: hidden;
25
+ text-overflow: ellipsis;
26
+ }
27
+
18
28
  h3 {
19
29
  margin-bottom: 0;
20
30
  line-height: 1;
@@ -4,7 +4,7 @@
4
4
  }
5
5
 
6
6
  // Min width so we don't have short buttons
7
- .btn:not(.btn-icon-only), .btn:not(.btn-link) {
7
+ .btn:not(.btn-icon-only, .btn-block, .btn-link) {
8
8
  min-width: 7.5rem;
9
9
  }
10
10
 
@@ -17,6 +17,20 @@
17
17
  background-color: transparent !important;
18
18
  }
19
19
  }
20
+
21
+ .form-group {
22
+ margin-bottom: 0;
23
+
24
+ &.row {
25
+ margin-left: 0;
26
+ margin-right: 0;
27
+
28
+ > .col {
29
+ padding-left: 0;
30
+ padding-right: 0;
31
+ }
32
+ }
33
+ }
20
34
  }
21
35
 
22
36
  .input-group-prepend {
@@ -1,5 +1,6 @@
1
1
  select {
2
- color: $btn-dropdown-color;
2
+ // color: $btn-dropdown-color;
3
+ color: theme-color('default') !important;
3
4
  text-align: $btn-dropdown-alignment;
4
5
  padding-right: 1rem;
5
6
  outline: none;
@@ -13,9 +14,11 @@ select {
13
14
  }
14
15
 
15
16
  &:not([multiple]):not(:hover) {
16
- background-color: $select-bg !important;
17
- border-color: $select-border-color;
18
- }
17
+ // background-color: $select-bg !important;
18
+ // border-color: $select-border-color;
19
+ background-color: white !important;
20
+ border: 1px solid $select-border-color;
21
+ }
19
22
  }
20
23
 
21
24
  .ng-select .ng-select-container {
@@ -27,6 +30,18 @@ select {
27
30
  }
28
31
  }
29
32
 
33
+ @if not $is-sirius {
34
+ .input-group {
35
+ .ng-select .ng-select-container {
36
+ border-color: $gray-var-9;
37
+ }
38
+
39
+ .ng-select-wrapper {
40
+ margin-left: -0.0625rem;
41
+ }
42
+ }
43
+ }
44
+
30
45
  .ng-placeholder {
31
46
  color: $input-placeholder-color !important;
32
47
  }
@@ -40,14 +55,6 @@ ng-select-focused,
40
55
  // box-shadow: 0 0 0 0.2rem rgba(theme-color('primary'),.25) !important;
41
56
  }
42
57
 
43
- select {
44
- color: theme-color('default') !important;
45
- &:not([multiple]):not(:hover) {
46
- background-color: white !important;
47
- border: 1px solid $select-border-color;
48
- }
49
- }
50
-
51
58
  @if $is-sirius {
52
59
  .ng-select-opened {
53
60
  > .ng-select-container {
@@ -74,7 +81,9 @@ select {
74
81
  @else {
75
82
  .ng-select .ng-select-container {
76
83
  background-color: #e5e5e5 !important;
77
- min-height: calc(1.371em + 0.2rem + 0.25rem) !important;
84
+ height: 1.5635rem !important;
85
+ min-height: 1.5635rem !important;
86
+ min-height: 1.5635rem !important;
78
87
  font-size: 0.8125rem;
79
88
 
80
89
  .ng-arrow-wrapper, .ng-arrow {
@@ -12,7 +12,7 @@
12
12
  background-color: $nav-tabs-bg;
13
13
 
14
14
  @if $is-sirius {
15
- border-bottom: 1px solid $border-color;
15
+ border-bottom: 0.0625rem solid $border-color;
16
16
  }
17
17
 
18
18
  .nav-link {
@@ -26,19 +26,30 @@
26
26
  min-height: $nav-tabs-link-min-height;
27
27
  max-width: $nav-tabs-link-max-width;
28
28
  min-width: $nav-tabs-link-min-width;
29
+ z-index: 1;
29
30
 
30
31
  &::after {
31
32
  content: '';
32
33
  position: absolute;
33
- height: 2px;
34
+ height: 0.125rem;
34
35
  width: 100%;
35
36
  left: 0;
36
37
  bottom: -1px;
37
38
  transform: scaleX(0);
39
+ z-index: 10;
38
40
 
39
41
  @if $is-sirius {
40
42
  transition: all .25s ease-out;
41
43
  }
44
+
45
+
46
+ @include mobile-device-only {
47
+ &::after {
48
+ height: 0.25rem;
49
+ bottom: -0.125rem;
50
+ }
51
+ }
52
+
42
53
  }
43
54
 
44
55
  @if $nav-tabs-link-is-uppercase {
@@ -116,24 +127,41 @@
116
127
  }
117
128
  }
118
129
  }
119
-
130
+ // leap-tabs-menu .toolbar {
131
+ // // position: -webkit-sticky;
132
+ // position: fixed;
133
+ // top: 0;
134
+ // display: block;
135
+ // z-index: 1030;
136
+ // }
120
137
  @include mobile-device-only {
121
138
  leap-tabs-menu .toolbar {
139
+ position: -webkit-sticky;
122
140
  position: sticky;
123
141
  top: 0;
124
- z-index: 1030;
125
- }
126
- .nav-tabs {
142
+ z-index: 1500;
143
+
127
144
  display: block !important;
128
145
  white-space: nowrap;
129
146
  width: 100%;
130
147
  overflow-x: scroll;
131
148
  overflow-y: hidden;
132
149
  background-color: white;
150
+ }
151
+ .nav-tabs {
152
+ display: flex !important;
153
+ flex-wrap: nowrap;
154
+ width: 100%;
133
155
 
134
156
  .nav-link {
135
157
  display: inline-block;
136
158
 
159
+ &:not(.activated) {
160
+ position: relative;
161
+ margin-bottom: -0.0625rem;
162
+ border-bottom: 1px solid $border-color;
163
+ }
164
+
137
165
  > span {
138
166
  display: block;
139
167
  }
@@ -16,6 +16,37 @@
16
16
  font-weight: $font-weight-bold;
17
17
  }
18
18
 
19
+ @if not $is-sirius {
20
+ .section_title {
21
+ width: 100%;
22
+ }
23
+ .section_title .h5:first-child,
24
+ .section_title h5:first-child { font-size: 0.75rem; }
25
+
26
+ .section_title .h6:first-child,
27
+ .section_title h6:first-child { font-size: 0.6875rem; }
28
+
29
+ .section_title .h5:first-child,
30
+ .section_title h5:first-child,
31
+ .section_title .h6:first-child,
32
+ .section_title h6:first-child {
33
+ font-weight: 600;
34
+ text-transform: uppercase;
35
+ position: relative;
36
+ white-space: nowrap;
37
+ overflow: hidden;
38
+
39
+ &::after {
40
+ border-top: 1px solid $gray-var-6;
41
+ content: "";
42
+ position: absolute;
43
+ top: 0.5rem;
44
+ width: 100%;
45
+ margin-left: 2%;
46
+ }
47
+ }
48
+ }
49
+
19
50
  .section-subtitle {
20
51
  font-size: $font-size-base;
21
52
  color: var(--primary, theme-color("default"));
@@ -10,6 +10,55 @@
10
10
  return getChildren(n.parentNode.firstChild, n);
11
11
  };
12
12
 
13
+ var getClosestParent = function (elem, selector) {
14
+ if (!Element.prototype.matches) {
15
+ Element.prototype.matches =
16
+ Element.prototype.matchesSelector ||
17
+ Element.prototype.mozMatchesSelector ||
18
+ Element.prototype.msMatchesSelector ||
19
+ Element.prototype.oMatchesSelector ||
20
+ Element.prototype.webkitMatchesSelector ||
21
+ function (s) {
22
+ const matches = (this.document || this.ownerDocument).querySelectorAll(s),
23
+ i = matches.length;
24
+ while (--i >= 0 && matches.item(i) !== this) { }
25
+ return i > -1;
26
+ };
27
+ }
28
+
29
+ // Get the closest matching element
30
+ for (; elem && elem !== document; elem = elem.parentNode) {
31
+ if (elem.matches(selector)) return elem;
32
+ }
33
+ return null;
34
+ };
35
+
36
+ // For Version 1 the order of Hash appendages is Tab -> Accordion -> Subaccordion
37
+ var appendHash = function (str) {
38
+ window.location.hash = (() => {
39
+ const lowercasedStr = str.toLowerCase();
40
+ return lowercasedStr.split(' ').join('-');
41
+ })();
42
+ };
43
+
44
+ var getDeviceType = function () {
45
+ const ua = navigator.userAgent;
46
+ const isiOS = () => {
47
+ return /iPad|iPhone/.test(ua) || navigator.platform === 'MacIntel' && navigator.maxTouchPoints > 1;
48
+ };
49
+ const isAndroid = () => { return /android/i.test(ua); };
50
+
51
+ if (isAndroid()) {
52
+ return 'android';
53
+ }
54
+ else if (isiOS()) {
55
+ if (/iPad/.test(ua)) { return 'ipad'; }
56
+ else if (/iPhone/.test(ua)) { return 'iphone'; }
57
+ else { return 'ios'; }
58
+ }
59
+ return;
60
+ };
61
+
13
62
  document.addEventListener('click', function (event) {
14
63
  var
15
64
  targetElem = event.target,
@@ -33,15 +82,18 @@
33
82
  activeTabBtn.classList.add('active');
34
83
  targetTab.classList.add('in');
35
84
 
36
- activeBtnTabSiblings.forEach(function (element, index) {
85
+ appendHash(targetElem.textContent);
86
+
87
+ activeBtnTabSiblings.forEach(function (element) {
37
88
  if (element.classList.value.indexOf('active') !== -1) element.classList.remove('active');
38
89
  });
39
- targetTabSiblings.forEach(function (element, index) {
90
+ targetTabSiblings.forEach(function (element) {
40
91
  if (element.classList.value.indexOf('in') !== -1) element.classList.remove('in');
41
92
  });
42
93
  }
43
94
 
44
95
  if (className.value.indexOf('sf-accordion-toggle') !== -1) {
96
+ appendHash(targetElem.querySelector('.sf-accordion-text').textContent);
45
97
  className.value.indexOf('in') == -1 ?
46
98
  className.add('in') : className.remove('in');
47
99
  }
@@ -49,4 +101,53 @@
49
101
  return false;
50
102
  }, false);
51
103
 
104
+ // Set default tab via URL hash or device type if present on tabs
105
+ document.addEventListener('DOMContentLoaded', function () {
106
+ const tabs = document.querySelectorAll('.sf-tabs');
107
+ const accordion = document.querySelectorAll('.sf-accordion-toggle');
108
+ const urlHashList = window.location.hash !== '' ? window.location.hash.substring(1).split('#') : undefined;
109
+
110
+ const openParent = (childElement) => {
111
+ const closestTab = getClosestParent(childElement, '.sf-tab-content');
112
+ const closestAccordion = getClosestParent(childElement, '.sf-accordion-content');
113
+
114
+ if (closestTab !== null) {
115
+ document.getElementById(`target_${closestTab.id}`).click();
116
+ }
117
+ if (closestAccordion !== null) {
118
+ document.getElementById(`target_${closestAccordion.id}`).click();
119
+ }
120
+ };
121
+
122
+ if (tabs.length !== 0) {
123
+ tabs.forEach(tab => {
124
+ const deviceType = getDeviceType();
125
+ tab.querySelectorAll('.sf-tab-item-link').forEach(tabitem => {
126
+ const tabItemText = tabitem.textContent.toLowerCase().replace(/\s/g, '');
127
+
128
+ if (tabItemText === deviceType && typeof (urlHashList) === 'undefined') {
129
+ tabitem.click();
130
+ }
131
+ else if (typeof (urlHashList) !== 'undefined' && urlHashList.includes(tabItemText)) {
132
+ openParent(tabitem);
133
+ tabitem.click();
134
+ }
135
+ });
136
+ });
137
+ }
138
+
139
+ if (accordion.length !== 0) {
140
+ accordion.forEach(accordionToggle => {
141
+ const accordionText = accordionToggle
142
+ .querySelector('.sf-accordion-text')
143
+ .textContent.split(' ').join('-').toLowerCase();
144
+
145
+ if (typeof (urlHashList) !== 'undefined' && urlHashList.includes(accordionText)) {
146
+ openParent(accordionToggle);
147
+ accordionToggle.click();
148
+ }
149
+ });
150
+ }
151
+ });
152
+
52
153
  })();
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@leapdev/gui",
3
- "version": "0.2.230",
3
+ "version": "0.2.235",
4
4
  "description": "LEAP GUI",
5
5
  "author": "LEAP Dev",
6
6
  "license": "ISC",