mirror of
https://github.com/ankitects/anki.git
synced 2025-09-18 14:02:21 -04:00
Use tilted (filled and unfilled) sticky icons in the cards editor (#3825)
* Update icons.ts to include hollow and solid icons * Update icons.ts * Create sticky-pin-hollow.svg * Create sticky-pin-solid.svg * Update StickyBadge.svelte to reflect changed icons
This commit is contained in:
parent
7f8420255d
commit
8fc822a6e7
4 changed files with 16 additions and 7 deletions
|
@ -11,7 +11,8 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
|
|||
|
||||
import Badge from "$lib/components/Badge.svelte";
|
||||
import Icon from "$lib/components/Icon.svelte";
|
||||
import { stickyIcon } from "$lib/components/icons";
|
||||
import { stickyIconHollow } from "$lib/components/icons";
|
||||
import { stickyIconSolid } from "$lib/components/icons";
|
||||
|
||||
import { context as editorFieldContext } from "./EditorField.svelte";
|
||||
|
||||
|
@ -51,9 +52,12 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
|
|||
<Badge
|
||||
tooltip="{tr.editingToggleSticky()} ({getPlatformString(keyCombination)})"
|
||||
widthMultiplier={0.7}
|
||||
>
|
||||
<Icon icon={stickyIcon} />
|
||||
</Badge>
|
||||
></Badge>
|
||||
{#if active}
|
||||
<Icon icon={stickyIconSolid} />
|
||||
{:else}
|
||||
<Icon icon={stickyIconHollow} />
|
||||
{/if}
|
||||
</span>
|
||||
|
||||
<style lang="scss">
|
||||
|
|
1
ts/icons/sticky-pin-hollow.svg
Normal file
1
ts/icons/sticky-pin-hollow.svg
Normal file
|
@ -0,0 +1 @@
|
|||
<?xml version="1.0" encoding="iso-8859-1"?><!-- Adapted from https://www.svgrepo.com/svg/4879/push-pin License: CC0 --><svg fill="currentColor" height="11px" width="11px" version="1.1" id="sticky-pin-hollow" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 490.125 490.125" xml:space="preserve"><path d="M300.625,5.025c-6.7-6.7-17.6-6.7-24.3,0l-72.6,72.6c-6.7,6.7-6.7,17.6,0,24.3l16.3,16.3l-40.3,40.3l-63.5-7 c-3-0.3-6-0.5-8.9-0.5c-21.7,0-42.2,8.5-57.5,23.8l-20.8,20.8c-6.7,6.7-6.7,17.6,0,24.3l108.5,108.5l-132.4,132.4 c-6.7,6.7-6.7,17.6,0,24.3c3.3,3.3,7.7,5,12.1,5s8.8-1.7,12.1-5l132.5-132.5l108.5,108.5c3.3,3.3,7.7,5,12.1,5s8.8-1.7,12.1-5 l20.8-20.8c17.6-17.6,26.1-41.8,23.3-66.4l-7-63.5l40.3-40.3l16.2,16.2c6.7,6.7,17.6,6.7,24.3,0l72.6-72.6c3.2-3.2,5-7.6,5-12.1 s-1.8-8.9-5-12.1L300.625,5.025z M400.425,250.025l-16.2-16.3c-6.4-6.4-17.8-6.4-24.3,0l-58.2,58.3c-3.7,3.7-5.5,8.8-4.9,14 l7.9,71.6c1.6,14.3-3.3,28.3-13.5,38.4l-8.7,8.7l-217.1-217.1l8.7-8.6c10.1-10.1,24.2-15,38.4-13.5l71.7,7.9 c5.2,0.6,10.3-1.2,14-4.9l58.2-58.2c6.7-6.7,6.7-17.6,0-24.3l-16.3-16.3l48.3-48.3l160.3,160.3L400.425,250.025z"/></svg>
|
After Width: | Height: | Size: 1.1 KiB |
1
ts/icons/sticky-pin-solid.svg
Normal file
1
ts/icons/sticky-pin-solid.svg
Normal file
|
@ -0,0 +1 @@
|
|||
<?xml version="1.0" encoding="iso-8859-1"?><!-- Adapted from https://www.svgrepo.com/svg/4879/push-pin License: CC0 --><svg fill="currentColor" height="11px" width="11px" version="1.1" id="sticky-pin-solid" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 490.125 490.125" xml:space="preserve"><path d="M300.625,5.025c-6.7-6.7-17.6-6.7-24.3,0l-72.6,72.6c-6.7,6.7-6.7,17.6,0,24.3l16.3,16.3l-40.3,40.3l-63.5-7c-3-0.3-6-0.5-8.9-0.5c-21.7,0-42.2,8.5-57.5,23.8l-20.8,20.8c-6.7,6.7-6.7,17.6,0,24.3l108.5,108.5l-132.4,132.4c-6.7,6.7-6.7,17.6,0,24.3c3.3,3.3,7.7,5,12.1,5s8.8-1.7,12.1-5l132.5-132.5l108.5,108.5c3.3,3.3,7.7,5,12.1,5s8.8-1.7,12.1-5l20.8-20.8c17.6-17.6,26.1-41.8,23.3-66.4l-7-63.5l40.3-40.3l16.2,16.2c6.7,6.7,17.6,6.7,24.3,0l72.6-72.6c3.2-3.2,5-7.6,5-12.1s-1.8-8.9-5-12.1L300.625,5.025z"/></svg>
|
After Width: | Height: | Size: 843 B |
|
@ -111,8 +111,6 @@ import NewBox_ from "@mdi/svg/svg/new-box.svg?component";
|
|||
import newBox_ from "@mdi/svg/svg/new-box.svg?url";
|
||||
import Paperclip_ from "@mdi/svg/svg/paperclip.svg?component";
|
||||
import paperclip_ from "@mdi/svg/svg/paperclip.svg?url";
|
||||
import Sticky_ from "@mdi/svg/svg/pin-outline.svg?component";
|
||||
import sticky_ from "@mdi/svg/svg/pin-outline.svg?url";
|
||||
import RectangleOutline_ from "@mdi/svg/svg/rectangle-outline.svg?component";
|
||||
import rectangleOutline_ from "@mdi/svg/svg/rectangle-outline.svg?url";
|
||||
import Redo_ from "@mdi/svg/svg/redo.svg?component";
|
||||
|
@ -186,6 +184,10 @@ import underline_ from "bootstrap-icons/icons/type-underline.svg?url";
|
|||
|
||||
import IncrementCloze_ from "../../icons/contain-plus.svg?component";
|
||||
import incrementCloze_ from "../../icons/contain-plus.svg?url";
|
||||
import StickyHollow_ from "../../icons/sticky-pin-hollow.svg?component";
|
||||
import stickyHollow_ from "../../icons/sticky-pin-hollow.svg?url";
|
||||
import StickySolid_ from "../../icons/sticky-pin-solid.svg?component";
|
||||
import stickySolid_ from "../../icons/sticky-pin-solid.svg?url";
|
||||
|
||||
export const checkCircle = { url: checkCircle_, component: CheckCircle_ };
|
||||
export const chevronDown = { url: chevronDown_, component: ChevronDown_ };
|
||||
|
@ -210,7 +212,8 @@ export const alertIcon = { url: alert_, component: Alert_ };
|
|||
export const plainTextIcon = { url: plainText_, component: PlainText_ };
|
||||
export const clozeIcon = { url: cloze_, component: Cloze_ };
|
||||
export const richTextIcon = { url: richText_, component: RichText_ };
|
||||
export const stickyIcon = { url: sticky_, component: Sticky_ };
|
||||
export const stickyIconHollow = { url: stickyHollow_, component: StickyHollow_ };
|
||||
export const stickyIconSolid = { url: stickySolid_, component: StickySolid_ };
|
||||
export const mathIcon = { url: math_, component: Math_ };
|
||||
export const floatLeftIcon = { url: floatLeft_, component: FloatLeft_ };
|
||||
export const floatNoneIcon = { url: floatNone_, component: FloatNone_ };
|
||||
|
|
Loading…
Reference in a new issue