Skip to content

Commit

Permalink
apply more
Browse files Browse the repository at this point in the history
  • Loading branch information
@nahbee10
nahbee10 committed Nov 7, 2024
1 parent bcc0f3c commit 172da9e
Show file tree
Hide file tree
Showing 4 changed files with 169 additions and 57 deletions.
100 changes: 94 additions & 6 deletions assets/tailwind-output.css
View file

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

17 changes: 15 additions & 2 deletions styles/main.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -334,9 +334,22 @@ html:has(.ArticlePage) {
@apply !px-3;
}

.search.search-full {
.search {
@apply w-full grow;
input {
@apply !body-3 !bg-transparent w-full focus-visible:!border-none focus-visible:!outline-none;
@apply !body-3 !bg-transparent w-full focus-visible:!border-none focus-visible:!outline-none dark:text-dark-neutral-2 text-light-neutral-2;
}
}

.filters-in-section {
@apply flex flex-col space-y-6;
.sidenav-item {
@apply !body-3 dark:text-dark-neutral-1 text-light-neutral-1 hover:text-light-accent-1 dark:hover:text-dark-accent-1;
}
}

.search-result-description {
em {
@apply bg-dark-accent-1 !p-px !not-italic;
}
}
21 changes: 3 additions & 18 deletions templates/new_request_page.hbs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@
<div class="page-wrapper">
<div class="mb-3 md:mb-6 flex flex-row items-center overflow-scroll col-span-4 sm:col-span-8">
<a href="/" target="_self" class="group flex">
<span class="body-3 text-nowrap transition text-light-neutral-1 dark:text-dark-neutral-1 group-hover:text-light-neutral-2 group-hover:dark:text-dark-neutral-2">
<span class="body-3 text-nowrap transition text-light-neutral-2 dark:text-dark-neutral-2 group-hover:text-light-neutral-1 group-hover:dark:text-dark-neutral-1">
Home
</span>
</a>
Expand All @@ -19,11 +19,11 @@
fill-rule="evenodd"
clip-rule="evenodd"
d="M5.52827 3.52827C5.26792 3.78862 5.26792 4.21073 5.52827 4.47108L9.05687 7.99967L5.52827 11.5283C5.26792 11.7886 5.26792 12.2107 5.52827 12.4711C5.78862 12.7314 6.21073 12.7314 6.47108 12.4711L10.4711 8.47108C10.7314 8.21073 10.7314 7.78862 10.4711 7.52827L6.47108 3.52827C6.21073 3.26792 5.78862 3.26792 5.52827 3.52827Z"
class="fill-light-neutral-1 dark:fill-dark-neutral-1"
class="fill-light-neutral-2 dark:fill-dark-neutral-2"
/>
</svg>
<a href="#" class="group flex">
<span class="body-3 text-nowrap text-light-neutral-1 dark:text-dark-neutral-1 transition group-hover:text-light-neutral-2 group-hover:dark:text-dark-neutral-2">
<span class="body-3 text-nowrap text-light-neutral-2 dark:text-dark-neutral-2 transition group-hover:text-light-neutral-1 group-hover:dark:text-dark-neutral-1">
Submit a Request
</span>
</a>
Expand All @@ -37,21 +37,6 @@
</div>
</div>
</div>
{{!-- <script type="module">
import { renderArticleBreadcrumbs } from "article-page";
const container = document.getElementById("new-article-breadcrumbs");
const settings = {{json settings}};
const articlePageData = {
article: {{json article}}
}
// Make sure arguments are correctly typed.
renderArticleBreadcrumbs(settings, articlePageData, container);
</script> --}}
<script type="module">
import { renderNewRequestForm } from "new-request-form";
Expand Down
88 changes: 57 additions & 31 deletions templates/search_results.hbs
View file
Original file line number Diff line number Diff line change
@@ -1,8 +1,8 @@
<div class="container-divider"></div>
<div class="container">
<div class="search-results flex flex-row text-light-neutral-1 dark:text-light-neutral-1">
<div class="min-w-[15rem] max-w-[15rem] hidden md:block border-2 mt-nav-h">
<aside class="search-results-sidebar">
<div>
<div class="search-results flex flex-row text-light-neutral-1 dark:text-light-neutral-1 !bg-light-surface-1 dark:!bg-dark-surface-1">
<div class="min-w-[15rem] max-w-[15rem] mt-nav-h hidden md:block !bg-light-surface-1 dark:!bg-dark-surface-1">
<aside class="search-results-sidebar mt-[1.5rem] px-[1.63rem]">
{{#if source_filters}}
<section class="filters-in-section collapsible-sidebar">
<button type="button" class="collapsible-sidebar-toggle" aria-expanded="false" aria-label="{{t 'search_result_source_menu'}}">
Expand Down Expand Up @@ -122,8 +122,35 @@
</aside>
</div>
<div class="page-wrapper">
<section id="main-content" class="search-results-column mt-[1.94rem]">
<h1 class="search-results-subheading heading-2">
<section id="main-content" class="search-results-column">
<div class="mb-3 md:mb-6 flex flex-row items-center overflow-scroll col-span-4 sm:col-span-8">
<a href="/" target="_self" class="group flex">
<span class="body-3 text-nowrap transition text-light-neutral-2 dark:text-dark-neutral-2 group-hover:text-light-neutral-1 group-hover:dark:text-dark-neutral-1">
Home
</span>
</a>
<svg
class="mx-0.5 min-w-4 min-h-4"
width="16"
height="16"
viewBox="0 0 16 16"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
fill-rule="evenodd"
clip-rule="evenodd"
d="M5.52827 3.52827C5.26792 3.78862 5.26792 4.21073 5.52827 4.47108L9.05687 7.99967L5.52827 11.5283C5.26792 11.7886 5.26792 12.2107 5.52827 12.4711C5.78862 12.7314 6.21073 12.7314 6.47108 12.4711L10.4711 8.47108C10.7314 8.21073 10.7314 7.78862 10.4711 7.52827L6.47108 3.52827C6.21073 3.26792 5.78862 3.26792 5.52827 3.52827Z"
class="fill-light-neutral-2 dark:fill-dark-neutral-2"
/>
</svg>
<a href="#" class="group flex">
<span class="body-3 text-nowrap text-light-neutral-2 dark:text-dark-neutral-2 transition group-hover:text-light-neutral-1 group-hover:dark:text-dark-neutral-1">
Search results
</span>
</a>
</div>
<h1 class="search-results-subheading heading-2 text-light-neutral-1 dark:text-dark-neutral-1">
{{#if results}}
{{#is current_filter.identifier 'unified'}}
{{#if content_tag_filters }}
Expand All @@ -148,12 +175,11 @@
{{/is}}
{{/if}}
</h1>
<div class="search-container my-[1.94rem]">
<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" focusable="false" viewBox="0 0 12 12" class="search-icon" aria-hidden="true">
<circle cx="4.5" cy="4.5" r="4" fill="none" stroke="currentColor"/>
<path stroke="currentColor" stroke-linecap="round" d="M11 11L7.5 7.5"/>
</svg>
{{search submit=false}}
<div class="search-container my-[1.94rem] w-full mt-8">
<div class="m-auto flex flex-row space-x-2 p-3 rounded-[1.25rem] bg-light-surface-3 dark:!bg-dark-surface-3 items-center !pointer-events-auto !mt-4 border border-transparent focus-within:!border-light-surface-3 focus-within:dark:!border-dark-surface-3 focus-within:!bg-transparent focus-within:!text-light-neutral-1 focus-within:dark:!text-dark-neutral-1">
<h2 class="sr-only">{{ t 'search' }}</h2>
{{search submit=false}}
</div>
</div>
{{#if results}}
<ul class="search-results-list">
Expand All @@ -162,7 +188,7 @@
<article class="flex flex-col space-y-[0.62rem]">
<header class="flex flex-col space-y-[0.62rem]">
<div class="search-result-title-container">
<h2 class="search-result-title heading-3">
<h2 class="search-result-title heading-3 text-light-neutral-1 dark:text-dark-neutral-1 hover:text-light-neutral-2 hover:dark:text-dark-neutral-2">
<a href="{{url}}" {{#if is_external}} target="_blank" {{/if}}>
{{title}}
{{#if is_external}}
Expand Down Expand Up @@ -211,33 +237,33 @@
{{#is type 'community_post'}}aria-label='{{t 'post_location_with_title' title=title}}'{{/is}}
{{#is type 'external_content_record'}}aria-label='{{t 'external_content_location_with_title' title=title}}'{{/is}}
>
<ol class="breadcrumbs search-result-breadcrumbs flex flex-row">
<ol class="breadcrumbs search-result-breadcrumbs flex flex-row items-center flex-wrap">
{{#each path_steps}}
<li class="flex flex-row items-center body-3 text-light-neutral-2 dark:text-dark-neutral-2">
<li class="flex flex-row items-center body-3 text-light-neutral-2 dark:text-dark-neutral-2 hover:text-light-neutral-1 hover:dark:text-dark-neutral-1 shrink-0">
<a href="{{url}}" target="{{target}}">{{name}}</a>
<svg
class="min-w-4 min-h-4"
width="16"
height="16"
viewBox="0 0 16 16"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
fill-rule="evenodd"
clip-rule="evenodd"
d="M5.52827 3.52827C5.26792 3.78862 5.26792 4.21073 5.52827 4.47108L9.05687 7.99967L5.52827 11.5283C5.26792 11.7886 5.26792 12.2107 5.52827 12.4711C5.78862 12.7314 6.21073 12.7314 6.47108 12.4711L10.4711 8.47108C10.7314 8.21073 10.7314 7.78862 10.4711 7.52827L6.47108 3.52827C6.21073 3.26792 5.78862 3.26792 5.52827 3.52827Z"
class="fill-light-neutral-2 dark:fill-dark-neutral-2"
/>
</svg>
</li>
<svg
class="min-w-4 min-h-4 last:hidden shrink-0"
width="16"
height="16"
viewBox="0 0 16 16"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
fill-rule="evenodd"
clip-rule="evenodd"
d="M5.52827 3.52827C5.26792 3.78862 5.26792 4.21073 5.52827 4.47108L9.05687 7.99967L5.52827 11.5283C5.26792 11.7886 5.26792 12.2107 5.52827 12.4711C5.78862 12.7314 6.21073 12.7314 6.47108 12.4711L10.4711 8.47108C10.7314 8.21073 10.7314 7.78862 10.4711 7.52827L6.47108 3.52827C6.21073 3.26792 5.78862 3.26792 5.52827 3.52827Z"
class="fill-light-neutral-2 dark:fill-dark-neutral-2"
/>
</svg>
{{/each}}
</ol>
</nav>
</div>
</header>
<p class="search-result-description body-2 dark:text-dark-neutral-1 text-light-neutral-1">{{text}}</p>
<span class="meta-data body-2 text-light-neutral-2 dark:text-dark-neutral-2">{{date created_at}}</span>
<span class="meta-data body-2 text-light-neutral-2 dark:text-dark-neutral-2 italic">{{date created_at}}</span>
</article>
</li>
<div class="h-px bg-light-surface-3 dark:bg-dark-surface-3 w-full my-[1.94rem]"></div>
Expand Down

0 comments on commit 172da9e

Please sign in to comment.