Compare commits

...

1 Commits

Author SHA1 Message Date
Vivek Teega
7f996681ab Adding older UI 2020-06-25 02:06:30 +05:30
17 changed files with 33575 additions and 4981 deletions

146
FLO_horizontal_text.svg Normal file
View File

@ -0,0 +1,146 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Generator: Adobe Illustrator 15.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<svg
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
version="1.1"
id="Layer_1"
x="0px"
y="0px"
width="469.89999"
height="212.84599"
viewBox="0 0 469.89999 212.84599"
enable-background="new 0 0 512 512"
xml:space="preserve"
sodipodi:docname="FLO_horizontal_text.svg"
inkscape:version="0.92.4 (unknown)"><metadata
id="metadata4665"><rdf:RDF><cc:Work
rdf:about=""><dc:format>image/svg+xml</dc:format><dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" /><dc:title></dc:title></cc:Work></rdf:RDF></metadata><defs
id="defs4663" /><sodipodi:namedview
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1"
objecttolerance="10"
gridtolerance="10"
guidetolerance="10"
inkscape:pageopacity="0"
inkscape:pageshadow="2"
inkscape:window-width="1366"
inkscape:window-height="732"
id="namedview4661"
showgrid="false"
inkscape:zoom="1.3027344"
inkscape:cx="219.90846"
inkscape:cy="85.00108"
inkscape:window-x="0"
inkscape:window-y="0"
inkscape:window-maximized="1"
inkscape:current-layer="Layer_1"
fit-margin-top="-0.1"
fit-margin-left="0"
fit-margin-right="0"
fit-margin-bottom="0" /><linearGradient
id="SVGID_1_"
gradientUnits="userSpaceOnUse"
x1="337.43359"
y1="263.58591"
x2="394.418"
y2="263.58591"><stop
offset="0"
style="stop-color:#2583A6"
id="stop4615" /><stop
offset="0.5"
style="stop-color:#257EA3"
id="stop4617" /><stop
offset="1"
style="stop-color:#237AA0"
id="stop4619" /></linearGradient><polygon
points="394.418,304.29 337.434,304.29 337.434,222.882 351.623,222.882 351.623,291.387 394.418,291.387 "
id="polygon4622"
style="fill:url(#SVGID_1_)"
transform="translate(-21.05,-128.155)" /><linearGradient
id="SVGID_2_"
gradientUnits="userSpaceOnUse"
x1="405.81641"
y1="263.58591"
x2="490.94919"
y2="263.58591"
gradientTransform="translate(-21.05,-128.155)"><stop
offset="0"
style="stop-color:#2583A6"
id="stop4624" /><stop
offset="0.5"
style="stop-color:#257EA3"
id="stop4626" /><stop
offset="1"
style="stop-color:#237AA0"
id="stop4628" /></linearGradient><path
d="m 427.217,177.532 c -6.278,0 -12.015,-1.107 -17.215,-3.312 -5.189,-2.209 -9.647,-5.215 -13.372,-9.017 -3.723,-3.797 -6.629,-8.232 -8.72,-13.318 -2.098,-5.078 -3.144,-10.482 -3.144,-16.224 v -0.232 c 0,-5.744 1.046,-11.143 3.144,-16.226 2.091,-5.083 5.036,-9.53 8.834,-13.373 3.802,-3.836 8.299,-6.884 13.497,-9.134 5.192,-2.238 10.929,-3.367 17.211,-3.367 6.276,0 12.017,1.106 17.209,3.312 5.197,2.211 9.653,5.217 13.374,9.018 3.724,3.799 6.632,8.233 8.724,13.311 2.094,5.081 3.141,10.489 3.141,16.228 v 0.233 c 0,5.733 -1.047,11.143 -3.141,16.218 -2.093,5.082 -5.038,9.544 -8.838,13.382 -3.8,3.842 -8.295,6.882 -13.49,9.12 -5.195,2.255 -10.932,3.381 -17.214,3.381 m 0.235,-13.142 c 4.013,0 7.694,-0.757 11.065,-2.272 3.354,-1.506 6.222,-3.564 8.627,-6.162 2.383,-2.595 4.269,-5.641 5.603,-9.126 1.356,-3.491 2.036,-7.213 2.036,-11.168 v -0.232 c 0,-3.952 -0.68,-7.692 -2.036,-11.222 -1.333,-3.529 -3.237,-6.593 -5.663,-9.19 -2.44,-2.591 -5.352,-4.673 -8.743,-6.224 -3.406,-1.55 -7.107,-2.323 -11.124,-2.323 -4.013,0 -7.691,0.752 -11.063,2.269 -3.356,1.509 -6.226,3.563 -8.627,6.159 -2.388,2.601 -4.268,5.649 -5.602,9.141 -1.355,3.486 -2.036,7.206 -2.036,11.16 v 0.233 c 0,3.956 0.679,7.69 2.036,11.222 1.334,3.527 3.232,6.594 5.658,9.188 2.444,2.598 5.352,4.672 8.743,6.218 3.411,1.553 7.109,2.329 11.126,2.329 z"
id="path4631"
inkscape:connector-curvature="0"
style="fill:url(#SVGID_2_)" /><linearGradient
id="SVGID_3_"
gradientUnits="userSpaceOnUse"
x1="261.1416"
y1="281.26169"
x2="316.3848"
y2="281.26169"><stop
offset="0"
style="stop-color:#2583A6"
id="stop4633" /><stop
offset="0.5"
style="stop-color:#257EA3"
id="stop4635" /><stop
offset="1"
style="stop-color:#237AA0"
id="stop4637" /></linearGradient><polygon
points="261.142,258.232 261.142,304.29 275.331,304.29 275.331,271.142 316.385,271.142 316.385,258.232 275.331,258.232 "
id="polygon4640"
style="fill:url(#SVGID_3_)"
transform="translate(-21.05,-128.155)" /><linearGradient
id="SVGID_4_"
gradientUnits="userSpaceOnUse"
x1="291.3779"
y1="235.7881"
x2="291.3779"
y2="222.88181"><stop
offset="0"
style="stop-color:#2583A6"
id="stop4642" /><stop
offset="0.5"
style="stop-color:#257EA3"
id="stop4644" /><stop
offset="1"
style="stop-color:#237AA0"
id="stop4646" /></linearGradient><polygon
points="261.142,222.882 261.142,235.788 275.331,235.788 321.614,235.788 321.614,222.882 "
id="polygon4649"
style="fill:url(#SVGID_4_)"
transform="translate(-21.05,-128.155)" /><linearGradient
id="SVGID_5_"
gradientUnits="userSpaceOnUse"
x1="125.481"
y1="341.00101"
x2="125.4809"
y2="128.05569"
gradientTransform="translate(-21.05,-128.155)"><stop
offset="0"
style="stop-color:#2583A6"
id="stop4651" /><stop
offset="0.5"
style="stop-color:#257EA3"
id="stop4653" /><stop
offset="1"
style="stop-color:#237AA0"
id="stop4655" /></linearGradient><path
d="m 104.43,151.572 c -12.005,15.862 -12.005,31.461 0,46.797 12.01,-15.336 12.009,-30.935 0,-46.797 m 0,-129.492 c -27.559,34.767 -27.559,70.133 0,106.11 27.566,-35.977 27.564,-71.344 0,-106.11 z M 42.006,177.043 C 52.166,153.951 73.451,142.555 97.22,142.842 67.063,111.547 40.869,98.934 18.64,105.024 21.594,122.279 33.596,136.941 54.639,149.021 30.427,141.376 12.211,122.884 0,93.543 36.328,87.372 64.932,96.328 85.813,120.389 66.772,79.675 72.972,39.513 104.428,-0.1 c 31.459,39.613 37.663,79.774 18.622,120.489 20.883,-24.062 49.485,-33.018 85.812,-26.846 -12.211,29.341 -30.423,47.834 -54.637,55.478 21.044,-12.08 33.042,-26.742 35.999,-43.997 -22.23,-6.089 -48.425,6.524 -78.581,37.818 23.77,-0.287 45.053,11.11 55.215,34.201 -17.962,4.017 -32.733,1.268 -44.307,-8.254 12.642,6.396 23.558,7.348 32.737,2.861 -4.021,-12.157 -21.792,-20.554 -44.521,-25.198 12.966,22.459 10.855,44.594 -6.338,66.394 -17.188,-21.8 -19.298,-43.935 -6.334,-66.394 -22.727,4.645 -40.5,13.041 -44.519,25.198 9.179,4.485 20.091,3.535 32.737,-2.861 -11.575,9.522 -26.345,12.271 -44.307,8.254 z"
id="path4658"
inkscape:connector-curvature="0"
style="fill:url(#SVGID_5_)" /></svg>

