vitat-css 0.1.0 → 0.1.2

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 (156) hide show
  1. checksums.yaml +4 -4
  2. data/.DS_Store +0 -0
  3. data/.gitignore +146 -8
  4. data/.idea/.gitignore +5 -0
  5. data/.idea/modules.xml +8 -0
  6. data/.idea/vcs.xml +6 -0
  7. data/.idea/vitat-design-system.iml +12 -0
  8. data/.vscode/settings.json +3 -0
  9. data/HTML/.DS_Store +0 -0
  10. data/HTML/Components/Arabescos.html +87 -0
  11. data/HTML/Components/Buttons.html +105 -0
  12. data/HTML/Components/Card.html +337 -0
  13. data/HTML/Components/CardApp.html +201 -0
  14. data/HTML/Components/Inputs.html +105 -0
  15. data/HTML/Components/Lista.html +106 -0
  16. data/HTML/Components/Pagination.html +218 -0
  17. data/HTML/Components/Pills.html +94 -0
  18. data/HTML/Components/Revisado.html +163 -0
  19. data/JS/prism.js +12 -0
  20. data/bootstrap/scss/_accordion.scss +118 -0
  21. data/bootstrap/scss/_alert.scss +57 -0
  22. data/bootstrap/scss/_badge.scss +29 -0
  23. data/bootstrap/scss/_breadcrumb.scss +28 -0
  24. data/bootstrap/scss/_button-group.scss +139 -0
  25. data/bootstrap/scss/_buttons.scss +111 -0
  26. data/bootstrap/scss/_card.scss +216 -0
  27. data/bootstrap/scss/_carousel.scss +229 -0
  28. data/bootstrap/scss/_close.scss +40 -0
  29. data/bootstrap/scss/_containers.scss +41 -0
  30. data/bootstrap/scss/_dropdown.scss +240 -0
  31. data/bootstrap/scss/_forms.scss +9 -0
  32. data/bootstrap/scss/_functions.scss +302 -0
  33. data/bootstrap/scss/_grid.scss +33 -0
  34. data/bootstrap/scss/_helpers.scss +9 -0
  35. data/bootstrap/scss/_images.scss +42 -0
  36. data/bootstrap/scss/_list-group.scss +174 -0
  37. data/bootstrap/scss/_mixins.scss +43 -0
  38. data/bootstrap/scss/_modal.scss +209 -0
  39. data/bootstrap/scss/_nav.scss +139 -0
  40. data/bootstrap/scss/_navbar.scss +335 -0
  41. data/bootstrap/scss/_offcanvas.scss +83 -0
  42. data/bootstrap/scss/_pagination.scss +64 -0
  43. data/bootstrap/scss/_placeholders.scss +51 -0
  44. data/bootstrap/scss/_popover.scss +158 -0
  45. data/bootstrap/scss/_progress.scss +48 -0
  46. data/bootstrap/scss/_reboot.scss +625 -0
  47. data/bootstrap/scss/_root.scss +54 -0
  48. data/bootstrap/scss/_spinners.scss +69 -0
  49. data/bootstrap/scss/_tables.scss +155 -0
  50. data/bootstrap/scss/_toasts.scss +51 -0
  51. data/bootstrap/scss/_tooltip.scss +115 -0
  52. data/bootstrap/scss/_transitions.scss +27 -0
  53. data/bootstrap/scss/_type.scss +104 -0
  54. data/bootstrap/scss/_utilities.scss +630 -0
  55. data/bootstrap/scss/_variables.scss +1641 -0
  56. data/bootstrap/scss/bootstrap-grid.scss +67 -0
  57. data/bootstrap/scss/bootstrap-reboot.scss +13 -0
  58. data/bootstrap/scss/bootstrap-utilities.scss +18 -0
  59. data/bootstrap/scss/bootstrap.scss +53 -0
  60. data/bootstrap/scss/forms/_floating-labels.scss +63 -0
  61. data/bootstrap/scss/forms/_form-check.scss +152 -0
  62. data/bootstrap/scss/forms/_form-control.scss +219 -0
  63. data/bootstrap/scss/forms/_form-range.scss +91 -0
  64. data/bootstrap/scss/forms/_form-select.scss +72 -0
  65. data/bootstrap/scss/forms/_form-text.scss +11 -0
  66. data/bootstrap/scss/forms/_input-group.scss +121 -0
  67. data/bootstrap/scss/forms/_labels.scss +36 -0
  68. data/bootstrap/scss/forms/_validation.scss +12 -0
  69. data/bootstrap/scss/helpers/_clearfix.scss +3 -0
  70. data/bootstrap/scss/helpers/_colored-links.scss +12 -0
  71. data/bootstrap/scss/helpers/_position.scss +30 -0
  72. data/bootstrap/scss/helpers/_ratio.scss +26 -0
  73. data/bootstrap/scss/helpers/_stacks.scss +15 -0
  74. data/bootstrap/scss/helpers/_stretched-link.scss +15 -0
  75. data/bootstrap/scss/helpers/_text-truncation.scss +7 -0
  76. data/bootstrap/scss/helpers/_visually-hidden.scss +8 -0
  77. data/bootstrap/scss/helpers/_vr.scss +8 -0
  78. data/bootstrap/scss/mixins/_alert.scss +11 -0
  79. data/bootstrap/scss/mixins/_backdrop.scss +14 -0
  80. data/bootstrap/scss/mixins/_border-radius.scss +78 -0
  81. data/bootstrap/scss/mixins/_box-shadow.scss +18 -0
  82. data/bootstrap/scss/mixins/_breakpoints.scss +127 -0
  83. data/bootstrap/scss/mixins/_buttons.scss +133 -0
  84. data/bootstrap/scss/mixins/_caret.scss +64 -0
  85. data/bootstrap/scss/mixins/_clearfix.scss +9 -0
  86. data/bootstrap/scss/mixins/_color-scheme.scss +7 -0
  87. data/bootstrap/scss/mixins/_container.scss +9 -0
  88. data/bootstrap/scss/mixins/_deprecate.scss +10 -0
  89. data/bootstrap/scss/mixins/_forms.scss +144 -0
  90. data/bootstrap/scss/mixins/_gradients.scss +47 -0
  91. data/bootstrap/scss/mixins/_grid.scss +151 -0
  92. data/bootstrap/scss/mixins/_image.scss +16 -0
  93. data/bootstrap/scss/mixins/_list-group.scss +24 -0
  94. data/bootstrap/scss/mixins/_lists.scss +7 -0
  95. data/bootstrap/scss/mixins/_pagination.scss +31 -0
  96. data/bootstrap/scss/mixins/_reset-text.scss +17 -0
  97. data/bootstrap/scss/mixins/_resize.scss +6 -0
  98. data/bootstrap/scss/mixins/_table-variants.scss +21 -0
  99. data/bootstrap/scss/mixins/_text-truncate.scss +8 -0
  100. data/bootstrap/scss/mixins/_transition.scss +26 -0
  101. data/bootstrap/scss/mixins/_utilities.scss +89 -0
  102. data/bootstrap/scss/mixins/_visually-hidden.scss +29 -0
  103. data/bootstrap/scss/utilities/_api.scss +47 -0
  104. data/bootstrap/scss/vendor/_rfs.scss +354 -0
  105. data/css/prism.css +4 -0
  106. data/css/style.css +6 -0
  107. data/gulpfile.js +35 -0
  108. data/img/.DS_Store +0 -0
  109. data/img/arrow-active.png +0 -0
  110. data/img/arrow-disable.png +0 -0
  111. data/img/arrow.png +0 -0
  112. data/img/close.png +0 -0
  113. data/img/phone.png +0 -0
  114. data/img/placeholder.png +0 -0
  115. data/img/placeholder_avatar.png +0 -0
  116. data/img/qr-code-loja.png +0 -0
  117. data/img/store_icon.png +0 -0
  118. data/index.html +33 -0
  119. data/install_nvm.sh +425 -0
  120. data/package-lock.json +4233 -0
  121. data/package.json +9 -0
  122. data/scss/.DS_Store +0 -0
  123. data/scss/guide/.DS_Store +0 -0
  124. data/scss/guide/_variables.scss +171 -0
  125. data/scss/guide/components/_animations.scss +8 -0
  126. data/scss/guide/components/_typography.scss +157 -0
  127. data/scss/guide/components/arabescos/arabescos.scss +47 -0
  128. data/scss/guide/components/buttons/btn.scss +26 -0
  129. data/scss/guide/components/buttons/btn__large.scss +10 -0
  130. data/scss/guide/components/buttons/btn__primary.scss +11 -0
  131. data/scss/guide/components/buttons/btn__secondary.scss +11 -0
  132. data/scss/guide/components/buttons/btn__tertiary.scss +11 -0
  133. data/scss/guide/components/cardapp/cardapp.scss +151 -0
  134. data/scss/guide/components/cards/card.scss +58 -0
  135. data/scss/guide/components/cards/card__horizontal.scss +35 -0
  136. data/scss/guide/components/cards/card__horizontal__small.scss +9 -0
  137. data/scss/guide/components/inputs/_checkbox.scss +45 -0
  138. data/scss/guide/components/inputs/_text.scss +8 -0
  139. data/scss/guide/components/lista/lista.scss +31 -0
  140. data/scss/guide/components/pagination/pagination.scss +81 -0
  141. data/scss/guide/components/pills/pill.scss +31 -0
  142. data/scss/guide/components/pills/pill__full.scss +8 -0
  143. data/scss/guide/components/pills/pill__secundary.scss +8 -0
  144. data/scss/guide/components/pills/pill__small.scss +8 -0
  145. data/scss/guide/components/revisado/revisado.scss +52 -0
  146. data/scss/guide/style.scss +96 -0
  147. metadata +147 -12
  148. data/CODE_OF_CONDUCT.md +0 -74
  149. data/Gemfile +0 -6
  150. data/LICENSE.txt +0 -21
  151. data/Rakefile +0 -2
  152. data/bin/console +0 -14
  153. data/bin/setup +0 -8
  154. data/lib/vitat/css/version.rb +0 -5
  155. data/lib/vitat/css.rb +0 -8
  156. data/vitat-css.gemspec +0 -41
