vcomply-design-system 1.0.0

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.
Files changed (180) hide show
  1. package/README.md +22 -0
  2. package/css-build/css/alignment/alignment.css +33 -0
  3. package/css-build/css/animate/animate-fade-in-left.css +28 -0
  4. package/css-build/css/animate/animate-fade-in-right.css +28 -0
  5. package/css-build/css/animate/animate-fade-in.css +20 -0
  6. package/css-build/css/animate/animate-fade-out.css +20 -0
  7. package/css-build/css/animate/animate-slide-down.css +26 -0
  8. package/css-build/css/animate/animate-slide-left.css +26 -0
  9. package/css-build/css/animate/animate-slide-right.css +26 -0
  10. package/css-build/css/animate/animate-slide-up.css +26 -0
  11. package/css-build/css/animate/animation.css +58 -0
  12. package/css-build/css/animate/index.css +258 -0
  13. package/css-build/css/avatars/avatars.css +83 -0
  14. package/css-build/css/button/button.css +237 -0
  15. package/css-build/css/color/color.css +152 -0
  16. package/css-build/css/dialog/dialog.css +421 -0
  17. package/css-build/css/display/display.css +24 -0
  18. package/css-build/css/forms/check-box.css +97 -0
  19. package/css-build/css/forms/forms.css +336 -0
  20. package/css-build/css/forms/index.css +862 -0
  21. package/css-build/css/forms/radio.css +116 -0
  22. package/css-build/css/forms/range-slider.css +203 -0
  23. package/css-build/css/forms/switch.css +124 -0
  24. package/css-build/css/header/header.css +344 -0
  25. package/css-build/css/icons/icons.css +53 -0
  26. package/css-build/css/index.css +548 -0
  27. package/css-build/css/index2.css +313 -0
  28. package/css-build/css/layout/layout.css +19 -0
  29. package/css-build/css/left-menu/main-menu.css +98 -0
  30. package/css-build/css/left-menu/sub-menu.css +323 -0
  31. package/css-build/css/list/list.css +3 -0
  32. package/css-build/css/loader/v-loader.css +183 -0
  33. package/css-build/css/margin/index.css +112 -0
  34. package/css-build/css/margin/margin-bottom.css +25 -0
  35. package/css-build/css/margin/margin-left.css +25 -0
  36. package/css-build/css/margin/margin-right.css +40 -0
  37. package/css-build/css/margin/margin-top.css +25 -0
  38. package/css-build/css/margin/margin.css +25 -0
  39. package/css-build/css/mixin/mixin.css +7 -0
  40. package/css-build/css/mixin.css +0 -0
  41. package/css-build/css/no-data/no-data.css +36 -0
  42. package/css-build/css/padding/index.css +97 -0
  43. package/css-build/css/padding/padding-bottom.css +25 -0
  44. package/css-build/css/padding/padding-left.css +25 -0
  45. package/css-build/css/padding/padding-right.css +25 -0
  46. package/css-build/css/padding/padding-top.css +25 -0
  47. package/css-build/css/padding/padding.css +25 -0
  48. package/css-build/css/pagination/pagination.css +131 -0
  49. package/css-build/css/panel/panel.css +76 -0
  50. package/css-build/css/popover/popover.css +237 -0
  51. package/css-build/css/quick-links/quick-links.css +84 -0
  52. package/css-build/css/smiley/smiley.css +353 -0
  53. package/css-build/css/snack-bar/snack-bar.css +77 -0
  54. package/css-build/css/table/table.css +191 -0
  55. package/css-build/css/table-card/table-card.css +242 -0
  56. package/css-build/css/text/text.css +157 -0
  57. package/css-build/css/user-panel/user-panel.css +115 -0
  58. package/css-build/css/vx.css +4254 -0
  59. package/css-build/css/width/width.css +43 -0
  60. package/css-build/fonts/icon.eot +0 -0
  61. package/css-build/fonts/icon.svg +583 -0
  62. package/css-build/fonts/icon.ttf +0 -0
  63. package/css-build/fonts/icon.woff +0 -0
  64. package/css-build/images/1.jpg +0 -0
  65. package/css-build/images/2.jpg +0 -0
  66. package/css-build/images/3.jpg +0 -0
  67. package/css-build/images/4.jpg +0 -0
  68. package/css-build/images/example/graph-sec-menu.JPG +0 -0
  69. package/css-build/images/example/layout.svg +388 -0
  70. package/css-build/images/example/menu-icon-m.svg +56 -0
  71. package/css-build/images/example/primary-menu.svg +66 -0
  72. package/css-build/images/example/vcomply-icon-m.svg +43 -0
  73. package/css-build/images/favicon.ico +0 -0
  74. package/css-build/images/grid.JPG +0 -0
  75. package/css-build/images/no-data.svg +268 -0
  76. package/css-build/images/open-arrow-left.svg +3 -0
  77. package/css-build/images/plus-create-icon.svg +23 -0
  78. package/css-build/images/plus-incident-icon.svg +44 -0
  79. package/css-build/images/plus-risk-icon.svg +45 -0
  80. package/css-build/images/v-icon.svg +1 -0
  81. package/css-build/index.html +188 -0
  82. package/css-build/js/table.js +72 -0
  83. package/css-build/js/toolbar.js +48 -0
  84. package/css-build/less/alignment/alignment.less +43 -0
  85. package/css-build/less/animate/animate-fade-in-left.less +32 -0
  86. package/css-build/less/animate/animate-fade-in-right.less +32 -0
  87. package/css-build/less/animate/animate-fade-in.less +24 -0
  88. package/css-build/less/animate/animate-fade-out.less +24 -0
  89. package/css-build/less/animate/animate-slide-down.less +30 -0
  90. package/css-build/less/animate/animate-slide-left.less +30 -0
  91. package/css-build/less/animate/animate-slide-right.less +30 -0
  92. package/css-build/less/animate/animate-slide-up.less +30 -0
  93. package/css-build/less/animate/animation.less +58 -0
  94. package/css-build/less/animate/index.less +9 -0
  95. package/css-build/less/avatars/avatars.less +96 -0
  96. package/css-build/less/button/button.less +201 -0
  97. package/css-build/less/color/color.less +209 -0
  98. package/css-build/less/dialog/dialog.less +502 -0
  99. package/css-build/less/display/display.less +31 -0
  100. package/css-build/less/forms/check-box.less +117 -0
  101. package/css-build/less/forms/forms.less +386 -0
  102. package/css-build/less/forms/index.less +5 -0
  103. package/css-build/less/forms/radio.less +139 -0
  104. package/css-build/less/forms/range-slider.less +69 -0
  105. package/css-build/less/forms/switch.less +166 -0
  106. package/css-build/less/header/header.less +236 -0
  107. package/css-build/less/icons/icons.less +50 -0
  108. package/css-build/less/index.less +74 -0
  109. package/css-build/less/index2.less +396 -0
  110. package/css-build/less/layout/layout.less +16 -0
  111. package/css-build/less/left-menu/main-menu.less +123 -0
  112. package/css-build/less/left-menu/sub-menu.less +326 -0
  113. package/css-build/less/list/list.less +5 -0
  114. package/css-build/less/loader/v-loader.less +219 -0
  115. package/css-build/less/margin/index.less +5 -0
  116. package/css-build/less/margin/margin-bottom.less +25 -0
  117. package/css-build/less/margin/margin-left.less +25 -0
  118. package/css-build/less/margin/margin-right.less +40 -0
  119. package/css-build/less/margin/margin-top.less +25 -0
  120. package/css-build/less/margin/margin.less +25 -0
  121. package/css-build/less/mixin/mixin.less +27 -0
  122. package/css-build/less/mixin.less +1 -0
  123. package/css-build/less/no-data/no-data.less +52 -0
  124. package/css-build/less/padding/index.less +5 -0
  125. package/css-build/less/padding/padding-bottom.less +25 -0
  126. package/css-build/less/padding/padding-left.less +20 -0
  127. package/css-build/less/padding/padding-right.less +20 -0
  128. package/css-build/less/padding/padding-top.less +25 -0
  129. package/css-build/less/padding/padding.less +25 -0
  130. package/css-build/less/pagination/pagination.less +144 -0
  131. package/css-build/less/panel/panel.less +116 -0
  132. package/css-build/less/popover/popover.less +273 -0
  133. package/css-build/less/quick-links/quick-links.less +90 -0
  134. package/css-build/less/smiley/smiley.less +422 -0
  135. package/css-build/less/snack-bar/snack-bar.less +86 -0
  136. package/css-build/less/table/table.less +293 -0
  137. package/css-build/less/table-card/table-card.less +116 -0
  138. package/css-build/less/text/text.less +179 -0
  139. package/css-build/less/user-panel/user-panel.less +123 -0
  140. package/css-build/less/vx.less +28 -0
  141. package/css-build/less/width/width.less +37 -0
  142. package/css-build/less.js +11 -0
  143. package/css-build/pages/alignment.html +102 -0
  144. package/css-build/pages/avatars.html +555 -0
  145. package/css-build/pages/button.html +993 -0
  146. package/css-build/pages/checkbox.html +560 -0
  147. package/css-build/pages/color-palette.html +358 -0
  148. package/css-build/pages/common-layout.html +125 -0
  149. package/css-build/pages/dialog.html +738 -0
  150. package/css-build/pages/display.html +67 -0
  151. package/css-build/pages/font-family.html +281 -0
  152. package/css-build/pages/header.html +590 -0
  153. package/css-build/pages/icons.html +3715 -0
  154. package/css-build/pages/mein-menu-active.html +67 -0
  155. package/css-build/pages/mein-menu-sub-menu.html +110 -0
  156. package/css-build/pages/mein-menu-tooltip.html +70 -0
  157. package/css-build/pages/mein-menu.html +321 -0
  158. package/css-build/pages/no-data.html +277 -0
  159. package/css-build/pages/panel.html +423 -0
  160. package/css-build/pages/popover.html +666 -0
  161. package/css-build/pages/radio.html +418 -0
  162. package/css-build/pages/range-slider.html +279 -0
  163. package/css-build/pages/select-box.html +933 -0
  164. package/css-build/pages/smiley.html +355 -0
  165. package/css-build/pages/sub-menu.html +396 -0
  166. package/css-build/pages/switch.html +349 -0
  167. package/css-build/pages/tab-menu.html +301 -0
  168. package/css-build/pages/table-card.html +510 -0
  169. package/css-build/pages/table.html +2218 -0
  170. package/css-build/pages/text-box.html +325 -0
  171. package/css-build/pages/text.html +106 -0
  172. package/css-build/pages/v-loader.html +163 -0
  173. package/css-build/sw/pwabuilder-sw-register.js +14 -0
  174. package/css-build/sw/pwabuilder-sw.js +47 -0
  175. package/css-build/utility/code-prev.css +19 -0
  176. package/css-build/utility/prism.css +130 -0
  177. package/css-build/utility/prism.js +8 -0
  178. package/index.js +66 -0
  179. package/nodemon.json +4 -0
  180. package/package.json +24 -0
