Lev
2 years ago
commit
bbc18c8cc8
28 changed files with 5025 additions and 0 deletions
@ -0,0 +1,23 @@
|
||||
# See https://help.github.com/articles/ignoring-files/ for more about ignoring files. |
||||
|
||||
# dependencies |
||||
/node_modules |
||||
/.pnp |
||||
.pnp.js |
||||
|
||||
# testing |
||||
/coverage |
||||
|
||||
# production |
||||
/build |
||||
|
||||
# misc |
||||
.DS_Store |
||||
.env.local |
||||
.env.development.local |
||||
.env.test.local |
||||
.env.production.local |
||||
|
||||
npm-debug.log* |
||||
yarn-debug.log* |
||||
yarn-error.log* |
@ -0,0 +1,12 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?> |
||||
<module type="WEB_MODULE" version="4"> |
||||
<component name="NewModuleRootManager"> |
||||
<content url="file://$MODULE_DIR$"> |
||||
<excludeFolder url="file://$MODULE_DIR$/temp" /> |
||||
<excludeFolder url="file://$MODULE_DIR$/.tmp" /> |
||||
<excludeFolder url="file://$MODULE_DIR$/tmp" /> |
||||
</content> |
||||
<orderEntry type="inheritedJdk" /> |
||||
<orderEntry type="sourceFolder" forTests="false" /> |
||||
</component> |
||||
</module> |
@ -0,0 +1,8 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?> |
||||
<project version="4"> |
||||
<component name="ProjectModuleManager"> |
||||
<modules> |
||||
<module fileurl="file://$PROJECT_DIR$/.idea/frontend.iml" filepath="$PROJECT_DIR$/.idea/frontend.iml" /> |
||||
</modules> |
||||
</component> |
||||
</project> |
@ -0,0 +1,6 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?> |
||||
<project version="4"> |
||||
<component name="VcsDirectoryMappings"> |
||||
<mapping directory="$PROJECT_DIR$" vcs="Git" /> |
||||
</component> |
||||
</project> |
@ -0,0 +1,101 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?> |
||||
<project version="4"> |
||||
<component name="ChangeListManager"> |
||||
<list default="true" id="ddb8afd5-d3ba-47b1-b6d0-227403f1abf7" name="Changes" comment=""> |
||||
<change afterPath="$PROJECT_DIR$/.gitignore" afterDir="false" /> |
||||
<change afterPath="$PROJECT_DIR$/.idea/modules.xml" afterDir="false" /> |
||||
<change afterPath="$PROJECT_DIR$/.idea/vcs.xml" afterDir="false" /> |
||||
<change afterPath="$PROJECT_DIR$/.idea/workspace.xml" afterDir="false" /> |
||||
<change afterPath="$PROJECT_DIR$/README.md" afterDir="false" /> |
||||
<change afterPath="$PROJECT_DIR$/env.d.ts" afterDir="false" /> |
||||
<change afterPath="$PROJECT_DIR$/index.html" afterDir="false" /> |
||||
<change afterPath="$PROJECT_DIR$/package-lock.json" afterDir="false" /> |
||||
<change afterPath="$PROJECT_DIR$/package.json" afterDir="false" /> |
||||
<change afterPath="$PROJECT_DIR$/public/favicon.ico" afterDir="false" /> |
||||
<change afterPath="$PROJECT_DIR$/src/App.vue" afterDir="false" /> |
||||
<change afterPath="$PROJECT_DIR$/src/assets/base.css" afterDir="false" /> |
||||
<change afterPath="$PROJECT_DIR$/src/assets/logo.svg" afterDir="false" /> |
||||
<change afterPath="$PROJECT_DIR$/src/assets/main.css" afterDir="false" /> |
||||
<change afterPath="$PROJECT_DIR$/src/components/Header.vue" afterDir="false" /> |
||||
<change afterPath="$PROJECT_DIR$/src/components/TheWelcome.vue" afterDir="false" /> |
||||
<change afterPath="$PROJECT_DIR$/src/main.ts" afterDir="false" /> |
||||
<change afterPath="$PROJECT_DIR$/src/router/index.ts" afterDir="false" /> |
||||
<change afterPath="$PROJECT_DIR$/src/views/Landing.vue" afterDir="false" /> |
||||
<change afterPath="$PROJECT_DIR$/tailwind.config.js" afterDir="false" /> |
||||
<change afterPath="$PROJECT_DIR$/tsconfig.config.json" afterDir="false" /> |
||||
<change afterPath="$PROJECT_DIR$/tsconfig.json" afterDir="false" /> |
||||
<change afterPath="$PROJECT_DIR$/vite.config.ts" afterDir="false" /> |
||||
</list> |
||||
<option name="SHOW_DIALOG" value="false" /> |
||||
<option name="HIGHLIGHT_CONFLICTS" value="true" /> |
||||
<option name="HIGHLIGHT_NON_ACTIVE_CHANGELIST" value="false" /> |
||||
<option name="LAST_RESOLUTION" value="IGNORE" /> |
||||
</component> |
||||
<component name="FileTemplateManagerImpl"> |
||||
<option name="RECENT_TEMPLATES"> |
||||
<list> |
||||
<option value="Vue Single File Component" /> |
||||
</list> |
||||
</option> |
||||
</component> |
||||
<component name="Git.Settings"> |
||||
<option name="RECENT_GIT_ROOT_PATH" value="$PROJECT_DIR$" /> |
||||
</component> |
||||
<component name="MarkdownSettingsMigration"> |
||||
<option name="stateVersion" value="1" /> |
||||
</component> |
||||
<component name="ProjectId" id="2IoEN3itUjwell4xJk5JfAfTqN5" /> |
||||
<component name="ProjectViewState"> |
||||
<option name="hideEmptyMiddlePackages" value="true" /> |
||||
<option name="showLibraryContents" value="true" /> |
||||
</component> |
||||
<component name="PropertiesComponent"><![CDATA[{ |
||||
"keyToString": { |
||||
"RunOnceActivity.OpenProjectViewOnStart": "true", |
||||
"RunOnceActivity.ShowReadmeOnStart": "true", |
||||
"WebServerToolWindowFactoryState": "false", |
||||
"last_opened_file_path": "/home/ennucore/dev/agorata/frontend", |
||||
"nodejs_package_manager_path": "npm", |
||||
"ts.external.directory.path": "/home/ennucore/dev/agorata/frontend/node_modules/typescript/lib", |
||||
"vue.rearranger.settings.migration": "true" |
||||
} |
||||
}]]></component> |
||||
<component name="RunManager"> |
||||
<configuration name="dev" type="js.build_tools.npm" nameIsGenerated="true"> |
||||
<package-json value="$PROJECT_DIR$/package.json" /> |
||||
<command value="run" /> |
||||
<scripts> |
||||
<script value="dev" /> |
||||
</scripts> |
||||
<node-interpreter value="project" /> |
||||
<envs /> |
||||
<method v="2" /> |
||||
</configuration> |
||||
</component> |
||||
<component name="SpellCheckerSettings" RuntimeDictionaries="0" Folders="0" CustomDictionaries="0" DefaultDictionary="application-level" UseSingleDictionary="true" transferred="true" /> |
||||
<component name="TaskManager"> |
||||
<task active="true" id="Default" summary="Default task"> |
||||
<changelist id="ddb8afd5-d3ba-47b1-b6d0-227403f1abf7" name="Changes" comment="" /> |
||||
<created>1670839492682</created> |
||||
<option name="number" value="Default" /> |
||||
<option name="presentableId" value="Default" /> |
||||
<updated>1670839492682</updated> |
||||
<workItem from="1670839496719" duration="2515000" /> |
||||
</task> |
||||
<servers /> |
||||
</component> |
||||
<component name="TypeScriptGeneratedFilesManager"> |
||||
<option name="version" value="3" /> |
||||
</component> |
||||
<component name="Vcs.Log.Tabs.Properties"> |
||||
<option name="TAB_STATES"> |
||||
<map> |
||||
<entry key="MAIN"> |
||||
<value> |
||||
<State /> |
||||
</value> |
||||
</entry> |
||||
</map> |
||||
</option> |
||||
</component> |
||||
</project> |
@ -0,0 +1,40 @@
|
||||
# agorata |
||||
|
||||
This template should help get you started developing with Vue 3 in Vite. |
||||
|
||||
## 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 |
||||
``` |
||||
|
||||
### Compile and Hot-Reload for Development |
||||
|
||||
```sh |
||||
npm run dev |
||||
``` |
||||
|
||||
### Type-Check, Compile and Minify for Production |
||||
|
||||
```sh |
||||
npm run build |
||||
``` |
@ -0,0 +1,27 @@
|
||||
<!DOCTYPE html> |
||||
<html lang="en"> |
||||
<head> |
||||
<meta charset="UTF-8"> |
||||
<link rel="icon" href="/favicon.png"> |
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0"> |
||||
<link rel="stylesheet" |
||||
href="https://fonts.googleapis.com/css?family=Raleway"> |
||||
<title>Agorata</title> |
||||
</head> |
||||
<body> |
||||
<div id="app"></div> |
||||
<script type="module" src="/src/main.ts"></script> |
||||
|
||||
</body> |
||||
<style> |
||||
body { |
||||
margin: 0; |
||||
padding: 0; |
||||
font-family: 'Raleway', serif; |
||||
font-size: 1.5rem; |
||||
} |
||||
html { |
||||
padding: 0; |
||||
} |
||||
</style> |
||||
</html> |
@ -0,0 +1,27 @@
|
||||
{ |
||||
"name": "agorata", |
||||
"version": "0.0.0", |
||||
"private": true, |
||||
"scripts": { |
||||
"dev": "vite", |
||||
"build": "run-p type-check build-only", |
||||
"preview": "vite preview", |
||||
"build-only": "vite build", |
||||
"type-check": "vue-tsc --noEmit" |
||||
}, |
||||
"dependencies": { |
||||
"sass": "^1.56.2", |
||||
"vue": "^3.2.45", |
||||
"vue-router": "^4.1.6" |
||||
}, |
||||
"devDependencies": { |
||||
"@types/node": "^18.11.12", |
||||
"@vitejs/plugin-vue": "^4.0.0", |
||||
"@vue/tsconfig": "^0.1.3", |
||||
"npm-run-all": "^4.1.5", |
||||
"tailwindcss": "^3.2.4", |
||||
"typescript": "~4.7.4", |
||||
"vite": "^4.0.0", |
||||
"vue-tsc": "^1.0.12" |
||||
} |
||||
} |
After Width: | Height: | Size: 4.2 KiB |
After Width: | Height: | Size: 138 KiB |
@ -0,0 +1,16 @@
|
||||
<script setup lang="ts"> |
||||
import { RouterLink, RouterView } from 'vue-router' |
||||
</script> |
||||
|
||||
<template> |
||||
<RouterView /> |
||||
</template> |
||||
|
||||
<style> |
||||
body { |
||||
margin: 0; |
||||
padding: 0; |
||||
font-family: 'Raleway',serif; |
||||
font-size: 1.5rem; |
||||
} |
||||
</style> |
@ -0,0 +1,74 @@
|
||||
/* color palette from <https://github.com/vuejs/theme> */ |
||||
:root { |
||||
--vt-c-white: #ffffff; |
||||
--vt-c-white-soft: #f8f8f8; |
||||
--vt-c-white-mute: #f2f2f2; |
||||
|
||||
--vt-c-black: #181818; |
||||
--vt-c-black-soft: #222222; |
||||
--vt-c-black-mute: #282828; |
||||
|
||||
--vt-c-indigo: #2c3e50; |
||||
|
||||
--vt-c-divider-light-1: rgba(60, 60, 60, 0.29); |
||||
--vt-c-divider-light-2: rgba(60, 60, 60, 0.12); |
||||
--vt-c-divider-dark-1: rgba(84, 84, 84, 0.65); |
||||
--vt-c-divider-dark-2: rgba(84, 84, 84, 0.48); |
||||
|
||||
--vt-c-text-light-1: var(--vt-c-indigo); |
||||
--vt-c-text-light-2: rgba(60, 60, 60, 0.66); |
||||
--vt-c-text-dark-1: var(--vt-c-white); |
||||
--vt-c-text-dark-2: rgba(235, 235, 235, 0.64); |
||||
} |
||||
|
||||
/* semantic color variables for this project */ |
||||
:root { |
||||
--color-background: var(--vt-c-white); |
||||
--color-background-soft: var(--vt-c-white-soft); |
||||
--color-background-mute: var(--vt-c-white-mute); |
||||
|
||||
--color-border: var(--vt-c-divider-light-2); |
||||
--color-border-hover: var(--vt-c-divider-light-1); |
||||
|
||||
--color-heading: var(--vt-c-text-light-1); |
||||
--color-text: var(--vt-c-text-light-1); |
||||
|
||||
--section-gap: 160px; |
||||
} |
||||
|
||||
@media (prefers-color-scheme: dark) { |
||||
:root { |
||||
--color-background: var(--vt-c-black); |
||||
--color-background-soft: var(--vt-c-black-soft); |
||||
--color-background-mute: var(--vt-c-black-mute); |
||||
|
||||
--color-border: var(--vt-c-divider-dark-2); |
||||
--color-border-hover: var(--vt-c-divider-dark-1); |
||||
|
||||
--color-heading: var(--vt-c-text-dark-1); |
||||
--color-text: var(--vt-c-text-dark-2); |
||||
} |
||||
} |
||||
|
||||
*, |
||||
*::before, |
||||
*::after { |
||||
box-sizing: border-box; |
||||
margin: 0; |
||||
position: relative; |
||||
font-weight: normal; |
||||
} |
||||
|
||||
body { |
||||
min-height: 100vh; |
||||
color: var(--color-text); |
||||
background: var(--color-background); |
||||
transition: color 0.5s, background-color 0.5s; |
||||
line-height: 1.6; |
||||
font-family: Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, |
||||
Cantarell, 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif; |
||||
font-size: 15px; |
||||
text-rendering: optimizeLegibility; |
||||
-webkit-font-smoothing: antialiased; |
||||
-moz-osx-font-smoothing: grayscale; |
||||
} |
After Width: | Height: | Size: 122 KiB |
After Width: | Height: | Size: 808 KiB |
After Width: | Height: | Size: 138 KiB |
@ -0,0 +1,32 @@
|
||||
@import './base.css'; |
||||
|
||||
#app { |
||||
margin: 0 auto; |
||||
padding: 0; |
||||
} |
||||
|
||||
a, |
||||
.green { |
||||
text-decoration: none; |
||||
color: hsla(160, 100%, 37%, 1); |
||||
transition: 0.4s; |
||||
} |
||||
|
||||
@media (hover: hover) { |
||||
a:hover { |
||||
background-color: hsla(160, 100%, 37%, 0.2); |
||||
} |
||||
} |
||||
|
||||
@media (min-width: 1024px) { |
||||
body { |
||||
display: flex; |
||||
place-items: center; |
||||
} |
||||
|
||||
#app { |
||||
display: grid; |
||||
grid-template-columns: 1fr 1fr; |
||||
padding: 0; |
||||
} |
||||
} |
@ -0,0 +1,63 @@
|
||||
<template> |
||||
<header> |
||||
<div class="wrapper"> |
||||
<img class="logo" src="@/assets/logo.png" alt="Agorata" /> |
||||
<nav> |
||||
<!-- <router-link to="/">Home</router-link>--> |
||||
<!-- <router-link to="/about">About</router-link>--> |
||||
<!-- <router-link to="/contact">Contact</router-link>--> |
||||
</nav> |
||||
</div> |
||||
</header> |
||||
</template> |
||||
|
||||
<script> |
||||
export default { |
||||
name: "Header" |
||||
} |
||||
</script> |
||||
|
||||
<style scoped> |
||||
header { |
||||
line-height: 1.5; |
||||
max-height: 100vh; |
||||
} |
||||
.logo { |
||||
display: block; |
||||
margin: 0 auto 2rem; |
||||
} |
||||
|
||||
nav { |
||||
width: 100%; |
||||
font-size: 12px; |
||||
text-align: center; |
||||
margin-top: 2rem; |
||||
} |
||||
|
||||
@media (min-width: 1024px) { |
||||
header { |
||||
display: flex; |
||||
place-items: center; |
||||
padding-right: calc(var(--section-gap) / 2); |
||||
} |
||||
|
||||
.logo { |
||||
margin: 0 2rem 0 0; |
||||
} |
||||
|
||||
header .wrapper { |
||||
display: flex; |
||||
place-items: flex-start; |
||||
flex-wrap: wrap; |
||||
} |
||||
|
||||
nav { |
||||
text-align: left; |
||||
margin-left: -1rem; |
||||
font-size: 1rem; |
||||
|
||||
padding: 1rem 0; |
||||
margin-top: 1rem; |
||||
} |
||||
} |
||||
</style> |
@ -0,0 +1,86 @@
|
||||
<script setup lang="ts"> |
||||
import WelcomeItem from './WelcomeItem.vue' |
||||
import DocumentationIcon from './icons/IconDocumentation.vue' |
||||
import ToolingIcon from './icons/IconTooling.vue' |
||||
import EcosystemIcon from './icons/IconEcosystem.vue' |
||||
import CommunityIcon from './icons/IconCommunity.vue' |
||||
import SupportIcon from './icons/IconSupport.vue' |
||||
</script> |
||||
|
||||
<template> |
||||
<WelcomeItem> |
||||
<template #icon> |
||||
<DocumentationIcon /> |
||||
</template> |
||||
<template #heading>Documentation</template> |
||||
|
||||
Vue’s |
||||
<a href="https://vuejs.org/" target="_blank" rel="noopener">official documentation</a> |
||||
provides you with all information you need to get started. |
||||
</WelcomeItem> |
||||
|
||||
<WelcomeItem> |
||||
<template #icon> |
||||
<ToolingIcon /> |
||||
</template> |
||||
<template #heading>Tooling</template> |
||||
|
||||
This project is served and bundled with |
||||
<a href="https://vitejs.dev/guide/features.html" target="_blank" rel="noopener">Vite</a>. The |
||||
recommended IDE setup is |
||||
<a href="https://code.visualstudio.com/" target="_blank" rel="noopener">VSCode</a> + |
||||
<a href="https://github.com/johnsoncodehk/volar" target="_blank" rel="noopener">Volar</a>. If |
||||
you need to test your components and web pages, check out |
||||
<a href="https://www.cypress.io/" target="_blank" rel="noopener">Cypress</a> and |
||||
<a href="https://on.cypress.io/component" target="_blank">Cypress Component Testing</a>. |
||||
|
||||
<br /> |
||||
|
||||
More instructions are available in <code>README.md</code>. |
||||
</WelcomeItem> |
||||
|
||||
<WelcomeItem> |
||||
<template #icon> |
||||
<EcosystemIcon /> |
||||
</template> |
||||
<template #heading>Ecosystem</template> |
||||
|
||||
Get official tools and libraries for your project: |
||||
<a href="https://pinia.vuejs.org/" target="_blank" rel="noopener">Pinia</a>, |
||||
<a href="https://router.vuejs.org/" target="_blank" rel="noopener">Vue Router</a>, |
||||
<a href="https://test-utils.vuejs.org/" target="_blank" rel="noopener">Vue Test Utils</a>, and |
||||
<a href="https://github.com/vuejs/devtools" target="_blank" rel="noopener">Vue Dev Tools</a>. If |
||||
you need more resources, we suggest paying |
||||
<a href="https://github.com/vuejs/awesome-vue" target="_blank" rel="noopener">Awesome Vue</a> |
||||
a visit. |
||||
</WelcomeItem> |
||||
|
||||
<WelcomeItem> |
||||
<template #icon> |
||||
<CommunityIcon /> |
||||
</template> |
||||
<template #heading>Community</template> |
||||
|
||||
Got stuck? Ask your question on |
||||
<a href="https://chat.vuejs.org" target="_blank" rel="noopener">Vue Land</a>, our official |
||||
Discord server, or |
||||
<a href="https://stackoverflow.com/questions/tagged/vue.js" target="_blank" rel="noopener" |
||||
>StackOverflow</a |
||||
>. You should also subscribe to |
||||
<a href="https://news.vuejs.org" target="_blank" rel="noopener">our mailing list</a> and follow |
||||
the official |
||||
<a href="https://twitter.com/vuejs" target="_blank" rel="noopener">@vuejs</a> |
||||
twitter account for latest news in the Vue world. |
||||
</WelcomeItem> |
||||
|
||||
<WelcomeItem> |
||||
<template #icon> |
||||
<SupportIcon /> |
||||
</template> |
||||
<template #heading>Support Vue</template> |
||||
|
||||
As an independent project, Vue relies on community backing for its sustainability. You can help |
||||
us by |
||||
<a href="https://vuejs.org/sponsor/" target="_blank" rel="noopener">becoming a sponsor</a>. |
||||
</WelcomeItem> |
||||
</template> |
@ -0,0 +1,11 @@
|
||||
import { createApp } from 'vue' |
||||
import App from './App.vue' |
||||
import router from './router' |
||||
|
||||
import './assets/main.css' |
||||
|
||||
const app = createApp(App) |
||||
|
||||
app.use(router) |
||||
|
||||
app.mount('#app') |
@ -0,0 +1,23 @@
|
||||
import { createRouter, createWebHistory } from 'vue-router' |
||||
import Landing from '../views/Landing.vue' |
||||
|
||||
const router = createRouter({ |
||||
history: createWebHistory(import.meta.env.BASE_URL), |
||||
routes: [ |
||||
{ |
||||
path: '/', |
||||
name: 'home', |
||||
component: Landing |
||||
} |
||||
// {
|
||||
// path: '/about',
|
||||
// name: 'about',
|
||||
// // route level code-splitting
|
||||
// // this generates a separate chunk (About.[hash].js) for this route
|
||||
// // which is lazy-loaded when the route is visited.
|
||||
// component: () => import('../views/AboutView.vue')
|
||||
// }
|
||||
] |
||||
}) |
||||
|
||||
export default router |
@ -0,0 +1,75 @@
|
||||
<script setup lang="ts"> |
||||
</script> |
||||
|
||||
<template> |
||||
<main> |
||||
<!-- @/assets/logo_single.png centered horizontally and slightly above center vertically --> |
||||
<img class="logo" src="@/assets/logo_landing.png" alt="Agorata" /> |
||||
<p style="font-size: 1.8rem">Helping you <b style="font-weight: bold">be</b> the new internet</p> |
||||
|
||||
<div id="do-you-know"> |
||||
<p>Do you know what TON Web is?</p><br/> |
||||
<router-link to="/i-know"> |
||||
<button class="bwhite wide">Yes</button> |
||||
</router-link> |
||||
<br/> |
||||
<router-link to="/tonweb"> |
||||
<button class="bwhite wide">No</button> |
||||
</router-link> |
||||
</div> |
||||
</main> |
||||
</template> |
||||
|
||||
<style scoped lang="scss"> |
||||
// Main has a radial gradient background with #1f2b5c at the center and #3e3e4b at the edges. |
||||
main { |
||||
background: radial-gradient(ellipse at center, #1f2b5c 0%, #3e3e4b 100%); |
||||
height: 100vh; |
||||
width: 100vw; |
||||
display: flex; |
||||
flex-direction: column; |
||||
justify-content: center; |
||||
align-items: center; |
||||
color: white; |
||||
font-family: 'Raleway',serif; |
||||
font-size: 1.5rem; |
||||
} |
||||
|
||||
.logo { |
||||
display: block; |
||||
margin: 0 auto 2rem; |
||||
max-width: 25%; |
||||
max-height: 25%; |
||||
} |
||||
|
||||
#do-you-know { |
||||
margin-top: 5rem; |
||||
// Center elements horizontally, with each element at its line |
||||
display: flex; |
||||
flex-direction: column; |
||||
justify-content: center; |
||||
align-items: center; |
||||
} |
||||
|
||||
// A white button with rounded corners and black text |
||||
.bwhite { |
||||
background-color: white; |
||||
color: #282e46; |
||||
border: none; |
||||
border-radius: 5px; |
||||
padding: 16px 32px; |
||||
text-align: center; |
||||
text-decoration: none; |
||||
display: inline-block; |
||||
font-size: 1.6rem; |
||||
margin: 4px 2px; |
||||
cursor: pointer; |
||||
font-weight: bold; |
||||
} |
||||
|
||||
// wide bwhite |
||||
.wide.bwhite { |
||||
min-width: 16rem; |
||||
margin: 0.5rem; |
||||
} |
||||
</style> |
@ -0,0 +1,8 @@
|
||||
/** @type {import('tailwindcss').Config} */ |
||||
module.exports = { |
||||
content: [], |
||||
theme: { |
||||
extend: {}, |
||||
}, |
||||
plugins: [], |
||||
} |
@ -0,0 +1,8 @@
|
||||
{ |
||||
"extends": "@vue/tsconfig/tsconfig.node.json", |
||||
"include": ["vite.config.*", "vitest.config.*", "cypress.config.*", "playwright.config.*"], |
||||
"compilerOptions": { |
||||
"composite": true, |
||||
"types": ["node"] |
||||
} |
||||
} |
@ -0,0 +1,16 @@
|
||||
{ |
||||
"extends": "@vue/tsconfig/tsconfig.web.json", |
||||
"include": ["env.d.ts", "src/**/*", "src/**/*.vue"], |
||||
"compilerOptions": { |
||||
"baseUrl": ".", |
||||
"paths": { |
||||
"@/*": ["./src/*"] |
||||
} |
||||
}, |
||||
|
||||
"references": [ |
||||
{ |
||||
"path": "./tsconfig.config.json" |
||||
} |
||||
] |
||||
} |
@ -0,0 +1,14 @@
|
||||
import { fileURLToPath, URL } from 'node:url' |
||||
|
||||
import { defineConfig } from 'vite' |
||||
import vue from '@vitejs/plugin-vue' |
||||
|
||||
// https://vitejs.dev/config/
|
||||
export default defineConfig({ |
||||
plugins: [vue()], |
||||
resolve: { |
||||
alias: { |
||||
'@': fileURLToPath(new URL('./src', import.meta.url)) |
||||
} |
||||
} |
||||
}) |
Loading…
Reference in new issue