EpicCash/epic_explorer
4
0
Fork 0
Code Issues Pull Requests 1 Projects Releases Wiki Activity

UI chagnes

Browse Source
This commit is contained in:
Prema 2019-08-27 15:36:39 +05:30
parent 596c6c5f04
commit 4c25bb302b
11 changed files with 171 additions and 158 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/app/shared/components/footer/footer.component.html
View File

@ -1,4 +1,4 @@
<footer class="bg-white"> <footer class="bg-white bg-transparent">
<div class="footer"> <div class="footer">
<div class="container"> <div class="container">
<div class="footer_div py-4"> <div class="footer_div py-4">

180
src/app/view/home/graph-list/graph-list.component.html
View File

@ -412,14 +412,18 @@
<epic-explorer-plotly *ngIf="barGraphIntevalData.data" [data]="barGraphIntevalData.data" [layout]="barGraphIntevalData.layout"></epic-explorer-plotly> <epic-explorer-plotly *ngIf="barGraphIntevalData.data" [data]="barGraphIntevalData.data" [layout]="barGraphIntevalData.layout"></epic-explorer-plotly>
<div *ngIf="!barGraphIntevalData.data" class="feedback_div news_desc text-center"> <div *ngIf="!barGraphIntevalData.data" class="feedback_div news_desc text-center">
<div class="graph_img background_loading mx-auto mb-3"></div> <div class="graph_img background_loading mx-auto mb-3"></div>
<div class=" p-3 bg-white"> <div class=" bg-white">
<p class="mb-2 background_loading para_load"></p> <div class="sk-cube-grid">
<p class="mb-2 background_loading para_load"></p> <div class="sk-cube sk-cube1"></div>
<p class="mb-2 background_loading para_load"></p> <div class="sk-cube sk-cube2"></div>
<p class="mb-2 background_loading para_load"></p> <div class="sk-cube sk-cube3"></div>
<p class="mb-2 background_loading para_load"></p> <div class="sk-cube sk-cube4"></div>
<p class="mb-2 background_loading para_load"></p> <div class="sk-cube sk-cube5"></div>
<p class="mb-2 background_loading para_load"></p> <div class="sk-cube sk-cube6"></div>
<div class="sk-cube sk-cube7"></div>
<div class="sk-cube sk-cube8"></div>
<div class="sk-cube sk-cube9"></div>
</div>
</div> </div>
</div> </div>
</div> </div>
@ -441,7 +445,87 @@
</div> </div>
</div> </div>
</div> </div>
<div *ngIf="viewchartvar" class="col-md-6 col-lg-8 mb-4">
<div class="box_shadow">
<div class="blocks">
<h2 class="chart_heading d-inline-block">{{'home.TOTAL_DIFFICULTY' | translate}}</h2>
<!-- <span class="txn_count" *ngIf="this.lg_last.length > 0"><span *ngFor="let l of lg_last">{{
this.l | number</span>
}}</span> -->
<div class="chart_show">
<!-- <div class="difficulty_filter day_filter p-0 bg-transparent mt-2">
<a href="JavaScript:void(0);" (click)="
Difficultyreq('total', '', '', TdifficultyRange,'all'); selectedTarget12 = 4
" id="4" #itemtarget124
[ngClass]="{ active: selectedTarget12 == itemtarget124.id, txt_primay: true }">All</a>
<a href="JavaScript:void(0);" (click)="
Difficultyreq('total', '', '', TdifficultyRange,'cuckatoo'); selectedTarget12 = 1
" id="1" #itemtarget121
[ngClass]="{ active: selectedTarget12 == itemtarget121.id, txt_primay: true }">Cuckoo</a>
<a href="JavaScript:void(0);" (click)="
Difficultyreq('total', '', '', TdifficultyRange,'progpow'); selectedTarget12 = 2
" id="2" #itemtarget122
[ngClass]="{ active: selectedTarget12 == itemtarget122.id, txt_primay: true }">ProgPow</a>
<a href="JavaScript:void(0);" (click)="
Difficultyreq('total', '', '', TdifficultyRange,'randomx'); selectedTarget12 = 3
" id="3" #itemtarget123
[ngClass]="{ active: selectedTarget12 == itemtarget123.id, txt_primay: true }">RandomX</a>
</div> -->
<epic-explorer-plotly *ngIf="linearTotalGraphData.data" [data]="linearTotalGraphData.data"
[layout]="linearTotalGraphData.layout">
</epic-explorer-plotly>
<div *ngIf="!linearTotalGraphData.data" class="feedback_div news_desc text-center">
<div class="graph_img background_loading mx-auto mb-3"></div>
<div class=" bg-white">
<div class="sk-cube-grid">
<div class="sk-cube sk-cube1"></div>
<div class="sk-cube sk-cube2"></div>
<div class="sk-cube sk-cube3"></div>
<div class="sk-cube sk-cube4"></div>
<div class="sk-cube sk-cube5"></div>
<div class="sk-cube sk-cube6"></div>
<div class="sk-cube sk-cube7"></div>
<div class="sk-cube sk-cube8"></div>
<div class="sk-cube sk-cube9"></div>
</div>
</div>
</div>
</div>
</div>
<div class="day_filter">
<a href="JavaScript:void(0);" (click)="
Difficultyreq('total', '', '', '1 day',''); selectedTarget = 6; TdifficultyRange = '1 day'
" id="6" #itemtarget6 [ngClass]="{ active: selectedTarget == itemtarget6.id, txt_primay: true }">1 day</a>
<a href="JavaScript:void(0);" (click)="
Difficultyreq('total', '', '', '1 week',''); selectedTarget = 1; TdifficultyRange = '1 week'
" id="1" #itemtarget1 [ngClass]="{ active: selectedTarget == itemtarget1.id, txt_primay: true }">1
{{'home.WEEK' | translate}}</a>
<!-- <a href="JavaScript:void(0);" (click)="
Difficultyreq('total', '', '', '15 days',''); selectedTarget = 2; TdifficultyRange = '15 days'
" id="2" #itemtarget2 [ngClass]="{ active: selectedTarget == itemtarget2.id, day15_txt: true }">15
{{'home.DAYS' | translate}}</a> -->
<a href="JavaScript:void(0);" (click)="
Difficultyreq('total', '', '', '30 days',''); selectedTarget = 3; TdifficultyRange = '30 days'
" id="3" #itemtarget3 [ngClass]="{ active: selectedTarget == itemtarget3.id, day30_txt: true }">30
{{'home.DAYS' | translate}}</a>
<a href="JavaScript:void(0);" (click)="
Difficultyreq('total', '', '', '60 days',''); selectedTarget = 4; TdifficultyRange = '60 days'
" id="4" #itemtarget4 [ngClass]="{ active: selectedTarget == itemtarget4.id, day60_txt: true }">60
{{'home.DAYS' | translate}}</a>
<a href="JavaScript:void(0);" (click)="
Difficultyreq('total', '', '', '3 months',''); selectedTarget = 5; TdifficultyRange = '3 months'
" id="5" #itemtarget5 [ngClass]="{ active: selectedTarget == itemtarget5.id, day3m_txt: true }">3
{{'home.MONTHS' | translate}}</a>
</div>
<div class="explore_all text-right">
<a routerLink="/chart/total-difficulty"><span class="text-uppercase">{{'home.EXPLORE_IT' | translate}} <i
class="fa fa-long-arrow-right"></i></span></a>
</div>
</div>
</div>
<div *ngIf="viewchartvar" [ngClass]="{'col-md-6 col-lg-4 mb-4' : true, 'd-none' : viewchart}"> <div *ngIf="viewchartvar" [ngClass]="{'col-md-6 col-lg-4 mb-4' : true, 'd-none' : viewchart}">
<div class="box_shadow"> <div class="box_shadow">
<div class="blocks"> <div class="blocks">
@ -590,85 +674,5 @@
</div> </div>
</div> </div>
</div> --> </div> -->
<div *ngIf="viewchartvar" class="col-md-6 col-lg-8 mb-4">
<div class="box_shadow">
<div class="blocks">
<h2 class="chart_heading d-inline-block">{{'home.TOTAL_DIFFICULTY' | translate}}</h2>
<!-- <span class="txn_count" *ngIf="this.lg_last.length > 0"><span *ngFor="let l of lg_last">{{
this.l | number</span>
}}</span> -->
<div class="chart_show">
<!-- <div class="difficulty_filter day_filter p-0 bg-transparent mt-2">
<a href="JavaScript:void(0);" (click)="
Difficultyreq('total', '', '', TdifficultyRange,'all'); selectedTarget12 = 4
" id="4" #itemtarget124
[ngClass]="{ active: selectedTarget12 == itemtarget124.id, txt_primay: true }">All</a>
<a href="JavaScript:void(0);" (click)="
Difficultyreq('total', '', '', TdifficultyRange,'cuckatoo'); selectedTarget12 = 1
" id="1" #itemtarget121
[ngClass]="{ active: selectedTarget12 == itemtarget121.id, txt_primay: true }">Cuckoo</a>
<a href="JavaScript:void(0);" (click)="
Difficultyreq('total', '', '', TdifficultyRange,'progpow'); selectedTarget12 = 2
" id="2" #itemtarget122
[ngClass]="{ active: selectedTarget12 == itemtarget122.id, txt_primay: true }">ProgPow</a>
<a href="JavaScript:void(0);" (click)="
Difficultyreq('total', '', '', TdifficultyRange,'randomx'); selectedTarget12 = 3
" id="3" #itemtarget123
[ngClass]="{ active: selectedTarget12 == itemtarget123.id, txt_primay: true }">RandomX</a>
</div> -->
<epic-explorer-plotly *ngIf="linearTotalGraphData.data" [data]="linearTotalGraphData.data"
[layout]="linearTotalGraphData.layout">
</epic-explorer-plotly>
<div *ngIf="!linearTotalGraphData.data" class="feedback_div news_desc text-center">
<div class="graph_img background_loading mx-auto mb-3"></div>
<div class=" bg-white">
<div class="sk-cube-grid">
<div class="sk-cube sk-cube1"></div>
<div class="sk-cube sk-cube2"></div>
<div class="sk-cube sk-cube3"></div>
<div class="sk-cube sk-cube4"></div>
<div class="sk-cube sk-cube5"></div>
<div class="sk-cube sk-cube6"></div>
<div class="sk-cube sk-cube7"></div>
<div class="sk-cube sk-cube8"></div>
<div class="sk-cube sk-cube9"></div>
</div>
</div>
</div>
</div>
</div>
<div class="day_filter">
<a href="JavaScript:void(0);" (click)="
Difficultyreq('total', '', '', '1 day',''); selectedTarget = 6; TdifficultyRange = '1 day'
" id="6" #itemtarget6 [ngClass]="{ active: selectedTarget == itemtarget6.id, txt_primay: true }">1 day</a>
<a href="JavaScript:void(0);" (click)="
Difficultyreq('total', '', '', '1 week',''); selectedTarget = 1; TdifficultyRange = '1 week'
" id="1" #itemtarget1 [ngClass]="{ active: selectedTarget == itemtarget1.id, txt_primay: true }">1
{{'home.WEEK' | translate}}</a>
<!-- <a href="JavaScript:void(0);" (click)="
Difficultyreq('total', '', '', '15 days',''); selectedTarget = 2; TdifficultyRange = '15 days'
" id="2" #itemtarget2 [ngClass]="{ active: selectedTarget == itemtarget2.id, day15_txt: true }">15
{{'home.DAYS' | translate}}</a> -->
<a href="JavaScript:void(0);" (click)="
Difficultyreq('total', '', '', '30 days',''); selectedTarget = 3; TdifficultyRange = '30 days'
" id="3" #itemtarget3 [ngClass]="{ active: selectedTarget == itemtarget3.id, day30_txt: true }">30
{{'home.DAYS' | translate}}</a>
<a href="JavaScript:void(0);" (click)="
Difficultyreq('total', '', '', '60 days',''); selectedTarget = 4; TdifficultyRange = '60 days'
" id="4" #itemtarget4 [ngClass]="{ active: selectedTarget == itemtarget4.id, day60_txt: true }">60
{{'home.DAYS' | translate}}</a>
<a href="JavaScript:void(0);" (click)="
Difficultyreq('total', '', '', '3 months',''); selectedTarget = 5; TdifficultyRange = '3 months'
" id="5" #itemtarget5 [ngClass]="{ active: selectedTarget == itemtarget5.id, day3m_txt: true }">3
{{'home.MONTHS' | translate}}</a>
</div>
<div class="explore_all text-right">
<a routerLink="/chart/total-difficulty"><span class="text-uppercase">{{'home.EXPLORE_IT' | translate}} <i
class="fa fa-long-arrow-right"></i></span></a>
</div>
</div>
</div>
</div> </div>

