Merge pull request #755 from CityOfBoston/develop

(production) Fix 'Text getting cutoff at the bottom' on Windows
CityOfBoston · May 22, 2024 · 5171408 · 5171408
2 parents bf5d715 + e36d0f0
commit 5171408
Show file tree

Hide file tree

Showing 3 changed files with 19 additions and 6 deletions.
diff --git a/.github/workflows/deploy_to_s3.yml b/.github/workflows/deploy_to_s3.yml
@@ -41,10 +41,13 @@ jobs:
         run: |
           if [[ "${{ github.ref_name }}" == "develop" ]]; then
             echo "BUCKET_NAME=patterns-stg.boston.gov" >> "${GITHUB_ENV}"
+            echo "CLOUDFRONT_ID=${{ secrets.STG_CLOUDFRONT_DISTRIBUTION_ID }}" >> "${GITHUB_ENV}"
           elif [[ "${{ github.ref_name }}" == "production" ]]; then
             echo "BUCKET_NAME=patterns.boston.gov" >> "${GITHUB_ENV}"
+            echo "CLOUDFRONT_ID=${{ secrets.CLOUDFRONT_DISTRIBUTION_ID }}" >> "${GITHUB_ENV}"
           else
             echo "BUCKET_NAME=patterns-uat.boston.gov" >> "${GITHUB_ENV}"
+            echo "CLOUDFRONT_ID=${{ secrets.UAT_CLOUDFRONT_DISTRIBUTION_ID }}" >> "${GITHUB_ENV}"
           fi
           if [[ ${{ vars.S3_DRY_RUN }} == 1 ]];then
             echo "S3_DEST_DIR='DRY_RUN/'" >> "${GITHUB_ENV}"
@@ -108,7 +111,7 @@ jobs:
         id: Invalidate-Cache
         uses: chetan/invalidate-cloudfront-action@v2
         env:
-          DISTRIBUTION: ${{ secrets.CLOUDFRONT_DISTRIBUTION_ID }}
+          DISTRIBUTION: ${{ env.CLOUDFRONT_ID }}
           PATHS: "/*"
           AWS_REGION: "us-east-1"
           AWS_ACCESS_KEY_ID: ${{ secrets.AWS_ACCESS_KEY }}

diff --git a/stylesheets/components/form/_select.styl b/stylesheets/components/form/_select.styl
@@ -78,12 +78,22 @@ $select-arrow-box-thin-width = 42px
     padding: 0 85px 0 $sizing-300
     width: 100%
     height: "calc(2 * %s + 2 * %s + %s * 1rem)" % ($sizing-300 $border-200 $line-height-300)
+    color: $charles-blue
 
     margin: 0
     box-sizing: border-box
     -moz-appearance: none
     appearance: none
 
+    option
+      color: $charles-blue
+
+    &--default
+      color: $charles-blue
+
+      option
+        color: $charles-blue
+
     // hides the arrow box on IE10
     &::-ms-expand
       display: none

diff --git a/stylesheets/components/form/_textbox.styl b/stylesheets/components/form/_textbox.styl
@@ -25,7 +25,7 @@
     margin: 0 0 $sizing-300
 
   &-f
-    field-height = "calc(%srem + %s * 1)" % ($line-height-600 $border-200)
+    field-height = "calc(%srem + %s * 1)" % ($line-height-600 $border-150)
 
     font-family: $serif
     font-size: 1rem
@@ -37,7 +37,7 @@
     border: $border-200 solid $charles-blue
     border-radius: 0 // Safari/iOS rounds input field corners by default
 
-    height: field-height
+    height: 57px
     line-height: field-height
 
     padding-left: $sizing-300
@@ -52,13 +52,13 @@
       border-color: $focus-indicator-color
 
     &--sm
-      field-height-sm = "calc(%srem + %s * 1)" % ($line-height-400 $border-200)
+      field-height-sm = "calc(%srem + %s * 1)" % ($line-height-400 $border-150)
 
       padding-left: $sizing-200
       padding-right: $sizing-200
 
       height: field-height-sm
-      line-height: field-height-sm
+      line-height: 35px
 
     &::placeholder
       font-style: italic
@@ -74,7 +74,7 @@
     textarea&
       &.txt-f--combo
         // Need to leave space for a .sel-f--sq element, and its borders
-        width: "calc(100% - %s - %s * 1)" % ($select-arrow-box-width $border-200)
+        width: "calc(100% - %s - %s * 1)" % ($select-arrow-box-width $border-150)
 
     input[type=email]&--auto,
     input[type=tel]&--auto,