fix: add mobile font size to search component (#640)

* fix: add mobile font size to search component * chore: add new tokens package version
cds-snc · Sep 13, 2024 · 2f8efa3 · 2f8efa3
1 parent 0a33996
commit 2f8efa3
Show file tree

Hide file tree

Showing 3 changed files with 9 additions and 6 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/packages/web/package.json b/packages/web/package.json
@@ -45,7 +45,7 @@
     "@babel/core": "^7.20.12",
     "@babel/preset-env": "^7.20.2",
     "@babel/preset-typescript": "^7.21.0",
-    "@cdssnc/gcds-tokens": "^1.18.1",
+    "@cdssnc/gcds-tokens": "^1.19.0",
     "@fortawesome/fontawesome-free": "^6.3.0",
     "@stencil/angular-output-target": "file:../../utils/angular-output-target",
     "@stencil/postcss": "^2.1.0",

diff --git a/packages/web/src/components/gcds-search/gcds-search.css b/packages/web/src/components/gcds-search/gcds-search.css
@@ -36,7 +36,10 @@
       width: 100%;
       height: auto;
       min-height: var(--gcds-search-min-width-and-height);
-      font: var(--gcds-search-font);
+      font: var(--gcds-search-font-desktop);
+      @media only screen and (width < 48em) {
+        font: var(--gcds-search-font-mobile);
+      }
       padding: var(--gcds-search-padding) !important;
       background-color: var(--gcds-search-default-background);
       color: var(--gcds-search-default-text);