hourly blocks clock faces
This commit is contained in:
Mononaut
parent
be5882edb3
commit
3b459b6857
@ -4,6 +4,8 @@ import { AppPreloadingStrategy } from './app.preloading-strategy'
|
|||||||
import { StartComponent } from './components/start/start.component';
|
import { StartComponent } from './components/start/start.component';
|
||||||
import { TransactionComponent } from './components/transaction/transaction.component';
|
import { TransactionComponent } from './components/transaction/transaction.component';
|
||||||
import { BlockComponent } from './components/block/block.component';
|
import { BlockComponent } from './components/block/block.component';
|
||||||
|
import { ClockAComponent } from './components/clock/clock-a.component';
|
||||||
|
import { ClockBComponent } from './components/clock/clock-b.component';
|
||||||
import { AddressComponent } from './components/address/address.component';
|
import { AddressComponent } from './components/address/address.component';
|
||||||
import { MasterPageComponent } from './components/master-page/master-page.component';
|
import { MasterPageComponent } from './components/master-page/master-page.component';
|
||||||
import { AboutComponent } from './components/about/about.component';
|
import { AboutComponent } from './components/about/about.component';
|
||||||
@ -355,6 +357,14 @@ let routes: Routes = [
|
|||||||
},
|
},
|
||||||
],
|
],
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
path: 'clock-face-a',
|
||||||
|
component: ClockAComponent,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
path: 'clock-face-b',
|
||||||
|
component: ClockBComponent,
|
||||||
|
},
|
||||||
{
|
{
|
||||||
path: 'status',
|
path: 'status',
|
||||||
data: { networks: ['bitcoin', 'liquid'] },
|
data: { networks: ['bitcoin', 'liquid'] },
|
||||||
|
|||||||
@ -34,7 +34,7 @@ export default class BlockScene {
|
|||||||
this.width = width;
|
this.width = width;
|
||||||
this.height = height;
|
this.height = height;
|
||||||
this.gridSize = this.width / this.gridWidth;
|
this.gridSize = this.width / this.gridWidth;
|
||||||
this.unitPadding = width / 500;
|
this.unitPadding = this.gridSize / 5;
|
||||||
this.unitWidth = this.gridSize - (this.unitPadding * 2);
|
this.unitWidth = this.gridSize - (this.unitPadding * 2);
|
||||||
|
|
||||||
this.dirty = true;
|
this.dirty = true;
|
||||||
|
|||||||
@ -0,0 +1,93 @@
|
|||||||
|
<div class="clock-face">
|
||||||
|
<ng-content></ng-content>
|
||||||
|
<svg
|
||||||
|
class="cut-out"
|
||||||
|
width="384"
|
||||||
|
height="384"
|
||||||
|
viewBox="0 0 384 384"
|
||||||
|
>
|
||||||
|
<g>
|
||||||
|
<path
|
||||||
|
class="face"
|
||||||
|
d="M 0,0 V 384 H 384 V 0 Z m 192,14.5 9.28906,0.244141 9.26563,0.728515 9.21289,1.212891 9.13672,1.693359 9.03515,2.169922 8.91016,2.640625 8.75977,3.101563 8.58593,3.55664 8.38672,4 8.16797,4.433594 7.92383,4.855469 7.6582,5.263672 7.37109,5.65625 7.06641,6.035156 6.74024,6.398437 6.39648,6.740235 6.03516,7.066406 5.6582,7.371094 5.26367,7.658203 4.85547,7.923828 4.43359,8.16797 4,8.38672 3.55664,8.58593 3.10157,8.75977 2.64062,8.91016 2.16797,9.03515 1.69336,9.13672 1.21289,9.21289 0.73047,9.26563 0.24023,9.20117 0.002,-0.0898 V 192 l -0.002,-0.0879 -0.24023,9.37695 -0.73047,9.26563 -1.21289,9.21289 -1.69336,9.13672 -2.16797,9.03515 -2.64062,8.91016 -3.10157,8.75977 -3.55664,8.58593 -4,8.38672 -4.43359,8.16797 -4.85547,7.92383 -5.26367,7.6582 -5.6582,7.37109 -6.03516,7.06641 -6.39648,6.74024 -6.74024,6.39843 -7.06641,6.03516 -7.37109,5.65625 -7.6582,5.26367 -7.92383,4.85547 -8.16797,4.43359 -8.38672,4 -8.58593,3.55664 -8.75977,3.10157 -8.91016,2.64062 -9.03515,2.16992 -9.13672,1.69336 -9.21289,1.21289 -9.26563,0.72852 L 192,369.5 l -9.28906,-0.24414 -9.26367,-0.72852 -9.21485,-1.21289 -9.13672,-1.69336 -9.03515,-2.16992 -8.91016,-2.64062 -8.75977,-3.10157 -8.58593,-3.55664 -8.38672,-4 -8.16797,-4.43359 -7.921875,-4.85547 -7.658203,-5.26367 -7.373047,-5.65625 -7.066406,-6.03516 -6.740235,-6.39843 -6.396484,-6.74024 -6.035156,-7.06641 -5.658203,-7.37109 -5.263672,-7.6582 -4.855469,-7.92383 -4.433594,-8.16797 -4,-8.38672 -3.55664,-8.58593 -3.101563,-8.75977 -2.638672,-8.91016 -2.169922,-9.03515 -1.693359,-9.13672 -1.212891,-9.21289 -0.730468,-9.26563 L 14.501953,192 l 0.242188,-9.28906 0.730468,-9.26563 1.212891,-9.21289 1.693359,-9.13672 2.169922,-9.03515 2.638672,-8.91016 3.101563,-8.75977 3.55664,-8.58593 4,-8.38672 4.433594,-8.16797 4.855469,-7.923828 5.263672,-7.658203 5.658203,-7.371094 6.035156,-7.066406 6.396484,-6.740235 6.740235,-6.398437 7.066406,-6.035156 7.373047,-5.65625 7.658203,-5.263672 7.921875,-4.855469 8.16797,-4.433594 8.38672,-4 8.58593,-3.55664 8.75977,-3.101563 8.91016,-2.640625 9.03515,-2.169922 9.13672,-1.693359 9.21485,-1.212891 9.26367,-0.728515 z"
|
||||||
|
/>
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
|
|
||||||
|
<svg
|
||||||
|
class="demo-dial"
|
||||||
|
width="384"
|
||||||
|
height="384"
|
||||||
|
viewBox="0 0 384 384"
|
||||||
|
>
|
||||||
|
<g>
|
||||||
|
<polyline points="468.750,82.031 468.750,60.547 " id="polyline322-5" style="fill:none;stroke:#ffffff;stroke-width:4.84839;stroke-dasharray:none;stroke-opacity:1" transform="matrix(0.35815948,0.20465831,-0.46186107,0.80827368,136.26002,-98.731071)" />
|
||||||
|
<polyline points="468.750,82.031 468.750,60.547 " id="polyline322-5-1" style="fill:none;stroke:#ffffff;stroke-width:4.84839;stroke-dasharray:none;stroke-opacity:1" transform="matrix(-0.35815948,0.20465831,0.46186107,0.80827368,247.72985,-98.663793)" />
|
||||||
|
<polyline points="468.750,82.031 468.750,60.547 " id="polyline322-5-1-4" style="fill:none;stroke:#ffffff;stroke-width:4.84839;stroke-dasharray:none;stroke-opacity:1" transform="matrix(-0.35815948,0.20465831,0.46186107,0.80827368,406.16737,175.58496)" />
|
||||||
|
<polyline points="468.750,82.031 468.750,60.547 " id="polyline322-5-1-4-6" style="fill:none;stroke:#ffffff;stroke-width:4.84839;stroke-dasharray:none;stroke-opacity:1" transform="matrix(0.35815948,0.20465831,-0.46186107,0.80827368,-22.201062,175.64022)" />
|
||||||
|
<polyline points="898.438,468.750 897.849,446.262 896.084,423.835 893.147,401.532 889.048,379.413 883.796,357.539 877.407,335.969 869.898,314.764 861.289,293.980 851.604,273.676 840.870,253.906 829.116,234.725 816.374,216.186 802.680,198.339 788.070,181.233 772.585,164.915 756.267,149.430 739.161,134.820 721.314,121.126 702.775,108.384 683.594,96.630 663.824,85.896 643.520,76.211 622.736,67.602 601.531,60.093 579.961,53.704 558.087,48.452 535.968,44.353 513.665,41.416 491.238,39.651 468.750,39.062 446.262,39.651 423.835,41.416 401.532,44.353 379.413,48.452 357.539,53.704 335.969,60.093 314.764,67.602 293.980,76.211 273.676,85.896 253.906,96.630 234.725,108.384 216.186,121.126 198.339,134.820 181.233,149.430 164.915,164.915 149.430,181.233 134.820,198.339 121.126,216.186 108.384,234.725 96.630,253.906 85.896,273.676 76.211,293.980 67.602,314.764 60.093,335.969 53.704,357.539 48.452,379.413 44.353,401.532 41.416,423.835 39.651,446.262 39.062,468.750 39.651,491.238 41.416,513.665 44.353,535.968 48.452,558.087 53.704,579.961 60.093,601.531 67.602,622.736 76.211,643.520 85.896,663.824 96.630,683.594 108.384,702.775 121.126,721.314 134.820,739.161 149.430,756.267 164.915,772.585 181.233,788.070 198.339,802.680 216.186,816.374 234.725,829.116 253.906,840.870 273.676,851.604 293.980,861.289 314.764,869.898 335.969,877.407 357.539,883.796 379.413,889.048 401.532,893.147 423.835,896.084 446.262,897.849 468.750,898.438 491.238,897.849 513.665,896.084 535.968,893.147 558.087,889.048 579.961,883.796 601.531,877.407 622.736,869.898 643.520,861.289 663.824,851.604 683.594,840.870 702.775,829.116 721.314,816.374 739.161,802.680 756.267,788.070 772.585,772.585 788.070,756.267 802.680,739.161 816.374,721.314 829.116,702.775 840.870,683.594 851.604,663.824 861.289,643.520 869.898,622.736 877.407,601.531 883.796,579.961 889.048,558.087 893.147,535.968 896.084,513.665 897.849,491.238 898.437,468.320 " id="polyline22" style="fill:none;stroke:#fff3f3;stroke-width:4.85521;stroke-dasharray:none;stroke-opacity:1" transform="matrix(0.41193006,0,0,0.41192762,-1.0918732,-1.0910719)" />
|
||||||
|
<polyline points="509.173,84.150 511.419,62.783 " id="polyline27" style="fill:none;stroke:#ffffff;stroke-width:4.84839;stroke-dasharray:none;stroke-opacity:0.601266" transform="matrix(0.41250847,0,0,0.41250847,-1.3624032,-1.3633461)" />
|
||||||
|
<polyline points="549.153,90.482 553.620,69.467 " id="polyline32" style="fill:none;stroke:#ffffff;stroke-width:4.84839;stroke-dasharray:none;stroke-opacity:0.601266" transform="matrix(0.41250847,0,0,0.41250847,-1.3624032,-1.3633461)" />
|
||||||
|
<polyline points="588.253,100.959 594.892,80.526 " id="polyline37" style="fill:none;stroke:#ffffff;stroke-width:4.84839;stroke-dasharray:none;stroke-opacity:0.601266" transform="matrix(0.41250847,0,0,0.41250847,-1.3624032,-1.3633461)" />
|
||||||
|
<polyline points="626.043,115.465 634.781,95.838 " id="polyline42" style="fill:none;stroke:#ffffff;stroke-width:4.84839;stroke-dasharray:none;stroke-opacity:0.601266" transform="matrix(0.41250847,0,0,0.41250847,-1.3624032,-1.3633461)" />
|
||||||
|
<polyline points="696.058,155.888 708.686,138.507 " id="polyline52" style="fill:none;stroke:#ffffff;stroke-width:4.84839;stroke-dasharray:none;stroke-opacity:0.601266" transform="matrix(0.41250847,0,0,0.41250847,-1.3624032,-1.3633461)" />
|
||||||
|
<polyline points="727.515,181.362 741.891,165.396 " id="polyline57" style="fill:none;stroke:#ffffff;stroke-width:4.84839;stroke-dasharray:none;stroke-opacity:0.601266" transform="matrix(0.41250847,0,0,0.41250847,-1.3624032,-1.3633461)" />
|
||||||
|
<polyline points="756.138,209.985 772.104,195.609 " id="polyline62" style="fill:none;stroke:#ffffff;stroke-width:4.84839;stroke-dasharray:none;stroke-opacity:0.601266" transform="matrix(0.41250847,0,0,0.41250847,-1.3624032,-1.3633461)" />
|
||||||
|
<polyline points="781.612,241.442 798.993,228.814 " id="polyline67" style="fill:none;stroke:#ffffff;stroke-width:4.84839;stroke-dasharray:none;stroke-opacity:0.601266" transform="matrix(0.41250847,0,0,0.41250847,-1.3624032,-1.3633461)" />
|
||||||
|
<polyline points="822.035,311.457 841.662,302.719 " id="polyline77" style="fill:none;stroke:#ffffff;stroke-width:4.84839;stroke-dasharray:none;stroke-opacity:0.601266" transform="matrix(0.41250847,0,0,0.41250847,-1.3624032,-1.3633461)" />
|
||||||
|
<polyline points="836.541,349.247 856.974,342.608 " id="polyline82" style="fill:none;stroke:#ffffff;stroke-width:4.84839;stroke-dasharray:none;stroke-opacity:0.601266" transform="matrix(0.41250847,0,0,0.41250847,-1.3624032,-1.3633461)" />
|
||||||
|
<polyline points="847.018,388.347 868.033,383.880 " id="polyline87" style="fill:none;stroke:#ffffff;stroke-width:4.84839;stroke-dasharray:none;stroke-opacity:0.601266" transform="matrix(0.41250847,0,0,0.41250847,-1.3624032,-1.3633461)" />
|
||||||
|
<polyline points="853.350,428.327 874.717,426.081 " id="polyline92" style="fill:none;stroke:#ffffff;stroke-width:4.84839;stroke-dasharray:none;stroke-opacity:0.601266" transform="matrix(0.41250847,0,0,0.41250847,-1.3624032,-1.3633461)" />
|
||||||
|
<polyline points="855.469,468.750 876.953,468.750 " id="polyline97-5" style="fill:none;stroke:#fff3f3;stroke-width:4.84839;stroke-dasharray:none;stroke-opacity:1" transform="matrix(0.93092534,0,0,0.41250847,-456.01734,-1.3575155)" />
|
||||||
|
<polyline points="853.350,509.173 874.717,511.419 " id="polyline102" style="fill:none;stroke:#ffffff;stroke-width:4.84839;stroke-dasharray:none;stroke-opacity:0.601266" transform="matrix(0.41250847,0,0,0.41250847,-1.3624032,-1.3633461)" />
|
||||||
|
<polyline points="847.018,549.153 868.033,553.620 " id="polyline107" style="fill:none;stroke:#ffffff;stroke-width:4.84839;stroke-dasharray:none;stroke-opacity:0.601266" transform="matrix(0.41250847,0,0,0.41250847,-1.3624032,-1.3633461)" />
|
||||||
|
<polyline points="836.541,588.253 856.974,594.892 " id="polyline112" style="fill:none;stroke:#ffffff;stroke-width:4.84839;stroke-dasharray:none;stroke-opacity:0.601266" transform="matrix(0.41250847,0,0,0.41250847,-1.3624032,-1.3633461)" />
|
||||||
|
<polyline points="822.035,626.043 841.662,634.781 " id="polyline117" style="fill:none;stroke:#ffffff;stroke-width:4.84839;stroke-dasharray:none;stroke-opacity:0.601266" transform="matrix(0.41250847,0,0,0.41250847,-1.3624032,-1.3633461)" />
|
||||||
|
<polyline points="781.612,696.058 798.993,708.686 " id="polyline127" style="fill:none;stroke:#ffffff;stroke-width:4.84839;stroke-dasharray:none;stroke-opacity:0.601266" transform="matrix(0.41250847,0,0,0.41250847,-1.3624032,-1.3633461)" />
|
||||||
|
<polyline points="756.138,727.515 772.104,741.891 " id="polyline132" style="fill:none;stroke:#ffffff;stroke-width:4.84839;stroke-dasharray:none;stroke-opacity:0.601266" transform="matrix(0.41250847,0,0,0.41250847,-1.3624032,-1.3633461)" />
|
||||||
|
<polyline points="727.515,756.138 741.891,772.104 " id="polyline137" style="fill:none;stroke:#ffffff;stroke-width:4.84839;stroke-dasharray:none;stroke-opacity:0.601266" transform="matrix(0.41250847,0,0,0.41250847,-1.3624032,-1.3633461)" />
|
||||||
|
<polyline points="696.058,781.612 708.686,798.993 " id="polyline142" style="fill:none;stroke:#ffffff;stroke-width:4.84839;stroke-dasharray:none;stroke-opacity:0.601266" transform="matrix(0.41250847,0,0,0.41250847,-1.3624032,-1.3633461)" />
|
||||||
|
<polyline points="626.043,822.035 634.781,841.662 " id="polyline152" style="fill:none;stroke:#ffffff;stroke-width:4.84839;stroke-dasharray:none;stroke-opacity:0.601266" transform="matrix(0.41250847,0,0,0.41250847,-1.3624032,-1.3633461)" />
|
||||||
|
<polyline points="588.253,836.541 594.892,856.974 " id="polyline157" style="fill:none;stroke:#ffffff;stroke-width:4.84839;stroke-dasharray:none;stroke-opacity:0.601266" transform="matrix(0.41250847,0,0,0.41250847,-1.3624032,-1.3633461)" />
|
||||||
|
<polyline points="549.153,847.018 553.620,868.033 " id="polyline162" style="fill:none;stroke:#ffffff;stroke-width:4.84839;stroke-dasharray:none;stroke-opacity:0.601266" transform="matrix(0.41250847,0,0,0.41250847,-1.3624032,-1.3633461)" />
|
||||||
|
<polyline points="509.173,853.350 511.419,874.717 " id="polyline167" style="fill:none;stroke:#ffffff;stroke-width:4.84839;stroke-dasharray:none;stroke-opacity:0.601266" transform="matrix(0.41250847,0,0,0.41250847,-1.3624032,-1.3633461)" />
|
||||||
|
<polyline points="468.750,855.469 468.750,876.953 " id="polyline172-3" style="fill:none;stroke:#fff3f3;stroke-width:4.84839;stroke-dasharray:none;stroke-opacity:1" transform="matrix(0.41250847,0,0,0.93092534,-1.3981517,-455.96156)" />
|
||||||
|
<polyline points="428.327,853.350 426.081,874.717 " id="polyline177" style="fill:none;stroke:#ffffff;stroke-width:4.84839;stroke-dasharray:none;stroke-opacity:0.601266" transform="matrix(0.41250847,0,0,0.41250847,-1.3624032,-1.3633461)" />
|
||||||
|
<polyline points="388.347,847.018 383.880,868.033 " id="polyline182" style="fill:none;stroke:#ffffff;stroke-width:4.84839;stroke-dasharray:none;stroke-opacity:0.601266" transform="matrix(0.41250847,0,0,0.41250847,-1.3624032,-1.3633461)" />
|
||||||
|
<polyline points="349.247,836.541 342.608,856.974 " id="polyline187" style="fill:none;stroke:#ffffff;stroke-width:4.84839;stroke-dasharray:none;stroke-opacity:0.601266" transform="matrix(0.41250847,0,0,0.41250847,-1.3624032,-1.3633461)" />
|
||||||
|
<polyline points="311.457,822.035 302.719,841.662 " id="polyline192" style="fill:none;stroke:#ffffff;stroke-width:4.84839;stroke-dasharray:none;stroke-opacity:0.601266" transform="matrix(0.41250847,0,0,0.41250847,-1.3624032,-1.3633461)" />
|
||||||
|
<polyline points="241.442,781.612 228.814,798.993 " id="polyline202" style="fill:none;stroke:#ffffff;stroke-width:4.84839;stroke-dasharray:none;stroke-opacity:0.601266" transform="matrix(0.41250847,0,0,0.41250847,-1.3624032,-1.3633461)" />
|
||||||
|
<polyline points="209.985,756.138 195.609,772.104 " id="polyline207" style="fill:none;stroke:#ffffff;stroke-width:4.84839;stroke-dasharray:none;stroke-opacity:0.601266" transform="matrix(0.41250847,0,0,0.41250847,-1.3624032,-1.3633461)" />
|
||||||
|
<polyline points="181.362,727.515 165.396,741.891 " id="polyline212" style="fill:none;stroke:#ffffff;stroke-width:4.84839;stroke-dasharray:none;stroke-opacity:0.601266" transform="matrix(0.41250847,0,0,0.41250847,-1.3624032,-1.3633461)" />
|
||||||
|
<polyline points="155.888,696.058 138.507,708.686 " id="polyline217" style="fill:none;stroke:#ffffff;stroke-width:4.84839;stroke-dasharray:none;stroke-opacity:0.601266" transform="matrix(0.41250847,0,0,0.41250847,-1.3624032,-1.3633461)" />
|
||||||
|
<polyline points="115.465,626.043 95.838,634.781 " id="polyline227" style="fill:none;stroke:#ffffff;stroke-width:4.84839;stroke-dasharray:none;stroke-opacity:0.601266" transform="matrix(0.41250847,0,0,0.41250847,-1.3624032,-1.3633461)" />
|
||||||
|
<polyline points="100.959,588.253 80.526,594.892 " id="polyline232" style="fill:none;stroke:#ffffff;stroke-width:4.84839;stroke-dasharray:none;stroke-opacity:0.601266" transform="matrix(0.41250847,0,0,0.41250847,-1.3624032,-1.3633461)" />
|
||||||
|
<polyline points="90.482,549.153 69.467,553.620 " id="polyline237" style="fill:none;stroke:#ffffff;stroke-width:4.84839;stroke-dasharray:none;stroke-opacity:0.601266" transform="matrix(0.41250847,0,0,0.41250847,-1.3624032,-1.3633461)" />
|
||||||
|
<polyline points="84.150,509.173 62.783,511.419 " id="polyline242" style="fill:none;stroke:#ffffff;stroke-width:4.84839;stroke-dasharray:none;stroke-opacity:0.601266" transform="matrix(0.41250847,0,0,0.41250847,-1.3624032,-1.3633461)" />
|
||||||
|
<polyline points="82.031,468.750 60.547,468.750 " id="polyline247" style="fill:none;stroke:#fff3f3;stroke-width:4.84839;stroke-dasharray:none;stroke-opacity:1" transform="matrix(0.93092534,0,0,0.41250847,-32.750989,-1.3633461)" />
|
||||||
|
<polyline points="84.150,428.327 62.783,426.081 " id="polyline252" style="fill:none;stroke:#ffffff;stroke-width:4.84839;stroke-dasharray:none;stroke-opacity:0.601266" transform="matrix(0.41250847,0,0,0.41250847,-1.3624032,-1.3633461)" />
|
||||||
|
<polyline points="90.482,388.347 69.467,383.880 " id="polyline257" style="fill:none;stroke:#ffffff;stroke-width:4.84839;stroke-dasharray:none;stroke-opacity:0.601266" transform="matrix(0.41250847,0,0,0.41250847,-1.3624032,-1.3633461)" />
|
||||||
|
<polyline points="100.959,349.247 80.526,342.608 " id="polyline262" style="fill:none;stroke:#ffffff;stroke-width:4.84839;stroke-dasharray:none;stroke-opacity:0.601266" transform="matrix(0.41250847,0,0,0.41250847,-1.3624032,-1.3633461)" />
|
||||||
|
<polyline points="115.465,311.457 95.838,302.719 " id="polyline267" style="fill:none;stroke:#ffffff;stroke-width:4.84839;stroke-dasharray:none;stroke-opacity:0.601266" transform="matrix(0.41250847,0,0,0.41250847,-1.3624032,-1.3633461)" />
|
||||||
|
<polyline points="155.888,241.442 138.507,228.814 " id="polyline277" style="fill:none;stroke:#ffffff;stroke-width:4.84839;stroke-dasharray:none;stroke-opacity:0.601266" transform="matrix(0.41250847,0,0,0.41250847,-1.3624032,-1.3633461)" />
|
||||||
|
<polyline points="181.362,209.985 165.396,195.609 " id="polyline282" style="fill:none;stroke:#ffffff;stroke-width:4.84839;stroke-dasharray:none;stroke-opacity:0.601266" transform="matrix(0.41250847,0,0,0.41250847,-1.3624032,-1.3633461)" />
|
||||||
|
<polyline points="209.985,181.362 195.609,165.396 " id="polyline287" style="fill:none;stroke:#ffffff;stroke-width:4.84839;stroke-dasharray:none;stroke-opacity:0.601266" transform="matrix(0.41250847,0,0,0.41250847,-1.3624032,-1.3633461)" />
|
||||||
|
<polyline points="241.442,155.888 228.814,138.507 " id="polyline292" style="fill:none;stroke:#ffffff;stroke-width:4.84839;stroke-dasharray:none;stroke-opacity:0.601266" transform="matrix(0.41250847,0,0,0.41250847,-1.3624032,-1.3633461)" />
|
||||||
|
<polyline points="311.457,115.465 302.719,95.838 " id="polyline302" style="fill:none;stroke:#ffffff;stroke-width:4.84839;stroke-dasharray:none;stroke-opacity:0.601266" transform="matrix(0.41250847,0,0,0.41250847,-1.3624032,-1.3633461)" />
|
||||||
|
<polyline points="349.247,100.959 342.608,80.526 " id="polyline307" style="fill:none;stroke:#ffffff;stroke-width:4.84839;stroke-dasharray:none;stroke-opacity:0.601266" transform="matrix(0.41250847,0,0,0.41250847,-1.3624032,-1.3633461)" />
|
||||||
|
<polyline points="388.347,90.482 383.880,69.467 " id="polyline312" style="fill:none;stroke:#ffffff;stroke-width:4.84839;stroke-dasharray:none;stroke-opacity:0.601266" transform="matrix(0.41250847,0,0,0.41250847,-1.3624032,-1.3633461)" />
|
||||||
|
<polyline points="428.327,84.150 426.081,62.783 " id="polyline317" style="fill:none;stroke:#ffffff;stroke-width:4.84839;stroke-dasharray:none;stroke-opacity:0.601266" transform="matrix(0.41250847,0,0,0.41250847,-1.3624032,-1.3633461)" />
|
||||||
|
<polyline points="468.750,82.031 468.750,60.547 " id="polyline322" style="fill:none;stroke:#fff3f3;stroke-width:4.84839;stroke-dasharray:none;stroke-opacity:1" transform="matrix(0.41250847,0,0,0.93092534,-1.3624032,-32.751932)" />
|
||||||
|
<polyline points="468.750,82.031 468.750,60.547 " id="polyline322-1" style="fill:none;stroke:#ffffff;stroke-width:4.84839;stroke-dasharray:none;stroke-opacity:1" transform="matrix(0.20473747,0.35811424,-0.80817157,0.46203972,290.78528,-88.000115)" />
|
||||||
|
<polyline points="468.750,82.031 468.750,60.547 " id="polyline322-1-1" style="fill:none;stroke:#ffffff;stroke-width:4.84839;stroke-dasharray:none;stroke-opacity:1" transform="matrix(0.20473747,-0.35811424,-0.80817157,-0.46203972,290.78131,472.03418)" />
|
||||||
|
<polyline points="468.750,82.031 468.750,60.547 " id="polyline322-1-1-3" style="fill:none;stroke:#ffffff;stroke-width:4.84839;stroke-dasharray:none;stroke-opacity:1" transform="matrix(-0.20473747,-0.35811424,0.80817157,-0.46203972,93.210129,472.02435)" />
|
||||||
|
<polyline points="468.750,82.031 468.750,60.547 " id="polyline322-1-1-3-0" style="fill:none;stroke:#ffffff;stroke-width:4.84839;stroke-dasharray:none;stroke-opacity:1" transform="matrix(-0.20473747,0.35811424,0.80817157,0.46203972,93.214111,-88.033531)" />
|
||||||
|
<path style="fill:none;fill-opacity:1;stroke:#9857ff;stroke-width:10.0718;stroke-dasharray:none;stroke-opacity:1" id="path13861" d="M 191.89712,19.035919 A 172.96411,172.96411 0 0 1 361.68171,158.46343 172.96411,172.96411 0 0 1 257.70512,351.99819 172.96411,172.96411 0 0 1 47.721163,287.39497" />
|
||||||
|
<path style="fill:none;fill-opacity:1;stroke:#1bd8f4;stroke-width:6;stroke-dasharray:none;stroke-opacity:1" d="M 291.55389,351.36143 280.94217,334.40881" id="path21241-7-9-8" />
|
||||||
|
<path style="fill:none;fill-opacity:1;stroke:#1bd8f4;stroke-width:6;stroke-dasharray:none;stroke-opacity:1" d="M 278.69152,358.70667 269.4674,340.96081" id="path21241-7-9-8-91" />
|
||||||
|
<path style="fill:none;fill-opacity:1;stroke:#1bd8f4;stroke-width:6;stroke-dasharray:none;stroke-opacity:1" d="M 92.519024,351.41399 103.10783,334.44705" id="path21241-7-9-8-91-5" />
|
||||||
|
<path style="fill:none;fill-opacity:1;stroke:#1bd8f4;stroke-width:6;stroke-dasharray:none;stroke-opacity:1" d="m 276.14552,23.997555 -8.8746,17.923218" id="path21241-7-9-8-9" />
|
||||||
|
<path style="fill:none;fill-opacity:1;stroke:#1bd8f4;stroke-width:6;stroke-dasharray:none;stroke-opacity:1" d="m 375.71332,152.74785 -19.576,4.09644" id="path21241-7-9-8-94" />
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
|
</div>
|
||||||
@ -0,0 +1,23 @@
|
|||||||
|
.clock-face {
|
||||||
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
top: 0;
|
||||||
|
bottom: 0;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
|
||||||
|
.cut-out, .demo-dial {
|
||||||
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
top: 0;
|
||||||
|
bottom: 0;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
|
||||||
|
.face {
|
||||||
|
fill: #11131f;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
@ -0,0 +1,15 @@
|
|||||||
|
import { Component, OnInit } from '@angular/core';
|
||||||
|
|
||||||
|
@Component({
|
||||||
|
selector: 'app-clock-face',
|
||||||
|
templateUrl: './clock-face.component.html',
|
||||||
|
styleUrls: ['./clock-face.component.scss'],
|
||||||
|
})
|
||||||
|
export class ClockFaceComponent implements OnInit {
|
||||||
|
|
||||||
|
constructor() {}
|
||||||
|
|
||||||
|
ngOnInit(): void {
|
||||||
|
// initialize stuff
|
||||||
|
}
|
||||||
|
}
|
||||||
19
frontend/src/app/components/clock/clock-a.component.html
Normal file
19
frontend/src/app/components/clock/clock-a.component.html
Normal file
@ -0,0 +1,19 @@
|
|||||||
|
<div class="clock-wrapper">
|
||||||
|
<app-clock-face>
|
||||||
|
<div class="block-wrapper">
|
||||||
|
<ng-container *ngIf="block && block.height >= 0">
|
||||||
|
<div class="block-cube">
|
||||||
|
<div class="side top"></div>
|
||||||
|
<div class="side bottom"></div>
|
||||||
|
<div class="side right" [style]="blockStyle"></div>
|
||||||
|
<div class="side left" [style]="blockStyle"></div>
|
||||||
|
<div class="side front" [style]="blockStyle"></div>
|
||||||
|
<div class="side back" [style]="blockStyle"></div>
|
||||||
|
</div>
|
||||||
|
<div class="title-wrapper">
|
||||||
|
<h1 class="block-height">{{ block.height }}</h1>
|
||||||
|
</div>
|
||||||
|
</ng-container>
|
||||||
|
</div>
|
||||||
|
</app-clock-face>
|
||||||
|
</div>
|
||||||
57
frontend/src/app/components/clock/clock-a.component.ts
Normal file
57
frontend/src/app/components/clock/clock-a.component.ts
Normal file
@ -0,0 +1,57 @@
|
|||||||
|
import { ChangeDetectionStrategy, ChangeDetectorRef, Component, OnInit } from '@angular/core';
|
||||||
|
import { Subscription } from 'rxjs';
|
||||||
|
import { StateService } from '../../services/state.service';
|
||||||
|
import { BlockExtended } from '../../interfaces/node-api.interface';
|
||||||
|
import { WebsocketService } from '../../services/websocket.service';
|
||||||
|
|
||||||
|
@Component({
|
||||||
|
selector: 'app-clock-a',
|
||||||
|
templateUrl: './clock-a.component.html',
|
||||||
|
styleUrls: ['./clock.component.scss'],
|
||||||
|
changeDetection: ChangeDetectionStrategy.OnPush,
|
||||||
|
})
|
||||||
|
export class ClockAComponent implements OnInit {
|
||||||
|
blocksSubscription: Subscription;
|
||||||
|
block: BlockExtended;
|
||||||
|
blockStyle;
|
||||||
|
|
||||||
|
gradientColors = {
|
||||||
|
'': ['#9339f4', '#105fb0'],
|
||||||
|
bisq: ['#9339f4', '#105fb0'],
|
||||||
|
liquid: ['#116761', '#183550'],
|
||||||
|
'liquidtestnet': ['#494a4a', '#272e46'],
|
||||||
|
testnet: ['#1d486f', '#183550'],
|
||||||
|
signet: ['#6f1d5d', '#471850'],
|
||||||
|
};
|
||||||
|
|
||||||
|
constructor(
|
||||||
|
public stateService: StateService,
|
||||||
|
private websocketService: WebsocketService,
|
||||||
|
private cd: ChangeDetectorRef,
|
||||||
|
) {}
|
||||||
|
|
||||||
|
ngOnInit(): void {
|
||||||
|
this.websocketService.want(['blocks']);
|
||||||
|
this.blocksSubscription = this.stateService.blocks$
|
||||||
|
.subscribe(([block]) => {
|
||||||
|
if (block) {
|
||||||
|
this.block = block;
|
||||||
|
this.blockStyle = this.getStyleForBlock(this.block);
|
||||||
|
this.cd.markForCheck();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
getStyleForBlock(block: BlockExtended) {
|
||||||
|
const greenBackgroundHeight = 100 - (block.weight / this.stateService.env.BLOCK_WEIGHT_UNITS) * 100;
|
||||||
|
|
||||||
|
return {
|
||||||
|
background: `repeating-linear-gradient(
|
||||||
|
#2d3348,
|
||||||
|
#2d3348 ${greenBackgroundHeight}%,
|
||||||
|
${this.gradientColors[''][0]} ${Math.max(greenBackgroundHeight, 0)}%,
|
||||||
|
${this.gradientColors[''][1]} 100%
|
||||||
|
)`,
|
||||||
|
};
|
||||||
|
}
|
||||||
|
}
|
||||||
15
frontend/src/app/components/clock/clock-b.component.html
Normal file
15
frontend/src/app/components/clock/clock-b.component.html
Normal file
@ -0,0 +1,15 @@
|
|||||||
|
<div class="clock-wrapper">
|
||||||
|
<app-clock-face>
|
||||||
|
<div class="block-wrapper">
|
||||||
|
<ng-container *ngIf="block && block.height >= 0">
|
||||||
|
<div class="block-sizer" [style]="blockSizerStyle">
|
||||||
|
<app-mempool-block-overview [index]="0"></app-mempool-block-overview>
|
||||||
|
</div>
|
||||||
|
<div class="fader"></div>
|
||||||
|
<div class="title-wrapper">
|
||||||
|
<h1 class="block-height">{{ block.height }}</h1>
|
||||||
|
</div>
|
||||||
|
</ng-container>
|
||||||
|
</div>
|
||||||
|
</app-clock-face>
|
||||||
|
</div>
|
||||||
58
frontend/src/app/components/clock/clock-b.component.ts
Normal file
58
frontend/src/app/components/clock/clock-b.component.ts
Normal file
@ -0,0 +1,58 @@
|
|||||||
|
import { ChangeDetectionStrategy, ChangeDetectorRef, Component, HostListener, OnInit } from '@angular/core';
|
||||||
|
import { Subscription } from 'rxjs';
|
||||||
|
import { StateService } from '../../services/state.service';
|
||||||
|
import { BlockExtended } from '../../interfaces/node-api.interface';
|
||||||
|
import { WebsocketService } from '../../services/websocket.service';
|
||||||
|
|
||||||
|
@Component({
|
||||||
|
selector: 'app-clock-b',
|
||||||
|
templateUrl: './clock-b.component.html',
|
||||||
|
styleUrls: ['./clock.component.scss'],
|
||||||
|
changeDetection: ChangeDetectionStrategy.OnPush,
|
||||||
|
})
|
||||||
|
export class ClockBComponent implements OnInit {
|
||||||
|
blocksSubscription: Subscription;
|
||||||
|
block: BlockExtended;
|
||||||
|
blockSizerStyle;
|
||||||
|
|
||||||
|
gradientColors = {
|
||||||
|
'': ['#9339f4', '#105fb0'],
|
||||||
|
bisq: ['#9339f4', '#105fb0'],
|
||||||
|
liquid: ['#116761', '#183550'],
|
||||||
|
'liquidtestnet': ['#494a4a', '#272e46'],
|
||||||
|
testnet: ['#1d486f', '#183550'],
|
||||||
|
signet: ['#6f1d5d', '#471850'],
|
||||||
|
};
|
||||||
|
|
||||||
|
constructor(
|
||||||
|
public stateService: StateService,
|
||||||
|
private websocketService: WebsocketService,
|
||||||
|
private cd: ChangeDetectorRef,
|
||||||
|
) {}
|
||||||
|
|
||||||
|
ngOnInit(): void {
|
||||||
|
this.resizeCanvas();
|
||||||
|
this.websocketService.want(['blocks']);
|
||||||
|
this.blocksSubscription = this.stateService.blocks$
|
||||||
|
.subscribe(([block]) => {
|
||||||
|
if (block) {
|
||||||
|
this.block = block;
|
||||||
|
this.cd.markForCheck();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
@HostListener('window:resize', ['$event'])
|
||||||
|
resizeCanvas(): void {
|
||||||
|
const screenSize = Math.min(window.innerWidth, window.innerHeight);
|
||||||
|
const baseSize = 0.92 * screenSize;
|
||||||
|
const size = Math.ceil(baseSize / 75) * 75;
|
||||||
|
const margin = screenSize - size;
|
||||||
|
this.blockSizerStyle = {
|
||||||
|
transform: `translate(${margin}px, ${margin}px)`,
|
||||||
|
width: `${size}px`,
|
||||||
|
height: `${size}px`,
|
||||||
|
};
|
||||||
|
this.cd.markForCheck();
|
||||||
|
}
|
||||||
|
}
|
||||||
119
frontend/src/app/components/clock/clock.component.scss
Normal file
119
frontend/src/app/components/clock/clock.component.scss
Normal file
@ -0,0 +1,119 @@
|
|||||||
|
.clock-wrapper {
|
||||||
|
--clock-width: min(100vw, 100vh);
|
||||||
|
position: relative;
|
||||||
|
width: 100vw;
|
||||||
|
max-width: var(--clock-width);
|
||||||
|
height: 100vh;
|
||||||
|
max-height: var(--clock-width);
|
||||||
|
margin: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.title-wrapper {
|
||||||
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
top: 0;
|
||||||
|
bottom: 0;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: row;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
|
||||||
|
.block-height {
|
||||||
|
font-size: calc(0.2 * var(--clock-width));
|
||||||
|
padding: 0;
|
||||||
|
margin: 0;
|
||||||
|
background: radial-gradient(rgba(0,0,0,0.5), transparent 67%);
|
||||||
|
padding: calc(0.05 * var(--clock-width)) calc(0.15 * var(--clock-width));
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.block-wrapper {
|
||||||
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
top: 0;
|
||||||
|
bottom: 0;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
|
||||||
|
.block-sizer {
|
||||||
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
|
top: 0;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.fader {
|
||||||
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
top: 0;
|
||||||
|
bottom: 0;
|
||||||
|
background: radial-gradient(transparent 0%, transparent 55%, #11131f 65%, #11131f 100%);
|
||||||
|
}
|
||||||
|
|
||||||
|
.block-cube {
|
||||||
|
--side-width: calc(0.4 * var(--clock-width));
|
||||||
|
--half-side: calc(0.2 * var(--clock-width));
|
||||||
|
--neg-half-side: calc(-0.2 * var(--clock-width));
|
||||||
|
transform-style: preserve-3d;
|
||||||
|
animation: block-spin 60s infinite linear;
|
||||||
|
position: absolute;
|
||||||
|
z-index: -1;
|
||||||
|
top: 50%;
|
||||||
|
left: 50%;
|
||||||
|
transform: translate(-50%, -50%);
|
||||||
|
width: var(--side-width);
|
||||||
|
height: var(--side-width);
|
||||||
|
|
||||||
|
.side {
|
||||||
|
width: var(--side-width);
|
||||||
|
height: var(--side-width);
|
||||||
|
line-height: 100px;
|
||||||
|
text-align: center;
|
||||||
|
background: #232838;
|
||||||
|
display: block;
|
||||||
|
position: absolute;
|
||||||
|
}
|
||||||
|
|
||||||
|
.side.top {
|
||||||
|
transform: rotateX(90deg);
|
||||||
|
margin-top: var(--neg-half-side);
|
||||||
|
}
|
||||||
|
|
||||||
|
.side.bottom {
|
||||||
|
background: #105fb0;
|
||||||
|
transform: rotateX(-90deg);
|
||||||
|
margin-top: var(--half-side);
|
||||||
|
}
|
||||||
|
|
||||||
|
.side.right {
|
||||||
|
transform: rotateY(90deg);
|
||||||
|
margin-left: var(--half-side);
|
||||||
|
}
|
||||||
|
|
||||||
|
.side.left {
|
||||||
|
transform: rotateY(-90deg);
|
||||||
|
margin-left: var(--neg-half-side);
|
||||||
|
}
|
||||||
|
|
||||||
|
.side.front {
|
||||||
|
transform: translateZ(var(--half-side));
|
||||||
|
}
|
||||||
|
|
||||||
|
.side.back {
|
||||||
|
transform: translateZ(var(--neg-half-side));
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
@keyframes block-spin {
|
||||||
|
0% {transform: translate(-50%, -50%) rotateX(-20deg) rotateY(0deg);}
|
||||||
|
100% {transform: translate(-50%, -50%) rotateX(-20deg) rotateY(-360deg);}
|
||||||
|
}
|
||||||
@ -14,7 +14,7 @@ import { LbtcPegsGraphComponent } from '../components/lbtc-pegs-graph/lbtc-pegs-
|
|||||||
import { GraphsComponent } from '../components/graphs/graphs.component';
|
import { GraphsComponent } from '../components/graphs/graphs.component';
|
||||||
import { StatisticsComponent } from '../components/statistics/statistics.component';
|
import { StatisticsComponent } from '../components/statistics/statistics.component';
|
||||||
import { MempoolBlockComponent } from '../components/mempool-block/mempool-block.component';
|
import { MempoolBlockComponent } from '../components/mempool-block/mempool-block.component';
|
||||||
import { MempoolBlockOverviewComponent } from '../components/mempool-block-overview/mempool-block-overview.component';
|
// import { MempoolBlockOverviewComponent } from '../components/mempool-block-overview/mempool-block-overview.component';
|
||||||
import { PoolRankingComponent } from '../components/pool-ranking/pool-ranking.component';
|
import { PoolRankingComponent } from '../components/pool-ranking/pool-ranking.component';
|
||||||
import { PoolComponent } from '../components/pool/pool.component';
|
import { PoolComponent } from '../components/pool/pool.component';
|
||||||
import { TelevisionComponent } from '../components/television/television.component';
|
import { TelevisionComponent } from '../components/television/television.component';
|
||||||
@ -42,7 +42,7 @@ import { CommonModule } from '@angular/common';
|
|||||||
BlockFeeRatesGraphComponent,
|
BlockFeeRatesGraphComponent,
|
||||||
BlockSizesWeightsGraphComponent,
|
BlockSizesWeightsGraphComponent,
|
||||||
FeeDistributionGraphComponent,
|
FeeDistributionGraphComponent,
|
||||||
MempoolBlockOverviewComponent,
|
// MempoolBlockOverviewComponent,
|
||||||
IncomingTransactionsGraphComponent,
|
IncomingTransactionsGraphComponent,
|
||||||
MempoolGraphComponent,
|
MempoolGraphComponent,
|
||||||
LbtcPegsGraphComponent,
|
LbtcPegsGraphComponent,
|
||||||
|
|||||||
@ -90,6 +90,11 @@ import { GeolocationComponent } from '../shared/components/geolocation/geolocati
|
|||||||
import { TestnetAlertComponent } from './components/testnet-alert/testnet-alert.component';
|
import { TestnetAlertComponent } from './components/testnet-alert/testnet-alert.component';
|
||||||
import { GlobalFooterComponent } from './components/global-footer/global-footer.component';
|
import { GlobalFooterComponent } from './components/global-footer/global-footer.component';
|
||||||
|
|
||||||
|
import { MempoolBlockOverviewComponent } from '../components/mempool-block-overview/mempool-block-overview.component';
|
||||||
|
import { ClockFaceComponent } from '../components/clock-face/clock-face.component';
|
||||||
|
import { ClockAComponent } from '../components/clock/clock-a.component';
|
||||||
|
import { ClockBComponent } from '../components/clock/clock-b.component';
|
||||||
|
|
||||||
@NgModule({
|
@NgModule({
|
||||||
declarations: [
|
declarations: [
|
||||||
ClipboardComponent,
|
ClipboardComponent,
|
||||||
@ -172,6 +177,11 @@ import { GlobalFooterComponent } from './components/global-footer/global-footer.
|
|||||||
GeolocationComponent,
|
GeolocationComponent,
|
||||||
TestnetAlertComponent,
|
TestnetAlertComponent,
|
||||||
GlobalFooterComponent,
|
GlobalFooterComponent,
|
||||||
|
|
||||||
|
MempoolBlockOverviewComponent,
|
||||||
|
ClockAComponent,
|
||||||
|
ClockBComponent,
|
||||||
|
ClockFaceComponent,
|
||||||
],
|
],
|
||||||
imports: [
|
imports: [
|
||||||
CommonModule,
|
CommonModule,
|
||||||
@ -279,6 +289,11 @@ import { GlobalFooterComponent } from './components/global-footer/global-footer.
|
|||||||
GeolocationComponent,
|
GeolocationComponent,
|
||||||
PreviewTitleComponent,
|
PreviewTitleComponent,
|
||||||
GlobalFooterComponent,
|
GlobalFooterComponent,
|
||||||
|
|
||||||
|
MempoolBlockOverviewComponent,
|
||||||
|
ClockAComponent,
|
||||||
|
ClockBComponent,
|
||||||
|
ClockFaceComponent,
|
||||||
]
|
]
|
||||||
})
|
})
|
||||||
export class SharedModule {
|
export class SharedModule {
|
||||||
|
|||||||
@ -32,7 +32,7 @@
|
|||||||
<meta name="msapplication-config" content="/resources/favicons/browserconfig.xml">
|
<meta name="msapplication-config" content="/resources/favicons/browserconfig.xml">
|
||||||
<meta name="theme-color" content="#1d1f31">
|
<meta name="theme-color" content="#1d1f31">
|
||||||
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user