From adbf1a47d1b7a9993933f8567bee7629132042c5 Mon Sep 17 00:00:00 2001 From: Bob Wise Date: Mon, 8 Jul 2019 15:04:41 -0400 Subject: [PATCH 001/187] hide extra p --- .../SprkStepperStep/SprkStepperStep.js | 20 ++++++++++--------- 1 file changed, 11 insertions(+), 9 deletions(-) diff --git a/src/react/projects/spark-react/src/SprkStepper/components/SprkStepperStep/SprkStepperStep.js b/src/react/projects/spark-react/src/SprkStepper/components/SprkStepperStep/SprkStepperStep.js index 8d4dfda0ae..0d000b5590 100644 --- a/src/react/projects/spark-react/src/SprkStepper/components/SprkStepperStep/SprkStepperStep.js +++ b/src/react/projects/spark-react/src/SprkStepper/components/SprkStepperStep/SprkStepperStep.js @@ -81,16 +81,18 @@ class SprkStepperStep extends Component { -
- {/* desc is only ever displayed in the slider. This is just for spacing. */} -

{children}

-
+ > + {/* desc is only ever displayed in the slider. This is just for spacing. */} +

{children}

+ + } ); From a9d5de13a7beed12411db30f39d54956e07e5979 Mon Sep 17 00:00:00 2001 From: Bob Wise Date: Mon, 8 Jul 2019 15:05:15 -0400 Subject: [PATCH 002/187] fixing console warning on docs page --- src/react/src/routes/SprkStepperDocs/SprkStepperDocs.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/react/src/routes/SprkStepperDocs/SprkStepperDocs.js b/src/react/src/routes/SprkStepperDocs/SprkStepperDocs.js index 5c8e636ddd..bcae5be464 100644 --- a/src/react/src/routes/SprkStepperDocs/SprkStepperDocs.js +++ b/src/react/src/routes/SprkStepperDocs/SprkStepperDocs.js @@ -111,7 +111,7 @@ class SprkStepperDocs extends Component { This is my content From 6b7ab28afa9d0e7d60cded877bea29e1188a7a43 Mon Sep 17 00:00:00 2001 From: Bob Wise Date: Mon, 8 Jul 2019 15:47:02 -0400 Subject: [PATCH 003/187] removing extra check and rewriting to avoid negative check --- .../SprkStepper/components/SprkStepperStep/SprkStepperStep.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/react/projects/spark-react/src/SprkStepper/components/SprkStepperStep/SprkStepperStep.js b/src/react/projects/spark-react/src/SprkStepper/components/SprkStepperStep/SprkStepperStep.js index 0d000b5590..22488c0dfd 100644 --- a/src/react/projects/spark-react/src/SprkStepper/components/SprkStepperStep/SprkStepperStep.js +++ b/src/react/projects/spark-react/src/SprkStepper/components/SprkStepperStep/SprkStepperStep.js @@ -85,7 +85,7 @@ class SprkStepperStep extends Component {
From 177f2feb6bc699ebfeb7f406a6872d597d9efc4a Mon Sep 17 00:00:00 2001 From: corcorankt1 Date: Tue, 9 Jul 2019 09:00:43 -0400 Subject: [PATCH 004/187] refactor huge input classes --- packages/spark/base/inputs/_text-input.scss | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/spark/base/inputs/_text-input.scss b/packages/spark/base/inputs/_text-input.scss index fc35bee10b..1df7dedf29 100644 --- a/packages/spark/base/inputs/_text-input.scss +++ b/packages/spark/base/inputs/_text-input.scss @@ -27,11 +27,11 @@ $sprk-input-huge-box-shadow: 0 3px 10px 1px rgba(0, 0, 0, 0.08) !default; } } -.sprk-b-TextInput--huge { +// Refactor to only require the class on the container +.sprk-b-InputContainer--huge input { border: $sprk-text-input-huge-border; height: $sprk-text-input-huge-height; font-size: $sprk-text-input-huge-font-size; - text-align: center; box-shadow: $sprk-input-huge-box-shadow; &:focus { From cd84d07c81c6f8a3560f691fa999e7319fca6417 Mon Sep 17 00:00:00 2001 From: corcorankt1 Date: Tue, 9 Jul 2019 14:32:37 -0400 Subject: [PATCH 005/187] update huge input templates --- .../inputs/text-input-huge-disabled.hbs | 5 +-- .../inputs/text-input-huge-error.hbs | 6 ++-- .../components/inputs/text-input-huge.hbs | 36 +++++++++++++++---- 3 files changed, 32 insertions(+), 15 deletions(-) diff --git a/src/patterns/components/inputs/text-input-huge-disabled.hbs b/src/patterns/components/inputs/text-input-huge-disabled.hbs index 352afd3553..53dfba9421 100644 --- a/src/patterns/components/inputs/text-input-huge-disabled.hbs +++ b/src/patterns/components/inputs/text-input-huge-disabled.hbs @@ -18,10 +18,7 @@ hasAngularCode: true hasReactCode: true --- -{{#embed "patterns.components.inputs.text-input" - class="sprk-b-TextInput--huge" - containerclass="sprk-b-InputContainer--huge" - labelclass="sprk-u-ScreenReaderText" +{{#embed "patterns.components.inputs.text-input-huge" placeholder="Placeholder text" disabled=true idattr="text-input-huge-disabled" diff --git a/src/patterns/components/inputs/text-input-huge-error.hbs b/src/patterns/components/inputs/text-input-huge-error.hbs index 9fa6d36174..cc5ceb5e94 100644 --- a/src/patterns/components/inputs/text-input-huge-error.hbs +++ b/src/patterns/components/inputs/text-input-huge-error.hbs @@ -18,10 +18,8 @@ hasAngularCode: true hasReactCode: true --- -{{#embed "patterns.components.inputs.text-input" - class="sprk-b-TextInput--huge sprk-b-TextInput--error" - containerclass="sprk-b-InputContainer--huge" - labelclass="sprk-u-ScreenReaderText" +{{#embed "patterns.components.inputs.text-input-huge" + class="sprk-b-TextInput--error" idattr="text-input-huge-error" placeholder="Placeholder text" errorMessage="There is an error on this field." diff --git a/src/patterns/components/inputs/text-input-huge.hbs b/src/patterns/components/inputs/text-input-huge.hbs index 9d4698b8f1..2a9b2e84e0 100644 --- a/src/patterns/components/inputs/text-input-huge.hbs +++ b/src/patterns/components/inputs/text-input-huge.hbs @@ -18,10 +18,32 @@ hasAngularCode: true hasReactCode: true --- -{{#embed "patterns.components.inputs.text-input" - class="sprk-b-TextInput--huge" - containerclass="sprk-b-InputContainer--huge" - labelclass="sprk-u-ScreenReaderText" - idattr="text-input-huge" - placeholder="Placeholder text" - }}{{/embed}} +
+ + + {{#if errorMessage}} +
+ + + +
+ {{errorMessage}} +
+
+ {{/if}} + {{#if helperText }} +
+ {{ helperText }} +
+ {{/if}} +
From 3d568204e3e1fcc62cfd0e01d1c63e0bf0aefb29 Mon Sep 17 00:00:00 2001 From: corcorankt1 Date: Tue, 9 Jul 2019 17:12:56 -0400 Subject: [PATCH 006/187] Fix typo --- packages/spark/components/_icons.scss | 2 +- packages/spark/settings/_settings.scss | 2 +- src/patterns/components/toggle/collection.yaml | 2 +- 3 files changed, 3 insertions(+), 3 deletions(-) diff --git a/packages/spark/components/_icons.scss b/packages/spark/components/_icons.scss index 229a66c9ec..30fe8d5282 100644 --- a/packages/spark/components/_icons.scss +++ b/packages/spark/components/_icons.scss @@ -95,7 +95,7 @@ // Initial state for icons that will be toggled .sprk-c-Icon--toggle { transform-origin: center; - transition: transform $sprk-toggle-transistion-timing; + transition: transform $sprk-toggle-transition-timing; } .sprk-c-Icon--open { diff --git a/packages/spark/settings/_settings.scss b/packages/spark/settings/_settings.scss index 4d94e34201..74ea620b45 100644 --- a/packages/spark/settings/_settings.scss +++ b/packages/spark/settings/_settings.scss @@ -702,7 +702,7 @@ $sprk-accordion-active-background-color: $sprk-gray !default; // // Toggle /// -$sprk-toggle-transistion-timing: 0.3s ease !default; +$sprk-toggle-transition-timing: 0.3s ease !default; // // Dropdown diff --git a/src/patterns/components/toggle/collection.yaml b/src/patterns/components/toggle/collection.yaml index c92d12dde2..2bfd60e120 100644 --- a/src/patterns/components/toggle/collection.yaml +++ b/src/patterns/components/toggle/collection.yaml @@ -25,6 +25,6 @@ restrictions: instances of the same variant of a component on the same page, make sure each instance has a unique data-id property ("toggle-1", "toggle-2", "toggle-3", etc). variableTable: - $sprk-toggle-transistion-timing: + $sprk-toggle-transition-timing: default: 0.3s ease description: The transition timing for the rotation of the icon when the toggle is opened. From 91aa5a9246d00dee8c98cc5df9c0deed8bcdc633 Mon Sep 17 00:00:00 2001 From: corcorankt1 Date: Tue, 9 Jul 2019 17:14:16 -0400 Subject: [PATCH 007/187] Initial style changes for floating label --- .../spark/base/inputs/_input-container.scss | 17 +++++++++++++++++ packages/spark/base/inputs/_labels.scss | 10 ++++++++++ packages/spark/base/inputs/_text-input.scss | 10 +++++++++- .../components/inputs/text-input-huge-error.hbs | 1 - .../components/inputs/text-input-huge.hbs | 2 +- 5 files changed, 37 insertions(+), 3 deletions(-) diff --git a/packages/spark/base/inputs/_input-container.scss b/packages/spark/base/inputs/_input-container.scss index a96c8811b9..143ab6a1f1 100644 --- a/packages/spark/base/inputs/_input-container.scss +++ b/packages/spark/base/inputs/_input-container.scss @@ -5,6 +5,23 @@ .sprk-b-InputContainer--huge { max-width: $sprk-input-container-huge-max-width; + position: relative; + + &.active > input, input:focus { + opacity: 1; + transition-delay: .15s; + + &::placeholder { + opacity: 1; + } + } + + &.active > label, input:focus ~ label, input:not(:placeholder-shown) ~ label { + font-size: .75em; + top: 4px; + color: $sprk-green; + cursor: default; + } } .sprk-b-InputContainer__visibility-toggle { diff --git a/packages/spark/base/inputs/_labels.scss b/packages/spark/base/inputs/_labels.scss index e82aecd0e3..082e6acaee 100644 --- a/packages/spark/base/inputs/_labels.scss +++ b/packages/spark/base/inputs/_labels.scss @@ -24,3 +24,13 @@ .sprk-b-InputContainer__visibility-toggle .sprk-b-Label--inline { font-size: $sprk-visibility-control-label-font-size; } + +.sprk-b-InputContainer--huge label { + font-size: $sprk-text-input-huge-font-size; + position: absolute; + transition: .3s all; + top: 0; + width: 90%; + cursor: pointer; + padding: $sprk-text-input-padding; +} diff --git a/packages/spark/base/inputs/_text-input.scss b/packages/spark/base/inputs/_text-input.scss index 1df7dedf29..72e0867423 100644 --- a/packages/spark/base/inputs/_text-input.scss +++ b/packages/spark/base/inputs/_text-input.scss @@ -29,17 +29,25 @@ $sprk-input-huge-box-shadow: 0 3px 10px 1px rgba(0, 0, 0, 0.08) !default; // Refactor to only require the class on the container .sprk-b-InputContainer--huge input { - border: $sprk-text-input-huge-border; + position: relative; + font-size: $sprk-text-input-huge-font-size; + transition: $sprk-btn-transition-speed; + transition-delay: 0s; height: $sprk-text-input-huge-height; + border: $sprk-text-input-huge-border; + border-radius: $sprk-text-input-border-radius; font-size: $sprk-text-input-huge-font-size; + padding: $sprk-text-input-padding; box-shadow: $sprk-input-huge-box-shadow; &:focus { border-width: $sprk-text-input-huge-focus-border-width; + border-color: $sprk-green; } &::placeholder { font-size: $sprk-text-input-huge-font-size; + opacity: 0; } } diff --git a/src/patterns/components/inputs/text-input-huge-error.hbs b/src/patterns/components/inputs/text-input-huge-error.hbs index cc5ceb5e94..303be52591 100644 --- a/src/patterns/components/inputs/text-input-huge-error.hbs +++ b/src/patterns/components/inputs/text-input-huge-error.hbs @@ -5,7 +5,6 @@ description: information: - The input's 'type' attribute should be the most appropriate value that semantically matches your use case. - - The label is hidden, but important to include so it's still accessible to screen readers. restrictions: - This should only be used in a form that asks for one input at a time. links: diff --git a/src/patterns/components/inputs/text-input-huge.hbs b/src/patterns/components/inputs/text-input-huge.hbs index 2a9b2e84e0..f77ea64505 100644 --- a/src/patterns/components/inputs/text-input-huge.hbs +++ b/src/patterns/components/inputs/text-input-huge.hbs @@ -27,7 +27,7 @@ hasReactCode: true aria-describedby="{{#if idattr}}{{idattr}}{{else}}text-input-huge{{/if}}--error-container" {{#if disabled}} disabled{{/if}} {{#if invaliddata}} aria-invalid="true"{{/if}} - {{#if required}}required{{/if}} placeholder="{{#if placeholder}}{{placeholder}}{{else}}Placeholder Text{{/if}}"> + {{#if required}}required{{/if}} placeholder="{{#if placeholder}}{{placeholder}}{{else}} {{/if}}"> From 7ff6844f69fc6268b8d90b9e8afbf7ecafedd8ab Mon Sep 17 00:00:00 2001 From: corcorankt1 Date: Thu, 11 Jul 2019 15:12:56 -0400 Subject: [PATCH 008/187] update styles --- .../spark/base/inputs/_input-container.scss | 16 ----- packages/spark/base/inputs/_labels.scss | 9 ++- packages/spark/base/inputs/_text-input.scss | 64 +++++++++++++------ packages/spark/settings/_settings.scss | 11 +++- 4 files changed, 59 insertions(+), 41 deletions(-) diff --git a/packages/spark/base/inputs/_input-container.scss b/packages/spark/base/inputs/_input-container.scss index 143ab6a1f1..6d15caacf1 100644 --- a/packages/spark/base/inputs/_input-container.scss +++ b/packages/spark/base/inputs/_input-container.scss @@ -6,22 +6,6 @@ .sprk-b-InputContainer--huge { max-width: $sprk-input-container-huge-max-width; position: relative; - - &.active > input, input:focus { - opacity: 1; - transition-delay: .15s; - - &::placeholder { - opacity: 1; - } - } - - &.active > label, input:focus ~ label, input:not(:placeholder-shown) ~ label { - font-size: .75em; - top: 4px; - color: $sprk-green; - cursor: default; - } } .sprk-b-InputContainer__visibility-toggle { diff --git a/packages/spark/base/inputs/_labels.scss b/packages/spark/base/inputs/_labels.scss index 082e6acaee..111ba32368 100644 --- a/packages/spark/base/inputs/_labels.scss +++ b/packages/spark/base/inputs/_labels.scss @@ -26,11 +26,10 @@ } .sprk-b-InputContainer--huge label { - font-size: $sprk-text-input-huge-font-size; position: absolute; - transition: .3s all; - top: 0; - width: 90%; + top: $sprk-text-input-huge-label-top; + font-size: $sprk-text-input-huge-font-size; + padding: $sprk-text-input-huge-padding; + transition: $sprk-text-input-huge-transition; cursor: pointer; - padding: $sprk-text-input-padding; } diff --git a/packages/spark/base/inputs/_text-input.scss b/packages/spark/base/inputs/_text-input.scss index 72e0867423..2aab86279a 100644 --- a/packages/spark/base/inputs/_text-input.scss +++ b/packages/spark/base/inputs/_text-input.scss @@ -28,26 +28,52 @@ $sprk-input-huge-box-shadow: 0 3px 10px 1px rgba(0, 0, 0, 0.08) !default; } // Refactor to only require the class on the container -.sprk-b-InputContainer--huge input { - position: relative; - font-size: $sprk-text-input-huge-font-size; - transition: $sprk-btn-transition-speed; - transition-delay: 0s; - height: $sprk-text-input-huge-height; - border: $sprk-text-input-huge-border; - border-radius: $sprk-text-input-border-radius; - font-size: $sprk-text-input-huge-font-size; - padding: $sprk-text-input-padding; - box-shadow: $sprk-input-huge-box-shadow; - - &:focus { - border-width: $sprk-text-input-huge-focus-border-width; - border-color: $sprk-green; - } - - &::placeholder { +.sprk-b-InputContainer--huge { + input { + position: relative; + font-size: $sprk-text-input-huge-font-size; + transition: $sprk-text-input-huge-transition; + transition-delay: $sprk-text-input-huge-transition-delay; + height: $sprk-text-input-huge-height; + border-width: $sprk-text-input-huge-border-width; + border-radius: $sprk-text-input-border-radius; font-size: $sprk-text-input-huge-font-size; - opacity: 0; + padding: $sprk-text-input-huge-padding; + box-shadow: $sprk-input-huge-box-shadow; + + &:focus { + border-width: $sprk-text-input-huge-focus-border-width; + } + + &::placeholder { + font-size: $sprk-text-input-huge-font-size; + opacity: $sprk-text-input-huge-placeholder-opacity; + + } + + &.sprk-b-TextInput--label-hidden { + &::placeholder { + opacity: $sprk-text-input-huge-placeholder-active-opacity; + } + &:focus { + padding: $sprk-text-input-huge-padding; + } + } + } + &.active > input, input:focus { + opacity: $sprk-text-input-huge-placeholder-active-opacity; + padding-top: $sprk-text-input-huge-active-padding-top; + + &::placeholder { + opacity: $sprk-text-input-huge-placeholder-active-opacity; + } + } + + &.active > label, input:focus ~ label { + font-size: $sprk-text-input-huge-label-font-size; + top: $sprk-text-input-huge-label-active-top; + color: $sprk-green; + cursor: default; } } diff --git a/packages/spark/settings/_settings.scss b/packages/spark/settings/_settings.scss index 74ea620b45..788b6fd6ea 100644 --- a/packages/spark/settings/_settings.scss +++ b/packages/spark/settings/_settings.scss @@ -443,15 +443,17 @@ $sprk-text-input-font-weight: 300 !default; $sprk-text-input-height: 48px !default; $sprk-text-input-huge-height: 64px !default; $sprk-text-input-huge-font-size: $sprk-font-size-display-five !default; +$sprk-text-input-huge-label-font-size: $sprk-font-size-body-four; $sprk-text-input-line-height: 1.3 !default; $sprk-text-input-outline: 0 !default; $sprk-text-input-color: $sprk-black !default; $sprk-text-input-border: 2px solid $sprk-black-tint-25 !default; $sprk-text-input-border-radius: 4px !default; -$sprk-text-input-huge-border: 1px solid $sprk-black-tint-25 !default; +$sprk-text-input-huge-border-width: 1px !default; $sprk-text-input-huge-focus-border-width: 2px; $sprk-text-input-box-shadow: none !default; $sprk-text-input-padding: 0 $sprk-space-m !default; +$sprk-text-input-huge-padding: 0 $sprk-space-misc-a !default; $sprk-text-input-focus-border-color: $sprk-green !default; $sprk-text-input-error-border-color: $sprk-yellow !default; $sprk-text-input-disabled-border-color: $sprk-gray-dark !default; @@ -461,6 +463,13 @@ $sprk-text-input-disabled-color: $sprk-black-tint-50 !default; $sprk-text-input-readonly-border-color: $sprk-black-tint-25 !default; $sprk-text-input-readonly-color: $sprk-gray !default; $sprk-text-input-transition: border-color 0.15s ease !default; +$sprk-text-input-huge-transition: 0.3s !default; +$sprk-text-input-huge-transition-delay: 0s !default; +$sprk-text-input-huge-placeholder-opacity: 0 !default; +$sprk-text-input-huge-placeholder-active-opacity: 1 !default; +$sprk-text-input-huge-label-top: $sprk-text-input-huge-height/3 !default; +$sprk-text-input-huge-label-active-top: $sprk-space-s !default; +$sprk-text-input-huge-active-padding-top: $sprk-text-input-huge-height/3 !default; // // Select From c17bdd73aeb0db51bd97bfcc5a72b12d383f8732 Mon Sep 17 00:00:00 2001 From: corcorankt1 Date: Thu, 11 Jul 2019 15:24:47 -0400 Subject: [PATCH 009/187] update specificity for label styles --- packages/spark/base/inputs/_labels.scss | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/spark/base/inputs/_labels.scss b/packages/spark/base/inputs/_labels.scss index 111ba32368..e826b373d0 100644 --- a/packages/spark/base/inputs/_labels.scss +++ b/packages/spark/base/inputs/_labels.scss @@ -25,7 +25,7 @@ font-size: $sprk-visibility-control-label-font-size; } -.sprk-b-InputContainer--huge label { +.sprk-b-InputContainer--huge > label { position: absolute; top: $sprk-text-input-huge-label-top; font-size: $sprk-text-input-huge-font-size; From 9674004373d94eda5103601e47dd3b6c1546a292 Mon Sep 17 00:00:00 2001 From: corcorankt1 Date: Thu, 11 Jul 2019 15:33:51 -0400 Subject: [PATCH 010/187] re-organize css --- packages/spark/base/inputs/_labels.scss | 22 ++++++++++++++------- packages/spark/base/inputs/_text-input.scss | 10 ++-------- 2 files changed, 17 insertions(+), 15 deletions(-) diff --git a/packages/spark/base/inputs/_labels.scss b/packages/spark/base/inputs/_labels.scss index e826b373d0..e5c2a2015c 100644 --- a/packages/spark/base/inputs/_labels.scss +++ b/packages/spark/base/inputs/_labels.scss @@ -25,11 +25,19 @@ font-size: $sprk-visibility-control-label-font-size; } -.sprk-b-InputContainer--huge > label { - position: absolute; - top: $sprk-text-input-huge-label-top; - font-size: $sprk-text-input-huge-font-size; - padding: $sprk-text-input-huge-padding; - transition: $sprk-text-input-huge-transition; - cursor: pointer; +.sprk-b-InputContainer--huge { + > label { + position: absolute; + top: $sprk-text-input-huge-label-top; + font-size: $sprk-text-input-huge-font-size; + padding: $sprk-text-input-huge-padding; + transition: $sprk-text-input-huge-transition; + cursor: pointer; + } + &.active > label, > input:focus ~ label { + font-size: $sprk-text-input-huge-label-font-size; + top: $sprk-text-input-huge-label-active-top; + color: $sprk-green; + cursor: default; + } } diff --git a/packages/spark/base/inputs/_text-input.scss b/packages/spark/base/inputs/_text-input.scss index 2aab86279a..a5cce7a4c4 100644 --- a/packages/spark/base/inputs/_text-input.scss +++ b/packages/spark/base/inputs/_text-input.scss @@ -60,7 +60,8 @@ $sprk-input-huge-box-shadow: 0 3px 10px 1px rgba(0, 0, 0, 0.08) !default; } } } - &.active > input, input:focus { + + &.active > input, > input:focus { opacity: $sprk-text-input-huge-placeholder-active-opacity; padding-top: $sprk-text-input-huge-active-padding-top; @@ -68,13 +69,6 @@ $sprk-input-huge-box-shadow: 0 3px 10px 1px rgba(0, 0, 0, 0.08) !default; opacity: $sprk-text-input-huge-placeholder-active-opacity; } } - - &.active > label, input:focus ~ label { - font-size: $sprk-text-input-huge-label-font-size; - top: $sprk-text-input-huge-label-active-top; - color: $sprk-green; - cursor: default; - } } .sprk-b-TextInput--error, From 1025271848b90bc8ecb509e097ade6d8d5d990f4 Mon Sep 17 00:00:00 2001 From: Rob Copeland Date: Fri, 12 Jul 2019 16:19:26 -0400 Subject: [PATCH 011/187] set up algolia search --- src/assets/drizzle/styles/base/_inputs.scss | 2 +- src/assets/drizzle/styles/main.scss | 1 + src/assets/drizzle/styles/objects/_main-layout.scss | 2 -- src/assets/drizzle/styles/vendor/_algolia.scss | 3 +++ src/templates/default.hbs | 10 ++++++++++ src/templates/drizzle/nav.hbs | 6 +++--- 6 files changed, 18 insertions(+), 6 deletions(-) create mode 100644 src/assets/drizzle/styles/vendor/_algolia.scss diff --git a/src/assets/drizzle/styles/base/_inputs.scss b/src/assets/drizzle/styles/base/_inputs.scss index 3d5d2e3f75..54bc42dd6c 100644 --- a/src/assets/drizzle/styles/base/_inputs.scss +++ b/src/assets/drizzle/styles/base/_inputs.scss @@ -12,7 +12,7 @@ color: #ccc; } -.#{$app-namespace}-b-Body .#{$app-namespace}-b-TextInput--filter { +.#{$app-namespace}-b-Body .#{$app-namespace}-b-TextInput--search { box-shadow: inset 0 1px 3px; display: block; margin: 1rem auto; diff --git a/src/assets/drizzle/styles/main.scss b/src/assets/drizzle/styles/main.scss index 427dbea927..cdf955aeaa 100644 --- a/src/assets/drizzle/styles/main.scss +++ b/src/assets/drizzle/styles/main.scss @@ -23,6 +23,7 @@ @import './components/swatch'; @import './components/tag'; @import './components/tables'; +@import './vendor/algolia'; @import './vendor/prism'; @import './utility/screen-reader-text'; @import './utility/toolkit-overrides'; diff --git a/src/assets/drizzle/styles/objects/_main-layout.scss b/src/assets/drizzle/styles/objects/_main-layout.scss index b5718ffa3b..97ae82db54 100644 --- a/src/assets/drizzle/styles/objects/_main-layout.scss +++ b/src/assets/drizzle/styles/objects/_main-layout.scss @@ -63,8 +63,6 @@ $drizzle-header-padding-vert-wide: 1rem; z-index: $drizzle-layer-height-xs; top: 0; left: 0; - overflow-x: hidden; - overflow-y: auto; width: $drizzle-layout-nav-width; height: 100%; -webkit-overflow-scrolling: touch; diff --git a/src/assets/drizzle/styles/vendor/_algolia.scss b/src/assets/drizzle/styles/vendor/_algolia.scss new file mode 100644 index 0000000000..f475e7c09e --- /dev/null +++ b/src/assets/drizzle/styles/vendor/_algolia.scss @@ -0,0 +1,3 @@ +.algolia-autocomplete { + display: block !important; +} diff --git a/src/templates/default.hbs b/src/templates/default.hbs index 25e32d0629..e966b1890f 100755 --- a/src/templates/default.hbs +++ b/src/templates/default.hbs @@ -1,5 +1,6 @@ {{#extend "blank" htmlclass=" drizzle-o-Layout" bodyclass=" drizzle-o-Layout-body drizzle-b-Body"}} {{#content "head" mode="append"}} + + + {{/content}} {{/extend}} diff --git a/src/templates/drizzle/nav.hbs b/src/templates/drizzle/nav.hbs index b05cff1480..f66cad38a4 100755 --- a/src/templates/drizzle/nav.hbs +++ b/src/templates/drizzle/nav.hbs @@ -22,9 +22,9 @@
-