diff --git a/src/assets/Interactive.css b/src/assets/Interactive.css index 3925cf425c36dc6b120f994df9047c576421b640..390b6288136a99f24c21d50e01d173efe70ba41f 100644 --- a/src/assets/Interactive.css +++ b/src/assets/Interactive.css @@ -29,7 +29,7 @@ position: relative; } -.workflow-search { +.search-large { height: 5rem; width: 60%; border: 2px solid black; @@ -37,17 +37,17 @@ margin-bottom:30px; } -.ida .workflow-search:focus{ +.ida .search-large:focus{ outline: none; border-color: blue; } -.ida .workflow-search:focus + .placeholder-text .text, :not(input[value=""]) + .placeholder-text .text{ +.ida .search-large:focus + .placeholder-text .text, :not(input[value=""]) + .placeholder-text .text{ background-color: white; font-size: 1.1rem; color: black; transform: translate(0, -170%); } -.ida .workflow-search:focus + .placeholder-text .text{ +.ida .search-large:focus + .placeholder-text .text{ border-color: blueviolet; color: blue; } @@ -72,7 +72,7 @@ transition: transform 0.15s ease-out, font-size 0.15s ease-out, background-color 0.2s ease-out, color 0.15s ease-out; } -.ida .workflow-search, .placeholder-text{ +.ida .search-large, .placeholder-text{ font-size: 1.4rem; padding: 0 1.2rem; diff --git a/src/components/services/Interactive.js b/src/components/services/Interactive.js index 4d581c19b7b4ca45859aa0e58caaec35fc37cc3b..9f29a8710cbad44c831daaed37090eeae8b19a9a 100644 --- a/src/components/services/Interactive.js +++ b/src/components/services/Interactive.js @@ -240,7 +240,7 @@ export default function Interactive() { <div class="search-buttons"> <input - className="workflow-search" + className="search-large" type="text" placeholder="Search for Workflows" value={searchTerm} @@ -360,6 +360,7 @@ export default function Interactive() { <div class="search-buttons"> <input + className="search-large" type="text" placeholder="Search for Facilities" value={searchTerm}