data/HTML/Components/Lista.html ADDED
@@ -0,0 +1,106 @@
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
+ <head>
4
+ <meta charset="UTF-8" />
5
+ <title>Design System - Vitat</title>
6
+ <link rel="preconnect" href="https://fonts.googleapis.com" />
7
+ <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
8
+ <link href="https://fonts.googleapis.com/css2?family=Livvic:wght@400;600&display=swap" rel="stylesheet">
9
+ <link rel="stylesheet" href="../../css/style.css" />
10
+ <link rel="stylesheet" href="../../css/prism.css" />
11
+ </head>
12
+ <body>
13
+ <div class="container">
14
+ <div class="row">
15
+ <div class="col-lg-12">
16
+ <ul class="bar__ul">
17
+ <li class="bar__li">
18
+ <a class="bar__a" href="./Buttons.html">Botões</a>
19
+ </li>
20
+ <li class="bar__li">
21
+ <a class="bar__a" href="./Inputs.html">inputs</a>
22
+ </li>
23
+ <li class="bar__li">
24
+ <a class="bar__a" href="./Pills.html">Pills</a>
25
+ </li>
26
+ <li class="bar__li">
27
+ <a class="bar__a" href="./Card.html">Cards</a>
28
+ </li>
29
+ <li class="bar__li">
30
+ <a class="bar__a" href="./Pagination.html">Pagination</a>
31
+ </li>
32
+ <li class="bar__li">
33
+ <a class="bar__a" href="./Revisado.html">Revisado Por</a>
34
+ </li>
35
+ <li class="bar__li">
36
+ <a class="bar__a" href="./CardApp.html">Card App</a>
37
+ </li>
38
+ <li class="bar__li">
39
+ <a class="bar__a" href="./Arabescos.html">Arabescos</a>
40
+ </li>
41
+ <li class="bar__li">
42
+ <a class="bar__a" href="./Lista.html">Lista</a>
43
+ </li>
44
+ </ul>
45
+ </div>
46
+ </div>
47
+ </div>
48
+ <div class="container">
49
+ <div class="row my-5">
50
+ <div class="col-lg-12 my-4">
51
+ <div class="cardes">
52
+ <div class="list">
53
+ <h3 class="heading heading__3 list__title">Testes que podem ajudar na sua Saúde</h3>
54
+ <div class="list__line">
55
+ <a class="body body__1 list__item" href="#"
56
+ >Bioimpedância</a
57
+ >
58
+ </div>
59
+ <div class="list__line">
60
+ <a class="body body__1 list__item" href="#"
61
+ >Cuide da sua pressão</a
62
+ >
63
+ </div>
64
+ <div class="list__line">
65
+ <a class="body body__1 list__item" href="#"
66
+ >Mini Check up geral</a
67
+ >
68
+ </div>
69
+ <div class="list__line">
70
+ <a
71
+ class="body body__1 list__more"
72
+ href="#"
73
+ >Ver mais</a
74
+ >
75
+ </div>
76
+ </div>
77
+ <pre class="line-numbers mt-4">
78
+ <code class="language-markup">
79
+
80
+ </code>
81
+ </pre>
82
+ </div>
83
+
84
+ </div>
85
+ </body>
86
+ <script src="../../JS/prism.js"></script>
87
+ <script>
88
+ let cards = document.querySelectorAll(".cardes");
89
+ cards.forEach((card) => {
90
+ contentHTML = card.querySelector(".language-markup");
91
+ let content = card.children[0].outerHTML;
92
+ let newContent = content.replaceAll(/</g, "&lt;");
93
+ let finalContent = newContent.replaceAll(/>/g, "&gt;");
94
+ contentHTML.innerHTML = finalContent;
95
+ });
96
+ Prism.plugins.NormalizeWhitespace.setDefaults({
97
+ "remove-trailing": true,
98
+ "remove-indent": true,
99
+ "left-trim": true,
100
+ "right-trim": true,
101
+ });
102
+ </script>
103
+ </html>
104
+
105
+
106
+
data/HTML/Components/Pagination.html ADDED
@@ -0,0 +1,218 @@
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
+ <head>
4
+ <meta charset="UTF-8" />
5
+ <title>Design System - Vitat</title>
6
+ <link rel="preconnect" href="https://fonts.googleapis.com" />
7
+ <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
8
+ <link
9
+ href="https://fonts.googleapis.com/css2?family=Livvic:wght@400;600&display=swap"
10
+ rel="stylesheet"
11
+ />
12
+ <link rel="stylesheet" href="../../css/style.css" />
13
+ <link rel="stylesheet" href="../../css/prism.css" />
14
+ </head>
15
+ <body>
16
+ <div class="container">
17
+ <div class="row">
18
+ <div class="col-lg-12">
19
+ <ul class="bar__ul">
20
+ <li class="bar__li">
21
+ <a class="bar__a" href="./Buttons.html">Botões</a>
22
+ </li>
23
+ <li class="bar__li">
24
+ <a class="bar__a" href="./Inputs.html">inputs</a>
25
+ </li>
26
+ <li class="bar__li">
27
+ <a class="bar__a" href="./Pills.html">Pills</a>
28
+ </li>
29
+ <li class="bar__li">
30
+ <a class="bar__a" href="./Card.html">Cards</a>
31
+ </li>
32
+ <li class="bar__li">
33
+ <a class="bar__a" href="./Pagination.html">Pagination</a>
34
+ </li>
35
+ <li class="bar__li">
36
+ <a class="bar__a" href="./Revisado.html">Revisado Por</a>
37
+ </li>
38
+ <li class="bar__li">
39
+ <a class="bar__a" href="./CardApp.html">Card App</a>
40
+ </li>
41
+ <li class="bar__li">
42
+ <a class="bar__a" href="./Arabescos.html">Arabescos</a>
43
+ </li>
44
+ <li class="bar__li">
45
+ <a class="bar__a" href="./Lista.html">Lista</a>
46
+ </li>
47
+ </ul>
48
+ </div>
49
+ </div>
50
+ </div>
51
+ <div class="container">
52
+ <div class="row my-5">
53
+ <div class="col-lg-4 my-4">
54
+ <div class="cardes">
55
+ <div class="pagination">
56
+ <a
57
+ tabindex="0"
58
+ class="pagination__previous pagination__previousDisable"
59
+ href="#"
60
+ ></a>
61
+ <a
62
+ tabindex="0"
63
+ class="pagination__pages pagination__active"
64
+ href="1"
65
+ >1</a
66
+ >
67
+ <a tabindex="0" class="pagination__pages" href="2">2</a>
68
+ <a tabindex="0" class="pagination__pages" href="3">3</a>
69
+ <a
70
+ tabindex="0"
71
+ class="pagination__pages pagination__visibleDesk"
72
+ href=4"
73
+ >4</a
74
+ >
75
+ <a
76
+ tabindex="0"
77
+ class="pagination__pages pagination__visibleDesk"
78
+ href="#"
79
+ >5</a
80
+ >
81
+ <a
82
+ tabindex="0"
83
+ class="pagination__pages pagination__visibleDesk"
84
+ href="#"
85
+ >6</a
86
+ >
87
+ <a
88
+ tabindex="0"
89
+ class="pagination__pages pagination__visibleDesk"
90
+ href="#"
91
+ >7</a
92
+ >
93
+ <a tabindex="0" class="pagination__pages pagination__visibleDesk" href="#"
94
+ >8</a
95
+ >
96
+ <a tabindex="0" class="pagination__pages pagination__visibleDesk" href="#"
97
+ >9</a
98
+ >
99
+ <a tabindex="0" class="pagination__pages pagination__visibleDesk" href="#"
100
+ >10</a
101
+ >
102
+ <a tabindex="0" class="pagination__nextHover pagination__next" href="#"></a>
103
+ </div>
104
+
105
+ <pre class="line-numbers mt-4">
106
+ <code class="language-markup">
107
+
108
+ </code>
109
+ </pre>
110
+ </div>
111
+ </div>
112
+
113
+ <div class="col-lg-4 my-4">
114
+ <div class="cardes">
115
+ <div class="pagination">
116
+ <a tabindex="0"
117
+ class="pagination__previous pagination__previousHover"
118
+ href="#"
119
+ ></a>
120
+ <a tabindex="0" class="pagination__pages" href="#">1</a>
121
+ <a tabindex="0" class="pagination__pages pagination__active" href="#">2</a>
122
+ <a tabindex="0" class="pagination__pages" href="#">3</a>
123
+ <a tabindex="0" class="pagination__pages pagination__visibleDesk" href="#"
124
+ >4</a
125
+ >
126
+ <a tabindex="0" class="pagination__pages pagination__visibleDesk" href="#"
127
+ >5</a
128
+ >
129
+ <a tabindex="0" class="pagination__pages pagination__visibleDesk" href="#"
130
+ >6</a
131
+ >
132
+ <a tabindex="0" class="pagination__pages pagination__visibleDesk" href="#"
133
+ >7</a
134
+ >
135
+ <a tabindex="0" class="pagination__pages pagination__visibleDesk" href="#"
136
+ >8</a
137
+ >
138
+ <a tabindex="0" class="pagination__pages pagination__visibleDesk" href="#"
139
+ >9</a
140
+ >
141
+ <a tabindex="0" class="pagination__pages pagination__visibleDesk" href="#"
142
+ >10</a
143
+ >
144
+ <a tabindex="0" class="pagination__nextHover pagination__next" href="#"></a>
145
+ </div>
146
+
147
+ <pre class="line-numbers mt-4">
148
+ <code class="language-markup">
149
+
150
+ </code>
151
+ </pre>
152
+ </div>
153
+ </div>
154
+
155
+ <div class="col-lg-4 my-4">
156
+ <div class="cardes">
157
+ <div class="pagination">
158
+ <a tabindex="0"
159
+ class="pagination__previous pagination__previousHover"
160
+ href="#"
161
+ ></a>
162
+ <a tabindex="0" class="pagination__pages" href="#">1</a>
163
+ <a tabindex="0" class="pagination__pages" href="#">2</a>
164
+ <a tabindex="0" class="pagination__pages" href="#">3</a>
165
+ <a tabindex="0" class="pagination__pages pagination__visibleDesk" href="#"
166
+ >4</a
167
+ >
168
+ <a tabindex="0" class="pagination__pages pagination__visibleDesk" href="#"
169
+ >5</a
170
+ >
171
+ <a tabindex="0" class="pagination__pages pagination__visibleDesk" href="#"
172
+ >6</a
173
+ >
174
+ <a tabindex="0" class="pagination__pages pagination__visibleDesk" href="#"
175
+ >7</a
176
+ >
177
+ <a tabindex="0" class="pagination__pages pagination__visibleDesk" href="#"
178
+ >8</a
179
+ >
180
+ <a tabindex="0" class="pagination__pages pagination__visibleDesk" href="#"
181
+ >9</a
182
+ >
183
+ <a tabindex="0"
184
+ class="pagination__pages pagination__visibleDesk pagination__active"
185
+ href="#"
186
+ >10</a
187
+ >
188
+ <a tabindex="0" class="pagination__next pagination__nextDisable" href="#"></a>
189
+ </div>
190
+
191
+ <pre class="line-numbers mt-4">
192
+ <code class="language-markup">
193
+
194
+ </code>
195
+ </pre>
196
+ </div>
197
+ </div>
198
+ </div>
199
+ </div>
200
+ </body>
201
+ <script src="../../JS/prism.js"></script>
202
+ <script>
203
+ let cards = document.querySelectorAll(".cardes");
204
+ cards.forEach((card) => {
205
+ contentHTML = card.querySelector(".language-markup");
206
+ let content = card.children[0].outerHTML;
207
+ let newContent = content.replaceAll(/</g, "&lt;");
208
+ let finalContent = newContent.replaceAll(/>/g, "&gt;");
209
+ contentHTML.innerHTML = finalContent;
210
+ });
211
+ Prism.plugins.NormalizeWhitespace.setDefaults({
212
+ "remove-trailing": true,
213
+ "remove-indent": true,
214
+ "left-trim": true,
215
+ "right-trim": true,
216
+ });
217
+ </script>
218
+ </html>
data/HTML/Components/Pills.html ADDED
@@ -0,0 +1,94 @@
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
+ <head>
4
+ <meta charset="UTF-8" />
5
+ <title>Design System - Vitat</title>
6
+ <link rel="preconnect" href="https://fonts.googleapis.com" />
7
+ <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
8
+ <link href="https://fonts.googleapis.com/css2?family=Livvic:wght@400;600&display=swap" rel="stylesheet">
9
+ <link rel="stylesheet" href="../../css/style.css" />
10
+ <link rel="stylesheet" href="../../css/prism.css" />
11
+ </head>
12
+ <body>
13
+ <div class="container">
14
+ <div class="row">
15
+ <div class="col-lg-12">
16
+ <ul class="bar__ul">
17
+ <li class="bar__li">
18
+ <a class="bar__a" href="./Buttons.html">Botões</a>
19
+ </li>
20
+ <li class="bar__li">
21
+ <a class="bar__a" href="./Inputs.html">inputs</a>
22
+ </li>
23
+ <li class="bar__li">
24
+ <a class="bar__a" href="./Pills.html">Pills</a>
25
+ </li>
26
+ <li class="bar__li">
27
+ <a class="bar__a" href="./Card.html">Cards</a>
28
+ </li>
29
+ <li class="bar__li">
30
+ <a class="bar__a" href="./Pagination.html">Pagination</a>
31
+ </li>
32
+ <li class="bar__li">
33
+ <a class="bar__a" href="./Revisado.html">Revisado Por</a>
34
+ </li>
35
+ <li class="bar__li">
36
+ <a class="bar__a" href="./CardApp.html">Card App</a>
37
+ </li>
38
+ <li class="bar__li">
39
+ <a class="bar__a" href="./Arabescos.html">Arabescos</a>
40
+ </li>
41
+ <li class="bar__li">
42
+ <a class="bar__a" href="./Lista.html">Lista</a>
43
+ </li>
44
+ </ul>
45
+ </div>
46
+ </div>
47
+ </div>
48
+ <div class="container">
49
+ <div class="row my-5">
50
+ <div class="col-lg-12 my-4">
51
+ <div class="cardes">
52
+ <a href="#" target="blank" class="pill pill__secundary"> Saúde emocional: O que é e como cuidar da sua</a>
53
+ <pre class="line-numbers mt-4">
54
+ <code class="language-markup">
55
+
56
+ </code>
57
+ </pre>
58
+ </div>
59
+ <div class="cardes">
60
+ <a href="#" target="blank" class="pill pill__small pill__full bg__yellow">Alimentação</a>
61
+ <pre class="line-numbers mt-4">
62
+ <code class="language-markup">
63
+
64
+ </code>
65
+ </pre>
66
+ </div>
67
+ <div class="cardes">
68
+ <a href="#" target="blank" class="pill pill__small pill__full bg__pink">Gravidez e Maternidade</a>
69
+ <pre class="line-numbers mt-4">
70
+ <code class="language-markup">
71
+
72
+ </code>
73
+ </pre>
74
+ </div>
75
+ </div>
76
+ </body>
77
+ <script src="../../JS/prism.js"></script>
78
+ <script>
79
+ let cards = document.querySelectorAll(".cardes");
80
+ cards.forEach((card) => {
81
+ contentHTML = card.querySelector(".language-markup");
82
+ let content = card.children[0].outerHTML;
83
+ let newContent = content.replaceAll(/</g, "&lt;");
84
+ let finalContent = newContent.replaceAll(/>/g, "&gt;");
85
+ contentHTML.innerHTML = finalContent;
86
+ });
87
+ Prism.plugins.NormalizeWhitespace.setDefaults({
88
+ "remove-trailing": true,
89
+ "remove-indent": true,
90
+ "left-trim": true,
91
+ "right-trim": true,
92
+ });
93
+ </script>
94
+ </html>
data/HTML/Components/Revisado.html ADDED
@@ -0,0 +1,163 @@
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
+ <head>
4
+ <meta charset="UTF-8" />
5
+ <title>Design System - Vitat</title>
6
+ <link rel="preconnect" href="https://fonts.googleapis.com" />
7
+ <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
8
+ <link
9
+ href="https://fonts.googleapis.com/css2?family=Livvic:wght@400;600&display=swap"
10
+ rel="stylesheet"
11
+ />
12
+ <link rel="stylesheet" href="../../css/style.css" />
13
+ <link rel="stylesheet" href="../../css/prism.css" />
14
+ </head>
15
+ <body>
16
+ <div class="container">
17
+ <div class="row">
18
+ <div class="col-lg-12">
19
+ <ul class="bar__ul">
20
+ <li class="bar__li">
21
+ <a class="bar__a" href="./Buttons.html">Botões</a>
22
+ </li>
23
+ <li class="bar__li">
24
+ <a class="bar__a" href="./Inputs.html">inputs</a>
25
+ </li>
26
+ <li class="bar__li">
27
+ <a class="bar__a" href="./Pills.html">Pills</a>
28
+ </li>
29
+ <li class="bar__li">
30
+ <a class="bar__a" href="./Card.html">Cards</a>
31
+ </li>
32
+ <li class="bar__li">
33
+ <a class="bar__a" href="./Pagination.html">Pagination</a>
34
+ </li>
35
+ <li class="bar__li">
36
+ <a class="bar__a" href="./Revisado.html">Revisado Por</a>
37
+ </li>
38
+ <li class="bar__li">
39
+ <a class="bar__a" href="./CardApp.html">Card App</a>
40
+ </li>
41
+ <li class="bar__li">
42
+ <a class="bar__a" href="./Arabescos.html">Arabescos</a>
43
+ </li>
44
+ <li class="bar__li">
45
+ <a class="bar__a" href="./Lista.html">Lista</a>
46
+ </li>
47
+ </ul>
48
+ </div>
49
+ </div>
50
+ </div>
51
+ <div class="container">
52
+ <div class="row my-5">
53
+ <div class="col-lg-4 my-4">
54
+ <div class="cardes">
55
+ <div class="revisado">
56
+ <a href="#" class="revisado__ancora">
57
+ <div class="revisado__wrapper">
58
+ <img
59
+ class="revisado__img"
60
+ src="/img/placeholder_avatar.png"
61
+ alt="avatar_especialista"
62
+ />
63
+
64
+ <div class="revisado__text">
65
+ <p class="pillText">Revisado por</p>
66
+ <p class="body body__1 body__1--bold">Simone Dias</p>
67
+ <p class="overline">NUTRICIONISTA . CRN3 59579</p>
68
+ </div>
69
+ </div>
70
+ </a>
71
+ </div>
72
+
73
+ <pre class="line-numbers mt-4">
74
+ <code class="language-markup">
75
+
76
+ </code>
77
+ </pre>
78
+ </div>
79
+ </div>
80
+ <div class="col-lg-4 my-4">
81
+ <div class="cardes">
82
+ <div class="revisado">
83
+ <a href="#" class="revisado__ancora">
84
+ <div class="revisado__wrapper">
85
+ <img
86
+ class="revisado__img"
87
+ src="/img/placeholder_avatar.png"
88
+ alt="avatar_especialista"
89
+ />
90
+
91
+ <div class="revisado__text">
92
+ <p class="body body__1 body__1--bold">
93
+ Escrito por Simone Dias
94
+ </p>
95
+ <h3 class="body body__2">
96
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit,
97
+ sed do eiusmod tempor incididunt ut labore et dolore
98
+ magna...
99
+ </h3>
100
+ </div>
101
+ </div>
102
+ </a>
103
+ </div>
104
+
105
+ <pre class="line-numbers mt-4">
106
+ <code class="language-markup">
107
+
108
+ </code>
109
+ </pre>
110
+ </div>
111
+ </div>
112
+ <div class="col-lg-4 my-4">
113
+ <div class="cardes">
114
+ <div class="revisado">
115
+ <a href="#" class="revisado__ancora">
116
+ <div class="revisado__wrapper">
117
+ <img
118
+ class="revisado__img"
119
+ src="/img/placeholder_avatar.png"
120
+ alt="avatar_especialista"
121
+ />
122
+
123
+ <div class="revisado__text">
124
+ <p class="body body__1 body__1--bold">Simone Dias</p>
125
+ <p class="overline">NUTRICIONISTA . CRN3 59579</p>
126
+ <h3 class="body body__2">
127
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit,
128
+ sed do eiusmod tempor incididunt ut labore et dolore
129
+ magna...
130
+ </h3>
131
+ </div>
132
+ </div>
133
+ </a>
134
+ </div>
135
+
136
+ <pre class="line-numbers mt-4">
137
+ <code class="language-markup">
138
+
139
+ </code>
140
+ </pre>
141
+ </div>
142
+ </div>
143
+ </div>
144
+ </div>
145
+ </body>
146
+ <script src="../../JS/prism.js"></script>
147
+ <script>
148
+ let cards = document.querySelectorAll(".cardes");
149
+ cards.forEach((card) => {
150
+ contentHTML = card.querySelector(".language-markup");
151
+ let content = card.children[0].outerHTML;
152
+ let newContent = content.replaceAll(/</g, "&lt;");
153
+ let finalContent = newContent.replaceAll(/>/g, "&gt;");
154
+ contentHTML.innerHTML = finalContent;
155
+ });
156
+ Prism.plugins.NormalizeWhitespace.setDefaults({
157
+ "remove-trailing": true,
158
+ "remove-indent": true,
159
+ "left-trim": true,
160
+ "right-trim": true,
161
+ });
162
+ </script>
163
+ </html>