diff options
Diffstat (limited to 'apps/web-shared/src/components/theme-switcher-icon.svelte')
| -rw-r--r-- | apps/web-shared/src/components/theme-switcher-icon.svelte | 248 |
1 files changed, 0 insertions, 248 deletions
diff --git a/apps/web-shared/src/components/theme-switcher-icon.svelte b/apps/web-shared/src/components/theme-switcher-icon.svelte deleted file mode 100644 index 1531ab2..0000000 --- a/apps/web-shared/src/components/theme-switcher-icon.svelte +++ /dev/null @@ -1,248 +0,0 @@ -<script> - export let show = false; - export let selection = ""; -</script> - -<div class="ld-switch flex" - data-theme-switcher-element> - <button class="reset ld-switch-btn" - on:click={() => show =!show}> - <span class="sr-only">{selection}</span> - <div class="ld-switch-btn__icon-wrapper ld-switch-btn__icon-wrapper--in" - aria-hidden="true"> - {#if selection === "dark"} - <svg class="icon ld-switch-btn__icon" - viewBox="0 0 20 20"> - <title>dark</title> - <g fill="currentColor"> - <path d="M11.964 3.284c.021.237.036.474.036.716a8 8 0 0 1-8 8c-.242 0-.479-.015-.716-.036a7 7 0 1 0 8.68-8.68z" - fill-opacity=".2" - stroke="currentColor" - stroke-linecap="round" - stroke-linejoin="round" - stroke-width="2"></path> - <path d="M7 4a.979.979 0 0 1-1-1 1 1 0 0 0-2 0 .979.979 0 0 1-1 1 1 1 0 0 0 0 2 .979.979 0 0 1 1 1 1 1 0 0 0 2 0 .979.979 0 0 1 1-1 1 1 0 0 0 0-2z"></path> - </g> - </svg> - {:else if selection === "light"} - <svg class="icon ld-switch-btn__icon" - viewBox="0 0 20 20"><title>light</title> - <g fill="currentColor"> - <circle cx="10" - cy="10" - r="4" - fill-opacity=".2" - stroke="currentColor" - stroke-linecap="round" - stroke-linejoin="round" - stroke-width="2"></circle> - <path fill="none" - stroke="currentColor" - stroke-linecap="round" - stroke-linejoin="round" - stroke-width="2" - d="M10 1v1.5"></path> - <path fill="none" - stroke="currentColor" - stroke-linecap="round" - stroke-linejoin="round" - stroke-width="2" - d="M16.364 3.636l-1.061 1.061"></path> - <path fill="none" - stroke="currentColor" - stroke-linecap="round" - stroke-linejoin="round" - stroke-width="2" - d="M19 10h-1.5"></path> - <path fill="none" - stroke="currentColor" - stroke-linecap="round" - stroke-linejoin="round" - stroke-width="2" - d="M16.364 16.364l-1.061-1.061"></path> - <path fill="none" - stroke="currentColor" - stroke-linecap="round" - stroke-linejoin="round" - stroke-width="2" - d="M10 19v-1.5"></path> - <path fill="none" - stroke="currentColor" - stroke-linecap="round" - stroke-linejoin="round" - stroke-width="2" - d="M3.636 16.364l1.061-1.061"></path> - <path fill="none" - stroke="currentColor" - stroke-linecap="round" - stroke-linejoin="round" - stroke-width="2" - d="M1 10h1.5"></path> - <path fill="none" - stroke="currentColor" - stroke-linecap="round" - stroke-linejoin="round" - stroke-width="2" - d="M3.636 3.636l1.061 1.061"></path> - </g> - </svg> - {:else } - <svg class="icon ld-switch-btn__icon" - viewBox="0 0 20 20"><title>light-auto</title> - <g fill="currentColor"> - <path d="M10 14a4 4 0 1 1 3.465-6" - fill-opacity=".2" - stroke="currentColor" - stroke-linecap="round" - stroke-linejoin="round" - stroke-width="2"></path> - <path fill="none" - stroke="currentColor" - stroke-linecap="round" - stroke-linejoin="round" - stroke-width="2" - d="M12 18l2.5-7h1l2.5 7"></path> - <path fill="none" - stroke="currentColor" - stroke-linecap="round" - stroke-linejoin="round" - stroke-width="2" - d="M12.714 16h4.572"></path> - <path fill="none" - stroke="currentColor" - stroke-linecap="round" - stroke-linejoin="round" - stroke-width="2" - d="M10 1v1.5"></path> - <path fill="none" - stroke="currentColor" - stroke-linecap="round" - stroke-linejoin="round" - stroke-width="2" - d="M16.364 3.636l-1.061 1.061"></path> - <path fill="none" - stroke="currentColor" - stroke-linecap="round" - stroke-linejoin="round" - stroke-width="2" - d="M3.636 16.364l1.061-1.061"></path> - <path fill="none" - stroke="currentColor" - stroke-linecap="round" - stroke-linejoin="round" - stroke-width="2" - d="M1 10h1.5"></path> - <path fill="none" - stroke="currentColor" - stroke-linecap="round" - stroke-linejoin="round" - stroke-width="2" - d="M3.636 3.636l1.061 1.061"></path> - </g> - </svg> - {/if} - </div> - - <div class="ld-switch-btn__icon-wrapper js-ld-switch-icon" - aria-hidden="true"> - {#if selection === "dark"} - <svg class="icon ld-switch-btn__icon" - viewBox="0 0 20 20"> - <title>dark</title> - <g fill="currentColor"> - <path d="M11.964 3.284c.021.237.036.474.036.716a8 8 0 0 1-8 8c-.242 0-.479-.015-.716-.036a7 7 0 1 0 8.68-8.68z" - fill-opacity=".2" - stroke="currentColor" - stroke-linecap="round" - stroke-linejoin="round" - stroke-width="2"></path> - <path d="M7 4a.979.979 0 0 1-1-1 1 1 0 0 0-2 0 .979.979 0 0 1-1 1 1 1 0 0 0 0 2 .979.979 0 0 1 1 1 1 1 0 0 0 2 0 .979.979 0 0 1 1-1 1 1 0 0 0 0-2z"></path> - </g> - </svg> - {:else if selection === "light"} - <svg class="icon ld-switch-btn__icon" - viewBox="0 0 20 20"> - <title>light-auto</title> - <g fill="currentColor"> - <path d="M10 14a4 4 0 1 1 3.465-6" - fill-opacity=".2" - stroke="currentColor" - stroke-linecap="round" - stroke-linejoin="round" - stroke-width="2"></path> - <path fill="none" - stroke="currentColor" - stroke-linecap="round" - stroke-linejoin="round" - stroke-width="2" - d="M12 18l2.5-7h1l2.5 7"></path> - <path fill="none" - stroke="currentColor" - stroke-linecap="round" - stroke-linejoin="round" - stroke-width="2" - d="M12.714 16h4.572"></path> - <path fill="none" - stroke="currentColor" - stroke-linecap="round" - stroke-linejoin="round" - stroke-width="2" - d="M10 1v1.5"></path> - <path fill="none" - stroke="currentColor" - stroke-linecap="round" - stroke-linejoin="round" - stroke-width="2" - d="M16.364 3.636l-1.061 1.061"></path> - <path fill="none" - stroke="currentColor" - stroke-linecap="round" - stroke-linejoin="round" - stroke-width="2" - d="M3.636 16.364l1.061-1.061"></path> - <path fill="none" - stroke="currentColor" - stroke-linecap="round" - stroke-linejoin="round" - stroke-width="2" - d="M1 10h1.5"></path> - <path fill="none" - stroke="currentColor" - stroke-linecap="round" - stroke-linejoin="round" - stroke-width="2" - d="M3.636 3.636l1.061 1.061"></path> - </g> - </svg> - {:else } - <svg class="icon ld-switch-btn__icon" - viewBox="0 0 20 20"> - <title>dark-auto</title> - <g fill="currentColor"> - <path fill="none" - stroke="currentColor" - stroke-linecap="round" - stroke-linejoin="round" - stroke-width="2" - d="M12 18l2.5-7h1l2.5 7"></path> - <path fill="none" - stroke="currentColor" - stroke-linecap="round" - stroke-linejoin="round" - stroke-width="2" - d="M12.714 16h4.572"></path> - <path d="M12.146 10.159A2.5 2.5 0 0 1 14.5 8.5h1a2.5 2.5 0 0 1 1.412.441 7 7 0 0 0-4.948-5.657c.021.237.036.474.036.716a8 8 0 0 1-8 8c-.242 0-.479-.015-.716-.036a6.99 6.99 0 0 0 6.427 5.012z" - fill-opacity=".2"></path> - <path d="M16.71 8a7.015 7.015 0 0 0-4.746-4.716c.021.237.036.474.036.716a8 8 0 0 1-8 8c-.242 0-.479-.015-.716-.036A7.006 7.006 0 0 0 9 16.929" - fill="none" - stroke="currentColor" - stroke-linecap="round" - stroke-linejoin="round" - stroke-width="2"></path> - <path d="M7 4a.979.979 0 0 1-1-1 1 1 0 0 0-2 0 .979.979 0 0 1-1 1 1 1 0 0 0 0 2 .979.979 0 0 1 1 1 1 1 0 0 0 2 0 .979.979 0 0 1 1-1 1 1 0 0 0 0-2z"></path> - </g> - </svg> - {/if} - </div> - </button> -</div> |
