.table-bordered {
183 | border: 0;
184 | }
185 | }
186 | }
187 | }
188 | }
189 |
--------------------------------------------------------------------------------
/package/src/views/ui/Forms.js:
--------------------------------------------------------------------------------
1 | import {
2 | Card,
3 | Row,
4 | Col,
5 | CardTitle,
6 | CardBody,
7 | Button,
8 | Form,
9 | FormGroup,
10 | Label,
11 | Input,
12 | FormText,
13 | } from "reactstrap";
14 |
15 | const Forms = () => {
16 | return (
17 |
18 |
23 |
24 |
25 | Form Example
26 |
27 |
28 |
110 |
111 |
112 |
113 |
114 | );
115 | };
116 |
117 | export default Forms;
118 |
--------------------------------------------------------------------------------
/landingpage/dist/scss/bootstrap/_dropdown.scss:
--------------------------------------------------------------------------------
1 | // The dropdown wrapper (``)
2 | .dropup,
3 | .dropright,
4 | .dropdown,
5 | .dropleft {
6 | position: relative;
7 | }
8 |
9 | .dropdown-toggle {
10 | // Generate the caret automatically
11 | @include caret;
12 | }
13 |
14 | // The dropdown menu
15 | .dropdown-menu {
16 | position: absolute;
17 | top: 100%;
18 | left: 0;
19 | z-index: $zindex-dropdown;
20 | display: none; // none by default, but block on "open" of the menu
21 | float: left;
22 | min-width: $dropdown-min-width;
23 | padding: $dropdown-padding-y 0;
24 | margin: $dropdown-spacer 0 0; // override default ul
25 | font-size: $font-size-base; // Redeclare because nesting can cause inheritance issues
26 | color: $body-color;
27 | text-align: left; // Ensures proper alignment if parent has it changed (e.g., modal footer)
28 | list-style: none;
29 | background-color: $dropdown-bg;
30 | background-clip: padding-box;
31 | border: $dropdown-border-width solid $dropdown-border-color;
32 | @include border-radius($dropdown-border-radius);
33 | @include box-shadow($dropdown-box-shadow);
34 | }
35 |
36 | .dropdown-menu-right {
37 | right: 0;
38 | left: auto;
39 | }
40 |
41 | // Allow for dropdowns to go bottom up (aka, dropup-menu)
42 | // Just add .dropup after the standard .dropdown class and you're set.
43 | .dropup {
44 | .dropdown-menu {
45 | top: auto;
46 | bottom: 100%;
47 | margin-top: 0;
48 | margin-bottom: $dropdown-spacer;
49 | }
50 |
51 | .dropdown-toggle {
52 | @include caret(up);
53 | }
54 | }
55 |
56 | .dropright {
57 | .dropdown-menu {
58 | top: 0;
59 | right: auto;
60 | left: 100%;
61 | margin-top: 0;
62 | margin-left: $dropdown-spacer;
63 | }
64 |
65 | .dropdown-toggle {
66 | @include caret(right);
67 | &::after {
68 | vertical-align: 0;
69 | }
70 | }
71 | }
72 |
73 | .dropleft {
74 | .dropdown-menu {
75 | top: 0;
76 | right: 100%;
77 | left: auto;
78 | margin-top: 0;
79 | margin-right: $dropdown-spacer;
80 | }
81 |
82 | .dropdown-toggle {
83 | @include caret(left);
84 | &::before {
85 | vertical-align: 0;
86 | }
87 | }
88 | }
89 |
90 | // When enabled Popper.js, reset basic dropdown position
91 | // stylelint-disable no-duplicate-selectors
92 | .dropdown-menu {
93 | &[x-placement^="top"],
94 | &[x-placement^="right"],
95 | &[x-placement^="bottom"],
96 | &[x-placement^="left"] {
97 | right: auto;
98 | bottom: auto;
99 | }
100 | }
101 | // stylelint-enable no-duplicate-selectors
102 |
103 | // Dividers (basically an `
`-specific styles are denoted with `// For s`
111 | .dropdown-item {
112 | display: block;
113 | width: 100%; // For ``s
114 | padding: $dropdown-item-padding-y $dropdown-item-padding-x;
115 | clear: both;
116 | font-weight: $font-weight-normal;
117 | color: $dropdown-link-color;
118 | text-align: inherit; // For ``s
119 | white-space: nowrap; // prevent links from randomly breaking onto new lines
120 | background-color: transparent; // For ``s
121 | border: 0; // For ``s
122 |
123 | @include hover-focus {
124 | color: $dropdown-link-hover-color;
125 | text-decoration: none;
126 | @include gradient-bg($dropdown-link-hover-bg);
127 | }
128 |
129 | &.active,
130 | &:active {
131 | color: $dropdown-link-active-color;
132 | text-decoration: none;
133 | @include gradient-bg($dropdown-link-active-bg);
134 | }
135 |
136 | &.disabled,
137 | &:disabled {
138 | color: $dropdown-link-disabled-color;
139 | background-color: transparent;
140 | // Remove CSS gradients if they're enabled
141 | @if $enable-gradients {
142 | background-image: none;
143 | }
144 | }
145 | }
146 |
147 | .dropdown-menu.show {
148 | display: block;
149 | }
150 |
151 | // Dropdown section headers
152 | .dropdown-header {
153 | display: block;
154 | padding: $dropdown-padding-y $dropdown-item-padding-x;
155 | margin-bottom: 0; // for use with heading elements
156 | font-size: $font-size-sm;
157 | color: $dropdown-header-color;
158 | white-space: nowrap; // as with > li > a
159 | }
160 |
161 | // Dropdown text
162 | .dropdown-item-text {
163 | display: block;
164 | padding: $dropdown-item-padding-y $dropdown-item-padding-x;
165 | color: $dropdown-link-color;
166 | }
167 |
--------------------------------------------------------------------------------
/landingpage/dist/scss/bootstrap/_button-group.scss:
--------------------------------------------------------------------------------
1 | // stylelint-disable selector-no-qualifying-type
2 |
3 | // Make the div behave like a button
4 | .btn-group,
5 | .btn-group-vertical {
6 | position: relative;
7 | display: inline-flex;
8 | vertical-align: middle; // match .btn alignment given font-size hack above
9 |
10 | > .btn {
11 | position: relative;
12 | flex: 0 1 auto;
13 |
14 | // Bring the hover, focused, and "active" buttons to the front to overlay
15 | // the borders properly
16 | @include hover {
17 | z-index: 1;
18 | }
19 | &:focus,
20 | &:active,
21 | &.active {
22 | z-index: 1;
23 | }
24 | }
25 |
26 | // Prevent double borders when buttons are next to each other
27 | .btn + .btn,
28 | .btn + .btn-group,
29 | .btn-group + .btn,
30 | .btn-group + .btn-group {
31 | margin-left: -$btn-border-width;
32 | }
33 | }
34 |
35 | // Optional: Group multiple button groups together for a toolbar
36 | .btn-toolbar {
37 | display: flex;
38 | flex-wrap: wrap;
39 | justify-content: flex-start;
40 |
41 | .input-group {
42 | width: auto;
43 | }
44 | }
45 |
46 | .btn-group {
47 | > .btn:first-child {
48 | margin-left: 0;
49 | }
50 |
51 | // Reset rounded corners
52 | > .btn:not(:last-child):not(.dropdown-toggle),
53 | > .btn-group:not(:last-child) > .btn {
54 | @include border-right-radius(0);
55 | }
56 |
57 | > .btn:not(:first-child),
58 | > .btn-group:not(:first-child) > .btn {
59 | @include border-left-radius(0);
60 | }
61 | }
62 |
63 | // Sizing
64 | //
65 | // Remix the default button sizing classes into new ones for easier manipulation.
66 |
67 | .btn-group-sm > .btn { @extend .btn-sm; }
68 | .btn-group-lg > .btn { @extend .btn-lg; }
69 |
70 |
71 | //
72 | // Split button dropdowns
73 | //
74 |
75 | .dropdown-toggle-split {
76 | padding-right: $btn-padding-x * .75;
77 | padding-left: $btn-padding-x * .75;
78 |
79 | &::after,
80 | .dropup &::after,
81 | .dropright &::after {
82 | margin-left: 0;
83 | }
84 |
85 | .dropleft &::before {
86 | margin-right: 0;
87 | }
88 | }
89 |
90 | .btn-sm + .dropdown-toggle-split {
91 | padding-right: $btn-padding-x-sm * .75;
92 | padding-left: $btn-padding-x-sm * .75;
93 | }
94 |
95 | .btn-lg + .dropdown-toggle-split {
96 | padding-right: $btn-padding-x-lg * .75;
97 | padding-left: $btn-padding-x-lg * .75;
98 | }
99 |
100 |
101 | // The clickable button for toggling the menu
102 | // Set the same inset shadow as the :active state
103 | .btn-group.show .dropdown-toggle {
104 | @include box-shadow($btn-active-box-shadow);
105 |
106 | // Show no shadow for `.btn-link` since it has no other button styles.
107 | &.btn-link {
108 | @include box-shadow(none);
109 | }
110 | }
111 |
112 |
113 | //
114 | // Vertical button groups
115 | //
116 |
117 | .btn-group-vertical {
118 | flex-direction: column;
119 | align-items: flex-start;
120 | justify-content: center;
121 |
122 | .btn,
123 | .btn-group {
124 | width: 100%;
125 | }
126 |
127 | > .btn + .btn,
128 | > .btn + .btn-group,
129 | > .btn-group + .btn,
130 | > .btn-group + .btn-group {
131 | margin-top: -$btn-border-width;
132 | margin-left: 0;
133 | }
134 |
135 | // Reset rounded corners
136 | > .btn:not(:last-child):not(.dropdown-toggle),
137 | > .btn-group:not(:last-child) > .btn {
138 | @include border-bottom-radius(0);
139 | }
140 |
141 | > .btn:not(:first-child),
142 | > .btn-group:not(:first-child) > .btn {
143 | @include border-top-radius(0);
144 | }
145 | }
146 |
147 |
148 | // Checkbox and radio options
149 | //
150 | // In order to support the browser's form validation feedback, powered by the
151 | // `required` attribute, we have to "hide" the inputs via `clip`. We cannot use
152 | // `display: none;` or `visibility: hidden;` as that also hides the popover.
153 | // Simply visually hiding the inputs via `opacity` would leave them clickable in
154 | // certain cases which is prevented by using `clip` and `pointer-events`.
155 | // This way, we ensure a DOM element is visible to position the popover from.
156 | //
157 | // See https://github.com/twbs/bootstrap/pull/12794 and
158 | // https://github.com/twbs/bootstrap/pull/14559 for more information.
159 |
160 | .btn-group-toggle {
161 | > .btn,
162 | > .btn-group > .btn {
163 | margin-bottom: 0; // Override default `` value
164 |
165 | input[type="radio"],
166 | input[type="checkbox"] {
167 | position: absolute;
168 | clip: rect(0, 0, 0, 0);
169 | pointer-events: none;
170 | }
171 | }
172 | }
173 |
--------------------------------------------------------------------------------
28 |