@steroidsjs/bootstrap 3.0.0-beta.3 → 3.0.0-beta.31

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 (97) hide show
  1. package/README.md +1 -2
  2. package/content/Accordion/AccordionItemView.d.ts +2 -0
  3. package/content/Accordion/AccordionItemView.js +96 -0
  4. package/content/Accordion/AccordionItemView.scss +209 -0
  5. package/content/Accordion/AccordionView.d.ts +2 -0
  6. package/content/{Collapse/CollapseView.js → Accordion/AccordionView.js} +3 -3
  7. package/content/{Collapse/CollapseView.scss → Accordion/AccordionView.scss} +3 -4
  8. package/content/Alert/AlertView.scss +19 -4
  9. package/content/Avatar/AvatarView.js +2 -3
  10. package/content/Avatar/AvatarView.scss +29 -36
  11. package/content/Badge/BadgeView.d.ts +3 -0
  12. package/content/Badge/BadgeView.js +25 -0
  13. package/content/Badge/BadgeView.scss +135 -0
  14. package/content/Calendar/CaptionElement.scss +5 -4
  15. package/content/Card/CardView.js +34 -14
  16. package/content/Card/CardView.scss +126 -110
  17. package/content/Detail/DetailView.scss +75 -52
  18. package/content/DropDown/DropDownView.js +6 -3
  19. package/content/DropDown/DropDownView.scss +196 -27
  20. package/content/Icon/IconView.js +2 -2
  21. package/form/Button/ButtonView.js +12 -8
  22. package/form/Button/ButtonView.scss +157 -71
  23. package/form/CheckboxField/CheckboxFieldView.js +6 -3
  24. package/form/CheckboxField/CheckboxFieldView.scss +185 -36
  25. package/form/DropDownField/DropDownFieldView.js +46 -47
  26. package/form/DropDownField/DropDownFieldView.scss +391 -181
  27. package/form/DropDownField/views/DropDownItem/DropDownItemView.d.ts +3 -0
  28. package/form/DropDownField/views/DropDownItem/DropDownItemView.js +80 -0
  29. package/form/DropDownField/views/DropDownItem/DropDownItemView.scss +217 -0
  30. package/form/DropDownField/views/DropDownItem/index.d.ts +2 -0
  31. package/form/DropDownField/views/DropDownItem/index.js +7 -0
  32. package/form/FieldLayout/FieldLayoutView.js +12 -4
  33. package/form/FieldLayout/FieldLayoutView.scss +128 -24
  34. package/form/Form/FormView.js +3 -3
  35. package/form/Form/FormView.scss +10 -14
  36. package/form/InputField/InputFieldView.js +32 -13
  37. package/form/InputField/InputFieldView.scss +245 -99
  38. package/form/NumberField/NumberFieldView.js +19 -13
  39. package/form/NumberField/NumberFieldView.scss +195 -89
  40. package/form/PasswordField/PasswordFieldView.js +11 -9
  41. package/form/PasswordField/PasswordFieldView.scss +231 -63
  42. package/form/RadioListField/RadioListFieldView.js +10 -3
  43. package/form/RadioListField/RadioListFieldView.scss +229 -1
  44. package/form/TextField/TextFieldView.js +10 -2
  45. package/form/TextField/TextFieldView.scss +143 -2
  46. package/icons/index.d.ts +2 -0
  47. package/{icon/fontawesome.js → icons/index.js} +37 -11
  48. package/icons/svgs/accordion-chevron.svg +4 -0
  49. package/icons/svgs/arrow.svg +3 -0
  50. package/icons/svgs/badge-close.svg +3 -0
  51. package/icons/svgs/close.svg +4 -0
  52. package/icons/svgs/crossed-out-eye.svg +5 -0
  53. package/icons/svgs/default.svg +11 -0
  54. package/icons/svgs/dots.svg +5 -0
  55. package/icons/svgs/error.svg +12 -0
  56. package/icons/svgs/field-close.svg +4 -0
  57. package/icons/svgs/info.svg +12 -0
  58. package/icons/svgs/loader.svg +3 -0
  59. package/icons/svgs/search.svg +4 -0
  60. package/icons/svgs/success.svg +4 -0
  61. package/icons/svgs/user.svg +4 -0
  62. package/icons/svgs/visible-eye.svg +4 -0
  63. package/icons/svgs/warning.svg +12 -0
  64. package/index.d.ts +11 -2
  65. package/index.js +13 -4
  66. package/index.scss +6 -3
  67. package/layout/Header/HeaderView.scss +3 -3
  68. package/layout/Tooltip/TooltipView.js +6 -6
  69. package/layout/Tooltip/TooltipView.scss +45 -37
  70. package/list/Grid/GridView.scss +28 -30
  71. package/nav/Tree/TreeView.scss +14 -11
  72. package/package.json +56 -56
  73. package/scss/fonts.scss +6 -0
  74. package/scss/mixins/button.scss +51 -25
  75. package/scss/mixins/index.scss +2 -1
  76. package/scss/mixins/scroll.scss +31 -0
  77. package/scss/mixins/typography.scss +26 -0
  78. package/scss/variables/common/colors.scss +87 -67
  79. package/scss/variables/common/media.scss +2 -0
  80. package/scss/variables/common/typography.scss +96 -28
  81. package/scss/variables/components/input.scss +7 -6
  82. package/scss/variables/index.scss +2 -2
  83. package/scss/variables/normalize.scss +21 -0
  84. package/typography/Text/TextView.d.ts +3 -0
  85. package/typography/Text/TextView.js +46 -0
  86. package/typography/Text/TextView.scss +16 -0
  87. package/typography/Title/TitleView.d.ts +3 -0
  88. package/typography/Title/TitleView.js +50 -0
  89. package/typography/Title/TitleView.scss +16 -0
  90. package/content/Collapse/CollapseItemView.d.ts +0 -2
  91. package/content/Collapse/CollapseItemView.js +0 -65
  92. package/content/Collapse/CollapseItemView.scss +0 -88
  93. package/content/Collapse/CollapseView.d.ts +0 -2
  94. package/content/Icon/IconView.scss +0 -25
  95. package/icon/fontawesome.d.ts +0 -2
  96. package/scss/mixins/card.scss +0 -26
  97. package/scss/variables/components/card.scss +0 -20
