Design changes
This commit is contained in:
sairaj mote
parent
2f4c2c57a9
commit
07817c0e89
207
css/main.css
207
css/main.css
@ -18,7 +18,7 @@ body {
|
||||
body {
|
||||
--accent-color: #3d5afe;
|
||||
--secondary-color: #ffac2e;
|
||||
--text-color: 20, 20, 20;
|
||||
--text-color: 36, 36, 36;
|
||||
--foreground-color: 252, 253, 255;
|
||||
--background-color: 241, 243, 248;
|
||||
--danger-color: rgb(255, 75, 75);
|
||||
@ -218,14 +218,14 @@ article > * {
|
||||
left: 0;
|
||||
right: 0;
|
||||
top: 0;
|
||||
background-color: rgba(var(--text-color), 0.5);
|
||||
background-color: rgba(var(--foreground-color), 0.5);
|
||||
z-index: 10;
|
||||
-webkit-backdrop-filter: blur(1rem);
|
||||
backdrop-filter: blur(1rem);
|
||||
padding: max(1rem, 1.5vw) var(--inline-padding);
|
||||
}
|
||||
#main_header a {
|
||||
color: rgba(var(--foreground-color), 0.9);
|
||||
color: rgba(var(--text-color), 0.9);
|
||||
text-decoration: none;
|
||||
}
|
||||
#main_header ul {
|
||||
@ -242,7 +242,7 @@ article > * {
|
||||
display: block;
|
||||
width: 0;
|
||||
height: 0.15rem;
|
||||
background: rgba(var(--foreground-color), 1);
|
||||
background: rgba(var(--accent-color), 1);
|
||||
transition: width 0.3s;
|
||||
margin: auto;
|
||||
margin-top: 0.1rem;
|
||||
@ -256,36 +256,65 @@ article > * {
|
||||
}
|
||||
|
||||
#above_fold {
|
||||
background: linear-gradient(rgba(0, 0, 0, 0.5019607843), rgba(0, 0, 0, 0.8156862745)), url("../assets/representational/shubham-s-web3-pXdzCRJNum0-unsplash.jpg") no-repeat center center;
|
||||
background-size: cover;
|
||||
color: rgba(var(--foreground-color), 1);
|
||||
padding-top: 40vh;
|
||||
padding-top: 5rem;
|
||||
}
|
||||
#above_fold p {
|
||||
color: rgba(var(--foreground-color), 0.9);
|
||||
#above_fold #title_text {
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
padding-bottom: 5rem;
|
||||
text-align: center;
|
||||
margin-bottom: 3rem;
|
||||
}
|
||||
#above_fold #title_text:before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-image: linear-gradient(45deg, rgba(255, 152, 152, 0.3137254902) 25%, transparent 25%, transparent 75%, rgba(255, 152, 152, 0.3137254902) 75%), linear-gradient(45deg, rgba(255, 152, 152, 0.3137254902) 25%, transparent 25%, transparent 75%, rgba(255, 152, 152, 0.3137254902) 75%);
|
||||
background-size: 40px 40px;
|
||||
background-position: 0 0, 20px 20px;
|
||||
z-index: -1;
|
||||
}
|
||||
#above_fold #title_text:after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.9725490196) 25%, transparent 25%, transparent 75%, rgba(255, 255, 255, 0.9725490196) 75%), linear-gradient(45deg, rgba(255, 255, 255, 0.9725490196) 25%, transparent 25%, transparent 75%, rgba(255, 255, 255, 0.9725490196) 75%);
|
||||
background-size: 20px 20px;
|
||||
background-position: 0 0, 10px 10px;
|
||||
z-index: -1;
|
||||
}
|
||||
#above_fold h2 {
|
||||
margin-bottom: 3rem;
|
||||
position: relative;
|
||||
margin: auto;
|
||||
margin-top: 5rem;
|
||||
}
|
||||
#above_fold ol {
|
||||
display: block;
|
||||
-moz-columns: 2 24rem;
|
||||
columns: 2 24rem;
|
||||
-moz-column-gap: 2rem;
|
||||
column-gap: 2rem;
|
||||
padding-left: 0;
|
||||
}
|
||||
#above_fold ol li {
|
||||
page-break-inside: avoid;
|
||||
-moz-column-break-inside: avoid;
|
||||
break-inside: avoid;
|
||||
margin-bottom: 3rem;
|
||||
color: rgba(var(--foreground-color), 1);
|
||||
margin-bottom: 5rem;
|
||||
border-bottom: solid thin rgba(var(--text-color), 1);
|
||||
padding-bottom: 5rem;
|
||||
justify-content: center;
|
||||
justify-self: center;
|
||||
text-align: center;
|
||||
}
|
||||
#above_fold ol p {
|
||||
text-align: justify;
|
||||
}
|
||||
|
||||
#hero_illustration {
|
||||
margin: auto;
|
||||
margin-top: 4rem;
|
||||
width: min(100%, 26rem);
|
||||
}
|
||||
|
||||
@ -332,9 +361,47 @@ section:nth-of-type(2) {
|
||||
background: linear-gradient(to left, rgba(0, 0, 0, 0.5019607843), rgba(0, 0, 0, 0.8156862745)), url("../assets/representational/esau-gonzalez-bQefbdSC4ko-unsplash.jpg") no-repeat center center fixed;
|
||||
background-size: cover;
|
||||
color: rgba(var(--foreground-color), 1);
|
||||
justify-content: flex-end;
|
||||
text-align: right;
|
||||
}
|
||||
#el_salvador_section h2,
|
||||
#el_salvador_section h4 {
|
||||
text-align: right;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
#el_salvador_section p {
|
||||
color: rgba(var(--foreground-color), 0.9);
|
||||
text-align: right;
|
||||
}
|
||||
#el_salvador_section .milestone {
|
||||
display: grid;
|
||||
max-width: 42rem;
|
||||
width: auto;
|
||||
gap: 1rem 2rem;
|
||||
grid-template-areas: "title label" "description label";
|
||||
align-items: center;
|
||||
padding-right: 0;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
#el_salvador_section .milestone:not(:last-child) {
|
||||
padding-bottom: 3rem;
|
||||
}
|
||||
#el_salvador_section .milestone__label {
|
||||
align-items: flex-start;
|
||||
justify-content: center;
|
||||
grid-area: label;
|
||||
justify-self: flex-end;
|
||||
}
|
||||
#el_salvador_section .milestone__label::before {
|
||||
width: 0.1rem;
|
||||
height: 100%;
|
||||
}
|
||||
#el_salvador_section .milestone__title {
|
||||
grid-area: title;
|
||||
margin-top: -0.1em;
|
||||
}
|
||||
#el_salvador_section .milestone__description {
|
||||
grid-area: description;
|
||||
}
|
||||
|
||||
#projectb_milestones_section {
|
||||
@ -591,11 +658,40 @@ section:nth-of-type(2) {
|
||||
#project_team__components {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 3rem 1.5rem;
|
||||
}
|
||||
#project_team__components > * {
|
||||
align-content: flex-start;
|
||||
flex: 1 1 24rem;
|
||||
}
|
||||
#project_team__components .milestone {
|
||||
display: grid;
|
||||
max-width: 42rem;
|
||||
width: auto;
|
||||
gap: 1rem 2rem;
|
||||
grid-template-areas: "label title" "label description";
|
||||
align-items: center;
|
||||
padding-right: 0;
|
||||
}
|
||||
#project_team__components .milestone:not(:last-child) {
|
||||
padding-bottom: 3rem;
|
||||
}
|
||||
#project_team__components .milestone__label {
|
||||
align-items: flex-start;
|
||||
justify-content: center;
|
||||
grid-area: label;
|
||||
background-color: rgba(var(--text-color), 1);
|
||||
color: rgba(var(--foreground-color), 1);
|
||||
}
|
||||
#project_team__components .milestone__label::before {
|
||||
width: 0.1rem;
|
||||
height: 100%;
|
||||
background-color: rgba(var(--text-color), 0.5);
|
||||
}
|
||||
#project_team__components .milestone__title {
|
||||
grid-area: title;
|
||||
margin-top: -0.1em;
|
||||
}
|
||||
#project_team__components .milestone__description {
|
||||
grid-area: description;
|
||||
}
|
||||
|
||||
#economic_framework {
|
||||
@ -604,13 +700,13 @@ section:nth-of-type(2) {
|
||||
#economic_framework h2 {
|
||||
margin: 3rem 0 1rem 0;
|
||||
}
|
||||
#economic_framework ul {
|
||||
-moz-columns: 3 16rem;
|
||||
columns: 3 16rem;
|
||||
#economic_framework ul:not(.milestones) {
|
||||
-moz-columns: 2 16rem;
|
||||
columns: 2 16rem;
|
||||
-moz-column-gap: 0.5rem;
|
||||
column-gap: 0.5rem;
|
||||
}
|
||||
#economic_framework ul li {
|
||||
#economic_framework ul:not(.milestones) li {
|
||||
display: grid;
|
||||
gap: 0.5rem;
|
||||
align-items: flex-start;
|
||||
@ -623,6 +719,69 @@ section:nth-of-type(2) {
|
||||
break-inside: avoid;
|
||||
margin-bottom: 0.5rem;
|
||||
}
|
||||
#economic_framework #technologies_needed {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 1rem;
|
||||
margin-top: 3rem;
|
||||
}
|
||||
#economic_framework #technologies_needed li {
|
||||
display: flex;
|
||||
flex: 1 1 20rem;
|
||||
gap: 1rem;
|
||||
align-items: center;
|
||||
padding: max(1rem, 2vw);
|
||||
border: solid thin rgba(var(--text-color), 0.2);
|
||||
border-radius: 0.5rem;
|
||||
font-weight: 500;
|
||||
-webkit-animation: slide-up 0.5s ease var(--delay) forwards;
|
||||
animation: slide-up 0.5s ease var(--delay) forwards;
|
||||
opacity: 0;
|
||||
background: transparent;
|
||||
}
|
||||
#economic_framework #technologies_needed .icon {
|
||||
height: 2.5rem;
|
||||
width: 2.5rem;
|
||||
}
|
||||
#economic_framework .milestones {
|
||||
display: grid;
|
||||
justify-content: flex-start;
|
||||
justify-items: flex-start;
|
||||
}
|
||||
#economic_framework .milestones--title-only .milestone {
|
||||
grid-template-areas: "label title";
|
||||
}
|
||||
#economic_framework .milestones--description-only .milestone {
|
||||
grid-template-areas: "label description";
|
||||
}
|
||||
#economic_framework .milestone {
|
||||
display: grid;
|
||||
max-width: 42rem;
|
||||
width: auto;
|
||||
gap: 1rem 2rem;
|
||||
align-items: center;
|
||||
justify-content: flex-start;
|
||||
padding-right: 0;
|
||||
}
|
||||
#economic_framework .milestone:not(:last-child) {
|
||||
padding-bottom: 3rem;
|
||||
}
|
||||
#economic_framework .milestone__label {
|
||||
grid-area: label;
|
||||
align-items: flex-start;
|
||||
justify-content: center;
|
||||
background-color: rgba(var(--text-color), 1);
|
||||
color: rgba(var(--foreground-color), 1);
|
||||
}
|
||||
#economic_framework .milestone__label::before {
|
||||
width: 0.1rem;
|
||||
height: 100%;
|
||||
background-color: rgba(var(--text-color), 0.5);
|
||||
}
|
||||
#economic_framework .milestone__title {
|
||||
grid-area: title;
|
||||
margin-top: -0.1em;
|
||||
}
|
||||
|
||||
#team_members {
|
||||
display: grid;
|
||||
|
||||
2
css/main.min.css
vendored
2
css/main.min.css
vendored
File diff suppressed because one or more lines are too long
242
css/main.scss
242
css/main.scss
@ -16,7 +16,7 @@ body {
|
||||
body {
|
||||
--accent-color: #3d5afe;
|
||||
--secondary-color: #ffac2e;
|
||||
--text-color: 20, 20, 20;
|
||||
--text-color: 36, 36, 36;
|
||||
--foreground-color: 252, 253, 255;
|
||||
--background-color: 241, 243, 248;
|
||||
--danger-color: rgb(255, 75, 75);
|
||||
@ -182,12 +182,12 @@ article {
|
||||
left: 0;
|
||||
right: 0;
|
||||
top: 0;
|
||||
background-color: rgba(var(--text-color), 0.5);
|
||||
background-color: rgba(var(--foreground-color), 0.5);
|
||||
z-index: 10;
|
||||
backdrop-filter: blur(1rem);
|
||||
padding: max(1rem, 1.5vw) var(--inline-padding);
|
||||
a {
|
||||
color: rgba(var(--foreground-color), 0.9);
|
||||
color: rgba(var(--text-color), 0.9);
|
||||
text-decoration: none;
|
||||
}
|
||||
ul {
|
||||
@ -202,7 +202,7 @@ article {
|
||||
display: block;
|
||||
width: 0;
|
||||
height: 0.15rem;
|
||||
background: rgba(var(--foreground-color), 1);
|
||||
background: rgba(var(--accent-color), 1);
|
||||
transition: width 0.3s;
|
||||
margin: auto;
|
||||
margin-top: 0.1rem;
|
||||
@ -220,34 +220,99 @@ article {
|
||||
}
|
||||
}
|
||||
#above_fold {
|
||||
background: linear-gradient(#00000080, #000000d0),
|
||||
url("../assets/representational/shubham-s-web3-pXdzCRJNum0-unsplash.jpg")
|
||||
no-repeat center center;
|
||||
background-size: cover;
|
||||
color: rgba(var(--foreground-color), 1);
|
||||
padding-top: 40vh;
|
||||
p {
|
||||
color: rgba(var(--foreground-color), 0.9);
|
||||
// background: linear-gradient(#00000080, #000000d0),
|
||||
// url("../assets/representational/shubham-s-web3-pXdzCRJNum0-unsplash.jpg")
|
||||
// no-repeat center center;
|
||||
// background-size: cover;
|
||||
// color: rgba(var(--foreground-color), 1);
|
||||
// p {
|
||||
// color: rgba(var(--foreground-color), 0.9);
|
||||
// }
|
||||
padding-top: 5rem;
|
||||
#title_text {
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
padding-bottom: 5rem;
|
||||
text-align: center;
|
||||
margin-bottom: 3rem;
|
||||
&:before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-image: linear-gradient(
|
||||
45deg,
|
||||
#ff989850 25%,
|
||||
transparent 25%,
|
||||
transparent 75%,
|
||||
#ff989850 75%
|
||||
),
|
||||
linear-gradient(
|
||||
45deg,
|
||||
#ff989850 25%,
|
||||
transparent 25%,
|
||||
transparent 75%,
|
||||
#ff989850 75%
|
||||
);
|
||||
background-size: 40px 40px;
|
||||
background-position: 0 0, 20px 20px;
|
||||
z-index: -1;
|
||||
}
|
||||
&:after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-image: linear-gradient(
|
||||
45deg,
|
||||
#fffffff8 25%,
|
||||
transparent 25%,
|
||||
transparent 75%,
|
||||
#fffffff8 75%
|
||||
),
|
||||
linear-gradient(
|
||||
45deg,
|
||||
#fffffff8 25%,
|
||||
transparent 25%,
|
||||
transparent 75%,
|
||||
#fffffff8 75%
|
||||
);
|
||||
background-size: 20px 20px;
|
||||
background-position: 0 0, 10px 10px;
|
||||
z-index: -1;
|
||||
}
|
||||
}
|
||||
h2 {
|
||||
margin-bottom: 3rem;
|
||||
position: relative;
|
||||
margin: auto;
|
||||
margin-top: 5rem;
|
||||
// background: linear-gradient(to left, #00000010, #00000080);
|
||||
}
|
||||
ol {
|
||||
display: block;
|
||||
columns: 2 24rem;
|
||||
column-gap: 2rem;
|
||||
padding-left: 0;
|
||||
li {
|
||||
page-break-inside: avoid;
|
||||
break-inside: avoid;
|
||||
margin-bottom: 3rem;
|
||||
color: rgba(var(--foreground-color), 1);
|
||||
margin-bottom: 5rem;
|
||||
// color: rgba(var(--foreground-color), 1);
|
||||
border-bottom: solid thin rgba(var(--text-color), 1);
|
||||
padding-bottom: 5rem;
|
||||
justify-content: center;
|
||||
justify-self: center;
|
||||
text-align: center;
|
||||
}
|
||||
p {
|
||||
text-align: justify;
|
||||
}
|
||||
}
|
||||
}
|
||||
#hero_illustration {
|
||||
margin: auto;
|
||||
margin-top: 4rem;
|
||||
width: min(100%, 26rem);
|
||||
}
|
||||
section {
|
||||
@ -292,8 +357,46 @@ section {
|
||||
no-repeat center center fixed;
|
||||
background-size: cover;
|
||||
color: rgba(var(--foreground-color), 1);
|
||||
justify-content: flex-end;
|
||||
text-align: right;
|
||||
h2,
|
||||
h4 {
|
||||
text-align: right;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
p {
|
||||
color: rgba(var(--foreground-color), 0.9);
|
||||
text-align: right;
|
||||
}
|
||||
.milestone {
|
||||
display: grid;
|
||||
max-width: 42rem;
|
||||
width: auto;
|
||||
gap: 1rem 2rem;
|
||||
grid-template-areas: "title label" "description label";
|
||||
align-items: center;
|
||||
padding-right: 0;
|
||||
justify-content: flex-end;
|
||||
&:not(:last-child) {
|
||||
padding-bottom: 3rem;
|
||||
}
|
||||
&__label {
|
||||
align-items: flex-start;
|
||||
justify-content: center;
|
||||
grid-area: label;
|
||||
justify-self: flex-end;
|
||||
&::before {
|
||||
width: 0.1rem;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
&__title {
|
||||
grid-area: title;
|
||||
margin-top: -0.1em;
|
||||
}
|
||||
&__description {
|
||||
grid-area: description;
|
||||
}
|
||||
}
|
||||
}
|
||||
#projectb_milestones_section {
|
||||
@ -548,10 +651,39 @@ section {
|
||||
#project_team__components {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 3rem 1.5rem;
|
||||
& > * {
|
||||
align-content: flex-start;
|
||||
flex: 1 1 24rem;
|
||||
}
|
||||
.milestone {
|
||||
display: grid;
|
||||
max-width: 42rem;
|
||||
width: auto;
|
||||
gap: 1rem 2rem;
|
||||
grid-template-areas: "label title" "label description";
|
||||
align-items: center;
|
||||
padding-right: 0;
|
||||
&:not(:last-child) {
|
||||
padding-bottom: 3rem;
|
||||
}
|
||||
&__label {
|
||||
align-items: flex-start;
|
||||
justify-content: center;
|
||||
grid-area: label;
|
||||
background-color: rgba(var(--text-color), 1);
|
||||
color: rgba(var(--foreground-color), 1);
|
||||
&::before {
|
||||
width: 0.1rem;
|
||||
height: 100%;
|
||||
background-color: rgba(var(--text-color), 0.5);
|
||||
}
|
||||
}
|
||||
&__title {
|
||||
grid-area: title;
|
||||
margin-top: -0.1em;
|
||||
}
|
||||
&__description {
|
||||
grid-area: description;
|
||||
}
|
||||
}
|
||||
}
|
||||
#economic_framework {
|
||||
@ -559,8 +691,8 @@ section {
|
||||
h2 {
|
||||
margin: 3rem 0 1rem 0;
|
||||
}
|
||||
ul {
|
||||
columns: 3 16rem;
|
||||
ul:not(.milestones) {
|
||||
columns: 2 16rem;
|
||||
column-gap: 0.5rem;
|
||||
li {
|
||||
display: grid;
|
||||
@ -575,6 +707,72 @@ section {
|
||||
margin-bottom: 0.5rem;
|
||||
}
|
||||
}
|
||||
#technologies_needed {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 1rem;
|
||||
margin-top: 3rem;
|
||||
li {
|
||||
display: flex;
|
||||
flex: 1 1 20rem;
|
||||
gap: 1rem;
|
||||
align-items: center;
|
||||
padding: max(1rem, 2vw);
|
||||
border: solid thin rgba(var(--text-color), 0.2);
|
||||
border-radius: 0.5rem;
|
||||
font-weight: 500;
|
||||
animation: slide-up 0.5s ease var(--delay) forwards;
|
||||
opacity: 0;
|
||||
background: transparent;
|
||||
}
|
||||
.icon {
|
||||
height: 2.5rem;
|
||||
width: 2.5rem;
|
||||
}
|
||||
}
|
||||
.milestones {
|
||||
display: grid;
|
||||
justify-content: flex-start;
|
||||
justify-items: flex-start;
|
||||
&--title-only {
|
||||
.milestone {
|
||||
grid-template-areas: "label title";
|
||||
}
|
||||
}
|
||||
&--description-only {
|
||||
.milestone {
|
||||
grid-template-areas: "label description";
|
||||
}
|
||||
}
|
||||
}
|
||||
.milestone {
|
||||
display: grid;
|
||||
max-width: 42rem;
|
||||
width: auto;
|
||||
gap: 1rem 2rem;
|
||||
align-items: center;
|
||||
justify-content: flex-start;
|
||||
padding-right: 0;
|
||||
&:not(:last-child) {
|
||||
padding-bottom: 3rem;
|
||||
}
|
||||
&__label {
|
||||
grid-area: label;
|
||||
align-items: flex-start;
|
||||
justify-content: center;
|
||||
background-color: rgba(var(--text-color), 1);
|
||||
color: rgba(var(--foreground-color), 1);
|
||||
&::before {
|
||||
width: 0.1rem;
|
||||
height: 100%;
|
||||
background-color: rgba(var(--text-color), 0.5);
|
||||
}
|
||||
}
|
||||
&__title {
|
||||
grid-area: title;
|
||||
margin-top: -0.1em;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#team_members {
|
||||
|
||||
448
index.html
448
index.html
@ -21,21 +21,21 @@
|
||||
<ul>
|
||||
<li>
|
||||
<a href="#/economic_framework">
|
||||
Economic framework
|
||||
Execution steps
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</header>
|
||||
<article id="home" class="page">
|
||||
<section id="above_fold" class="gap-4">
|
||||
<!-- <img id="hero_illustration" src="assets/svg/cityscape.svg" alt=""> -->
|
||||
<div class="grid gap-0-5">
|
||||
<div id="title_text" class="grid gap-0-5">
|
||||
<h2 class="reveal">
|
||||
<span>
|
||||
Execution of tokenization projects
|
||||
All about execution of tokenization projects
|
||||
</span>
|
||||
</h2>
|
||||
</div>
|
||||
<!-- <img id="hero_illustration" src="assets/svg/cityscape.svg" alt=""> -->
|
||||
<ol class="grid gap-3" type="1">
|
||||
<li class="grid gap-1">
|
||||
<h3>What is Project B</h3>
|
||||
@ -322,32 +322,60 @@
|
||||
<h4 class="reveal"><span>Why</span></h4>
|
||||
<h2 class="reveal"><span>El Salvador?</span></h2>
|
||||
</div>
|
||||
<div class="grid gap-1">
|
||||
<p>
|
||||
El Salvador first and only country to unconditionally legalize Bitcoin, and offer constitutional
|
||||
protections.
|
||||
</p>
|
||||
<p>
|
||||
El Salvador has no taxation on capital gains on Bitcoin, as well as technology companies that
|
||||
leverage the power of new technologies.
|
||||
</p>
|
||||
<p>
|
||||
El Salvador has created Comprehensive Digital Assets regulatory system.
|
||||
</p>
|
||||
<p>
|
||||
El Salvador can form the physical base where new digital ideas an be incubated, and then scaled
|
||||
up all over the world using blockchain dynamics.
|
||||
</p>
|
||||
<p>
|
||||
El Salvador is creating first mover advantage in Crypto space for itself as a country, and for
|
||||
entrepreneurs who operate out of El Salvador. As we saw in case of Bitcoin, first mover
|
||||
advantage is often a permanent advantage in Crypto space.
|
||||
</p>
|
||||
<p>
|
||||
El Salvador is also creating a community of global Crypto enthusiasts being focal point of
|
||||
Crypto infrastructure in the world.
|
||||
</p>
|
||||
</div>
|
||||
<ul class="grid">
|
||||
<li class="milestone">
|
||||
<div class="milestone__label">1</div>
|
||||
<h3 class="milestone__title">Bitcoin legalized</h3>
|
||||
<p class="milestone__description">
|
||||
El Salvador first and only country to unconditionally legalize Bitcoin, and offer
|
||||
constitutional
|
||||
protections.
|
||||
</p>
|
||||
</li>
|
||||
<li class="milestone">
|
||||
<div class="milestone__label">2</div>
|
||||
<h3 class="milestone__title">No capital gains tax</h3>
|
||||
<p class="milestone__description">
|
||||
El Salvador has no taxation on capital gains on Bitcoin, as well as technology companies
|
||||
that
|
||||
leverage the power of new technologies.
|
||||
</p>
|
||||
</li>
|
||||
<li class="milestone">
|
||||
<div class="milestone__label">3</div>
|
||||
<h3 class="milestone__title">Digital assets regulation</h3>
|
||||
<p class="milestone__description">
|
||||
El Salvador has created Comprehensive Digital Assets regulatory system.
|
||||
</p>
|
||||
</li>
|
||||
<li class="milestone">
|
||||
<div class="milestone__label">4</div>
|
||||
<h3 class="milestone__title">Best physical launchpad</h3>
|
||||
<p class="milestone__description">
|
||||
El Salvador can form the physical base where new digital ideas an be incubated, and then
|
||||
scaled
|
||||
up all over the world using blockchain dynamics.
|
||||
</p>
|
||||
</li>
|
||||
<li class="milestone">
|
||||
<div class="milestone__label">5</div>
|
||||
<h3 class="milestone__title">First mover advantage for new ideas</h3>
|
||||
<p class="milestone__description">
|
||||
El Salvador is creating first mover advantage in Crypto space for itself as a country, and
|
||||
for
|
||||
entrepreneurs who operate out of El Salvador. As we saw in case of Bitcoin, first mover
|
||||
advantage is often a permanent advantage in Crypto space.
|
||||
</p>
|
||||
</li>
|
||||
<li class="milestone">
|
||||
<div class="milestone__label">6</div>
|
||||
<h3 class="milestone__title">Emerging focal point of crypto community</h3>
|
||||
<p class="milestone__description">
|
||||
El Salvador is also creating a community of global Crypto enthusiasts being focal point of
|
||||
Crypto infrastructure in the world.
|
||||
</p>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</section>
|
||||
<section id="projects_section">
|
||||
@ -496,66 +524,77 @@
|
||||
</section>
|
||||
<section class="grid gap-3">
|
||||
<h2 class="reveal"><span>Project team structure</span> </h2>
|
||||
<div id="project_team__components">
|
||||
<div class="grid gap-1">
|
||||
<h3>
|
||||
<ul id="project_team__components">
|
||||
<li class="grid gap-1 milestone">
|
||||
<div class="milestone__label">1</div>
|
||||
<h3 class="milestone__title">
|
||||
Create client-side steering team
|
||||
</h3>
|
||||
<p>
|
||||
The client-side team should contain members from following teams
|
||||
</p>
|
||||
<ol type="1">
|
||||
<li>
|
||||
Management
|
||||
</li>
|
||||
<li>
|
||||
Finance
|
||||
</li>
|
||||
<li>
|
||||
Technology
|
||||
</li>
|
||||
</ol>
|
||||
</div>
|
||||
<div class="grid gap-1">
|
||||
<h3>
|
||||
<div class="grid milestone__description">
|
||||
<p>
|
||||
The client-side team should contain members from following teams
|
||||
</p>
|
||||
<ol type="1">
|
||||
<li>
|
||||
Management
|
||||
</li>
|
||||
<li>
|
||||
Finance
|
||||
</li>
|
||||
<li>
|
||||
Technology
|
||||
</li>
|
||||
</ol>
|
||||
</div>
|
||||
</li>
|
||||
<li class="grid gap-1 milestone">
|
||||
<div class="milestone__label">2</div>
|
||||
<h3 class="milestone__title">
|
||||
Approval from the board or higher management
|
||||
</h3>
|
||||
<p>
|
||||
Before tokenization can begin the higher management or the board must commit resources required
|
||||
for
|
||||
the tokenization project.
|
||||
</p>
|
||||
<p>
|
||||
Higher management must also undertake to communicate details of the initiative to employees,
|
||||
customers and other stake holders.
|
||||
</p>
|
||||
<p>
|
||||
A dedicated budget for the project must be approved.
|
||||
</p>
|
||||
</div>
|
||||
<div class="grid gap-1">
|
||||
<h3>Project B team</h3>
|
||||
<p>
|
||||
Project B will perform the initial economic design of the tokenization project.
|
||||
</p>
|
||||
<p>
|
||||
It will setup the technology page consisting of <strong>tokens</strong>,
|
||||
<strong>Smartcontracts</strong>, <strong>multisigs</strong>, <strong>markets</strong> and
|
||||
<strong>private key security infrastructure</strong>.
|
||||
</p>
|
||||
</div>
|
||||
<div class="grid gap-1">
|
||||
<h3>
|
||||
Regulatory Team
|
||||
<div class="grid milestone__description gap-1">
|
||||
<p>
|
||||
Before tokenization can begin the higher management or the board must commit resources
|
||||
required
|
||||
for
|
||||
the tokenization project.
|
||||
</p>
|
||||
<p>
|
||||
Higher management must also undertake to communicate details of the initiative to employees,
|
||||
customers and other stake holders.
|
||||
</p>
|
||||
<p>
|
||||
A dedicated budget for the project must be approved.
|
||||
</p>
|
||||
</div>
|
||||
</li>
|
||||
<li class="grid gap-1 milestone">
|
||||
<div class="milestone__label">3</div>
|
||||
<h3 class="milestone__title">Project B team role</h3>
|
||||
<div class="grid milestone__description gap-1">
|
||||
<p>
|
||||
Project B will perform the initial economic design of the tokenization project.
|
||||
</p>
|
||||
<p>
|
||||
It will setup the technology page consisting of <strong>tokens</strong>,
|
||||
<strong>Smartcontracts</strong>, <strong>multisigs</strong>, <strong>markets</strong> and
|
||||
<strong>private key security infrastructure</strong>.
|
||||
</p>
|
||||
</div>
|
||||
</li>
|
||||
<li class="grid gap-1 milestone">
|
||||
<div class="milestone__label">4</div>
|
||||
<h3 class="milestone__title">
|
||||
Regulatory team role
|
||||
</h3>
|
||||
<p>
|
||||
<p class="milestone__description">
|
||||
The regulatory team will review controls related to <strong>KYC</strong> (Know Your customer),
|
||||
<strong>AML</strong> (Anti Money
|
||||
Laundering) and
|
||||
<strong>National Digital Assets Regulations</strong> if applicable.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
</u>
|
||||
</section>
|
||||
<section>
|
||||
<h2 class="reveal"><span>Team</span></h4>
|
||||
@ -621,18 +660,6 @@
|
||||
href="https://twitter.com/SarwanSumer/status/1641761374505435138?ref_src=twsrc%5Etfw">March 31,
|
||||
2023</a>
|
||||
</blockquote>
|
||||
<iframe loading="lazy" width="560" height="315" src="https://www.youtube-nocookie.com/embed/M4AD4uIwndk"
|
||||
title="YouTube video player" frameborder="0"
|
||||
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
|
||||
allowfullscreen></iframe>
|
||||
<iframe loading="lazy" width="560" height="315" src="https://www.youtube-nocookie.com/embed/TrIbxCBXKAk"
|
||||
title="YouTube video player" frameborder="0"
|
||||
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
|
||||
allowfullscreen></iframe>
|
||||
<iframe loading="lazy" width="560" height="315" src="https://www.youtube-nocookie.com/embed/FmWliBxLPAQ"
|
||||
title="YouTube video player" frameborder="0"
|
||||
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
|
||||
allowfullscreen></iframe>
|
||||
</div>
|
||||
</section>
|
||||
<section id="socials_section">
|
||||
@ -769,81 +796,216 @@
|
||||
</section>
|
||||
</article>
|
||||
<article id="economic_framework" class="page hidden">
|
||||
<h2 class="reveal"><span>Economic framework deployed</span></h2>
|
||||
<div>
|
||||
<ol type="1">
|
||||
<li>
|
||||
<h2>Tokenization = Economic Framework + Blockchain Technology</h2>
|
||||
<div class="grid gap-2">
|
||||
<h3>Blockchain technology that Project B will implement</h3>
|
||||
<ul id="technologies_needed">
|
||||
<li style="--delay: 0s">
|
||||
<svg class="icon" xmlns="http://www.w3.org/2000/svg" enable-background="new 0 0 24 24" height="24px"
|
||||
viewBox="0 0 24 24" width="24px" fill="#000000">
|
||||
<g>
|
||||
<path d="M0,0h24v24H0V0z" fill="none"></path>
|
||||
</g>
|
||||
<g>
|
||||
<g>
|
||||
<rect height="2" width="2" x="17" y="7"></rect>
|
||||
<rect height="2" width="2" x="17" y="11"></rect>
|
||||
<rect height="2" width="2" x="17" y="15"></rect>
|
||||
<path d="M1,11v10h6v-5h2v5h6V11L8,6L1,11z M13,19h-2v-5H5v5H3v-7l5-3.5l5,3.5V19z"></path>
|
||||
<polygon points="10,3 10,4.97 12,6.4 12,5 21,5 21,19 17,19 17,21 23,21 23,3"></polygon>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
Token transfer system
|
||||
</li>
|
||||
<li style="--delay: 0.1s">
|
||||
<svg class="icon" xmlns="http://www.w3.org/2000/svg" enable-background="new 0 0 24 24" height="24px"
|
||||
viewBox="0 0 24 24" width="24px" fill="#000000">
|
||||
<rect fill="none" height="24" width="24"></rect>
|
||||
<path
|
||||
d="M9,4c-4.42,0-8,3.58-8,8c0,4.42,3.58,8,8,8s8-3.58,8-8C17,7.58,13.42,4,9,4z M9,18c-3.31,0-6-2.69-6-6s2.69-6,6-6 s6,2.69,6,6S12.31,18,9,18z M12,10.5h-2v5H8v-5H6V9h6V10.5z M20.25,3.75L23,5l-2.75,1.25L19,9l-1.25-2.75L15,5l2.75-1.25L19,1 L20.25,3.75z M20.25,17.75L23,19l-2.75,1.25L19,23l-1.25-2.75L15,19l2.75-1.25L19,15L20.25,17.75z">
|
||||
</path>
|
||||
</svg>
|
||||
Smart contract system
|
||||
</li>
|
||||
<li style="--delay: 0.2s">
|
||||
<svg class="icon" xmlns="http://www.w3.org/2000/svg" enable-background="new 0 0 24 24" height="24px"
|
||||
viewBox="0 0 24 24" width="24px" fill="#000000">
|
||||
<g>
|
||||
<rect fill="none" height="24" width="24"></rect>
|
||||
</g>
|
||||
<g>
|
||||
<path
|
||||
d="M17,11V3H7v4H3v14h8v-4h2v4h8V11H17z M7,19H5v-2h2V19z M7,15H5v-2h2V15z M7,11H5V9h2V11z M11,15H9v-2h2V15z M11,11H9V9h2 V11z M11,7H9V5h2V7z M15,15h-2v-2h2V15z M15,11h-2V9h2V11z M15,7h-2V5h2V7z M19,19h-2v-2h2V19z M19,15h-2v-2h2V15z">
|
||||
</path>
|
||||
</g>
|
||||
</svg>
|
||||
Token and smart contract explorer
|
||||
</li>
|
||||
<li style="--delay: 0.3s">
|
||||
<svg class="icon" xmlns="http://www.w3.org/2000/svg" enable-background="new 0 0 24 24" height="24px"
|
||||
viewBox="0 0 24 24" width="24px" fill="#000000">
|
||||
<g>
|
||||
<rect fill="none" height="24" width="24"></rect>
|
||||
</g>
|
||||
<g>
|
||||
<path
|
||||
d="M20,4H4C2.89,4,2,4.9,2,6v12c0,1.1,0.89,2,2,2h16c1.1,0,2-0.9,2-2V6C22,4.9,21.11,4,20,4z M20,18H4V8h16V18z M18,17h-6v-2 h6V17z M7.5,17l-1.41-1.41L8.67,13l-2.59-2.59L7.5,9l4,4L7.5,17z">
|
||||
</path>
|
||||
</g>
|
||||
</svg>
|
||||
Bitcoin based messaging system
|
||||
</li>
|
||||
<li style="--delay: 0.4s">
|
||||
<svg class="icon" xmlns="http://www.w3.org/2000/svg" enable-background="new 0 0 24 24" height="24px"
|
||||
viewBox="0 0 24 24" width="24px" fill="#000000">
|
||||
<g>
|
||||
<rect fill="none" height="24" width="24"></rect>
|
||||
<path
|
||||
d="M15.5,13.5c0,2-2.5,3.5-2.5,5h-2c0-1.5-2.5-3-2.5-5c0-1.93,1.57-3.5,3.5-3.5h0C13.93,10,15.5,11.57,15.5,13.5z M13,19.5h-2 V21h2V19.5z M19,13c0,1.68-0.59,3.21-1.58,4.42l1.42,1.42C20.18,17.27,21,15.23,21,13c0-2.74-1.23-5.19-3.16-6.84l-1.42,1.42 C17.99,8.86,19,10.82,19,13z M16,5l-4-4v3c0,0,0,0,0,0c-4.97,0-9,4.03-9,9c0,2.23,0.82,4.27,2.16,5.84l1.42-1.42 C5.59,16.21,5,14.68,5,13c0-3.86,3.14-7,7-7c0,0,0,0,0,0v3L16,5z">
|
||||
</path>
|
||||
</g>
|
||||
</svg>
|
||||
Bitcoin based multisig account
|
||||
</li>
|
||||
<li style="--delay: 0.5s">
|
||||
<svg class="icon" xmlns="http://www.w3.org/2000/svg" enable-background="new 0 0 24 24" height="24px"
|
||||
viewBox="0 0 24 24" width="24px" fill="#000000">
|
||||
<g>
|
||||
<rect fill="none" height="24" width="24"></rect>
|
||||
<path
|
||||
d="M14,2H6C4.9,2,4,2.9,4,4v16c0,1.1,0.9,2,2,2h12c1.1,0,2-0.9,2-2V8L14,2z M6,20V4h7v4h5v12H6z M11,19h2v-1h1 c0.55,0,1-0.45,1-1v-3c0-0.55-0.45-1-1-1h-3v-1h4v-2h-2V9h-2v1h-1c-0.55,0-1,0.45-1,1v3c0,0.55,0.45,1,1,1h3v1H9v2h2V19z">
|
||||
</path>
|
||||
</g>
|
||||
</svg>
|
||||
Tools to protect private keys
|
||||
</li>
|
||||
</div>
|
||||
</ul>
|
||||
|
||||
<h3 class="reveal"><span>Why is economic framework needed</span></h3>
|
||||
<ul class="milestones milestones--description-only">
|
||||
<li class="milestone">
|
||||
<div class="milestone__label">1</div>
|
||||
<p class="milestone__description">
|
||||
The economic framework enforces the discipline to ensure that the valuation of the token is
|
||||
sustainable.
|
||||
</li>
|
||||
<li>
|
||||
</p>
|
||||
</li>
|
||||
<li class="milestone">
|
||||
<div class="milestone__label">2</div>
|
||||
<p class="milestone__description">
|
||||
Guarantees the resources needed to support the token valuation.
|
||||
</li>
|
||||
<li>
|
||||
</p>
|
||||
</li>
|
||||
<li class="milestone">
|
||||
<div class="milestone__label">3</div>
|
||||
<p class="milestone__description">
|
||||
Creates a benchmark for minimum token valuation. Which the project can support by itself.
|
||||
</li>
|
||||
<li>
|
||||
</p>
|
||||
</li>
|
||||
<li class="milestone">
|
||||
<div class="milestone__label">4</div>
|
||||
<p class="milestone__description">
|
||||
Prevents the token project from becoming a Ponzi scheme.
|
||||
</li>
|
||||
<li>
|
||||
</p>
|
||||
</li>
|
||||
<li class="milestone">
|
||||
<div class="milestone__label">5</div>
|
||||
<p class="milestone__description">
|
||||
The economic framework ensures that the token valuation will increase forever if the verifiable
|
||||
consumption metrics are increasing forever.
|
||||
</p>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="grid gap-2">
|
||||
<h3>Economic framework that Project B will follow</h3>
|
||||
<ul class="milestones milestones--title-only">
|
||||
<li class="milestone">
|
||||
<div class="milestone__label">1</div>
|
||||
<h4 class="milestone__description">
|
||||
Establish Production & Consumption metrics
|
||||
</h4>
|
||||
</li>
|
||||
</ol>
|
||||
</div>
|
||||
<div class="grid gap-1">
|
||||
<h4>Steps</h4>
|
||||
<ol type="1">
|
||||
<li>
|
||||
Establish Production & Consumption metrics
|
||||
<li class="milestone">
|
||||
<div class="milestone__label">2</div>
|
||||
<h4 class="milestone__description">
|
||||
Establish production valuation metrics
|
||||
</h4>
|
||||
</li>
|
||||
<li>
|
||||
Establish production valuation metrics
|
||||
|
||||
<li class="milestone">
|
||||
<div class="milestone__label">3</div>
|
||||
<h4 class="milestone__description">
|
||||
Establish consumption valuation metrics
|
||||
</h4>
|
||||
</li>
|
||||
<li>
|
||||
Establish consumption valuation metrics
|
||||
|
||||
<li class="milestone">
|
||||
<div class="milestone__label">4</div>
|
||||
<h4 class="milestone__description">
|
||||
Create structure for System valuation
|
||||
</h4>
|
||||
</li>
|
||||
<li>
|
||||
Create structure for System valuation
|
||||
|
||||
<li class="milestone">
|
||||
<div class="milestone__label">5</div>
|
||||
<h4 class="milestone__description">
|
||||
Design Ownership tokens, and the relation to system ownership & valuation
|
||||
</h4>
|
||||
</li>
|
||||
<li>
|
||||
Design Ownership tokens, and the relation to system ownership & valuation
|
||||
|
||||
<li class="milestone">
|
||||
<div class="milestone__label">6</div>
|
||||
<h4 class="milestone__description">
|
||||
Design system for Reserve tokens
|
||||
</h4>
|
||||
</li>
|
||||
<li>
|
||||
Design system for Reserve tokens
|
||||
<li class="milestone">
|
||||
<div class="milestone__label">7</div>
|
||||
<h4 class="milestone__description">
|
||||
Create incentives for the initial investors
|
||||
</h4>
|
||||
</li>
|
||||
<li>
|
||||
Create incentives for the initial investors
|
||||
<li class="milestone">
|
||||
<div class="milestone__label">8</div>
|
||||
<h4 class="milestone__description">
|
||||
Link initial tokens to production valuation
|
||||
</h4>
|
||||
</li>
|
||||
<li>
|
||||
Link initial tokens to production valuation
|
||||
<li class="milestone">
|
||||
<div class="milestone__label">9</div>
|
||||
<h4 class="milestone__description">
|
||||
Design valuation of token trading system
|
||||
</h4>
|
||||
</li>
|
||||
<li>
|
||||
Design valuation of token trading system
|
||||
<li class="milestone">
|
||||
<div class="milestone__label">10</div>
|
||||
<h4 class="milestone__description">
|
||||
Design ownership token trading system
|
||||
</h4>
|
||||
</li>
|
||||
<li>
|
||||
Design ownership token trading system
|
||||
<li class="milestone">
|
||||
<div class="milestone__label">11</div>
|
||||
<h4 class="milestone__description">
|
||||
Create the reserve pool
|
||||
</h4>
|
||||
</li>
|
||||
<li>
|
||||
Create the reserve pool
|
||||
<li class="milestone">
|
||||
<div class="milestone__label">12</div>
|
||||
<h4 class="milestone__description">
|
||||
Design safety nets
|
||||
</h4>
|
||||
</li>
|
||||
<li>
|
||||
Design safety nets
|
||||
<li class="milestone">
|
||||
<div class="milestone__label">13</div>
|
||||
<h4 class="milestone__description">
|
||||
Design governance system
|
||||
</h4>
|
||||
</li>
|
||||
<li>
|
||||
Design governance system
|
||||
</li>
|
||||
</ol>
|
||||
</ul>
|
||||
<a class="button justify-self-start" href="https://medium.com/ranchimall/economic-system-5c85144e4726"
|
||||
target="_blank">More
|
||||
details</a>
|
||||
</div>
|
||||
<div class="grid gap-1">
|
||||
<h4>Key concepts</h4>
|
||||
<div class="grid gap-2">
|
||||
<h3>Key definitions</h3>
|
||||
<ul>
|
||||
<li>
|
||||
<strong>Production Valuation</strong>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user