diff --git a/src/Funnel1.vue b/src/Funnel1.vue index a30f90bd8..61366627e 100644 --- a/src/Funnel1.vue +++ b/src/Funnel1.vue @@ -17,29 +17,40 @@
-
- - - -
+ + +
diff --git a/src/assets/img/icons/back-glass-damage.svg b/src/assets/img/icons/back-glass-damage.svg new file mode 100644 index 000000000..59379e6de --- /dev/null +++ b/src/assets/img/icons/back-glass-damage.svg @@ -0,0 +1,10 @@ + + + + + + + + diff --git a/src/assets/img/icons/side-window-damage.svg b/src/assets/img/icons/side-window-damage.svg new file mode 100644 index 000000000..356145856 --- /dev/null +++ b/src/assets/img/icons/side-window-damage.svg @@ -0,0 +1,10 @@ + + + + + + + + diff --git a/src/assets/img/icons/windshield-damage.svg b/src/assets/img/icons/windshield-damage.svg new file mode 100644 index 000000000..dfdea1bb1 --- /dev/null +++ b/src/assets/img/icons/windshield-damage.svg @@ -0,0 +1,12 @@ + + + + + + + + + + diff --git a/src/assets/scss/_CustomVariables.scss b/src/assets/scss/_CustomVariables.scss index 2afbb0859..005dbddff 100644 --- a/src/assets/scss/_CustomVariables.scss +++ b/src/assets/scss/_CustomVariables.scss @@ -92,3 +92,6 @@ $font-family-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberati // stylelint-enable value-keyword-case $font-family-base: $font-family-sans-serif; $font-family-code: $font-family-monospace; + +//Gutters +$grid-gutter-width: .75rem; diff --git a/src/assets/scss/_GlobalStyles.scss b/src/assets/scss/_GlobalStyles.scss index de25b29f8..715d8fa00 100644 --- a/src/assets/scss/_GlobalStyles.scss +++ b/src/assets/scss/_GlobalStyles.scss @@ -1,3 +1,5 @@ body { + font-size: 16px; background-color: #fff; + padding: 0 .75rem; } diff --git a/src/assets/scss/components/_buttons.scss b/src/assets/scss/components/_buttons.scss index 26341f377..a6238f36b 100644 --- a/src/assets/scss/components/_buttons.scss +++ b/src/assets/scss/components/_buttons.scss @@ -18,3 +18,19 @@ } } } +// Non-Bootstrap button +// Intended to be used without .btn class +.btn-damage { + width: 100%; + background-color: $white; + border: 1px solid #b3b4b5; + &:focus { + background-color: #e7f1f6; + border: 1px solid $blue; + } + &:focus-visible { // For keyboard/screenreader + background-color: #e7f1f6; + outline: none; + box-shadow: 0 0 0 2px $blue; + } +} diff --git a/src/components/imageButton.vue b/src/components/imageButton.vue new file mode 100644 index 000000000..03a48b967 --- /dev/null +++ b/src/components/imageButton.vue @@ -0,0 +1,15 @@ + + +