@agilekit/ui 0.0.514-alpha.0 → 0.1.0-alpha.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 (202) hide show
  1. package/README.md +42 -42
  2. package/lib/index.js +1 -1
  3. package/lib/index.js.LICENSE.txt +0 -8
  4. package/lib/src/Theme.d.ts +5 -3
  5. package/lib/src/components/Badge/Badge.d.ts +1 -1
  6. package/lib/src/components/Box/Box.d.ts +1 -1
  7. package/lib/src/components/Breadcrumb/Breadcrumb.d.ts +1 -1
  8. package/lib/src/components/Card/Card.d.ts +1 -1
  9. package/lib/src/components/ChoiceItem/ChoiceItem.d.ts +1 -1
  10. package/lib/src/components/DataTable/DataTable.d.ts +1 -1
  11. package/lib/src/components/FormSectionTitle/FormSectionTitle.d.ts +1 -1
  12. package/lib/src/components/Gallery/Gallery.d.ts +1 -1
  13. package/lib/src/components/Gallery/components/ImageWithFallback/ImageWithFallback.d.ts +1 -1
  14. package/lib/src/components/Gallery/components/Lightbox/Lightbox.d.ts +2 -2
  15. package/lib/src/components/Grid/components/Row/Row.d.ts +1 -1
  16. package/lib/src/components/Link/Link.d.ts +1 -1
  17. package/lib/src/components/PaymentProcessing/PaymentProcessing.d.ts +2 -2
  18. package/lib/src/components/Popover/Popover.d.ts +1 -1
  19. package/lib/src/components/Slider/Slider.d.ts +2 -2
  20. package/lib/src/components/Switch/Switch.d.ts +1 -1
  21. package/lib/src/components/TableList/TableList.d.ts +1 -1
  22. package/lib/src/components/TableList/components/Cell/Cell.d.ts +1 -1
  23. package/lib/src/components/TableList/components/ColumnHeader/ColumnHeader.d.ts +1 -1
  24. package/lib/src/components/TextField/TextField.styles.d.ts +4 -3
  25. package/lib/src/index.d.ts +5 -3
  26. package/package.json +160 -162
  27. package/src/assets/fonts/fontello/README.txt +75 -75
  28. package/src/assets/fonts/fontello/config.json +933 -933
  29. package/src/assets/fonts/fontello/css/animation.css +85 -85
  30. package/src/assets/fonts/fontello/css/fontello-codes.css +66 -66
  31. package/src/assets/fonts/fontello/css/fontello-embedded.css +119 -119
  32. package/src/assets/fonts/fontello/css/fontello-ie7-codes.css +66 -66
  33. package/src/assets/fonts/fontello/css/fontello-ie7.css +77 -77
  34. package/src/assets/fonts/fontello/css/fontello.css +122 -122
  35. package/src/assets/fonts/fontello/demo.html +402 -402
  36. package/src/assets/fonts/fontello/font/fontello.eot +0 -0
  37. package/src/assets/fonts/fontello/font/fontello.svg +141 -141
  38. package/src/assets/fonts/fontello/font/fontello.ttf +0 -0
  39. package/src/assets/fonts/fontello/font/fontello.woff +0 -0
  40. package/src/assets/fonts/fontello/font/fontello.woff2 +0 -0
  41. package/src/assets/fonts/svg/Icon/ic-chat.svg +12 -12
  42. package/src/assets/fonts/svg/Icon/ic-dollar.svg +13 -13
  43. package/src/assets/fonts/svg/Icon/ic-invoice.svg +15 -15
  44. package/src/assets/fonts/svg/Icon/ic-menu.svg +8 -8
  45. package/src/assets/fonts/svg/ic-activity.svg +8 -8
  46. package/src/assets/fonts/svg/ic-arrow-long-right.svg +48 -48
  47. package/src/assets/fonts/svg/ic-arrows.svg +9 -9
  48. package/src/assets/fonts/svg/ic-atm-card.svg +9 -9
  49. package/src/assets/fonts/svg/ic-bank-solid.svg +10 -10
  50. package/src/assets/fonts/svg/ic-bell.svg +10 -10
  51. package/src/assets/fonts/svg/ic-briefcase.svg +9 -9
  52. package/src/assets/fonts/svg/ic-calendar-alt.svg +15 -15
  53. package/src/assets/fonts/svg/ic-check-alt.svg +26 -26
  54. package/src/assets/fonts/svg/ic-check.svg +10 -10
  55. package/src/assets/fonts/svg/ic-circle-solid.svg +7 -7
  56. package/src/assets/fonts/svg/ic-circle.svg +7 -7
  57. package/src/assets/fonts/svg/ic-close.svg +9 -9
  58. package/src/assets/fonts/svg/ic-cog-solid.svg +14 -14
  59. package/src/assets/fonts/svg/ic-credit-card-solid.svg +7 -7
  60. package/src/assets/fonts/svg/ic-credit-card.svg +7 -7
  61. package/src/assets/fonts/svg/ic-database.svg +9 -9
  62. package/src/assets/fonts/svg/ic-desktop.svg +9 -9
  63. package/src/assets/fonts/svg/ic-dollar-solid.svg +10 -10
  64. package/src/assets/fonts/svg/ic-exclamation.svg +10 -10
  65. package/src/assets/fonts/svg/ic-globe.svg +9 -9
  66. package/src/assets/fonts/svg/ic-grid-solid.svg +9 -9
  67. package/src/assets/fonts/svg/ic-hash.svg +10 -10
  68. package/src/assets/fonts/svg/ic-help-circle.svg +11 -11
  69. package/src/assets/fonts/svg/ic-info.svg +10 -10
  70. package/src/assets/fonts/svg/ic-keyhole-square.svg +9 -9
  71. package/src/assets/fonts/svg/ic-lock.svg +8 -8
  72. package/src/assets/fonts/svg/ic-log-in.svg +9 -9
  73. package/src/assets/fonts/svg/ic-log-out.svg +9 -9
  74. package/src/assets/fonts/svg/ic-mail.svg +8 -8
  75. package/src/assets/fonts/svg/ic-map-pin.svg +8 -8
  76. package/src/assets/fonts/svg/ic-menu.svg +8 -8
  77. package/src/assets/fonts/svg/ic-minus.svg +6 -6
  78. package/src/assets/fonts/svg/ic-mobile-android.svg +9 -9
  79. package/src/assets/fonts/svg/ic-more.svg +27 -27
  80. package/src/assets/fonts/svg/ic-pen.svg +9 -9
  81. package/src/assets/fonts/svg/ic-phone.svg +13 -13
  82. package/src/assets/fonts/svg/ic-plus.svg +10 -10
  83. package/src/assets/fonts/svg/ic-question.svg +8 -8
  84. package/src/assets/fonts/svg/ic-search.svg +8 -8
  85. package/src/assets/fonts/svg/ic-settings.svg +27 -27
  86. package/src/assets/fonts/svg/ic-shield.svg +8 -8
  87. package/src/assets/fonts/svg/ic-shopping-cart.svg +9 -9
  88. package/src/assets/fonts/svg/ic-slash-solid.svg +7 -7
  89. package/src/assets/fonts/svg/ic-slash.svg +9 -9
  90. package/src/assets/fonts/svg/ic-sliders.svg +12 -12
  91. package/src/assets/fonts/svg/ic-store.svg +11 -11
  92. package/src/assets/fonts/svg/ic-tablet.svg +10 -10
  93. package/src/assets/fonts/svg/ic-user-circle.svg +10 -10
  94. package/src/assets/fonts/svg/ic-users.svg +21 -21
  95. package/src/assets/fonts/svg/ic-x-alt.svg +8 -8
  96. package/src/assets/styles/global/bootstrap/_alert.scss +51 -51
  97. package/src/assets/styles/global/bootstrap/_badge.scss +53 -53
  98. package/src/assets/styles/global/bootstrap/_breadcrumb.scss +41 -41
  99. package/src/assets/styles/global/bootstrap/_button-group.scss +163 -163
  100. package/src/assets/styles/global/bootstrap/_buttons.scss +140 -140
  101. package/src/assets/styles/global/bootstrap/_card.scss +311 -311
  102. package/src/assets/styles/global/bootstrap/_carousel.scss +199 -199
  103. package/src/assets/styles/global/bootstrap/_close.scss +44 -44
  104. package/src/assets/styles/global/bootstrap/_code.scss +48 -48
  105. package/src/assets/styles/global/bootstrap/_custom-forms.scss +508 -508
  106. package/src/assets/styles/global/bootstrap/_dropdown.scss +191 -191
  107. package/src/assets/styles/global/bootstrap/_forms.scss +335 -335
  108. package/src/assets/styles/global/bootstrap/_functions.scss +87 -87
  109. package/src/assets/styles/global/bootstrap/_grid.scss +52 -52
  110. package/src/assets/styles/global/bootstrap/_images.scss +42 -42
  111. package/src/assets/styles/global/bootstrap/_input-group.scss +193 -193
  112. package/src/assets/styles/global/bootstrap/_jumbotron.scss +18 -18
  113. package/src/assets/styles/global/bootstrap/_list-group.scss +121 -121
  114. package/src/assets/styles/global/bootstrap/_media.scss +8 -8
  115. package/src/assets/styles/global/bootstrap/_mixins.scss +41 -41
  116. package/src/assets/styles/global/bootstrap/_modal.scss +186 -186
  117. package/src/assets/styles/global/bootstrap/_nav.scss +120 -120
  118. package/src/assets/styles/global/bootstrap/_navbar.scss +299 -299
  119. package/src/assets/styles/global/bootstrap/_pagination.scss +78 -78
  120. package/src/assets/styles/global/bootstrap/_popover.scss +185 -185
  121. package/src/assets/styles/global/bootstrap/_print.scss +141 -141
  122. package/src/assets/styles/global/bootstrap/_progress.scss +34 -34
  123. package/src/assets/styles/global/bootstrap/_reboot.scss +462 -462
  124. package/src/assets/styles/global/bootstrap/_root.scss +19 -19
  125. package/src/assets/styles/global/bootstrap/_spinners.scss +53 -53
  126. package/src/assets/styles/global/bootstrap/_tables.scss +187 -187
  127. package/src/assets/styles/global/bootstrap/_toasts.scss +43 -43
  128. package/src/assets/styles/global/bootstrap/_tooltip.scss +117 -117
  129. package/src/assets/styles/global/bootstrap/_transitions.scss +22 -22
  130. package/src/assets/styles/global/bootstrap/_type.scss +125 -125
  131. package/src/assets/styles/global/bootstrap/_utilities.scss +16 -16
  132. package/src/assets/styles/global/bootstrap/_variables.scss +1088 -1088
  133. package/src/assets/styles/global/bootstrap/bootstrap-grid.scss +29 -29
  134. package/src/assets/styles/global/bootstrap/bootstrap-reboot.scss +12 -12
  135. package/src/assets/styles/global/bootstrap/bootstrap.scss +44 -44
  136. package/src/assets/styles/global/bootstrap/mixins/_alert.scss +13 -13
  137. package/src/assets/styles/global/bootstrap/mixins/_background-variant.scss +21 -21
  138. package/src/assets/styles/global/bootstrap/mixins/_badge.scss +11 -11
  139. package/src/assets/styles/global/bootstrap/mixins/_border-radius.scss +35 -35
  140. package/src/assets/styles/global/bootstrap/mixins/_box-shadow.scss +5 -5
  141. package/src/assets/styles/global/bootstrap/mixins/_breakpoints.scss +123 -123
  142. package/src/assets/styles/global/bootstrap/mixins/_buttons.scss +111 -111
  143. package/src/assets/styles/global/bootstrap/mixins/_caret.scss +62 -62
  144. package/src/assets/styles/global/bootstrap/mixins/_clearfix.scss +7 -7
  145. package/src/assets/styles/global/bootstrap/mixins/_float.scss +11 -11
  146. package/src/assets/styles/global/bootstrap/mixins/_forms.scss +198 -198
  147. package/src/assets/styles/global/bootstrap/mixins/_gradients.scss +45 -45
  148. package/src/assets/styles/global/bootstrap/mixins/_grid-framework.scss +66 -66
  149. package/src/assets/styles/global/bootstrap/mixins/_grid.scss +51 -51
  150. package/src/assets/styles/global/bootstrap/mixins/_hover.scss +37 -37
  151. package/src/assets/styles/global/bootstrap/mixins/_image.scss +36 -36
  152. package/src/assets/styles/global/bootstrap/mixins/_list-group.scss +21 -21
  153. package/src/assets/styles/global/bootstrap/mixins/_lists.scss +7 -7
  154. package/src/assets/styles/global/bootstrap/mixins/_nav-divider.scss +10 -10
  155. package/src/assets/styles/global/bootstrap/mixins/_pagination.scss +22 -22
  156. package/src/assets/styles/global/bootstrap/mixins/_reset-text.scss +17 -17
  157. package/src/assets/styles/global/bootstrap/mixins/_resize.scss +6 -6
  158. package/src/assets/styles/global/bootstrap/mixins/_screen-reader.scss +33 -33
  159. package/src/assets/styles/global/bootstrap/mixins/_size.scss +6 -6
  160. package/src/assets/styles/global/bootstrap/mixins/_table-row.scss +39 -39
  161. package/src/assets/styles/global/bootstrap/mixins/_text-emphasis.scss +14 -14
  162. package/src/assets/styles/global/bootstrap/mixins/_text-hide.scss +13 -13
  163. package/src/assets/styles/global/bootstrap/mixins/_text-truncate.scss +8 -8
  164. package/src/assets/styles/global/bootstrap/mixins/_transition.scss +16 -16
  165. package/src/assets/styles/global/bootstrap/mixins/_visibility.scss +7 -7
  166. package/src/assets/styles/global/bootstrap/utilities/_align.scss +8 -8
  167. package/src/assets/styles/global/bootstrap/utilities/_background.scss +19 -19
  168. package/src/assets/styles/global/bootstrap/utilities/_borders.scss +63 -63
  169. package/src/assets/styles/global/bootstrap/utilities/_clearfix.scss +3 -3
  170. package/src/assets/styles/global/bootstrap/utilities/_display.scss +38 -38
  171. package/src/assets/styles/global/bootstrap/utilities/_embed.scss +40 -40
  172. package/src/assets/styles/global/bootstrap/utilities/_flex.scss +51 -51
  173. package/src/assets/styles/global/bootstrap/utilities/_float.scss +9 -9
  174. package/src/assets/styles/global/bootstrap/utilities/_overflow.scss +5 -5
  175. package/src/assets/styles/global/bootstrap/utilities/_position.scss +32 -32
  176. package/src/assets/styles/global/bootstrap/utilities/_screenreaders.scss +11 -11
  177. package/src/assets/styles/global/bootstrap/utilities/_shadows.scss +6 -6
  178. package/src/assets/styles/global/bootstrap/utilities/_sizing.scss +20 -20
  179. package/src/assets/styles/global/bootstrap/utilities/_spacing.scss +73 -73
  180. package/src/assets/styles/global/bootstrap/utilities/_text.scss +67 -67
  181. package/src/assets/styles/global/bootstrap/utilities/_visibility.scss +11 -11
  182. package/src/assets/styles/global/core/card.scss +6 -6
  183. package/src/assets/styles/global/core/color.scss +76 -76
  184. package/src/assets/styles/global/core/status.scss +17 -17
  185. package/src/assets/styles/global/styles.scss +24 -24
  186. package/src/assets/styles/global/vendors/ant-design-grid.scss +5046 -5046
  187. package/src/assets/styles/shared/elements/scrollbar.scss +30 -30
  188. package/src/assets/styles/shared/settings/breakpoints.scss +10 -10
  189. package/src/assets/styles/shared/settings/colors.scss +110 -110
  190. package/src/assets/styles/shared/settings/depth.scss +14 -14
  191. package/src/assets/styles/shared/settings/layout.scss +10 -10
  192. package/src/assets/styles/shared/settings/typography.scss +9 -9
  193. package/src/assets/styles/shared/shared.scss +8 -8
  194. package/src/assets/styles/shared/tools/respond-to.scss +32 -32
  195. package/src/components/utils/breakpoints.ts +14 -14
  196. package/src/components/utils/browser.ts +10 -10
  197. package/src/components/utils/findParentBySelector.ts +17 -17
  198. package/src/components/utils/idGenerator.ts +4 -4
  199. package/src/components/utils/index.ts +4 -4
  200. package/src/components/utils/setNativeValue.ts +13 -13
  201. package/lib/src/components/Breadcrumb/Breadcrumb.styles.d.ts +0 -2
  202. package/lib/src/components/Loader/Loader.styles.d.ts +0 -2
