Implementierung Bildrechte

_abschlussvortraege/template/noss-christian.md

@@ -1,15 +1,19 @@
 ---
 nachname: Noss
 vorname: Christian
-datum: 2020-01-01
-uhrzeit: 10-30
+datum: 2020-12-15
+uhrzeit: 13-00
 raum:  https://th-koeln.zoom.us/j/86224491085 (Passwort steht im Ilias) Präsentation
 betreuer: gh
 thema: Evaluation verschiedener Wireframing Techniken
 kooperationspartner: TH Köln
 teaserimage: noss-christian-teaserimage.jpg
 stichworte: Frondend-Development, Design, UX/UI, Methoden
-quelle-bildrechte-teaser: Christian Noss
+teaserimage-autor: Samuel Mann
+teaserimage-linzenz: GNU|https://en.wikipedia.org/wiki/en:GNU_Free_Documentation_License/
+teaserimage-quelle: Wikimedia Commons|https://commons.wikimedia.org/wiki/File:Paperbasedprototype2.jpg
+teaserimage-titel:
+
 hinweise:
 weiterfuehrende-themen: Themenvorschlag 1 | Themenvorschlag 2
 ---

_layouts/default-abschlussvortrag.html

@@ -60,14 +60,21 @@ <h2 class="subtitle is-3 has-shadow is-inverse">
         </h2>
       </div>
     </div>
-
-    {% if page.quelle-bildrechte-teaser  %}
-
-    {% else %}
+    <!-- BO Angaben zum Bild -->
+    {% if page.teaserimage-linzenz == nil and page.teaserimage-quelle == nil %}
     <div class="bildrechte alert">
-      <p>Bitte tragen Sie Angaben zu den Bildrechten in den Stammdaten ein.</p>
+      <p>Bitte tragen Sie Angaben zu den Bildrechten (Lizenz und Bildquelle) in den Stammdaten ein.</p>
     </div>
+    {% else %}
+    {% assign bildquelle = page.teaserimage-quelle | split: "|" %}
+    {% if page.teaserimage-titel != nil and page.teaserimage-autor != nil %}
+    {% assign bildtitel = ": „" | append: page.teaserimage-titel | append: "” von " |  append: page.teaserimage-autor%}
+    {% endif %}
+    {% assign bildlizenz = page.teaserimage-linzenz | split: "|" %}
+    <p class="bildrechte">Bildquelle: <a class="link" href="{{bildquelle[1]}}">{{bildquelle[0]}}</a>{{bildtitel}}{{bildautor}}, Lizenz: <a class="link" href="{{bildlizenz[1]}}">{{bildlizenz[0]}}</a></p>
+
     {% endif %}
+    <!-- EO Angaben zum Bild -->
   </section>
 
   {{ content }}

abschlussvortraege.html

@@ -22,12 +22,11 @@ <h1 class="title is-1">Abschlussvorträge</h1>
         {% endfor %}
       {% endfor %}
       {% assign termine_abschlussvortraege=termine_abschlussvortraege | sort %}
-
       {% for termin_abschlussvortrag in termine_abschlussvortraege %}
         {% assign vortraege=site.abschlussvortraege |sort:'uhrzeit'| where:"datum", termin_abschlussvortrag %}
         {% if vortraege.size > 0 %}
         <div class="talk">
-        <div><h3 class="is-inverse talk__headline talk__headline--active" id="{{termin_abschlussvortrag}}">{{ termin_abschlussvortrag | date: '%d. %B %Y' | replace:"January","Januar" | replace:"February","Februar" | replace:"March","März" | replace:"May","Mai" | replace:"June","Juni" | replace:"July","Juli" | replace:"December","Dezember" | replace:"October","Oktober" }}</h3><!--p>{{vortraege.size}} Vorträge</p--></div>
+        <div><h3 class="is-inverse talk__headline talk__headline--active" id="{{termin_abschlussvortrag}}">{{ termin_abschlussvortrag | date: '%d. %B %Y' | replace:"January","Januar" | replace:"February","Februar" | replace:"March","März" | replace:"May","Mai" | replace:"June","Juni" | replace:"July","Juli" | replace:"December","Dezember" | replace:"October","Oktober" }}</h3><p>{{vortraege.size}} Vorträge</p></div>
         <table class="timetable-talks">
           <tbody>
             {% for vortrag in vortraege %}
@@ -75,10 +74,20 @@ <h2>Checkliste für die Abschlusspräsentationen</h2>
               </li>
               <li>Sie haben mindestens vier Abschlussvorträge von ihren Kommilitonen und Komilitoninnen gehört.</li>
               <li>Sie haben alle Artefakte aus den Workshops im Ilias hochgeladen</li>
-              <li>Zur Ihrem Abschlussvotrag haben Sie ein Markdownfile erstellt. Dieses muss folgende Punkte enthalten:<br>
-                alle vorgegebenen Metadaten, ein Abstract und zwei Vorschläge zu Themen, die an Ihre Arbeit anknüpfen könnten<br>
-                Mit dem Markdownfile haben Sie ein Pull Request auf das Veranstaltungs Repository erzeugt. 
+              <li>Bitte prüfen Sie sorgsam, ob Sie ausreichend Rechte haben das Teaserbild in ihrem Abstract zu verwerden.</li>
+
+              <li>Zur Ihrem Abschlussvotrag haben Sie ein Markdownfile erstellt, welches foglgende Punkte enthalten muss.
+                <ul>
+                  <li>die vorgegebenen Metadaten<br>
+                  Bezüglich des Teaserbildes muss die Quelle oder Lizenz angegeben werden. Wenn Sie selbst Autor des Bilder sind, fügen Sie hier einen <code>-</code> ein.</li>
+                  <li>ein Abstract zu ihrem Projekt</li>
+                  <li>zwei Vorschläge zu Themen, die an Ihre Arbeit anknüpfen könnten</li>
+                </ul>
+              </li>
+              <li>
+                Mit dem Markdownfile haben Sie <strong>spätestens eine Woche vor Ihrer Präsentation</strong> ein Pull Request auf das Veranstaltungs Repository erzeugt. 
                 Wie das funktioniert, wird <a href="/mi-bachelor-praxisprojektseminar/abschlussvortraege/#tutorial">in diesem Screenmovie erklärt</a>.</li>
+              </li>
               <li>Das Markdownfile wurde von einem der Mentoren gemerged und ihr Thema ist 
                 auf der <a href="/mi-bachelor-praxisprojektseminar/abschlussvortraege/">Übersichtsseite 
                   mit den Abschlussvorträgen</a> sichtbar.</li>

mi-lib/_sass/_variables.scss

@@ -9,6 +9,7 @@ $mi-lila: #9313ce;
 $mi-black: #231f20;
 $mi-grau: #aaaaaa;
 $mi-bg: #efefef;
+$white: #fff;
 $family-primary: "PT Sans";
 $primary: $mi-pink;
 $info: $mi-blau;
@@ -24,4 +25,6 @@ $size-4: $bfs;
 $dotted-line: dotted 1px #000;
 $modal-card-head-background-color: #000;
 $modal-card-body-background-color: #000;
+$header-link-color: $mi-grau;
+$header-link-color-hover: $white;
 //$modal-content-width: 80vw;

mi-lib/assets/styles/mi-jekyll.scss

@@ -907,6 +907,13 @@ h3.is-inverse{
   }
 }
 
+.hero.is-info .bildrechte a:not(.button) {
+  color: $header-link-color;
+  &:hover {
+    color: $header-link-color-hover
+  }
+}
+
 
 /* Card
 ############################################################################ */