fix klausur pdf backgrounds with _backgroundColor directive
- remove !important from klausur css gradient (allows directive override) - add _backgroundColor directive to all klausur slides for pdf - web: shows css gradient stripes - pdf: shows solid color background
This commit is contained in:
@@ -55,13 +55,7 @@ section.klausur {
|
|||||||
#e3f2fd 40px,
|
#e3f2fd 40px,
|
||||||
#fff 40px,
|
#fff 40px,
|
||||||
#fff 80px
|
#fff 80px
|
||||||
) !important;
|
);
|
||||||
}
|
|
||||||
@media print {
|
|
||||||
section.klausur {
|
|
||||||
background: url('./assets/klausur-pattern.svg') !important;
|
|
||||||
background-size: cover !important;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
section.aufgabe {
|
section.aufgabe {
|
||||||
background: #e3f2fd !important;
|
background: #e3f2fd !important;
|
||||||
|
|||||||
@@ -55,13 +55,7 @@ section.klausur {
|
|||||||
#e3f2fd 40px,
|
#e3f2fd 40px,
|
||||||
#fff 40px,
|
#fff 40px,
|
||||||
#fff 80px
|
#fff 80px
|
||||||
) !important;
|
);
|
||||||
}
|
|
||||||
@media print {
|
|
||||||
section.klausur {
|
|
||||||
background: url('./assets/klausur-pattern.svg') !important;
|
|
||||||
background-size: cover !important;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
section.aufgabe {
|
section.aufgabe {
|
||||||
background: #e3f2fd !important;
|
background: #e3f2fd !important;
|
||||||
@@ -249,6 +243,7 @@ Eselsbrücke: 1 Byte = 1 Buchstabe/Symbol (in ASCII/UTF-8 für einfache Zeichen)
|
|||||||
<!-- _class: klausur -->
|
<!-- _class: klausur -->
|
||||||
<!-- _header: '' -->
|
<!-- _header: '' -->
|
||||||
<!-- _footer: '' -->
|
<!-- _footer: '' -->
|
||||||
|
<!-- _backgroundColor: #e3f2fd -->
|
||||||
|
|
||||||
# Dateneinheiten
|
# Dateneinheiten
|
||||||
|
|
||||||
@@ -272,6 +267,7 @@ Windows zeigt oft binär, sagt aber "KB" → Verwirrung!
|
|||||||
<!-- _class: klausur -->
|
<!-- _class: klausur -->
|
||||||
<!-- _header: '' -->
|
<!-- _header: '' -->
|
||||||
<!-- _footer: '' -->
|
<!-- _footer: '' -->
|
||||||
|
<!-- _backgroundColor: #e3f2fd -->
|
||||||
|
|
||||||
# Dateneinheiten (Fortsetzung)
|
# Dateneinheiten (Fortsetzung)
|
||||||
|
|
||||||
@@ -320,6 +316,7 @@ Digital explodierte: IoT, Social Media, Cloud, Video
|
|||||||
<!-- _class: klausur -->
|
<!-- _class: klausur -->
|
||||||
<!-- _header: '' -->
|
<!-- _header: '' -->
|
||||||
<!-- _footer: '' -->
|
<!-- _footer: '' -->
|
||||||
|
<!-- _backgroundColor: #e3f2fd -->
|
||||||
|
|
||||||
# Der digitale Wendepunkt
|
# Der digitale Wendepunkt
|
||||||
|
|
||||||
@@ -821,6 +818,7 @@ Visueller Kontrast: Analog vs. Digital
|
|||||||
<!-- _class: klausur -->
|
<!-- _class: klausur -->
|
||||||
<!-- _header: '' -->
|
<!-- _header: '' -->
|
||||||
<!-- _footer: '' -->
|
<!-- _footer: '' -->
|
||||||
|
<!-- _backgroundColor: #e3f2fd -->
|
||||||
|
|
||||||
# Analoge Medien
|
# Analoge Medien
|
||||||
### Distribution: physisch (Kauf, Verleih, Kopie)
|
### Distribution: physisch (Kauf, Verleih, Kopie)
|
||||||
@@ -887,6 +885,7 @@ Paradox: Gerade die Perfektion wurde zum "Problem"
|
|||||||
<!-- _class: klausur -->
|
<!-- _class: klausur -->
|
||||||
<!-- _header: '' -->
|
<!-- _header: '' -->
|
||||||
<!-- _footer: '' -->
|
<!-- _footer: '' -->
|
||||||
|
<!-- _backgroundColor: #e3f2fd -->
|
||||||
|
|
||||||
# Digitale Medien
|
# Digitale Medien
|
||||||
### Distribution: Datenträger (CD, USB), Download, Streaming, P2P
|
### Distribution: Datenträger (CD, USB), Download, Streaming, P2P
|
||||||
@@ -905,6 +904,7 @@ Paradox: Gerade die Perfektion wurde zum "Problem"
|
|||||||
<!-- _class: klausur -->
|
<!-- _class: klausur -->
|
||||||
<!-- _header: '' -->
|
<!-- _header: '' -->
|
||||||
<!-- _footer: '' -->
|
<!-- _footer: '' -->
|
||||||
|
<!-- _backgroundColor: #e3f2fd -->
|
||||||
|
|
||||||
# Digitale Speichermedien
|
# Digitale Speichermedien
|
||||||
|
|
||||||
@@ -1286,6 +1286,7 @@ Visualisierung der beiden Philosophien
|
|||||||
<!-- _class: klausur -->
|
<!-- _class: klausur -->
|
||||||
<!-- _header: '' -->
|
<!-- _header: '' -->
|
||||||
<!-- _footer: '' -->
|
<!-- _footer: '' -->
|
||||||
|
<!-- _backgroundColor: #e3f2fd -->
|
||||||
|
|
||||||
# Verlustfrei vs. Verlustbehaftet
|
# Verlustfrei vs. Verlustbehaftet
|
||||||
|
|
||||||
|
|||||||
@@ -55,13 +55,7 @@ section.klausur {
|
|||||||
#e3f2fd 40px,
|
#e3f2fd 40px,
|
||||||
#fff 40px,
|
#fff 40px,
|
||||||
#fff 80px
|
#fff 80px
|
||||||
) !important;
|
);
|
||||||
}
|
|
||||||
@media print {
|
|
||||||
section.klausur {
|
|
||||||
background: url('./assets/klausur-pattern.svg') !important;
|
|
||||||
background-size: cover !important;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
section.aufgabe {
|
section.aufgabe {
|
||||||
background: #e3f2fd !important;
|
background: #e3f2fd !important;
|
||||||
@@ -141,6 +135,7 @@ Smartphone-Speicher wäre schnell voll ohne Kompression
|
|||||||
<!-- _class: klausur -->
|
<!-- _class: klausur -->
|
||||||
<!-- _header: '' -->
|
<!-- _header: '' -->
|
||||||
<!-- _footer: '' -->
|
<!-- _footer: '' -->
|
||||||
|
<!-- _backgroundColor: #e3f2fd -->
|
||||||
|
|
||||||
# Rastergrafiken (Bitmaps)
|
# Rastergrafiken (Bitmaps)
|
||||||
|
|
||||||
@@ -180,6 +175,7 @@ PRÜFUNGSRELEVANT: Speicherberechnung, Farbtiefe-Tabelle, warum Vergrößern pro
|
|||||||
<!-- _class: klausur -->
|
<!-- _class: klausur -->
|
||||||
<!-- _header: '' -->
|
<!-- _header: '' -->
|
||||||
<!-- _footer: '' -->
|
<!-- _footer: '' -->
|
||||||
|
<!-- _backgroundColor: #e3f2fd -->
|
||||||
|
|
||||||
# Vektorgrafiken
|
# Vektorgrafiken
|
||||||
|
|
||||||
@@ -220,6 +216,7 @@ PRÜFUNGSRELEVANT: Warum Vektoren skalierbar, SVG-Grundsyntax, Rendering-Pipelin
|
|||||||
<!-- _class: klausur -->
|
<!-- _class: klausur -->
|
||||||
<!-- _header: '' -->
|
<!-- _header: '' -->
|
||||||
<!-- _footer: '' -->
|
<!-- _footer: '' -->
|
||||||
|
<!-- _backgroundColor: #e3f2fd -->
|
||||||
|
|
||||||
# Raster vs. Vektor: Entscheidungskriterien
|
# Raster vs. Vektor: Entscheidungskriterien
|
||||||
|
|
||||||
@@ -716,6 +713,7 @@ Quelle: https://www.canon.com.hk/cpx/en/technical/va_EOS_Movie_Compression_Optio
|
|||||||
<!-- _class: klausur -->
|
<!-- _class: klausur -->
|
||||||
<!-- _header: '' -->
|
<!-- _header: '' -->
|
||||||
<!-- _footer: '' -->
|
<!-- _footer: '' -->
|
||||||
|
<!-- _backgroundColor: #e3f2fd -->
|
||||||
|
|
||||||
# H.264 / AVC Codec (2003)
|
# H.264 / AVC Codec (2003)
|
||||||
### Der bisherige Platzhirsch
|
### Der bisherige Platzhirsch
|
||||||
@@ -838,6 +836,7 @@ Alliance for Open Media
|
|||||||
<!-- _class: klausur -->
|
<!-- _class: klausur -->
|
||||||
<!-- _header: '' -->
|
<!-- _header: '' -->
|
||||||
<!-- _footer: '' -->
|
<!-- _footer: '' -->
|
||||||
|
<!-- _backgroundColor: #e3f2fd -->
|
||||||
|
|
||||||
# AV1: Die Open-Source-Revolution
|
# AV1: Die Open-Source-Revolution
|
||||||
|
|
||||||
|
|||||||
@@ -55,13 +55,7 @@ section.klausur {
|
|||||||
#e3f2fd 40px,
|
#e3f2fd 40px,
|
||||||
#fff 40px,
|
#fff 40px,
|
||||||
#fff 80px
|
#fff 80px
|
||||||
) !important;
|
);
|
||||||
}
|
|
||||||
@media print {
|
|
||||||
section.klausur {
|
|
||||||
background: url('./assets/klausur-pattern.svg') !important;
|
|
||||||
background-size: cover !important;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
section.aufgabe {
|
section.aufgabe {
|
||||||
background: #e3f2fd !important;
|
background: #e3f2fd !important;
|
||||||
|
|||||||
@@ -55,13 +55,7 @@ section.klausur {
|
|||||||
#e3f2fd 40px,
|
#e3f2fd 40px,
|
||||||
#fff 40px,
|
#fff 40px,
|
||||||
#fff 80px
|
#fff 80px
|
||||||
) !important;
|
);
|
||||||
}
|
|
||||||
@media print {
|
|
||||||
section.klausur {
|
|
||||||
background: url('./assets/klausur-pattern.svg') !important;
|
|
||||||
background-size: cover !important;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
section.aufgabe {
|
section.aufgabe {
|
||||||
background: #e3f2fd !important;
|
background: #e3f2fd !important;
|
||||||
|
|||||||
@@ -55,13 +55,7 @@ section.klausur {
|
|||||||
#e3f2fd 40px,
|
#e3f2fd 40px,
|
||||||
#fff 40px,
|
#fff 40px,
|
||||||
#fff 80px
|
#fff 80px
|
||||||
) !important;
|
);
|
||||||
}
|
|
||||||
@media print {
|
|
||||||
section.klausur {
|
|
||||||
background: url('./assets/klausur-pattern.svg') !important;
|
|
||||||
background-size: cover !important;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
section.aufgabe {
|
section.aufgabe {
|
||||||
background: #e3f2fd !important;
|
background: #e3f2fd !important;
|
||||||
|
|||||||
@@ -55,13 +55,7 @@ section.klausur {
|
|||||||
#fce4ec 40px,
|
#fce4ec 40px,
|
||||||
#fff 40px,
|
#fff 40px,
|
||||||
#fff 80px
|
#fff 80px
|
||||||
) !important;
|
);
|
||||||
}
|
|
||||||
@media print {
|
|
||||||
section.klausur {
|
|
||||||
background: url('./assets/klausur-pattern.svg') !important;
|
|
||||||
background-size: cover !important;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
section.aufgabe {
|
section.aufgabe {
|
||||||
background: #fce4ec !important;
|
background: #fce4ec !important;
|
||||||
@@ -623,6 +617,7 @@ Euer Laptop, euer Handy, der Server dieser Präsentation
|
|||||||
<!-- _class: klausur -->
|
<!-- _class: klausur -->
|
||||||
<!-- _header: '' -->
|
<!-- _header: '' -->
|
||||||
<!-- _footer: '' -->
|
<!-- _footer: '' -->
|
||||||
|
<!-- _backgroundColor: #fce4ec -->
|
||||||
|
|
||||||
# Die 5 Komponenten
|
# Die 5 Komponenten
|
||||||
|
|
||||||
@@ -655,6 +650,7 @@ PRÜFUNGSRELEVANT: 5 Komponenten benennen und erklären können, Stored Program
|
|||||||
<!-- _class: klausur -->
|
<!-- _class: klausur -->
|
||||||
<!-- _header: '' -->
|
<!-- _header: '' -->
|
||||||
<!-- _footer: '' -->
|
<!-- _footer: '' -->
|
||||||
|
<!-- _backgroundColor: #fce4ec -->
|
||||||
|
|
||||||
# Von-Neumann-Architektur: Bedeutung
|
# Von-Neumann-Architektur: Bedeutung
|
||||||
|
|
||||||
@@ -1077,6 +1073,7 @@ Formattierungssprache
|
|||||||
<!-- _class: klausur -->
|
<!-- _class: klausur -->
|
||||||
<!-- _header: '' -->
|
<!-- _header: '' -->
|
||||||
<!-- _footer: '' -->
|
<!-- _footer: '' -->
|
||||||
|
<!-- _backgroundColor: #fce4ec -->
|
||||||
|
|
||||||
# HTML Metadaten
|
# HTML Metadaten
|
||||||
|
|
||||||
@@ -1304,6 +1301,7 @@ https://developer.mozilla.org/de/docs/Web/HTML/Reference/Elements/dialog
|
|||||||
<!-- _class: klausur -->
|
<!-- _class: klausur -->
|
||||||
<!-- _header: '' -->
|
<!-- _header: '' -->
|
||||||
<!-- _footer: '' -->
|
<!-- _footer: '' -->
|
||||||
|
<!-- _backgroundColor: #fce4ec -->
|
||||||
|
|
||||||
# Wie nutzen Menschen das Web?
|
# Wie nutzen Menschen das Web?
|
||||||
|
|
||||||
@@ -1340,6 +1338,7 @@ PRÜFUNGSRELEVANT: Arten von Einschränkungen, Screenreader-Beispiele, WCAG
|
|||||||
<!-- _class: klausur -->
|
<!-- _class: klausur -->
|
||||||
<!-- _header: '' -->
|
<!-- _header: '' -->
|
||||||
<!-- _footer: '' -->
|
<!-- _footer: '' -->
|
||||||
|
<!-- _backgroundColor: #fce4ec -->
|
||||||
|
|
||||||
# Warum "Barrierefreiheit"?
|
# Warum "Barrierefreiheit"?
|
||||||
|
|
||||||
@@ -1503,6 +1502,7 @@ div-Button braucht JavaScript für Enter/Space
|
|||||||
<!-- _class: klausur -->
|
<!-- _class: klausur -->
|
||||||
<!-- _header: '' -->
|
<!-- _header: '' -->
|
||||||
<!-- _footer: '' -->
|
<!-- _footer: '' -->
|
||||||
|
<!-- _backgroundColor: #fce4ec -->
|
||||||
|
|
||||||
# Barrieren im Netz vermeiden (a11y)
|
# Barrieren im Netz vermeiden (a11y)
|
||||||
|
|
||||||
|
|||||||
@@ -55,13 +55,7 @@ section.klausur {
|
|||||||
#fce4ec 40px,
|
#fce4ec 40px,
|
||||||
#fff 40px,
|
#fff 40px,
|
||||||
#fff 80px
|
#fff 80px
|
||||||
) !important;
|
);
|
||||||
}
|
|
||||||
@media print {
|
|
||||||
section.klausur {
|
|
||||||
background: url('./assets/klausur-pattern.svg') !important;
|
|
||||||
background-size: cover !important;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
section.aufgabe {
|
section.aufgabe {
|
||||||
background: #fce4ec !important;
|
background: #fce4ec !important;
|
||||||
@@ -372,6 +366,7 @@ Query-String für Parameter
|
|||||||
<!-- _class: klausur -->
|
<!-- _class: klausur -->
|
||||||
<!-- _header: '' -->
|
<!-- _header: '' -->
|
||||||
<!-- _footer: '' -->
|
<!-- _footer: '' -->
|
||||||
|
<!-- _backgroundColor: #fce4ec -->
|
||||||
|
|
||||||
# Das OSI-Modell: Die Theorie
|
# Das OSI-Modell: Die Theorie
|
||||||
|
|
||||||
@@ -408,6 +403,7 @@ PRÜFUNGSRELEVANT: 7 Schichten mit Beispielen, Unterschied OSI vs. TCP/IP
|
|||||||
<!-- _class: klausur -->
|
<!-- _class: klausur -->
|
||||||
<!-- _header: '' -->
|
<!-- _header: '' -->
|
||||||
<!-- _footer: '' -->
|
<!-- _footer: '' -->
|
||||||
|
<!-- _backgroundColor: #fce4ec -->
|
||||||
|
|
||||||
# TCP/IP: Die Praxis
|
# TCP/IP: Die Praxis
|
||||||
|
|
||||||
@@ -645,6 +641,7 @@ Heute: Fast nur noch HTTPS
|
|||||||
<!-- _class: klausur -->
|
<!-- _class: klausur -->
|
||||||
<!-- _header: '' -->
|
<!-- _header: '' -->
|
||||||
<!-- _footer: '' -->
|
<!-- _footer: '' -->
|
||||||
|
<!-- _backgroundColor: #fce4ec -->
|
||||||
|
|
||||||
# Schicht 7: Anwendung
|
# Schicht 7: Anwendung
|
||||||
|
|
||||||
@@ -703,6 +700,7 @@ Von oben nach unten: 7 bis 1
|
|||||||
<!-- _class: lead klausur -->
|
<!-- _class: lead klausur -->
|
||||||
<!-- _header: '' -->
|
<!-- _header: '' -->
|
||||||
<!-- _footer: '' -->
|
<!-- _footer: '' -->
|
||||||
|
<!-- _backgroundColor: #fce4ec -->
|
||||||
|
|
||||||
# HTTP/S im Detail
|
# HTTP/S im Detail
|
||||||
|
|
||||||
@@ -711,6 +709,7 @@ Von oben nach unten: 7 bis 1
|
|||||||
<!-- _class: klausur -->
|
<!-- _class: klausur -->
|
||||||
<!-- _header: '' -->
|
<!-- _header: '' -->
|
||||||
<!-- _footer: '' -->
|
<!-- _footer: '' -->
|
||||||
|
<!-- _backgroundColor: #fce4ec -->
|
||||||
|
|
||||||
# HTTP-Request
|
# HTTP-Request
|
||||||
|
|
||||||
@@ -740,6 +739,7 @@ Body kommt nach leerem Zeile (bei POST)
|
|||||||
<!-- _class: klausur -->
|
<!-- _class: klausur -->
|
||||||
<!-- _header: '' -->
|
<!-- _header: '' -->
|
||||||
<!-- _footer: '' -->
|
<!-- _footer: '' -->
|
||||||
|
<!-- _backgroundColor: #fce4ec -->
|
||||||
|
|
||||||
# HTTP-Response
|
# HTTP-Response
|
||||||
|
|
||||||
@@ -767,6 +767,7 @@ Content-Length: 1234
|
|||||||
<!-- _footer: '' -->
|
<!-- _footer: '' -->
|
||||||
<!-- _backgroundColor: #fce4ec -->
|
<!-- _backgroundColor: #fce4ec -->
|
||||||
|
|
||||||
|
# HTTP-Methoden
|
||||||
|
|
||||||
| Methode | CRUD | Zweck | Beispiel |
|
| Methode | CRUD | Zweck | Beispiel |
|
||||||
|---------|------|-------|----------|
|
|---------|------|-------|----------|
|
||||||
@@ -1110,6 +1111,7 @@ vw/vh = Viewport (sichtbarer Bereich)
|
|||||||
<!-- _footer: '' -->
|
<!-- _footer: '' -->
|
||||||
<!-- _backgroundColor: #fce4ec -->
|
<!-- _backgroundColor: #fce4ec -->
|
||||||
|
|
||||||
|
# Pseudo-Klassen
|
||||||
|
|
||||||
```css
|
```css
|
||||||
/* Zustände */
|
/* Zustände */
|
||||||
@@ -1133,6 +1135,7 @@ Pseudo-Klassen = Zustände, kein JavaScript nötig!
|
|||||||
<!-- _footer: '' -->
|
<!-- _footer: '' -->
|
||||||
<!-- _backgroundColor: #fce4ec -->
|
<!-- _backgroundColor: #fce4ec -->
|
||||||
|
|
||||||
|
# Pseudo-Elemente
|
||||||
|
|
||||||
```css
|
```css
|
||||||
.required::before {
|
.required::before {
|
||||||
@@ -1157,6 +1160,7 @@ content nur bei ::before/::after
|
|||||||
<!-- _footer: '' -->
|
<!-- _footer: '' -->
|
||||||
<!-- _backgroundColor: #fce4ec -->
|
<!-- _backgroundColor: #fce4ec -->
|
||||||
|
|
||||||
|
# Responsive Design
|
||||||
|
|
||||||
**Media Queries:** CSS je nach Bildschirmgröße
|
**Media Queries:** CSS je nach Bildschirmgröße
|
||||||
|
|
||||||
|
|||||||
@@ -55,13 +55,7 @@ section.klausur {
|
|||||||
#fce4ec 40px,
|
#fce4ec 40px,
|
||||||
#fff 40px,
|
#fff 40px,
|
||||||
#fff 80px
|
#fff 80px
|
||||||
) !important;
|
);
|
||||||
}
|
|
||||||
@media print {
|
|
||||||
section.klausur {
|
|
||||||
background: url('./assets/klausur-pattern.svg') !important;
|
|
||||||
background-size: cover !important;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
section.aufgabe {
|
section.aufgabe {
|
||||||
background: #fce4ec !important;
|
background: #fce4ec !important;
|
||||||
|
|||||||
@@ -1,9 +1,4 @@
|
|||||||
<svg xmlns="http://www.w3.org/2000/svg" width="80" height="80">
|
<svg xmlns="http://www.w3.org/2000/svg" width="80" height="80">
|
||||||
<defs>
|
<rect width="80" height="80" fill="#fce4ec"/>
|
||||||
<pattern id="diagonalStripes" patternUnits="userSpaceOnUse" width="80" height="80" patternTransform="rotate(135)">
|
<path d="M-20,20 l40,-40 M0,80 l80,-80 M60,100 l40,-40" stroke="#ffffff" stroke-width="40"/>
|
||||||
<rect width="40" height="80" fill="#fce4ec"/>
|
|
||||||
<rect x="40" width="40" height="80" fill="#ffffff"/>
|
|
||||||
</pattern>
|
|
||||||
</defs>
|
|
||||||
<rect width="100%" height="100%" fill="url(#diagonalStripes)"/>
|
|
||||||
</svg>
|
</svg>
|
||||||
|
|||||||
|
Before Width: | Height: | Size: 401 B After Width: | Height: | Size: 214 B |
Reference in New Issue
Block a user