morrigan/crabbysearch
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

💄 style: replace the search button with a magnifying glass (#483)

Browse source 
Co-authored-by: neon_arch <mustafadhuleb53@gmail.com>
This commit is contained in:
Леонтий Вартанян 2024-01-06 21:17:11 +03:00 • committed by GitHub
parent 3a97a6f621
commit 33846cee34
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 12 additions and 1 deletions
Download patch file Download diff file Expand all files Collapse all files

1
public/images/magnifying_glass.svg Normal file
View file

@ -0,0 +1 @@
<?xml version="1.0" encoding="utf-8"?><!-- Generator: Adobe Illustrator 16.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 50 50" width="24px" height="24px"><circle fill="none" stroke="#000000" stroke-width="2" stroke-linecap="round" stroke-miterlimit="10" cx="21" cy="20" r="16"/><line fill="none" stroke="#000000" stroke-width="4" stroke-miterlimit="10" x1="32.229" y1="32.229" x2="45.5" y2="45.5"/></svg>
Side by side

After

Width:  |  Height:  |  Size: 610 B

8
public/static/themes/simple.css
View file

@ -95,6 +95,14 @@ button {
color: var(--background-color);
font-weight: 600;
letter-spacing: 0.1rem;
position: relative;
}
.search_bar button img {
position:absolute;
left:50%;
top:50%;
transform:translate(-50%, -50%);
}
.search_bar button:active {