From c1b8fe1221e3367f0632ce43f602e811c0fd0284 Mon Sep 17 00:00:00 2001
From: Jacky Zhao <j.zhao2k19@gmail.com>
Date: Wed, 13 Jul 2022 21:32:32 +0000
Subject: [PATCH] feat: restyle search icon
---
layouts/_default/single.html | 9 +---
assets/styles/base.scss | 19 +++++++--
layouts/_default/section.html | 7 ---
layouts/_default/taxonomy.html | 7 ---
layouts/partials/header.html | 10 +++++
layouts/index.html | 7 ---
layouts/_default/term.html | 7 ---
7 files changed, 31 insertions(+), 35 deletions(-)
diff --git a/assets/styles/base.scss b/assets/styles/base.scss
index 776f32d..4426abb 100644
--- a/assets/styles/base.scss
+++ b/assets/styles/base.scss
@@ -24,7 +24,6 @@
opacity: 0.3;
transition: opacity 0.3s ease;
color: var(--secondary);
-
}
p, ul, text {
@@ -381,11 +380,24 @@
flex: 1 1 auto;
}
- & > svg {
+ #search-icon {
+ background-color: var(--lightgray);
+ border-radius: 4px;
+ height: 2em;
+ display: flex;
+ align-items: center;
+ cursor: pointer;
+ & > p {
+ display: inline;
+ padding-left: 0.5em;
+ }
+ }
+
+ & svg {
cursor: pointer;
width: 18px;
min-width: 18px;
- margin: 0 1em;
+ margin: 0 0.5em;
&:hover .search-path {
stroke: var(--tertiary);
@@ -592,4 +604,3 @@
}
}
-
diff --git a/layouts/_default/section.html b/layouts/_default/section.html
index abdf0b0..2fc7144 100644
--- a/layouts/_default/section.html
+++ b/layouts/_default/section.html
@@ -6,12 +6,7 @@
{{partial "search.html" .}}
<div class="singlePage">
<!-- Begin actual content -->
- <header>
- <h1 id="page-title"><a href="{{ .Site.BaseURL }}">{{ .Site.Data.config.page_title }}</a></h1>
- <svg tabindex="0" id="search-icon" aria-labelledby="title desc" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 19.9 19.7"><title id="title">Search Icon</title><desc id="desc">Icon to open search</desc><g class="search-path" fill="none"><path stroke-linecap="square" d="M18.5 18.3l-5.4-5.4"/><circle cx="8" cy="8" r="7"/></g></svg>
- <div class="spacer"></div>
- {{partial "darkmode.html" .}}
- </header>
+ {{partial "header.html" .}}
<article>
<h1>All {{.Title}}</h1>
{{partial "page-list.html" .Paginator.Pages.ByLastmod.Reverse }}
diff --git a/layouts/_default/single.html b/layouts/_default/single.html
index 06507a7..7c2ab10 100644
--- a/layouts/_default/single.html
+++ b/layouts/_default/single.html
@@ -6,13 +6,8 @@
{{partial "search.html" .}}
<div class="singlePage">
<!-- Begin actual content -->
- <header>
- <h1 id="page-title"><a href="{{ .Site.BaseURL }}">{{ .Site.Data.config.page_title }}</a></h1>
- <svg tabindex="0" id="search-icon" aria-labelledby="title desc" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 19.9 19.7"><title id="title">Search Icon</title><desc id="desc">Icon to open search</desc><g class="search-path" fill="none"><path stroke-linecap="square" d="M18.5 18.3l-5.4-5.4"/><circle cx="8" cy="8" r="7"/></g></svg>
- <div class="spacer"></div>
- {{partial "darkmode.html" .}}
- </header>
- <article>
+ {{partial "header.html" .}}
+ <article>
{{if .Title}}<h1>{{ .Title }}</h1>{{end}}
<p class="meta">
Last updated {{if ne .Date .Lastmod}}{{ .Lastmod.Format "January 2, 2006" }}{{else}}Unknown{{end}}.
diff --git a/layouts/_default/taxonomy.html b/layouts/_default/taxonomy.html
index e0a1e87..8f86b64 100644
--- a/layouts/_default/taxonomy.html
+++ b/layouts/_default/taxonomy.html
@@ -6,12 +6,7 @@
{{partial "search.html" .}}
<div class="singlePage">
<!-- Begin actual content -->
- <header>
- <h1 id="page-title"><a href="{{ .Site.BaseURL }}">{{ .Site.Data.config.page_title }}</a></h1>
- <svg tabindex="0" id="search-icon" aria-labelledby="title desc" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 19.9 19.7"><title id="title">Search Icon</title><desc id="desc">Icon to open search</desc><g class="search-path" fill="none"><path stroke-linecap="square" d="M18.5 18.3l-5.4-5.4"/><circle cx="8" cy="8" r="7"/></g></svg>
- <div class="spacer"></div>
- {{partial "darkmode.html" .}}
- </header>
+ {{partial "header.html" .}}
<article>
<h1>All {{.Title}}</h1>
<div class="tags">
diff --git a/layouts/_default/term.html b/layouts/_default/term.html
index 58f024b..abddc07 100644
--- a/layouts/_default/term.html
+++ b/layouts/_default/term.html
@@ -6,12 +6,7 @@
{{partial "search.html" .}}
<div class="singlePage">
<!-- Begin actual content -->
- <header>
- <h1 id="page-title"><a href="{{ .Site.BaseURL }}">{{ .Site.Data.config.page_title }}</a></h1>
- <svg tabindex="0" id="search-icon" aria-labelledby="title desc" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 19.9 19.7"><title id="title">Search Icon</title><desc id="desc">Icon to open search</desc><g class="search-path" fill="none"><path stroke-linecap="square" d="M18.5 18.3l-5.4-5.4"/><circle cx="8" cy="8" r="7"/></g></svg>
- <div class="spacer"></div>
- {{partial "darkmode.html" .}}
- </header>
+ {{partial "header.html" .}}
<article>
<h1>Tag: {{.Title | humanize}}</h1>
{{partial "page-list.html" .Paginator.Pages}}
diff --git a/layouts/index.html b/layouts/index.html
index 5053614..c7871e9 100644
--- a/layouts/index.html
+++ b/layouts/index.html
@@ -6,12 +6,7 @@
{{partial "search.html" .}}
<div class="singlePage">
<!-- Begin actual content -->
- <header>
- <h1>{{if .Title}}{{ .Title }}{{else}}Untitled{{end}}</h1>
- <svg tabindex="0" id="search-icon" aria-labelledby="title desc" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 19.9 19.7"><title id="title">Search Icon</title><desc id="desc">Icon to open search</desc><g class="search-path" fill="none"><path stroke-linecap="square" d="M18.5 18.3l-5.4-5.4"/><circle cx="8" cy="8" r="7"/></g></svg>
- <div class="spacer"></div>
- {{partial "darkmode.html" .}}
- </header>
+ {{partial "header.html" .}}
<article>
{{partial "toc.html" .}}
{{partial "textprocessing.html" . }}
diff --git a/layouts/partials/header.html b/layouts/partials/header.html
new file mode 100644
index 0000000..773e068
--- /dev/null
+++ b/layouts/partials/header.html
@@ -0,0 +1,10 @@
+<header>
+ <h1 id="page-title"><a href="{{ .Site.BaseURL }}">{{ .Site.Data.config.page_title }}</a></h1>
+ <div class="spacer"></div>
+ <div id="search-icon">
+ <p>Search</p>
+ <svg tabindex="0" aria-labelledby="title desc" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 19.9 19.7"><title id="title">Search Icon</title><desc id="desc">Icon to open search</desc><g class="search-path" fill="none"><path stroke-linecap="square" d="M18.5 18.3l-5.4-5.4"/><circle cx="8" cy="8" r="7"/></g></svg>
+ </div>
+ {{partial "darkmode.html" .}}
+</header>
+
--
Gitblit v1.10.0