After

Width:  |  Height:  |  Size: 7.0 KiB

37
FLO_horizontal_text1.svg Normal file
View File

@ -0,0 +1,37 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="59pt" height="27pt" viewBox="0 0 59 27" version="1.1">
<defs>
<linearGradient id="linear0" gradientUnits="userSpaceOnUse" x1="337.43359" y1="263.58591" x2="394.418" y2="263.58591" gradientTransform="matrix(0.125532,0,0,0.126761,-2.642447,-16.245)">
<stop offset="0" style="stop-color:rgb(14.509804%,51.372549%,65.098039%);stop-opacity:1;"/>
<stop offset="0.5" style="stop-color:rgb(14.509804%,49.411765%,63.921569%);stop-opacity:1;"/>
<stop offset="1" style="stop-color:rgb(13.72549%,47.843137%,62.745098%);stop-opacity:1;"/>
</linearGradient>
<linearGradient id="linear1" gradientUnits="userSpaceOnUse" x1="405.81641" y1="263.58591" x2="490.94919" y2="263.58591" gradientTransform="matrix(0.125532,0,0,0.126761,-2.642447,-16.245)">
<stop offset="0" style="stop-color:rgb(14.509804%,51.372549%,65.098039%);stop-opacity:1;"/>
<stop offset="0.5" style="stop-color:rgb(14.509804%,49.411765%,63.921569%);stop-opacity:1;"/>
<stop offset="1" style="stop-color:rgb(13.72549%,47.843137%,62.745098%);stop-opacity:1;"/>
</linearGradient>
<linearGradient id="linear2" gradientUnits="userSpaceOnUse" x1="261.1416" y1="281.26169" x2="316.3848" y2="281.26169" gradientTransform="matrix(0.125532,0,0,0.126761,-2.642447,-16.245)">
<stop offset="0" style="stop-color:rgb(14.509804%,51.372549%,65.098039%);stop-opacity:1;"/>
<stop offset="0.5" style="stop-color:rgb(14.509804%,49.411765%,63.921569%);stop-opacity:1;"/>
<stop offset="1" style="stop-color:rgb(13.72549%,47.843137%,62.745098%);stop-opacity:1;"/>
</linearGradient>
<linearGradient id="linear3" gradientUnits="userSpaceOnUse" x1="291.3779" y1="235.7881" x2="291.3779" y2="222.88181" gradientTransform="matrix(0.125532,0,0,0.126761,-2.642447,-16.245)">
<stop offset="0" style="stop-color:rgb(14.509804%,51.372549%,65.098039%);stop-opacity:1;"/>
<stop offset="0.5" style="stop-color:rgb(14.509804%,49.411765%,63.921569%);stop-opacity:1;"/>
<stop offset="1" style="stop-color:rgb(13.72549%,47.843137%,62.745098%);stop-opacity:1;"/>
</linearGradient>
<linearGradient id="linear4" gradientUnits="userSpaceOnUse" x1="125.481" y1="341.00101" x2="125.4809" y2="128.05569" gradientTransform="matrix(0.125532,0,0,0.126761,-2.642447,-16.245)">
<stop offset="0" style="stop-color:rgb(14.509804%,51.372549%,65.098039%);stop-opacity:1;"/>
<stop offset="0.5" style="stop-color:rgb(14.509804%,49.411765%,63.921569%);stop-opacity:1;"/>
<stop offset="1" style="stop-color:rgb(13.72549%,47.843137%,62.745098%);stop-opacity:1;"/>
</linearGradient>
</defs>
<g id="surface1">
<path style=" stroke:none;fill-rule:nonzero;fill:url(#linear0);" d="M 46.871094 22.328125 L 39.714844 22.328125 L 39.714844 12.007812 L 41.496094 12.007812 L 41.496094 20.691406 L 46.871094 20.691406 Z M 46.871094 22.328125 "/>
<path style=" stroke:none;fill-rule:nonzero;fill:url(#linear1);" d="M 53.628906 22.503906 C 52.839844 22.503906 52.121094 22.363281 51.46875 22.085938 C 50.816406 21.804688 50.257812 21.421875 49.789062 20.941406 C 49.324219 20.460938 48.957031 19.898438 48.695312 19.253906 C 48.433594 18.609375 48.300781 17.925781 48.300781 17.195312 L 48.300781 17.167969 C 48.300781 16.4375 48.433594 15.753906 48.695312 15.109375 C 48.957031 14.464844 49.328125 13.902344 49.804688 13.414062 C 50.28125 12.929688 50.847656 12.542969 51.5 12.257812 C 52.148438 11.972656 52.871094 11.832031 53.660156 11.832031 C 54.445312 11.832031 55.167969 11.96875 55.820312 12.25 C 56.472656 12.53125 57.03125 12.910156 57.496094 13.394531 C 57.964844 13.875 58.332031 14.4375 58.59375 15.082031 C 58.855469 15.726562 58.988281 16.410156 58.988281 17.136719 L 58.988281 17.167969 C 58.988281 17.894531 58.855469 18.578125 58.59375 19.222656 C 58.332031 19.867188 57.960938 20.433594 57.484375 20.917969 C 57.007812 21.40625 56.441406 21.792969 55.789062 22.074219 C 55.136719 22.359375 54.417969 22.503906 53.628906 22.503906 M 53.660156 20.839844 C 54.164062 20.839844 54.625 20.742188 55.046875 20.550781 C 55.46875 20.359375 55.828125 20.097656 56.128906 19.769531 C 56.429688 19.441406 56.667969 19.054688 56.835938 18.613281 C 57.003906 18.167969 57.089844 17.699219 57.089844 17.195312 L 57.089844 17.167969 C 57.089844 16.667969 57.003906 16.191406 56.835938 15.746094 C 56.667969 15.296875 56.429688 14.910156 56.125 14.578125 C 55.816406 14.25 55.453125 13.988281 55.027344 13.789062 C 54.597656 13.59375 54.132812 13.496094 53.628906 13.496094 C 53.125 13.496094 52.664062 13.589844 52.242188 13.785156 C 51.820312 13.976562 51.460938 14.234375 51.15625 14.566406 C 50.859375 14.894531 50.621094 15.28125 50.453125 15.722656 C 50.285156 16.164062 50.199219 16.636719 50.199219 17.136719 L 50.199219 17.167969 C 50.199219 17.667969 50.285156 18.140625 50.453125 18.589844 C 50.621094 19.039062 50.859375 19.425781 51.164062 19.753906 C 51.472656 20.085938 51.835938 20.347656 52.261719 20.542969 C 52.691406 20.738281 53.15625 20.839844 53.660156 20.839844 Z M 53.660156 20.839844 "/>
<path style=" stroke:none;fill-rule:nonzero;fill:url(#linear2);" d="M 30.140625 16.488281 L 30.140625 22.328125 L 31.921875 22.328125 L 31.921875 18.125 L 37.074219 18.125 L 37.074219 16.488281 Z M 30.140625 16.488281 "/>
<path style=" stroke:none;fill-rule:nonzero;fill:url(#linear3);" d="M 30.140625 12.007812 L 30.140625 13.644531 L 37.730469 13.644531 L 37.730469 12.007812 Z M 30.140625 12.007812 "/>
<path style=" stroke:none;fill-rule:nonzero;fill:url(#linear4);" d="M 13.109375 19.214844 C 11.601562 21.222656 11.601562 23.203125 13.109375 25.144531 C 14.617188 23.203125 14.617188 21.222656 13.109375 19.214844 M 13.109375 2.800781 C 9.648438 7.207031 9.648438 11.6875 13.109375 16.25 C 16.570312 11.6875 16.570312 7.207031 13.109375 2.800781 Z M 5.273438 22.441406 C 6.546875 19.515625 9.21875 18.070312 12.203125 18.105469 C 8.417969 14.140625 5.128906 12.539062 2.339844 13.3125 C 2.710938 15.5 4.21875 17.359375 6.859375 18.890625 C 3.820312 17.921875 1.53125 15.578125 0 11.859375 C 4.558594 11.074219 8.152344 12.210938 10.773438 15.261719 C 8.382812 10.101562 9.160156 5.007812 13.109375 -0.0117188 C 17.058594 5.007812 17.835938 10.097656 15.445312 15.261719 C 18.066406 12.210938 21.660156 11.074219 26.21875 11.859375 C 24.6875 15.578125 22.398438 17.921875 19.359375 18.890625 C 22 17.359375 23.507812 15.5 23.878906 13.3125 C 21.089844 12.542969 17.800781 14.140625 14.015625 18.105469 C 17 18.070312 19.671875 19.515625 20.945312 22.441406 C 18.691406 22.953125 16.835938 22.601562 15.382812 21.394531 C 16.972656 22.207031 18.339844 22.328125 19.492188 21.757812 C 18.988281 20.21875 16.757812 19.152344 13.90625 18.5625 C 15.53125 21.410156 15.265625 24.21875 13.109375 26.980469 C 10.953125 24.21875 10.6875 21.410156 12.3125 18.5625 C 9.460938 19.152344 7.230469 20.21875 6.726562 21.757812 C 7.878906 22.328125 9.246094 22.207031 10.835938 21.394531 C 9.382812 22.601562 7.527344 22.953125 5.273438 22.441406 Z M 5.273438 22.441406 "/>
</g>
</svg>

