@syncfusion/ej2-angular-layouts 23.1.36-ngcc → 23.1.36

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 (230) hide show
  1. package/esm2020/public_api.mjs +3 -0
  2. package/esm2020/src/dashboard-layout/dashboardlayout-all.module.mjs +23 -0
  3. package/esm2020/src/dashboard-layout/dashboardlayout.component.mjs +64 -0
  4. package/esm2020/src/dashboard-layout/dashboardlayout.module.mjs +34 -0
  5. package/esm2020/src/dashboard-layout/panels.directive.mjs +72 -0
  6. package/esm2020/src/index.mjs +10 -0
  7. package/esm2020/src/splitter/panesettings.directive.mjs +66 -0
  8. package/esm2020/src/splitter/splitter-all.module.mjs +23 -0
  9. package/esm2020/src/splitter/splitter.component.mjs +64 -0
  10. package/esm2020/src/splitter/splitter.module.mjs +34 -0
  11. package/esm2020/syncfusion-ej2-angular-layouts.mjs +5 -0
  12. package/fesm2015/syncfusion-ej2-angular-layouts.mjs +354 -0
  13. package/fesm2015/syncfusion-ej2-angular-layouts.mjs.map +1 -0
  14. package/fesm2020/syncfusion-ej2-angular-layouts.mjs +354 -0
  15. package/fesm2020/syncfusion-ej2-angular-layouts.mjs.map +1 -0
  16. package/package.json +26 -12
  17. package/src/dashboard-layout/dashboardlayout-all.module.d.ts +6 -0
  18. package/src/dashboard-layout/dashboardlayout.component.d.ts +3 -0
  19. package/src/dashboard-layout/dashboardlayout.module.d.ts +7 -0
  20. package/src/dashboard-layout/panels.directive.d.ts +5 -0
  21. package/src/splitter/panesettings.directive.d.ts +5 -0
  22. package/src/splitter/splitter-all.module.d.ts +6 -0
  23. package/src/splitter/splitter.component.d.ts +3 -0
  24. package/src/splitter/splitter.module.d.ts +7 -0
  25. package/styles/avatar/_all.scss +1 -0
  26. package/styles/avatar/_bootstrap-dark-definition.scss +18 -0
  27. package/styles/avatar/_bootstrap-definition.scss +18 -0
  28. package/styles/avatar/_bootstrap4-definition.scss +18 -0
  29. package/styles/avatar/_bootstrap5-dark-definition.scss +1 -0
  30. package/styles/avatar/_bootstrap5-definition.scss +26 -0
  31. package/styles/avatar/_fabric-dark-definition.scss +18 -0
  32. package/styles/avatar/_fabric-definition.scss +18 -0
  33. package/styles/avatar/_fluent-dark-definition.scss +1 -0
  34. package/styles/avatar/_fluent-definition.scss +25 -0
  35. package/styles/avatar/_fusionnew-definition.scss +26 -0
  36. package/styles/avatar/_highcontrast-definition.scss +18 -0
  37. package/styles/avatar/_highcontrast-light-definition.scss +18 -0
  38. package/styles/avatar/_layout.scss +79 -0
  39. package/styles/avatar/_material-dark-definition.scss +18 -0
  40. package/styles/avatar/_material-definition.scss +18 -0
  41. package/styles/avatar/_material3-dark-definition.scss +1 -0
  42. package/styles/avatar/_material3-definition.scss +26 -0
  43. package/styles/avatar/_tailwind-dark-definition.scss +1 -0
  44. package/styles/avatar/_tailwind-definition.scss +25 -0
  45. package/styles/avatar/_theme.scss +1 -0
  46. package/styles/avatar/bootstrap-dark.scss +3 -1
  47. package/styles/avatar/bootstrap.scss +3 -1
  48. package/styles/avatar/bootstrap4.scss +3 -1
  49. package/styles/avatar/bootstrap5-dark.scss +3 -1
  50. package/styles/avatar/bootstrap5.scss +3 -1
  51. package/styles/avatar/fabric-dark.scss +3 -1
  52. package/styles/avatar/fabric.scss +3 -1
  53. package/styles/avatar/fluent-dark.scss +3 -1
  54. package/styles/avatar/fluent.scss +3 -1
  55. package/styles/avatar/highcontrast-light.scss +3 -1
  56. package/styles/avatar/highcontrast.scss +3 -1
  57. package/styles/avatar/material-dark.scss +3 -1
  58. package/styles/avatar/material.scss +3 -1
  59. package/styles/avatar/material3-dark.scss +3 -1
  60. package/styles/avatar/material3.scss +3 -1
  61. package/styles/avatar/tailwind-dark.scss +3 -1
  62. package/styles/avatar/tailwind.scss +3 -1
  63. package/styles/card/_all.scss +2 -0
  64. package/styles/card/_bootstrap-dark-definition.scss +245 -0
  65. package/styles/card/_bootstrap-definition.scss +125 -0
  66. package/styles/card/_bootstrap4-definition.scss +127 -0
  67. package/styles/card/_bootstrap5-dark-definition.scss +1 -0
  68. package/styles/card/_bootstrap5-definition.scss +125 -0
  69. package/styles/card/_fabric-dark-definition.scss +233 -0
  70. package/styles/card/_fabric-definition.scss +124 -0
  71. package/styles/card/_fluent-dark-definition.scss +1 -0
  72. package/styles/card/_fluent-definition.scss +130 -0
  73. package/styles/card/_fusionnew-definition.scss +125 -0
  74. package/styles/card/_highcontrast-definition.scss +125 -0
  75. package/styles/card/_highcontrast-light-definition.scss +246 -0
  76. package/styles/card/_layout.scss +528 -0
  77. package/styles/card/_material-dark-definition.scss +240 -0
  78. package/styles/card/_material-definition.scss +124 -0
  79. package/styles/card/_material3-dark-definition.scss +1 -0
  80. package/styles/card/_material3-definition.scss +125 -0
  81. package/styles/card/_tailwind-dark-definition.scss +1 -0
  82. package/styles/card/_tailwind-definition.scss +123 -0
  83. package/styles/card/_theme.scss +104 -0
  84. package/styles/card/bootstrap-dark.scss +3 -1
  85. package/styles/card/bootstrap.scss +3 -1
  86. package/styles/card/bootstrap4.scss +3 -1
  87. package/styles/card/bootstrap5-dark.scss +3 -1
  88. package/styles/card/bootstrap5.scss +3 -1
  89. package/styles/card/fabric-dark.scss +3 -1
  90. package/styles/card/fabric.scss +3 -1
  91. package/styles/card/fluent-dark.scss +3 -1
  92. package/styles/card/fluent.scss +3 -1
  93. package/styles/card/highcontrast-light.scss +3 -1
  94. package/styles/card/highcontrast.scss +3 -1
  95. package/styles/card/material-dark.scss +3 -1
  96. package/styles/card/material.scss +3 -1
  97. package/styles/card/material3-dark.scss +3 -1
  98. package/styles/card/material3.scss +3 -1
  99. package/styles/card/tailwind-dark.scss +3 -1
  100. package/styles/card/tailwind.scss +3 -1
  101. package/styles/dashboard-layout/_all.scss +2 -0
  102. package/styles/dashboard-layout/_bootstrap-dark-definition.scss +102 -0
  103. package/styles/dashboard-layout/_bootstrap-definition.scss +102 -0
  104. package/styles/dashboard-layout/_bootstrap4-definition.scss +102 -0
  105. package/styles/dashboard-layout/_bootstrap5-dark-definition.scss +1 -0
  106. package/styles/dashboard-layout/_bootstrap5-definition.scss +108 -0
  107. package/styles/dashboard-layout/_fabric-dark-definition.scss +103 -0
  108. package/styles/dashboard-layout/_fabric-definition.scss +102 -0
  109. package/styles/dashboard-layout/_fluent-dark-definition.scss +1 -0
  110. package/styles/dashboard-layout/_fluent-definition.scss +111 -0
  111. package/styles/dashboard-layout/_fusionnew-definition.scss +108 -0
  112. package/styles/dashboard-layout/_highcontrast-definition.scss +100 -0
  113. package/styles/dashboard-layout/_highcontrast-light-definition.scss +100 -0
  114. package/styles/dashboard-layout/_layout.scss +263 -0
  115. package/styles/dashboard-layout/_material-dark-definition.scss +103 -0
  116. package/styles/dashboard-layout/_material-definition.scss +102 -0
  117. package/styles/dashboard-layout/_material3-dark-definition.scss +1 -0
  118. package/styles/dashboard-layout/_material3-definition.scss +108 -0
  119. package/styles/dashboard-layout/_tailwind-dark-definition.scss +1 -0
  120. package/styles/dashboard-layout/_tailwind-definition.scss +109 -0
  121. package/styles/dashboard-layout/_theme.scss +128 -0
  122. package/styles/dashboard-layout/bootstrap-dark.scss +4 -1
  123. package/styles/dashboard-layout/bootstrap.scss +4 -1
  124. package/styles/dashboard-layout/bootstrap4.scss +4 -1
  125. package/styles/dashboard-layout/bootstrap5-dark.scss +4 -1
  126. package/styles/dashboard-layout/bootstrap5.scss +4 -1
  127. package/styles/dashboard-layout/fabric-dark.scss +4 -1
  128. package/styles/dashboard-layout/fabric.scss +4 -1
  129. package/styles/dashboard-layout/fluent-dark.scss +4 -1
  130. package/styles/dashboard-layout/fluent.scss +4 -1
  131. package/styles/dashboard-layout/highcontrast-light.scss +3 -1
  132. package/styles/dashboard-layout/highcontrast.scss +4 -1
  133. package/styles/dashboard-layout/icons/_bootstrap-dark.scss +80 -0
  134. package/styles/dashboard-layout/icons/_bootstrap.scss +80 -0
  135. package/styles/dashboard-layout/icons/_bootstrap4.scss +80 -0
  136. package/styles/dashboard-layout/icons/_bootstrap5-dark.scss +1 -0
  137. package/styles/dashboard-layout/icons/_bootstrap5.scss +80 -0
  138. package/styles/dashboard-layout/icons/_fabric-dark.scss +80 -0
  139. package/styles/dashboard-layout/icons/_fabric.scss +80 -0
  140. package/styles/dashboard-layout/icons/_fluent-dark.scss +1 -0
  141. package/styles/dashboard-layout/icons/_fluent.scss +80 -0
  142. package/styles/dashboard-layout/icons/_fusionnew.scss +80 -0
  143. package/styles/dashboard-layout/icons/_highcontrast.scss +80 -0
  144. package/styles/dashboard-layout/icons/_material-dark.scss +80 -0
  145. package/styles/dashboard-layout/icons/_material.scss +80 -0
  146. package/styles/dashboard-layout/icons/_material3-dark.scss +1 -0
  147. package/styles/dashboard-layout/icons/_material3.scss +80 -0
  148. package/styles/dashboard-layout/icons/_tailwind-dark.scss +80 -0
  149. package/styles/dashboard-layout/icons/_tailwind.scss +80 -0
  150. package/styles/dashboard-layout/material-dark.scss +4 -1
  151. package/styles/dashboard-layout/material.scss +4 -1
  152. package/styles/dashboard-layout/material3-dark.scss +4 -1
  153. package/styles/dashboard-layout/material3.scss +4 -1
  154. package/styles/dashboard-layout/tailwind-dark.scss +4 -1
  155. package/styles/dashboard-layout/tailwind.scss +4 -1
  156. package/styles/material3-dark.css +1 -167
  157. package/styles/material3-dark.scss +1 -0
  158. package/styles/material3.css +1 -335
  159. package/styles/material3.scss +1 -0
  160. package/styles/splitter/_all.scss +3 -0
  161. package/styles/splitter/_bootstrap-dark-definition.scss +26 -0
  162. package/styles/splitter/_bootstrap-definition.scss +26 -0
  163. package/styles/splitter/_bootstrap4-definition.scss +26 -0
  164. package/styles/splitter/_bootstrap5-dark-definition.scss +1 -0
  165. package/styles/splitter/_bootstrap5-definition.scss +31 -0
  166. package/styles/splitter/_definition.scss +1 -0
  167. package/styles/splitter/_fabric-dark-definition.scss +26 -0
  168. package/styles/splitter/_fabric-definition.scss +26 -0
  169. package/styles/splitter/_fluent-dark-definition.scss +1 -0
  170. package/styles/splitter/_fluent-definition.scss +31 -0
  171. package/styles/splitter/_fusionnew-definition.scss +31 -0
  172. package/styles/splitter/_highcontrast-definition.scss +26 -0
  173. package/styles/splitter/_highcontrast-light-definition.scss +26 -0
  174. package/styles/splitter/_layout.scss +416 -0
  175. package/styles/splitter/_material-dark-definition.scss +26 -0
  176. package/styles/splitter/_material-definition.scss +27 -0
  177. package/styles/splitter/_material3-dark-definition.scss +1 -0
  178. package/styles/splitter/_material3-definition.scss +31 -0
  179. package/styles/splitter/_responsive.scss +1 -0
  180. package/styles/splitter/_tailwind-dark-definition.scss +1 -0
  181. package/styles/splitter/_tailwind-definition.scss +31 -0
  182. package/styles/splitter/_theme.scss +207 -0
  183. package/styles/splitter/bootstrap-dark.scss +4 -1
  184. package/styles/splitter/bootstrap.scss +4 -1
  185. package/styles/splitter/bootstrap4.scss +4 -1
  186. package/styles/splitter/bootstrap5-dark.scss +4 -1
  187. package/styles/splitter/bootstrap5.scss +4 -1
  188. package/styles/splitter/fabric-dark.scss +4 -1
  189. package/styles/splitter/fabric.scss +4 -1
  190. package/styles/splitter/fluent-dark.scss +4 -1
  191. package/styles/splitter/fluent.scss +4 -1
  192. package/styles/splitter/highcontrast-light.scss +4 -1
  193. package/styles/splitter/highcontrast.scss +4 -1
  194. package/styles/splitter/icons/_bootstrap-dark.scss +52 -0
  195. package/styles/splitter/icons/_bootstrap.scss +52 -0
  196. package/styles/splitter/icons/_bootstrap4.scss +51 -0
  197. package/styles/splitter/icons/_bootstrap5-dark.scss +1 -0
  198. package/styles/splitter/icons/_bootstrap5.scss +39 -0
  199. package/styles/splitter/icons/_fabric-dark.scss +52 -0
  200. package/styles/splitter/icons/_fabric.scss +52 -0
  201. package/styles/splitter/icons/_fluent-dark.scss +1 -0
  202. package/styles/splitter/icons/_fluent.scss +39 -0
  203. package/styles/splitter/icons/_fusionnew.scss +39 -0
  204. package/styles/splitter/icons/_highcontrast-light.scss +52 -0
  205. package/styles/splitter/icons/_highcontrast.scss +52 -0
  206. package/styles/splitter/icons/_material-dark.scss +51 -0
  207. package/styles/splitter/icons/_material.scss +51 -0
  208. package/styles/splitter/icons/_material3-dark.scss +1 -0
  209. package/styles/splitter/icons/_material3.scss +39 -0
  210. package/styles/splitter/icons/_tailwind-dark.scss +1 -0
  211. package/styles/splitter/icons/_tailwind.scss +39 -0
  212. package/styles/splitter/material-dark.scss +4 -1
  213. package/styles/splitter/material.scss +4 -1
  214. package/styles/splitter/material3-dark.scss +4 -1
  215. package/styles/splitter/material3.scss +4 -1
  216. package/styles/splitter/tailwind-dark.scss +4 -1
  217. package/styles/splitter/tailwind.scss +4 -1
  218. package/syncfusion-ej2-angular-layouts.d.ts +5 -0
  219. package/@syncfusion/ej2-angular-layouts.es5.js +0 -495
  220. package/@syncfusion/ej2-angular-layouts.es5.js.map +0 -1
  221. package/@syncfusion/ej2-angular-layouts.js +0 -447
  222. package/@syncfusion/ej2-angular-layouts.js.map +0 -1
  223. package/CHANGELOG.md +0 -575
  224. package/dist/ej2-angular-layouts.umd.js +0 -522
  225. package/dist/ej2-angular-layouts.umd.js.map +0 -1
  226. package/dist/ej2-angular-layouts.umd.min.js +0 -11
  227. package/dist/ej2-angular-layouts.umd.min.js.map +0 -1
  228. package/ej2-angular-layouts.d.ts +0 -6
  229. package/ej2-angular-layouts.metadata.json +0 -1
  230. package/postinstall/tagchange.js +0 -18