@@ -0,0 +1,188 @@
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
+
4
+ <head>
5
+ <meta charset="UTF-8">
6
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
7
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
8
+ <title>VComply Design System</title>
9
+ <link rel="icon" type="image/x-icon" href="./images/favicon.ico">
10
+ <link rel="preconnect" href="https://fonts.gstatic.com">
11
+ <link href="https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap"
12
+ rel="stylesheet">
13
+ <link rel="stylesheet/less" type="text/css" href="less/index.less" />
14
+ <link rel="stylesheet/less" type="text/css" href="less/index2.less" />
15
+ <link rel="stylesheet/css" type="text/css" href="utility/prism.css" />
16
+ <link rel="stylesheet/less" type="text/css" href="less/display/display.less" />
17
+ <link rel="stylesheet/less" type="text/css" href="less/left-menu/main-menu.less" />
18
+ <link rel="stylesheet/less" type="text/css" href="less/left-menu/sub-menu.less" />
19
+ <link rel="stylesheet/less" type="text/css" href="less/padding/padding.less" />
20
+ <link rel="stylesheet/less" type="text/css" href="less/padding/padding-bottom.less" />
21
+ <link rel="stylesheet/less" type="text/css" href="less/padding/padding-top.less" />
22
+ <link rel="stylesheet/less" type="text/css" href="less/padding/padding-left.less" />
23
+ <link rel="stylesheet/less" type="text/css" href="less/padding/padding-right.less" />
24
+ <link rel="stylesheet/less" type="text/css" href="less/margin/margin.less" />
25
+ <link rel="stylesheet/less" type="text/css" href="less/margin/margin-top.less" />
26
+ <link rel="stylesheet/less" type="text/css" href="less/margin/margin-right.less" />
27
+ <link rel="stylesheet/less" type="text/css" href="less/margin/margin-bottom.less" />
28
+ <link rel="stylesheet/less" type="text/css" href="less/margin/margin-left.less" />
29
+ <link rel="stylesheet/less" type="text/css" href="less/alignment/alignment.less" />
30
+ <link rel="stylesheet/less" type="text/css" href="less/text/text.less" />
31
+ <link rel="stylesheet/less" type="text/css" href="less/color/color.less" />
32
+ <link rel="stylesheet/less" type="text/css" href="less/header/header.less" />
33
+ <link rel="stylesheet/less" type="text/css" href="less/button/button.less" />
34
+ <link rel="stylesheet/less" type="text/css" href="less/user-panel/user-panel.less" />
35
+ <link rel="stylesheet/less" type="text/css" href="less/quick-links/quick-links.less" />
36
+ <link rel="stylesheet/less" type="text/css" href="less/quick-links/quick-links.less" />
37
+
38
+ </head>
39
+
40
+
41
+
42
+ <body>
43
+ <div class="main-container vx-d-flex vx-justify-between">
44
+ <div class="vx-left-menu vx-d-flex" id="left-menu-container">
45
+ <div class="vx-sub-menu vx-p-0" id="sub-menu">
46
+ <h1>Testing CI pipeline 2</h1>
47
+ <h3
48
+ class="vx-title vx-lh-12 vx-tt-uppercase vx-fw-500 vx-m-0 vx-label-txt vx-d-flex vx-align-center vx-pr-3 vx-pl-3">
49
+ <span class="vx-bg-vColor"></span>
50
+ Common Layout
51
+ </h3>
52
+ <ul class="vx-p-0 sub-menu">
53
+ <li><a href="javascript:;" class="vx-fs-3 vx-d-block vx-lh-10 vx-fw-400 vx-pr-3 vx-pl-3" data-tab="colorPalette">Color Palette</a></li>
54
+ <li><a href="javascript:;" class="vx-fs-3 vx-d-block vx-lh-10 vx-fw-400 vx-pr-3 vx-pl-3" data-tab="fonts">Fonts</a></li>
55
+ <li>
56
+ <a href="javascript:;" class="vx-fs-3 vx-d-block vx-lh-10 vx-fw-400 vx-pr-3 vx-pl-3 active" data-tab="commonLayout">Common Layout</a>
57
+ <ul class="child">
58
+ <li><a href="javascript:;" class="sub-opt vx-fs-3 vx-d-block vx-lh-10 vx-fw-400 vx-pr-3 vx-pl-3" data-tab="header">Header</a></li>
59
+ <li><a href="javascript:;" class="sub-opt vx-fs-3 vx-d-block vx-lh-10 vx-fw-400 vx-pr-3 vx-pl-3" data-tab="main-menu">Main Menu</a></li>
60
+ <li><a href="javascript:;" class="sub-opt vx-fs-3 vx-d-block vx-lh-10 vx-fw-400 vx-pr-3 vx-pl-3" data-tab="subMenu">Sub Menu</a></li>
61
+ </ul>
62
+ </li>
63
+ <li><a href="javascript:;" class="vx-fs-3 vx-d-block vx-lh-10 vx-fw-400 vx-pr-3 vx-pl-3" data-tab="typography">Typography</a></li>
64
+ <li><a href="javascript:;" class="vx-fs-3 vx-d-block vx-lh-10 vx-fw-400 vx-pr-3 vx-pl-3" data-tab="icons">Iconography</a></li>
65
+ <li><a href="javascript:;" class="vx-fs-3 vx-d-block vx-lh-10 vx-fw-400 vx-pr-3 vx-pl-3" data-tab="noData">No data Illustrations</a></li>
66
+ <li><a href="javascript:;" class="vx-fs-3 vx-d-block vx-lh-10 vx-fw-400 vx-pr-3 vx-pl-3" data-tab="avatars">Avatars</a></li>
67
+ <li><a href="javascript:;" class="vx-fs-3 vx-d-block vx-lh-10 vx-fw-400 vx-pr-3 vx-pl-3" data-tab="dialog">Dialog</a></li>
68
+ <li><a href="javascript:;" class="vx-fs-3 vx-d-block vx-lh-10 vx-fw-400 vx-pr-3 vx-pl-3" data-tab="popover">Popover</a></li>
69
+ <li><a href="javascript:;" class="vx-fs-3 vx-d-block vx-lh-10 vx-fw-400 vx-pr-3 vx-pl-3" data-tab="panelAccordion">Panel &amp; Accordion</a></li>
70
+ <li>
71
+ <a href="javascript:;" class="vx-fs-3 vx-d-block vx-lh-10 vx-fw-400 vx-pr-3 vx-pl-3">Form</a>
72
+ <ul class="child">
73
+ <li><a href="javascript:;" class="sub-opt vx-fs-3 vx-d-block vx-lh-10 vx-fw-400 vx-pr-3 vx-pl-3" data-tab="buttons">Button</a></li>
74
+ <li><a href="javascript:;" class="sub-opt vx-fs-3 vx-d-block vx-lh-10 vx-fw-400 vx-pr-3 vx-pl-3" data-tab="input">Text box</a></li>
75
+ <li><a href="javascript:;" class="sub-opt vx-fs-3 vx-d-block vx-lh-10 vx-fw-400 vx-pr-3 vx-pl-3" data-tab="selectBox">Select box</a></li>
76
+ <li><a href="javascript:;" class="sub-opt vx-fs-3 vx-d-block vx-lh-10 vx-fw-400 vx-pr-3 vx-pl-3" data-tab="checkbox">Checkbox</a></li>
77
+ <li><a href="javascript:;" class="sub-opt vx-fs-3 vx-d-block vx-lh-10 vx-fw-400 vx-pr-3 vx-pl-3" data-tab="radio">Radio</a></li>
78
+ <li><a href="javascript:;" class="sub-opt vx-fs-3 vx-d-block vx-lh-10 vx-fw-400 vx-pr-3 vx-pl-3" data-tab="switch">Switch</a></li>
79
+ <li><a href="javascript:;" class="sub-opt vx-fs-3 vx-d-block vx-lh-10 vx-fw-400 vx-pr-3 vx-pl-3" data-tab="rangeSlider">Range Slider</a></li>
80
+ </ul>
81
+ </li>
82
+ <li><a href="javascript:;" class="vx-fs-3 vx-d-block vx-lh-10 vx-fw-400 vx-pr-3 vx-pl-3" data-tab="smiley">Success Smiley</a></li>
83
+ <li><a href="javascript:;" class="vx-fs-3 vx-d-block vx-lh-10 vx-fw-400 vx-pr-3 vx-pl-3" data-tab="loader">Loader</a></li>
84
+ <li><a href="javascript:;" class="vx-fs-3 vx-d-block vx-lh-10 vx-fw-400 vx-pr-3 vx-pl-3" data-tab="table">Table</a></li>
85
+ <li><a href="javascript:;" class="vx-fs-3 vx-d-block vx-lh-10 vx-fw-400 vx-pr-3 vx-pl-3" data-tab="tableCard">Table Card</a></li>
86
+ <!-- <li><a href="#"></a></li> -->
87
+ </ul>
88
+ </div>
89
+ </div>
90
+ <div class="vx-right-container">
91
+ <div class="vx-wrapper" id="mainMenu">
92
+ <iframe src="pages/common-layout.html" frameborder="0" width="100%" id="commonLayout" class="active"></iframe>
93
+ <iframe src="pages/color-palette.html" frameborder="0" width="100%" id="colorPalette"></iframe>
94
+ <iframe src="pages/font-family.html" frameborder="0" width="100%" id="fonts"></iframe>
95
+ <iframe src="pages/header.html" frameborder="0" width="100%" id="header"></iframe>
96
+ <iframe src="pages/mein-menu.html" frameborder="0" width="100%" id="main-menu"></iframe>
97
+ <iframe src="pages/sub-menu.html" frameborder="0" width="100%" id="subMenu"></iframe>
98
+ <iframe src="pages/icons.html" frameborder="0" width="100%" id="icons"></iframe>
99
+ <iframe src="pages/no-data.html" frameborder="0" width="100%" id="noData"></iframe>
100
+ <iframe src="pages/smiley.html" frameborder="0" width="100%" id="smiley"></iframe>
101
+ <iframe src="pages/text.html" frameborder="0" width="100%" id="typography"></iframe>
102
+ <iframe src="pages/button.html" frameborder="0" width="100%" id="buttons"></iframe>
103
+ <iframe src="pages/select-box.html" frameborder="0" width="100%" id="selectBox"></iframe>
104
+ <iframe src="pages/avatars.html" frameborder="0" width="100%" id="avatars"></iframe>
105
+ <iframe src="pages/text-box.html" frameborder="0" width="100%" id="input"></iframe>
106
+ <iframe src="pages/panel.html" frameborder="0" width="100%"></iframe>
107
+ <iframe src="pages/dialog.html" frameborder="0" width="100%" id="dialog"></iframe>
108
+ <iframe src="pages/checkbox.html" frameborder="0" width="100%" id="checkbox"></iframe>
109
+ <iframe src="pages/radio.html" frameborder="0" width="100%" id="radio"></iframe>
110
+ <iframe src="pages/switch.html" frameborder="0" width="100%" id="switch"></iframe>
111
+ <iframe src="pages/range-slider.html" frameborder="0" width="100%" id="rangeSlider"></iframe>
112
+ <iframe src="pages/panel.html" frameborder="0" width="100%" id="panelAccordion"></iframe>
113
+ <iframe src="pages/popover.html" frameborder="0" width="100%" id="popover"></iframe>
114
+ <iframe src="pages/v-loader.html" frameborder="0" width="100%" id="loader"></iframe>
115
+ <iframe src="pages/table.html" frameborder="0" width="100%" id="table"></iframe>
116
+ <iframe src="pages/table-card.html" frameborder="0" width="100%" id="tableCard"></iframe>
117
+ </div>
118
+ </div>
119
+ </div>
120
+
121
+
122
+ <!-- <div class="vx-d-flex">
123
+ <div class="vx-d-block block outline vx-text-left vx-pl-5">VX Design System</div>
124
+ <div style="background-color:red">
125
+ <a class="vx-btn md primary vx-d-block" href="pages/display.html">Layout and Flex Utility</a>
126
+ <a class="vx-btn md primary vx-d-block" href="pages/button.html">Button</a>
127
+ <a class="vx-btn md primary vx-d-block" href="pages/alignment.html">Alignments</a>
128
+ </div>
129
+ </div> -->
130
+ <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
131
+ <script async src="../utility/prism.js"></script>
132
+ <script async src="less.js"></script>
133
+ <script>
134
+
135
+
136
+ function toggleSubmenu() {
137
+ var subMenu = document.getElementById("sub-menu");
138
+ var ToggleBtn = document.getElementById("toggleButton");
139
+ var ToggleBtnIcon = document.getElementById("togglebuttomIcon");
140
+ var leftMenuContainer = document.getElementById("left-menu-container");
141
+ var pageHeader = document.getElementById("headerToggle");
142
+ subMenu.classList.toggle("toggle");
143
+ ToggleBtn.classList.toggle("toggle");
144
+ ToggleBtnIcon.classList.toggle("toggle");
145
+ leftMenuContainer.classList.toggle("toggle");
146
+ pageHeader.classList.toggle("toggle");
147
+ }
148
+ function toggleUserBlock() {
149
+ var userPanel = document.getElementById("userPanel");
150
+ if (userPanel.style.display === "none") {
151
+ userPanel.style.display = "block";
152
+ } else {
153
+ userPanel.style.display = "none";
154
+ }
155
+ }
156
+ function toggleQuickLinks() {
157
+ var quickLinks = document.getElementById("quick-links");
158
+ var toggleQuickLink = document.getElementById("toggle-quickLink");
159
+ toggleQuickLink.classList.toggle("toggle");
160
+ if (quickLinks.style.display === "none") {
161
+ quickLinks.style.display = "block";
162
+ } else {
163
+ quickLinks.style.display = "none";
164
+ }
165
+ }
166
+ $(document).ready(function () {
167
+
168
+ $('ul.sub-menu li a').click(function () {
169
+ var tab_id = $(this).attr('data-tab');
170
+
171
+ $('ul.sub-menu li a').removeClass('active');
172
+ $('.vx-wrapper iframe').removeClass('active');
173
+
174
+ $(this).addClass('active');
175
+ $("#" + tab_id).addClass('active');
176
+ })
177
+
178
+ })
179
+ </script>
180
+ <script>
181
+ if ('serviceWorker' in navigator) {
182
+ window.addEventListener('load', function() {
183
+ navigator.serviceWorker.register('sw/pwabuilder-sw.js');
184
+ });}
185
+ </script>
186
+ </body>
187
+
188
+ </html>
@@ -0,0 +1,72 @@
1
+ // const tables = document.querySelectorAll('.vx-table');
2
+ // console.log(tables);
3
+ // const mouseMoveHandler = function(e) {
4
+ // // Determine how far the mouse has been moved
5
+ // const dx = e.clientX - x;
6
+
7
+ // // Update the width of column
8
+ // col.style.width = `${w + dx}px`;
9
+ // console.log(e);
10
+ // };
11
+
12
+
13
+ // tables.forEach(table=>{
14
+ // table.addEventListener('dragstart', mouseMoveHandler)
15
+ // })
16
+ const table = document.getElementByClassName('vx-table');
17
+ console.log(table);
18
+ const cols = table.querySelectorAll('th');
19
+
20
+ // Loop over them
21
+ [].forEach.call(cols, function(col) {
22
+ // Create a resizer element
23
+ const resizer = document.createElement('div');
24
+ resizer.classList.add('resizer');
25
+
26
+ // Set the height
27
+ resizer.style.height = `${table.offsetHeight}px`;
28
+
29
+ // Add a resizer element to the column
30
+ col.appendChild(resizer);
31
+
32
+ // Will be implemented in the next section
33
+ createResizableColumn(col, resizer);
34
+ });
35
+
36
+ const createResizableColumn = function(col, resizer) {
37
+ // Track the current position of mouse
38
+ let x = 0;
39
+ let w = 0;
40
+
41
+ const mouseDownHandler = function(e) {
42
+ // Get the current mouse position
43
+ x = e.clientX;
44
+
45
+ // Calculate the current width of column
46
+ const styles = window.getComputedStyle(col);
47
+ w = parseInt(styles.width, 10);
48
+
49
+ // Attach listeners for document's events
50
+ document.addEventListener('mousemove', mouseMoveHandler);
51
+ document.addEventListener('mouseup', mouseUpHandler);
52
+ };
53
+
54
+ const mouseMoveHandler = function(e) {
55
+ console.log(e);
56
+ // Determine how far the mouse has been moved
57
+ const dx = e.clientX - x;
58
+
59
+ // Update the width of column
60
+ col.style.width = `${w + dx}px`;
61
+ };
62
+
63
+ // When user releases the mouse, remove the existing event listeners
64
+ const mouseUpHandler = function() {
65
+ document.removeEventListener('mousemove', mouseMoveHandler);
66
+ document.removeEventListener('mouseup', mouseUpHandler);
67
+ };
68
+
69
+ resizer.addEventListener('mousedown', mouseDownHandler);
70
+ };
71
+
72
+
@@ -0,0 +1,48 @@
1
+ // Original copyright Philip Lawrence
2
+ // http://dev.misterphilip.com/prism/plugins/toolbar/
3
+
4
+ (function () {
5
+ if (!self.Prism) {
6
+ return;
7
+ }
8
+
9
+ // Attach our hook, only for those parts that we highlighted
10
+ Prism.hooks.add('after-highlight', function (env) {
11
+
12
+ // Check if inline or actual code block (credit to line-numbers plugin)
13
+ var pre = env.element.parentNode;
14
+
15
+ if (!pre || !/pre/i.test(pre.nodeName) || pre.className.indexOf('code-toolbar') === -1) {
16
+ return;
17
+ }
18
+
19
+ // Setup the toolbar
20
+ var toolbar = document.createElement('div');
21
+ toolbar.setAttribute('class', 'toolbar');
22
+
23
+ // Copy to clipboard button, requires ZeroClipboard
24
+ if (window.ZeroClipboard)
25
+ {
26
+ var linkCopy = document.createElement('a');
27
+ linkCopy.innerHTML = 'Copy to clipboard';
28
+
29
+ var client = new ZeroClipboard(linkCopy);
30
+
31
+ client.on("ready", function (event) {
32
+ client.on("copy", function (event) {
33
+ var node = event.target.parentNode.parentNode.getElementsByTagName('code')[0];
34
+ event.clipboardData.setData('text/plain', node.textContent || node.innerText);
35
+ } );
36
+ client.on("aftercopy", function (event) {
37
+ alert("Code copied to clipboard");
38
+ event.target.parentNode.parentNode.getElementsByTagName('code')[0].focus();
39
+ } );
40
+ } );
41
+
42
+ toolbar.appendChild(linkCopy);
43
+ }
44
+
45
+ // Add our toolbar to the <pre> tag
46
+ pre.appendChild(toolbar);
47
+ });
48
+ })();
@@ -0,0 +1,43 @@
1
+ .vx-text-left {
2
+ text-align: left;
3
+ }
4
+
5
+ .vx-text-center {
6
+ text-align: center;
7
+ }
8
+
9
+ .vx-text-right {
10
+ text-align: right;
11
+ }
12
+
13
+ .vx-justify-start {
14
+ justify-content: flex-start;
15
+ }
16
+
17
+ .vx-justify-center {
18
+ justify-content: center;
19
+ }
20
+
21
+ .vx-justify-end {
22
+ justify-content: flex-end;
23
+ }
24
+
25
+ .vx-justify-between {
26
+ justify-content: space-between;
27
+ }
28
+
29
+ .vx-justify-around {
30
+ justify-content: space-around;
31
+ }
32
+
33
+ .vx-align-start {
34
+ align-items: flex-start;
35
+ }
36
+
37
+ .vx-align-center {
38
+ align-items: center;
39
+ }
40
+
41
+ .vx-align-end {
42
+ align-items: flex-end;
43
+ }
@@ -0,0 +1,32 @@
1
+ @-webkit-keyframes fadeInLeft {
2
+ 0% {
3
+ opacity : 0;
4
+ -webkit-transform: translate3d(-200px, 0, 0);
5
+ transform : translate3d(-200px, 0, 0)
6
+ }
7
+
8
+ to {
9
+ opacity : 1;
10
+ -webkit-transform: translateZ(0);
11
+ transform : translateZ(0)
12
+ }
13
+ }
14
+
15
+ @keyframes fadeInLeft {
16
+ 0% {
17
+ opacity : 0;
18
+ -webkit-transform: translate3d(-200px, 0, 0);
19
+ transform : translate3d(-200px, 0, 0)
20
+ }
21
+
22
+ to {
23
+ opacity : 1;
24
+ -webkit-transform: translateZ(0);
25
+ transform : translateZ(0)
26
+ }
27
+ }
28
+
29
+ .animate-fadeInLeft {
30
+ -webkit-animation-name: fadeInLeft;
31
+ animation-name : fadeInLeft
32
+ }
@@ -0,0 +1,32 @@
1
+ @-webkit-keyframes fadeInRight {
2
+ 0% {
3
+ opacity : 0;
4
+ -webkit-transform: translate3d(200px, 0, 0);
5
+ transform : translate3d(200px, 0, 0)
6
+ }
7
+
8
+ to {
9
+ opacity : 1;
10
+ -webkit-transform: translateZ(0);
11
+ transform : translateZ(0)
12
+ }
13
+ }
14
+
15
+ @keyframes fadeInRight {
16
+ 0% {
17
+ opacity : 0;
18
+ -webkit-transform: translate3d(200px, 0, 0);
19
+ transform : translate3d(200px, 0, 0)
20
+ }
21
+
22
+ to {
23
+ opacity : 1;
24
+ -webkit-transform: translateZ(0);
25
+ transform : translateZ(0)
26
+ }
27
+ }
28
+
29
+ .animate-fadeInRight {
30
+ -webkit-animation-name: fadeInRight;
31
+ animation-name : fadeInRight
32
+ }
@@ -0,0 +1,24 @@
1
+ @-webkit-keyframes fadeIn {
2
+ 0% {
3
+ opacity: 0
4
+ }
5
+
6
+ to {
7
+ opacity: 1
8
+ }
9
+ }
10
+
11
+ @keyframes fadeIn {
12
+ 0% {
13
+ opacity: 0
14
+ }
15
+
16
+ to {
17
+ opacity: 1
18
+ }
19
+ }
20
+
21
+ .animate-fadeIn {
22
+ -webkit-animation-name: fadeIn;
23
+ animation-name : fadeIn
24
+ }
@@ -0,0 +1,24 @@
1
+ @-webkit-keyframes fadeOut {
2
+ 0% {
3
+ opacity: 1
4
+ }
5
+
6
+ to {
7
+ opacity: 0
8
+ }
9
+ }
10
+
11
+ @keyframes fadeOut {
12
+ 0% {
13
+ opacity: 1
14
+ }
15
+
16
+ to {
17
+ opacity: 0
18
+ }
19
+ }
20
+
21
+ .animate-fadeOut {
22
+ -webkit-animation-name: fadeOut;
23
+ animation-name : fadeOut
24
+ }
@@ -0,0 +1,30 @@
1
+ @-webkit-keyframes slideInDown {
2
+ 0% {
3
+ -webkit-transform: translate3d(0, -200px, 0);
4
+ transform : translate3d(0, -200px, 0);
5
+ visibility : visible
6
+ }
7
+
8
+ to {
9
+ -webkit-transform: translateZ(0);
10
+ transform : translateZ(0)
11
+ }
12
+ }
13
+
14
+ @keyframes slideInDown {
15
+ 0% {
16
+ -webkit-transform: translate3d(0, -200px, 0);
17
+ transform : translate3d(0, -200px, 0);
18
+ visibility : visible
19
+ }
20
+
21
+ to {
22
+ -webkit-transform: translateZ(0);
23
+ transform : translateZ(0)
24
+ }
25
+ }
26
+
27
+ .animate-slideInDown {
28
+ -webkit-animation-name: slideInDown;
29
+ animation-name : slideInDown
30
+ }
@@ -0,0 +1,30 @@
1
+ @-webkit-keyframes slideInLeft {
2
+ 0% {
3
+ -webkit-transform: translate3d(-100%, 0, 0);
4
+ transform : translate3d(-100%, 0, 0);
5
+ visibility : visible
6
+ }
7
+
8
+ to {
9
+ -webkit-transform: translateZ(0);
10
+ transform : translateZ(0)
11
+ }
12
+ }
13
+
14
+ @keyframes slideInLeft {
15
+ 0% {
16
+ -webkit-transform: translate3d(-100%, 0, 0);
17
+ transform : translate3d(-100%, 0, 0);
18
+ visibility : visible
19
+ }
20
+
21
+ to {
22
+ -webkit-transform: translateZ(0);
23
+ transform : translateZ(0)
24
+ }
25
+ }
26
+
27
+ .animate-slideInLeft {
28
+ -webkit-animation-name: slideInLeft;
29
+ animation-name : slideInLeft
30
+ }
@@ -0,0 +1,30 @@
1
+ @-webkit-keyframes slideInRight {
2
+ 0% {
3
+ -webkit-transform: translate3d(100%, 0, 0);
4
+ transform : translate3d(100%, 0, 0);
5
+ visibility : visible
6
+ }
7
+
8
+ to {
9
+ -webkit-transform: translateZ(0);
10
+ transform : translateZ(0)
11
+ }
12
+ }
13
+
14
+ @keyframes slideInRight {
15
+ 0% {
16
+ -webkit-transform: translate3d(100%, 0, 0);
17
+ transform : translate3d(100%, 0, 0);
18
+ visibility : visible
19
+ }
20
+
21
+ to {
22
+ -webkit-transform: translateZ(0);
23
+ transform : translateZ(0)
24
+ }
25
+ }
26
+
27
+ .animate-slideInRight {
28
+ -webkit-animation: slideInRight 0.2s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
29
+ animation : slideInRight 0.2s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
30
+ }
@@ -0,0 +1,30 @@
1
+ @-webkit-keyframes slideInUp {
2
+ 0% {
3
+ -webkit-transform: translate3d(0, 200px, 0);
4
+ transform : translate3d(0, 200px, 0);
5
+ visibility : visible
6
+ }
7
+
8
+ to {
9
+ -webkit-transform: translateZ(0);
10
+ transform : translateZ(0)
11
+ }
12
+ }
13
+
14
+ @keyframes slideInUp {
15
+ 0% {
16
+ -webkit-transform: translate3d(0, 200px, 0);
17
+ transform : translate3d(0, 200px, 0);
18
+ visibility : visible
19
+ }
20
+
21
+ to {
22
+ -webkit-transform: translateZ(0);
23
+ transform : translateZ(0)
24
+ }
25
+ }
26
+
27
+ .animate-slideInUp {
28
+ -webkit-animation-name: slideInUp;
29
+ animation-name : slideInUp
30
+ }
@@ -0,0 +1,58 @@
1
+ .animate {
2
+ -webkit-animation-duration : 1s;
3
+ animation-duration : 1s;
4
+ -webkit-animation-fill-mode: both;
5
+ animation-fill-mode : both;
6
+ &.animate-infinite {
7
+ -webkit-animation-iteration-count: infinite;
8
+ animation-iteration-count : infinite
9
+ }
10
+ &.animate-repeat-1 {
11
+ -webkit-animation-iteration-count: 1;
12
+ animation-iteration-count : 1;
13
+ }
14
+ &.animate-repeat-2 {
15
+ -webkit-animation-iteration-count: 2;
16
+ animation-iteration-count : 2;
17
+ }
18
+ &.animate-repeat-3 {
19
+ -webkit-animation-iteration-count: 3;
20
+ animation-iteration-count : 3;
21
+ }
22
+ &.animate-delay-1s {
23
+ -webkit-animation-delay: 1s;
24
+ animation-delay : 1s;
25
+ }
26
+ &.animate-delay-2s {
27
+ -webkit-animation-delay: 2s;
28
+ animation-delay : 2s;
29
+ }
30
+ &.animate-delay-3s {
31
+ -webkit-animation-delay: 3s;
32
+ animation-delay : 3s;
33
+ }
34
+ &.animate-delay-4s {
35
+ -webkit-animation-delay: 4s;
36
+ animation-delay : 4s;
37
+ }
38
+ &.animate-delay-5s {
39
+ -webkit-animation-delay: 5s;
40
+ animation-delay : 5s;
41
+ }
42
+ &.animate-faster {
43
+ -webkit-animation-duration: .2s;
44
+ animation-duration : .2s;
45
+ }
46
+ &.animate-fast {
47
+ -webkit-animation-duration: .5s;
48
+ animation-duration : .5s;
49
+ }
50
+ &.animate-slow {
51
+ -webkit-animation-duration: 2s;
52
+ animation-duration : 2s;
53
+ }
54
+ &.animate-slower {
55
+ -webkit-animation-duration: 3s;
56
+ animation-duration : 3s;
57
+ }
58
+ }
@@ -0,0 +1,9 @@
1
+ @import url('./animate-fade-in-left.less');
2
+ @import url('./animate-fade-in-right.less');
3
+ @import url('./animate-fade-in.less');
4
+ @import url('./animate-fade-out.less');
5
+ @import url('./animate-slide-down.less');
6
+ @import url('./animate-slide-left.less');
7
+ @import url('./animate-slide-right.less');
8
+ @import url('./animate-slide-up.less');
9
+ @import url('./animation.less');