After

Width:  |  Height:  |  Size: 6.8 KiB

3740
address.html Normal file

File diff suppressed because one or more lines are too long

3379
block.html Normal file

File diff suppressed because one or more lines are too long

3985
contract.html Normal file

File diff suppressed because one or more lines are too long

File diff suppressed because it is too large Load Diff

File diff suppressed because one or more lines are too long

View File

@ -1,870 +0,0 @@
@import url('https://fonts.googleapis.com/css2?family=Barlow:wght@500;600;700&family=Roboto:wght@400;500;700&display=swap');
*,
::before,
::after{
padding: 0;
margin: 0;
box-sizing: border-box;
font-family: 'Roboto', sans-serif;
}
body{
--primary-color: #1565C0;
--text: 17, 17, 17;
--text-light: 100, 100, 100;
--foreground: 255, 255, 255;
--background: #e8e8e8;
--dark-shade: #dadada;
font-size: 16px;
color: rgba(var(--text), 1);
background: rgba(var(--foreground), 1);
background-size: cover;
}
body[data-theme='dark']{
--primary-color: #2196F3;
--text: 218, 218, 218;
--text-light: 170, 170, 170;
--foreground: 20, 20, 20;
--background: #0a0a0a;
--dark-shade: #1a1a1a;
}
input[type=text]::-ms-clear { display: none; width : 0; height: 0; }
input[type=text]::-ms-reveal { display: none; width : 0; height: 0; }
input[type="search"]::-webkit-search-decoration,
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-results-button,
input[type="search"]::-webkit-search-results-decoration { display: none; }
input[type=number] {
-moz-appearance:textfield;
}
input:invalid{
outline: none;
box-shadow: none;
}
::-moz-focus-inner{
border: none;
}
button{
border: none;
border-radius: 0.2em;
text-transform: uppercase;
font-weight: 500;
letter-spacing: 0.06em;
background: none;
cursor: pointer;
padding: 0.6rem 1rem;
color: var(--primary-color);
align-self: center;
}
h1{
font-size: 4rem;
}
h2{
font-size: 2rem;
font-weight: 500;
}
h3{
font-size: 1.5rem;
}
.flex{
display: flex;
}
.grid{
display: grid;
}
.grid-2{
grid-template-columns: auto auto;
gap: 1em;
}
.hide{
opacity: 0;
pointer-events: none;
}
.hide-completely{
display: none !important;
}
.breakable{
word-break: break-word;
font-weight: 500;
letter-spacing: 0.06rem;
}
.other-font{
font-family: 'Barlow', sans-serif;
}
.uppercase{
text-transform: uppercase !important;
}
.capitalise{
text-transform: capitalize !important;
}
.toggle{
position: relative;
cursor: pointer;
z-index: 1;
input[type='checkbox']{
display: none;
}
.switch{
overflow: hidden;
display: inline-flex;
flex-direction: column;
justify-items: center;
padding: 0.2rem;
min-height: 1.6rem;
max-height: 1.6rem;
border-radius: 0.5rem;
position: relative;
}
.circle{
border-radius: 0.5rem;
transition: transform 0.3s;
&:first-of-type{
margin-bottom: 0.4rem;
}
fill: rgba(var(--text), 0.8);
overflow: visible;
stroke-linecap: round;
stroke-linejoin: round;
height: 1.2rem;
width: 1.2rem;
line{
stroke: rgba(var(--text), 0.8);
stroke-width: 6;
}
}
input:checked ~ .switch .circle{
transform: translateY(-1.7rem);
}
}
section{
position: relative;
.dark-background{
display: grid;
grid-template-rows: auto 1fr;
}
}
ul{
&[type='circle']{
padding: 1.5rem 2.5rem;
list-style: circle;
li{
margin-bottom: 1rem;
&:last-of-type{
margin-bottom: 0;
}
}
}
&{
list-style: none;
.balance{
margin-bottom: 2rem;
&:last-of-type{
margin-bottom: 0;
}
}
}
}
.top-bottom-padding{
padding: 1.5rem 0;
}
.margin, .page{
margin: 0 1.5rem;
}
.margin-left-auto{
margin-left: auto;
}
.card{
padding: 2rem 1.5rem;
border-radius: 0.5rem;
background: rgba(var(--text), 0.06);
margin: 1.5rem 0;
h4{
margin-bottom: 0.4rem;
font-weight: 400;
text-transform: capitalize;
}
h2{
margin-bottom: 1.5rem;
}
}
.transaction-container{
display: grid;
margin-top: 1.5rem;
gap: 1.5rem;
grid-template-columns: repeat(auto-fit, minmax(20rem, 1fr));
}
.label{
text-transform: capitalize;
font-size: 0.8rem;
margin-bottom: 0.3rem;
line-height: 1.4em;
color: rgba(var(--text-light), 1);
margin-top: 1.5rem;
font-weight: 400;
&:first-of-type{
margin-top: 0;
}
&+h4:not(.address){
text-transform: capitalize;
}
}
.header{
justify-items: center;
flex-direction: column;
}
#logo{
display: inline-flex;
letter-spacing: 0.1em;
align-items: center;
cursor: pointer;
h4{
font-weight: 400;
}
#main_logo{
height: 1.2rem;
width: 1.2rem;
margin-right: 0.2rem;
fill: rgba(var(--text), 1);
}
}
#homepage{
padding-top: 0;
}
#first_section{
display: grid;
grid-template-rows: 1fr auto;
min-height: calc(100vh - 8rem);
}
header.grid-2{
margin-top: 2rem;
}
#search_page{
position: fixed;
left: 0;
right: 0;
top: 0;
bottom: 0;
z-index: 20;
margin: 0;
background: rgba(var(--foreground), 1);
padding: 1.5rem 8vw;
header{
align-items: center;
justify-content: space-between;
margin-top: 2rem;
.icon{
margin: 0;
cursor: pointer;
height: 2.2rem;
width: 2.2rem;
padding: 0.6rem;
}
}
h1{
font-weight: 500;
font-size: 3rem;
}
.input{
animation: fade 0.4s;
input:valid ~ #suggestions{
opacity: 1;
pointer-events: all;
transform: none;
}
}
#suggestions{
opacity: 0;
pointer-events: none;
transform: translateY(-0.5rem);
transition: transform 0.3s, opacity 0.3s;
position: absolute;
top: 100%;
width: 100%;
background: var(--background);
border-radius: 0.5rem;
padding: 0.5rem 0;
max-height: 30vh;
overflow-y: auto;
&:empty{
padding: 0;
}
margin-top: 0.5rem;
}
.suggestion{
padding: 0.6rem 1.5rem 0.6rem 3rem;
opacity: 0.8;
cursor: pointer;
&:hover, &:focus{
opacity: 1;
}
}
}
#main_search{
position: relative;
display: flex;
flex-direction: column;
h2{
margin-top: 2rem;
align-self: flex-start;
font-size: 4rem;
letter-spacing: 0.1em;
font-weight: 600;
}
h4{
line-height: 1.4em;
margin-top: 2rem;
font-weight: 400;
color: rgba(var(--text-light), 1);
}
label{
position: relative;
}
}
.input{
border-radius: 0.2rem;
position: relative;
display: grid;
grid-template-columns: auto 1fr;
z-index: 1;
width: 100%;
margin: 1.5rem 0;
align-items: center;
padding: 0.8rem;
gap: 1em;
background: var(--background);
input{
border: none;
width: 100%;
background: transparent;
outline: none;
font-size: 1rem;
color: rgba(var(--text), 1);
}
}
.icon{
height: 1rem;
overflow: visible;
width: 1rem;
fill: none;
stroke: rgba(var(--text), 1);
stroke-linecap: round;
stroke-linejoin: round;
stroke-width: 6;
}
.copy-row{
display: grid;
grid-template-columns: 1fr auto;
align-items: center;
gap: 0.5rem;
.icon{
cursor: pointer;
}
}
#textCopied{
padding: 1rem;
border-radius: 2rem;
background: rgba(var(--text), 0.2);
color: rgba(var(--text), 1);
position: fixed;
bottom: 0;
pointer-events: none;
margin: 2rem 0;
left: 50%;
transform: translateX(-50%);
transition: 0.3s opacity ease;
z-index: 20;
}
@keyframes flyInLeft{
from{
opacity: 0;
transform: translateX(-0.5rem);
}
to{
opacity: 1;
transform: none;
}
}
@keyframes flyInRight{
from{
opacity: 0;
transform: translateX(0.5rem);
}
to{
opacity: 1;
transform: none;
}
}
@keyframes flyOutLeft{
from{
opacity: 1;
transform: none;
}
to{
opacity: 0;
transform: translateX(-0.5rem);
}
}
@keyframes flyOutRight{
from{
opacity: 1;
transform: none;
}
to{
opacity: 0;
transform: translateX(0.5rem);
}
}
.fly-in-from-left{
animation: flyInLeft 0.2s forwards;
}
.fly-in-from-right{
animation: flyInRight 0.2s forwards;
}
.fly-out-to-left{
animation: flyOutLeft 0.2s forwards;
}
.fly-out-to-right{
animation: flyOutRight 0.2s forwards;
}
#highlights{
padding: 1.5rem 0;
display: grid;
grid-template-columns: 1fr 1fr;
grid-template-areas: 'token token'
'total wallet'
'contract contract';
gap: 1.5rem;
.highlight-item{
opacity: 0;
display: flex;
flex-direction: column;
padding: 1.5rem;
border-left: 0.1rem solid rgba(var(--text), 0.2);
.label{
margin-top: auto;
}
h1{
font-size: 2rem;
letter-spacing: 0.1rem;
font-weight: 500;
text-transform: uppercase;
overflow-wrap: break-word;
}
&:first-of-type{
text-transform: uppercase;
}
&:nth-of-type(2){
text-transform: capitalize;
}
&:first-of-type{
grid-area: token;
animation: flyInLeft 0.4s 0.2s forwards;
}
&:nth-of-type(2){
grid-area: total;
animation: flyInLeft 0.4s 0.4s forwards;
}
&:nth-of-type(3){
grid-area: wallet;
animation: flyInLeft 0.4s 0.6s forwards;
}
&:last-of-type{
grid-area: contract;
animation: flyInLeft 0.4s 0.8s forwards;
}
}
}
#latest_transaction_section,
#latest_blocks_section{
background: rgba(var(--foreground), 1);
header{
grid-template-columns: 1fr auto;
background: inherit;
z-index: 2;
}
}
#main_header{
& > .flex:first-of-type{
margin-top: 1.5rem;
}
height: 8rem;
}
#page_header{
padding: 1rem 0;
align-items: center;
h3{
font-weight: 500;
text-transform: capitalize;
}
.icon{
height: 1.8rem;
width: 1.8rem;
cursor: pointer;
}
.icon:first-of-type{
margin-right: 1rem;
padding: 0.4rem 0.4rem 0.4rem 0;
}
.icon:nth-of-type(2){
padding: 0.4rem 0 0.4rem 0.4rem;
}
#secondary_search_btn{
margin-left: auto;
}
}
.page{
padding: 0 0 1rem 0;
h3.heading{
text-transform: capitalize;
font-weight: 500;
}
& > h3.heading{
margin-top: 2rem;
}
}
p{
overflow-wrap: break-word;
line-height: 1.6em;
text-transform: capitalize;
}
.balance-card{
display: inline-grid;
grid-template-columns: auto auto;
grid-template-areas: 'labl logo'
'balance logo'
'address address';
background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40' style='fill:none; stroke: %23ffffff08'%3E%3Ccircle cx='3.5' cy='3.5' r='2.12'/%3E%3Ccircle cx='5' cy='10' r='1'/%3E%3Ccircle cx='8.5' cy='4.5' r='1.5'/%3E%3Ccircle cx='6' cy='33' r='2'/%3E%3Ccircle cx='14' cy='29' r='1'/%3E%3Ccircle cx='9.5' cy='22.5' r='1.5'/%3E%3Ccircle cx='29.5' cy='17.5' r='4.5'/%3E%3Ccircle cx='22' cy='8' r='1'/%3E%3Ccircle cx='15.5' cy='12.5' r='2.5'/%3E%3Ccircle cx='27.5' cy='30.5' r='0.5'/%3E%3Ccircle cx='18.5' cy='35.5' r='2.5'/%3E%3Ccircle cx='32' cy='36' r='1'/%3E%3Ccircle cx='35' cy='25' r='1'/%3E%3Ccircle cx='23' cy='21' r='2'/%3E%3Ccircle cx='36.5' cy='1.5' r='0.5'/%3E%3Ccircle cx='30.5' cy='3.5' r='1.5'/%3E%3Ccircle cx='34.5' cy='6.5' r='1.5'/%3E%3C/svg%3E"),
linear-gradient(135deg, rgb(77, 32, 167),rgb(33, 16, 110));
background-size: cover;
color: white;
border-radius: 0.5rem;
padding: 2rem 1.5rem;
margin-bottom: 1rem;
.flo-logo{
grid-area: logo;
fill: white;
height: 1.5rem;
width: 1.5rem;
opacity: 0.8;
justify-self: flex-end;
}
h3,h4{
display: inline-block;
width: auto;
}
h3{
grid-area: balance;
font-weight: 400;
opacity: 0.8;
}
h4{
font-weight: 400;
}
p{
font-size: 0.8rem;
grid-area: address;
opacity: 0.8;
letter-spacing: 0.1em;
margin-top: 3rem;
}
.label{
grid-area: labl;
color: white;
opacity: 0.7;
}
}
.choice,.status{
padding: 0.5rem 0.8rem;
border-radius: 2rem;
display: inline-flex;
align-items: center;
margin-bottom: 0.5rem;
text-transform: capitalize;
}
.choice-container{
display: flex;
flex-wrap: wrap;
}
.choice{
border: solid 1px rgba(var(--text), 0.2);
&:last-of-type{
margin-bottom: 0;
}
}
.status{
font-size: 0.8rem;
&.closed{
background: rgba(var(--foreground), 1);
border: solid 1px rgba(var(--text), 0.2);
}
}
.address, .token, .hash, .contract, .block-height{
cursor: pointer;
color: var(--primary-color);
}
.address{
text-transform: none !important;
word-break: break-all;
}
.tabs{
position: sticky;
top: 0;
padding: 1rem 0 1rem 0;
background: rgba(var(--foreground), 1);
z-index: 2;
display: flex;
overflow-x: auto;
.tab{
cursor: pointer;
opacity: 0.6;
margin-right: 1.5rem;
-webkit-tap-highlight-color: transparent;
white-space: nowrap;
font-size: 1.1rem;
&:last-of-type{
margin-right: 0;
}
&.active{
opacity: 1;
}
}
.line{
position: absolute;
height: 0.12rem;
background: rgba(var(--text), 1);
width: 1px;
bottom: 0;
transition: transform 0.4s, width 0.4s;
}
}
.contract-choice{
display: grid;
gap: 0.5rem 1rem;
margin-bottom: 2rem;
&:last-of-type{
margin-bottom: 0;
}
}
@keyframes fade{
from{
opacity: 0;
transform: translateY(1rem);
}
to{
opacity: 1;
transform: none;
}
}
.transaction{
display: grid;
gap: 2rem 1rem;
padding: 2rem;
border-radius: 0.5rem;
grid-template-columns: min-content 1fr;
grid-template-rows: auto 1fr;
background: rgba(var(--text), 0.06);
grid-template-areas: '. .'
'info info';
.contract-info{
grid-area: info;
align-items: flex-start;
}
h4{
font-weight: 500;
}
& > .icon:first-of-type{
stroke-width: 4;
justify-self: center;
height: 3rem;
width: 3rem;
padding: 0.8rem;
border-radius: 1rem;
background: rgba(var(--foreground), 1);
}
}
#loader_page{
display: grid;
place-content: center;
height: 100vh;
width: 100vw;
text-align: center;
position: fixed;
z-index: 10;
background: rgba(var(--foreground), 1);
h4{
margin-top: 1.5rem;
font-weight: 500;
}
}
#loader{
justify-self: center;
height: 2.5rem;
width: 2.5rem;
transform-origin: center;
stroke-dashoffset: 200;
stroke-dasharray: 200;
animation: load 2s infinite linear;
stroke: var(--primary-color);
}
@keyframes load{
50%{
stroke-dashoffset: 0;
}
100%{
stroke-dashoffset: -200;
transform: rotate(360deg);
}
}
#all_blocks_page, #top_blocks_container, #token_balance_container{
display: grid;
gap: 1rem;
grid-template-columns: repeat(auto-fill, minmax(12rem, 1fr));
margin-top: 1rem;
.card{
margin: 0;
}
}
#token_balance_container{
margin-top: 1.5rem;
}
@media only screen and (min-width: 640px){
.margin, .page{
margin: 0 4vw;
}
.input{
width: 60% !important;
}
section{
header{
h1{
font-size: 2rem;
}
}
}
#main_search{
h1{
font-size: 6rem;
text-align: center;
}
}
#highlights{
gap: 2rem;
grid-template-columns: repeat(2, auto);
grid-template-areas: 'token total' ' wallet contract';
.highlight-item{
h1{
font-size: 2.5rem;
}
&:first-of-type{
grid-area: token;
}
&:nth-of-type(2){
grid-area: total;
}
&:nth-of-type(3){
grid-area: wallet;
}
&:last-of-type{
grid-area: contract;
}
}
}
#page_header{
padding: 1.5rem 0;
}
#transaction_page{
display: grid;
gap: 0 1.5rem;
grid-template-columns: 40% 60%;
grid-template-areas: 'header header'
'. .';
.head{
grid-area: header;
}
}
.contract-choice{
grid-template-columns: 2fr 1fr 1fr;
align-items: center;
}
}
@media only screen and (min-width: 1280px){
.margin, .page{
margin: 0 12vw;
}
.input{
width: 50% !important;
}
#highlights{
grid-template-columns: repeat(4, auto);
grid-template-areas: 'token total wallet contract';
.highlight-item{
&:first-of-type{
grid-area: token;
}
&:nth-of-type(2){
grid-area: total;
}
&:nth-of-type(3){
grid-area: wallet;
}
&:last-of-type{
grid-area: contract;
}
}
}
}
@media only screen and (min-width: 1920px){
body{
font-size: 24px;
}
.margin, .page{
margin: 0 16vw;
}
#search_page{
padding: 1.5rem 12vw;
}
.input{
width: 40% !important;
}
}
@media only screen and (min-width: 2048px){
body{
font-size: 24px;
}
.margin, .page{
margin: 0 26vw;
}
#search_page{
padding: 1.5rem 24vw;
}
#first_section{
min-height: auto;
}
.input{
width: 30% !important;
}
}
@media only screen and (max-width: 320px){
body{
font-size: 14px;
}
}
@media (hover:hover){
button{
transition: background-color 0.3s;
&:hover{
background: var(--primary-color);
color: rgba(var(--foreground), 1)
}
}
.hover{
cursor: pointer;
}
.tab{
transition: opacity 0.3s;
&:hover{
opacity: 1;
}
}
}

