From a3af10d351dd488b4746e98d3f46546ea67fac5f Mon Sep 17 00:00:00 2001 From: Jason Wall Date: Tue, 18 Aug 2020 08:47:25 -0400 Subject: [PATCH] tweak the display of the search bar fix issue with width not going slim enough --- app/db/src/app/pages/search/search.page.scss | 15 +++++++-------- app/db/src/styles/app.scss | 5 ++++- 2 files changed, 11 insertions(+), 9 deletions(-) diff --git a/app/db/src/app/pages/search/search.page.scss b/app/db/src/app/pages/search/search.page.scss index 29142da0..173f6612 100644 --- a/app/db/src/app/pages/search/search.page.scss +++ b/app/db/src/app/pages/search/search.page.scss @@ -7,22 +7,22 @@ mat-card { .search-bar { width: 100%; position: relative; - margin-left: 0.8rem; - margin-right: 0.8rem; + margin-left: 6px; + margin-right: 6px; } .search-bar-input { width: 100%; border: 0; - padding: 6px 6px 6px 55px; + padding: 6px 6px 6px 45px; border-radius: 0.2rem; height: auto; font-size: 1.2rem; font-family: "Roboto Condensed"; line-height: 2.2rem; -webkit-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), - 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12); - box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), + 0 3px 1px -2px rgba(0, 0, 0, 0.1), 0 1px 5px 0 rgba(0, 0, 0, 0.12); + box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.1), 0 1px 5px 0 rgba(0, 0, 0, 0.12); touch-action: manipulation; } @@ -35,8 +35,8 @@ mat-card { position: absolute; background-repeat: no-repeat; background-size: 20px; - left: 16px; - top: 11px; + left: 12px; + top: 12px; background-image: url("data:image/svg+xml;charset=utf-8,"); width: 21px; height: 21px; @@ -46,6 +46,5 @@ mat-card { padding: 0 1rem 0 1rem; overflow-y: scroll; height: calc(100vh - 66px); - width: calc(100% - 15px); margin-top: 2px; } diff --git a/app/db/src/styles/app.scss b/app/db/src/styles/app.scss index 9dfcf165..77a606a2 100644 --- a/app/db/src/styles/app.scss +++ b/app/db/src/styles/app.scss @@ -94,11 +94,14 @@ body { } mat-toolbar { - padding-left: 12px; -webkit-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12); box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.3); } +.mat-toolbar-single-row { + padding-left: 9px !important; + padding-right: 9px !important; +} a { cursor: pointer;