forked from e621ng/e621ng
[Posts] Replace the search submit icon with a lucide one (#910)
This commit is contained in:
parent
aa606b7125
commit
9135ccd4b9
@ -28,6 +28,7 @@ module IconHelper
|
|||||||
ellipsis: %(<circle cx="12" cy="12" r="1"/><circle cx="19" cy="12" r="1"/><circle cx="5" cy="12" r="1"/>),
|
ellipsis: %(<circle cx="12" cy="12" r="1"/><circle cx="19" cy="12" r="1"/><circle cx="5" cy="12" r="1"/>),
|
||||||
|
|
||||||
# Posts
|
# Posts
|
||||||
|
search: %(<circle cx="11" cy="11" r="8"/><path d="m21 21-4.3-4.3"/>),
|
||||||
fullscreen: %(<path d="M3 7V5a2 2 0 0 1 2-2h2"/><path d="M17 3h2a2 2 0 0 1 2 2v2"/><path d="M21 17v2a2 2 0 0 1-2 2h-2"/><path d="M7 21H5a2 2 0 0 1-2-2v-2"/><rect width="10" height="8" x="7" y="8" rx="1"/>),
|
fullscreen: %(<path d="M3 7V5a2 2 0 0 1 2-2h2"/><path d="M17 3h2a2 2 0 0 1 2 2v2"/><path d="M21 17v2a2 2 0 0 1-2 2h-2"/><path d="M7 21H5a2 2 0 0 1-2-2v-2"/><rect width="10" height="8" x="7" y="8" rx="1"/>),
|
||||||
}.freeze
|
}.freeze
|
||||||
|
|
||||||
|
@ -30,7 +30,7 @@
|
|||||||
// Disable manual resizing
|
// Disable manual resizing
|
||||||
resize: none;
|
resize: none;
|
||||||
|
|
||||||
border-radius: 3px 0 0 3px;
|
border-radius: 0.25rem 0 0 0.25rem;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
flex: 1;
|
flex: 1;
|
||||||
|
|
||||||
@ -43,19 +43,27 @@
|
|||||||
font-size: unset;
|
font-size: unset;
|
||||||
max-width: unset;
|
max-width: unset;
|
||||||
|
|
||||||
font-size: 1rem;
|
display: flex;
|
||||||
line-height: 1rem;
|
align-items: center;
|
||||||
padding: 0.5rem;
|
padding: 0.5rem;
|
||||||
|
|
||||||
border-radius: 0 3px 3px 0;
|
border-radius: 0 0.25rem 0.25rem 0;
|
||||||
background: white;
|
background: white;
|
||||||
|
color: black;
|
||||||
|
|
||||||
span { display: none; }
|
svg {
|
||||||
|
height: 1.5rem;
|
||||||
|
width: 1.5rem;
|
||||||
|
margin: -0.25rem 0 -0.25rem;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@include window-larger-than(800px) {
|
@include window-larger-than(800px) {
|
||||||
textarea, button[type="submit"] {
|
textarea { font-size: 0.85rem; }
|
||||||
font-size: 0.85rem;
|
button[type="submit"] svg {
|
||||||
|
height: 1.25rem;
|
||||||
|
width: 1.25rem;
|
||||||
|
margin: -0.125rem 0 -0.125rem;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -39,7 +39,7 @@ body.c-static.a-home {
|
|||||||
input[type="text"] {
|
input[type="text"] {
|
||||||
flex: 1;
|
flex: 1;
|
||||||
border: 0;
|
border: 0;
|
||||||
border-radius: 3px 0 0 3px;
|
border-radius: 0.25rem 0 0 0.25rem;
|
||||||
padding: 0.5rem;
|
padding: 0.5rem;
|
||||||
font-size: 1rem;
|
font-size: 1rem;
|
||||||
|
|
||||||
@ -53,9 +53,14 @@ body.c-static.a-home {
|
|||||||
|
|
||||||
button[type="submit"] {
|
button[type="submit"] {
|
||||||
background: white;
|
background: white;
|
||||||
border-radius: 0 3px 3px 0;
|
border-radius: 0 0.25rem 0.25rem 0;
|
||||||
padding: 0 0.5em;
|
padding: 0 0.5rem;
|
||||||
font-size: 1rem;
|
|
||||||
|
svg {
|
||||||
|
height: 1.25rem;
|
||||||
|
width: 1.25rem;
|
||||||
|
margin: -0.125rem 0 -0.125rem;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -10,6 +10,6 @@
|
|||||||
<% end %>
|
<% end %>
|
||||||
|
|
||||||
<%= text_area_tag("tags", tags, placeholder: "Search posts by tag", rows: 1, data: { shortcut: "q", autocomplete: "tag-query" }) %>
|
<%= text_area_tag("tags", tags, placeholder: "Search posts by tag", rows: 1, data: { shortcut: "q", autocomplete: "tag-query" }) %>
|
||||||
<%= tag.button(tag.i(class: "fa-solid fa-magnifying-glass"), type: "submit", title: "Search") %>
|
<%= tag.button(svg_icon(:search), type: "submit", title: "Search") %>
|
||||||
<% end %>
|
<% end %>
|
||||||
</section>
|
</section>
|
||||||
|
@ -9,7 +9,7 @@
|
|||||||
<!-- Primary Searchbar -->
|
<!-- Primary Searchbar -->
|
||||||
<div class="home-search">
|
<div class="home-search">
|
||||||
<%= text_field_tag("tags", "", autofocus: "autofocus", placeholder: "Search posts by tag", data: { shortcut: "q", autocomplete: "tag-query" }) %>
|
<%= text_field_tag("tags", "", autofocus: "autofocus", placeholder: "Search posts by tag", data: { shortcut: "q", autocomplete: "tag-query" }) %>
|
||||||
<%= tag.button(tag.i(class: "fa-solid fa-magnifying-glass"), type: "submit") %>
|
<%= tag.button(svg_icon(:search), type: "submit") %>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- Secondary search buttons -->
|
<!-- Secondary search buttons -->
|
||||||
|
Loading…
Reference in New Issue
Block a user