5833
index.html

File diff suppressed because one or more lines are too long

BIN
run-server Executable file

Binary file not shown.

6188
single.html Normal file

File diff suppressed because one or more lines are too long

194
style.css Normal file
View File

@ -0,0 +1,194 @@
* {
box-sizing: border-box;
}
body {
background: #eceef1;
font-family: 'Slabo 27px', serif;
color: #333a45;
}
.wrapper {
margin: 5em auto;
max-width: 1000px;
background-color: #fff;
box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.06);
}
.header {
padding: 30px 30px 0;
text-align: center;
}
.header__title {
margin: 0;
text-transform: uppercase;
font-size: 2.5em;
font-weight: 500;
line-height: 1.1;
}
.header__subtitle {
margin: 0;
font-size: 1.5em;
color: #949fb0;
font-family: 'Yesteryear', cursive;
font-weight: 500;
line-height: 1.1;
}
.cards {
padding: 15px;
display: flex;
flex-flow: row wrap;
}
.cardcard {
margin: 15px;
width: calc((100% / 4) - 30px);
transition: all 0.2s ease-in-out;
}
@media screen and (max-width: 991px) {
.card {
width: calc((100% / 2) - 30px);
}
}
@media screen and (max-width: 767px) {
.card {
width: 100%;
}
}
.card:hover .card__inner {
background-color: #1abc9c;
-webkit-transform: scale(1.05);
transform: scale(1.05);
}
.card__inner {
width: 100%;
padding: 30px;
position: relative;
cursor: pointer;
background-color: #949fb0;
color: #eceef1;
font-size: 1.5em;
text-transform: uppercase;
text-align: center;
transition: all 0.2s ease-in-out;
}
.card__inner:after {
transition: all 0.3s ease-in-out;
}
.card__inner .fa {
width: 100%;
margin-top: .25em;
}
.card__expander {
transition: all 0.2s ease-in-out;
width: 100%;
position: relative;
border-style: solid;
border-width: thin;
text-align: left;
overflow:auto;
display: flex;
flex-direction: column;
flex-wrap: nowrap;
justify-content: center;
padding: 30px 15px 30px;
/*color: #5c34a2;
background-color: rgba(92, 52, 162, .1);*/
}
.card__expander .fa {
font-size: 0.75em;
position: absolute;
top: 10px;
right: 10px;
cursor: pointer;
}
.card__expander .fa:hover {
opacity: 0.9;
}
.card.is-collapsed .card__inner:after {
content: "";
opacity: 0;
}
.card.is-collapsed .card__expander {
max-height: 0;
min-height: 0;
overflow: hidden;
margin-top: 0;
opacity: 0;
}
.card.is-expanded .card__inner {
background-color: #1abc9c;
}
.card.is-expanded .card__inner:after {
content: "";
opacity: 1;
display: block;
height: 0;
width: 0;
position: absolute;
bottom: -30px;
left: calc(50% - 15px);
border-left: 15px solid transparent;
border-right: 15px solid transparent;
border-bottom: 15px solid #333a45;
}
.card.is-expanded .card__inner .fa:before {
content: "\f115";
}
.card.is-expanded .card__expander {
max-height: 1000px;
min-height: 200px;
overflow: visible;
margin-top: 30px;
opacity: 1;
}
.card.is-expanded:hover .card__inner {
-webkit-transform: scale(1);
transform: scale(1);
}
.card.is-inactive .card__inner {
pointer-events: none;
opacity: 0.5;
}
.card.is-inactive:hover .card__inner {
background-color: #949fb0;
-webkit-transform: scale(1);
transform: scale(1);
}
@media screen and (min-width: 992px) {
.card:nth-of-type(4n+2) .card__expander {
margin-left: calc(-100%);
}
.card:nth-of-type(4n+3) .card__expander {
margin-left: calc(-200%);
}
.card:nth-of-type(4n+4) .card__expander {
margin-left: calc(-300%);
}
.card:nth-of-type(4n+5) {
clear: left;
}
.card__expander {
width: calc(400%);
}
}
@media screen and (min-width: 768px) and (max-width: 991px) {
.card:nth-of-type(2n+2) .card__expander {
margin-left: calc(-100% - 30px);
}
.card:nth-of-type(2n+3) {
clear: left;
}
.card__expander {
width: calc(200% + 30px);
}
}

