diff --git a/README.md b/README.md index 92d9663..0045663 100644 --- a/README.md +++ b/README.md @@ -1,35 +1,22 @@
+Usage Guidelines - +Site Credits - +Site Updates +
It's a barely accurate NIKKE Font generator! With a canvas and a dream, you can create anything you'd like! ---- - ## Building -You know the drill. - ``` npm i npm run dev ``` -The "meat" of the site is in `src\scripts`. `.astro` files are HTML files I *really* need to rewrite to be better. Styles are a mess. - -## Usage - -[Usage guidelines](https://skuqre.github.io/nikke-font-generator/usage/) - -It's been moved to the site for ease-of-access. - -## Credits - -[Up-to-date site credits](https://skuqre.github.io/nikke-font-generator/credits/) - -Example art: -- Top left ([onedoo on PIXIV](https://www.pixiv.net/en/users/3474388)):- Append - | -||
---|---|---|
- - | -- - | -- - | -
- - | -- - - | -|
- - - | -- - | - -|
- - | -||
- - | -- - | -- Edit - | -
- - | -- - | -- - | -
- - | -- - | -|
- - - | -- - | -|
- - | -- - | -|
- - | -- - | -- Profile - | -
- - | -||
- - | -||
- - - | -- - | -|
- - | -- - | -|
- - | -- - | -Background Sizing and Position (X, Y, and Scale) | -
- - - - | -- Chat - | -|
- - | -- - | -|
- - - | -- - - | -- - | -
- - - - | - - -||
- - | -- Choices - | -|
- - | -- Thought - | -|
- - | -- - | -Other | -
- - - | -- Export - | -|
- - | -||
- - | -- Delete / Reset - | -|
- - | -||
- - | -- - | -|
- - | -- - | -
more tools:
- - - - +@@ -35,13 +47,24 @@ div.toolbox { display: flex; margin: auto; - margin-top: 8px; + margin-top: 16px; + margin-bottom: 32px; justify-content: center; align-items: center; - gap: 16px; + flex-direction: column; + gap: 8px; } - img.pnglink { + div.toolbox > a { + display: flex; + align-items: center; + justify-content: center; + gap: 8px; + font-weight: bold; + color: white; + } + + div.toolbox > a { filter: hue-rotate(355deg); opacity: 0.5; scale: 1; @@ -50,12 +73,13 @@ transition: 0.2s ease-in-out; } - img.pnglink:hover { + div.toolbox > a:hover { filter: brightness(0) saturate(100%) grayscale(0) invert(82%) sepia(19%) saturate(1288%) hue-rotate(355deg) brightness(105%) contrast(91%); opacity: 1; scale: 1.1; transition-property: filter, opacity, scale; transition: 0.2s ease-in-out; + text-decoration: none; } \ No newline at end of file diff --git a/src/components/DialogDisplay.astro b/src/components/DialogDisplay.astro index b7bfc0b..b011d35 100644 --- a/src/components/DialogDisplay.astro +++ b/src/components/DialogDisplay.astro @@ -12,11 +12,32 @@ width: 100%; margin: 0; touch-action: none; + + position: sticky; + z-index: 1000; + + background-color: rgba(0, 0, 0, 0); + transition: background-color 0.2s ease-in-out; } canvas#dialogue-canvas { max-width: 90%; max-height: 540px; margin: auto; + + transition: max-height 0.2s ease-in-out; } - \ No newline at end of file + + + \ No newline at end of file diff --git a/src/components/DialogueInput.astro b/src/components/DialogueInput.astro index 372ef69..aebd377 100644 --- a/src/components/DialogueInput.astro +++ b/src/components/DialogueInput.astro @@ -2,444 +2,115 @@ --- - - -
- - | -- - | -- - | -
- - | -- - | -- Character - | -
---|---|---|
- - | -- Background - | -|
- - | -- Choices - | -|
- - | -- Action / Narration - | -|
- - | -- Dialogue Controls - | -|
- Control Type - - |
-
- - - |
- - Export See explanation - | -
- - | -||
- - | -||
- - | -- (ALPHA) Motion See explanation - | -|
- - | -- Frame Allowance - | -|
- - | - - -- Other - | - -|
- - | -||
- - | -||
- - | -||
- - | -||
- - | -||
- - | -- - | -- - | -
- - | -- - | -- - | -