templates/default/detail.html.twig line 1

Open in your IDE?
  1. {% extends "layout.html.twig" %}
  2. {% block content %}
  3. <div class="wrapper">
  4.       <section>
  5.         <aside>
  6.           <div class="graph">
  7.             <img src="/static/img/graph.png">
  8.           </div>
  9.           <ul class="categories">
  10.             <li>
  11.               <strong>Katalog</strong>
  12.             </li>
  13.             <li>
  14.               <a href="#">Material Processing <small>(1441)</small><i>+</i></a>
  15.             </li>
  16.             <li>
  17.               <a href="#">Surface Protection <small>(177)</small><i>-</i></a>
  18.               <ul>
  19.                 <li>
  20.                   <a href="#">Gummierungs-Systeme <small>(128)</small></a>
  21.                 </li>
  22.                 <li>
  23.                   <a href="#">Beschichtungs-Systeme <small>(49)</small></a>
  24.                 </li>                
  25.               </ul>
  26.             </li>
  27.             <li>
  28.               <a href="#">Service <small>(706)</small><i>+</i></a>
  29.             </li>
  30.           </ul>
  31.           <ul class="misc">
  32.             <li>
  33.               <strong>Sonstiges</strong>
  34.             </li>
  35.             <li>
  36.               <a href="#">Downloads <small>(36)</small></a>
  37.             </li>
  38.             <li>
  39.               <a href="#">B-Ware <small>(36)</small></a>
  40.             </li>
  41.             <li>
  42.               <a href="#">CSV-Upload <small>(36)</small></a>
  43.             </li>
  44.             <li>
  45.               <a href="#">Offene Aufträge <small>(36)</small></a>
  46.             </li>
  47.             <li>
  48.               <a href="#">Abgeschlossene Aufträge <small>(36)</small></a>
  49.             </li>
  50.             <li>
  51.               <a href="#">Warenkörbe <small>(36)</small></a>
  52.             </li>
  53.             <li>
  54.               <a href="#">Media Center <small>(36)</small></a>
  55.             </li>                                                            
  56.           </ul>
  57.         </aside>
  58.         <article>
  59.           <div class="content-top">
  60.             <section>
  61.               <div class="left">
  62.                 <div class="fluid">
  63.                   <div class="span8">
  64.                     <div class="remabutton alt">
  65.                       <a href="/">
  66.                         <img src="/static/img/backbutton.png" style="height: 18px; width: auto; top: 3px;">
  67.                         Zurück
  68.                       </a>
  69.                     </div>
  70.                   </div>
  71.                   <div class="span4">
  72.                     <div class="pdp-lastmodified">
  73.                     <input type="hidden" id="id" value="{{product.id}}" />
  74.                       {% set creationdate = product.creationdate|date('U') %} 
  75.                       {% set modificationdate = product.modificationdate|date('U') %}
  76.                       <label>Erstellt: {{creationdate|date('d.m.Y - H:i')}}</label>
  77.                       <label>Zuletzt bearbeitet: {{modificationdate|date('d.m.Y - H:i')}}</label>
  78.                     </div>
  79.                   </div>
  80.                 </div>
  81.  
  82.                 <div class="clearleft"></div>
  83.                 <div class="fluid">
  84.                   <div class="span8">
  85.                     <div class="countries">
  86.                         <strong>Produkt verfügbar für folgende Shops</strong>
  87.                         <div class="active">
  88.                           <section>
  89.                             <div>
  90.                               <span><img src="/static/img/de.svg" height="16">DE</span>
  91.                             </div>
  92.                           </section>
  93.                         </div>        
  94.                         <div class="active">
  95.                           <section>
  96.                             <div>
  97.                               <span><img src="/static/img/ch.svg" height="16">CH</span>
  98.                             </div>
  99.                           </section>
  100.                         </div>    
  101.                         <div class="active">
  102.                           <section>
  103.                             <div>
  104.                               <span><img src="/static/img/lat.svg" height="16">LAT</span>
  105.                             </div>
  106.                           </section>
  107.                         </div>    
  108.                         <div>
  109.                           <section>
  110.                             <div>
  111.                               <span><img src="/static/img/fr.svg" height="16">FR</span>
  112.                             </div>
  113.                           </section>
  114.                         </div>  
  115.                         <div>
  116.                           <section>
  117.                             <div>
  118.                               <span><img src="/static/img/it.svg" height="16">IT</span>
  119.                             </div>
  120.                           </section>
  121.                         </div> 
  122.                         <div class="active">
  123.                           <section>
  124.                             <div>
  125.                               <span><img src="/static/img/at.svg" height="16">AT</span>
  126.                             </div>
  127.                           </section>
  128.                         </div> 
  129.                         <div>
  130.                           <section>
  131.                             <div>
  132.                               <span><img src="/static/img/esp.svg" height="16">ESP</span>
  133.                             </div>
  134.                           </section>
  135.                         </div> 
  136.                       </div>
  137.                   </div>
  138.                   <div class="span4">
  139.                     <div class="pdp-lastmodified">
  140.                       <br><br><br>
  141.                       <label><img src="/static/img/delete.svg" width="16"> Löschung beantragen</label>
  142.                     </div>
  143.                   </div>
  144.                 </div>
  145.  
  146.                 <div class="clearleft"></div>
  147.               </div>  
  148.               <div class="right">
  149.                 <div class="addnew" style="position: relative;top: -65px">
  150.                   <i>+</i>
  151.                   <strong>Produkt hinzufügen</strong>
  152.                 </div>
  153.               </div>
  154.             </section>
  155.           </div>
  156.           <section>
  157.             <section class="toolbar" style="border-top: 0;">
  158.               <section>
  159.                 <div>
  160.                   <label>Sprache</label>
  161.                   <section>
  162.                     <div>
  163.                       <span><img src="/static/img/de.svg" height="16">DE</span>
  164.                     </div>
  165.                   </section>
  166.                   <i class="chevron-arrow-down"></i>
  167.                 </div>       
  168.                 <div>
  169.                   <label>Status</label>
  170.                   <section>
  171.                     <div>
  172.                       <span><i class="red"></i>Entwurf</span>
  173.                     </div>                    
  174.                   </section>
  175.                   <i class="chevron-arrow-down"></i>
  176.                 </div>
  177.                 <div>
  178.                   <label><img src="/static/img/ai_icon.svg" width="16"> Speichern &amp; Übersetzen</label>
  179.                 </div>
  180.                 <div>
  181.                   <div class="remabutton safeproduct">
  182.                     <a href="#">
  183.                       <img src="/static/img/speichern.png" style="width: 42px; height: auto;">
  184.                       Speichern
  185.                     </a>
  186.                   </div>
  187.                 </div>
  188.               </section>
  189.             </section>
  190.             <section class="pdp">
  191.               <div class="fluid">
  192.                 <div class="span4">
  193.                   <div class="input padding-right">
  194.                     <label>Artikelnummer</label>
  195.                     <div class="checkbox">
  196.                       <input type="checkbox">
  197.                       <span>Global</span>
  198.                     </div>
  199.                     <div class="field">
  200.                       <input type="text" placeholder="{{product.sku}}">
  201.                     </div>
  202.                   </div>
  203.                 </div>
  204.                 <div class="span8">
  205.                   <div class="input padding-left">
  206.                     <label>Produkttitel</label>
  207.                     <div class="checkbox">
  208.                       <input type="checkbox">
  209.                       <span>Global</span>
  210.                     </div>
  211.                     <div class="field">
  212.                       <input type="text" placeholder="{{product.name_de}}">
  213.                     </div>
  214.                   </div>
  215.                 </div>
  216.               </div>
  217.               <div class="clearleft"></div>
  218.               <div class="fluid">
  219.                 <div class="span6">
  220.                   <div class="standalone-inputlabel">Bilder &amp; Videos</div>
  221.                   <div class="photos">
  222.                     <div class="fluid">
  223.                       <div class="span5 left">
  224.                         <div style="background-image: url({{ product.mainimage.thumbnail('product_listing') }});"></div>
  225.                         
  226.                       </div>
  227.                       <div class="span7 right">
  228.                         <div style="background-image: url({{ product.mainimage.thumbnail('product_listing') }});"></div>
  229.                         <div style="background-image: url({{ product.mainimage.thumbnail('product_listing') }});"></div>
  230.                         <div style="background-image: url({{ product.mainimage.thumbnail('product_listing') }});"></div>
  231.                         <div style="background-image: url({{ product.mainimage.thumbnail('product_listing') }});"></div>
  232.                       </div>
  233.                     </div>
  234.                   </div>
  235.                 </div>
  236.                 <div class="span6">
  237.                   <div class="standalonecheckbox">
  238.                     <input type="checkbox" checked="">
  239.                     <span>Global</span>
  240.                   </div>
  241.                   <div class="upload">
  242.                     <img src="/static/img/upload.png" height="200">
  243.                   </div>
  244.                 </div>
  245.               </div>
  246.               <div class="clearleft"></div>
  247.               <div class="fluid">
  248.                 <div class="span2">
  249.                   <div class="input padding-right label">
  250.                     <label>Preis</label>
  251.                     <div class="field">
  252.                       <i>CHF</i>
  253.                       <input type="text" placeholder="" value="1'456.00">
  254.                     </div>
  255.                   </div>
  256.                 </div>
  257.                 <div class="span2">
  258.                   <div class="input padding-right label">
  259.                     <label>&nbsp;</label>
  260.                     <div class="field">
  261.                       <i>€</i>
  262.                       <input type="text" placeholder="" value="1'456.00">
  263.                     </div>
  264.                   </div>
  265.                 </div>
  266.                 <div class="span2">
  267.                   <div class="input padding-right label">
  268.                     <label>&nbsp;</label>
  269.                     <div class="field">
  270.                       <i>$</i>
  271.                       <input type="text" placeholder="" value="1'456.00">
  272.                     </div>
  273.                   </div>
  274.                 </div>
  275.                 <div class="span2">
  276.                   <div class="input padding-right label">
  277.                     <label>&nbsp;</label>
  278.                     <div class="field">
  279.                       <i>ARS</i>
  280.                       <input type="text" placeholder=" " value="1'456.00">
  281.                     </div>
  282.                   </div>
  283.                 </div>
  284.                 <div class="span2">
  285.                   <div class="magicbutton">
  286.                     <label><img src="/static/img/ai_icon.svg" width="16"> Umrechnen</label>
  287.                   </div>
  288.                 </div>                                                                
  289.               </div>
  290.               <div class="clearleft"></div>
  291.               <div class="fluid">
  292.                 <div class="span3">
  293.                   <div class="input padding-right">
  294.                     <label>Anzahl Lager</label>
  295.                     <div class="checkbox">
  296.                       <input type="checkbox" checked="">
  297.                       <span>Global</span>
  298.                     </div>
  299.                     <div class="field">
  300.                       <input type="text" placeholder="" value="{{product.qty}}">
  301.                     </div>
  302.                   </div>
  303.                 </div>
  304.                 <div class="span7">
  305.                   <div class="input padding-left">
  306.                     <label>Lagernotiz</label>
  307.                     <div class="checkbox">
  308.                       <input type="checkbox">
  309.                       <span>Global</span>
  310.                     </div>
  311.                     <div class="field">
  312.                       <input type="text" placeholder="" value="Artikel auf Lager">
  313.                     </div>
  314.                   </div>
  315.                 </div>
  316.                 <div class="span2">
  317.                   <div class="magicbutton">
  318.                     <label><img src="/static/img/lager_icon.svg" width="18"> Erweitert</label>
  319.                   </div>
  320.                 </div>
  321.               </div>
  322.  <div class="clearleft"></div>
  323.               <div class="fluid">
  324.                 <div class="span4">
  325.                   <div class="input padding-right">
  326.                     <label>Kurzbeschreibung</label>
  327.                     <div class="checkbox">
  328.                       <input type="checkbox">
  329.                       <span>Global</span>
  330.                     </div>
  331.                     <div class="field">
  332.                       <textarea name="short_description_de" id="editor2">{{product.short_description_de | raw}}</textarea>
  333.                       <script>
  334.                       CKEDITOR.replace('editor2', {   
  335.                         toolbar: [
  336.                           { name: 'clipboard',   items: [ 'Undo', 'Redo' ] },
  337.                           { name: 'basicstyles', items: [ 'Bold', 'Italic', 'Underline', 'Strike' ] },
  338.                           { name: 'paragraph',   items: [ 'NumberedList', 'BulletedList' ] },
  339.                           { name: 'links',       items: [ 'Link', 'Unlink' ] }
  340.                         ],
  341.                         removePlugins: 'elementspath,resize,contextmenu',
  342.                         resize_enabled: false,
  343.                         removeButtons: '',
  344.                         allowedContent: true
  345.                       });
  346.                     </script>
  347.                     </div>
  348.                   </div>
  349.                 </div>
  350.                 <div class="span8">
  351.                   <div class="input padding-left">
  352.                     <label>Beschreibung</label>
  353.                     <div class="checkbox">
  354.                       <input type="checkbox">
  355.                       <span>Global</span>
  356.                     </div>
  357.                     <div class="field">
  358.                       <textarea name="description_de" id="editor1" name="editor1">{{ product.description_de | raw }}</textarea>
  359.                       <script>
  360.                       CKEDITOR.replace('editor1', {   
  361.                         toolbar: [
  362.                           { name: 'clipboard',   items: [ 'Undo', 'Redo' ] },
  363.                           { name: 'basicstyles', items: [ 'Bold', 'Italic', 'Underline', 'Strike' ] },
  364.                           { name: 'paragraph',   items: [ 'NumberedList', 'BulletedList' ] },
  365.                           { name: 'links',       items: [ 'Link', 'Unlink' ] }
  366.                         ],
  367.                         removePlugins: 'elementspath,resize,contextmenu',
  368.                         resize_enabled: false,
  369.                         removeButtons: '',
  370.                         allowedContent: true
  371.                       });
  372.                     </script>  
  373.                     </div>
  374.                   </div>
  375.                 </div>
  376.               </div>
  377.  <div class="clearleft"></div>
  378.               <div class="fluid">
  379.                 <div class="span3 span3-alt">
  380.                   <div class="input label padding-right">
  381.                     <label>Dokumente</label>
  382.                     <div class="checkbox">
  383.                       <input type="checkbox">
  384.                       <span>Global</span>
  385.                     </div>     
  386.                     <div class="field">
  387.                       <a href="{{product.safety_data_sheet_en}}" target="_blank"><i>PDF</i></a>
  388.                       <input type="text" placeholder="" value="Sicherheitsdatenblatt">
  389.                     </div>
  390.                     <p><a href="{{product.safety_data_sheet_en}}" target="_blank">{{product.safety_data_sheet_en}}</a></p>
  391.                   </div>
  392.                 </div>
  393.                 <div class="span3 span3-alt">
  394.                   <div class="input label padding-right">
  395.                     <label>&nbsp;</label>          
  396.                     <div class="field">
  397.                       <a href="{{product.safety_data_sheet_de}}" target="_blank"><i>PDF</i></a>
  398.                       <input type="text" placeholder="" value="Anleitung">
  399.                     </div>
  400.                     <p><a href="{{product.safety_data_sheet_de}}" target="_blank">{{product.safety_data_sheet_de}}</a></p>
  401.                   </div>
  402.                 </div>
  403.                 <div id="addnewdocumentouter" class="span3 span3-alt">
  404.                   <div class="input padding-right label">
  405.                     <div id="addnewdocument" class="newdocument">+</div>
  406.                   </div>
  407.                 </div>
  408.               </div>
  409.  <div class="clearleft"></div>
  410.               
  411.               <div class="fluid">
  412.                 <div class="span4">
  413.                   <div class="input padding-right">
  414.                     <label>Gewicht</label>
  415.                     <div class="checkbox">
  416.                       <input type="checkbox" checked="">
  417.                       <span>Global</span>
  418.                     </div>
  419.                     <div class="field">
  420.                       <input type="text" placeholder="" value="{{product.spezifisches_gewicht}}">
  421.                     </div>
  422.                   </div>
  423.                 </div>
  424.                 <div class="span4">
  425.                   <div class="input padding-left">
  426.                     <label>Inhalt</label>
  427.                     <div class="checkbox">
  428.                       <input type="checkbox" checked="" >
  429.                       <span>Global</span>
  430.                     </div>
  431.                     <div class="field">
  432.                       <input type="text" placeholder="" value="{{product.content}}">
  433.                     </div>
  434.                   </div>
  435.                 </div>
  436.                 <div class="span4">
  437.                   <div class="input padding-left">
  438.                     <label>Masse</label>
  439.                     <div class="checkbox">
  440.                       <input type="checkbox" checked="">
  441.                       <span>Global</span>
  442.                     </div>
  443.                     <div class="field">
  444.                       <input type="text" placeholder="" value="{{product.warengruppenstruktur}}">
  445.                     </div>
  446.                   </div>
  447.                 </div>                
  448.               </div>
  449.               <div class="fluid">
  450.                 <div class="span4">
  451.                   <div class="input padding-right">
  452.                     <label>Maximale Bestellmenge</label>
  453.                     <div class="checkbox">
  454.                       <input type="checkbox" checked="">
  455.                       <span>Global</span>
  456.                     </div>
  457.                     <div class="field">
  458.                       <input type="text" placeholder="" value="{{product.maximale_bestellmenge}}">
  459.                     </div>
  460.                   </div>
  461.                 </div>
  462.                 <div class="span4">
  463.                   <div class="input padding-left">
  464.                     <label>Packungsmenge</label>
  465.                     <div class="checkbox">
  466.                       <input type="checkbox" checked="" >
  467.                       <span>Global</span>
  468.                     </div>
  469.                     <div class="field">
  470.                       <input type="text" placeholder="" value="{{product.packungsmenge}}">
  471.                     </div>
  472.                   </div>
  473.                 </div>
  474.                 <div class="span4">
  475.                   <div class="input padding-left">
  476.                     <label>Lieferbar am</label>
  477.                     <div class="checkbox">
  478.                       <input type="checkbox" checked="">
  479.                       <span>Global</span>
  480.                     </div>
  481.                     <div class="field">
  482.                       <input type="text" placeholder="" value="{{product.lieferbar_am}}">
  483.                     </div>
  484.                   </div>
  485.                 </div>                
  486.               </div>
  487.               <div class="fluid">
  488.                 <div class="span4">
  489.                   <div class="input padding-right">
  490.                     <label>Wieder lieferbar</label>
  491.                     <div class="checkbox">
  492.                       <input type="checkbox" checked="">
  493.                       <span>Global</span>
  494.                     </div>
  495.                     <div class="field">
  496.                       <input type="text" placeholder="" value="{{product.wieder_lieferbar}}">
  497.                     </div>
  498.                   </div>
  499.                 </div>
  500.                 <div class="span4">
  501.                   <div class="input padding-left">
  502.                     <label>Polymerbasis</label>
  503.                     <div class="checkbox">
  504.                       <input type="checkbox" checked="" >
  505.                       <span>Global</span>
  506.                     </div>
  507.                     <div class="field">
  508.                       <input type="text" placeholder="" value="{{product.polymerbasis}}">
  509.                     </div>
  510.                   </div>
  511.                 </div>
  512.                 <div class="span4">
  513.                   <div class="input padding-left">
  514.                     <label>UN Nummer</label>
  515.                     <div class="checkbox">
  516.                       <input type="checkbox" checked="">
  517.                       <span>Global</span>
  518.                     </div>
  519.                     <div class="field">
  520.                       <input type="text" placeholder="" value="{{product.un_nummer}}">
  521.                     </div>
  522.                   </div>
  523.                 </div>                
  524.               </div>
  525.               <div class="fluid">
  526.                 <div class="span4">
  527.                   <div class="input padding-right">
  528.                     <label>Solvent</label>
  529.                     <div class="checkbox">
  530.                       <input type="checkbox" checked="">
  531.                       <span>Global</span>
  532.                     </div>
  533.                     <div class="field">
  534.                       <input type="text" placeholder="" value="{{product.losungsmittel}}">
  535.                     </div>
  536.                   </div>
  537.                 </div>
  538.                 <div class="span4">
  539.                   <div class="input padding-left">
  540.                     <label>Bezeichnung</label>
  541.                     <div class="checkbox">
  542.                       <input type="checkbox" checked="" >
  543.                       <span>Global</span>
  544.                     </div>
  545.                     <div class="field">
  546.                       <input type="text" placeholder="" value="{{product.bezeichnung}}">
  547.                     </div>
  548.                   </div>
  549.                 </div>
  550.                 <div class="span4">
  551.                   <div class="input padding-left">
  552.                     <label>Zolltarifnummer</label>
  553.                     <div class="checkbox">
  554.                       <input type="checkbox" checked="">
  555.                       <span>Global</span>
  556.                     </div>
  557.                     <div class="field">
  558.                       <input type="text" placeholder="" value="{{product.zolltarifnummer}}">
  559.                     </div>
  560.                   </div>
  561.                 </div>                
  562.               </div>
  563.               <div class="fluid">
  564.                 <div class="span4">
  565.                   <div class="input padding-right">
  566.                     <label>Warengruppenstruktur</label>
  567.                     <div class="checkbox">
  568.                       <input type="checkbox" checked="">
  569.                       <span>Global</span>
  570.                     </div>
  571.                     <div class="field">
  572.                       <input type="text" placeholder="" value="{{product.warengruppenstruktur}}">
  573.                     </div>
  574.                   </div>
  575.                 </div>
  576.                 <div class="span4">
  577.                   <div class="input padding-left">
  578.                     <label>Nettogewicht</label>
  579.                     <div class="checkbox">
  580.                       <input type="checkbox" checked="" >
  581.                       <span>Global</span>
  582.                     </div>
  583.                     <div class="field">
  584.                       <input type="text" placeholder="" value="{{product.nettogewicht}}">
  585.                     </div>
  586.                   </div>
  587.                 </div>
  588.                 <div class="span4">
  589.                   <div class="input padding-left">
  590.                     <label>Gefahrgut</label>
  591.                     <div class="checkbox">
  592.                       <input type="checkbox" checked="">
  593.                       <span>Global</span>
  594.                     </div>
  595.                     <div class="field">
  596.                       <input type="text" placeholder="" value="{{product.gefahrgut}}">
  597.                     </div>
  598.                   </div>
  599.                 </div>                
  600.               </div>
  601.               <div class="fluid">
  602.                 <div class="span4">
  603.                   <div class="input padding-right">
  604.                     <label>Formularart</label>
  605.                     <div class="checkbox">
  606.                       <input type="checkbox" checked="">
  607.                       <span>Global</span>
  608.                     </div>
  609.                     <div class="field">
  610.                       <input type="text" placeholder="" value="{{product.formularart}}">
  611.                     </div>
  612.                   </div>
  613.                 </div>                
  614.               </div>
  615. <div class="clearleft"></div>
  616.             </section>
  617.             <section class="toolbar" style="border-bottom: 0" "="">
  618.               <section>
  619.                 <div>
  620.                   <label>Sprache</label>
  621.                   <section>
  622.                     <div>
  623.                       <span><img src="/static/img/de.svg" height="16">DE</span>
  624.                     </div>
  625.                   </section>
  626.                   <i class="chevron-arrow-down"></i>
  627.                 </div>       
  628.                 <div>
  629.                   <label>Status</label>
  630.                   <section>
  631.                     <div>
  632.                       <span><i class="red"></i>Entwurf</span>
  633.                     </div>                    
  634.                   </section>
  635.                   <i class="chevron-arrow-down"></i>
  636.                 </div>
  637.                 <div>
  638.                   <label><img src="/static/img/ai_icon.svg" width="16"> Speichern &amp; Übersetzen</label>
  639.                 </div>
  640.                 <div>
  641.                   <div class="remabutton safeproduct">
  642.                     <a href="#">
  643.                       <img src="/static/img/speichern.png" style="width: 42px; height: auto;">
  644.                       Speichern
  645.                     </a>
  646.                   </div>
  647.                 </div>
  648.               </section>
  649.             </section>
  650.           </section>
  651.         </article>
  652.       </section>
  653.     </div>   
  654. {% endblock %}