RanchiMall/floscout
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

v1.1.7

Browse Source
This commit is contained in:
sairaj mote 2020-05-27 17:32:01 +05:30
parent 001a4f609e
commit 4ea944ea39
4 changed files with 1723 additions and 657 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

72
css/main.css
View File

@ -131,6 +131,10 @@ h3 {
text-transform: uppercase !important; text-transform: uppercase !important;
} }
.capitalise {
text-transform: capitalize !important;
}
.toggle { .toggle {
position: relative; position: relative;
cursor: pointer; cursor: pointer;
@ -251,6 +255,15 @@ ul .balance:last-of-type {
margin-bottom: 1.5rem; margin-bottom: 1.5rem;
} }
.transaction-container {
display: -ms-grid;
display: grid;
margin-top: 1.5rem;
gap: 1.5rem;
-ms-grid-columns: (minmax(20rem, 1fr))[auto-fit];
grid-template-columns: repeat(auto-fit, minmax(20rem, 1fr));
}
.label { .label {
text-transform: capitalize; text-transform: capitalize;
font-size: 0.8rem; font-size: 0.8rem;
@ -784,8 +797,12 @@ p {
} }
.tabs { .tabs {
position: relative; position: -webkit-sticky;
margin-top: 2rem; position: sticky;
top: 0;
padding: 1rem 0 1rem 0;
background: rgba(var(--foreground), 1);
z-index: 2;
display: -webkit-box; display: -webkit-box;
display: -ms-flexbox; display: -ms-flexbox;
display: flex; display: flex;
@ -795,10 +812,10 @@ p {
.tabs .tab { .tabs .tab {
cursor: pointer; cursor: pointer;
opacity: 0.6; opacity: 0.6;
padding-bottom: 0.5rem; margin-right: 1.5rem;
margin-right: 1rem;
-webkit-tap-highlight-color: transparent; -webkit-tap-highlight-color: transparent;
white-space: nowrap; white-space: nowrap;
font-size: 1.2rem;
} }
.tabs .tab:last-of-type { .tabs .tab:last-of-type {
@ -811,7 +828,7 @@ p {
.tabs .line { .tabs .line {
position: absolute; position: absolute;
height: 0.1em; height: 0.16rem;
background: rgba(var(--text), 1); background: rgba(var(--text), 1);
width: 1px; width: 1px;
bottom: 0; bottom: 0;
@ -822,6 +839,9 @@ p {
} }
.contract-choice { .contract-choice {
display: -ms-grid;
display: grid;
gap: 0.5rem 1rem;
margin-bottom: 2rem; margin-bottom: 2rem;
} }
@ -829,12 +849,6 @@ p {
margin-bottom: 0; margin-bottom: 0;
} }
.contract-choice h3 {
text-transform: capitalize;
font-weight: 400;
margin-bottom: 0.5rem;
}
#homepage { #homepage {
margin: 0 1.5rem; margin: 0 1.5rem;
} }
@ -865,12 +879,6 @@ p {
} }
} }
#top_transaction_container {
display: -ms-grid;
display: grid;
gap: 1.5em;
}
.transaction { .transaction {
display: -ms-grid; display: -ms-grid;
display: grid; display: grid;
@ -880,6 +888,8 @@ p {
-ms-grid-columns: min-content 1fr; -ms-grid-columns: min-content 1fr;
grid-template-columns: -webkit-min-content 1fr; grid-template-columns: -webkit-min-content 1fr;
grid-template-columns: min-content 1fr; grid-template-columns: min-content 1fr;
-ms-grid-rows: auto 1fr;
grid-template-rows: auto 1fr;
background: rgba(var(--text), 0.06); background: rgba(var(--text), 0.06);
grid-template-areas: '. .' 'info info'; grid-template-areas: '. .' 'info info';
} }
@ -889,6 +899,9 @@ p {
-ms-grid-column: 1; -ms-grid-column: 1;
-ms-grid-column-span: 2; -ms-grid-column-span: 2;
grid-area: info; grid-area: info;
-webkit-box-align: start;
-ms-flex-align: start;
align-items: flex-start;
} }
.transaction h4 { .transaction h4 {
@ -903,7 +916,7 @@ p {
width: 3rem; width: 3rem;
padding: 0.8rem; padding: 0.8rem;
border-radius: 1rem; border-radius: 1rem;
background: var(--background); background: rgba(var(--foreground), 1);
} }
#loader_page { #loader_page {
@ -1008,10 +1021,6 @@ p {
#page_header { #page_header {
padding: 1.5rem 0; padding: 1.5rem 0;
} }
#top_transaction_container {
-ms-grid-columns: (1fr)[2];
grid-template-columns: repeat(2, 1fr);
}
#transaction_page { #transaction_page {
display: -ms-grid; display: -ms-grid;
display: grid; display: grid;
@ -1026,6 +1035,13 @@ p {
-ms-grid-column-span: 2; -ms-grid-column-span: 2;
grid-area: header; grid-area: header;
} }
.contract-choice {
-ms-grid-columns: 2fr 1fr 1fr;
grid-template-columns: 2fr 1fr 1fr;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
} }
@media only screen and (min-width: 1280px) { @media only screen and (min-width: 1280px) {
@ -1063,10 +1079,6 @@ p {
-ms-grid-column: 4; -ms-grid-column: 4;
grid-area: contract; grid-area: contract;
} }
#top_transaction_container {
-ms-grid-columns: (1fr)[3];
grid-template-columns: repeat(3, 1fr);
}
} }
@media only screen and (min-width: 1920px) { @media only screen and (min-width: 1920px) {
@ -1082,10 +1094,6 @@ p {
.input { .input {
width: 40% !important; width: 40% !important;
} }
#top_transaction_container {
-ms-grid-columns: (1fr)[4];
grid-template-columns: repeat(4, 1fr);
}
} }
@media only screen and (min-width: 2048px) { @media only screen and (min-width: 2048px) {
@ -1104,10 +1112,6 @@ p {
.input { .input {
width: 30% !important; width: 30% !important;
} }
#top_transaction_container {
-ms-grid-columns: (1fr)[5];
grid-template-columns: repeat(5, 1fr);
}
} }
@media only screen and (max-width: 320px) { @media only screen and (max-width: 320px) {

2
css/main.css.map
View File

File diff suppressed because one or more lines are too long

58
css/main.scss
View File

@ -92,6 +92,9 @@ h3{
.uppercase{ .uppercase{
text-transform: uppercase !important; text-transform: uppercase !important;
} }
.capitalise{
text-transform: capitalize !important;
}
.toggle{ .toggle{
position: relative; position: relative;
cursor: pointer; cursor: pointer;
@ -171,7 +174,6 @@ ul{
.card{ .card{
padding: 2rem 1.5rem; padding: 2rem 1.5rem;
border-radius: 0.5rem; border-radius: 0.5rem;
//border: solid 1px rgba(var(--text), 0.16);
background: rgba(var(--text), 0.06); background: rgba(var(--text), 0.06);
margin: 1.5rem 0; margin: 1.5rem 0;
h4{ h4{
@ -183,6 +185,12 @@ ul{
margin-bottom: 1.5rem; 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{ .label{
text-transform: capitalize; text-transform: capitalize;
font-size: 0.8rem; font-size: 0.8rem;
@ -375,9 +383,6 @@ ul{
display: flex; display: flex;
flex-direction: column; flex-direction: column;
padding: 1.5rem; padding: 1.5rem;
//border-radius: 0.5rem;
//background: rgba(var(--text), 0.1);
//border: 1px solid rgba(var(--text), 0.2);
border-left: 0.1rem solid rgba(var(--text), 0.2); border-left: 0.1rem solid rgba(var(--text), 0.2);
.label{ .label{
margin-top: auto; margin-top: auto;
@ -529,17 +534,20 @@ p{
word-break: break-all; word-break: break-all;
} }
.tabs{ .tabs{
position: relative; position: sticky;
margin-top: 2rem; top: 0;
padding: 1rem 0 1rem 0;
background: rgba(var(--foreground), 1);
z-index: 2;
display: flex; display: flex;
overflow-x: auto; overflow-x: auto;
.tab{ .tab{
cursor: pointer; cursor: pointer;
opacity: 0.6; opacity: 0.6;
padding-bottom: 0.5rem; margin-right: 1.5rem;
margin-right: 1rem;
-webkit-tap-highlight-color: transparent; -webkit-tap-highlight-color: transparent;
white-space: nowrap; white-space: nowrap;
font-size: 1.2rem;
&:last-of-type{ &:last-of-type{
margin-right: 0; margin-right: 0;
} }
@ -549,7 +557,7 @@ p{
} }
.line{ .line{
position: absolute; position: absolute;
height: 0.1em; height: 0.16rem;
background: rgba(var(--text), 1); background: rgba(var(--text), 1);
width: 1px; width: 1px;
bottom: 0; bottom: 0;
@ -557,15 +565,12 @@ p{
} }
} }
.contract-choice{ .contract-choice{
display: grid;
gap: 0.5rem 1rem;
margin-bottom: 2rem; margin-bottom: 2rem;
&:last-of-type{ &:last-of-type{
margin-bottom: 0; margin-bottom: 0;
} }
h3{
text-transform: capitalize;
font-weight: 400;
margin-bottom: 0.5rem;
}
} }
#homepage{ #homepage{
margin: 0 1.5rem; margin: 0 1.5rem;
@ -580,21 +585,19 @@ p{
transform: none; transform: none;
} }
} }
#top_transaction_container{
display: grid;
gap: 1.5em;
}
.transaction{ .transaction{
display: grid; display: grid;
gap: 2rem 1rem; gap: 2rem 1rem;
padding: 2rem; padding: 2rem;
border-radius: 0.5rem; border-radius: 0.5rem;
grid-template-columns: min-content 1fr; grid-template-columns: min-content 1fr;
grid-template-rows: auto 1fr;
background: rgba(var(--text), 0.06); background: rgba(var(--text), 0.06);
grid-template-areas: '. .' grid-template-areas: '. .'
'info info'; 'info info';
.contract-info{ .contract-info{
grid-area: info; grid-area: info;
align-items: flex-start;
} }
h4{ h4{
font-weight: 500; font-weight: 500;
@ -606,7 +609,7 @@ p{
width: 3rem; width: 3rem;
padding: 0.8rem; padding: 0.8rem;
border-radius: 1rem; border-radius: 1rem;
background: var(--background); background: rgba(var(--foreground), 1);
} }
} }
#loader_page{ #loader_page{
@ -691,9 +694,6 @@ p{
#page_header{ #page_header{
padding: 1.5rem 0; padding: 1.5rem 0;
} }
#top_transaction_container{
grid-template-columns: repeat(2, 1fr);
}
#transaction_page{ #transaction_page{
display: grid; display: grid;
gap: 0 1.5rem; gap: 0 1.5rem;
@ -704,6 +704,10 @@ p{
grid-area: header; grid-area: header;
} }
} }
.contract-choice{
grid-template-columns: 2fr 1fr 1fr;
align-items: center;
}
} }
@media only screen and (min-width: 1280px){ @media only screen and (min-width: 1280px){
.margin, .page{ .margin, .page{
@ -733,9 +737,7 @@ p{
} }
} }
} }
#top_transaction_container{
grid-template-columns: repeat(3, 1fr);
}
} }
@media only screen and (min-width: 1920px){ @media only screen and (min-width: 1920px){
body{ body{
@ -750,9 +752,6 @@ p{
.input{ .input{
width: 40% !important; width: 40% !important;
} }
#top_transaction_container{
grid-template-columns: repeat(4, 1fr);
}
} }
@media only screen and (min-width: 2048px){ @media only screen and (min-width: 2048px){
body{ body{
@ -770,9 +769,6 @@ p{
.input{ .input{
width: 30% !important; width: 30% !important;
} }
#top_transaction_container{
grid-template-columns: repeat(5, 1fr);
}
} }
@media only screen and (max-width: 320px){ @media only screen and (max-width: 320px){
body{ body{

2236
index.html
View File

File diff suppressed because it is too large Load Diff