@@ -0,0 +1,18 @@
1
+ // Avatar Base
2
+ $avatar-base-border-radius: 5px !default;
3
+ $avatar-base-font-size: 1em !default;
4
+ $avatar-base-width: 3em !default;
5
+ $avatar-base-height: 3em !default;
6
+ $avatar-base-background-color: #bcbcbc !default;
7
+ $avatar-base-text-color: #fff !default;
8
+ $avatar-base-font-weight: 400 !default;
9
+ $avatar-base-img-height: 100% !default;
10
+
11
+ // Circle Avatar
12
+ $avatar-circle-border-radius: 50% !default;
13
+
14
+ // Avatar size
15
+ $avatar-xsmall-font-size: .6em !default;
16
+ $avatar-small-font-size: .8em !default;
17
+ $avatar-large-font-size: 1.2em !default;
18
+ $avatar-xlarge-font-size: 1.4em !default;
@@ -0,0 +1,18 @@
1
+ // Avatar Base
2
+ $avatar-base-border-radius: 5px !default;
3
+ $avatar-base-font-size: 1em !default;
4
+ $avatar-base-width: 3em !default;
5
+ $avatar-base-height: 3em !default;
6
+ $avatar-base-background-color: #bcbcbc !default;
7
+ $avatar-base-text-color: #fff !default;
8
+ $avatar-base-font-weight: 400 !default;
9
+ $avatar-base-img-height: 100% !default;
10
+
11
+ // Circle Avatar
12
+ $avatar-circle-border-radius: 50% !default;
13
+
14
+ // Avatar size
15
+ $avatar-xsmall-font-size: .6em !default;
16
+ $avatar-small-font-size: .8em !default;
17
+ $avatar-large-font-size: 1.2em !default;
18
+ $avatar-xlarge-font-size: 1.4em !default;
@@ -0,0 +1,18 @@
1
+ // Avatar Base
2
+ $avatar-base-border-radius: 4px !default;
3
+ $avatar-base-font-size: 1.05em !default;
4
+ $avatar-base-width: 2.5em !default;
5
+ $avatar-base-height: 2.5em !default;
6
+ $avatar-base-background-color: $gray-200 !default;
7
+ $avatar-base-text-color: $gray-900 !default;
8
+ $avatar-base-font-weight: 400 !default;
9
+ $avatar-base-img-height: 100% !default;
10
+
11
+ // Circle Avatar
12
+ $avatar-circle-border-radius: 50% !default;
13
+
14
+ // Avatar size
15
+ $avatar-xsmall-font-size: .65em !default;
16
+ $avatar-small-font-size: .85em !default;
17
+ $avatar-large-font-size: 1.25em !default;
18
+ $avatar-xlarge-font-size: 1.45em !default;
@@ -0,0 +1 @@
1
+ @import './bootstrap5-definition.scss';
@@ -0,0 +1,26 @@
1
+ // Avatar Base
2
+ $avatar-base-border-radius: 2px !default;
3
+ $avatar-base-background-color: $content-bg-color-alt3 !default;
4
+ $avatar-base-font-size: $text-sm !default;
5
+ $avatar-base-width: 40px !default;
6
+ $avatar-base-height: 40px !default;
7
+ $avatar-base-line-height: 22px !default;
8
+ $avatar-base-text-color: $icon-color !default;
9
+ $avatar-base-font-weight: $font-weight-medium !default;
10
+ $avatar-base-img-height: 100% !default;
11
+
12
+ // Circle Avatar
13
+ $avatar-circle-border-radius: 50% !default;
14
+
15
+ // Avatar size
16
+ $avatar-xsmall-font-size: $text-xxs !default;
17
+ $avatar-small-font-size: $text-xs !default;
18
+ $avatar-large-font-size: $text-lg !default;
19
+ $avatar-xlarge-font-size: $text-xl !default;
20
+ $avatar-large-border-radius: 4px !default;
21
+
22
+ // Avatar Line Height
23
+ $avatar-base-xsmall-line-height: 16px !default;
24
+ $avatar-base-small-line-height: 18px !default;
25
+ $avatar-base-large-line-height: 28px !default;
26
+ $avatar-base-xlarge-line-height: 28px !default;
@@ -0,0 +1,18 @@
1
+ // Avatar Base
2
+ $avatar-base-border-radius: 5px !default;
3
+ $avatar-base-font-size: 1em !default;
4
+ $avatar-base-width: 3em !default;
5
+ $avatar-base-height: 3em !default;
6
+ $avatar-base-background-color: #bcbcbc !default;
7
+ $avatar-base-text-color: #fff !default;
8
+ $avatar-base-font-weight: 400 !default;
9
+ $avatar-base-img-height: 100% !default;
10
+
11
+ // Circle Avatar
12
+ $avatar-circle-border-radius: 50% !default;
13
+
14
+ // Avatar size
15
+ $avatar-xsmall-font-size: .6em !default;
16
+ $avatar-small-font-size: .8em !default;
17
+ $avatar-large-font-size: 1.2em !default;
18
+ $avatar-xlarge-font-size: 1.4em !default;
@@ -0,0 +1,18 @@
1
+ // Avatar Base
2
+ $avatar-base-border-radius: 5px !default;
3
+ $avatar-base-font-size: 1em !default;
4
+ $avatar-base-width: 3em !default;
5
+ $avatar-base-height: 3em !default;
6
+ $avatar-base-background-color: #bcbcbc !default;
7
+ $avatar-base-text-color: #fff !default;
8
+ $avatar-base-font-weight: 400 !default;
9
+ $avatar-base-img-height: 100% !default;
10
+
11
+ // Circle Avatar
12
+ $avatar-circle-border-radius: 50% !default;
13
+
14
+ // Avatar size
15
+ $avatar-xsmall-font-size: .6em !default;
16
+ $avatar-small-font-size: .8em !default;
17
+ $avatar-large-font-size: 1.2em !default;
18
+ $avatar-xlarge-font-size: 1.4em !default;
@@ -0,0 +1 @@
1
+ @import './fluent-definition.scss';
@@ -0,0 +1,25 @@
1
+ // Avatar Base
2
+ $avatar-base-border-radius: 4px !default;
3
+ $avatar-base-background-color: $content-bg-color-alt3 !default;
4
+ $avatar-base-font-size: $text-base !default;
5
+ $avatar-base-width: 40px !default;
6
+ $avatar-base-height: 40px !default;
7
+ $avatar-base-line-height: 24px !default;
8
+ $avatar-base-text-color: $icon-color !default;
9
+ $avatar-base-font-weight: $font-weight-normal !default;
10
+ $avatar-base-img-height: 100% !default;
11
+
12
+ // Circle Avatar
13
+ $avatar-circle-border-radius: 50% !default;
14
+
15
+ // Avatar size
16
+ $avatar-xsmall-font-size: $text-xxs !default;
17
+ $avatar-small-font-size: $text-xs !default;
18
+ $avatar-large-font-size: $text-xl !default;
19
+ $avatar-xlarge-font-size: $text-2xl !default;
20
+
21
+ // Avatar Line Height
22
+ $avatar-base-xsmall-line-height: 16px !default;
23
+ $avatar-base-small-line-height: 18px !default;
24
+ $avatar-base-large-line-height: 28px !default;
25
+ $avatar-base-xlarge-line-height: 28px !default;
@@ -0,0 +1,26 @@
1
+ // Avatar Base
2
+ $avatar-base-border-radius: 2px !default;
3
+ $avatar-base-background-color: $content-bg-color-alt3 !default;
4
+ $avatar-base-font-size: $text-sm !default;
5
+ $avatar-base-width: 40px !default;
6
+ $avatar-base-height: 40px !default;
7
+ $avatar-base-line-height: 22px !default;
8
+ $avatar-base-text-color: $icon-color !default;
9
+ $avatar-base-font-weight: $font-weight-medium !default;
10
+ $avatar-base-img-height: 100% !default;
11
+
12
+ // Circle Avatar
13
+ $avatar-circle-border-radius: 50% !default;
14
+
15
+ // Avatar size
16
+ $avatar-xsmall-font-size: $text-xxs !default;
17
+ $avatar-small-font-size: $text-xs !default;
18
+ $avatar-large-font-size: $text-lg !default;
19
+ $avatar-xlarge-font-size: $text-xl !default;
20
+ $avatar-large-border-radius: 4px !default;
21
+
22
+ // Avatar Line Height
23
+ $avatar-base-xsmall-line-height: 16px !default;
24
+ $avatar-base-small-line-height: 18px !default;
25
+ $avatar-base-large-line-height: 28px !default;
26
+ $avatar-base-xlarge-line-height: 28px !default;
@@ -0,0 +1,18 @@
1
+ // Avatar Base
2
+ $avatar-base-border-radius: 5px !default;
3
+ $avatar-base-font-size: 1em !default;
4
+ $avatar-base-width: 3em !default;
5
+ $avatar-base-height: 3em !default;
6
+ $avatar-base-background-color: #bcbcbc !default;
7
+ $avatar-base-text-color: #fff !default;
8
+ $avatar-base-font-weight: 400 !default;
9
+ $avatar-base-img-height: 100% !default;
10
+
11
+ // Circle Avatar
12
+ $avatar-circle-border-radius: 50% !default;
13
+
14
+ // Avatar size
15
+ $avatar-xsmall-font-size: .6em !default;
16
+ $avatar-small-font-size: .8em !default;
17
+ $avatar-large-font-size: 1.2em !default;
18
+ $avatar-xlarge-font-size: 1.4em !default;
@@ -0,0 +1,18 @@
1
+ // Avatar Base
2
+ $avatar-base-border-radius: 5px !default;
3
+ $avatar-base-font-size: 1em !default;
4
+ $avatar-base-width: 3em !default;
5
+ $avatar-base-height: 3em !default;
6
+ $avatar-base-background-color: #bcbcbc !default;
7
+ $avatar-base-text-color: #fff !default;
8
+ $avatar-base-font-weight: 400 !default;
9
+ $avatar-base-img-height: 100% !default;
10
+
11
+ // Circle Avatar
12
+ $avatar-circle-border-radius: 50% !default;
13
+
14
+ // Avatar size
15
+ $avatar-xsmall-font-size: .6em !default;
16
+ $avatar-small-font-size: .8em !default;
17
+ $avatar-large-font-size: 1.2em !default;
18
+ $avatar-xlarge-font-size: 1.4em !default;
@@ -0,0 +1,79 @@
1
+ @include export-module('avatar-layout') {
2
+ .e-avatar {
3
+ align-content: center;
4
+ align-items: center;
5
+ background-color: $avatar-base-background-color;
6
+ background-position: center;
7
+ background-repeat: no-repeat;
8
+ background-size: cover;
9
+ border-radius: $avatar-base-border-radius;
10
+ color: $avatar-base-text-color;
11
+ display: inline-flex;
12
+ font-family: $font-family;
13
+ font-size: $avatar-base-font-size;
14
+ font-weight: $avatar-base-font-weight;
15
+ height: $avatar-base-height;
16
+ justify-content: center;
17
+ overflow: hidden;
18
+ position: relative;
19
+ width: $avatar-base-width;
20
+ @if ($skin-name == 'tailwind' or $skin-name == 'tailwind-dark' or $skin-name == 'bootstrap5' or $skin-name == 'FluentUI' or $skin-name == 'Material3') {
21
+ line-height: $avatar-base-line-height;
22
+ }
23
+
24
+ img {
25
+ height: $avatar-base-img-height;
26
+ width: auto;
27
+ }
28
+
29
+ &.e-avatar-circle {
30
+ border-radius: $avatar-circle-border-radius;
31
+ &.e-avatar-large,
32
+ &.e-avatar-xlarge {
33
+ border-radius: $avatar-circle-border-radius;
34
+ }
35
+ }
36
+
37
+ &.e-avatar-xsmall {
38
+ font-size: $avatar-xsmall-font-size;
39
+ @if ($skin-name == 'tailwind' or $skin-name == 'tailwind-dark' or $skin-name == 'bootstrap5' or $skin-name == 'FluentUI' or $skin-name == 'Material3') {
40
+ height: 24px;
41
+ line-height: $avatar-base-xsmall-line-height;
42
+ width: 24px;
43
+ }
44
+ }
45
+
46
+ &.e-avatar-small {
47
+ font-size: $avatar-small-font-size;
48
+ @if ($skin-name == 'tailwind' or $skin-name == 'tailwind-dark' or $skin-name == 'bootstrap5' or $skin-name == 'FluentUI' or $skin-name == 'Material3') {
49
+ height: 32px;
50
+ line-height: $avatar-base-small-line-height;
51
+ width: 32px;
52
+ }
53
+ }
54
+
55
+ &.e-avatar-large {
56
+ font-size: $avatar-large-font-size;
57
+ @if ($skin-name == 'bootstrap5') {
58
+ border-radius: $avatar-large-border-radius;
59
+ }
60
+ @if ($skin-name == 'tailwind' or $skin-name == 'tailwind-dark' or $skin-name == 'bootstrap5' or $skin-name == 'FluentUI' or $skin-name == 'Material3') {
61
+ height: 48px;
62
+ line-height: $avatar-base-large-line-height;
63
+ width: 48px;
64
+ }
65
+ }
66
+
67
+ &.e-avatar-xlarge {
68
+ font-size: $avatar-xlarge-font-size;
69
+ @if ($skin-name == 'bootstrap5') {
70
+ border-radius: $avatar-large-border-radius;
71
+ }
72
+ @if ($skin-name == 'tailwind' or $skin-name == 'tailwind-dark'or $skin-name == 'bootstrap5' or $skin-name == 'FluentUI' or $skin-name == 'Material3') {
73
+ height: 56px;
74
+ line-height: $avatar-base-xlarge-line-height;
75
+ width: 56px;
76
+ }
77
+ }
78
+ }
79
+ }
@@ -0,0 +1,18 @@
1
+ // Avatar Base
2
+ $avatar-base-border-radius: 5px !default;
3
+ $avatar-base-font-size: 1em !default;
4
+ $avatar-base-width: 3em !default;
5
+ $avatar-base-height: 3em !default;
6
+ $avatar-base-background-color: #bcbcbc !default;
7
+ $avatar-base-text-color: #fff !default;
8
+ $avatar-base-font-weight: 400 !default;
9
+ $avatar-base-img-height: 100% !default;
10
+
11
+ // Circle Avatar
12
+ $avatar-circle-border-radius: 50% !default;
13
+
14
+ // Avatar size
15
+ $avatar-xsmall-font-size: .6em !default;
16
+ $avatar-small-font-size: .8em !default;
17
+ $avatar-large-font-size: 1.2em !default;
18
+ $avatar-xlarge-font-size: 1.4em !default;
@@ -0,0 +1,18 @@
1
+ // Avatar Base
2
+ $avatar-base-border-radius: 5px !default;
3
+ $avatar-base-font-size: 1em !default;
4
+ $avatar-base-width: 3em !default;
5
+ $avatar-base-height: 3em !default;
6
+ $avatar-base-background-color: #bcbcbc !default;
7
+ $avatar-base-text-color: #fff !default;
8
+ $avatar-base-font-weight: 400 !default;
9
+ $avatar-base-img-height: 100% !default;
10
+
11
+ // Circle Avatar
12
+ $avatar-circle-border-radius: 50% !default;
13
+
14
+ // Avatar size
15
+ $avatar-xsmall-font-size: .6em !default;
16
+ $avatar-small-font-size: .8em !default;
17
+ $avatar-large-font-size: 1.2em !default;
18
+ $avatar-xlarge-font-size: 1.4em !default;
@@ -0,0 +1 @@
1
+ @import './material3-definition.scss';
@@ -0,0 +1,26 @@
1
+ // Avatar Base
2
+ $avatar-base-border-radius: 4px !default;
3
+ $avatar-base-background-color: rgba($primary-light) !default;
4
+ $avatar-base-font-size: $text-xl !default;
5
+ $avatar-base-width: 40px !default;
6
+ $avatar-base-height: 40px !default;
7
+ $avatar-base-line-height: 20px !default;
8
+ $avatar-base-text-color: rgba($primary-darker) !default;
9
+ $avatar-base-font-weight: 500 !default;
10
+ $avatar-base-img-height: 100% !default;
11
+
12
+ // Circle Avatar
13
+ $avatar-circle-border-radius: 50% !default;
14
+
15
+ // Avatar size
16
+ $avatar-xsmall-font-size: 14px !default;
17
+ $avatar-small-font-size: 18px !default;
18
+ $avatar-large-font-size: 26px !default;
19
+ $avatar-xlarge-font-size: 30px !default;
20
+ $avatar-large-border-radius: 4px !default;
21
+
22
+ // Avatar Line Height
23
+ $avatar-base-xsmall-line-height: 14px !default;
24
+ $avatar-base-small-line-height: 18px !default;
25
+ $avatar-base-large-line-height: 26px !default;
26
+ $avatar-base-xlarge-line-height: 30px !default;
@@ -0,0 +1 @@
1
+ @import './tailwind-definition.scss';
@@ -0,0 +1,25 @@
1
+ // Avatar Base
2
+ $avatar-base-border-radius: 4px !default;
3
+ $avatar-base-background-color: $content-bg-color-alt3 !default;
4
+ $avatar-base-font-size: $text-sm !default;
5
+ $avatar-base-width: 40px !default;
6
+ $avatar-base-height: 40px !default;
7
+ $avatar-base-line-height: 22px !default;
8
+ $avatar-base-text-color: $content-text-color-alt2 !default;
9
+ $avatar-base-font-weight: $font-weight-medium !default;
10
+ $avatar-base-img-height: 100% !default;
11
+
12
+ // Circle Avatar
13
+ $avatar-circle-border-radius: 50% !default;
14
+
15
+ // Avatar size
16
+ $avatar-xsmall-font-size: $text-xxs !default;
17
+ $avatar-small-font-size: $text-xs !default;
18
+ $avatar-large-font-size: $text-lg !default;
19
+ $avatar-xlarge-font-size: $text-xl !default;
20
+
21
+ // Avatar Line Height
22
+ $avatar-base-xsmall-line-height: 16px !default;
23
+ $avatar-base-small-line-height: 18px !default;
24
+ $avatar-base-large-line-height: 28px !default;
25
+ $avatar-base-xlarge-line-height: 28px !default;
@@ -0,0 +1 @@
1
+ /* stylelint-disable-line no-empty-source */
@@ -1 +1,3 @@
1
- @import 'ej2-layouts/styles/avatar/bootstrap-dark.scss';
1
+ @import 'ej2-base/styles/definition/bootstrap-dark.scss';
2
+ @import 'bootstrap-dark-definition.scss';
3
+ @import 'all.scss';
@@ -1 +1,3 @@
1
- @import 'ej2-layouts/styles/avatar/bootstrap.scss';
1
+ @import 'ej2-base/styles/definition/bootstrap.scss';
2
+ @import 'bootstrap-definition.scss';
3
+ @import 'all.scss';
@@ -1 +1,3 @@
1
- @import 'ej2-layouts/styles/avatar/bootstrap4.scss';
1
+ @import 'ej2-base/styles/definition/bootstrap4.scss';
2
+ @import 'bootstrap4-definition.scss';
3
+ @import 'all.scss';
@@ -1 +1,3 @@
1
- @import 'ej2-layouts/styles/avatar/bootstrap5-dark.scss';
1
+ @import 'ej2-base/styles/definition/bootstrap5-dark.scss';
2
+ @import 'bootstrap5-dark-definition.scss';
3
+ @import 'all.scss';
@@ -1 +1,3 @@
1
- @import 'ej2-layouts/styles/avatar/bootstrap5.scss';
1
+ @import 'ej2-base/styles/definition/bootstrap5.scss';
2
+ @import 'bootstrap5-definition.scss';
3
+ @import 'all.scss';
@@ -1 +1,3 @@
1
- @import 'ej2-layouts/styles/avatar/fabric-dark.scss';
1
+ @import 'ej2-base/styles/definition/fabric-dark.scss';
2
+ @import 'fabric-dark-definition.scss';
3
+ @import 'all.scss';
@@ -1 +1,3 @@
1
- @import 'ej2-layouts/styles/avatar/fabric.scss';
1
+ @import 'ej2-base/styles/definition/fabric.scss';
2
+ @import 'fabric-definition.scss';
3
+ @import 'all.scss';
@@ -1 +1,3 @@
1
- @import 'ej2-layouts/styles/avatar/fluent-dark.scss';
1
+ @import 'ej2-base/styles/definition/fluent-dark.scss';
2
+ @import 'fluent-dark-definition.scss';
3
+ @import 'all.scss';
@@ -1 +1,3 @@
1
- @import 'ej2-layouts/styles/avatar/fluent.scss';
1
+ @import 'ej2-base/styles/definition/fluent.scss';
2
+ @import 'fluent-definition.scss';
3
+ @import 'all.scss';
@@ -1 +1,3 @@
1
- @import 'ej2-layouts/styles/avatar/highcontrast-light.scss';
1
+ @import 'ej2-base/styles/definition/highcontrast-light.scss';
2
+ @import 'highcontrast-light-definition.scss';
3
+ @import 'all.scss';
@@ -1 +1,3 @@
1
- @import 'ej2-layouts/styles/avatar/highcontrast.scss';
1
+ @import 'ej2-base/styles/definition/highcontrast.scss';
2
+ @import 'highcontrast-definition.scss';
3
+ @import 'all.scss';
@@ -1 +1,3 @@
1
- @import 'ej2-layouts/styles/avatar/material-dark.scss';
1
+ @import 'ej2-base/styles/definition/material-dark.scss';
2
+ @import 'material-dark-definition.scss';
3
+ @import 'all.scss';
@@ -1 +1,3 @@
1
- @import 'ej2-layouts/styles/avatar/material.scss';
1
+ @import 'ej2-base/styles/definition/material.scss';
2
+ @import 'material-definition.scss';
3
+ @import 'all.scss';
@@ -1,2 +1,4 @@
1
1
 
2
- @import 'ej2-layouts/styles/avatar/material3-dark.scss';
2
+
3
+ @import 'material3-dark-definition.scss';
4
+ @import 'all.scss';
@@ -1,2 +1,4 @@
1
1
 
2
- @import 'ej2-layouts/styles/avatar/material3.scss';
2
+
3
+ @import 'material3-definition.scss';
4
+ @import 'all.scss';
@@ -1 +1,3 @@
1
- @import 'ej2-layouts/styles/avatar/tailwind-dark.scss';
1
+ @import 'ej2-base/styles/definition/tailwind-dark.scss';
2
+ @import 'tailwind-dark-definition.scss';
3
+ @import 'all.scss';
@@ -1 +1,3 @@
1
- @import 'ej2-layouts/styles/avatar/tailwind.scss';
1
+ @import 'ej2-base/styles/definition/tailwind.scss';
2
+ @import 'tailwind-definition.scss';
3
+ @import 'all.scss';
@@ -0,0 +1,2 @@
1
+ @import 'layout.scss';
2
+ @import 'theme.scss';