diff --git a/.browserslistrc b/.browserslistrc
index d6471a3..742eef8 100644
--- a/.browserslistrc
+++ b/.browserslistrc
@@ -1,2 +1,3 @@
-> 1%
+defaults
+>1% and not dead
last 2 versions
diff --git a/.eslintrc.cjs b/.eslintrc.cjs
new file mode 100644
index 0000000..451e368
--- /dev/null
+++ b/.eslintrc.cjs
@@ -0,0 +1,15 @@
+/* eslint-env node */
+require('@rushstack/eslint-patch/modern-module-resolution')
+
+module.exports = {
+ root: true,
+ extends: [
+ 'plugin:vue/vue3-essential',
+ 'eslint:recommended',
+ '@vue/eslint-config-typescript',
+ '@vue/eslint-config-prettier'
+ ],
+ parserOptions: {
+ ecmaVersion: 'latest'
+ }
+}
diff --git a/.eslintrc.js b/.eslintrc.js
deleted file mode 100644
index 3f3df4f..0000000
--- a/.eslintrc.js
+++ /dev/null
@@ -1,14 +0,0 @@
-module.exports = {
- root: true,
- env: {
- node: true
- },
- extends: ["plugin:vue/essential", "@vue/prettier"],
- rules: {
- "no-console": process.env.NODE_ENV === "production" ? "error" : "off",
- "no-debugger": process.env.NODE_ENV === "production" ? "error" : "off"
- },
- parserOptions: {
- parser: "babel-eslint"
- }
-};
diff --git a/.gitignore b/.gitignore
index a0dddc6..8ee54e8 100644
--- a/.gitignore
+++ b/.gitignore
@@ -1,21 +1,30 @@
-.DS_Store
-node_modules
-/dist
-
-# local env files
-.env.local
-.env.*.local
-
-# Log files
+# Logs
+logs
+*.log
npm-debug.log*
yarn-debug.log*
yarn-error.log*
+pnpm-debug.log*
+lerna-debug.log*
+
+node_modules
+.DS_Store
+dist
+dist-ssr
+coverage
+*.local
+
+/cypress/videos/
+/cypress/screenshots/
# Editor directories and files
+.vscode/*
+!.vscode/extensions.json
.idea
-.vscode
*.suo
*.ntvs*
*.njsproj
*.sln
*.sw?
+
+*.tsbuildinfo
diff --git a/.prettierrc.json b/.prettierrc.json
new file mode 100644
index 0000000..ecdf3e0
--- /dev/null
+++ b/.prettierrc.json
@@ -0,0 +1,8 @@
+{
+ "$schema": "https://json.schemastore.org/prettierrc",
+ "semi": false,
+ "tabWidth": 2,
+ "singleQuote": true,
+ "printWidth": 100,
+ "trailingComma": "none"
+}
diff --git a/.vscode/extensions.json b/.vscode/extensions.json
new file mode 100644
index 0000000..93ea3e7
--- /dev/null
+++ b/.vscode/extensions.json
@@ -0,0 +1,7 @@
+{
+ "recommendations": [
+ "Vue.volar",
+ "dbaeumer.vscode-eslint",
+ "esbenp.prettier-vscode"
+ ]
+}
diff --git a/README.md b/README.md
index 46590db..c69a151 100644
--- a/README.md
+++ b/README.md
@@ -1,24 +1,55 @@
-# sebin-reference
+# Sebin Reference Page
-## Project setup
-```
+The official reference page of Sebin Nyshkim, the anthro dragon.
+
+This page is primarily targeted at artists commissioned to draw Sebin. The idea is to have a single point of truth to easily point to.
+
+The benefit of this is two-fold:
+
+* Lack of attachments in Fur Affinity notes
+* Participating in art raffles on Twitter without cluttering up the media tab with the same image over and over again
+
+Furthermore, this page serves both for the development of Sebin as an independent character as well as a training ground for learning various new web technologies fitting such a project.
+
+## Recommended IDE Setup
+
+[VSCode](https://code.visualstudio.com/) + [Volar](https://marketplace.visualstudio.com/items?itemName=Vue.volar) (and disable Vetur) + [TypeScript Vue Plugin (Volar)](https://marketplace.visualstudio.com/items?itemName=Vue.vscode-typescript-vue-plugin).
+
+## Type Support for `.vue` Imports in TS
+
+TypeScript cannot handle type information for `.vue` imports by default, so we replace the `tsc` CLI with `vue-tsc` for type checking. In editors, we need [TypeScript Vue Plugin (Volar)](https://marketplace.visualstudio.com/items?itemName=Vue.vscode-typescript-vue-plugin) to make the TypeScript language service aware of `.vue` types.
+
+If the standalone TypeScript plugin doesn't feel fast enough to you, Volar has also implemented a [Take Over Mode](https://github.com/johnsoncodehk/volar/discussions/471#discussioncomment-1361669) that is more performant. You can enable it by the following steps:
+
+1. Disable the built-in TypeScript Extension
+ 1) Run `Extensions: Show Built-in Extensions` from VSCode's command palette
+ 2) Find `TypeScript and JavaScript Language Features`, right click and select `Disable (Workspace)`
+2. Reload the VSCode window by running `Developer: Reload Window` from the command palette.
+
+## Customize configuration
+
+See [Vite Configuration Reference](https://vitejs.dev/config/).
+
+## Project Setup
+
+```sh
npm install
```
-### Compiles and hot-reloads for development
-```
-npm run serve
+### Compile and Hot-Reload for Development
+
+```sh
+npm run dev
```
-### Compiles and minifies for production
-```
+### Type-Check, Compile and Minify for Production
+
+```sh
npm run build
```
-### Lints and fixes files
-```
+### Lint with [ESLint](https://eslint.org/)
+
+```sh
npm run lint
```
-
-### Customize configuration
-See [Configuration Reference](https://cli.vuejs.org/config/).
diff --git a/Sebin.md b/Sebin.md
index bc0a81e..e0c51dc 100644
--- a/Sebin.md
+++ b/Sebin.md
@@ -102,7 +102,7 @@ Since Sebin is a fire dragon thereβs a myriad of abilities he has at his dispo
Sebin can enter an Overdrive Form which greatly increases his strength and abilities but it comes at a cost.
-He enters Overdrive by engulfing himself in a pillar of flames which transforms his exterior physique. During Overdrive transformation his hair ignites and flickers with blue flames. The corners of his eyes flicker with with long green flames. His arms and legs become [3/4 carbon black and are crossed by several glowing veins which pulsate like flowing lava](https://www.furaffinity.net/view/31065788/). Fire in this form burns several degrees hotter than usual because his body becomes a living blast furnace, which is why his limbs have to be of more fire-proof material to withstand the increased heat.
+He enters Overdrive by engulfing himself in a pillar of flames which transforms his exterior physique. During Overdrive transformation his hair ignites and flickers with blue flames. The corners of his eyes flicker with long green flames. His arms and legs become part carbon black and are crossed by several glowing veins which pulsate like flowing lava. Fire in this form burns several degrees hotter than usual because his body becomes a living blast furnace, which is why his limbs have to be of more fire-proof material to withstand the increased heat.
To complete the transformation he inhales the flames from the pillar surrounding him which heats up his body from within. Even if Sebin is a fire dragon who can sustain high degrees of heat he is essentially overheating himself from the inside. Because of this he can't maintain this form for more than a few hours before he does permanent damage to his own body.
diff --git a/babel.config.js b/babel.config.js
deleted file mode 100644
index 397abca..0000000
--- a/babel.config.js
+++ /dev/null
@@ -1,3 +0,0 @@
-module.exports = {
- presets: ["@vue/cli-plugin-babel/preset"]
-};
diff --git a/card/header/furaffinity/index.html b/card/header/furaffinity/index.html
new file mode 100644
index 0000000..ec55122
--- /dev/null
+++ b/card/header/furaffinity/index.html
@@ -0,0 +1,44 @@
+
+
+
+ Since Sebin is a fire dragon there's a myriad of abilities he has at his disposal to defend
+ himself.
+
+
+
+
+
Attacks
+
+
+
+
+
+
+
+
+
+
+
+
+ Fire Breath
+
+ Like most fire dragons, Sebin can breathe fire. In order to do this, he takes a deep breath
+ to enrich the oxygen in his lungs with gases, which, together with special glands in his
+ mouth, produce a combustible mixture. The resulting jet of fire, reaching several hundred
+ degrees Celsius, spreads out on its way to its target, scorching everything in its path.
+
+
+
+
+
+
+
+
+
+
+
+
+ Flame Toss
+
+ By spitting fire into his hands, Sebin can form it into a ball and use it as a projectile.
+ His scales are fireproof and can withstand the high temperatures. Due to their high
+ concentration, the projectiles explode upon impact. By combining two fireballs the explosion
+ radius increases dramatically.
+
+
+
+
+
+
+
+
+
+
+
+
+ Kindled Fist
+
+ Apart from throwing projectiles, Sebin can also use the fireballs to wrap his fists in fire.
+ This allows him to inflict severe burns on his opponent with each blow. In addition, he can
+ release the fire from his fists with aimed blows and hurl it at his opponents.
+
+
+
+
+
+
+
+
+
+
+
+
+ Burning Twister
+
+ A technique used in aerial combat, Sebin uses his fire breath to engulf his body in flames
+ while spinning to become a fire tornado that singes opponents.
+
+
+
+
+
+
diff --git a/src/views/AnatomyView.vue b/src/views/AnatomyView.vue
new file mode 100644
index 0000000..a1a6588
--- /dev/null
+++ b/src/views/AnatomyView.vue
@@ -0,0 +1,842 @@
+
+
+
+
+
Yellow scales under chin, torso, underside of tail
+
Athletic to body builder physique
+
Sharp, black claws on fingers and toes
+
Brown blunt spikes running over back and top-side of tail
+
Tail about {{ tailLength / 100 }} meter ({{ toImperial(tailLength) }}) in length
+
+
+
+
+ As the offspring of a union between human and dragon, Sebin is a bipedal plantigrade. The
+ majority of his body is covered in red scales. A strip of yellow scales runs from the
+ underside of his jaw, extending down his chest through his legs to the underside of the tip of
+ his tail. The scales on his chest are characterized by a special toughness to better protect
+ vital organs. He also has an athletic to muscular physique that he continuously tends to keep
+ in shape. Finger and toe tips are armed with sharp, black claws, which serve him equally as
+ tools and weapons. Brown spines run from head to spine to tip of tail, though they are too
+ blunt to pose a risk of injury. His tail is about
+ {{ tailLength / 100 }} meters ({{ toImperial(tailLength) }}) in length.
+
+ Sebin's wings have a span of about {{ wingspan / 100 }} meters ({{ toImperial(wingspan) }}).
+ They function very much like a second pair of arms: two interconnected limbs that form a
+ bendable arm, at the end of which sits a hand-like structure, adorned with a talon in exchange
+ for a thumb, with a sturdy membrane stretched between its long fingers. On solid ground, he
+ keeps his wings closed so as not to accidentally bump into anything with them. Sebin also pays
+ a lot of attention to his wings when working out, so that they can keep carrying him reliably
+ through the air. Though, he only travels short to medium distances through the air before he
+ has to take a rest - as long as the airspace in the area has been declared open for wing
+ bearers.
+
+ Despite what one might expect with reptilians, Sebin's pupils are rounded instead of
+ slit-shaped. Yellow spikes running above his eyelids serve as eyebrows. These spikes are also
+ found along his jaw bone. Two pointed, slightly curved, black horns protrude from his head. He
+ usually wears his medium-length, blue hair loose. His long, pointed ears are very flexible,
+ allowing him to hear sounds around him without having to turn his head. They are also used for
+ non-verbal communication, to express emotions through body language. His hearing perceives a
+ wider range of frequencies, making it superior to that of a human. His jaws are equipped with
+ razor-sharp teeth that effortlessly sink into anything he manages to bite, be it nourishment
+ or adversaries. Embedded between them lies his tongue, which is typically pointed for
+ reptilians. Glands in his throat produce a mixture which he uses to spit fire, which can reach
+ up to around 100 Β°C ({{ toFahrenheit(100) }} Β°F).
+
+
+
+
+
Upper Body
+
+
+
+
Strong upper body
+
Big pecs
+
Defined abs
+
Black nipples
+
+ Any muscle mass from athletic to body builder is fine, with a preference towards body
+ builder
+
+
+
+
+
+ At the age of 17, Sebin gradually began to keep his body in shape on a regular basis. His
+ favorite exercises include weightlifting (with both dumbbells and barbells), lat pulldown, leg
+ press and cable curls. He works out three days a week with one day off between training days,
+ rotating the body regions he trains each day.
+
+ Sebin is very concerned with an even distribution of muscle mass, but pays particular
+ attention to his back, chest and arms. A strong chest with strong arms helps to throw fire
+ projectiles as far as possible. A strong back guarantees a longer stay in the air.
+
Extends from sheath when erect, lives inside sheath when not erect
+
External balls
+
+
+
+
+ Despite his reptilian appearance, Sebin has nipples, a feature of the human side of his
+ family. Furthermore, his external testicles represent another humanized feature. Where
+ relatives of his ilk possess a slit in which the penis lies protectively, Sebin possesses a
+ pouch-like sheath from which the tip of the penis protrudes slightly. The shape of his shaft
+ is predominantly humanoid, but it is surrounded by ridges and has no equivalent of a
+ foreskin. When aroused, the coal-black shaft swells and pushes out of the sheath until fully
+ erect, the sheath wrapping around the root of the shaft like a ring. However, he can also
+ push it out in a flaccid state, e.g. when needing to pass water.
+
+
+
+
+
+
+
But, wait! There's more...
+
+
+ Sebin like you haven't seen him yet! Flip the switch to reveal his naughty secrets. If you
+ dare...! Don't say I didn't warn you!!
+
+ Sebin is a warm-hearted guy who cares a lot about the well-being of his loved ones. Bad vibes
+ rarely escape him and he offers his help without hesitation. He also won't avoid difficult
+ conversations in the process. Not being able to help a friend in need is synonymous with
+ failing them, a realization that can leave him feeling uneasy long after the fact.
+
+
+
+ At the same time, he is very open and honest about his feelings. He does not mince words and
+ finds clear words when speaking his mind. Unfortunately, Sebin sometimes forgets his good
+ manners in the heat of the moment, once he gets invested into a quarrel β especially when it
+ comes to topics that are near and dear to his heart. Anyone looking to have a bad time can try
+ their luck at pissing him off even once. This includes an equally vulgar vocabulary. It is not
+ uncommon to hear him swear.
+
+
+
+ Nevertheless, Sebin strives to put his best foot forward at all times. He is of the sociable
+ type and likes to laugh a lot, as he is easily amused. Sometimes to a degree where it can
+ become very childish and immature very quickly.
+
+
+
+ Physical strength is not the only thing that plays a big role for Sebin. He is of a firm
+ believe that a healthy body must also have a healthy mind in order to find a balance. But he
+ only came to this realization at the end of a rocky road. While a setback in the past could
+ easily throw him off track, today he stands much more firmly in life. Not only for his own
+ sake, but also to be a kind of anchor for others. He always keeps his cool, so he can be a
+ tower of strenth for others.
+
+
+
+
+
Hobbies
+
+
+
+
+ {{ hobby }}
+
+
+
+
+
+ Sebin is passionate about his hobbies. If he notices even the smallest spark of interest in
+ his hobbies you should bring a lot of time, as he will chew your ear off first. Patience is
+ known to be a virtue β one unknown to this dragon.
+
+
+
+ When he indulges in his hobbies, he does so with devotion. Every move has to be right and
+ everything has to be in perfect harmony. Once he is in his flow, he must not be disturbed,
+ otherwise he can sometimes become quite eccentric in expressing his dismay of being disrupted,
+ possibly losing a very important train of thought.
+
+
+
+
+
Food & Drink
+
+
+
+
sweets
+
savory food
+
spicy food
+
coffee
+
beer
+
cocktails
+
cheese
+
sausage
+
pancakes
+
chicken
+
beef
+
spaghetti/pasta
+
+
+
+
+ Sebin's day starts with a strong cup of black coffee and sandwiches. He's also a massive sweet
+ tooth which sounds like a big detriment to his fitness routine. That's because it is and it's
+ often very hard for him to resist.
+
+
+
+ Besides snacking, Sebin also likes to eat hearty and savory things. He doesn't disdain a
+ cheese platter with a wide selection, nor a medium-rare steak.
+
+
+
+ Sebin rarely says no to a good beer with friends, just as he rarely says no to a bar tour to
+ try new and interesting cocktails.
+
+
+
+
+
+
Sexual Preferences
+
+
+
+
+
+
Supremely horny
+
Confident, knows what he's got
+
Dominant lover, likes it rough but is no brute
+
Service top
+
Depending on partner also bottoms
+
Likes to wear bottomless undies, esp. jockstraps
+
Enjoys the attention from flaunting
+
+
+
+
+ But above all Sebin is a very naughty hornball. He knows what he's got and he's not afraid
+ to flaunt it. He is a generally dominant lover who likes to have it rough. But he is not
+ lacking in tenderness. He considers himself somewhat of a "service top", who doesn't only
+ have his own fun in mind. His job is only done if he's benn able to satisfy. However, that
+ doesn't mean that he doesn't let others have their fun with him too from time to time. It
+ always depends on his playmates, which makes him effectively a switch. He loves to wear
+ bottomless jockstraps and boxer briefs to direct the attention of onlookers exactly where he
+ wants it. After all he is well endowed enough to peddle it around.
+
On this page your can learn all about Sebin, your friendly neighborhood dragon!
+
+
+ I started this page to have a single point of truth with all the info artists I commission can
+ possibly need. If you're missing some crucial info, or you would like to give me some general
+ feedback about this page, feel free to reach out!
+
+
+
+
+
+
+
+
+
+
+ Note: This page is still under heavy construction, as indicated by the 0.x.x
+ version number in the footer. I'm continously updating the site and adding details and
+ information to it. In case you run into something weird, definitely let me know!
+
+
+
Complete Ref Sheet
+
+ Just here to fetch the ref sheet? Click the button with the ref sheet you need and get
+ started!
+
+ Sebin can enter an Overdrive Form which greatly increases his strength and abilities but it
+ comes at a cost.
+
+
+
+ He enters Overdrive by engulfing himself in a pillar of flames which transforms his exterior
+ physique. During Overdrive transformation his hair ignites and flickers with blue flames. The
+ corners of his eyes flicker with long green flames. His arms and legs become part carbon black
+ and are crossed by several glowing veins which pulsate like flowing lava. Fire in this form
+ burns several degrees hotter than usual because his body becomes a living blast furnace, which
+ is why his limbs have to be of more fire-proof material to withstand the increased heat.
+
+
+
+ To complete the transformation he inhales the flames from the pillar surrounding him which
+ heats up his body from within. Even if Sebin is a fire dragon who can sustain high degrees of
+ heat he is essentially overheating himself from the inside. Because of this he can't maintain
+ this form for more than a few hours before he does permanent damage to his own body.
+
+
+
+ Direct body contact with Sebin during overdrive causes 3rd degree burns as he emits an extreme
+ temperature, although less than he keeps inside his body. His immediate surroundings are
+ likely to burn or melt.
+
+
+
Attacks
+
+
+
+
+
Name
+
Description
+
+
+
+
+
Fire Breath (improved)
+
+ The reach of Sebin's Fire Breath increases as well as the frequency at which he can fire
+ shots from his mouth.
+
+
+
+
Flame Toss (improved)
+
+ Overdrive Form eliminates the need for Sebin to spit fire into his palms. It instead
+ enables him to fire the shots directly from the palm palm of his hands, as the firey
+ veins crossing his arms act as an orifice to do so. The explosion radius of the burning
+ projectiles that explode on impact is greatly increased.
+
+
+
+
Kindled Fist (improved)
+
+ As his arms and legs are infused with fire his punches and kicks exert trails of flames
+ while doing so. Landing a punch or kick sears enemies.
+
+
+
+
Searing Discus
+
+ Overdrive allows Sebin to form rings of fire by igniting flames from his fingertips and
+ swirling them in a circle motion. He can use them for both close quarters or ranged
+ combat.
+
+
+
+
Combustion Flare
+
+ Clinking both of his wrists against each other like flints unleashes a devestating fire
+ blast from both of his fire-infused hands. A secure foothold is needed to prevent Sebin
+ from being thrown back by the recoil of the attack. Using this technique in the air is
+ therefore highly risky.
+
+
+
+
Blazing Pandemonium
+
+ A heavy impact into the ground from a great height with both fists, tearing deep cracks
+ in the ground around the impact crater. Combined with
+ Kindled Fist
+ the heat in Sebin's arms are forced through the newly created furrows, transforming the
+ scene into an inferno.
+
+
+
+
Scorching Edge
+
+ A fiery blade towering several meters into the air that Sebin sends careening towards
+ his enemies from his fire-infused legs with a backflip kick, leaving a swath of
+ destruction in its wake. Upon impact the force of the attack is distributed sideways.
+
+
+
+
Circling Fire Shield
+
+ A rather defensive technique. By spinning around with stretched out arms Sebin creates
+ fire balls, which he usually hurls towards enemies, that circle around his body
+ diagonally. They act as a shield while he can still move his arms relatively freely.
+ Enemies would be well advised to keep their distance to this spinning shield, as the
+ fire balls will still explode on contact.
+