143
src/assets/css/style.css
View File

@ -12,14 +12,15 @@
html, body{height: 100%;} html, body{height: 100%;}
body { body {
font-family: 'Bahnschrift'; font-family: 'Bahnschrift';
color: #111111; color: #686868;
letter-spacing: 0.5px; letter-spacing: 0.5px;
background: url(/assets/img/body_bg1.png);
} }
.search { .search {
max-width: 75%; max-width: 75%;
margin: 0 auto; margin: 0 auto;
} }
.text_underline{text-decoration: underline;} .text_underline{text-decoration: underline;color: #c89e61}
a:hover, a:hover,
a:focus { a:focus {
text-decoration: none; text-decoration: none;
@ -33,7 +34,7 @@ a:focus {
} }
} }
.loaders { .loaders {
color: #0091ff; color: #c89e61;
font-size: 90px; font-size: 90px;
text-indent: -9999em; text-indent: -9999em;
overflow: hidden; overflow: hidden;
@ -130,10 +131,10 @@ a:focus {
transform: rotate(360deg); transform: rotate(360deg);
} }
} }
.nav-item.dropdown.bg-white{background-color: #dadada !important;}
/************************************************texts*****************************************/ /************************************************texts*****************************************/
.txt_primary { .txt_primary {
color: #0091ff; color: #c89e61;
} }
.txt_secondary { .txt_secondary {
color: #333333; color: #333333;
@ -142,23 +143,23 @@ a:focus {
color: #555555; color: #555555;
} }
.day15_txt { .day15_txt {
color: #0079d4; color: #686868;
} }
.day30_txt { .day30_txt {
color: #015a9d; color: #686868;
} }
.day60_txt { .day60_txt {
color: #013862; color: #686868;
} }
.day3m_txt { .day3m_txt {
color: #001424; color: #686868;
} }
.btn:focus { .btn:focus {
box-shadow: none; box-shadow: none;
} }
/*******************************************Button**********************************************/ /*******************************************Button**********************************************/
.theme_switch { .theme_switch {
background: #fff; background: #dadada;
border: none; border: none;
margin-left: 14px; margin-left: 14px;
border-radius: 0px; border-radius: 0px;
@ -187,11 +188,12 @@ a:focus {
/* margin-right: 5px; */ /* margin-right: 5px; */
} }
.headerbg { .headerbg {
background: url(/assets/img/body_bg.jpg); background: url(/assets/img/body_bg.png);
overflow: hidden; overflow: hidden;
} }
.body_bg { .body_bg {
background: url(/assets/img/body_bg.jpg); background: url(/assets/img/body_bg.png);
background-position-y: -22%;
} }
.search_input { .search_input {
border-radius: 25px; border-radius: 25px;
@ -204,7 +206,7 @@ a:focus {
position: absolute; position: absolute;
top: 4px; top: 4px;
right: 10px; right: 10px;
color: #0091ff; color: #c89e61;
} }
.blocks { .blocks {
background: #fff; background: #fff;
@ -220,7 +222,7 @@ a:focus {
.chart_heading { .chart_heading {
font-size: 23px; font-size: 23px;
font-weight: 400; font-weight: 400;
color: #111111; color: #686868;
padding: 5px; padding: 5px;
vertical-align: middle; vertical-align: middle;
margin-bottom: 0px; margin-bottom: 0px;
@ -228,7 +230,7 @@ a:focus {
z-index: 1; z-index: 1;
} }
.txn_count { .txn_count {
background: #0091ff; background: #c89e61;
vertical-align: middle; vertical-align: middle;
border-radius: 25px; border-radius: 25px;
font-size: 13px; font-size: 13px;
@ -240,16 +242,16 @@ a:focus {
z-index: 1; z-index: 1;
float: right; float: right;
margin-top: 5px; margin-top: 5px;
border: 1px solid #0091ff; border: 1px solid #c89e61;
transition: all 0.3s linear; transition: all 0.3s linear;
} }
.blocks:hover .txn_count { .blocks:hover .txn_count {
background: #fff; background: #fff;
color: #0091ff; color: #c89e61;
transition: all 0.3s linear; transition: all 0.3s linear;
} }
.day_filter { .day_filter {
background-color: #f9f9f7; background-color: #dadada;
font-size: 14px; font-size: 14px;
padding: 15px; padding: 15px;
} }
@ -260,22 +262,23 @@ a:focus {
} }
.day_filter a.active { .day_filter a.active {
border: 1px solid rgba(0, 0, 0, 0.3); border: 1px solid rgba(0, 0, 0, 0.3);
background: #fff; background: #686868;
padding: 0 5px; padding: 0 5px;
color: #ffffff
} }
.difficulty_filter.day_filter a.active{border-color: #0056b3; color: #0056b3;} .difficulty_filter.day_filter a.active{border-color: #0056b3; color: #0056b3;}
.explore_all { .explore_all {
background: #ecf2ff; background: #ffffff;
padding: 15px; padding: 15px;
font-size: 13px; font-size: 13px;
color: #777777; color: #c89e61;
border-top: 1px solid #0091ff; border-top: 1px solid #c89e61;
} }
.explore_all a { .explore_all a {
color: #777777; color: #c89e61;
} }
.explore_all a:hover, .explore_all a:focus { .explore_all a:hover, .explore_all a:focus {
color: #0091ff; color: #777777;
} }
.ip_filter { .ip_filter {
padding: 12px 6px; padding: 12px 6px;
@ -286,10 +289,10 @@ a:focus {
font-size: 13px; font-size: 13px;
} }
.ip_filter a.active { .ip_filter a.active {
color: #0091ff; color: #c89e61;
} }
.btn_primary { .btn_primary {
background: #0091ff; background: #c89e61;
border-radius: 25px; border-radius: 25px;
color: #fff !important; color: #fff !important;
text-transform: uppercase; text-transform: uppercase;
@ -308,7 +311,7 @@ a:focus {
} }
.detail_div .count { .detail_div .count {
font-size: 25px; font-size: 25px;
color: #0091ff; color: #c89e61;
overflow: hidden; overflow: hidden;
white-space: nowrap; white-space: nowrap;
text-overflow: ellipsis; text-overflow: ellipsis;
@ -386,14 +389,14 @@ a:focus {
color: #000000; color: #000000;
} }
.ftr_dropdown { .ftr_dropdown {
background-color: #ecf2ff; background-color: #dadada;
padding: 5px; padding: 5px;
} }
.ftr_dropdown a { .ftr_dropdown a {
color: #777777; color: #686868;
} }
.footer_div .theme_switch { .footer_div .theme_switch {
background: #ecf2ff; background: #dadada;
} }
.privacy_txt { .privacy_txt {
font-size: 12px; font-size: 12px;
@ -455,8 +458,8 @@ a:focus {
-webkit-transform: rotate(359deg); -webkit-transform: rotate(359deg);
} }
} }
.link_to_detail{cursor: pointer;color: #0091ff;} .link_to_detail{cursor: pointer;color: #c89e61;}
.link_to_detail:hover{color: #0091ff;text-decoration: underline;} .link_to_detail:hover{color: #c89e61;text-decoration: underline;}
.mobile_table, .peer_mobile_table{border-bottom: 1px solid #dee2e6;position: relative;} .mobile_table, .peer_mobile_table{border-bottom: 1px solid #dee2e6;position: relative;}
.mobile_table .tble_col{padding: 0;} .mobile_table .tble_col{padding: 0;}
.mobile_table:nth-child(even), .peer_mobile_table:nth-child(even) { .mobile_table:nth-child(even), .peer_mobile_table:nth-child(even) {
@ -504,13 +507,13 @@ margin-right: 10px;
} }
.langbut{ .langbut{
border:none !important; border:none !important;
color:rgba(0,0,0,.5); color:#686868;
appearance: none; appearance: none;
-webkit-appearance: none; -webkit-appearance: none;
-moz-appearance: none; -moz-appearance: none;
background: #ffffff; background: #dadada;
} }
.langbut.ftr_lang{background: #ecf2ff;} .langbut.ftr_lang{background: #dadada;}
.arrow_drpdwn{ .arrow_drpdwn{
border: solid rgba(0,0,0,.5); border: solid rgba(0,0,0,.5);
border-width: 0 2px 2px 0; border-width: 0 2px 2px 0;
@ -522,7 +525,7 @@ margin-right: 10px;
margin-top: -4px; margin-top: -4px;
} }
.langbut:focus{outline: none;} .langbut:focus{outline: none;}
.detail_div .difficulty_datas{font-size: 14px !important; color: #0091ff; margin-bottom: 0px;} .detail_div .difficulty_datas{font-size: 14px !important; color: #c89e61; margin-bottom: 0px;}
.net_dropdwn{ .net_dropdwn{
position: absolute; position: absolute;
top: 20px; top: 20px;
@ -533,7 +536,8 @@ margin-right: 10px;
/**********************************************Dark Theme CSS********************************/ /**********************************************Dark Theme CSS********************************/
body.dark_theme { body.dark_theme {
background-color: #27314b; background: url(/assets/img/dark_bg.png);
background-color: #1d1d1f;
color: #fff; color: #fff;
} }
.dark_theme .light_theme_display { .dark_theme .light_theme_display {
@ -543,10 +547,11 @@ body.dark_theme {
display: block; display: block;
} }
.dark_theme .headerbg { .dark_theme .headerbg {
background: url(/assets/img/dark_bg.jpg); background: url(/assets/img/dark_bg1.png);
} }
.dark_theme .body_bg { .dark_theme .body_bg {
background: url(/assets/img/dark_bg.jpg); background: url(/assets/img/dark_bg1.png);
background-position-y: -22%;
} }
.dark_theme .logo_txt, .dark_theme .logo_txt,
.dark_theme .ip_filter a { .dark_theme .ip_filter a {
@ -554,47 +559,49 @@ body.dark_theme {
} }
.dark_theme .navbar-light .navbar-brand:focus, .dark_theme .navbar-light .navbar-brand:hover{color: #ffffff;} .dark_theme .navbar-light .navbar-brand:focus, .dark_theme .navbar-light .navbar-brand:hover{color: #ffffff;}
.dark_theme .search_input { .dark_theme .search_input {
background-color: #27314b; background-color: #252525;
} }
.dark_theme .box_shadow{border: 1px solid #4c4c4c}
.dark_theme .blocks, .dark_theme .blocks,
.dark_theme .explore_all { .dark_theme .explore_all {
background-color: #27314b; background-color: #1d1d1f;
} }
.dark_theme .day_filter, .dark_theme .day_filter,
.dark_theme .detail_div { .dark_theme .detail_div {
background-color: #384566; background-color: #252525;
border-color: #1c2437; border-color: #1d1d1f;
} }
.dark_theme .detail_div .count span { .dark_theme .detail_div .count span {
color: #ffffff; color: #a6a6a6;
} }
.dark_theme .detail_div .desc { .dark_theme .detail_div .desc {
color: #c0d2ff; color: #ffffff;
} }
.dark_theme .day_filter a, .dark_theme .day_filter a,
.dark_theme .table th { .dark_theme .table th {
color: #ffffff; color: #a6a6a6;
} }
.dark_theme .table td { .dark_theme .table td {
color: #c0d2ff; color: #c0d2ff;
} }
.dark_theme .day_filter a.active { .dark_theme .day_filter a.active {
background-color: #27314b; background-color: #1d1d1f;
/* border-color: #c89e61 */
} }
.dark_theme .chart_heading { .dark_theme .chart_heading {
color: #ffffff; color: #ffffff;
} }
.dark_theme .latest_table { .dark_theme .latest_table {
background-color: #1c2437; background-color: #1d1d1f;
border-color: #1c2437; border-color: #1d1d1f;
} }
.dark_theme .latest_blocks .explore_all { .dark_theme .latest_blocks .explore_all {
background-color: #384566; background-color: #252525;
border-color: #1c2437; border-color: #1c2437;
color: #c0d2ff; color: #a6a6a6;
} }
.dark_theme .latest_blocks .explore_all a { .dark_theme .latest_blocks .explore_all a {
color: #c0d2ff; color: #a6a6a6;
} }
.dark_theme .table td, .dark_theme .table td,
.dark_theme .table th, .dark_theme .table th,
@ -620,15 +627,16 @@ body.dark_theme {
.dark_theme .ftr_dropdown, .dark_theme .ftr_dropdown,
.dark_theme .langbut.ftr_lang, .dark_theme .langbut.ftr_lang,
.dark_theme .bg-white { .dark_theme .bg-white {
background-color: #1c2437 !important; background-color: #1d1d1f !important;
color: #ffffff !important; color: #ffffff !important;
} }
.dark_theme footer.bg-white, .dark_theme .theme_switch, .dark_theme .news_desc .bg-white{ background-color: #27314b !important;} .dark_theme .news_desc .bg-white{ background-color: #1d1d1f !important;}
.dark_theme .nav-item.dropdown .bg-white, .dark_theme .nav-item.dropdown, .dark_theme .langbut{background-color: #27314b !important} .dark_theme footer.bg-white{background-color: transparent !important}
.dark_theme .nav-item.dropdown .bg-white, .dark_theme .nav-item.dropdown, .dark_theme .langbut, .dark_theme .theme_switch{background-color: #252525 !important}
.dark_theme .langbut{color: #ffffff !important;} .dark_theme .langbut{color: #ffffff !important;}
.dark_theme .arrow_drpdwn{border-color: #ffffff !important;} .dark_theme .arrow_drpdwn{border-color: #ffffff !important;}
.dark_theme .mobile_table:nth-child(2n), .dark_theme .peer_mobile_table:nth-child(2n){background: #27314b;} .dark_theme .mobile_table:nth-child(2n), .dark_theme .peer_mobile_table:nth-child(2n){background: #252525;}
.dark_theme.langbut.ftr_lang{background: #27314b;color: #ffffff;} .dark_theme.langbut.ftr_lang{background: #1d1d1f;color: #ffffff;}
.dark_theme .dropdown a { .dark_theme .dropdown a {
color: #ffffff !important; color: #ffffff !important;
} }
@ -649,30 +657,31 @@ body.dark_theme {
stroke: #384566 !important; stroke: #384566 !important;
} }
.dark_theme .page-link { .dark_theme .page-link {
background-color: #1c2437; background-color: #1d1d1f;
border-color: #384566; border-color: #a6a6a6;
} }
.dark_theme .item_select select { .dark_theme .item_select select {
border-color: #1c2437; border-color: #1d1d1f;
background-color: #1c2437; background-color: #1d1d1f;
color: #c0d2ff; color: #a6a6a6;
} }
.dark_theme .footer_div{border-color: #a5a5a5}
.dark_theme .view_page_header {background: #1c2437;} .dark_theme .view_page_header {background: #1c2437;}
.dark_theme .view_content {background-color: #27314b;} .dark_theme .view_content {background-color: #1d1d1f;}
.js-plotly-plot .plotly .modebar, .js-plotly-plot .plotly .modebar,
.zerolinelayer { .zerolinelayer {
display: none; display: none;
} }
.dark_theme .bg{fill: transparent !important;} .dark_theme .bg{fill: transparent !important;}
.dark_theme .not_found{color: #ffffff;} .dark_theme .not_found{color: #ffffff;}
.dark_theme .card, .dark_theme .card-header{background-color: #27314b; border-color: #27314b;} .dark_theme .card, .dark_theme .card-header{background-color: #1d1d1f; border-color: #1d1d1f;}
.dark_theme .tab_hdng{color: #ffffff;} .dark_theme .tab_hdng{color: #ffffff;}
.dark_theme .view_content table{border-color: #384566;} .dark_theme .view_content table{border-color: #384566;}
.dark_theme .card-body{background-color: #1c2437;} .dark_theme .card-body{background-color: #1c2437;}
.diff_margin{margin-bottom: -10px !important; margin-top: -10px !important;} .diff_margin{margin-bottom: -10px !important; margin-top: -10px !important;}
.dark_theme .difficulty_datas .day60_txt{color: #fff;} .dark_theme .difficulty_datas .day60_txt{color: #a6a6a6;}
.dark_theme .legendtext{fill: rgb(255, 255, 255) !important;} .dark_theme .legendtext{fill: rgb(255, 255, 255) !important;}
.dark_theme .background_loading{background: #384566;background-image: linear-gradient( to right, #384566 0%, #27314b 20%, #384566 40%, #384566 100% );} .dark_theme .background_loading{background: #384566;background-image: linear-gradient( to right, #384566 0%, #1d1d1f 20%, #384566 40%, #384566 100% );}
.dark_theme .langbut option:disabled { background-color: #384566; color: rgba(255,255,255,.2);} .dark_theme .langbut option:disabled { background-color: #384566; color: rgba(255,255,255,.2);}
@keyframes yellowfade { @keyframes yellowfade {
from { from {
@ -698,7 +707,7 @@ body.dark_theme {
.sk-cube-grid .sk-cube { .sk-cube-grid .sk-cube {
width: 33%; width: 33%;
height: 33%; height: 33%;
background-color: #0091ff; background-color: #c89e61;
float: left; float: left;
-webkit-animation: sk-cubeGridScaleDelay 1.3s infinite ease-in-out; -webkit-animation: sk-cubeGridScaleDelay 1.3s infinite ease-in-out;
animation: sk-cubeGridScaleDelay 1.3s infinite ease-in-out; animation: sk-cubeGridScaleDelay 1.3s infinite ease-in-out;

BIN
src/assets/img/body_bg.jpg
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 8.4 KiB

BIN
src/assets/img/body_bg.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 707 KiB

BIN
src/assets/img/body_bg.webp
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 68 KiB

BIN
src/assets/img/body_bg1.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 157 KiB

BIN
src/assets/img/dark_bg.jpg
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 15 KiB

BIN
src/assets/img/dark_bg.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 218 KiB

BIN
src/assets/img/dark_bg.webp
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 245 KiB

BIN
src/assets/img/dark_bg1.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 683 KiB