templates/infoneu.html.twig line 1

Open in your IDE?
  1. <!doctype html>
  2. <html class="no-js" lang="en">
  3.     <head>
  4.         <meta charset="utf-8" />
  5.         <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  6.         <title>INFO NEU MASELLA</title>
  7.         <link href="https://fonts.googleapis.com/css?family=Poppins" rel="stylesheet">
  8.         <link href="https://fonts.googleapis.com/css?family=Paytone+One&display=swap" rel="stylesheet">
  9.         <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">
  10.         <link href="../stylesheet.css" rel="stylesheet" charset="utf-8" />
  11.         <style>
  12.             /* fonts */
  13.             body{font-family: 'Poppins', sans-serif;}
  14.             .sector{float:left; width: 44%; padding: 2%; vertical-align: top; margin-left: 5px;}
  15.             p{font-family: 'Poppins', sans-serif; margin: 0;}
  16.             .color_001{color:#090;}
  17.             .color_002{color:#39F;}
  18.             .color_003{color:#F00;}
  19.             .color_004{color:#000;}
  20.             /* METEO*/
  21.             table {
  22.                 background: #fff;
  23.                 border: none;
  24.                 margin-bottom: 5px;
  25.                 table-layout: auto; 
  26.                 font-family: 'Poppins', sans-serif;
  27.             }
  29.             .time th{text-align: center; background:#bebebe; color:#fff; }
  30.             .cota-neu th{text-align: center;}
  31.             .sector.masonry-brick{ margin-bottom:0px; margin-left: 5px; overflow: hidden; padding-bottom: 16px;}
  32.             .gradient{    background: #CCB36E;
  33.                           background: -webkit-linear-gradient(#CCB36E, #fff);
  34.                           background: -o-linear-gradient(#CCB36E, #fff);
  35.                           background: -moz-linear-gradient(#CCB36E, #fff);
  36.                           background: linear-gradient(#CCB36E, #fff);}
  37.             </style>
  38.             <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  39.             <script src="/jquery.masonry.min.js"></script>
  40.             <script>
  41.                 $(function () {
  43.                     $('#container').masonry({
  44.                         itemSelector: '.sector'
  45.                     });
  47.                 });
  48.             </script>            
  49.         </head>
  50.         <body style="font-family: 'Arial Narrow', Arial, sans-serif; font-size: 16px; margin:0;">
  51.         <div style="width:860px; margin: 0px auto; padding:0 0px; overflow: visible; position:relative; height: 1260px;">
  52.             <div style="width:100%; overflow: hidden; position:relative;">
  53.                 <table style="width:100%;">
  54.                     <tbody>
  55.                         <tr>
  56.                             <td><img src="/frontoffice/infoneu/header_{{app.request.locale}}.jpg" style="width:100%;"/></td>
  57.                         </tr>
  58.                         <tr>
  59.                             <td style="background:#fff;">
  60.                                 <p style="text-align:right; color:#87a29e; padding: 0 5px; font-size: 16px;">{{sFecha}}</p>
  61.                             </td>
  62.                         </tr>
  63.                     </tbody>
  64.                 </table>
  65.                 <table style="border:solid 1px #87a29e; width:100%;height:100%" cellspacing="0" cellpadding="0">
  66.                     <tbody>
  67.                         <tr>
  68.                             <td style="border-right:solid 1px #87a29e; width:50%; text-align:center; vertical-align: top;">
  69.                                 <div style="text-align:center;"><img src="/frontoffice/infoneu/pistas.svg" style="display:inline-block; width:70px;"/></div>
  70.                                 <p style="font-family: 'Paytone One', sans-serif; font-size:18px; line-height:18px; text-transform:uppercase;">{{enPistes|length}} {{"pistes obertes"| trans}}<br/>
  71.                                     {{general.getKmesquiablesDia()}}Km {{"esquiables"| trans}}</p>
  73.                                 <div style="min-height: 400px!important;position:relative;">
  74.                                     {% for zona in aZones %}
  75.                                         <div class="sector">
  76.                                             <h3 style="margin:0; font-size: 1em; line-height:1em;">{{"Sector"| trans}} {{zona|lower}}</h3>
  77.                                             <p style="font-size: 11px; line-height:13px">
  78.                                                 {% set coma=''%}
  79.                                                 {% for pista in aPistes[zona~''] %}
  80.                                                     {{coma}}    
  81.                                                     <span class="color_{{pista['color']}}">{{pista['nom']|lower}}</span>
  82.                                                     {% set coma=', '%}
  83.                                                 {% endfor %}
  84.                                             </p>
  85.                                         </div>
  86.                                     {% endfor %}
  88.                                     {% if general.getImatgeInfoneu() is not empty %}
  89.                                         <div style="position:absolute;bottom:0; width:100%;"><div style="padding:1px;"><img src="{{asset('uploads/general/'~general.getImatgeInfoneu())}}" style="width:100%; display:block; bottom:0;"/></div></div>
  90.                                             {% endif %}
  91.                                 </div>
  92.                             </td>
  93.                             <td style="width:50%; text-align:center; vertical-align: top; position:relative;">
  94.                                 <table style="width:100%; margin:0px 0px 0px 0px; background:none;height:100%" cellspacing="0" cellpadding="0">
  95.                                     <tbody>
  96.                                         <tr style="">
  97.                                             <td style="border-bottom:solid 1px #87a29e; vertical-align: top; text-align:center; padding: 10px;">
  98.                                                 <div style="padding:2px 1px;text-align:center;display:block;">
  99.                                                     <img src="/frontoffice/infoneu/remontadores.svg" style="display:inline-block; width:70px;"/>
  100.                                                 </div>
  101.                                                 <p style="font-family: 'Paytone One', sans-serif; font-size:18px; line-height:18px; text-transform:uppercase; margin-bottom: 10px;">{{enRemuntadors|length}} {{"remuntadors en funcionament"| trans}}</p>
  103.                                                 <div style="padding: 0 10px 10px 10px; min-height: 60px;">
  104.                                                     {% for tipo in aTipus %}
  105.                                                         <p style="font-size: 13px; margin:0 0 0 0; line-height: 13px;">
  106.                                                             <!--
  107.                                                             <span style="font-weight: bold;">{{tipo|lower}}</span>: 
  108.                                                             -->
  109.                                                             {% set coma=''%}
  110.                                                             {% for remuntador in aRemuntadors[tipo~''] %}
  111.                                                                 {{coma}} 
  112.                                                                 {{remuntador}}
  113.                                                                 {% set coma=', '%}
  114.                                                             {% endfor %}
  115.                                                         </p>
  116.                                                     {% endfor %}
  117.                                                 </div>
  118.                                             </td>
  119.                                         </tr>
  120.                                         <tr style="height: 100%;">
  121.                                             <td style="vertical-align: top; padding: 2.1px;">
  122.                                                 <table style="width:100%; margin:0;height:100%" cellspacing="0" cellpadding="0">
  123.                                                     <tbody>
  124.                                                     {% if general.getAlp2500() != 'desactivat' or general.getSnowparkDia() != 'desactivat' %}
  125.                                                         <tr>
  126.                                                             {% if general.getAlp2500() != 'desactivat' %}
  127.                                                                 {# S'ha de mirar si estan actius els dos blocks per mirar el tamany que ha de tenir el td #}
  128.                                                                 {% if general.getSnowparkDia() != 'desactivat' %}
  129.                                                                 <td style="border-bottom:solid 1px #87a29e;  width:50%; font-family: 'Paytone One', sans-serif; text-transform:uppercase; text-align: center;">
  130.                                                                 {% else %}
  131.                                                                 <td colspan="2" style="border-bottom:solid 1px #87a29e;width:100%; font-family: 'Paytone One', sans-serif; text-transform:uppercase; text-align: center;">
  132.                                                                 {% endif %}
  133.                                                                     <p style="font-family: 'Paytone One', sans-serif; font-size:16px; text-transform:uppercase; text-align: center;">{{"Connexió"| trans}} ALP2500<br/>
  134.                                                                         Masella+La Molina</p>
  135.                                                                     <p>&nbsp;</p>
  136.                                                                     <p style="font-family: 'Paytone One', sans-serif; font-size:16px; text-transform:uppercase; text-align: center;">{{ (general.getAlp2500()=='tancat'?'TANCADA'|trans:'OBERTA'|trans)}}</p>
  137.                                                                 <p>&nbsp;</p>
  138.                                                                 </td>
  139.                                                             {% endif %}
  140.                                                             {% if general.getSnowparkDia() != 'desactivat' %}
  141.                                                                 {# S'ha de mirar si estan actius els dos blocks per mirar el tamany que ha de tenir el td #}
  142.                                                                 {% if general.getAlp2500() != 'desactivat' %}
  143.                                                                 <td style="border-left:solid 1px #87a29e;border-bottom:solid 1px #87a29e;width:50%; text-align:center;font-family: 'Paytone One', sans-serif; fon-size:16px; text-transform:uppercase;">
  144.                                                                 {% else %}
  145.                                                                 <td colspan="2" style="border-bottom:solid 1px #87a29e;width:100%; text-align:center;font-family: 'Paytone One', sans-serif; fon-size:16px; text-transform:uppercase;">
  146.                                                                 {% endif %}
  147.                                                                     <div style="padding:10px;">
  148.                                                                         <!--<img src="{{asset('bundles/app/frontoffice/infoneu/snowparkmasella.jpg')}}" style="width:70%;"/><br/>-->
  149.                                                                         <img src="/frontoffice/infoneu/snowparkmasella.jpg" style="width:70%;"/><br/>
  150.                                                                         {{ (general.getSnowparkDia()=='tancat'?'TANCAT'|trans:'OBERT'|trans)}}
  151.                                                                     </div>
  152.                                                                 </td>
  153.                                                             {% endif %}
  154.                                                        </tr>
  155.                                                     {% endif %}
  156.                                                         <tr>
  157.                                                             <td style="width:50%; font-family: 'Paytone One', sans-serif; fon-size:16px; text-transform:uppercase; text-align: center; padding: 1rem 0">
  158.                                                                 <p style="font-family: 'Paytone One', sans-serif; font-size:16px; text-transform:uppercase; text-align: center;">{{"Meteo Avui"| trans}}</p>
  159.                                                                 {% if enPrediccioMeteo.icon2 is defined %}
  160.                                                                 <p style="font-family: 'Paytone One', sans-serif; font-size:16px; text-transform:uppercase; text-align: center;"><img src="/frontoffice/images/meteo/meteo-icon/meteo-{{enPrediccioMeteo.icon2}}.jpg" style="display:inline-block;width:30%;background:#fff!important;"/></p>
  161.                                                                 {% endif %}
  162.                                                             </td>
  163.                                                             <td style="border-left:solid 1px #87a29e; width:50%; font-family: 'Paytone One', sans-serif; text-transform:uppercase; text-align: center; padding: 1rem 0;">
  164.                                                                 <p style="font-family: 'Paytone One', sans-serif; font-size:16px; text-transform:uppercase; text-align: center;">{{"Temperatura mínima"| trans}}<br/>
  165.                                                                     La Tosa 2535m</p>
  166.                                                                 <p style="font-family: 'Paytone One', sans-serif; font-size:28px!important; text-transform:uppercase; text-align: center;">{{aMeteo['42']}}</p>
  167.                                                             </td>
  168.                                                         </tr>
  169.                                                     </tbody>
  170.                                                 </table>
  171.                                             </td>
  172.                                         </tr>
  173.                                     </tbody>
  174.                                 </table>
  175.                             </td>
  176.                         </tr>
  177.                     </tbody>
  178.                 </table>
  179.                 <table style="width:100%; margin:5px 0;">
  180.                     <tbody>
  181.                         <tr>
  182.                             <td style="width:100%; vertical-align: middle; text-align: center;">
  183.                                 <p style="font-family: 'Paytone One', sans-serif; font-size:18px; text-transform:uppercase; color:#87a29e;">{{"Gruixos i Qualitat"| trans}}:</p>
  184.                             <ul style="list-style: none; margin: 0;padding:3px 10px;font-family: 'Poppins', sans-serif; margin:0px 0;font-size:18px; font-weight:700; color:#000">
  185.                                     <li>{{aGeneral['iMin']~'-'~aGeneral['iMax']}}cm | {{attribute(general, 'masellaEstat'~(app.request.locale|capitalize))|upper}} {% if attribute(general, 'masellaEstat2'~(app.request.locale|capitalize)) != '' %} - {{attribute(general, 'masellaEstat2'~(app.request.locale|capitalize))|upper}} {% endif %}</li>
  186.                                     <!--
  187.                                     {% if general.getMasellaCm() != '' and general.getMasellaCm() > 0 %}
  188.                                     <li>PLA DE MASELLA - 1600m - {{general.getMasellaCm()}}cm {{attribute(general, 'masellaEstat'~(app.request.locale|capitalize))|upper}} {% if attribute(general, 'masellaEstat2'~(app.request.locale|capitalize)) != '' %} - {{attribute(general, 'masellaEstat2'~(app.request.locale|capitalize))|upper}} {% endif %}</li>
  189.                                     {% endif %}
  190.                                     {% if general.getComaOriolaCm() != '' and general.getComaOriolaCm() > 0 %}
  191.                                     <li>COMA ORIOLA - 1950m - {{general.getComaOriolaCm()}}cm {{attribute(general, 'comaOriolaEstat'~(app.request.locale|capitalize))|upper}} {% if attribute(general, 'comaOriolaEstat2'~(app.request.locale|capitalize)) != '' %} - {{attribute(general, 'comaOriolaEstat2'~(app.request.locale|capitalize))|upper}}{% endif %}</li>
  192.                                     {% endif %}
  193.                                     {% if general.getBoscCm() != '' and general.getBoscCm() > 0 %}
  194.                                     <li>CAP DEL BOSC - 2150m - {{general.getBoscCm()}}cm {{attribute(general, 'boscEstat'~(app.request.locale|capitalize))|upper}} {% if attribute(general, 'boscEstat2'~(app.request.locale|capitalize)) != '' %} - {{attribute(general, 'boscEstat2'~(app.request.locale|capitalize))|upper}}{% endif %}</li>
  195.                                     {% endif %}
  196.                                     {% if general.getLaPletaCm() != '' and general.getLaPletaCm() > 0 %}
  197.                                     <li>LA PLETA - 2020m - {{general.getLaPletaCm()}}cm {{attribute(general, 'laPletaEstat'~(app.request.locale|capitalize))|upper}} {% if attribute(general, 'laPletaEstat2'~(app.request.locale|capitalize)) != '' %} - {{attribute(general, 'laPletaEstat2'~(app.request.locale|capitalize))|upper}}{% endif %}</li>
  198.                                     {% endif %}
  199.                                     {% if general.getTosaCm() != '' and general.getTosaCm() > 0 %}
  200.                                     <li>LA TOSA - 2535m - {{general.getTosaCm()}}cm {{attribute(general, 'tosaEstat'~(app.request.locale|capitalize))|upper}} {% if attribute(general, 'tosaEstat2'~(app.request.locale|capitalize)) != '' %} - {{attribute(general, 'tosaEstat2'~(app.request.locale|capitalize))|upper}}{% endif %}</li>
  201.                                     {% endif %}
  202.                                     -->
  203.                                 </ul>
  204.                             </td>
  205.                         </tr>
  206.                     </tbody>
  207.                 </table>
  209.             </div>
  210.             <div style="position:relative; bottom:0; right:0; width:100%;">
  211.                 <table style="width:860px; margin: 0 auto 10px auto;">
  212.                     <tbody>
  213.                         <tr>
  214.                             <td style="width:27%; min-width:230px; vertical-align: top; border:solid 1px #87a29e; border-right:0;">
  215.                                 <p style="font-family: 'Paytone One', sans-serif; font-size:18px; text-transform:uppercase; text-align: right; color:#87a29e;">{{"Masella informa"| trans}}:</p>
  216.                             </td>
  217.                             <td style="width:73%; vertical-align: top; border:solid 1px #87a29e; border-left:0;">
  218.                                 <ul style="list-style: none; margin: 0;padding: 3px 10px 10px 10px;font-family: 'Poppins', sans-serif; margin:0px 0; font-weight: normal; font-size:12px;">
  219.                                     <li>{{attribute(general, 'masellaInforma'~(app.request.locale|capitalize))|raw}}</li>
  220.                                 </ul>
  221.                             </td>
  222.                         </tr>
  223.                         <tr><td colspan="2"><img src="/frontoffice/infoneu/footer.jpg" style="width:860px;"/></td><tr>
  224.                     </tbody>
  225.                 </table>
  226.             </div>
  227.         </div>
  228.     </body>
  229. </html>