185
style1.css Normal file
View File

@ -0,0 +1,185 @@
* {
box-sizing: border-box;
}
body {
background: #eceef1;
font-family: 'Slabo 27px', serif;
color: #333a45;
}
.wrapper {
margin: 5em auto;
max-width: 1000px;
background-color: #fff;
box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.06);
}
.header {
padding: 30px 30px 0;
text-align: center;
}
.header__title {
margin: 0;
text-transform: uppercase;
font-size: 2.5em;
font-weight: 500;
line-height: 1.1;
}
.header__subtitle {
margin: 0;
font-size: 1.5em;
color: #949fb0;
font-family: 'Yesteryear', cursive;
font-weight: 500;
line-height: 1.1;
}
.cards {
padding: 15px;
display: flex;
flex-flow: row wrap;
}
.card {
margin: 15px;
width: calc((100% / 3) - 30px);
transition: all 0.2s ease-in-out;
}
@media screen and (max-width: 991px) {
.card {
width: calc((100% / 2) - 30px);
}
}
@media screen and (max-width: 767px) {
.card {
width: 100%;
}
}
.card:hover .card__inner {
background-color: #1abc9c;
-webkit-transform: scale(1.05);
transform: scale(1.05);
}
.card__inner {
width: 100%;
padding: 30px;
position: relative;
cursor: pointer;
background-color: #949fb0;
color: #eceef1;
font-size: 1.5em;
text-transform: uppercase;
text-align: center;
transition: all 0.2s ease-in-out;
}
.card__inner:after {
transition: all 0.3s ease-in-out;
}
.card__inner .fa {
width: 100%;
margin-top: .25em;
}
.card__expander {
transition: all 0.2s ease-in-out;
background-color: #333a45;
width: 100%;
position: relative;
display: flex;
justify-content: center;
align-items: center;
text-transform: uppercase;
color: #eceef1;
font-size: 1.5em;
}
.card__expander .fa {
font-size: 0.75em;
position: absolute;
top: 10px;
right: 10px;
cursor: pointer;
}
.card__expander .fa:hover {
opacity: 0.9;
}
.card.is-collapsed .card__inner:after {
content: "";
opacity: 0;
}
.card.is-collapsed .card__expander {
max-height: 0;
min-height: 0;
overflow: hidden;
margin-top: 0;
opacity: 0;
}
.card.is-expanded .card__inner {
background-color: #1abc9c;
}
.card.is-expanded .card__inner:after {
content: "";
opacity: 1;
display: block;
height: 0;
width: 0;
position: absolute;
bottom: -30px;
left: calc(50% - 15px);
border-left: 15px solid transparent;
border-right: 15px solid transparent;
border-bottom: 15px solid #333a45;
}
.card.is-expanded .card__inner .fa:before {
content: "\f115";
}
.card.is-expanded .card__expander {
max-height: 1000px;
min-height: 200px;
overflow: visible;
margin-top: 30px;
opacity: 1;
}
.card.is-expanded:hover .card__inner {
-webkit-transform: scale(1);
transform: scale(1);
}
.card.is-inactive .card__inner {
pointer-events: none;
opacity: 0.5;
}
.card.is-inactive:hover .card__inner {
background-color: #949fb0;
-webkit-transform: scale(1);
transform: scale(1);
}
@media screen and (min-width: 992px) {
.card:nth-of-type(3n+2) .card__expander {
margin-left: calc(-100% - 30px);
}
.card:nth-of-type(3n+3) .card__expander {
margin-left: calc(-200% - 60px);
}
.card:nth-of-type(3n+4) {
clear: left;
}
.card__expander {
width: calc(300% + 60px);
}
}
@media screen and (min-width: 768px) and (max-width: 991px) {
.card:nth-of-type(2n+2) .card__expander {
margin-left: calc(-100% - 30px);
}
.card:nth-of-type(2n+3) {
clear: left;
}
.card__expander {
width: calc(200% + 30px);
}
}

2865
token.html Normal file

File diff suppressed because one or more lines are too long

3385
transaction.html Normal file

File diff suppressed because one or more lines are too long

2983
viewall_block.html Normal file

File diff suppressed because one or more lines are too long

3510
viewall_tx.html Normal file

File diff suppressed because one or more lines are too long