Update local user layout and styles
Resubmitting after reverted–original commit here
https://gerrit.openbmc-project.xyz/c/openbmc/webui-vue/+/28790
- Add BVConfig plugin to modify boostrap component
defaults
- Add vuelidate
- Add package and basic validations to user form
- Add all user form validations
- Add checks for edit user
- Create VuelidateMixin for shared methods
- Update Login to use Vuelidate
Signed-off-by: Yoshie Muranaka <yoshiemuranaka@gmail.com>
Signed-off-by: Derick Montague <derick.montague@ibm.com>
Change-Id: Ib50ee4d1fb5f14637c9460e77f0682869a86ac8a
diff --git a/src/assets/styles/_form-components.scss b/src/assets/styles/_form-components.scss
new file mode 100644
index 0000000..41b291b
--- /dev/null
+++ b/src/assets/styles/_form-components.scss
@@ -0,0 +1,29 @@
+.form-text {
+ margin-top: -$spacer / 4;
+ margin-bottom: $spacer / 2;
+ color: $gray-800;
+}
+
+.col-form-label {
+ color: $gray-800;
+ font-size: 14px;
+}
+
+.form-group {
+ margin-bottom: $spacer * 2;
+}
+
+.custom-select,
+.custom-control-label,
+.form-control {
+ //important needed to override validation colors on radio labels
+ color: $gray-900!important;
+ border-color: $gray-400!important;
+ &::before {
+ border-color: $primary;
+ }
+ &.is-invalid,
+ &:invalid {
+ border-bottom: 2px solid $danger!important;
+ }
+}
\ No newline at end of file
diff --git a/src/assets/styles/_modal.scss b/src/assets/styles/_modal.scss
new file mode 100644
index 0000000..b20327e
--- /dev/null
+++ b/src/assets/styles/_modal.scss
@@ -0,0 +1,7 @@
+.modal-header {
+ .close {
+ font-weight: normal;
+ color: $gray-900;
+ opacity: 1;
+ }
+}
\ No newline at end of file
diff --git a/src/assets/styles/_obmc-custom.scss b/src/assets/styles/_obmc-custom.scss
index e87e01b..d20e64e 100644
--- a/src/assets/styles/_obmc-custom.scss
+++ b/src/assets/styles/_obmc-custom.scss
@@ -1,4 +1,5 @@
$enable-rounded: false;
+$enable-validation-icons: false;
// Required
@import "~bootstrap/scss/functions";
@@ -52,4 +53,7 @@
@import "~bootstrap-vue/src/index.scss";
-@import "./buttons";
\ No newline at end of file
+@import "./buttons";
+@import "./form-components";
+@import "./modal";
+@import "./table";
\ No newline at end of file
diff --git a/src/assets/styles/_table.scss b/src/assets/styles/_table.scss
new file mode 100644
index 0000000..ff1ed30
--- /dev/null
+++ b/src/assets/styles/_table.scss
@@ -0,0 +1,21 @@
+.table-light {
+ td {
+ border-top: none;
+ border-bottom: 1px solid $gray-300;
+ }
+}
+
+.thead-light.thead-light {
+ th {
+ border: none;
+ color: $gray-900;
+ }
+}
+
+.table-cell__actions {
+ text-align: right;
+ .btn {
+ padding-top: 0;
+ padding-bottom: 0;
+ }
+}