ft/adds and updates multiple pages
added pages: register, verify, clues, deceased updated pages: home, signup
This commit is contained in:
parent
feb23ff958
commit
35118a6a08
@ -2,3 +2,6 @@
|
|||||||
stage = "build"
|
stage = "build"
|
||||||
command = "npx"
|
command = "npx"
|
||||||
command_arguments = ["tailwindcss", "-i","input.css","-o","public/styles.css"]
|
command_arguments = ["tailwindcss", "-i","input.css","-o","public/styles.css"]
|
||||||
|
|
||||||
|
[serve]
|
||||||
|
address = "0.0.0.0"
|
||||||
|
|||||||
@ -910,16 +910,16 @@ function __wbg_get_imports() {
|
|||||||
const ret = wasm.memory;
|
const ret = wasm.memory;
|
||||||
return addHeapObject(ret);
|
return addHeapObject(ret);
|
||||||
};
|
};
|
||||||
imports.wbg.__wbindgen_closure_wrapper4274 = function(arg0, arg1, arg2) {
|
imports.wbg.__wbindgen_closure_wrapper4594 = function(arg0, arg1, arg2) {
|
||||||
const ret = makeClosure(arg0, arg1, 501, __wbg_adapter_42);
|
const ret = makeClosure(arg0, arg1, 617, __wbg_adapter_42);
|
||||||
return addHeapObject(ret);
|
return addHeapObject(ret);
|
||||||
};
|
};
|
||||||
imports.wbg.__wbindgen_closure_wrapper5945 = function(arg0, arg1, arg2) {
|
imports.wbg.__wbindgen_closure_wrapper6267 = function(arg0, arg1, arg2) {
|
||||||
const ret = makeMutClosure(arg0, arg1, 672, __wbg_adapter_45);
|
const ret = makeMutClosure(arg0, arg1, 788, __wbg_adapter_45);
|
||||||
return addHeapObject(ret);
|
return addHeapObject(ret);
|
||||||
};
|
};
|
||||||
imports.wbg.__wbindgen_closure_wrapper6249 = function(arg0, arg1, arg2) {
|
imports.wbg.__wbindgen_closure_wrapper6571 = function(arg0, arg1, arg2) {
|
||||||
const ret = makeMutClosure(arg0, arg1, 697, __wbg_adapter_48);
|
const ret = makeMutClosure(arg0, arg1, 813, __wbg_adapter_48);
|
||||||
return addHeapObject(ret);
|
return addHeapObject(ret);
|
||||||
};
|
};
|
||||||
|
|
||||||
BIN
dist/digitaler-frieden-a5c46ba2b4007edc_bg.wasm
vendored
Normal file
BIN
dist/digitaler-frieden-a5c46ba2b4007edc_bg.wasm
vendored
Normal file
Binary file not shown.
BIN
dist/digitaler-frieden-fb7dc74a22b731fe_bg.wasm
vendored
BIN
dist/digitaler-frieden-fb7dc74a22b731fe_bg.wasm
vendored
Binary file not shown.
12
dist/index.html
vendored
12
dist/index.html
vendored
@ -2,19 +2,19 @@
|
|||||||
<meta charset="UTF-8">
|
<meta charset="UTF-8">
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||||
<title>Digitaler Frieden</title>
|
<title>Digitaler Frieden</title>
|
||||||
<link rel="stylesheet" href="/styles-2c3306d395d89bc2.css" integrity="sha384-+8Fyms9qqS3rUuKlny4vLywuMazPxNtMF4MSl5cTN27K5QbfscxqivAocoSKXg5B">
|
<link rel="stylesheet" href="/styles-c782c03204eac356.css" integrity="sha384-lKsFrm3yCxlOJa6nYfgnRtJimTwIjnZK68/u4R8fJ2S8PnK/ztPTifgkmJunkXLb">
|
||||||
<link rel="icon" href="/favicon-928ba63f33046eed.ico" integrity="sha384-Neq57jnFrTfqAN1JvKAVVVcH1EW3//cZHmK2NRXRlNrxAZR6ErTvXzbOLSyHzkA4">
|
<link rel="icon" href="/favicon-928ba63f33046eed.ico" integrity="sha384-Neq57jnFrTfqAN1JvKAVVVcH1EW3//cZHmK2NRXRlNrxAZR6ErTvXzbOLSyHzkA4">
|
||||||
|
|
||||||
|
|
||||||
<link rel="preload" href="/digitaler-frieden-fb7dc74a22b731fe_bg.wasm" crossorigin="anonymous" integrity="sha384-lWQv8lUizhe+m/RUp+RJ3sv0jhetWJgQUpU/Aydkyc1kOAibAK0i9F+1QraP4hRo" as="fetch" type="application/wasm">
|
<link rel="preload" href="/digitaler-frieden-a5c46ba2b4007edc_bg.wasm" crossorigin="anonymous" integrity="sha384-/nhi/WYlpgPDFVyMKRzDBKCI1Qicv5ZlcCkwhnMaOxoKHpJrW5Jyr6Zz0Ber9zG7" as="fetch" type="application/wasm">
|
||||||
<link rel="modulepreload" href="/digitaler-frieden-fb7dc74a22b731fe.js" crossorigin="anonymous" integrity="sha384-h12ASFiCjhidsjC+iK+3+7dhtTGEfVHbsgwTAAEZ+b9bxxAhzIJRNq9qCx9GVYXT"></head>
|
<link rel="modulepreload" href="/digitaler-frieden-a5c46ba2b4007edc.js" crossorigin="anonymous" integrity="sha384-EIZgdnciYSFZw+rqoQTDD554+YaSi3C2aQkRZOcabgZZfrw+h5AogdieogZZ1+wr"></head>
|
||||||
<body class="bg-black text-white min-height">
|
<body class="bg-black text-white ">
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<script type="module">
|
<script type="module">
|
||||||
import init, * as bindings from '/digitaler-frieden-fb7dc74a22b731fe.js';
|
import init, * as bindings from '/digitaler-frieden-a5c46ba2b4007edc.js';
|
||||||
init('/digitaler-frieden-fb7dc74a22b731fe_bg.wasm');
|
init('/digitaler-frieden-a5c46ba2b4007edc_bg.wasm');
|
||||||
window.wasmBindings = bindings;
|
window.wasmBindings = bindings;
|
||||||
|
|
||||||
</script><script>"use strict";
|
</script><script>"use strict";
|
||||||
|
|||||||
1
dist/public/add.svg
vendored
Normal file
1
dist/public/add.svg
vendored
Normal file
@ -0,0 +1 @@
|
|||||||
|
<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="#FFFFFF"><path d="M0 0h24v24H0z" fill="none"/><path d="M13 7h-2v4H7v2h4v4h2v-4h4v-2h-4V7zm-1-5C6.49 2 2 6.49 2 12s4.49 10 10 10 10-4.49 10-10S17.51 2 12 2zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8z"/></svg>
|
||||||
|
After Width: | Height: | Size: 315 B |
1
dist/public/remove.svg
vendored
Normal file
1
dist/public/remove.svg
vendored
Normal file
@ -0,0 +1 @@
|
|||||||
|
<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="#FFFFFF"><path d="M0 0h24v24H0z" fill="none"/><path d="M7 11v2h10v-2H7zm5-9C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8z"/></svg>
|
||||||
|
After Width: | Height: | Size: 296 B |
282
dist/public/styles.css
vendored
282
dist/public/styles.css
vendored
@ -554,30 +554,138 @@ video {
|
|||||||
--tw-contain-style: ;
|
--tw-contain-style: ;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.absolute {
|
||||||
|
position: absolute;
|
||||||
|
}
|
||||||
|
|
||||||
|
.relative {
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.left-4 {
|
||||||
|
left: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.right-4 {
|
||||||
|
right: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.top-4 {
|
||||||
|
top: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mb-1 {
|
||||||
|
margin-bottom: 0.25rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mb-10 {
|
||||||
|
margin-bottom: 2.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mb-12 {
|
||||||
|
margin-bottom: 3rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mb-16 {
|
||||||
|
margin-bottom: 4rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mb-20 {
|
||||||
|
margin-bottom: 5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mb-3 {
|
||||||
|
margin-bottom: 0.75rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mb-4 {
|
||||||
|
margin-bottom: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mb-6 {
|
||||||
|
margin-bottom: 1.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mb-8 {
|
||||||
|
margin-bottom: 2rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mt-12 {
|
||||||
|
margin-top: 3rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mt-16 {
|
||||||
|
margin-top: 4rem;
|
||||||
|
}
|
||||||
|
|
||||||
.mt-20 {
|
.mt-20 {
|
||||||
margin-top: 5rem;
|
margin-top: 5rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
.mt-6 {
|
.mt-24 {
|
||||||
margin-top: 1.5rem;
|
margin-top: 6rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mt-4 {
|
||||||
|
margin-top: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mt-64 {
|
||||||
|
margin-top: 16rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mt-8 {
|
||||||
|
margin-top: 2rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
.flex {
|
.flex {
|
||||||
display: flex;
|
display: flex;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.h-0 {
|
||||||
|
height: 0px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.h-10 {
|
||||||
|
height: 2.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.h-12 {
|
||||||
|
height: 3rem;
|
||||||
|
}
|
||||||
|
|
||||||
.h-16 {
|
.h-16 {
|
||||||
height: 4rem;
|
height: 4rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
.h-screen {
|
.h-full {
|
||||||
height: 100vh;
|
height: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.min-h-12 {
|
||||||
|
min-height: 3rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
.min-h-16 {
|
.min-h-16 {
|
||||||
min-height: 4rem;
|
min-height: 4rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.w-0 {
|
||||||
|
width: 0px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.w-10 {
|
||||||
|
width: 2.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.w-16 {
|
||||||
|
width: 4rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.w-24 {
|
||||||
|
width: 6rem;
|
||||||
|
}
|
||||||
|
|
||||||
.w-8 {
|
.w-8 {
|
||||||
width: 2rem;
|
width: 2rem;
|
||||||
}
|
}
|
||||||
@ -594,6 +702,10 @@ video {
|
|||||||
min-width: 14rem;
|
min-width: 14rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.max-w-36 {
|
||||||
|
max-width: 9rem;
|
||||||
|
}
|
||||||
|
|
||||||
.max-w-xl {
|
.max-w-xl {
|
||||||
max-width: 36rem;
|
max-width: 36rem;
|
||||||
}
|
}
|
||||||
@ -602,14 +714,32 @@ video {
|
|||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.items-start {
|
||||||
|
align-items: flex-start;
|
||||||
|
}
|
||||||
|
|
||||||
.items-center {
|
.items-center {
|
||||||
align-items: center;
|
align-items: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.justify-start {
|
||||||
|
justify-content: flex-start;
|
||||||
|
}
|
||||||
|
|
||||||
.justify-center {
|
.justify-center {
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.justify-between {
|
||||||
|
justify-content: space-between;
|
||||||
|
}
|
||||||
|
|
||||||
|
.space-x-4 > :not([hidden]) ~ :not([hidden]) {
|
||||||
|
--tw-space-x-reverse: 0;
|
||||||
|
margin-right: calc(1rem * var(--tw-space-x-reverse));
|
||||||
|
margin-left: calc(1rem * calc(1 - var(--tw-space-x-reverse)));
|
||||||
|
}
|
||||||
|
|
||||||
.space-y-1 > :not([hidden]) ~ :not([hidden]) {
|
.space-y-1 > :not([hidden]) ~ :not([hidden]) {
|
||||||
--tw-space-y-reverse: 0;
|
--tw-space-y-reverse: 0;
|
||||||
margin-top: calc(0.25rem * calc(1 - var(--tw-space-y-reverse)));
|
margin-top: calc(0.25rem * calc(1 - var(--tw-space-y-reverse)));
|
||||||
@ -632,25 +762,61 @@ video {
|
|||||||
border-radius: 0.375rem;
|
border-radius: 0.375rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.border-2 {
|
||||||
|
border-width: 2px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.border-b {
|
||||||
|
border-bottom-width: 1px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.border-white {
|
||||||
|
--tw-border-opacity: 1;
|
||||||
|
border-color: rgb(255 255 255 / var(--tw-border-opacity));
|
||||||
|
}
|
||||||
|
|
||||||
.bg-black {
|
.bg-black {
|
||||||
--tw-bg-opacity: 1;
|
--tw-bg-opacity: 1;
|
||||||
background-color: rgb(0 0 0 / var(--tw-bg-opacity));
|
background-color: rgb(0 0 0 / var(--tw-bg-opacity));
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.bg-transparent {
|
||||||
|
background-color: transparent;
|
||||||
|
}
|
||||||
|
|
||||||
.px-12 {
|
.px-12 {
|
||||||
padding-left: 3rem;
|
padding-left: 3rem;
|
||||||
padding-right: 3rem;
|
padding-right: 3rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.px-6 {
|
||||||
|
padding-left: 1.5rem;
|
||||||
|
padding-right: 1.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
.text-center {
|
.text-center {
|
||||||
text-align: center;
|
text-align: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.text-start {
|
||||||
|
text-align: start;
|
||||||
|
}
|
||||||
|
|
||||||
|
.text-2xl {
|
||||||
|
font-size: 1.5rem;
|
||||||
|
line-height: 2rem;
|
||||||
|
}
|
||||||
|
|
||||||
.text-3xl {
|
.text-3xl {
|
||||||
font-size: 1.875rem;
|
font-size: 1.875rem;
|
||||||
line-height: 2.25rem;
|
line-height: 2.25rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.text-lg {
|
||||||
|
font-size: 1.125rem;
|
||||||
|
line-height: 1.75rem;
|
||||||
|
}
|
||||||
|
|
||||||
.text-xl {
|
.text-xl {
|
||||||
font-size: 1.25rem;
|
font-size: 1.25rem;
|
||||||
line-height: 1.75rem;
|
line-height: 1.75rem;
|
||||||
@ -686,8 +852,50 @@ video {
|
|||||||
transition-duration: 150ms;
|
transition-duration: 150ms;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.duration-700 {
|
||||||
|
transition-duration: 700ms;
|
||||||
|
}
|
||||||
|
|
||||||
|
.cx-date-picker {
|
||||||
|
position: relative;
|
||||||
|
display: inline-block;
|
||||||
|
}
|
||||||
|
|
||||||
|
.cx-date-picker[type="date"]::-webkit-calendar-picker-indicator {
|
||||||
|
background: transparent;
|
||||||
|
bottom: 0;
|
||||||
|
color: transparent;
|
||||||
|
cursor: pointer;
|
||||||
|
height: auto;
|
||||||
|
left: 0;
|
||||||
|
position: absolute;
|
||||||
|
right: 0;
|
||||||
|
top: 0;
|
||||||
|
width: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.text-danger {
|
||||||
|
color: rgba(255, 82, 82,1.0);
|
||||||
|
}
|
||||||
|
|
||||||
|
.bg-danger {
|
||||||
|
background-color: rgba(255, 82, 82,1.0);
|
||||||
|
}
|
||||||
|
|
||||||
.min-height {
|
.min-height {
|
||||||
min-height: 600px;
|
min-height: 500px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.text-tertiary {
|
||||||
|
color: rgba(132, 129, 122,1.0);
|
||||||
|
}
|
||||||
|
|
||||||
|
.bg-tertriary {
|
||||||
|
background-color: rgba(132, 129, 122,1.0);
|
||||||
|
}
|
||||||
|
|
||||||
|
.border-primary {
|
||||||
|
border-color: rgba(51,217,178,1.0);
|
||||||
}
|
}
|
||||||
|
|
||||||
.text-primary {
|
.text-primary {
|
||||||
@ -722,6 +930,16 @@ video {
|
|||||||
background-color: rgba(52, 172, 224,1.0);
|
background-color: rgba(52, 172, 224,1.0);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.focus-within\:bg-\[\#33d9b2\]:focus-within {
|
||||||
|
--tw-bg-opacity: 1;
|
||||||
|
background-color: rgb(51 217 178 / var(--tw-bg-opacity));
|
||||||
|
}
|
||||||
|
|
||||||
|
.focus-within\:text-black:focus-within {
|
||||||
|
--tw-text-opacity: 1;
|
||||||
|
color: rgb(0 0 0 / var(--tw-text-opacity));
|
||||||
|
}
|
||||||
|
|
||||||
.hover\:-translate-y-1:hover {
|
.hover\:-translate-y-1:hover {
|
||||||
--tw-translate-y: -0.25rem;
|
--tw-translate-y: -0.25rem;
|
||||||
transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
|
transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
|
||||||
@ -731,8 +949,62 @@ video {
|
|||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.hover\:border-\[\#33d9b2\]:hover {
|
||||||
|
--tw-border-opacity: 1;
|
||||||
|
border-color: rgb(51 217 178 / var(--tw-border-opacity));
|
||||||
|
}
|
||||||
|
|
||||||
.hover\:text-white:hover {
|
.hover\:text-white:hover {
|
||||||
--tw-text-opacity: 1;
|
--tw-text-opacity: 1;
|
||||||
color: rgb(255 255 255 / var(--tw-text-opacity));
|
color: rgb(255 255 255 / var(--tw-text-opacity));
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.active\:bg-\[\#33d9b2\]:active {
|
||||||
|
--tw-bg-opacity: 1;
|
||||||
|
background-color: rgb(51 217 178 / var(--tw-bg-opacity));
|
||||||
|
}
|
||||||
|
|
||||||
|
.group:hover .group-hover\:cursor-pointer {
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (min-width: 768px) {
|
||||||
|
.md\:mt-24 {
|
||||||
|
margin-top: 6rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.md\:mt-32 {
|
||||||
|
margin-top: 8rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.md\:flex {
|
||||||
|
display: flex;
|
||||||
|
}
|
||||||
|
|
||||||
|
.md\:h-auto {
|
||||||
|
height: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.md\:w-56 {
|
||||||
|
width: 14rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.md\:min-w-56 {
|
||||||
|
min-width: 14rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.md\:flex-col {
|
||||||
|
flex-direction: column;
|
||||||
|
}
|
||||||
|
|
||||||
|
.md\:items-center {
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.md\:space-y-4 > :not([hidden]) ~ :not([hidden]) {
|
||||||
|
--tw-space-y-reverse: 0;
|
||||||
|
margin-top: calc(1rem * calc(1 - var(--tw-space-y-reverse)));
|
||||||
|
margin-bottom: calc(1rem * var(--tw-space-y-reverse));
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|||||||
@ -554,30 +554,138 @@ video {
|
|||||||
--tw-contain-style: ;
|
--tw-contain-style: ;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.absolute {
|
||||||
|
position: absolute;
|
||||||
|
}
|
||||||
|
|
||||||
|
.relative {
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.left-4 {
|
||||||
|
left: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.right-4 {
|
||||||
|
right: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.top-4 {
|
||||||
|
top: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mb-1 {
|
||||||
|
margin-bottom: 0.25rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mb-10 {
|
||||||
|
margin-bottom: 2.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mb-12 {
|
||||||
|
margin-bottom: 3rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mb-16 {
|
||||||
|
margin-bottom: 4rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mb-20 {
|
||||||
|
margin-bottom: 5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mb-3 {
|
||||||
|
margin-bottom: 0.75rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mb-4 {
|
||||||
|
margin-bottom: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mb-6 {
|
||||||
|
margin-bottom: 1.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mb-8 {
|
||||||
|
margin-bottom: 2rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mt-12 {
|
||||||
|
margin-top: 3rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mt-16 {
|
||||||
|
margin-top: 4rem;
|
||||||
|
}
|
||||||
|
|
||||||
.mt-20 {
|
.mt-20 {
|
||||||
margin-top: 5rem;
|
margin-top: 5rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
.mt-6 {
|
.mt-24 {
|
||||||
margin-top: 1.5rem;
|
margin-top: 6rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mt-4 {
|
||||||
|
margin-top: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mt-64 {
|
||||||
|
margin-top: 16rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mt-8 {
|
||||||
|
margin-top: 2rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
.flex {
|
.flex {
|
||||||
display: flex;
|
display: flex;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.h-0 {
|
||||||
|
height: 0px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.h-10 {
|
||||||
|
height: 2.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.h-12 {
|
||||||
|
height: 3rem;
|
||||||
|
}
|
||||||
|
|
||||||
.h-16 {
|
.h-16 {
|
||||||
height: 4rem;
|
height: 4rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
.h-screen {
|
.h-full {
|
||||||
height: 100vh;
|
height: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.min-h-12 {
|
||||||
|
min-height: 3rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
.min-h-16 {
|
.min-h-16 {
|
||||||
min-height: 4rem;
|
min-height: 4rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.w-0 {
|
||||||
|
width: 0px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.w-10 {
|
||||||
|
width: 2.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.w-16 {
|
||||||
|
width: 4rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.w-24 {
|
||||||
|
width: 6rem;
|
||||||
|
}
|
||||||
|
|
||||||
.w-8 {
|
.w-8 {
|
||||||
width: 2rem;
|
width: 2rem;
|
||||||
}
|
}
|
||||||
@ -594,6 +702,10 @@ video {
|
|||||||
min-width: 14rem;
|
min-width: 14rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.max-w-36 {
|
||||||
|
max-width: 9rem;
|
||||||
|
}
|
||||||
|
|
||||||
.max-w-xl {
|
.max-w-xl {
|
||||||
max-width: 36rem;
|
max-width: 36rem;
|
||||||
}
|
}
|
||||||
@ -602,14 +714,32 @@ video {
|
|||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.items-start {
|
||||||
|
align-items: flex-start;
|
||||||
|
}
|
||||||
|
|
||||||
.items-center {
|
.items-center {
|
||||||
align-items: center;
|
align-items: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.justify-start {
|
||||||
|
justify-content: flex-start;
|
||||||
|
}
|
||||||
|
|
||||||
.justify-center {
|
.justify-center {
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.justify-between {
|
||||||
|
justify-content: space-between;
|
||||||
|
}
|
||||||
|
|
||||||
|
.space-x-4 > :not([hidden]) ~ :not([hidden]) {
|
||||||
|
--tw-space-x-reverse: 0;
|
||||||
|
margin-right: calc(1rem * var(--tw-space-x-reverse));
|
||||||
|
margin-left: calc(1rem * calc(1 - var(--tw-space-x-reverse)));
|
||||||
|
}
|
||||||
|
|
||||||
.space-y-1 > :not([hidden]) ~ :not([hidden]) {
|
.space-y-1 > :not([hidden]) ~ :not([hidden]) {
|
||||||
--tw-space-y-reverse: 0;
|
--tw-space-y-reverse: 0;
|
||||||
margin-top: calc(0.25rem * calc(1 - var(--tw-space-y-reverse)));
|
margin-top: calc(0.25rem * calc(1 - var(--tw-space-y-reverse)));
|
||||||
@ -632,25 +762,61 @@ video {
|
|||||||
border-radius: 0.375rem;
|
border-radius: 0.375rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.border-2 {
|
||||||
|
border-width: 2px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.border-b {
|
||||||
|
border-bottom-width: 1px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.border-white {
|
||||||
|
--tw-border-opacity: 1;
|
||||||
|
border-color: rgb(255 255 255 / var(--tw-border-opacity));
|
||||||
|
}
|
||||||
|
|
||||||
.bg-black {
|
.bg-black {
|
||||||
--tw-bg-opacity: 1;
|
--tw-bg-opacity: 1;
|
||||||
background-color: rgb(0 0 0 / var(--tw-bg-opacity));
|
background-color: rgb(0 0 0 / var(--tw-bg-opacity));
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.bg-transparent {
|
||||||
|
background-color: transparent;
|
||||||
|
}
|
||||||
|
|
||||||
.px-12 {
|
.px-12 {
|
||||||
padding-left: 3rem;
|
padding-left: 3rem;
|
||||||
padding-right: 3rem;
|
padding-right: 3rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.px-6 {
|
||||||
|
padding-left: 1.5rem;
|
||||||
|
padding-right: 1.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
.text-center {
|
.text-center {
|
||||||
text-align: center;
|
text-align: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.text-start {
|
||||||
|
text-align: start;
|
||||||
|
}
|
||||||
|
|
||||||
|
.text-2xl {
|
||||||
|
font-size: 1.5rem;
|
||||||
|
line-height: 2rem;
|
||||||
|
}
|
||||||
|
|
||||||
.text-3xl {
|
.text-3xl {
|
||||||
font-size: 1.875rem;
|
font-size: 1.875rem;
|
||||||
line-height: 2.25rem;
|
line-height: 2.25rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.text-lg {
|
||||||
|
font-size: 1.125rem;
|
||||||
|
line-height: 1.75rem;
|
||||||
|
}
|
||||||
|
|
||||||
.text-xl {
|
.text-xl {
|
||||||
font-size: 1.25rem;
|
font-size: 1.25rem;
|
||||||
line-height: 1.75rem;
|
line-height: 1.75rem;
|
||||||
@ -686,8 +852,50 @@ video {
|
|||||||
transition-duration: 150ms;
|
transition-duration: 150ms;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.duration-700 {
|
||||||
|
transition-duration: 700ms;
|
||||||
|
}
|
||||||
|
|
||||||
|
.cx-date-picker {
|
||||||
|
position: relative;
|
||||||
|
display: inline-block;
|
||||||
|
}
|
||||||
|
|
||||||
|
.cx-date-picker[type="date"]::-webkit-calendar-picker-indicator {
|
||||||
|
background: transparent;
|
||||||
|
bottom: 0;
|
||||||
|
color: transparent;
|
||||||
|
cursor: pointer;
|
||||||
|
height: auto;
|
||||||
|
left: 0;
|
||||||
|
position: absolute;
|
||||||
|
right: 0;
|
||||||
|
top: 0;
|
||||||
|
width: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.text-danger {
|
||||||
|
color: rgba(255, 82, 82,1.0);
|
||||||
|
}
|
||||||
|
|
||||||
|
.bg-danger {
|
||||||
|
background-color: rgba(255, 82, 82,1.0);
|
||||||
|
}
|
||||||
|
|
||||||
.min-height {
|
.min-height {
|
||||||
min-height: 600px;
|
min-height: 500px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.text-tertiary {
|
||||||
|
color: rgba(132, 129, 122,1.0);
|
||||||
|
}
|
||||||
|
|
||||||
|
.bg-tertriary {
|
||||||
|
background-color: rgba(132, 129, 122,1.0);
|
||||||
|
}
|
||||||
|
|
||||||
|
.border-primary {
|
||||||
|
border-color: rgba(51,217,178,1.0);
|
||||||
}
|
}
|
||||||
|
|
||||||
.text-primary {
|
.text-primary {
|
||||||
@ -722,6 +930,16 @@ video {
|
|||||||
background-color: rgba(52, 172, 224,1.0);
|
background-color: rgba(52, 172, 224,1.0);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.focus-within\:bg-\[\#33d9b2\]:focus-within {
|
||||||
|
--tw-bg-opacity: 1;
|
||||||
|
background-color: rgb(51 217 178 / var(--tw-bg-opacity));
|
||||||
|
}
|
||||||
|
|
||||||
|
.focus-within\:text-black:focus-within {
|
||||||
|
--tw-text-opacity: 1;
|
||||||
|
color: rgb(0 0 0 / var(--tw-text-opacity));
|
||||||
|
}
|
||||||
|
|
||||||
.hover\:-translate-y-1:hover {
|
.hover\:-translate-y-1:hover {
|
||||||
--tw-translate-y: -0.25rem;
|
--tw-translate-y: -0.25rem;
|
||||||
transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
|
transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
|
||||||
@ -731,8 +949,62 @@ video {
|
|||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.hover\:border-\[\#33d9b2\]:hover {
|
||||||
|
--tw-border-opacity: 1;
|
||||||
|
border-color: rgb(51 217 178 / var(--tw-border-opacity));
|
||||||
|
}
|
||||||
|
|
||||||
.hover\:text-white:hover {
|
.hover\:text-white:hover {
|
||||||
--tw-text-opacity: 1;
|
--tw-text-opacity: 1;
|
||||||
color: rgb(255 255 255 / var(--tw-text-opacity));
|
color: rgb(255 255 255 / var(--tw-text-opacity));
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.active\:bg-\[\#33d9b2\]:active {
|
||||||
|
--tw-bg-opacity: 1;
|
||||||
|
background-color: rgb(51 217 178 / var(--tw-bg-opacity));
|
||||||
|
}
|
||||||
|
|
||||||
|
.group:hover .group-hover\:cursor-pointer {
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (min-width: 768px) {
|
||||||
|
.md\:mt-24 {
|
||||||
|
margin-top: 6rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.md\:mt-32 {
|
||||||
|
margin-top: 8rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.md\:flex {
|
||||||
|
display: flex;
|
||||||
|
}
|
||||||
|
|
||||||
|
.md\:h-auto {
|
||||||
|
height: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.md\:w-56 {
|
||||||
|
width: 14rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.md\:min-w-56 {
|
||||||
|
min-width: 14rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.md\:flex-col {
|
||||||
|
flex-direction: column;
|
||||||
|
}
|
||||||
|
|
||||||
|
.md\:items-center {
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.md\:space-y-4 > :not([hidden]) ~ :not([hidden]) {
|
||||||
|
--tw-space-y-reverse: 0;
|
||||||
|
margin-top: calc(1rem * calc(1 - var(--tw-space-y-reverse)));
|
||||||
|
margin-bottom: calc(1rem * var(--tw-space-y-reverse));
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
@ -8,6 +8,6 @@
|
|||||||
<link data-trunk href="./public/favicon.ico" rel="icon" type="image/x-icon">
|
<link data-trunk href="./public/favicon.ico" rel="icon" type="image/x-icon">
|
||||||
<link data-trunk rel="copy-dir" href="public">
|
<link data-trunk rel="copy-dir" href="public">
|
||||||
</head>
|
</head>
|
||||||
<body class="bg-black text-white min-height">
|
<body class="bg-black text-white ">
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|||||||
39
input.css
39
input.css
@ -2,8 +2,45 @@
|
|||||||
@tailwind components;
|
@tailwind components;
|
||||||
@tailwind utilities;
|
@tailwind utilities;
|
||||||
|
|
||||||
|
.cx-date-picker {
|
||||||
|
@apply inline-block relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.cx-date-picker[type="date"]::-webkit-calendar-picker-indicator {
|
||||||
|
background: transparent;
|
||||||
|
bottom: 0;
|
||||||
|
color: transparent;
|
||||||
|
cursor: pointer;
|
||||||
|
height: auto;
|
||||||
|
left: 0;
|
||||||
|
position: absolute;
|
||||||
|
right: 0;
|
||||||
|
top: 0;
|
||||||
|
width: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.text-danger {
|
||||||
|
color: rgba(255, 82, 82,1.0);
|
||||||
|
}
|
||||||
|
|
||||||
|
.bg-danger {
|
||||||
|
background-color: rgba(255, 82, 82,1.0);
|
||||||
|
}
|
||||||
|
|
||||||
.min-height {
|
.min-height {
|
||||||
min-height: 600px;
|
min-height: 500px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.text-tertiary {
|
||||||
|
color: rgba(132, 129, 122,1.0);
|
||||||
|
}
|
||||||
|
|
||||||
|
.bg-tertriary {
|
||||||
|
background-color: rgba(132, 129, 122,1.0);
|
||||||
|
}
|
||||||
|
|
||||||
|
.border-primary {
|
||||||
|
border-color: rgba(51,217,178,1.0);
|
||||||
}
|
}
|
||||||
|
|
||||||
.text-primary {
|
.text-primary {
|
||||||
|
|||||||
1
public/add.svg
Normal file
1
public/add.svg
Normal file
@ -0,0 +1 @@
|
|||||||
|
<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="#FFFFFF"><path d="M0 0h24v24H0z" fill="none"/><path d="M13 7h-2v4H7v2h4v4h2v-4h4v-2h-4V7zm-1-5C6.49 2 2 6.49 2 12s4.49 10 10 10 10-4.49 10-10S17.51 2 12 2zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8z"/></svg>
|
||||||
|
After Width: | Height: | Size: 315 B |
1
public/remove.svg
Normal file
1
public/remove.svg
Normal file
@ -0,0 +1 @@
|
|||||||
|
<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="#FFFFFF"><path d="M0 0h24v24H0z" fill="none"/><path d="M7 11v2h10v-2H7zm5-9C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8z"/></svg>
|
||||||
|
After Width: | Height: | Size: 296 B |
@ -554,30 +554,138 @@ video {
|
|||||||
--tw-contain-style: ;
|
--tw-contain-style: ;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.absolute {
|
||||||
|
position: absolute;
|
||||||
|
}
|
||||||
|
|
||||||
|
.relative {
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.left-4 {
|
||||||
|
left: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.right-4 {
|
||||||
|
right: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.top-4 {
|
||||||
|
top: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mb-1 {
|
||||||
|
margin-bottom: 0.25rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mb-10 {
|
||||||
|
margin-bottom: 2.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mb-12 {
|
||||||
|
margin-bottom: 3rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mb-16 {
|
||||||
|
margin-bottom: 4rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mb-20 {
|
||||||
|
margin-bottom: 5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mb-3 {
|
||||||
|
margin-bottom: 0.75rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mb-4 {
|
||||||
|
margin-bottom: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mb-6 {
|
||||||
|
margin-bottom: 1.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mb-8 {
|
||||||
|
margin-bottom: 2rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mt-12 {
|
||||||
|
margin-top: 3rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mt-16 {
|
||||||
|
margin-top: 4rem;
|
||||||
|
}
|
||||||
|
|
||||||
.mt-20 {
|
.mt-20 {
|
||||||
margin-top: 5rem;
|
margin-top: 5rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
.mt-6 {
|
.mt-24 {
|
||||||
margin-top: 1.5rem;
|
margin-top: 6rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mt-4 {
|
||||||
|
margin-top: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mt-64 {
|
||||||
|
margin-top: 16rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mt-8 {
|
||||||
|
margin-top: 2rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
.flex {
|
.flex {
|
||||||
display: flex;
|
display: flex;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.h-0 {
|
||||||
|
height: 0px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.h-10 {
|
||||||
|
height: 2.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.h-12 {
|
||||||
|
height: 3rem;
|
||||||
|
}
|
||||||
|
|
||||||
.h-16 {
|
.h-16 {
|
||||||
height: 4rem;
|
height: 4rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
.h-screen {
|
.h-full {
|
||||||
height: 100vh;
|
height: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.min-h-12 {
|
||||||
|
min-height: 3rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
.min-h-16 {
|
.min-h-16 {
|
||||||
min-height: 4rem;
|
min-height: 4rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.w-0 {
|
||||||
|
width: 0px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.w-10 {
|
||||||
|
width: 2.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.w-16 {
|
||||||
|
width: 4rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.w-24 {
|
||||||
|
width: 6rem;
|
||||||
|
}
|
||||||
|
|
||||||
.w-8 {
|
.w-8 {
|
||||||
width: 2rem;
|
width: 2rem;
|
||||||
}
|
}
|
||||||
@ -594,6 +702,10 @@ video {
|
|||||||
min-width: 14rem;
|
min-width: 14rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.max-w-36 {
|
||||||
|
max-width: 9rem;
|
||||||
|
}
|
||||||
|
|
||||||
.max-w-xl {
|
.max-w-xl {
|
||||||
max-width: 36rem;
|
max-width: 36rem;
|
||||||
}
|
}
|
||||||
@ -602,14 +714,32 @@ video {
|
|||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.items-start {
|
||||||
|
align-items: flex-start;
|
||||||
|
}
|
||||||
|
|
||||||
.items-center {
|
.items-center {
|
||||||
align-items: center;
|
align-items: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.justify-start {
|
||||||
|
justify-content: flex-start;
|
||||||
|
}
|
||||||
|
|
||||||
.justify-center {
|
.justify-center {
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.justify-between {
|
||||||
|
justify-content: space-between;
|
||||||
|
}
|
||||||
|
|
||||||
|
.space-x-4 > :not([hidden]) ~ :not([hidden]) {
|
||||||
|
--tw-space-x-reverse: 0;
|
||||||
|
margin-right: calc(1rem * var(--tw-space-x-reverse));
|
||||||
|
margin-left: calc(1rem * calc(1 - var(--tw-space-x-reverse)));
|
||||||
|
}
|
||||||
|
|
||||||
.space-y-1 > :not([hidden]) ~ :not([hidden]) {
|
.space-y-1 > :not([hidden]) ~ :not([hidden]) {
|
||||||
--tw-space-y-reverse: 0;
|
--tw-space-y-reverse: 0;
|
||||||
margin-top: calc(0.25rem * calc(1 - var(--tw-space-y-reverse)));
|
margin-top: calc(0.25rem * calc(1 - var(--tw-space-y-reverse)));
|
||||||
@ -632,25 +762,61 @@ video {
|
|||||||
border-radius: 0.375rem;
|
border-radius: 0.375rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.border-2 {
|
||||||
|
border-width: 2px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.border-b {
|
||||||
|
border-bottom-width: 1px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.border-white {
|
||||||
|
--tw-border-opacity: 1;
|
||||||
|
border-color: rgb(255 255 255 / var(--tw-border-opacity));
|
||||||
|
}
|
||||||
|
|
||||||
.bg-black {
|
.bg-black {
|
||||||
--tw-bg-opacity: 1;
|
--tw-bg-opacity: 1;
|
||||||
background-color: rgb(0 0 0 / var(--tw-bg-opacity));
|
background-color: rgb(0 0 0 / var(--tw-bg-opacity));
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.bg-transparent {
|
||||||
|
background-color: transparent;
|
||||||
|
}
|
||||||
|
|
||||||
.px-12 {
|
.px-12 {
|
||||||
padding-left: 3rem;
|
padding-left: 3rem;
|
||||||
padding-right: 3rem;
|
padding-right: 3rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.px-6 {
|
||||||
|
padding-left: 1.5rem;
|
||||||
|
padding-right: 1.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
.text-center {
|
.text-center {
|
||||||
text-align: center;
|
text-align: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.text-start {
|
||||||
|
text-align: start;
|
||||||
|
}
|
||||||
|
|
||||||
|
.text-2xl {
|
||||||
|
font-size: 1.5rem;
|
||||||
|
line-height: 2rem;
|
||||||
|
}
|
||||||
|
|
||||||
.text-3xl {
|
.text-3xl {
|
||||||
font-size: 1.875rem;
|
font-size: 1.875rem;
|
||||||
line-height: 2.25rem;
|
line-height: 2.25rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.text-lg {
|
||||||
|
font-size: 1.125rem;
|
||||||
|
line-height: 1.75rem;
|
||||||
|
}
|
||||||
|
|
||||||
.text-xl {
|
.text-xl {
|
||||||
font-size: 1.25rem;
|
font-size: 1.25rem;
|
||||||
line-height: 1.75rem;
|
line-height: 1.75rem;
|
||||||
@ -686,8 +852,50 @@ video {
|
|||||||
transition-duration: 150ms;
|
transition-duration: 150ms;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.duration-700 {
|
||||||
|
transition-duration: 700ms;
|
||||||
|
}
|
||||||
|
|
||||||
|
.cx-date-picker {
|
||||||
|
position: relative;
|
||||||
|
display: inline-block;
|
||||||
|
}
|
||||||
|
|
||||||
|
.cx-date-picker[type="date"]::-webkit-calendar-picker-indicator {
|
||||||
|
background: transparent;
|
||||||
|
bottom: 0;
|
||||||
|
color: transparent;
|
||||||
|
cursor: pointer;
|
||||||
|
height: auto;
|
||||||
|
left: 0;
|
||||||
|
position: absolute;
|
||||||
|
right: 0;
|
||||||
|
top: 0;
|
||||||
|
width: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.text-danger {
|
||||||
|
color: rgba(255, 82, 82,1.0);
|
||||||
|
}
|
||||||
|
|
||||||
|
.bg-danger {
|
||||||
|
background-color: rgba(255, 82, 82,1.0);
|
||||||
|
}
|
||||||
|
|
||||||
.min-height {
|
.min-height {
|
||||||
min-height: 600px;
|
min-height: 500px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.text-tertiary {
|
||||||
|
color: rgba(132, 129, 122,1.0);
|
||||||
|
}
|
||||||
|
|
||||||
|
.bg-tertriary {
|
||||||
|
background-color: rgba(132, 129, 122,1.0);
|
||||||
|
}
|
||||||
|
|
||||||
|
.border-primary {
|
||||||
|
border-color: rgba(51,217,178,1.0);
|
||||||
}
|
}
|
||||||
|
|
||||||
.text-primary {
|
.text-primary {
|
||||||
@ -722,6 +930,16 @@ video {
|
|||||||
background-color: rgba(52, 172, 224,1.0);
|
background-color: rgba(52, 172, 224,1.0);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.focus-within\:bg-\[\#33d9b2\]:focus-within {
|
||||||
|
--tw-bg-opacity: 1;
|
||||||
|
background-color: rgb(51 217 178 / var(--tw-bg-opacity));
|
||||||
|
}
|
||||||
|
|
||||||
|
.focus-within\:text-black:focus-within {
|
||||||
|
--tw-text-opacity: 1;
|
||||||
|
color: rgb(0 0 0 / var(--tw-text-opacity));
|
||||||
|
}
|
||||||
|
|
||||||
.hover\:-translate-y-1:hover {
|
.hover\:-translate-y-1:hover {
|
||||||
--tw-translate-y: -0.25rem;
|
--tw-translate-y: -0.25rem;
|
||||||
transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
|
transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
|
||||||
@ -731,8 +949,62 @@ video {
|
|||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.hover\:border-\[\#33d9b2\]:hover {
|
||||||
|
--tw-border-opacity: 1;
|
||||||
|
border-color: rgb(51 217 178 / var(--tw-border-opacity));
|
||||||
|
}
|
||||||
|
|
||||||
.hover\:text-white:hover {
|
.hover\:text-white:hover {
|
||||||
--tw-text-opacity: 1;
|
--tw-text-opacity: 1;
|
||||||
color: rgb(255 255 255 / var(--tw-text-opacity));
|
color: rgb(255 255 255 / var(--tw-text-opacity));
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.active\:bg-\[\#33d9b2\]:active {
|
||||||
|
--tw-bg-opacity: 1;
|
||||||
|
background-color: rgb(51 217 178 / var(--tw-bg-opacity));
|
||||||
|
}
|
||||||
|
|
||||||
|
.group:hover .group-hover\:cursor-pointer {
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (min-width: 768px) {
|
||||||
|
.md\:mt-24 {
|
||||||
|
margin-top: 6rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.md\:mt-32 {
|
||||||
|
margin-top: 8rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.md\:flex {
|
||||||
|
display: flex;
|
||||||
|
}
|
||||||
|
|
||||||
|
.md\:h-auto {
|
||||||
|
height: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.md\:w-56 {
|
||||||
|
width: 14rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.md\:min-w-56 {
|
||||||
|
min-width: 14rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.md\:flex-col {
|
||||||
|
flex-direction: column;
|
||||||
|
}
|
||||||
|
|
||||||
|
.md\:items-center {
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.md\:space-y-4 > :not([hidden]) ~ :not([hidden]) {
|
||||||
|
--tw-space-y-reverse: 0;
|
||||||
|
margin-top: calc(1rem * calc(1 - var(--tw-space-y-reverse)));
|
||||||
|
margin-bottom: calc(1rem * var(--tw-space-y-reverse));
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|||||||
12
src/pages.rs
12
src/pages.rs
@ -1,5 +1,17 @@
|
|||||||
mod signup;
|
mod signup;
|
||||||
pub use signup::SignUp;
|
pub use signup::SignUp;
|
||||||
|
|
||||||
|
mod verify;
|
||||||
|
pub use verify::Verify;
|
||||||
|
|
||||||
|
mod deceased;
|
||||||
|
pub use deceased::Deceased;
|
||||||
|
|
||||||
|
mod clues;
|
||||||
|
pub use clues::Clues;
|
||||||
|
|
||||||
|
mod register;
|
||||||
|
pub use register::Register;
|
||||||
|
|
||||||
mod home;
|
mod home;
|
||||||
pub use home::Home;
|
pub use home::Home;
|
||||||
|
|||||||
94
src/pages/clues.rs
Normal file
94
src/pages/clues.rs
Normal file
@ -0,0 +1,94 @@
|
|||||||
|
use yew::{function_component, html, Html};
|
||||||
|
use yew_router::components::Link;
|
||||||
|
|
||||||
|
use crate::router::Route;
|
||||||
|
|
||||||
|
#[function_component]
|
||||||
|
pub fn Clues() -> Html {
|
||||||
|
html! {
|
||||||
|
<div class="px-6 mt-4 md:mt-24">
|
||||||
|
<h3 class="text-primary
|
||||||
|
hover:bg-text-dark
|
||||||
|
hover:text-white
|
||||||
|
hover:-translate-y-1
|
||||||
|
hover:cursor-pointer
|
||||||
|
transition duration-150
|
||||||
|
font-bold text-xl
|
||||||
|
max-w-xl
|
||||||
|
rounded-md
|
||||||
|
text-black
|
||||||
|
w-full
|
||||||
|
absolute
|
||||||
|
top-4
|
||||||
|
left-4
|
||||||
|
">
|
||||||
|
<Link<Route> to={Route::SignUp}>
|
||||||
|
<div class="flex items-center"><svg class="w-8 " xmlns="http://www.w3.org/2000/svg" height="currentHeight" viewBox="0 0 24 24" width="currentWidth" fill="currentColor"><path d="M0 0h24v24H0z" fill="none"/><path d="M15.41 7.41L14 6l-6 6 6 6 1.41-1.41L10.83 12z"/></svg>{"Zurück"}</div>
|
||||||
|
</Link<Route>>
|
||||||
|
</h3>
|
||||||
|
<img src="public/digitaler-frieden_logo.jpg" alt="logo digitaler frieden" class="absolute top-4 right-4 md:min-w-56 md:w-56 w-0"/>
|
||||||
|
<div class="mt-16 md:mt-32 flex flex-col items-center justify-between">
|
||||||
|
<div class="flex flex-col items-start">
|
||||||
|
<h3 class="text-3xl font-bold mb-4">{"Spurhinweise hinzufügen"}</h3>
|
||||||
|
<p class="mb-6">{"Füge alle dir bekannten E-Mail Adressen und Telefonnummern hinzu."}</p>
|
||||||
|
<div class="flex flex-col justify-between items-center w-full mb-10 space-y-4 md:space-y-4">
|
||||||
|
<div class="flex justify-between w-full relative">
|
||||||
|
<h3 class="font-bold text-2xl ">{"E-Mail Adressen"}</h3>
|
||||||
|
<svg class="text-primary w-10 absolute right-4" xmlns="http://www.w3.org/2000/svg" height="currentHeight" viewBox="0 0 24 24" width="currentWidth" fill="currentColor"><path d="M0 0h24v24H0z" fill="none"/><path d="M13 7h-2v4H7v2h4v4h2v-4h4v-2h-4V7zm-1-5C6.49 2 2 6.49 2 12s4.49 10 10 10 10-4.49 10-10S17.51 2 12 2zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8z"/></svg>
|
||||||
|
</div>
|
||||||
|
<div class="flex justify-start items-center space-x-4 w-full">
|
||||||
|
<svg class="w-10 text-danger" xmlns="http://www.w3.org/2000/svg" height="currentHeight" viewBox="0 0 24 24" width="currentWidth" fill="currentColor"><path d="M0 0h24v24H0z" fill="none"/><path d="M7 11v2h10v-2H7zm5-9C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8z"/></svg>
|
||||||
|
<p class="text-md">{"max.mustermann@example.com"}</p>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<div class="flex justify-start items-center w-full space-x-4">
|
||||||
|
|
||||||
|
<svg class="w-10 text-danger" xmlns="http://www.w3.org/2000/svg" height="currentHeight" viewBox="0 0 24 24" width="currentWidth" fill="currentColor"><path d="M0 0h24v24H0z" fill="none"/><path d="M7 11v2h10v-2H7zm5-9C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8z"/></svg>
|
||||||
|
<p class="text-md">{"jon.doe@blub.com"}</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<div class="flex flex-col justify-center items-center w-full mb-10 space-y-4 md:space-y-4">
|
||||||
|
<div class="flex justify-between w-full relative">
|
||||||
|
<h3 class="font-bold text-2xl ">{"Telefonnummern"}</h3>
|
||||||
|
<svg class="text-primary w-10 absolute right-4" xmlns="http://www.w3.org/2000/svg" height="currentHeight" viewBox="0 0 24 24" width="currentWidth" fill="currentColor"><path d="M0 0h24v24H0z" fill="none"/><path d="M13 7h-2v4H7v2h4v4h2v-4h4v-2h-4V7zm-1-5C6.49 2 2 6.49 2 12s4.49 10 10 10 10-4.49 10-10S17.51 2 12 2zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8z"/></svg>
|
||||||
|
</div>
|
||||||
|
<div class="flex justify-start items-center space-x-4 w-full">
|
||||||
|
<svg class="w-10 text-danger" xmlns="http://www.w3.org/2000/svg" height="currentHeight" viewBox="0 0 24 24" width="currentWidth" fill="currentColor"><path d="M0 0h24v24H0z" fill="none"/><path d="M7 11v2h10v-2H7zm5-9C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8z"/></svg>
|
||||||
|
<p class="text-md">{"+49 1234 567 890"}</p>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<div class="flex justify-start items-center w-full space-x-4">
|
||||||
|
|
||||||
|
<svg class="w-10 text-danger" xmlns="http://www.w3.org/2000/svg" height="currentHeight" viewBox="0 0 24 24" width="currentWidth" fill="currentColor"><path d="M0 0h24v24H0z" fill="none"/><path d="M7 11v2h10v-2H7zm5-9C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8z"/></svg>
|
||||||
|
<p class="text-md">{"+49 9876 543 210"}</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<div class="flex justify-center max-w-xl w-full mb-6">
|
||||||
|
<div class="bg-primary
|
||||||
|
hover:bg-primary-dark
|
||||||
|
hover:text-white
|
||||||
|
hover:-translate-y-1
|
||||||
|
hover:cursor-pointer
|
||||||
|
transition duration-150
|
||||||
|
font-bold text-xl
|
||||||
|
max-w-xl
|
||||||
|
rounded-md
|
||||||
|
text-black
|
||||||
|
text-center
|
||||||
|
w-full
|
||||||
|
min-h-16
|
||||||
|
h-16
|
||||||
|
flex justify-center items-center mb-16"
|
||||||
|
>
|
||||||
|
<Link<Route> to={Route::Register}>
|
||||||
|
{"Weiter"}
|
||||||
|
</Link<Route>>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
}
|
||||||
|
}
|
||||||
94
src/pages/deceased.rs
Normal file
94
src/pages/deceased.rs
Normal file
@ -0,0 +1,94 @@
|
|||||||
|
use yew::{function_component, html, Html};
|
||||||
|
use yew_router::components::Link;
|
||||||
|
|
||||||
|
use crate::router::Route;
|
||||||
|
|
||||||
|
#[function_component]
|
||||||
|
pub fn Deceased() -> Html {
|
||||||
|
html! {
|
||||||
|
<div class="px-6 mt-20">
|
||||||
|
<h3 class="text-primary
|
||||||
|
hover:bg-text-dark
|
||||||
|
hover:text-white
|
||||||
|
hover:-translate-y-1
|
||||||
|
hover:cursor-pointer
|
||||||
|
transition duration-150
|
||||||
|
font-bold text-xl
|
||||||
|
max-w-xl
|
||||||
|
rounded-md
|
||||||
|
text-black
|
||||||
|
w-full
|
||||||
|
absolute
|
||||||
|
top-4
|
||||||
|
left-4
|
||||||
|
">
|
||||||
|
<Link<Route> to={Route::Home}>
|
||||||
|
<div class="flex items-center"><svg class="w-8 " xmlns="http://www.w3.org/2000/svg" height="currentHeight" viewBox="0 0 24 24" width="currentWidth" fill="currentColor"><path d="M0 0h24v24H0z" fill="none"/><path d="M15.41 7.41L14 6l-6 6 6 6 1.41-1.41L10.83 12z"/></svg>{"Zurück"}</div>
|
||||||
|
</Link<Route>>
|
||||||
|
</h3>
|
||||||
|
<img src="public/digitaler-frieden_logo.jpg" alt="logo digitaler frieden" class="absolute top-4 right-4 md:-w-56 md:w-56 md:h-auto w-0 h-0"/>
|
||||||
|
<div class="-height mt-12 flex flex-col items-center">
|
||||||
|
<h3 class="text-3xl font-bold mb-6">{"Verstorbene Person"}</h3>
|
||||||
|
<div class="group max-w-xl w-full mb-4">
|
||||||
|
<p class="text-start text-md mb-1">{"Vorname"}</p>
|
||||||
|
<input class="duration-700 font-bold text-md transition group-hover:cursor-pointer bg-transparent border-white hover:border-[#33d9b2] hover:curser-pointer focus-within:bg-[#33d9b2] active:bg-[#33d9b2] border-b text-center focus-within:text-black w-full h-10 rounded-md" type="text"/>
|
||||||
|
</div>
|
||||||
|
<div class="group max-w-xl w-full mb-4">
|
||||||
|
<p class="text-start text-md mb-1">{"Nachname"}</p>
|
||||||
|
<input class="duration-700 font-bold text-md transition group-hover:cursor-pointer bg-transparent border-white hover:border-[#33d9b2] hover:curser-pointer focus-within:bg-[#33d9b2] active:bg-[#33d9b2] border-b text-center focus-within:text-black w-full h-10 rounded-md" type="text"/>
|
||||||
|
</div>
|
||||||
|
<div class="group max-w-xl w-full mb-4">
|
||||||
|
<div class="flex justify-between space-x-4">
|
||||||
|
<div class="w-full">
|
||||||
|
<p class="text-start text-md mb-1">{"Straße"}</p>
|
||||||
|
<input class="duration-700 font-bold text-md transition group-hover:cursor-pointer bg-transparent border-white hover:border-[#33d9b2] hover:curser-pointer focus-within:bg-[#33d9b2] active:bg-[#33d9b2] border-b text-center focus-within:text-black w-full h-10 rounded-md" type="text"/>
|
||||||
|
</div>
|
||||||
|
<div class="w-24">
|
||||||
|
<p class="text-start text-md mb-1 w-16">{"Nr."}</p>
|
||||||
|
<input class="duration-700 font-bold text-md transition group-hover:cursor-pointer bg-transparent border-white hover:border-[#33d9b2] hover:curser-pointer focus-within:bg-[#33d9b2] active:bg-[#33d9b2] border-b text-center focus-within:text-black w-full h-10 rounded-md" type="text"/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="group max-w-xl w-full mb-4">
|
||||||
|
<p class="text-start text-md mb-1">{"Postleitzahl"}</p>
|
||||||
|
<input class="duration-700 font-bold text-md transition group-hover:cursor-pointer bg-transparent border-white hover:border-[#33d9b2] hover:curser-pointer focus-within:bg-[#33d9b2] active:bg-[#33d9b2] border-b text-center focus-within:text-black w-full h-10 rounded-md" type="text"/>
|
||||||
|
</div>
|
||||||
|
<div class="group max-w-xl w-full mb-4">
|
||||||
|
<p class="text-start text-md mb-1">{"Ort"}</p>
|
||||||
|
<input class="duration-700 font-bold text-md transition group-hover:cursor-pointer bg-transparent border-white hover:border-[#33d9b2] hover:curser-pointer focus-within:bg-[#33d9b2] active:bg-[#33d9b2] border-b text-center focus-within:text-black w-full h-10 rounded-md" type="text"/>
|
||||||
|
</div>
|
||||||
|
<div class="group max-w-xl w-full mb-4">
|
||||||
|
<p class="text-start text-md mb-1">{"Geburtsort"}</p>
|
||||||
|
<input class="duration-700 font-bold text-md transition group-hover:cursor-pointer bg-transparent border-white hover:border-[#33d9b2] hover:curser-pointer focus-within:bg-[#33d9b2] active:bg-[#33d9b2] border-b text-center focus-within:text-black w-full h-10 rounded-md" type="text"/>
|
||||||
|
</div>
|
||||||
|
<div class="group max-w-xl w-full mb-4">
|
||||||
|
<p class="text-start text-md mb-1">{"Geburtstag"}</p>
|
||||||
|
<input class="duration-700 font-bold text-md transition group-hover:cursor-pointer bg-transparent border-white hover:border-[#33d9b2] hover:curser-pointer focus-within:bg-[#33d9b2] active:bg-[#33d9b2] border-b text-center focus-within:text-black w-full h-10 rounded-md cx-date-picker" type="date" />
|
||||||
|
</div>
|
||||||
|
<div class="group max-w-xl w-full mb-4">
|
||||||
|
<p class="text-start text-md mb-1">{"Todestag"}</p>
|
||||||
|
<input class="duration-700 font-bold text-md transition group-hover:cursor-pointer bg-transparent border-white hover:border-[#33d9b2] hover:curser-pointer focus-within:bg-[#33d9b2] active:bg-[#33d9b2] border-b text-center focus-within:text-black w-full h-10 rounded-md cx-date-picker" type="date"/>
|
||||||
|
</div>
|
||||||
|
<div class="bg-primary
|
||||||
|
hover:bg-primary-dark
|
||||||
|
hover:text-white
|
||||||
|
hover:-translate-y-1
|
||||||
|
hover:cursor-pointer
|
||||||
|
transition duration-150
|
||||||
|
font-bold text-xl
|
||||||
|
max-w-xl
|
||||||
|
rounded-md
|
||||||
|
text-black
|
||||||
|
text-center
|
||||||
|
w-full
|
||||||
|
h-16
|
||||||
|
mt-8 flex justify-center items-center "
|
||||||
|
>
|
||||||
|
<Link<Route> to={Route::Clues}>
|
||||||
|
{"Weiter"}
|
||||||
|
</Link<Route>>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
}
|
||||||
|
}
|
||||||
@ -7,7 +7,7 @@ use crate::router::Route;
|
|||||||
#[function_component]
|
#[function_component]
|
||||||
pub fn Home() -> Html {
|
pub fn Home() -> Html {
|
||||||
html! {
|
html! {
|
||||||
<div class="flex flex-col items-center h-screen min-height space-y-24 px-12 mt-20">
|
<div class="flex flex-col items-center h-full space-y-24 px-12 mt-20 mb-20">
|
||||||
<div class="flex flex-col items-center space-y-4">
|
<div class="flex flex-col items-center space-y-4">
|
||||||
<img src="public/digitaler-frieden_logo.jpg" alt="logo digitaler frieden" class="min-w-56 w-96"/>
|
<img src="public/digitaler-frieden_logo.jpg" alt="logo digitaler frieden" class="min-w-56 w-96"/>
|
||||||
<h3 class="text-3xl font-bold text-center ">{"Digitale Spuren entfernen per Knopfdruck"}</h3>
|
<h3 class="text-3xl font-bold text-center ">{"Digitale Spuren entfernen per Knopfdruck"}</h3>
|
||||||
|
|||||||
90
src/pages/register.rs
Normal file
90
src/pages/register.rs
Normal file
@ -0,0 +1,90 @@
|
|||||||
|
use yew::{function_component, html, Html};
|
||||||
|
use yew_router::components::Link;
|
||||||
|
|
||||||
|
use crate::router::Route;
|
||||||
|
|
||||||
|
#[function_component]
|
||||||
|
pub fn Register() -> Html {
|
||||||
|
html! {
|
||||||
|
<div class="px-6 mt-20">
|
||||||
|
<h3 class="text-primary
|
||||||
|
hover:bg-text-dark
|
||||||
|
hover:text-white
|
||||||
|
hover:-translate-y-1
|
||||||
|
hover:cursor-pointer
|
||||||
|
transition duration-150
|
||||||
|
font-bold text-xl
|
||||||
|
max-w-xl
|
||||||
|
rounded-md
|
||||||
|
text-black
|
||||||
|
w-full
|
||||||
|
absolute
|
||||||
|
top-4
|
||||||
|
left-4
|
||||||
|
">
|
||||||
|
<Link<Route> to={Route::Home}>
|
||||||
|
<div class="flex items-center"><svg class="w-8 " xmlns="http://www.w3.org/2000/svg" height="currentHeight" viewBox="0 0 24 24" width="currentWidth" fill="currentColor"><path d="M0 0h24v24H0z" fill="none"/><path d="M15.41 7.41L14 6l-6 6 6 6 1.41-1.41L10.83 12z"/></svg>{"Zurück"}</div>
|
||||||
|
</Link<Route>>
|
||||||
|
</h3>
|
||||||
|
<img src="public/digitaler-frieden_logo.jpg" alt="logo digitaler frieden" class="absolute top-4 right-4 md:-w-56 md:w-56 md:h-auto w-0 h-0"/>
|
||||||
|
<div class="-height mt-12 flex flex-col items-center">
|
||||||
|
<h3 class="text-3xl font-bold mb-6">{"Registrierung abschließen"}</h3>
|
||||||
|
<div class="group max-w-xl w-full mb-4">
|
||||||
|
<p class="text-start text-md mb-1">{"Vorname"}</p>
|
||||||
|
<input class="duration-700 font-bold text-md transition group-hover:cursor-pointer bg-transparent border-white hover:border-[#33d9b2] hover:curser-pointer focus-within:bg-[#33d9b2] active:bg-[#33d9b2] border-b text-center focus-within:text-black w-full h-10 rounded-md" type="text"/>
|
||||||
|
</div>
|
||||||
|
<div class="group max-w-xl w-full mb-4">
|
||||||
|
<p class="text-start text-md mb-1">{"Nachname"}</p>
|
||||||
|
<input class="duration-700 font-bold text-md transition group-hover:cursor-pointer bg-transparent border-white hover:border-[#33d9b2] hover:curser-pointer focus-within:bg-[#33d9b2] active:bg-[#33d9b2] border-b text-center focus-within:text-black w-full h-10 rounded-md" type="text"/>
|
||||||
|
</div>
|
||||||
|
<div class="group max-w-xl w-full mb-4">
|
||||||
|
<div class="flex justify-between space-x-4">
|
||||||
|
<div class="w-full">
|
||||||
|
<p class="text-start text-md mb-1">{"Straße"}</p>
|
||||||
|
<input class="duration-700 font-bold text-md transition group-hover:cursor-pointer bg-transparent border-white hover:border-[#33d9b2] hover:curser-pointer focus-within:bg-[#33d9b2] active:bg-[#33d9b2] border-b text-center focus-within:text-black w-full h-10 rounded-md" type="text"/>
|
||||||
|
</div>
|
||||||
|
<div class="w-24">
|
||||||
|
<p class="text-start text-md mb-1 w-16">{"Nr."}</p>
|
||||||
|
<input class="duration-700 font-bold text-md transition group-hover:cursor-pointer bg-transparent border-white hover:border-[#33d9b2] hover:curser-pointer focus-within:bg-[#33d9b2] active:bg-[#33d9b2] border-b text-center focus-within:text-black w-full h-10 rounded-md" type="text"/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="group max-w-xl w-full mb-4">
|
||||||
|
<p class="text-start text-md mb-1">{"Postleitzahl"}</p>
|
||||||
|
<input class="duration-700 font-bold text-md transition group-hover:cursor-pointer bg-transparent border-white hover:border-[#33d9b2] hover:curser-pointer focus-within:bg-[#33d9b2] active:bg-[#33d9b2] border-b text-center focus-within:text-black w-full h-10 rounded-md" type="text"/>
|
||||||
|
</div>
|
||||||
|
<div class="group max-w-xl w-full mb-4">
|
||||||
|
<p class="text-start text-md mb-1">{"Ort"}</p>
|
||||||
|
<input class="duration-700 font-bold text-md transition group-hover:cursor-pointer bg-transparent border-white hover:border-[#33d9b2] hover:curser-pointer focus-within:bg-[#33d9b2] active:bg-[#33d9b2] border-b text-center focus-within:text-black w-full h-10 rounded-md" type="text"/>
|
||||||
|
</div>
|
||||||
|
<div class="group max-w-xl w-full mb-4">
|
||||||
|
<p class="text-start text-md mb-1">{"Telefonnummer"}</p>
|
||||||
|
<input class="duration-700 font-bold text-md transition group-hover:cursor-pointer bg-transparent border-white hover:border-[#33d9b2] hover:curser-pointer focus-within:bg-[#33d9b2] active:bg-[#33d9b2] border-b text-center focus-within:text-black w-full h-10 rounded-md" type="text"/>
|
||||||
|
</div>
|
||||||
|
<div class="group max-w-xl w-full mb-4">
|
||||||
|
<p class="text-start text-md mb-1">{"Geburtsort"}</p>
|
||||||
|
<input class="duration-700 font-bold text-md transition group-hover:cursor-pointer bg-transparent border-white hover:border-[#33d9b2] hover:curser-pointer focus-within:bg-[#33d9b2] active:bg-[#33d9b2] border-b text-center focus-within:text-black w-full h-10 rounded-md" type="text"/>
|
||||||
|
</div>
|
||||||
|
<div class="bg-primary
|
||||||
|
hover:bg-primary-dark
|
||||||
|
hover:text-white
|
||||||
|
hover:-translate-y-1
|
||||||
|
hover:cursor-pointer
|
||||||
|
transition duration-150
|
||||||
|
font-bold text-xl
|
||||||
|
max-w-xl
|
||||||
|
rounded-md
|
||||||
|
text-black
|
||||||
|
text-center
|
||||||
|
w-full
|
||||||
|
h-16
|
||||||
|
mt-20 flex justify-center items-center "
|
||||||
|
>
|
||||||
|
<Link<Route> to={Route::Deceased}>
|
||||||
|
{"Weiter"}
|
||||||
|
</Link<Route>>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
}
|
||||||
|
}
|
||||||
@ -6,7 +6,7 @@ use crate::router::Route;
|
|||||||
#[function_component]
|
#[function_component]
|
||||||
pub fn SignUp() -> Html {
|
pub fn SignUp() -> Html {
|
||||||
html! {
|
html! {
|
||||||
<div class="h-screen min-height px-12 mt-6">
|
<div class="h-full px-6 mt-4">
|
||||||
<h3 class="text-primary
|
<h3 class="text-primary
|
||||||
hover:bg-text-dark
|
hover:bg-text-dark
|
||||||
hover:text-white
|
hover:text-white
|
||||||
@ -17,14 +17,54 @@ pub fn SignUp() -> Html {
|
|||||||
max-w-xl
|
max-w-xl
|
||||||
rounded-md
|
rounded-md
|
||||||
text-black
|
text-black
|
||||||
w-full
|
w-full
|
||||||
|
top-4
|
||||||
|
left-4
|
||||||
|
absolute
|
||||||
">
|
">
|
||||||
<Link<Route> to={Route::Home}>
|
<Link<Route> to={Route::Home}>
|
||||||
<div class="flex items-center"><svg class="w-8 " xmlns="http://www.w3.org/2000/svg" height="currentHeight" viewBox="0 0 24 24" width="currentWidth" fill="currentColor"><path d="M0 0h24v24H0z" fill="none"/><path d="M15.41 7.41L14 6l-6 6 6 6 1.41-1.41L10.83 12z"/></svg>{"Zurück"}</div>
|
<div class="flex items-center"><svg class="w-8 " xmlns="http://www.w3.org/2000/svg" height="currentHeight" viewBox="0 0 24 24" width="currentWidth" fill="currentColor"><path d="M0 0h24v24H0z" fill="none"/><path d="M15.41 7.41L14 6l-6 6 6 6 1.41-1.41L10.83 12z"/></svg>{"Zurück"}</div>
|
||||||
</Link<Route>>
|
</Link<Route>>
|
||||||
</h3>
|
</h3>
|
||||||
<div class="flex flex-col items-center h-screen min-height space-y-24 px-12 mt-20">
|
<img src="public/digitaler-frieden_logo.jpg" alt="logo digitaler frieden" class="top-4 right-4 absolute md:min-w-56 md:w-56 w-0"/>
|
||||||
</div>
|
<div class="min-height mt-64 md:flex md:flex-col md:items-center">
|
||||||
|
<h3 class="text-3xl font-bold mb-6">{"Jetzt registrieren"}</h3>
|
||||||
|
<p>{"Gib deine E-Mail Adresse ein."}</p>
|
||||||
|
<div class="group max-w-xl w-full mb-4">
|
||||||
|
<input class="duration-700 font-bold text-lg transition group-hover:cursor-pointer bg-transparent border-white hover:border-[#33d9b2] hover:curser-pointer focus-within:bg-[#33d9b2] active:bg-[#33d9b2] border-2 text-center text-primary focus-within:text-black w-full h-16 mt-4 rounded-md" type="text"/>
|
||||||
|
</div>
|
||||||
|
<div class="flex justify-between max-w-xl w-full">
|
||||||
|
<div class="text-primary hover:text-white
|
||||||
|
hover:-translate-y-1
|
||||||
|
hover:cursor-pointer
|
||||||
|
transition duration-150
|
||||||
|
">
|
||||||
|
<Link<Route> to={Route::SignUp}>
|
||||||
|
{"Stattdessen anmelden"}
|
||||||
|
</Link<Route>>
|
||||||
|
</div>
|
||||||
|
<div class="bg-primary
|
||||||
|
hover:bg-primary-dark
|
||||||
|
hover:text-white
|
||||||
|
hover:-translate-y-1
|
||||||
|
hover:cursor-pointer
|
||||||
|
transition duration-150
|
||||||
|
font-bold text-xl
|
||||||
|
max-w-36
|
||||||
|
rounded-md
|
||||||
|
text-black
|
||||||
|
text-center
|
||||||
|
w-full
|
||||||
|
min-h-12
|
||||||
|
h-12
|
||||||
|
flex justify-center items-center"
|
||||||
|
>
|
||||||
|
<Link<Route> to={Route::Verify}>
|
||||||
|
{"Weiter"}
|
||||||
|
</Link<Route>>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
77
src/pages/verify.rs
Normal file
77
src/pages/verify.rs
Normal file
@ -0,0 +1,77 @@
|
|||||||
|
use yew::{function_component, html, Html};
|
||||||
|
use yew_router::components::Link;
|
||||||
|
|
||||||
|
use crate::router::Route;
|
||||||
|
|
||||||
|
#[function_component]
|
||||||
|
pub fn Verify() -> Html {
|
||||||
|
html! {
|
||||||
|
<div class="px-6 mt-4 md:mt-24">
|
||||||
|
<div class="flex justify-between">
|
||||||
|
<h3 class="text-primary
|
||||||
|
hover:bg-text-dark
|
||||||
|
hover:text-white
|
||||||
|
hover:-translate-y-1
|
||||||
|
hover:cursor-pointer
|
||||||
|
transition duration-150
|
||||||
|
font-bold text-xl
|
||||||
|
max-w-xl
|
||||||
|
rounded-md
|
||||||
|
text-black
|
||||||
|
w-full
|
||||||
|
absolute
|
||||||
|
top-4
|
||||||
|
left-4
|
||||||
|
">
|
||||||
|
<Link<Route> to={Route::SignUp}>
|
||||||
|
<div class="flex items-center"><svg class="w-8 " xmlns="http://www.w3.org/2000/svg" height="currentHeight" viewBox="0 0 24 24" width="currentWidth" fill="currentColor"><path d="M0 0h24v24H0z" fill="none"/><path d="M15.41 7.41L14 6l-6 6 6 6 1.41-1.41L10.83 12z"/></svg>{"Zurück"}</div>
|
||||||
|
</Link<Route>>
|
||||||
|
</h3>
|
||||||
|
<img src="public/digitaler-frieden_logo.jpg" alt="logo digitaler frieden" class="absolute top-4 right-4 md:min-w-56 md:w-56 w-0"/>
|
||||||
|
</div>
|
||||||
|
<div class="mt-24 md:mt-32 flex flex-col items-center">
|
||||||
|
<h3 class="text-3xl font-bold mb-6">{"Verifizieren"}</h3>
|
||||||
|
<div class="flex flex-col items-start">
|
||||||
|
<p class="mb-3">{"Bitte verifiziere deine E-Mail Adresse."}</p>
|
||||||
|
<p class="mb-12">{"Wir haben dir eine E-Mail geschickt."}</p>
|
||||||
|
<p class="mb-8">{"Dann geht es hier weiter."}</p>
|
||||||
|
</div>
|
||||||
|
<div class="flex justify-center max-w-xl w-full mb-6">
|
||||||
|
<div class="bg-primary
|
||||||
|
hover:bg-primary-dark
|
||||||
|
hover:text-white
|
||||||
|
hover:-translate-y-1
|
||||||
|
hover:cursor-pointer
|
||||||
|
transition duration-150
|
||||||
|
font-bold text-xl
|
||||||
|
max-w-36
|
||||||
|
rounded-md
|
||||||
|
text-black
|
||||||
|
text-center
|
||||||
|
w-full
|
||||||
|
min-h-12
|
||||||
|
h-12
|
||||||
|
flex justify-center items-center mb-16"
|
||||||
|
>
|
||||||
|
<Link<Route> to={Route::Register}>
|
||||||
|
{"Weiter"}
|
||||||
|
</Link<Route>>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="flex flex-col items-start">
|
||||||
|
<p class="mb-1">{"Noch keine E-Mail erhalten?"}</p>
|
||||||
|
<p class="mb-4">{"Spam Ordner schon überprüft?"}</p>
|
||||||
|
<div class="text-primary hover:text-white
|
||||||
|
hover:-translate-y-1
|
||||||
|
hover:cursor-pointer
|
||||||
|
transition duration-150
|
||||||
|
">
|
||||||
|
<Link<Route> to={Route::SignUp}>
|
||||||
|
{"Erneut senden"}
|
||||||
|
</Link<Route>>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
}
|
||||||
|
}
|
||||||
@ -1,4 +1,4 @@
|
|||||||
use crate::pages::{Home, SignUp};
|
use crate::pages::{Clues, Deceased, Home, Register, SignUp, Verify};
|
||||||
|
|
||||||
use yew_router::prelude::*;
|
use yew_router::prelude::*;
|
||||||
use yew::{function_component, html, Html};
|
use yew::{function_component, html, Html};
|
||||||
@ -9,6 +9,14 @@ pub enum Route {
|
|||||||
Home,
|
Home,
|
||||||
#[at("/signup")]
|
#[at("/signup")]
|
||||||
SignUp,
|
SignUp,
|
||||||
|
#[at("/verify")]
|
||||||
|
Verify,
|
||||||
|
#[at("/deceased")]
|
||||||
|
Deceased,
|
||||||
|
#[at("/clues")]
|
||||||
|
Clues,
|
||||||
|
#[at("/register")]
|
||||||
|
Register,
|
||||||
}
|
}
|
||||||
|
|
||||||
fn route(routes: Route) -> Html {
|
fn route(routes: Route) -> Html {
|
||||||
@ -19,6 +27,18 @@ fn route(routes: Route) -> Html {
|
|||||||
Route::SignUp => {
|
Route::SignUp => {
|
||||||
html! { <SignUp /> }
|
html! { <SignUp /> }
|
||||||
},
|
},
|
||||||
|
Route::Verify => {
|
||||||
|
html! { <Verify /> }
|
||||||
|
},
|
||||||
|
Route::Clues => {
|
||||||
|
html! { <Clues /> }
|
||||||
|
},
|
||||||
|
Route::Deceased => {
|
||||||
|
html! { <Deceased /> }
|
||||||
|
},
|
||||||
|
Route::Register => {
|
||||||
|
html! { <Register /> }
|
||||||
|
},
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user