SHARE
TWEET

Meteo 2

mattshaw Apr 25th, 2019 53 Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. <style>
  2.   div#ws-grid{
  3.         display: grid;
  4.     grid-template-columns: 33% 33% auto;
  5.     grid-template-rows: 10% 20% 20% 10% 20% 20%;     
  6.    
  7.   }
  8.  
  9.   div.ws-temperature-title{
  10.     background-color: blue;
  11.  
  12.     grid-area: header;
  13.     grid-column-start: 1;
  14.     grid-column-end: 4;
  15.     grid-row-start: 1;
  16.     grid-row-end: 2;
  17.     -webkit-border-radius: 50px;
  18.         -moz-border-radius: 50px;
  19.   }
  20.   div.ws-temperature-current{
  21.     grid-column-start: 1;  
  22.     grid-column-end: 2;
  23.     grid-row-start: 2;
  24.     grid-row-end: 2;
  25.   }
  26.     div.ws-temperature-min{
  27.     grid-column-start: 2;  
  28.     grid-column-end: 3;
  29.     grid-row-start: 2;
  30.     grid-row-end: 2;
  31.   }
  32.     div.ws-temperature-max{
  33.     grid-column-start: 3;  
  34.     grid-column-end: 4;
  35.     grid-row-start: 3;
  36.     grid-row-end: 2;
  37.   }
  38.     div.ws-temperature-current-value{
  39.     grid-column-start: 1;  
  40.     grid-column-end: 1;
  41.     grid-row-start: 3;
  42.     grid-row-end: 3;
  43.   }
  44.     div.ws-temperature-min-value{
  45.     grid-column-start: 2;  
  46.     grid-column-end: 2;
  47.     grid-row-start: 3;
  48.     grid-row-end: 3;
  49.   }
  50.     div.ws-temperature-max-value{
  51.     grid-column-start: 3;  
  52.     grid-column-end: 3;
  53.     grid-row-start: 3;
  54.     grid-row-end: 3;
  55.   }
  56.     div.ws-other-title{
  57.     grid-column-start: 1;  
  58.     grid-column-end: 3;
  59.     grid-row-start: 4;
  60.     grid-row-end: 4;
  61.   }
  62.  
  63.  
  64. </style>
  65.  
  66.  
  67. <div id="ws-grid">
  68.   <div class="ws-temperature-title">NetAtmo</div>
  69.   <div class="ws-temperature-current">Corrente</div>
  70.   <div class="ws-temperature-min">Minima</div>
  71.   <div class="ws-temperature-max">Massima</div>
  72.   <div class="ws-temperature-current-value">{{itemValue(config.current_temperature)}}</div>
  73.   <div class="ws-temperature-min-value">{{itemValue(config.min_temperature)}}</div>
  74.   <div class="ws-temperature-max-value">{{itemValue(config.max_temperature)}}</div>
  75.   <div class="ws-other-title">Altri dati</div>
  76. </div>
RAW Paste Data
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy. OK, I Understand
 
Top