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