@@ -1,88 +0,0 @@
1
- .CollapseItemView {
2
- display: grid;
3
- align-items: center;
4
-
5
- background-color: #fff;
6
- border-bottom: 1px solid rgba(#000, .1);
7
- box-shadow: 0 0 3px 0 rgba(34, 60, 80, 0.2);
8
- min-height: 48px;
9
- width: 100%;
10
- height: fit-content;
11
-
12
- &_disable {
13
- opacity: .4;
14
- background-color: #d7d7d7;
15
- color: rgba(#212529, .7);
16
-
17
- .IconView {
18
- svg {
19
- fill-opacity: .6;
20
- }
21
- }
22
- }
23
-
24
- &_borderless {
25
- border-bottom: unset;
26
- box-shadow: unset;
27
- }
28
-
29
- &_active {
30
- margin-bottom: 16px;
31
- }
32
-
33
- p {
34
- margin: 0;
35
- };
36
-
37
- &__icon {
38
- transform: rotate(0deg);
39
- transition: transform 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
40
-
41
- &_active {
42
- transform: rotate(180deg);
43
- }
44
-
45
- &_disable_cursor {
46
- cursor: auto;
47
- }
48
- }
49
-
50
- &__header-container {
51
- display: flex;
52
- &_revert {
53
- flex-direction: row-reverse;
54
- }
55
- }
56
-
57
- &__title-container {
58
- width: 100%;
59
- padding: 0 16px;
60
- align-self: center;
61
- }
62
-
63
- &__icon-wrapper {
64
- width: 48px;
65
- height: 48px;
66
-
67
- display: flex;
68
- align-items: center;
69
- justify-content: center;
70
-
71
- &_not_visible {
72
- width: 0;
73
- opacity: 0;
74
- }
75
- }
76
-
77
- &__content {
78
- transition: all 200ms ease;
79
- overflow: hidden;
80
- max-height: 0;
81
- padding: 0 16px;
82
-
83
- &_visible {
84
- max-height: 1024px;
85
- padding: 0 16px 8px 16px
86
- }
87
- }
88
- }
@@ -1,2 +0,0 @@
1
- import { ICollapseViewProps } from '@steroidsjs/core/ui/content/Collapse/Collapse';
2
- export default function CollapseView(props: ICollapseViewProps): JSX.Element;
@@ -1,25 +0,0 @@
1
- .IconView {
2
- svg {
3
- width: $icon-size;
4
- }
5
-
6
- &_size_sm svg {
7
- width: $icon-size-sm;
8
- }
9
-
10
- &_size_lg svg {
11
- width: $icon-size-lg;
12
- }
13
- }
14
-
15
- img.IconView {
16
- width: $icon-size;
17
-
18
- &_size_sm {
19
- width: $icon-size-sm;
20
- }
21
-
22
- &_size_lg {
23
- width: $icon-size-lg;
24
- }
25
- }
@@ -1,2 +0,0 @@
1
- declare const _default: () => {};
2
- export default _default;
@@ -1,26 +0,0 @@
1
- @mixin card-theme($root, $color) {
2
- background: map-get($color, color);
3
- color: map-get($color, text-color);
4
-
5
- #{$root}__header{
6
- background: map-get($color, color);
7
- border-bottom: 1px solid map-get($color, color-dark);
8
- }
9
- #{$root}__footer{
10
- background: map-get($color, color);
11
- border-top: 1px solid map-get($color, color-dark);
12
- }
13
- }
14
-
15
- @mixin card-border-theme($root, $color) {
16
- border: 1px solid map-get($color, color);
17
- #{$root}__content{
18
- color: map-get($color, color);
19
- }
20
- #{$root}__header{
21
- border-bottom: 1px solid map-get($color, color);
22
- }
23
- #{$root}__footer{
24
- border-top: 1px solid map-get($color, color);
25
- }
26
- }
@@ -1,20 +0,0 @@
1
- $card-header-font-size: 20px !default;
2
- $card-header-line-height: 24px !default;
3
-
4
- $card-title-font-size: 20px !default;
5
- $card-title-line-height: 24px !default;
6
-
7
- $card-font-size: 14px !default;
8
-
9
- $card-children-font-size: 16px !default;
10
- $card-children-line-height: 28px !default;
11
-
12
- $card-horizontal-header-font-size: 28px !default;
13
- $card-horizontal-font-size: 16px !default;
14
-
15
- $card-link-font-size: 16px !default;
16
-
17
- $card-border-radius: 3px !default;
18
- $card-button-border-radius: 4px !default;
19
-
20
- $card-header-background: $grey-lighter !default;