koloml/furbooru-tagging-assistant
1
0
Fork 0
mirror of https://github.com/koloml/furbooru-tagging-assistant.git synced 2025-12-24 07:12:57 +00:00
Code Issues Activity

Reformatting the code using new editorconfig

Browse Source
This commit is contained in:
KoloMl
2024-03-23 03:13:39 +04:00
parent 659d9d4e73
commit fdb1ed913e
25 changed files with 326 additions and 322 deletions
Download Patch File Download Diff File Expand all files Collapse all files

22
src/components/layout/Footer.svelte
View File

@@ -1,19 +1,19 @@
<script>
import {version} from "$app/environment";
import {version} from "$app/environment";
</script>
<footer>
v{version}, made with ♥ by KoloMl.
v{version}, made with ♥ by KoloMl.
</footer>
<style lang="scss">
@use 'src/styles/colors';
@use 'src/styles/colors';
footer {
background: colors.$footer;
color: colors.$footer-text;
padding: 0 24px;
font-size: 12px;
line-height: 36px;
}
</style>
footer {
background: colors.$footer;
color: colors.$footer-text;
padding: 0 24px;
font-size: 12px;
line-height: 36px;
}
</style>

40
src/components/layout/Header.svelte
View File

@@ -1,28 +1,28 @@
<header>
<a href="/">Furbooru Tagging Assistant</a>
<a href="/">Furbooru Tagging Assistant</a>
</header>
<style lang="scss">
@use "src/styles/colors";
@use "src/styles/colors";
header {
background: colors.$header;
padding: 0 24px;
display: flex;
position: sticky;
top: 0;
left: 0;
right: 0;
header {
background: colors.$header;
padding: 0 24px;
display: flex;
position: sticky;
top: 0;
left: 0;
right: 0;
a {
color: colors.$text;
line-height: 36px;
padding: 0 12px;
margin-left: -12px;
a {
color: colors.$text;
line-height: 36px;
padding: 0 12px;
margin-left: -12px;
&:hover {
background: colors.$header-hover-background;
}
&:hover {
background: colors.$header-hover-background;
}
}
}
}
</style>
</style>

14
src/components/ui/forms/FormContainer.svelte
View File

@@ -1,11 +1,11 @@
<form>
<slot></slot>
<slot></slot>
</form>
<style lang="scss">
form {
display: grid;
grid-template-columns: 1fr;
gap: 6px;
}
</style>
form {
display: grid;
grid-template-columns: 1fr;
gap: 6px;
}
</style>

14
src/components/ui/forms/FormControl.svelte
View File

@@ -1,16 +1,16 @@
<script>
/** @type {string|undefined} */
export let label;
/** @type {string|undefined} */
export let label;
</script>
<label class="control">
{#if label}
<div class="label">{label}</div>
{/if}
<slot></slot>
{#if label}
<div class="label">{label}</div>
{/if}
<slot></slot>
</label>
<style lang="scss">
</style>
</style>

14
src/components/ui/forms/TextField.svelte
View File

@@ -1,12 +1,12 @@
<script>
/** @type {string|undefined} */
export let name = undefined;
/** @type {string|undefined} */
export let name = undefined;
/** @type {string|undefined} */
export let placeholder = undefined;
/** @type {string|undefined} */
export let placeholder = undefined;
/** @type {string} */
export let value = '';
/** @type {string} */
export let value = '';
</script>
<input type="text" {name} {placeholder} bind:value={value}>
<input type="text" {name} {placeholder} bind:value={value}>

62
src/components/ui/menu/Menu.svelte
View File

@@ -1,38 +1,38 @@
<nav>
<slot></slot>
<slot></slot>
</nav>
<style lang="scss">
@use 'src/styles/colors';
@use 'src/styles/colors';
nav {
display: flex;
flex-direction: column;
nav {
display: flex;
flex-direction: column;
& > :global(a) {
padding: 5px 24px;
& > :global(a) {
padding: 5px 24px;
}
:global(a) {
color: colors.$text;
&:hover {
background: colors.$header-mobile-link-hover;
}
}
:global(hr) {
background: colors.$block-border;
margin: .5em 24px;
border: 0;
height: 1px;
}
:global(main) > & {
margin: {
left: -24px;
right: -24px;
}
}
}
:global(a) {
color: colors.$text;
&:hover {
background: colors.$header-mobile-link-hover;
}
}
:global(hr) {
background: colors.$block-border;
margin: .5em 24px;
border: 0;
height: 1px;
}
:global(main) > & {
margin: {
left: -24px;
right: -24px;
}
}
}
</style>
</style>

58
src/components/ui/menu/MenuLink.svelte
View File

@@ -1,41 +1,41 @@
<script>
/**
* @type {string}
*/
export let href;
/**
* @type {string}
*/
export let href;
/**
* @type {"tag"|"paint-brush"|"arrow-left"|"info-circle"|"wrench"|"globe"|"plus"|null}
*/
export let icon = null;
/**
* @type {"tag"|"paint-brush"|"arrow-left"|"info-circle"|"wrench"|"globe"|"plus"|null}
*/
export let icon = null;
/**
* @type {"_blank"|"_self"|"_parent"|"_top"|undefined}
*/
export let target = undefined;
/**
* @type {"_blank"|"_self"|"_parent"|"_top"|undefined}
*/
export let target = undefined;
</script>
{#if href}
<a {href} {target} on:click>
{#if icon}
<i class="icon icon-{icon}"></i>
{/if}
<slot></slot>
</a>
<a {href} {target} on:click>
{#if icon}
<i class="icon icon-{icon}"></i>
{/if}
<slot></slot>
</a>
{/if}
<style lang="scss">
@use '../../../styles/colors';
@use '../../../styles/colors';
a {
display: flex;
align-items: center;
a {
display: flex;
align-items: center;
i {
width: 16px;
height: 16px;
background: colors.$text;
margin-right: 6px;
i {
width: 16px;
height: 16px;
background: colors.$text;
margin-right: 6px;
}
}
}
</style>
</style>

28
src/components/web-components/TagsEditor.svelte
View File

@@ -1,21 +1,21 @@
<script>
import "$lib/web-components/TagEditorComponent.js";
import "$lib/web-components/TagEditorComponent.js";
/**
* @type {string[]}
*/
export let tags = [];
/**
* @type {string[]}
*/
export let tags = [];
let tagsAttribute = tags.join(',');
let tagsAttribute = tags.join(',');
/**
* @param {CustomEvent<string[]>} event
*/
function onTagsChanged(event) {
tags = event.detail;
}
/**
* @param {CustomEvent<string[]>} event
*/
function onTagsChanged(event) {
tags = event.detail;
}
$: tagsAttribute = tags.join(',');
$: tagsAttribute = tags.join(',');
</script>
<tags-editor tags="{tagsAttribute}" on:change={onTagsChanged}></tags-editor>
<tags-editor tags="{tagsAttribute}" on:change={onTagsChanged}></tags-editor>