{% extends "repapp/base.html" %}
{% block title %}
    - Repair-Cafés
{% endblock title %}
{% block head %}
    <style>
    @font-face { 
      font-family:'Source Sans Pro';
      font-style:normal;
      font-weight:300;
      src:url('https://www.repaircafe-hilpoltstein.de/fileadmin/repaircafe-hilpoltstein/default/templates/fonts/source-sans-pro-v11-latin-300.eot');
      /* IE9 Compat Modes */
      src:local('Source Sans Pro Light'), local('SourceSansPro-Light'),
           url('https://www.repaircafe-hilpoltstein.de/fileadmin/repaircafe-hilpoltstein/default/templates/fonts/source-sans-pro-v11-latin-300.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
           url('https://www.repaircafe-hilpoltstein.de/fileadmin/repaircafe-hilpoltstein/default/templates/fonts/source-sans-pro-v11-latin-300.woff2') format('woff2'), /* Super Modern Browsers */
           url('https://www.repaircafe-hilpoltstein.de/fileadmin/repaircafe-hilpoltstein/default/templates/fonts/source-sans-pro-v11-latin-300.woff') format('woff'), /* Modern Browsers */
           url('https://www.repaircafe-hilpoltstein.de/fileadmin/repaircafe-hilpoltstein/default/templates/fonts/source-sans-pro-v11-latin-300.ttf') format('truetype'), /* Safari, Android, iOS */
           url('https://www.repaircafe-hilpoltstein.de/fileadmin/repaircafe-hilpoltstein/default/templates/fonts/source-sans-pro-v11-latin-300.svg#SourceSansPro') format('svg');/* Legacy iOS */;
    } 
    @font-face { 
      font-family:'Source Sans Pro';
      font-style:normal;
      font-weight:400;
      src:url('https://www.repaircafe-hilpoltstein.de/fileadmin/repaircafe-hilpoltstein/default/templates/fonts/source-sans-pro-v11-latin-regular.eot');
      /* IE9 Compat Modes */
      src:local('Source Sans Pro Regular'), local('SourceSansPro-Regular'),
           url('https://www.repaircafe-hilpoltstein.de/fileadmin/repaircafe-hilpoltstein/default/templates/fonts/source-sans-pro-v11-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
           url('https://www.repaircafe-hilpoltstein.de/fileadmin/repaircafe-hilpoltstein/default/templates/fonts/source-sans-pro-v11-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
           url('https://www.repaircafe-hilpoltstein.de/fileadmin/repaircafe-hilpoltstein/default/templates/fonts/source-sans-pro-v11-latin-regular.woff') format('woff'), /* Modern Browsers */
           url('https://www.repaircafe-hilpoltstein.de/fileadmin/repaircafe-hilpoltstein/default/templates/fonts/source-sans-pro-v11-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
           url('https://www.repaircafe-hilpoltstein.de/fileadmin/repaircafe-hilpoltstein/default/templates/fonts/source-sans-pro-v11-latin-regular.svg#SourceSansPro') format('svg');/* Legacy iOS */;
    } 
    @font-face { 
      font-family:'Source Sans Pro';
      font-style:normal;
      font-weight:700;
      src:url('https://www.repaircafe-hilpoltstein.de/fileadmin/repaircafe-hilpoltstein/default/templates/fonts/source-sans-pro-v11-latin-700.eot');
      /* IE9 Compat Modes */
      src:local('Source Sans Pro Bold'), local('SourceSansPro-Bold'),
           url('https://www.repaircafe-hilpoltstein.de/fileadmin/repaircafe-hilpoltstein/default/templates/fonts/source-sans-pro-v11-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
           url('https://www.repaircafe-hilpoltstein.de/fileadmin/repaircafe-hilpoltstein/default/templates/fonts/source-sans-pro-v11-latin-700.woff2') format('woff2'), /* Super Modern Browsers */
           url('https://www.repaircafe-hilpoltstein.de/fileadmin/repaircafe-hilpoltstein/default/templates/fonts/source-sans-pro-v11-latin-700.woff') format('woff'), /* Modern Browsers */
           url('https://www.repaircafe-hilpoltstein.de/fileadmin/repaircafe-hilpoltstein/default/templates/fonts/source-sans-pro-v11-latin-700.ttf') format('truetype'), /* Safari, Android, iOS */
           url('https://www.repaircafe-hilpoltstein.de/fileadmin/repaircafe-hilpoltstein/default/templates/fonts/source-sans-pro-v11-latin-700.svg#SourceSansPro') format('svg');/* Legacy iOS */;
    } 
    @media all{ 
      * { 
        box-sizing: border-box;
      } 
    
      .frame > :last-child  { 
        margin-bottom: 0;
      } 
    
      .frame { 
        position: relative; 
        padding-top: 2rem; 
        padding-bottom: 2rem;
      } 
    }     
    
    @media (min-width: 576px){ 
      .frame { 
        padding-top: 2.5rem; 
        padding-bottom: 2.5rem;
      } 
    }     
    
    @media (min-width: 768px){ 
      .frame { 
        padding-top: 3rem; 
        padding-bottom: 3rem;
      } 
    }     
    
    @media (min-width: 992px){ 
      .frame { 
        padding-top: 3.5rem; 
        padding-bottom: 3.5rem;
      } 
    }     
    
    @media (min-width: 1200px){ 
      .frame { 
        padding-top: 3.5rem; 
        padding-bottom: 3.5rem;
      } 
    }     
    
    @media all{ 
      .frame-space-before-none { 
        margin-top: 0rem;
      } 
    
      .frame-space-after-none { 
        margin-bottom: 0rem;
      } 
    }     
    
    @media screen and (min-width: 1200px){ 
      .frame { 
        padding-top: 2.5rem; 
        padding-bottom: 2.5rem;
      } 
    }     
    
    @media all{ 
      .col-md-8 { 
        position: relative; 
        width: 100%; 
        padding-right: 20px; 
        padding-left: 20px;
      } 
    }     
    
    @media (min-width: 768px){ 
      .col-md-8 { 
        flex: 0 0 66.6666666667%; 
        max-width: 66.6666666667%;
      } 
    }     
    
    @media screen and (min-width: 992px){ 
      .col-md-8 { 
        padding-right: 40px;
      } 
    }     
    
    @media all{ 
      .row { 
        display: flex; 
        flex-wrap: wrap; 
        margin-right: -20px; 
        margin-left: -20px;
      } 
    
      .container { 
        width: 100%; 
        padding-right: 20px; 
        padding-left: 20px; 
        margin-right: auto; 
        margin-left: auto;
      } 
    }     
    
    @media (min-width: 576px){ 
      .container { 
        max-width: 540px;
      } 
    }     
    
    @media (min-width: 768px){ 
      .container { 
        max-width: 720px;
      } 
    }     
    
    @media (min-width: 992px){ 
      .container { 
        max-width: 960px;
      } 
    }     
    
    @media (min-width: 1200px){ 
      .container { 
        max-width: 1140px;
      } 
    }     
    
    @media all{ 
      .section { 
        overflow: hidden;
      } 
    }     
    
    @media screen and (min-width: 1200px){ 
      .section { 
        padding-top: 30px;
      } 
    }     
    
    @media all{ 
      body { 
        margin: 0; 
        font-family: "Source Sans Pro", sans-serif; 
        font-size: 1rem; 
        font-weight: 400; 
        line-height: 1.5; 
        color: #2b2b2b; 
        text-align: left; 
        background-color: #fff;
      } 
    
      html { 
        font-family: sans-serif; 
        line-height: 1.15; 
        -webkit-text-size-adjust: 100%; 
        -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
      } 
    
      .news-list-view { 
        padding-right: 20px; 
        padding-top: 10px;
      } 
    
      *,:before,:after { 
        box-sizing: border-box;
      } 
    
      :selection { 
        background-color: darkred;
      } 
    
      .article  { 
        padding: 30px 0; 
        border-bottom: 2px solid #cccccc;
      } 
    
      .article:last-child  { 
        border-bottom: 2px solid transparent;
      } 
    
      .article.event  { 
        padding: 0 0 30px 0;
      } 
    
      .dtdate { 
        font-size: 21px; 
        color: #FFFFFF; 
        background: darkred; 
        padding: 0 5px; 
        display: inline-block;
      } 
    
      .article.event .ort  { 
        margin-top: 5px; 
        font-size: 19px;
      } 
    
      .teaser-text  { 
        position: relative; 
        padding-bottom: 30px; 
        width: 100%;
      } 
    
      .article.event .teaser-text  { 
        padding-top: 20px; 
        padding-bottom: 10px;
      } 
    
      p { 
        margin-top: 0; 
        margin-bottom: 1rem;
      } 
    
      strong { 
        font-weight: bolder;
      } 
    
      a { 
        color:  darkred;
        text-decoration:  none; 
        background-color:  transparent;
      } 
    
      a  { 
        color:  darkblue; 
        border-bottom:  1px solid;
        font-style: normal;
      } 
    
      a:hover { 
        color:  #FFFFFF;
        text-decoration:  underline;
        background: darkred; 
      } 
    
      a:hover  { 
        background:  darkblue; 
        color:  #ffffff!important;
      } 
    }      
    </style>
{% endblock head %}
{% block content %}
    <h1 class="mt-2">Repair-Cafés</h1>
    <hr class="mt-0 mb-4">
    <ul class="list-group">
        {% for cafe in object_list %}
            <li class="list-group-item">
                <div class="news-list-view eventhome snipcss-aSNzE" id="news-container-82">
                    <div class="rc-date">
                        <div class="article event rc-date "
                             itemscope="itemscope"
                             itemtype="http://schema.org/Article">
                            <div class="dtdate">
                                <time itemprop="datePublished" datetime="13.05.2023">
                                    {{ cafe.event_date|date:"l" }}, {{ cafe.event_date|date }}, 14.00 - 17.00 Uhr
                                </time>
                            </div>
                            <div class="ort">
                                {{ cafe.location }}
                                <br>
                                {{ cafe.address }}
                            </div>
                            <div class="teaser-text">
                                <div itemprop="description">
                                    <p>
                                        <strong>
                                            Nur per Voranmeldung.
                                            <a href="{% url 'register_device' cafe.id %}">Zum Anmeldeformular</a>
                                        </strong>
                                    </p>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </li>
        {% empty %}
            <li class="list-group-item">Es gibt keine geplanten Repair-Cafés.</li>
        {% endfor %}
    </ul>
{% endblock content %}