Initial commit

macx · Jul 15, 2022 · 9194bbf · 9194bbf
commit 9194bbf
Show file tree

Hide file tree

Showing 11 changed files with 550 additions and 0 deletions.
diff --git a/.gitignore b/.gitignore
@@ -0,0 +1,24 @@
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+lerna-debug.log*
+
+node_modules
+dist
+dist-ssr
+*.local
+
+# Editor directories and files
+.vscode/*
+!.vscode/extensions.json
+.idea
+.DS_Store
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?
diff --git a/README.md b/README.md
@@ -0,0 +1,3 @@
+# Vite Starterkit
+
+TBA
diff --git a/package.json b/package.json
@@ -0,0 +1,20 @@
+{
+  "name": "vite-starterkit",
+  "private": true,
+  "version": "0.0.1",
+  "type": "module",
+  "browserslist": [
+    "defaults"
+  ],
+  "scripts": {
+    "dev": "vite",
+    "build": "vite build",
+    "preview": "vite preview"
+  },
+  "devDependencies": {
+    "autoprefixer": "^10.4.7",
+    "sass": "^1.53.0",
+    "vite": "^3.0.0"
+  },
+  "dependencies": {}
+}
diff --git a/postcss.config.cjs b/postcss.config.cjs
@@ -0,0 +1,3 @@
+module.exports = {
+  plugins: [require('autoprefixer')],
+};
diff --git a/src/css/_presets.scss b/src/css/_presets.scss
@@ -0,0 +1,15 @@
+* {
+  box-sizing: border-box;
+}
+
+:root {
+  --spacing: 1.25rem;
+
+  --clr-bg: hsl(204, 15%, 94%);
+  --clr-text: hsl(0, 0%, 0%);
+
+  --font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,
+    Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji',
+    'Segoe UI Symbol';
+  --font-weight: 400;
+}
diff --git a/src/css/main.scss b/src/css/main.scss
@@ -0,0 +1,27 @@
+@use 'presets';
+
+body {
+  font-family: var(--font-family);
+  font-weight: var(--font-weight);
+  font-size: 1rem;
+  background-color: var(--clr-bg);
+  color: var(--clr-text);
+  margin: 0;
+}
+
+#app {
+}
+
+/*
+┌──────────────────────────────────┐
+  HEADER
+└──────────────────────────────────┘
+*/
+
+.header {
+  border-bottom: 1px solid var(--clr-line);
+}
+
+h1 {
+  margin: 0 0;
+}
diff --git a/src/images/vite-starterkit.svg b/src/images/vite-starterkit.svg
diff --git a/src/index.html b/src/index.html
@@ -0,0 +1,49 @@
+<!DOCTYPE html>
+<html lang="de">
+  <head>
+    <meta charset="UTF-8" />
+    <link rel="icon" type="image/svg+xml" href="/vite.svg" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Starterkit Vite</title>
+  </head>
+  <body>
+    <div id="app">
+      <header class="header">
+        <div class="logo"></div>
+
+        <div>Something</div>
+      </header>
+
+      <main>
+        <h1>Starterkit Vite</h1>
+
+        <p>
+          Lynda, first of all, I'm not your answering service. Second of all,
+          somebody named Greg or Craig called you just a little while ago. Look,
+          George, I'm telling you George, if you do not ask Lorraine to that
+          dance, I'm gonna regret it for the rest of my life. Who? Oh, uh, hey
+          you, get your damn hands off her. Do you really think I oughta swear?
+          Why do you keep following me around?
+        </p>
+
+        <p>
+          Please, Marty, don't tell me, no man should know too much about their
+          own destiny. What did you say? Children. I have to tell you about the
+          future. Whoa, they really cleaned this place up, looks brand new.
+        </p>
+
+        <p>
+          Lorraine, have you ever, uh, been in a situation where you know you
+          had to act a certain way but when you got there, you didn't know if
+          you could go through with it? Look, I'm just not ready to ask Lorraine
+          out to the dance, and not you, nor anybody else on this planet is
+          gonna make me change my mind. Erased from existence. Whoa, whoa, kid,
+          kid, stop, stop, stop, stop. I don't like her, Marty. Any girl who
+          calls a boy is just asking for trouble.
+        </p>
+      </main>
+    </div>
+
+    <script type="module" src="/main.js"></script>
+  </body>
+</html>
diff --git a/src/main.js b/src/main.js
@@ -0,0 +1,5 @@
+import './css/main.scss';
+
+import starterkitLogo from './images/vite-starterkit.svg';
+
+document.querySelector('.logo').innerHTML = `<img src="${starterkitLogo}">`;
diff --git a/vite.config.js b/vite.config.js
@@ -0,0 +1,12 @@
+import { defineConfig } from 'vite';
+
+export default defineConfig({
+  root: 'src',
+  server: {
+    open: true,
+  },
+  preview: {
+    port: 8080,
+    open: true,
+  },
+});