diff --git a/app/site/projects.liquid b/app/site/projects.liquid index b328aeb748..0dbff7e05b 100644 --- a/app/site/projects.liquid +++ b/app/site/projects.liquid @@ -177,7 +177,7 @@ layout: base Ascending Descending - + diff --git a/app/src/css/style.css b/app/src/css/style.css index 07c1c6b9fa..e652a502c4 100644 --- a/app/src/css/style.css +++ b/app/src/css/style.css @@ -274,7 +274,7 @@ a.usa-link:visited { .search-block { display: flex; flex-direction: column; - justify-content: flex-end; + align-items: flex-end; } .dashboard-container { @@ -296,9 +296,9 @@ a.usa-link:visited { z-index: 10; } -section:active { +/* section:active { border: #E7C000; -} +} */ .usa-search--small [type=submit], .usa-search--small .usa-search__submit { padding-left: 0.75rem; @@ -323,6 +323,10 @@ section:active { border: none } +#sort-direction { + width: 90%; +} + .sort-outer { display: flex; background-color: #E0EAF8; @@ -340,6 +344,11 @@ section:active { margin: 0 0 0 -20%; } +.sort-icon { + margin-left: -30%; + margin-right: 8%; +} + .outer-project-template { height: fit-content; width: 90vw; @@ -601,6 +610,13 @@ iframe:focus, [href]:focus, [tabindex]:focus, [contentEditable=true]:focus { } @media (max-width: 767px) { + .usa-header { + align-items: stretch; + } + .title { + width: 100vw; + } + .usa-nav { display: none; position: absolute; @@ -641,6 +657,29 @@ iframe:focus, [href]:focus, [tabindex]:focus, [contentEditable=true]:focus { .usa-accordion__heading { font-size: 1.2rem; } + + .search-block { + align-items: center; + } + + .sort-styling { + width: 75vw; + align-items: center; + } + + .search-styling { + width: 65vw; + } + + .sort-outer { + margin-left: 0; + width: 75vw; + } + + .sort-icon { + margin-left: -21%; + margin-right: 5%; + } } @media (min-width: 768px) { diff --git a/app/src/js/projects.js b/app/src/js/projects.js index ee435d7463..3d4a934ed5 100644 --- a/app/src/js/projects.js +++ b/app/src/js/projects.js @@ -20,7 +20,7 @@ let filteredProjects = [...parsedProjectsData]; // Hide sort direction when sort is not selected -document.getElementById("sort-direction-form").hidden = true; +// document.getElementById("sort-direction-form").hidden = true; // Main Function to create project cards, filter buttons, and hide headings based on filters createProjectCards();