Browse Source

Resynching master branch

experimental_plugin
Matthew Aaron Raymer 2 years ago
parent
commit
f28e2123b1
  1. 26
      package-lock.json
  2. 2
      package.json
  3. 2
      src/App.vue
  4. 150
      src/components/HelloWorld.vue
  5. 56
      src/main.ts
  6. 66
      src/router/index.ts
  7. 22
      src/views/AccountViewView.vue
  8. 2
      src/views/ConfirmContactView.vue
  9. 8
      src/views/ContactScanView.vue
  10. 21
      src/views/DiscoverView.vue
  11. 5
      src/views/HomeView.vue
  12. 6
      src/views/ImportAccountView.vue
  13. 8
      src/views/NewEditAccountView.vue
  14. 10
      src/views/NewEditCommitmentView.vue
  15. 12
      src/views/NewEditProjectView.vue
  16. 27
      src/views/ProjectViewView.vue
  17. 13
      src/views/StartView.vue

26
package-lock.json

@ -9,8 +9,6 @@
"version": "0.1.0", "version": "0.1.0",
"dependencies": { "dependencies": {
"@fortawesome/fontawesome-svg-core": "^6.2.1", "@fortawesome/fontawesome-svg-core": "^6.2.1",
"@fortawesome/free-brands-svg-icons": "^6.2.1",
"@fortawesome/free-regular-svg-icons": "^6.2.1",
"@fortawesome/free-solid-svg-icons": "^6.2.1", "@fortawesome/free-solid-svg-icons": "^6.2.1",
"@fortawesome/vue-fontawesome": "^3.0.2", "@fortawesome/vue-fontawesome": "^3.0.2",
"core-js": "^3.26.1", "core-js": "^3.26.1",
@ -1830,30 +1828,6 @@
"node": ">=6" "node": ">=6"
} }
}, },
"node_modules/@fortawesome/free-brands-svg-icons": {
"version": "6.2.1",
"resolved": "https://registry.npmjs.org/@fortawesome/free-brands-svg-icons/-/free-brands-svg-icons-6.2.1.tgz",
"integrity": "sha512-L8l4MfdHPmZlJ72PvzdfwOwbwcCAL0vx48tJRnI6u1PJXh+j2f3yDoKyQgO3qjEsgD5Fr2tQV/cPP8F/k6aUig==",
"hasInstallScript": true,
"dependencies": {
"@fortawesome/fontawesome-common-types": "6.2.1"
},
"engines": {
"node": ">=6"
}
},
"node_modules/@fortawesome/free-regular-svg-icons": {
"version": "6.2.1",
"resolved": "https://registry.npmjs.org/@fortawesome/free-regular-svg-icons/-/free-regular-svg-icons-6.2.1.tgz",
"integrity": "sha512-wiqcNDNom75x+pe88FclpKz7aOSqS2lOivZeicMV5KRwOAeypxEYWAK/0v+7r+LrEY30+qzh8r2XDaEHvoLsMA==",
"hasInstallScript": true,
"dependencies": {
"@fortawesome/fontawesome-common-types": "6.2.1"
},
"engines": {
"node": ">=6"
}
},
"node_modules/@fortawesome/free-solid-svg-icons": { "node_modules/@fortawesome/free-solid-svg-icons": {
"version": "6.2.1", "version": "6.2.1",
"resolved": "https://registry.npmjs.org/@fortawesome/free-solid-svg-icons/-/free-solid-svg-icons-6.2.1.tgz", "resolved": "https://registry.npmjs.org/@fortawesome/free-solid-svg-icons/-/free-solid-svg-icons-6.2.1.tgz",

2
package.json

@ -9,8 +9,6 @@
}, },
"dependencies": { "dependencies": {
"@fortawesome/fontawesome-svg-core": "^6.2.1", "@fortawesome/fontawesome-svg-core": "^6.2.1",
"@fortawesome/free-brands-svg-icons": "^6.2.1",
"@fortawesome/free-regular-svg-icons": "^6.2.1",
"@fortawesome/free-solid-svg-icons": "^6.2.1", "@fortawesome/free-solid-svg-icons": "^6.2.1",
"@fortawesome/vue-fontawesome": "^3.0.2", "@fortawesome/vue-fontawesome": "^3.0.2",
"core-js": "^3.26.1", "core-js": "^3.26.1",

2
src/App.vue

@ -1,3 +1,5 @@
<template> <template>
<router-view /> <router-view />
</template> </template>
<style></style>

150
src/components/HelloWorld.vue

@ -0,0 +1,150 @@
<template>
<div class="hello">
<h1>{{ msg }}</h1>
<p>
For a guide and recipes on how to configure / customize this project,<br />
check out the
<a href="https://cli.vuejs.org" target="_blank" rel="noopener"
>vue-cli documentation</a
>.
</p>
<h3>Installed CLI Plugins</h3>
<ul>
<li>
<a
href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-babel"
target="_blank"
rel="noopener"
>babel</a
>
</li>
<li>
<a
href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-pwa"
target="_blank"
rel="noopener"
>pwa</a
>
</li>
<li>
<a
href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-router"
target="_blank"
rel="noopener"
>router</a
>
</li>
<li>
<a
href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-vuex"
target="_blank"
rel="noopener"
>vuex</a
>
</li>
<li>
<a
href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-eslint"
target="_blank"
rel="noopener"
>eslint</a
>
</li>
<li>
<a
href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-typescript"
target="_blank"
rel="noopener"
>typescript</a
>
</li>
</ul>
<h3>Essential Links</h3>
<ul>
<li>
<a href="https://vuejs.org" target="_blank" rel="noopener">Core Docs</a>
</li>
<li>
<a href="https://forum.vuejs.org" target="_blank" rel="noopener"
>Forum</a
>
</li>
<li>
<a href="https://chat.vuejs.org" target="_blank" rel="noopener"
>Community Chat</a
>
</li>
<li>
<a href="https://twitter.com/vuejs" target="_blank" rel="noopener"
>Twitter</a
>
</li>
<li>
<a href="https://news.vuejs.org" target="_blank" rel="noopener">News</a>
</li>
</ul>
<h3>Ecosystem</h3>
<ul>
<li>
<a href="https://router.vuejs.org" target="_blank" rel="noopener"
>vue-router</a
>
</li>
<li>
<a href="https://vuex.vuejs.org" target="_blank" rel="noopener">vuex</a>
</li>
<li>
<a
href="https://github.com/vuejs/vue-devtools#vue-devtools"
target="_blank"
rel="noopener"
>vue-devtools</a
>
</li>
<li>
<a href="https://vue-loader.vuejs.org" target="_blank" rel="noopener"
>vue-loader</a
>
</li>
<li>
<a
href="https://github.com/vuejs/awesome-vue"
target="_blank"
rel="noopener"
>awesome-vue</a
>
</li>
</ul>
</div>
</template>
<script lang="ts">
import { Options, Vue } from "vue-class-component";
@Options({
props: {
msg: String,
},
})
export default class HelloWorld extends Vue {
msg!: string;
}
</script>
<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
h3 {
margin: 40px 0 0;
}
ul {
list-style-type: none;
padding: 0;
}
li {
display: inline-block;
margin: 0 10px;
}
a {
color: #42b983;
}
</style>

56
src/main.ts

@ -6,21 +6,49 @@ import store from "./store";
import "./assets/styles/tailwind.css"; import "./assets/styles/tailwind.css";
/* import the fontawesome core */
import { library } from "@fortawesome/fontawesome-svg-core"; import { library } from "@fortawesome/fontawesome-svg-core";
import {
faChevronLeft,
faHouseChimney,
faMagnifyingGlass,
faFolderOpen,
faHand,
faCircleUser,
faCopy,
faShareNodes,
faQrcode,
faUser,
faPen,
faTrashCan,
faCalendar,
faEllipsisVertical,
faSpinner,
faCircleCheck,
} from "@fortawesome/free-solid-svg-icons";
library.add(
faChevronLeft,
faHouseChimney,
faMagnifyingGlass,
faFolderOpen,
faHand,
faCircleUser,
faCopy,
faShareNodes,
faQrcode,
faUser,
faPen,
faTrashCan,
faCalendar,
faEllipsisVertical,
faSpinner,
faCircleCheck
);
/* import font awesome icon component */
import { FontAwesomeIcon } from "@fortawesome/vue-fontawesome"; import { FontAwesomeIcon } from "@fortawesome/vue-fontawesome";
/* import specific icons */ createApp(App)
import { faUserSecret } from "@fortawesome/free-solid-svg-icons"; .component("fa", FontAwesomeIcon)
.use(store)
/* add icons to the library */ .use(router)
library.add(faUserSecret); .mount("#app");
/* add font awesome icon component */
App.component("font-awesome-icon", FontAwesomeIcon);
App.config.productionTip = false;
createApp(App).use(store).use(router).mount("#app");

66
src/router/index.ts

@ -22,6 +22,72 @@ const routes: Array<RouteRecordRaw> = [
component: () => component: () =>
import(/* webpackChunkName: "start" */ "../views/StartView.vue"), import(/* webpackChunkName: "start" */ "../views/StartView.vue"),
}, },
{
path: "/account",
name: "account",
component: () =>
import(/* webpackChunkName: "account" */ "../views/AccountViewView.vue"),
},
{
path: "/confirm-contact",
name: "confirm-contact",
component: () =>
import(
/* webpackChunkName: "confirm-contact" */ "../views/ConfirmContactView.vue"
),
},
{
path: "/scan-contact",
name: "scan-contact",
component: () =>
import(
/* webpackChunkName: "scan-contact" */ "../views/ContactScanView.vue"
),
},
{
path: "/discover",
name: "discover",
component: () =>
import(/* webpackChunkName: "discover" */ "../views/DiscoverView.vue"),
},
{
path: "/import-account",
name: "import-account",
component: () =>
import(
/* webpackChunkName: "import-account" */ "../views/ImportAccountView.vue"
),
},
{
path: "/new-edit-account",
name: "new-edit-account",
component: () =>
import(
/* webpackChunkName: "new-edit-account" */ "../views/NewEditAccountView.vue"
),
},
{
path: "/new-edit-commitment",
name: "new-edit-commitment",
component: () =>
import(
/* webpackChunkName: "new-edit-commitment" */ "../views/NewEditCommitmentView.vue"
),
},
{
path: "/new-edit-project",
name: "new-edit-project",
component: () =>
import(
/* webpackChunkName: "new-edit-project" */ "../views/NewEditProjectView.vue"
),
},
{
path: "/project",
name: "project",
component: () =>
import(/* webpackChunkName: "project" */ "../views/ProjectViewView.vue"),
},
]; ];
const router = createRouter({ const router = createRouter({

22
src/views/AccountViewView.vue

@ -5,31 +5,31 @@
<!-- Home Feed --> <!-- Home Feed -->
<li class="basis-1/5 rounded-md text-slate-500"> <li class="basis-1/5 rounded-md text-slate-500">
<a href="" class="block text-center py-3 px-1" <a href="" class="block text-center py-3 px-1"
><i class="fa-solid fa-house-chimney fa-fw"></i ><fa icon="house-chimney" class="fa-fw"></fa
></a> ></a>
</li> </li>
<!-- Search --> <!-- Search -->
<li class="basis-1/5 rounded-md text-slate-500"> <li class="basis-1/5 rounded-md text-slate-500">
<a href="search.html" class="block text-center py-3 px-1" <a href="search.html" class="block text-center py-3 px-1"
><i class="fa-solid fa-magnifying-glass fa-fw"></i ><fa icon="magnifying-glass" class="fa-fw"></fa
></a> ></a>
</li> </li>
<!-- Projects --> <!-- Projects -->
<li class="basis-1/5 rounded-md text-slate-500"> <li class="basis-1/5 rounded-md text-slate-500">
<a href="" class="block text-center py-3 px-1" <a href="" class="block text-center py-3 px-1"
><i class="fa-solid fa-folder-open fa-fw"></i ><fa icon="folder-open" class="fa-fw"></fa
></a> ></a>
</li> </li>
<!-- Commitments --> <!-- Commitments -->
<li class="basis-1/5 rounded-md text-slate-500"> <li class="basis-1/5 rounded-md text-slate-500">
<a href="" class="block text-center py-3 px-1" <a href="" class="block text-center py-3 px-1"
><i class="fa-solid fa-hand fa-fw rotate-45"></i ><fa icon="hand" class="fa-fw"></fa
></a> ></a>
</li> </li>
<!-- Profile --> <!-- Profile -->
<li class="basis-1/5 rounded-md bg-slate-400 text-white"> <li class="basis-1/5 rounded-md bg-slate-400 text-white">
<a href="account-view.html" class="block text-center py-3 px-1" <a href="account-view.html" class="block text-center py-3 px-1"
><i class="fa-solid fa-circle-user fa-fw"></i ><fa icon="circle-user" class="fa-fw"></fa
></a> ></a>
</li> </li>
</ul> </ul>
@ -68,18 +68,18 @@
> >
<span <span
><code>did:peer:kl45kj41lk451kl3</code> ><code>did:peer:kl45kj41lk451kl3</code>
<i class="fa-solid fa-copy text-slate-400 fa-fw"></i <fa icon="copy" class="text-slate-400 fa-fw ml-1"></fa
></span> ></span>
<span> <span>
<button <button
class="text-xs uppercase bg-slate-500 text-white px-1.5 py-1 rounded-md" class="text-xs uppercase bg-slate-500 text-white px-1.5 py-1 rounded-md"
> >
<i class="fa-solid fa-share-nodes fa-fw"></i> <fa icon="share-nodes" class="fa-fw"></fa>
</button> </button>
<button <button
class="text-xs uppercase bg-slate-500 text-white px-1.5 py-1 rounded-md" class="text-xs uppercase bg-slate-500 text-white px-1.5 py-1 rounded-md ml-1"
> >
<i class="fa-solid fa-qrcode fa-fw"></i> <fa icon="qrcode" class="fa-fw"></fa>
</button> </button>
</span> </span>
</div> </div>
@ -88,7 +88,7 @@
<div class="text-sm text-slate-500 mb-1"> <div class="text-sm text-slate-500 mb-1">
<span <span
><code>dyIgKepL19trfrFu5jzkoNhI</code> ><code>dyIgKepL19trfrFu5jzkoNhI</code>
<i class="fa-solid fa-copy text-slate-400 fa-fw"></i <fa icon="copy" class="text-slate-400 fa-fw ml-1"></fa
></span> ></span>
</div> </div>
@ -96,7 +96,7 @@
<div class="text-sm text-slate-500 mb-1"> <div class="text-sm text-slate-500 mb-1">
<span <span
><code>m/44'/0'/0'/0/0</code> ><code>m/44'/0'/0'/0/0</code>
<i class="fa-solid fa-copy text-slate-400 fa-fw"></i <fa icon="copy" class="text-slate-400 fa-fw ml-1"></fa
></span> ></span>
</div> </div>
</div> </div>

2
src/views/ConfirmContactView.vue

@ -8,7 +8,7 @@
<a <a
href="account-view.html" href="account-view.html"
class="text-lg text-center px-2 py-1 absolute -left-2 -top-1" class="text-lg text-center px-2 py-1 absolute -left-2 -top-1"
><i class="fa-solid fa-chevron-left fa-fw"></i ><fa icon="chevron-left" class="fa-fw"></fa
></a> ></a>
Confirm Contact Confirm Contact

8
src/views/ContactScanView.vue

@ -7,7 +7,7 @@
<a <a
href="account-view.html" href="account-view.html"
class="text-lg text-center px-2 py-1 absolute -left-2 -top-1" class="text-lg text-center px-2 py-1 absolute -left-2 -top-1"
><i class="fa-solid fa-chevron-left fa-fw"></i ><fa icon="chevron-left" class="fa-fw"></fa
></a> ></a>
Scan Contact Scan Contact
@ -56,17 +56,17 @@
<input <input
type="text" type="text"
placeholder="Name (optional)" placeholder="Name (optional)"
class="block w-full rounded border-slate-400 mb-2" class="block w-full rounded border border-slate-400 mb-2 px-3 py-2"
/> />
<input <input
type="text" type="text"
placeholder="ID" placeholder="ID"
class="block w-full rounded border-slate-400 mb-2" class="block w-full rounded border border-slate-400 mb-2 px-3 py-2"
/> />
<input <input
type="text" type="text"
placeholder="Public Key (optional)" placeholder="Public Key (optional)"
class="block w-full rounded border-slate-400 mb-4" class="block w-full rounded border border-slate-400 mb-4 px-3 py-2"
/> />
<div class="mt-8"> <div class="mt-8">

21
src/views/DiscoverView.vue

@ -1,34 +1,35 @@
<template> <template>
<!-- QUICK NAV -->
<nav id="QuickNav" class="fixed bottom-0 left-0 right-0 bg-slate-200"> <nav id="QuickNav" class="fixed bottom-0 left-0 right-0 bg-slate-200">
<ul class="flex text-2xl p-2 gap-2"> <ul class="flex text-2xl p-2 gap-2">
<!-- Home Feed --> <!-- Home Feed -->
<li class="basis-1/5 rounded-md text-slate-500"> <li class="basis-1/5 rounded-md text-slate-500">
<a href="" class="block text-center py-3 px-1" <a href="" class="block text-center py-3 px-1"
><i class="fa-solid fa-house-chimney fa-fw"></i ><fa icon="house-chimney" class="fa-fw"></fa
></a> ></a>
</li> </li>
<!-- Search --> <!-- Search -->
<li class="basis-1/5 rounded-md bg-slate-400 text-white"> <li class="basis-1/5 rounded-md bg-slate-400 text-white">
<a href="search.html" class="block text-center py-3 px-1" <a href="search.html" class="block text-center py-3 px-1"
><i class="fa-solid fa-magnifying-glass fa-fw"></i ><fa icon="magnifying-glass" class="fa-fw"></fa
></a> ></a>
</li> </li>
<!-- Projects --> <!-- Projects -->
<li class="basis-1/5 rounded-md text-slate-500"> <li class="basis-1/5 rounded-md text-slate-500">
<a href="" class="block text-center py-3 px-1" <a href="" class="block text-center py-3 px-1"
><i class="fa-solid fa-folder-open fa-fw"></i ><fa icon="folder-open" class="fa-fw"></fa
></a> ></a>
</li> </li>
<!-- Commitments --> <!-- Commitments -->
<li class="basis-1/5 rounded-md text-slate-500"> <li class="basis-1/5 rounded-md text-slate-500">
<a href="" class="block text-center py-3 px-1" <a href="" class="block text-center py-3 px-1"
><i class="fa-solid fa-hand fa-fw rotate-45"></i ><fa icon="hand" class="fa-fw"></fa
></a> ></a>
</li> </li>
<!-- Profile --> <!-- Profile -->
<li class="basis-1/5 rounded-md text-slate-500"> <li class="basis-1/5 rounded-md text-slate-500">
<a href="account-view.html" class="block text-center py-3 px-1" <a href="account-view.html" class="block text-center py-3 px-1"
><i class="fa-solid fa-circle-user fa-fw"></i ><fa icon="circle-user" class="fa-fw"></fa
></a> ></a>
</li> </li>
</ul> </ul>
@ -46,12 +47,12 @@
<input <input
type="text" type="text"
placeholder="Search…" placeholder="Search…"
class="block w-full rounded-l border-r-0 border-slate-400" class="block w-full rounded-l border border-r-0 border-slate-400 px-3 py-2"
/> />
<button <button
class="px-4 rounded-r bg-slate-200 border border-l-0 border-slate-400" class="px-4 rounded-r bg-slate-200 border border-l-0 border-slate-400"
> >
<i class="fa-solid fa-magnifying-glass fa-fw"></i> <fa icon="magnifying-glass" class="fa-fw"></fa>
</button> </button>
</form> </form>
@ -99,7 +100,7 @@
<div class="grow"> <div class="grow">
<h2 class="text-base font-semibold">Canyon cleanup</h2> <h2 class="text-base font-semibold">Canyon cleanup</h2>
<div class="text-sm"> <div class="text-sm">
<i class="fa-solid fa-user fa-fw text-slate-400"></i> Rotary <fa icon="user" class="fa-fw text-slate-400"></fa> Rotary
</div> </div>
</div> </div>
</a> </a>
@ -117,7 +118,7 @@
<div class="grow"> <div class="grow">
<h2 class="text-base font-semibold">Potluck with neighbors</h2> <h2 class="text-base font-semibold">Potluck with neighbors</h2>
<div class="text-sm"> <div class="text-sm">
<i class="fa-solid fa-user fa-fw text-slate-400"></i> Andrew A. <fa icon="user" class="fa-fw text-slate-400"></fa> Andrew A.
</div> </div>
</div> </div>
</a> </a>
@ -135,7 +136,7 @@
<div class="grow"> <div class="grow">
<h2 class="text-base font-semibold">Historical site</h2> <h2 class="text-base font-semibold">Historical site</h2>
<div class="text-sm"> <div class="text-sm">
<i class="fa-solid fa-user fa-fw text-slate-400"></i> <fa icon="user" class="fa-fw text-slate-400 mr-1"></fa>
<em>Unknown</em> <em>Unknown</em>
</div> </div>
</div> </div>

5
src/views/HomeView.vue

@ -4,9 +4,12 @@
<script lang="ts"> <script lang="ts">
import { Options, Vue } from "vue-class-component"; import { Options, Vue } from "vue-class-component";
import HelloWorld from "@/components/HelloWorld.vue"; // @ is an alias to /src
@Options({ @Options({
components: {}, components: {
HelloWorld,
},
}) })
export default class HomeView extends Vue {} export default class HomeView extends Vue {}
</script> </script>

6
src/views/ImportAccountView.vue

@ -7,8 +7,8 @@
<a <a
href="start.html" href="start.html"
class="text-lg text-center px-2 py-1 absolute -left-2 -top-1" class="text-lg text-center px-2 py-1 absolute -left-2 -top-1"
><i class="fa-solid fa-chevron-left fa-fw"></i ><fa icon="chevron-left"></fa>
></a> </a>
Import Existing Identity Import Existing Identity
</h1> </h1>
</div> </div>
@ -20,7 +20,7 @@
<input <input
type="text" type="text"
placeholder="Seed Phrase" placeholder="Seed Phrase"
class="block w-full rounded border-slate-400 mb-4" class="block w-full rounded border border-slate-400 mb-4 px-3 py-2"
/> />
<div class="mt-8"> <div class="mt-8">
<input <input

8
src/views/NewEditAccountView.vue

@ -7,8 +7,8 @@
<a <a
href="account-view.html" href="account-view.html"
class="text-lg text-center px-2 py-1 absolute -left-2 -top-1" class="text-lg text-center px-2 py-1 absolute -left-2 -top-1"
><i class="fa-solid fa-chevron-left fa-fw"></i ><fa icon="chevron-left" class="fa-fw"></fa>
></a> </a>
[New/Edit] Identity [New/Edit] Identity
</h1> </h1>
</div> </div>
@ -16,12 +16,12 @@
<input <input
type="text" type="text"
placeholder="First Name" placeholder="First Name"
class="block w-full rounded border-slate-400 mb-4" class="block w-full rounded border border-slate-400 mb-4 px-3 py-2"
/> />
<input <input
type="text" type="text"
placeholder="Last Name" placeholder="Last Name"
class="block w-full rounded border-slate-400 mb-4" class="block w-full rounded border border-slate-400 mb-4 px-3 py-2"
/> />
<div class="mt-8"> <div class="mt-8">

10
src/views/NewEditCommitmentView.vue

@ -8,8 +8,8 @@
<a <a
href="project-view.html" href="project-view.html"
class="text-lg text-center px-2 py-1 absolute -left-2 -top-1" class="text-lg text-center px-2 py-1 absolute -left-2 -top-1"
><i class="fa-solid fa-chevron-left fa-fw"></i ><fa icon="chevron-left" class="fa-fw"></fa>
></a> </a>
Make Commitment Make Commitment
</h1> </h1>
@ -17,7 +17,9 @@
<!-- Project Details --> <!-- Project Details -->
<form> <form>
<select class="block w-full rounded border-slate-400 mb-4"> <select
class="block w-full rounded border border-slate-400 mb-4 px-3 py-2"
>
<option disabled>Choose a commitment type</option> <option disabled>Choose a commitment type</option>
<option selected>Time</option> <option selected>Time</option>
<option>Cryptocurrency</option> <option>Cryptocurrency</option>
@ -29,7 +31,7 @@
<input <input
type="number" type="number"
placeholder="0.0" placeholder="0.0"
class="block w-full rounded-l border-slate-400" class="block w-full rounded-l border border-slate-400 px-3 py-2"
/> />
<span <span
class="px-4 py-2 rounded-r bg-slate-200 border border-l-0 border-slate-400" class="px-4 py-2 rounded-r bg-slate-200 border border-l-0 border-slate-400"

12
src/views/NewEditProjectView.vue

@ -8,8 +8,8 @@
<a <a
href="project-view.html" href="project-view.html"
class="text-lg text-center px-2 py-1 absolute -left-2 -top-1" class="text-lg text-center px-2 py-1 absolute -left-2 -top-1"
><i class="fa-solid fa-chevron-left fa-fw"></i ><fa icon="chevron-left" class="fa-fw"></fa>
></a> </a>
[New/Edit] Project [New/Edit] Project
</h1> </h1>
@ -25,12 +25,12 @@
<button <button
class="text-md font-bold uppercase bg-blue-600 text-white px-3 py-2 rounded" class="text-md font-bold uppercase bg-blue-600 text-white px-3 py-2 rounded"
> >
<i class="fa-solid fa-pen fa-fw"></i> <fa icon="pen" class="fa-fw"></fa>
</button> </button>
<button <button
class="text-md font-bold uppercase bg-red-600 text-white px-3 py-2 rounded" class="text-md font-bold uppercase bg-red-600 text-white px-3 py-2 rounded"
> >
<i class="fa-solid fa-trash-can fa-fw"></i> <fa icon="trash-can" class="fa-fw"></fa>
</button> </button>
</div> </div>
<img src="https://picsum.photos/800/400" class="w-full" /> <img src="https://picsum.photos/800/400" class="w-full" />
@ -39,12 +39,12 @@
<input <input
type="text" type="text"
placeholder="Project Name" placeholder="Project Name"
class="block w-full rounded border-slate-400 mb-4" class="block w-full rounded border border-slate-400 mb-4 px-3 py-2"
/> />
<textarea <textarea
placeholder="Description" placeholder="Description"
class="block w-full rounded border-slate-400 mb-4" class="block w-full rounded border border-slate-400 mb-4 px-3 py-2"
rows="5" rows="5"
></textarea> ></textarea>
<div class="text-xs text-slate-500 italic -mt-3 mb-4"> <div class="text-xs text-slate-500 italic -mt-3 mb-4">

27
src/views/ProjectViewView.vue

@ -5,31 +5,31 @@
<!-- Home Feed --> <!-- Home Feed -->
<li class="basis-1/5 rounded-md text-slate-500"> <li class="basis-1/5 rounded-md text-slate-500">
<a href="" class="block text-center py-3 px-1" <a href="" class="block text-center py-3 px-1"
><i class="fa-solid fa-house-chimney fa-fw"></i ><fa icon="house-chimney" class="fa-fw"></fa
></a> ></a>
</li> </li>
<!-- Search --> <!-- Search -->
<li class="basis-1/5 rounded-md text-slate-500"> <li class="basis-1/5 rounded-md text-slate-500">
<a href="search.html" class="block text-center py-3 px-1" <a href="search.html" class="block text-center py-3 px-1"
><i class="fa-solid fa-magnifying-glass fa-fw"></i ><fa icon="magnifying-glass" class="fa-fw"></fa
></a> ></a>
</li> </li>
<!-- Projects --> <!-- Projects -->
<li class="basis-1/5 rounded-md bg-slate-400 text-white"> <li class="basis-1/5 rounded-md bg-slate-400 text-white">
<a href="" class="block text-center py-3 px-1" <a href="" class="block text-center py-3 px-1"
><i class="fa-solid fa-folder-open fa-fw"></i ><fa icon="folder-open" class="fa-fw"></fa
></a> ></a>
</li> </li>
<!-- Commitments --> <!-- Commitments -->
<li class="basis-1/5 rounded-md text-slate-500"> <li class="basis-1/5 rounded-md text-slate-500">
<a href="" class="block text-center py-3 px-1" <a href="" class="block text-center py-3 px-1"
><i class="fa-solid fa-hand fa-fw rotate-45"></i ><fa icon="hand" class="fa-fw"></fa
></a> ></a>
</li> </li>
<!-- Profile --> <!-- Profile -->
<li class="basis-1/5 rounded-md text-slate-500"> <li class="basis-1/5 rounded-md text-slate-500">
<a href="account-view.html" class="block text-center py-3 px-1" <a href="account-view.html" class="block text-center py-3 px-1"
><i class="fa-solid fa-circle-user fa-fw"></i ><fa icon="circle-user" class="fa-fw"></fa
></a> ></a>
</li> </li>
</ul> </ul>
@ -42,13 +42,13 @@
<h1 class="text-lg text-center font-light relative px-7"> <h1 class="text-lg text-center font-light relative px-7">
<!-- Back --> <!-- Back -->
<a href="" class="text-lg text-center px-2 py-1 absolute -left-2 -top-1" <a href="" class="text-lg text-center px-2 py-1 absolute -left-2 -top-1"
><i class="fa-solid fa-chevron-left fa-fw"></i ><fa icon="chevron-left" class="fa-fw"></fa
></a> ></a>
<!-- Context Menu --> <!-- Context Menu -->
<a <a
href="" href=""
class="text-lg text-center px-2 py-1 absolute -right-2 -top-1" class="text-lg text-center px-2 py-1 absolute -right-2 -top-1"
><i class="fa-solid fa-ellipsis-vertical fa-fw"></i ><fa icon="ellipsis-vertical" class="fa-fw"></fa
></a> ></a>
View Project View Project
@ -65,11 +65,9 @@
<div> <div>
<h2 class="text-xl font-semibold">Canyon cleanup</h2> <h2 class="text-xl font-semibold">Canyon cleanup</h2>
<div class="flex justify-between gap-4 text-sm mb-3"> <div class="flex justify-between gap-4 text-sm mb-3">
<span><fa icon="user" class="fa-fw text-slate-400"></fa> Rotary</span>
<span <span
><i class="fa-solid fa-user fa-fw text-slate-400"></i> Rotary</span ><fa icon="calendar" class="fa-fw text-slate-400"></fa> 8 days
>
<span
><i class="fa-solid fa-calendar fa-fw text-slate-400"></i> 8 days
ago</span ago</span
> >
</div> </div>
@ -99,22 +97,21 @@
<li class="flex justify-between gap-4 py-1.5 border-b border-slate-300"> <li class="flex justify-between gap-4 py-1.5 border-b border-slate-300">
<span>[Username]</span> <span>[Username]</span>
<span <span
>5 hours <i class="fa-solid fa-spinner fa-fw text-slate-400"></i >5 hours <fa icon="spinner" class="fa-fw text-slate-400"></fa
></span> ></span>
</li> </li>
<li class="flex justify-between gap-4 py-1.5 border-b border-slate-300"> <li class="flex justify-between gap-4 py-1.5 border-b border-slate-300">
<span>[Username]</span> <span>[Username]</span>
<span <span
>US$ 20.00 >US$ 20.00 <fa icon="circle-check" class="fa-fw text-lime-500"></fa
<i class="fa-solid fa-circle-check fa-fw text-lime-500"></i
></span> ></span>
</li> </li>
<li class="flex justify-between gap-4 py-1.5 border-b border-slate-300"> <li class="flex justify-between gap-4 py-1.5 border-b border-slate-300">
<span>[Username]</span> <span>[Username]</span>
<span <span
>0.1 BTC <i class="fa-solid fa-spinner fa-fw text-slate-400"></i >0.1 BTC <fa icon="spinner" class="fa-fw text-slate-400"></fa
></span> ></span>
</li> </li>
</ul> </ul>

13
src/views/StartView.vue

@ -12,15 +12,16 @@
<p class="text-center text-xl mb-4 font-light"> <p class="text-center text-xl mb-4 font-light">
Do you already have an identity to import? Do you already have an identity to import?
</p> </p>
<a <router-link
href="account-edit.html" :to="{ name: 'new-edit-account' }"
class="block w-full text-center text-lg font-bold uppercase bg-blue-600 text-white px-2 py-3 rounded-md mb-2" class="block w-full text-center text-lg font-bold uppercase bg-blue-600 text-white px-2 py-3 rounded-md mb-2"
>No</a
> >
<a No
href="account-import.html" </router-link>
<router-link
:to="{ name: 'import-account' }"
class="block w-full text-center text-md uppercase bg-slate-500 text-white px-1.5 py-2 rounded-md" class="block w-full text-center text-md uppercase bg-slate-500 text-white px-1.5 py-2 rounded-md"
>Yes</a >Yes</router-link
> >
</div> </div>
</section> </section>

Loading…
Cancel
Save