font updated and progess in home page
This commit is contained in:
		
							
								
								
									
										102
									
								
								templates/shortcodes/grid_stats.html
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										102
									
								
								templates/shortcodes/grid_stats.html
									
									
									
									
									
										Normal file
									
								
							@@ -0,0 +1,102 @@
 | 
			
		||||
{% set styles = "background-image: url('images/grid_map.png');" %}
 | 
			
		||||
{% set data = load_data(url="https://explorer.threefold.io/api/stats", required=false, format="json") %}
 | 
			
		||||
{% set capacity = data.hru + data.sru / 1000 %}
 | 
			
		||||
{% set nodes = data.onlinenodes %}
 | 
			
		||||
{% set countries = data.countries %}
 | 
			
		||||
{% set cores = data.cru %}
 | 
			
		||||
 | 
			
		||||
<section class="px-2 h-auto bg-center bg-cover bg-no-repeat" style="{{styles}}">
 | 
			
		||||
    <div class="flex flex-wrap lg:p-12 text-center -mx-auto">
 | 
			
		||||
        <div class="text-center rounded lg:px-6 mt-10 lg:mt-0 mx-auto">
 | 
			
		||||
            {{body | markdown | safe }}
 | 
			
		||||
 | 
			
		||||
            <div class="my-10 grid lg:grid-cols-3 lg:gap-8">
 | 
			
		||||
                <div class="..."></div>
 | 
			
		||||
 | 
			
		||||
                <!-- capacity -->
 | 
			
		||||
                <div class="leading-none font-extrabold text-5xl">
 | 
			
		||||
                    {{ capacity / 1000000 | round(precision=2) }}PB
 | 
			
		||||
                    <span class="block text-3xl uppercase">capacity</span>
 | 
			
		||||
                </div>
 | 
			
		||||
                <div class="..."></div>
 | 
			
		||||
 | 
			
		||||
                <!-- Nodes -->
 | 
			
		||||
                <div class="
 | 
			
		||||
                mx-auto
 | 
			
		||||
                rounded-full
 | 
			
		||||
                h-32
 | 
			
		||||
                w-32
 | 
			
		||||
                lg:h-60 lg:w-60
 | 
			
		||||
                inline-flex
 | 
			
		||||
                items-center
 | 
			
		||||
                justify-center
 | 
			
		||||
                bg-green
 | 
			
		||||
                my-4
 | 
			
		||||
              ">
 | 
			
		||||
                    <div class="leading-none font-extrabold md:text-6xl">
 | 
			
		||||
                        {{ nodes }}
 | 
			
		||||
                        <span class="block md:text-2xl uppercase">nodes</span>
 | 
			
		||||
                    </div>
 | 
			
		||||
                </div>
 | 
			
		||||
                <div class="hidden md:block"></div>
 | 
			
		||||
 | 
			
		||||
                <!-- countries -->
 | 
			
		||||
                <div class="
 | 
			
		||||
                mx-auto
 | 
			
		||||
                rounded-full
 | 
			
		||||
                h-32
 | 
			
		||||
                w-32
 | 
			
		||||
                lg:h-60 lg:w-60
 | 
			
		||||
                inline-flex
 | 
			
		||||
                items-center
 | 
			
		||||
                justify-center
 | 
			
		||||
                bg-pink
 | 
			
		||||
              ">
 | 
			
		||||
                    <div class="leading-none font-extrabold md:text-6xl">
 | 
			
		||||
                        {{ countries }}
 | 
			
		||||
                        <span class="block md:text-2xl uppercase">countries</span>
 | 
			
		||||
                    </div>
 | 
			
		||||
                </div>
 | 
			
		||||
            </div>
 | 
			
		||||
            <div class="..."></div>
 | 
			
		||||
 | 
			
		||||
            <!-- cores -->
 | 
			
		||||
            <div class="leading-none font-extrabold text-5xl">
 | 
			
		||||
                {{ cores | num_format }}
 | 
			
		||||
                <span class="block text-2xl uppercase">cores</span>
 | 
			
		||||
            </div>
 | 
			
		||||
        </div>
 | 
			
		||||
    </div>
 | 
			
		||||
    <div class="my-4 mx-auto text-center">
 | 
			
		||||
        <a href="/" target="_blank" class="
 | 
			
		||||
            inline-block
 | 
			
		||||
            bg-white
 | 
			
		||||
            lg:text-lg
 | 
			
		||||
            learn-button
 | 
			
		||||
            hover:bg-gray-400
 | 
			
		||||
            px-12
 | 
			
		||||
            py-1
 | 
			
		||||
            mr-5
 | 
			
		||||
            border-2
 | 
			
		||||
            shadow
 | 
			
		||||
            border-black
 | 
			
		||||
          ">button</a>
 | 
			
		||||
    </div>
 | 
			
		||||
</section>
 | 
			
		||||
 | 
			
		||||
<style>
 | 
			
		||||
    dd {
 | 
			
		||||
        display: inline-block;
 | 
			
		||||
        margin: auto;
 | 
			
		||||
        border-radius: 50%;
 | 
			
		||||
        line-height: 100px;
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    .bg-green {
 | 
			
		||||
        background-color: #70dfc9;
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    .bg-pink {
 | 
			
		||||
        background-color: #ea1ff7;
 | 
			
		||||
    }
 | 
			
		||||
</style>
 | 
			
		||||
		Reference in New Issue
	
	Block a user