@@ -1,51 +1,51 @@
1
- @use "sass:math";
2
- /// Grid system
3
- //
4
- // Generate semantic grid columns with these mixins.
5
-
6
- @mixin make-container($gutter: $grid-gutter-width) {
7
- width: 100%;
8
- padding-right: calc(#{$gutter} / 2);
9
- padding-left: calc(#{$gutter} / 2);
10
- margin-right: auto;
11
- margin-left: auto;
12
- }
13
-
14
-
15
- // For each breakpoint, define the maximum width of the container in a media query
16
- @mixin make-container-max-widths($max-widths: $container-max-widths, $breakpoints: $grid-breakpoints) {
17
- @each $breakpoint, $container-max-width in $max-widths {
18
- @include media-breakpoint-up($breakpoint, $breakpoints) {
19
- max-width: $container-max-width;
20
- }
21
- }
22
- }
23
-
24
- @mixin make-row($gutter: $grid-gutter-width) {
25
- display: flex;
26
- flex-wrap: wrap;
27
- margin-right: calc(-#{$gutter} / 2);
28
- margin-left: calc(-#{$gutter} / 2);
29
- }
30
-
31
- @mixin make-col-ready($gutter: $grid-gutter-width) {
32
- position: relative;
33
- // Prevent columns from becoming too narrow when at smaller grid tiers by
34
- // always setting `width: 100%;`. This works because we use `flex` values
35
- // later on to override this initial width.
36
- width: 100%;
37
- padding-right: calc(#{$gutter} / 2);
38
- padding-left: calc(#{$gutter} / 2);
39
- }
40
-
41
- @mixin make-col($size, $columns: $grid-columns) {
42
- flex: 0 0 percentage(math.div($size, $columns));
43
- // Add a `max-width` to ensure content within each column does not blow out
44
- // the width of the column. Applies to IE10+ and Firefox. Chrome and Safari
45
- // do not appear to require this.
46
- max-width: percentage(math.div($size, $columns));
47
- }
48
-
49
- @mixin make-col-offset($size, $columns: $grid-columns) {
50
- margin-left: if(math.div($size, $columns) == 0, 0, percentage(math.div($size, $columns)));
51
- }
1
+ @use "sass:math";
2
+ /// Grid system
3
+ //
4
+ // Generate semantic grid columns with these mixins.
5
+
6
+ @mixin make-container($gutter: $grid-gutter-width) {
7
+ width: 100%;
8
+ padding-right: calc(#{$gutter} / 2);
9
+ padding-left: calc(#{$gutter} / 2);
10
+ margin-right: auto;
11
+ margin-left: auto;
12
+ }
13
+
14
+
15
+ // For each breakpoint, define the maximum width of the container in a media query
16
+ @mixin make-container-max-widths($max-widths: $container-max-widths, $breakpoints: $grid-breakpoints) {
17
+ @each $breakpoint, $container-max-width in $max-widths {
18
+ @include media-breakpoint-up($breakpoint, $breakpoints) {
19
+ max-width: $container-max-width;
20
+ }
21
+ }
22
+ }
23
+
24
+ @mixin make-row($gutter: $grid-gutter-width) {
25
+ display: flex;
26
+ flex-wrap: wrap;
27
+ margin-right: calc(-#{$gutter} / 2);
28
+ margin-left: calc(-#{$gutter} / 2);
29
+ }
30
+
31
+ @mixin make-col-ready($gutter: $grid-gutter-width) {
32
+ position: relative;
33
+ // Prevent columns from becoming too narrow when at smaller grid tiers by
34
+ // always setting `width: 100%;`. This works because we use `flex` values
35
+ // later on to override this initial width.
36
+ width: 100%;
37
+ padding-right: calc(#{$gutter} / 2);
38
+ padding-left: calc(#{$gutter} / 2);
39
+ }
40
+
41
+ @mixin make-col($size, $columns: $grid-columns) {
42
+ flex: 0 0 percentage(math.div($size, $columns));
43
+ // Add a `max-width` to ensure content within each column does not blow out
44
+ // the width of the column. Applies to IE10+ and Firefox. Chrome and Safari
45
+ // do not appear to require this.
46
+ max-width: percentage(math.div($size, $columns));
47
+ }
48
+
49
+ @mixin make-col-offset($size, $columns: $grid-columns) {
50
+ margin-left: if(math.div($size, $columns) == 0, 0, percentage(math.div($size, $columns)));
51
+ }
@@ -1,37 +1,37 @@
1
- // Hover mixin and `$enable-hover-media-query` are deprecated.
2
- //
3
- // Originally added during our alphas and maintained during betas, this mixin was
4
- // designed to prevent `:hover` stickiness on iOS-an issue where hover styles
5
- // would persist after initial touch.
6
- //
7
- // For backward compatibility, we've kept these mixins and updated them to
8
- // always return their regular pseudo-classes instead of a shimmed media query.
9
- //
10
- // Issue: https://github.com/twbs/bootstrap/issues/25195
11
-
12
- @mixin hover {
13
- &:hover { @content; }
14
- }
15
-
16
- @mixin hover-focus {
17
- &:hover,
18
- &:focus {
19
- @content;
20
- }
21
- }
22
-
23
- @mixin plain-hover-focus {
24
- &,
25
- &:hover,
26
- &:focus {
27
- @content;
28
- }
29
- }
30
-
31
- @mixin hover-focus-active {
32
- &:hover,
33
- &:focus,
34
- &:active {
35
- @content;
36
- }
37
- }
1
+ // Hover mixin and `$enable-hover-media-query` are deprecated.
2
+ //
3
+ // Originally added during our alphas and maintained during betas, this mixin was
4
+ // designed to prevent `:hover` stickiness on iOS-an issue where hover styles
5
+ // would persist after initial touch.
6
+ //
7
+ // For backward compatibility, we've kept these mixins and updated them to
8
+ // always return their regular pseudo-classes instead of a shimmed media query.
9
+ //
10
+ // Issue: https://github.com/twbs/bootstrap/issues/25195
11
+
12
+ @mixin hover {
13
+ &:hover { @content; }
14
+ }
15
+
16
+ @mixin hover-focus {
17
+ &:hover,
18
+ &:focus {
19
+ @content;
20
+ }
21
+ }
22
+
23
+ @mixin plain-hover-focus {
24
+ &,
25
+ &:hover,
26
+ &:focus {
27
+ @content;
28
+ }
29
+ }
30
+
31
+ @mixin hover-focus-active {
32
+ &:hover,
33
+ &:focus,
34
+ &:active {
35
+ @content;
36
+ }
37
+ }
@@ -1,36 +1,36 @@
1
- // Image Mixins
2
- // - Responsive image
3
- // - Retina image
4
-
5
-
6
- // Responsive image
7
- //
8
- // Keep images from scaling beyond the width of their parents.
9
-
10
- @mixin img-fluid {
11
- // Part 1: Set a maximum relative to the parent
12
- max-width: 100%;
13
- // Part 2: Override the height to auto, otherwise images will be stretched
14
- // when setting a width and height attribute on the img element.
15
- height: auto;
16
- }
17
-
18
-
19
- // Retina image
20
- //
21
- // Short retina mixin for setting background-image and -size.
22
-
23
- // stylelint-disable indentation, media-query-list-comma-newline-after
24
- @mixin img-retina($file-1x, $file-2x, $width-1x, $height-1x) {
25
- background-image: url($file-1x);
26
-
27
- // Autoprefixer takes care of adding -webkit-min-device-pixel-ratio and -o-min-device-pixel-ratio,
28
- // but doesn't convert dppx=>dpi.
29
- // There's no such thing as unprefixed min-device-pixel-ratio since it's nonstandard.
30
- // Compatibility info: https://caniuse.com/#feat=css-media-resolution
31
- @media only screen and (min-resolution: 192dpi), // IE9-11 don't support dppx
32
- only screen and (min-resolution: 2dppx) { // Standardized
33
- background-image: url($file-2x);
34
- background-size: $width-1x $height-1x;
35
- }
36
- }
1
+ // Image Mixins
2
+ // - Responsive image
3
+ // - Retina image
4
+
5
+
6
+ // Responsive image
7
+ //
8
+ // Keep images from scaling beyond the width of their parents.
9
+
10
+ @mixin img-fluid {
11
+ // Part 1: Set a maximum relative to the parent
12
+ max-width: 100%;
13
+ // Part 2: Override the height to auto, otherwise images will be stretched
14
+ // when setting a width and height attribute on the img element.
15
+ height: auto;
16
+ }
17
+
18
+
19
+ // Retina image
20
+ //
21
+ // Short retina mixin for setting background-image and -size.
22
+
23
+ // stylelint-disable indentation, media-query-list-comma-newline-after
24
+ @mixin img-retina($file-1x, $file-2x, $width-1x, $height-1x) {
25
+ background-image: url($file-1x);
26
+
27
+ // Autoprefixer takes care of adding -webkit-min-device-pixel-ratio and -o-min-device-pixel-ratio,
28
+ // but doesn't convert dppx=>dpi.
29
+ // There's no such thing as unprefixed min-device-pixel-ratio since it's nonstandard.
30
+ // Compatibility info: https://caniuse.com/#feat=css-media-resolution
31
+ @media only screen and (min-resolution: 192dpi), // IE9-11 don't support dppx
32
+ only screen and (min-resolution: 2dppx) { // Standardized
33
+ background-image: url($file-2x);
34
+ background-size: $width-1x $height-1x;
35
+ }
36
+ }
@@ -1,21 +1,21 @@
1
- // List Groups
2
-
3
- @mixin list-group-item-variant($state, $background, $color) {
4
- .list-group-item-#{$state} {
5
- color: $color;
6
- background-color: $background;
7
-
8
- &.list-group-item-action {
9
- @include hover-focus {
10
- color: $color;
11
- background-color: darken($background, 5%);
12
- }
13
-
14
- &.active {
15
- color: $white;
16
- background-color: $color;
17
- border-color: $color;
18
- }
19
- }
20
- }
21
- }
1
+ // List Groups
2
+
3
+ @mixin list-group-item-variant($state, $background, $color) {
4
+ .list-group-item-#{$state} {
5
+ color: $color;
6
+ background-color: $background;
7
+
8
+ &.list-group-item-action {
9
+ @include hover-focus {
10
+ color: $color;
11
+ background-color: darken($background, 5%);
12
+ }
13
+
14
+ &.active {
15
+ color: $white;
16
+ background-color: $color;
17
+ border-color: $color;
18
+ }
19
+ }
20
+ }
21
+ }
@@ -1,7 +1,7 @@
1
- // Lists
2
-
3
- // Unstyled keeps list items block level, just removes default browser padding and list-style
4
- @mixin list-unstyled {
5
- padding-left: 0;
6
- list-style: none;
7
- }
1
+ // Lists
2
+
3
+ // Unstyled keeps list items block level, just removes default browser padding and list-style
4
+ @mixin list-unstyled {
5
+ padding-left: 0;
6
+ list-style: none;
7
+ }
@@ -1,10 +1,10 @@
1
- // Horizontal dividers
2
- //
3
- // Dividers (basically an hr) within dropdowns and nav lists
4
-
5
- @mixin nav-divider($color: $nav-divider-color, $margin-y: $nav-divider-margin-y) {
6
- height: 0;
7
- margin: $margin-y 0;
8
- overflow: hidden;
9
- border-top: 1px solid $color;
10
- }
1
+ // Horizontal dividers
2
+ //
3
+ // Dividers (basically an hr) within dropdowns and nav lists
4
+
5
+ @mixin nav-divider($color: $nav-divider-color, $margin-y: $nav-divider-margin-y) {
6
+ height: 0;
7
+ margin: $margin-y 0;
8
+ overflow: hidden;
9
+ border-top: 1px solid $color;
10
+ }
@@ -1,22 +1,22 @@
1
- // Pagination
2
-
3
- @mixin pagination-size($padding-y, $padding-x, $font-size, $line-height, $border-radius) {
4
- .page-link {
5
- padding: $padding-y $padding-x;
6
- font-size: $font-size;
7
- line-height: $line-height;
8
- }
9
-
10
- .page-item {
11
- &:first-child {
12
- .page-link {
13
- @include border-left-radius($border-radius);
14
- }
15
- }
16
- &:last-child {
17
- .page-link {
18
- @include border-right-radius($border-radius);
19
- }
20
- }
21
- }
22
- }
1
+ // Pagination
2
+
3
+ @mixin pagination-size($padding-y, $padding-x, $font-size, $line-height, $border-radius) {
4
+ .page-link {
5
+ padding: $padding-y $padding-x;
6
+ font-size: $font-size;
7
+ line-height: $line-height;
8
+ }
9
+
10
+ .page-item {
11
+ &:first-child {
12
+ .page-link {
13
+ @include border-left-radius($border-radius);
14
+ }
15
+ }
16
+ &:last-child {
17
+ .page-link {
18
+ @include border-right-radius($border-radius);
19
+ }
20
+ }
21
+ }
22
+ }
@@ -1,17 +1,17 @@
1
- @mixin reset-text {
2
- font-family: $font-family-base;
3
- // We deliberately do NOT reset font-size or word-wrap.
4
- font-style: normal;
5
- font-weight: $font-weight-normal;
6
- line-height: $line-height-base;
7
- text-align: left; // Fallback for where `start` is not supported
8
- text-align: start; // stylelint-disable-line declaration-block-no-duplicate-properties
9
- text-decoration: none;
10
- text-shadow: none;
11
- text-transform: none;
12
- letter-spacing: normal;
13
- word-break: normal;
14
- word-spacing: normal;
15
- white-space: normal;
16
- line-break: auto;
17
- }
1
+ @mixin reset-text {
2
+ font-family: $font-family-base;
3
+ // We deliberately do NOT reset font-size or word-wrap.
4
+ font-style: normal;
5
+ font-weight: $font-weight-normal;
6
+ line-height: $line-height-base;
7
+ text-align: left; // Fallback for where `start` is not supported
8
+ text-align: start; // stylelint-disable-line declaration-block-no-duplicate-properties
9
+ text-decoration: none;
10
+ text-shadow: none;
11
+ text-transform: none;
12
+ letter-spacing: normal;
13
+ word-break: normal;
14
+ word-spacing: normal;
15
+ white-space: normal;
16
+ line-break: auto;
17
+ }
@@ -1,6 +1,6 @@
1
- // Resize anything
2
-
3
- @mixin resizable($direction) {
4
- overflow: auto; // Per CSS3 UI, `resize` only applies when `overflow` isn't `visible`
5
- resize: $direction; // Options: horizontal, vertical, both
6
- }
1
+ // Resize anything
2
+
3
+ @mixin resizable($direction) {
4
+ overflow: auto; // Per CSS3 UI, `resize` only applies when `overflow` isn't `visible`
5
+ resize: $direction; // Options: horizontal, vertical, both
6
+ }
@@ -1,33 +1,33 @@
1
- // Only display content to screen readers
2
- //
3
- // See: https://a11yproject.com/posts/how-to-hide-content/
4
- // See: https://hugogiraudel.com/2016/10/13/css-hide-and-seek/
5
-
6
- @mixin sr-only {
7
- position: absolute;
8
- width: 1px;
9
- height: 1px;
10
- padding: 0;
11
- overflow: hidden;
12
- clip: rect(0, 0, 0, 0);
13
- white-space: nowrap;
14
- border: 0;
15
- }
16
-
17
- // Use in conjunction with .sr-only to only display content when it's focused.
18
- //
19
- // Useful for "Skip to main content" links; see https://www.w3.org/TR/2013/NOTE-WCAG20-TECHS-20130905/G1
20
- //
21
- // Credit: HTML5 Boilerplate
22
-
23
- @mixin sr-only-focusable {
24
- &:active,
25
- &:focus {
26
- position: static;
27
- width: auto;
28
- height: auto;
29
- overflow: visible;
30
- clip: auto;
31
- white-space: normal;
32
- }
33
- }
1
+ // Only display content to screen readers
2
+ //
3
+ // See: https://a11yproject.com/posts/how-to-hide-content/
4
+ // See: https://hugogiraudel.com/2016/10/13/css-hide-and-seek/
5
+
6
+ @mixin sr-only {
7
+ position: absolute;
8
+ width: 1px;
9
+ height: 1px;
10
+ padding: 0;
11
+ overflow: hidden;
12
+ clip: rect(0, 0, 0, 0);
13
+ white-space: nowrap;
14
+ border: 0;
15
+ }
16
+
17
+ // Use in conjunction with .sr-only to only display content when it's focused.
18
+ //
19
+ // Useful for "Skip to main content" links; see https://www.w3.org/TR/2013/NOTE-WCAG20-TECHS-20130905/G1
20
+ //
21
+ // Credit: HTML5 Boilerplate
22
+
23
+ @mixin sr-only-focusable {
24
+ &:active,
25
+ &:focus {
26
+ position: static;
27
+ width: auto;
28
+ height: auto;
29
+ overflow: visible;
30
+ clip: auto;
31
+ white-space: normal;
32
+ }
33
+ }
@@ -1,6 +1,6 @@
1
- // Sizing shortcuts
2
-
3
- @mixin size($width, $height: $width) {
4
- width: $width;
5
- height: $height;
6
- }
1
+ // Sizing shortcuts
2
+
3
+ @mixin size($width, $height: $width) {
4
+ width: $width;
5
+ height: $height;
6
+ }
@@ -1,39 +1,39 @@
1
- // Tables
2
-
3
- @mixin table-row-variant($state, $background, $border: null) {
4
- // Exact selectors below required to override `.table-striped` and prevent
5
- // inheritance to nested tables.
6
- .table-#{$state} {
7
- &,
8
- > th,
9
- > td {
10
- background-color: $background;
11
- }
12
-
13
- @if $border != null {
14
- th,
15
- td,
16
- thead th,
17
- tbody + tbody {
18
- border-color: $border;
19
- }
20
- }
21
- }
22
-
23
- // Hover states for `.table-hover`
24
- // Note: this is not available for cells or rows within `thead` or `tfoot`.
25
- .table-hover {
26
- $hover-background: darken($background, 5%);
27
-
28
- .table-#{$state} {
29
- @include hover {
30
- background-color: $hover-background;
31
-
32
- > td,
33
- > th {
34
- background-color: $hover-background;
35
- }
36
- }
37
- }
38
- }
39
- }
1
+ // Tables
2
+
3
+ @mixin table-row-variant($state, $background, $border: null) {
4
+ // Exact selectors below required to override `.table-striped` and prevent
5
+ // inheritance to nested tables.
6
+ .table-#{$state} {
7
+ &,
8
+ > th,
9
+ > td {
10
+ background-color: $background;
11
+ }
12
+
13
+ @if $border != null {
14
+ th,
15
+ td,
16
+ thead th,
17
+ tbody + tbody {
18
+ border-color: $border;
19
+ }
20
+ }
21
+ }
22
+
23
+ // Hover states for `.table-hover`
24
+ // Note: this is not available for cells or rows within `thead` or `tfoot`.
25
+ .table-hover {
26
+ $hover-background: darken($background, 5%);
27
+
28
+ .table-#{$state} {
29
+ @include hover {
30
+ background-color: $hover-background;
31
+
32
+ > td,
33
+ > th {
34
+ background-color: $hover-background;
35
+ }
36
+ }
37
+ }
38
+ }
39
+ }
@@ -1,14 +1,14 @@
1
- // stylelint-disable declaration-no-important
2
-
3
- // Typography
4
-
5
- @mixin text-emphasis-variant($parent, $color) {
6
- #{$parent} {
7
- color: $color !important;
8
- }
9
- a#{$parent} {
10
- @include hover-focus {
11
- color: darken($color, $emphasized-link-hover-darken-percentage) !important;
12
- }
13
- }
14
- }
1
+ // stylelint-disable declaration-no-important
2
+
3
+ // Typography
4
+
5
+ @mixin text-emphasis-variant($parent, $color) {
6
+ #{$parent} {
7
+ color: $color !important;
8
+ }
9
+ a#{$parent} {
10
+ @include hover-focus {
11
+ color: darken($color, $emphasized-link-hover-darken-percentage) !important;
12
+ }
13
+ }
14
+ }
@@ -1,13 +1,13 @@
1
- // CSS image replacement
2
- @mixin text-hide($ignore-warning: false) {
3
- // stylelint-disable-next-line font-family-no-missing-generic-family-keyword
4
- font: 0/0 a;
5
- color: transparent;
6
- text-shadow: none;
7
- background-color: transparent;
8
- border: 0;
9
-
10
- @if ($ignore-warning != true) {
11
- @warn "The `text-hide()` mixin has been deprecated as of v4.1.0. It will be removed entirely in v5.";
12
- }
13
- }
1
+ // CSS image replacement
2
+ @mixin text-hide($ignore-warning: false) {
3
+ // stylelint-disable-next-line font-family-no-missing-generic-family-keyword
4
+ font: 0/0 a;
5
+ color: transparent;
6
+ text-shadow: none;
7
+ background-color: transparent;
8
+ border: 0;
9
+
10
+ @if ($ignore-warning != true) {
11
+ @warn "The `text-hide()` mixin has been deprecated as of v4.1.0. It will be removed entirely in v5.";
12
+ }
13
+ }
@@ -1,8 +1,8 @@
1
- // Text truncate
2
- // Requires inline-block or block for proper styling
3
-
4
- @mixin text-truncate() {
5
- overflow: hidden;
6
- text-overflow: ellipsis;
7
- white-space: nowrap;
8
- }
1
+ // Text truncate
2
+ // Requires inline-block or block for proper styling
3
+
4
+ @mixin text-truncate() {
5
+ overflow: hidden;
6
+ text-overflow: ellipsis;
7
+ white-space: nowrap;
8
+ }