nikon/docsearch
1
0
Fork 0
Code Activity Actions

feat(design): icon actions

Browse source
This commit is contained in:
Shipow 2020-04-04 09:50:09 +02:00
parent 164a0ce8f0
commit 6eca63971e
3 changed files with 35 additions and 7 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
src/icons/SelectIcon.tsx
View file

@ -2,7 +2,7 @@ import React from 'react';
export function SelectIcon() {
return (
<svg width="20" height="20">
<svg width="20" height="20" viewBox="0 0 20 20">
<g
stroke="currentColor"
fill="none"

3
src/icons/StarIcon.tsx
View file

@ -4,9 +4,8 @@ export function StarIcon() {
return (
<svg width="20" height="20" viewBox="0 0 20 20">
<path
d="M10 14.236866l-4.98073469 2.6185272.95123569-5.5461296-4.02949901-3.92779079 5.56863067-.8091694L10 1.52626803l2.4903673 5.04603538 5.5686307.8091694-4.029499 3.92779079.9512357 5.5461296z"
d="M10 14.2L5 17l1-5.6-4-4 5.5-.7 2.5-5 2.5 5 5.6.8-4 4 .9 5.5z"
stroke="currentColor"
strokeWidth="2"
fill="none"
fillRule="evenodd"
strokeLinejoin="round"

37
src/style.css
View file

@ -454,14 +454,28 @@ html[data-theme='dark'] {
.DocSearch-Hit-icon,
.DocSearch-Hit-action {
height: 20px;
width: 20px;
color: var(--docsearch-muted-color);
stroke-width: var(--docsearch-icon-stroke-width);
}
.DocSearch-Hit-icon {
height: 20px;
width: 20px;
}
.DocSearch-Hit-action {
height: 22px;
width: 22px;
}
.DocSearch-Hit-action svg{
width: 18px;
height: 18px;
display: block;
}
.DocSearch-Hit-action + .DocSearch-Hit-action {
margin-left: 5px;
margin-left: 6px;
}
.DocSearch-Hit-action-button {
@ -469,8 +483,22 @@ html[data-theme='dark'] {
background: none;
color: inherit;
border: none;
padding: 0;
padding: 2px;
cursor: pointer;
border-radius: 50%;
}
.DocSearch-Hit-action-button:hover {
transition: background-color .1s ease-in;
background: rgba(0,0,0,0.2);
}
.DocSearch-Hit-action-button:active {
transform: scale(1.2);
}
.DocSearch-Hit-action-button:hover path{
fill: white;
}
.DocSearch-Hit-content-wrapper {
@ -553,6 +581,7 @@ html[data-theme='dark'] {
.DocSearch-Commands {
display: none;
}
.DocSearch-Hit-Tree {
display: none;
}