https://dsignweek.servus.at/api.php?action=feedcontributions&feedformat=atom&user=Ivans
dsignwiki - User contributions [en]
2026-04-20T04:10:35Z
User contributions
MediaWiki 1.44.2
https://dsignweek.servus.at/index.php?title=For_who(m)_is_the_making%3F&diff=1744
For who(m) is the making?
2025-11-24T11:18:43Z
<p>Ivans: </p>
<hr />
<div><languages/><br />
<translate><br />
<!--T:11--><br />
<div class="banner"><br />
<div class="banner-icon"><br />
[[File:Lettering.png|class=noviewer|link=]]<br />
</div><br />
<div class="dw-headline mw-headline"><br />
<strong>24th – 30th November 2025</strong> Linz (AT)<br /><br />
@ [https://www.instagram.com/die.schiassn Kulturverein zur Schießhalle],<br />
[https://stwst.at Stadtwerkstatt],<br />
[https://www.ufg.at University of Arts Linz]<br />
</div><br />
</div><br />
<br />
<div class="dw-grid"><br />
<br />
<!--T:13--><br />
<!-- LEFT COLUMN --><br />
<div class="dw-col"><br />
<br />
<!--T:14--><br />
<!-- 1. For who(m) is the making? --><br />
<div class="dw-card"><br />
<div class="dw-row"><br />
<div class="dw-icon">[[File:Artboard_4.png|160px|class=noviewer|link=]]</div><br />
<div><br />
<span class="dw-headline mw-headline">For who(m) is the making?</span><br />
<div class="dw-body"><br />
<p>The 2025 edition of the d*sign week is organized around the question “[[For who(m) is the making?]]”, which sets attention on who is involved in the design process and how design connects needs and everyday life. Understanding for whom we design, and the context and practice of the designer, has strong influence on outcomes.</p><br />
<br />
<!--T:15--><br />
<p>Even materials and tools play a role. As a discursive practice, design interacts with aesthetic and artistic intentions. If “contemporary design” is often experienced as excluding and exclusive, how can we make it more accessible? How do we balance the need for accessibility with the ever-evolving language of visual communication?</p><br />
</div><br />
</div><br />
</div><br />
</div><br />
<br />
<!--T:16--><br />
<!-- 2. Programme --><br />
<div class="dw-card" onclick="window.location.href='https://dsignweek.servus.at/index.php?title=Programme';" style="cursor: pointer;"><br />
<div class="dw-row"><br />
<div class="dw-icon">[[File:Artboard_3.png|160px|class=noviewer|link=]]</div><br />
<div><br />
<span class="dw-headline mw-headline">[https://dsignweek.servus.at/index.php?title=Programme Programme] und [https://dsignweek.servus.at/index.php?title=Visit_d*sign_week Participants]</span><br />
<div class="dw-body"><br />
<p>Structured as a week-long series of [[:Category:Workshop | workshops]], [[:Category:Talk | talks]] and [[:Category:Performance | Performances]], the d*sign week investigates how access, participation and inclusion can be values that guide independent design practices. How can they become a common goal in non-commercial and socially-oriented projects?</p><br />
<br />
<!--T:17--><br />
<p>The event wants to be a space for exchange for designers, coders and artists. The [[Programme | programm]] opens itself up and aims to be accessible for a broader audience—through note-taking, [[Inter*Printer | editing]] and translations across languages and contexts. The exploration of approaches and tools is the ground for collective learning, reflection-in-action and knowledge exchange during the festival.</p><br />
</div><br />
</div><br />
</div><br />
</div><br />
<br />
<!--T:18--><br />
</div><br />
<br />
<!--T:19--><br />
<!-- RIGHT COLUMN --><br />
<div class="dw-col"><br />
<br />
<!--T:20--><br />
<!-- 3. d*sign week 2025 --><br />
<div class="dw-card"><br />
<div class="dw-row"><br />
<div class="dw-icon">[[File:Artboard_1.png|160px|class=noviewer|link=]]</div><br />
<div><br />
<span class="dw-headline mw-headline">d*sign week 2025</span><br />
<div class="dw-body"><br />
<p>The d*sign week is a festival for experimental and independent design practices. It is organized by the initiatives [[Potato Publishing]] and [https://dsignweek.servus.at/index.php?title=Partners_and_supporters servus.at] together with the departments of Visual Communication and Timebased Media of the [https://dsignweek.servus.at/index.php?title=Partners_and_supporters University of Arts Linz] organisiert.</p><br />
<p>Living in times that require novel forms of being together, the d*sign week proposes asking ourselves “For who(m) is the making?” as a method to radically open the design flow. This creates spaces for new perspectives, alliances and networks of solidarity.</p><br />
</div><br />
</div><br />
</div><br />
</div><br />
<br />
<!--T:21--><br />
<!-- 4. More about d*sign week --><br />
<div class="dw-card"><br />
<div class="dw-row"><br />
<div class="dw-icon">[[File:Artboard_2.png|160px|class=noviewer|link=]]</div><br />
<div><br />
<span class="dw-headline mw-headline">More about the d*sign week</span><br />
<div class="dw-body"><br />
<p><b>Partners:</b> RadioFRO, Stadtwerkstatt STWST.<br /><br />
<b>Participants:</b> [https://dsignweek.servus.at/index.php?title=Festival_contributors Contributors of the Festival] <br /><br />
<b>Programm:</b> [https://dsignweek.servus.at/index.php?title=Programme 2025 Programm Overview]</p><br />
<p><b>Previous Editions:</b><br /><br />
[https://dsignweek.servus.at/2023 https://dsignweek.servus.at/2023]<br /><br />
[https://dsignweek.servus.at/2021 https://dsignweek.servus.at/2021]</p><br />
</div><br />
</div><br />
</div><br />
</div><br />
<br />
<!--T:22--><br />
<!-- 5. Support us! --><br />
<div class="dw-card"><br />
<div class="dw-row"><br />
<div class="dw-icon">[[File:DwLogo.png|160px|class=noviewer|link=]]</div><br />
<div><br />
<span class="dw-headline mw-headline">Support us!</span><br />
<div class="dw-body"><br />
<p><b>d*sign week supporter Tickets:</b><br />[https://kupfticket.com/en/events/dsign-week-2025 KUPFticket.com]</p><br />
</div><br />
</div><br />
</div><br />
</div><br />
<br />
<!--T:23--><br />
</div><br />
<br />
<!--T:24--><br />
</div><br />
<br />
<br />
</translate></div>
Ivans
https://dsignweek.servus.at/index.php?title=For_who(m)_is_the_making%3F&diff=1743
For who(m) is the making?
2025-11-24T11:18:17Z
<p>Ivans: </p>
<hr />
<div><languages/><br />
<br />
<div class="banner"><br />
<div class="banner-icon"><br />
[[File:Lettering.png|class=noviewer|link=]]<br />
</div><br />
<div class="dw-headline mw-headline"><br />
<translate><br />
<!--T:11--><br />
<strong>24th – 30th November 2025</strong> Linz (AT)<br /><br />
@ [https://www.instagram.com/die.schiassn Kulturverein zur Schießhalle],<br />
[https://stwst.at Stadtwerkstatt],<br />
[https://www.ufg.at University of Arts Linz]<br />
</translate><br />
</div><br />
</div><br />
<br />
<div class="dw-grid"><br />
<br />
<!-- LEFT COLUMN --><br />
<div class="dw-col"><br />
<br />
<!-- 1. For who(m) is the making? --><br />
<div class="dw-card"><br />
<div class="dw-row"><br />
<div class="dw-icon"><br />
[[File:Artboard_4.png|160px|class=noviewer|link=]]<br />
</div><br />
<div class="dw-content"><br />
<translate><br />
<!--T:14--><br />
<span class="dw-headline mw-headline">For who(m) is the making?</span><br />
<div class="dw-body"><br />
<p>The 2025 edition of the d*sign week is organized around the question “[[For who(m) is the making?]]”, which sets attention on who is involved in the design process and how design connects needs and everyday life. Understanding for whom we design, and the context and practice of the designer, has strong influence on outcomes.</p><br />
<br />
<!--T:15--><br />
<p>Even materials and tools play a role. As a discursive practice, design interacts with aesthetic and artistic intentions. If “contemporary design” is often experienced as excluding and exclusive, how can we make it more accessible? How do we balance the need for accessibility with the ever-evolving language of visual communication?</p><br />
</div><br />
</translate><br />
</div><br />
</div><br />
</div><br />
<br />
<!-- 2. Programme --><br />
<div class="dw-card" onclick="window.location.href='https://dsignweek.servus.at/index.php?title=Programme';" style="cursor: pointer;"><br />
<div class="dw-row"><br />
<div class="dw-icon"><br />
[[File:Artboard_3.png|160px|class=noviewer|link=]]<br />
</div><br />
<div class="dw-content"><br />
<translate><br />
<!--T:16--><br />
<span class="dw-headline mw-headline">[https://dsignweek.servus.at/index.php?title=Programme Programme] und [https://dsignweek.servus.at/index.php?title=Visit_d*sign_week Participants]</span><br />
<div class="dw-body"><br />
<p>Structured as a week-long series of [[:Category:Workshop | workshops]], [[:Category:Talk | talks]] and [[:Category:Performance | Performances]], the d*sign week investigates how access, participation and inclusion can be values that guide independent design practices. How can they become a common goal in non-commercial and socially-oriented projects?</p><br />
<br />
<!--T:17--><br />
<p>The event wants to be a space for exchange for designers, coders and artists. The [[Programme | programm]] opens itself up and aims to be accessible for a broader audience—through note-taking, [[Inter*Printer | editing]] and translations across languages and contexts. The exploration of approaches and tools is the ground for collective learning, reflection-in-action and knowledge exchange during the festival.</p><br />
</div><br />
</translate><br />
</div><br />
</div><br />
</div><br />
<br />
</div> <!-- end LEFT COLUMN --><br />
<br />
<!-- RIGHT COLUMN --><br />
<div class="dw-col"><br />
<br />
<!-- 3. d*sign week 2025 --><br />
<div class="dw-card"><br />
<div class="dw-row"><br />
<div class="dw-icon"><br />
[[File:Artboard_1.png|160px|class=noviewer|link=]]<br />
</div><br />
<div class="dw-content"><br />
<translate><br />
<!--T:20--><br />
<span class="dw-headline mw-headline">d*sign week 2025</span><br />
<div class="dw-body"><br />
<p>The d*sign week is a festival for experimental and independent design practices. It is organized by the initiatives [[Potato Publishing]] and [https://dsignweek.servus.at/index.php?title=Partners_and_supporters servus.at] together with the departments of Visual Communication and Timebased Media of the [https://dsignweek.servus.at/index.php?title=Partners_and_supporters University of Arts Linz] organisiert.</p><br />
<p>Living in times that require novel forms of being together, the d*sign week proposes asking ourselves “For who(m) is the making?” as a method to radically open the design flow. This creates spaces for new perspectives, alliances and networks of solidarity.</p><br />
</div><br />
</translate><br />
</div><br />
</div><br />
</div><br />
<br />
<!-- 4. More about d*sign week --><br />
<div class="dw-card"><br />
<div class="dw-row"><br />
<div class="dw-icon"><br />
[[File:Artboard_2.png|160px|class=noviewer|link=]]<br />
</div><br />
<div class="dw-content"><br />
<translate><br />
<!--T:21--><br />
<span class="dw-headline mw-headline">More about the d*sign week</span><br />
<div class="dw-body"><br />
<p><b>Partners:</b> RadioFRO, Stadtwerkstatt STWST.<br /><br />
<b>Participants:</b> [https://dsignweek.servus.at/index.php?title=Festival_contributors Contributors of the Festival] <br /><br />
<b>Programm:</b> [https://dsignweek.servus.at/index.php?title=Programme 2025 Programm Overview]</p><br />
<br />
<p><b>Previous Editions:</b><br /><br />
[https://dsignweek.servus.at/2023 https://dsignweek.servus.at/2023]<br /><br />
[https://dsignweek.servus.at/2021 https://dsignweek.servus.at/2021]</p><br />
</div><br />
</translate><br />
</div><br />
</div><br />
</div><br />
<br />
<!-- 5. Support us! --><br />
<div class="dw-card"><br />
<div class="dw-row"><br />
<div class="dw-icon"><br />
[[File:DwLogo.png|160px|class=noviewer|link=]]<br />
</div><br />
<div class="dw-content"><br />
<translate><br />
<!--T:22--><br />
<span class="dw-headline mw-headline">Support us!</span><br />
<div class="dw-body"><br />
<p><b>d*sign week supporter Tickets:</b><br />[https://kupfticket.com/en/events/dsign-week-2025 KUPFticket.com]</p><br />
</div><br />
</translate><br />
</div><br />
</div><br />
</div><br />
<br />
</div> <!-- end RIGHT COLUMN --><br />
<br />
</div> <!-- end .dw-grid --></div>
Ivans
https://dsignweek.servus.at/index.php?title=MediaWiki:Common.css&diff=1742
MediaWiki:Common.css
2025-11-24T11:17:50Z
<p>Ivans: </p>
<hr />
<div>/* CSS placed here will be applied to all skins */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
#footer-info-lastmod {<br />
display: none !important;<br />
}<br />
<br />
/* Vector 2022: align user links (language, username, etc.) to the top */<br />
body.skin-vector-2022 .vector-user-links-main {<br />
display: flex; /* make sure it's flexbox */<br />
align-items: flex-start; /* align children to the top of the div */<br />
}<br />
/* Hide the Translate extension banner ("Translate this page; This page has changes…") */<br />
body.skin-vector-2022 .mw-pt-translate-header {<br />
display: none !important;<br />
}<br />
/* Vector 2022 – hide entire tab/navigation bar (left-navigation) for all users */<br />
.skin-vector-2022 #left-navigation {<br />
display: none !important;<br />
}<br />
/* Vector 2022: right-align items in the page toolbar (Edit / View history / Tools) */<br />
.skin-vector-2022 .vector-page-toolbar-container {<br />
display: flex !important;<br />
justify-content: flex-end !important; /* pushes items to the right */<br />
align-items: center; /* vertical alignment */<br />
}<br />
<br />
/* Remove Vector “switch to old look” link + banner */<br />
.skin-vector-2022 .vector-feature-switch,<br />
.skin-vector-2022 a[href*="mw-prefsection-rendering-skin"],<br />
.skin-vector-2022 a[title*="legacy Vector"],<br />
.skin-vector-2022 a[title*="old look"] {<br />
display: none !important;<br />
}<br />
<br />
.mw-anon.skin-vector-2022 #ca-nstab-main, /* page title tab (Main Page / Article) */<br />
.mw-anon.skin-vector-2022 #ca-talk, /* Talk tab */<br />
.mw-anon.skin-vector-2022 #ca-view, /* "Read" tab */<br />
.mw-anon.skin-vector-2022 #ca-history, /* View history */<br />
.mw-anon.skin-vector-2022 #ca-watch,<br />
.mw-anon.skin-vector-2022 #ca-unwatch,<br />
.mw-anon.skin-vector-2022 #ca-more { /* "Tools" dropdown */<br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* === GLOBAL TYPOGRAPHY === */<br />
<br />
/* Base body text — Liberation Sans */<br />
html,<br />
body,<br />
.mw-body,<br />
.mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 1.2rem; /* base = 16px */<br />
line-height: 1.15; <br />
}<br />
<br />
/* Paragraphs and list text */<br />
p, li, td, th {<br />
font-size: 1.1rem; /* slightly larger than base text */<br />
}<br />
<br />
/* === HEADINGS — Linux Libertine === */<br />
h1, h2, h3, h4, h5, h6,<br />
.firstHeading,<br />
.mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
.mw-body h1, .mw-heading1, .mw-body-content h1, .mw-body-content .mw-heading1 { font-size: 3rem; line-height: 1.15; } <br />
<br />
<br />
<br />
/* === SIDEBAR MENU === */<br />
#mw-panel,<br />
.vector-menu-content,<br />
#p-navigation,<br />
#p-tb,<br />
#p-lang {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem; /* sidebar smaller for contrast */<br />
line-height: 1.4;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
#partner-logos {<br />
display: flex;<br />
justify-content: right;<br />
align-items: right;<br />
flex-wrap: wrap;<br />
gap: 1rem;<br />
margin-top:0.8rem;<br />
<br />
}<br />
<br />
#partner-logos img {<br />
height: 32px;<br />
object-fit: contain; /* keeps aspect ratio, fits within the box */<br />
max-width: 100%; /* prevents overflow */<br />
display: block; /* removes inline gaps below images */<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
.wikitable.custom-table {<br />
width: 100%;<br />
border-collapse: separate;<br />
border-spacing: 0;<br />
border: none;<br />
background-color: #fff;<br />
border-radius: 0.5rem;<br />
overflow: hidden; /* so rounded corners clip correctly */<br />
font-size: 0.95rem;<br />
}<br />
<br />
<br />
<br />
/* Header cells */<br />
.wikitable.custom-table th {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
color: #000;<br />
font-weight: 600;<br />
text-align: left;<br />
padding: 0.75rem 1rem;<br />
border-bottom: 2px solid #d0d9ff;<br />
}<br />
<br />
/* Data cells */<br />
.wikitable.custom-table td {<br />
padding: 0.65rem 1rem;<br />
border-bottom: 1px solid #eee;<br />
}<br />
<br />
/* Zebra striping */<br />
.wikitable.custom-table tr:nth-child(even) td {<br />
background-color: #f9fbff;<br />
}<br />
<br />
/* Hover effect */<br />
.wikitable.custom-table tr:hover td {<br />
background: #FFF;<br />
background: linear-gradient(0deg,rgba(0, 0, 255, 1) 0%, rgba(255, 255, 255, 1) 15%, rgba(255, 255, 255, 1) 85%, rgba(0, 0, 255, 1) 100%);<br />
}<br />
<br />
<br />
/* Rounded corners for first & last rows */<br />
.wikitable.custom-table tr:first-child th:first-child {<br />
border-top-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:first-child th:last-child {<br />
border-top-right-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:first-child {<br />
border-bottom-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:last-child {<br />
border-bottom-right-radius: 0.5rem;<br />
}<br />
<br />
<br />
/* === Mobile Responsive Tables (no HTML change needed) === */<br />
@media (max-width: 768px) {<br />
<br />
/* Allow horizontal scrolling on narrow screens */<br />
.wikitable.custom-table {<br />
display: block;<br />
width: 100%;<br />
overflow-x: auto;<br />
-webkit-overflow-scrolling: touch;<br />
}<br />
<br />
/* Prevent collapsing/squeezing of long cell content */<br />
.wikitable.custom-table tr,<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
white-space: nowrap;<br />
}<br />
<br />
/* Optional: slightly reduce padding for small screens */<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
padding: 0.5rem 0.75rem;<br />
}<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* Hide the automatic Tools and Special pages sections */<br />
#p-tb { <br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* MAIN-PAGE */<br />
<br />
/* === FONTS (yours) === */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
.mw-pt-languages {<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);}<br />
/* === GLOBAL TYPOGRAPHY === */<br />
html, body, .mw-body, .mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem;<br />
line-height: 1.1;<br />
}<br />
p, li, td, th { font-size: 1.1rem; line-height: 1.1; }<br />
h1, h2, h3, h4, h5, h6, .firstHeading, .mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
<br />
/* === d*sign week layout === */<br />
:root {<br />
--dw-border: #cfd8e3;<br />
--dw-card-bg: #f8fbff;<br />
}<br />
<br />
/* top ribbon */<br />
.dw-ribbon {<br />
height: 26px;<br />
background: linear-gradient(#8aa9ff, #ffffff);<br />
border-radius: 6px;<br />
margin: 0 0 14px 0;<br />
}<br />
<br />
<br />
.banner {<br />
display: flex;<br />
align-items: center;<br />
justify-content: space-between;<br />
gap: 1.5rem;<br />
padding: 0rem 1rem 0rem 1rem;<br />
text-align: left; /* centers text within its box */<br />
flex-wrap: wrap; <br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
background-size: 100% 200%;<br />
background-position: top;<br />
transition: background-position 0.4s ease-in-out;<br />
}<br />
.banner:hover {<br />
background-position: bottom;<br />
}<br />
<br />
<br />
.banner-icon img { <br />
width: 20vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 650px; /* prevent it from getting too big */ <br />
min-width: 120px; /* prevent it from getting too small */ <br />
padding-left: 2rem;}<br />
<br />
.dw-subtitle {<br />
font-size: 1.5rem;<br />
line-height: 1;<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle-banner {<br />
font-size: 3rem;<br />
}<br />
.dw-subtitle strong {<br />
<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle a {<br />
color: #0000FF !important; /* link color similar to your example */<br />
text-decoration: none;<br />
}<br />
<br />
.dw-subtitle a:hover {<br />
text-decoration: underline;<br />
}<br />
<br />
<br />
/* title & subtitle */<br />
.dw-title {<br />
text-align: center;<br />
line-height: 1.2;<br />
font-size: 2.5rem;<br />
font-weight: 700;<br />
letter-spacing: .02em;<br />
display: block;<br />
}<br />
<br />
<br />
/* grid */<br />
.dw-grid {<br />
display: flex;<br />
flex-wrap: wrap;<br />
gap: 16px;<br />
align-items: flex-start;<br />
margin-top: 14px;<br />
}<br />
.dw-col {<br />
flex: 1 1 520px;<br />
min-width: 320px;<br />
}<br />
<br />
/* cards */<br />
.dw-card {<br />
position: relative;<br />
border: 1px solid #C0C0C0;<br />
background: #FFFFFF !important;<br />
padding: 10px;<br />
margin-bottom: 10px;<br />
}<br />
.dw-card:hover {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 75%, rgba(192, 192, 192, 1) 100%)!important;<br />
}<br />
span.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
<br />
}<br />
<br />
.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 2rem !important; <br />
}<br />
<br />
<br />
.dw-card .dw-row {<br />
display: grid;<br />
grid-template-columns: auto minmax(0, 1fr);<br />
column-gap: 12px;<br />
align-items: flex-start;<br />
width: 100%;<br />
box-sizing: border-box;<br />
padding: 14px;<br />
}<br />
<br />
/* Icon column */<br />
.dw-card .dw-row .dw-icon {<br />
grid-column: 1;<br />
}<br />
<br />
/* Text column */<br />
.dw-card .dw-row .dw-content {<br />
grid-column: 2;<br />
}<br />
<br />
.dw-card .dw-icon img {<br />
height: auto;<br />
max-width: 160px;<br />
}<br />
<br />
<br />
/* Headline */<br />
.dw-card .dw-headline {<br />
display: block;<br />
font-size: 1.5rem;<br />
font-weight: 700;<br />
margin: 0px 0 0px;<br />
}<br />
<br />
/* Body text (your existing rules) */<br />
.dw-card .dw-body { <br />
line-height: 1.6;<br />
width: 100%;<br />
}<br />
.dw-card .dw-body--spacious { <br />
line-height: 1.8;<br />
}<br />
<br />
<br />
<br />
.dw-icon,<br />
.dw-subtitle {<br />
background: transparent !important; /* ✅ makes logo + text boxes transparent */<br />
}<br />
<br />
<br />
/* Code blocks explicitly monospace (so they don't inherit) */<br />
pre, code, kbd, samp, tt, .mw-code {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
text-indent: 0 !important;<br />
}<br />
<br />
/* ===== Remove first-line indentation site-wide ===== */<br />
.mw-parser-output p,<br />
.mw-parser-output li p,<br />
.mw-body-content p,<br />
.dw-card .dw-body p {<br />
text-indent: 0 !important;<br />
}<br />
<br />
<br />
pre {<br />
margin: 0 !important;<br />
padding: 0rem !important; /* add a little inner spacing so text isn’t on the edge */<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);<br />
border: none !important;<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
white-space: pre-wrap !important; /* allows wrapping */<br />
word-break: break-word !important;<br />
line-height: 1 !important;<br />
<br />
}<br />
<br />
.dw-card .pre {<br />
display: block; /* ensures it behaves as a block element */<br />
width: 100% !important;/* takes up the full width of .dw-card */<br />
box-sizing: border-box;/* includes padding/border in width calculation */<br />
margin: 0;<br />
padding: 0;<br />
}<br />
<br />
<br />
div.mw-content-ltr.mw-parser-output {<br />
background: #FFFFFF;<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 97%, rgba(192, 192, 192, 1) 100%);<br />
padding: 1rem;<br />
}<br />
<br />
<br />
<br />
.mw-page-container { <br />
background-image: url("https://dsignweek.servus.at/images/9/9d/Bg-01.png"); background-repeat: repeat-y; <br />
/* ✅ repeat vertically */ background-size: 100% auto; <br />
/* stretch to page width, keep height natural <br />
*/ background-position: center top; <br />
/* start at the top, center horizontally <br />
*/ background-attachment: scroll; <br />
/* move with page scroll */ background-color: #ffffff; /* fallback behind transparent areas */ }<br />
<br />
<br />
div#mw-head {<br />
background: transparent !important;<br />
}<br />
<br />
<br />
.dw-headline, .mw-headline {<br />
margin: 0 !important;<br />
}<br />
<br />
.skin-vector-2022 header.vector-header { box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8)!important; }<br />
<br />
.skin-vector-2022 #vector-sticky-header.vector-sticky-header {<br />
box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8) !important;<br />
}<br />
<br />
/* Global link color */<br />
a,<br />
a:visited,<br />
a:active {<br />
color: #0000FF !important;<br />
}<br />
<br />
/* Optional: link hover color (still blue but darker) */<br />
a:hover {<br />
text-decoration: underline;<br />
}<br />
<br />
<br />
<br />
/* ===== Mobile: stack card content vertically ===== */<br />
@media (max-width: 720px) {<br />
<br />
html, body {<br />
overflow-x: hidden !important;<br />
width: 100% !important;<br />
}<br />
.mw-page-container {<br />
max-width: 100vw !important;<br />
}<br />
<br />
.mw-parser-output {<br />
box-sizing: border-box;<br />
overflow-x: hidden !important;<br />
}<br />
<br />
.banner-icon img, img {<br />
max-width: 100% !important;<br />
width: 100% !important;<br />
object-fit: contain;<br />
}<br />
<br />
.mw-page-container { <br />
background-image: none !important;<br />
background-color: #ffffff !important;<br />
padding: 0 !important; /* ← fixed */<br />
padding-right: 10px !important; /* ← fixed */<br />
padding-left: 10px !important; /* ← fixed */<br />
margin: 0 !important;<br />
box-sizing: border-box;<br />
overflow-x: hidden !important;<br />
}<br />
.dw-col {<br />
flex: 1 1 auto !important; /* let them shrink freely */<br />
min-width: 0 !important; /* remove the minimum width restriction */<br />
}<br />
<br />
.vector-header-container .mw-header, .vector-header-container .vector-sticky-header {<br />
padding-left: 2rem;<br />
padding-right:2rem;<br />
box-sizing: border-box;<br />
}<br />
.mw-header {<br />
gap: 0;<br />
}<br />
.vector-dropdown-content {<br />
width: 100vw !important;<br />
max-width: none !important;<br />
box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8)!important;<br />
}<br />
.dw-card {<br />
padding:0;}<br />
div#content.mw-body {<br />
padding: 0rem;}<br />
div.mw-content-ltr.mw-parser-output {<br />
padding: 0.5rem;<br />
}<br />
<br />
.banner-icon img { <br />
width: 75vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 400px; /* prevent it from getting too big */ <br />
min-width: 80px; /* prevent it from getting too small */ <br />
padding-left: 0rem;}<br />
<br />
/* Stack everything in a column */<br />
.dw-card .dw-row {<br />
display: flex;<br />
flex-direction: column;<br />
align-items: stretch; /* full width for text block */<br />
gap: 10px;<br />
}<br />
<br />
/* Make the icon its own row and center it */<br />
.dw-card .dw-icon {<br />
display: flex;<br />
justify-content: center;<br />
align-items: center;<br />
margin: 0; /* remove any left/right spacing from desktop */<br />
}<br />
<br />
.dw-card .dw-icon img {<br />
width: 72px; /* tidy mobile size */<br />
height: auto;<br />
}<br />
<br />
/* Ensure the text block fills width */<br />
.dw-card .dw-row > div {<br />
width: 100%;<br />
}<br />
<br />
/* Slight spacing tweaks for headings on mobile */<br />
.dw-card .dw-headline {<br />
margin: 4px 0 4px;<br />
}<br />
/* Stack footer sections vertically */<br />
#footer {<br />
display: flex !important;<br />
flex-direction: column !important;<br />
align-items: center !important;<br />
gap: 0 !important;<br />
width: 100% !important;<br />
padding: 1rem 1rem !important;<br />
box-sizing: border-box;<br />
}<br />
<br />
/* Each UL gets full width + centered */<br />
#footer ul {<br />
width: 100% !important;<br />
display: flex !important;<br />
flex-direction: row !important; <br />
justify-content: space-between !important; <br />
align-items: center !important;<br />
margin: 0 !important;<br />
padding: 0 !important;<br />
list-style: none !important;<br />
}<br />
.partner-logos {<br />
display: flex;<br />
flex-wrap: wrap; <br />
justify-content: space-between !important; <br />
align-items: center!important; <br />
gap: 2.2rem; <br />
padding: 0 1rem 1rem 1rem; <br />
background: transparent;<br />
}<br />
#partner-logos { <br />
justify-content: space-between !important; <br />
}<br />
.partner-logos img {<br />
height: 24px;<br />
width: auto;<br />
object-fit:contain;<br />
}<br />
<br />
}</div>
Ivans
https://dsignweek.servus.at/index.php?title=MediaWiki:Common.css&diff=1741
MediaWiki:Common.css
2025-11-24T11:05:41Z
<p>Ivans: </p>
<hr />
<div>/* CSS placed here will be applied to all skins */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
#footer-info-lastmod {<br />
display: none !important;<br />
}<br />
<br />
/* Vector 2022: align user links (language, username, etc.) to the top */<br />
body.skin-vector-2022 .vector-user-links-main {<br />
display: flex; /* make sure it's flexbox */<br />
align-items: flex-start; /* align children to the top of the div */<br />
}<br />
/* Hide the Translate extension banner ("Translate this page; This page has changes…") */<br />
body.skin-vector-2022 .mw-pt-translate-header {<br />
display: none !important;<br />
}<br />
/* Vector 2022 – hide entire tab/navigation bar (left-navigation) for all users */<br />
.skin-vector-2022 #left-navigation {<br />
display: none !important;<br />
}<br />
/* Vector 2022: right-align items in the page toolbar (Edit / View history / Tools) */<br />
.skin-vector-2022 .vector-page-toolbar-container {<br />
display: flex !important;<br />
justify-content: flex-end !important; /* pushes items to the right */<br />
align-items: center; /* vertical alignment */<br />
}<br />
<br />
/* Remove Vector “switch to old look” link + banner */<br />
.skin-vector-2022 .vector-feature-switch,<br />
.skin-vector-2022 a[href*="mw-prefsection-rendering-skin"],<br />
.skin-vector-2022 a[title*="legacy Vector"],<br />
.skin-vector-2022 a[title*="old look"] {<br />
display: none !important;<br />
}<br />
<br />
.mw-anon.skin-vector-2022 #ca-nstab-main, /* page title tab (Main Page / Article) */<br />
.mw-anon.skin-vector-2022 #ca-talk, /* Talk tab */<br />
.mw-anon.skin-vector-2022 #ca-view, /* "Read" tab */<br />
.mw-anon.skin-vector-2022 #ca-history, /* View history */<br />
.mw-anon.skin-vector-2022 #ca-watch,<br />
.mw-anon.skin-vector-2022 #ca-unwatch,<br />
.mw-anon.skin-vector-2022 #ca-more { /* "Tools" dropdown */<br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* === GLOBAL TYPOGRAPHY === */<br />
<br />
/* Base body text — Liberation Sans */<br />
html,<br />
body,<br />
.mw-body,<br />
.mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 1.2rem; /* base = 16px */<br />
line-height: 1.15; <br />
}<br />
<br />
/* Paragraphs and list text */<br />
p, li, td, th {<br />
font-size: 1.1rem; /* slightly larger than base text */<br />
}<br />
<br />
/* === HEADINGS — Linux Libertine === */<br />
h1, h2, h3, h4, h5, h6,<br />
.firstHeading,<br />
.mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
.mw-body h1, .mw-heading1, .mw-body-content h1, .mw-body-content .mw-heading1 { font-size: 3rem; line-height: 1.15; } <br />
<br />
<br />
<br />
/* === SIDEBAR MENU === */<br />
#mw-panel,<br />
.vector-menu-content,<br />
#p-navigation,<br />
#p-tb,<br />
#p-lang {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem; /* sidebar smaller for contrast */<br />
line-height: 1.4;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
#partner-logos {<br />
display: flex;<br />
justify-content: right;<br />
align-items: right;<br />
flex-wrap: wrap;<br />
gap: 1rem;<br />
margin-top:0.8rem;<br />
<br />
}<br />
<br />
#partner-logos img {<br />
height: 32px;<br />
object-fit: contain; /* keeps aspect ratio, fits within the box */<br />
max-width: 100%; /* prevents overflow */<br />
display: block; /* removes inline gaps below images */<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
.wikitable.custom-table {<br />
width: 100%;<br />
border-collapse: separate;<br />
border-spacing: 0;<br />
border: none;<br />
background-color: #fff;<br />
border-radius: 0.5rem;<br />
overflow: hidden; /* so rounded corners clip correctly */<br />
font-size: 0.95rem;<br />
}<br />
<br />
<br />
<br />
/* Header cells */<br />
.wikitable.custom-table th {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
color: #000;<br />
font-weight: 600;<br />
text-align: left;<br />
padding: 0.75rem 1rem;<br />
border-bottom: 2px solid #d0d9ff;<br />
}<br />
<br />
/* Data cells */<br />
.wikitable.custom-table td {<br />
padding: 0.65rem 1rem;<br />
border-bottom: 1px solid #eee;<br />
}<br />
<br />
/* Zebra striping */<br />
.wikitable.custom-table tr:nth-child(even) td {<br />
background-color: #f9fbff;<br />
}<br />
<br />
/* Hover effect */<br />
.wikitable.custom-table tr:hover td {<br />
background: #FFF;<br />
background: linear-gradient(0deg,rgba(0, 0, 255, 1) 0%, rgba(255, 255, 255, 1) 15%, rgba(255, 255, 255, 1) 85%, rgba(0, 0, 255, 1) 100%);<br />
}<br />
<br />
<br />
/* Rounded corners for first & last rows */<br />
.wikitable.custom-table tr:first-child th:first-child {<br />
border-top-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:first-child th:last-child {<br />
border-top-right-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:first-child {<br />
border-bottom-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:last-child {<br />
border-bottom-right-radius: 0.5rem;<br />
}<br />
<br />
<br />
/* === Mobile Responsive Tables (no HTML change needed) === */<br />
@media (max-width: 768px) {<br />
<br />
/* Allow horizontal scrolling on narrow screens */<br />
.wikitable.custom-table {<br />
display: block;<br />
width: 100%;<br />
overflow-x: auto;<br />
-webkit-overflow-scrolling: touch;<br />
}<br />
<br />
/* Prevent collapsing/squeezing of long cell content */<br />
.wikitable.custom-table tr,<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
white-space: nowrap;<br />
}<br />
<br />
/* Optional: slightly reduce padding for small screens */<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
padding: 0.5rem 0.75rem;<br />
}<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* Hide the automatic Tools and Special pages sections */<br />
#p-tb { <br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* MAIN-PAGE */<br />
<br />
/* === FONTS (yours) === */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
.mw-pt-languages {<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);}<br />
/* === GLOBAL TYPOGRAPHY === */<br />
html, body, .mw-body, .mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem;<br />
line-height: 1.1;<br />
}<br />
p, li, td, th { font-size: 1.1rem; line-height: 1.1; }<br />
h1, h2, h3, h4, h5, h6, .firstHeading, .mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
<br />
/* === d*sign week layout === */<br />
:root {<br />
--dw-border: #cfd8e3;<br />
--dw-card-bg: #f8fbff;<br />
}<br />
<br />
/* top ribbon */<br />
.dw-ribbon {<br />
height: 26px;<br />
background: linear-gradient(#8aa9ff, #ffffff);<br />
border-radius: 6px;<br />
margin: 0 0 14px 0;<br />
}<br />
<br />
<br />
.banner {<br />
display: flex;<br />
align-items: center;<br />
justify-content: space-between;<br />
gap: 1.5rem;<br />
padding: 0rem 1rem 0rem 1rem;<br />
text-align: left; /* centers text within its box */<br />
flex-wrap: wrap; <br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
background-size: 100% 200%;<br />
background-position: top;<br />
transition: background-position 0.4s ease-in-out;<br />
}<br />
.banner:hover {<br />
background-position: bottom;<br />
}<br />
<br />
<br />
.banner-icon img { <br />
width: 20vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 650px; /* prevent it from getting too big */ <br />
min-width: 120px; /* prevent it from getting too small */ <br />
padding-left: 2rem;}<br />
<br />
.dw-subtitle {<br />
font-size: 1.5rem;<br />
line-height: 1;<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle-banner {<br />
font-size: 3rem;<br />
}<br />
.dw-subtitle strong {<br />
<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle a {<br />
color: #0000FF !important; /* link color similar to your example */<br />
text-decoration: none;<br />
}<br />
<br />
.dw-subtitle a:hover {<br />
text-decoration: underline;<br />
}<br />
<br />
<br />
/* title & subtitle */<br />
.dw-title {<br />
text-align: center;<br />
line-height: 1.2;<br />
font-size: 2.5rem;<br />
font-weight: 700;<br />
letter-spacing: .02em;<br />
display: block;<br />
}<br />
<br />
<br />
/* grid */<br />
.dw-grid {<br />
display: flex;<br />
flex-wrap: wrap;<br />
gap: 16px;<br />
align-items: flex-start;<br />
margin-top: 14px;<br />
}<br />
.dw-col {<br />
flex: 1 1 520px;<br />
min-width: 320px;<br />
}<br />
<br />
/* cards */<br />
.dw-card {<br />
position: relative;<br />
border: 1px solid #C0C0C0;<br />
background: #FFFFFF !important;<br />
padding: 10px;<br />
margin-bottom: 10px;<br />
}<br />
.dw-card:hover {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 75%, rgba(192, 192, 192, 1) 100%)!important;<br />
}<br />
span.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
<br />
}<br />
<br />
.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 2rem !important; <br />
}<br />
<br />
<br />
/* === Replace the old flex-based row rules with this GRID version === */<br />
.dw-card .dw-row {<br />
display: grid;<br />
grid-template-columns: auto minmax(0, 1fr); /* 1: icon, 2: flexible text */<br />
column-gap: 12px;<br />
align-items: flex-start;<br />
width: 100%;<br />
box-sizing: border-box;<br />
padding: 14px;<br />
}<br />
<br />
/* Icon column: always in column 1 */<br />
.dw-card .dw-row > .dw-icon {<br />
grid-column: 1;<br />
}<br />
<br />
/* Text column: everything that is NOT the icon goes in column 2 */<br />
.dw-card .dw-row > :not(.dw-icon) {<br />
grid-column: 2;<br />
}<br />
<br />
/* Icon image */<br />
.dw-card .dw-icon img {<br />
height: auto;<br />
max-width: 160px; /* keep this */<br />
}<br />
<br />
/* Headline */<br />
.dw-card .dw-headline {<br />
display: block;<br />
font-size: 1.5rem;<br />
font-weight: 700;<br />
margin: 0px 0 0px;<br />
}<br />
<br />
/* Body text (your existing rules) */<br />
.dw-card .dw-body { <br />
line-height: 1.6;<br />
width: 100%;<br />
}<br />
.dw-card .dw-body--spacious { <br />
line-height: 1.8;<br />
}<br />
<br />
<br />
<br />
.dw-icon,<br />
.dw-subtitle {<br />
background: transparent !important; /* ✅ makes logo + text boxes transparent */<br />
}<br />
<br />
<br />
/* Code blocks explicitly monospace (so they don't inherit) */<br />
pre, code, kbd, samp, tt, .mw-code {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
text-indent: 0 !important;<br />
}<br />
<br />
/* ===== Remove first-line indentation site-wide ===== */<br />
.mw-parser-output p,<br />
.mw-parser-output li p,<br />
.mw-body-content p,<br />
.dw-card .dw-body p {<br />
text-indent: 0 !important;<br />
}<br />
<br />
<br />
pre {<br />
margin: 0 !important;<br />
padding: 0rem !important; /* add a little inner spacing so text isn’t on the edge */<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);<br />
border: none !important;<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
white-space: pre-wrap !important; /* allows wrapping */<br />
word-break: break-word !important;<br />
line-height: 1 !important;<br />
<br />
}<br />
<br />
.dw-card .pre {<br />
display: block; /* ensures it behaves as a block element */<br />
width: 100% !important;/* takes up the full width of .dw-card */<br />
box-sizing: border-box;/* includes padding/border in width calculation */<br />
margin: 0;<br />
padding: 0;<br />
}<br />
<br />
<br />
div.mw-content-ltr.mw-parser-output {<br />
background: #FFFFFF;<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 97%, rgba(192, 192, 192, 1) 100%);<br />
padding: 1rem;<br />
}<br />
<br />
<br />
<br />
.mw-page-container { <br />
background-image: url("https://dsignweek.servus.at/images/9/9d/Bg-01.png"); background-repeat: repeat-y; <br />
/* ✅ repeat vertically */ background-size: 100% auto; <br />
/* stretch to page width, keep height natural <br />
*/ background-position: center top; <br />
/* start at the top, center horizontally <br />
*/ background-attachment: scroll; <br />
/* move with page scroll */ background-color: #ffffff; /* fallback behind transparent areas */ }<br />
<br />
<br />
div#mw-head {<br />
background: transparent !important;<br />
}<br />
<br />
<br />
.dw-headline, .mw-headline {<br />
margin: 0 !important;<br />
}<br />
<br />
.skin-vector-2022 header.vector-header { box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8)!important; }<br />
<br />
.skin-vector-2022 #vector-sticky-header.vector-sticky-header {<br />
box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8) !important;<br />
}<br />
<br />
/* Global link color */<br />
a,<br />
a:visited,<br />
a:active {<br />
color: #0000FF !important;<br />
}<br />
<br />
/* Optional: link hover color (still blue but darker) */<br />
a:hover {<br />
text-decoration: underline;<br />
}<br />
<br />
<br />
<br />
/* ===== Mobile: stack card content vertically ===== */<br />
@media (max-width: 720px) {<br />
<br />
html, body {<br />
overflow-x: hidden !important;<br />
width: 100% !important;<br />
}<br />
.mw-page-container {<br />
max-width: 100vw !important;<br />
}<br />
<br />
.mw-parser-output {<br />
box-sizing: border-box;<br />
overflow-x: hidden !important;<br />
}<br />
<br />
.banner-icon img, img {<br />
max-width: 100% !important;<br />
width: 100% !important;<br />
object-fit: contain;<br />
}<br />
<br />
.mw-page-container { <br />
background-image: none !important;<br />
background-color: #ffffff !important;<br />
padding: 0 !important; /* ← fixed */<br />
padding-right: 10px !important; /* ← fixed */<br />
padding-left: 10px !important; /* ← fixed */<br />
margin: 0 !important;<br />
box-sizing: border-box;<br />
overflow-x: hidden !important;<br />
}<br />
.dw-col {<br />
flex: 1 1 auto !important; /* let them shrink freely */<br />
min-width: 0 !important; /* remove the minimum width restriction */<br />
}<br />
<br />
.vector-header-container .mw-header, .vector-header-container .vector-sticky-header {<br />
padding-left: 2rem;<br />
padding-right:2rem;<br />
box-sizing: border-box;<br />
}<br />
.mw-header {<br />
gap: 0;<br />
}<br />
.vector-dropdown-content {<br />
width: 100vw !important;<br />
max-width: none !important;<br />
box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8)!important;<br />
}<br />
.dw-card {<br />
padding:0;}<br />
div#content.mw-body {<br />
padding: 0rem;}<br />
div.mw-content-ltr.mw-parser-output {<br />
padding: 0.5rem;<br />
}<br />
<br />
.banner-icon img { <br />
width: 75vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 400px; /* prevent it from getting too big */ <br />
min-width: 80px; /* prevent it from getting too small */ <br />
padding-left: 0rem;}<br />
<br />
/* Stack everything in a column */<br />
.dw-card .dw-row {<br />
display: flex;<br />
flex-direction: column;<br />
align-items: stretch; /* full width for text block */<br />
gap: 10px;<br />
}<br />
<br />
/* Make the icon its own row and center it */<br />
.dw-card .dw-icon {<br />
display: flex;<br />
justify-content: center;<br />
align-items: center;<br />
margin: 0; /* remove any left/right spacing from desktop */<br />
}<br />
<br />
.dw-card .dw-icon img {<br />
width: 72px; /* tidy mobile size */<br />
height: auto;<br />
}<br />
<br />
/* Ensure the text block fills width */<br />
.dw-card .dw-row > div {<br />
width: 100%;<br />
}<br />
<br />
/* Slight spacing tweaks for headings on mobile */<br />
.dw-card .dw-headline {<br />
margin: 4px 0 4px;<br />
}<br />
/* Stack footer sections vertically */<br />
#footer {<br />
display: flex !important;<br />
flex-direction: column !important;<br />
align-items: center !important;<br />
gap: 0 !important;<br />
width: 100% !important;<br />
padding: 1rem 1rem !important;<br />
box-sizing: border-box;<br />
}<br />
<br />
/* Each UL gets full width + centered */<br />
#footer ul {<br />
width: 100% !important;<br />
display: flex !important;<br />
flex-direction: row !important; <br />
justify-content: space-between !important; <br />
align-items: center !important;<br />
margin: 0 !important;<br />
padding: 0 !important;<br />
list-style: none !important;<br />
}<br />
.partner-logos {<br />
display: flex;<br />
flex-wrap: wrap; <br />
justify-content: space-between !important; <br />
align-items: center!important; <br />
gap: 2.2rem; <br />
padding: 0 1rem 1rem 1rem; <br />
background: transparent;<br />
}<br />
#partner-logos { <br />
justify-content: space-between !important; <br />
}<br />
.partner-logos img {<br />
height: 24px;<br />
width: auto;<br />
object-fit:contain;<br />
}<br />
<br />
}</div>
Ivans
https://dsignweek.servus.at/index.php?title=MediaWiki:Common.css&diff=1740
MediaWiki:Common.css
2025-11-24T10:54:51Z
<p>Ivans: </p>
<hr />
<div>/* CSS placed here will be applied to all skins */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
#footer-info-lastmod {<br />
display: none !important;<br />
}<br />
<br />
/* Vector 2022: align user links (language, username, etc.) to the top */<br />
body.skin-vector-2022 .vector-user-links-main {<br />
display: flex; /* make sure it's flexbox */<br />
align-items: flex-start; /* align children to the top of the div */<br />
}<br />
/* Hide the Translate extension banner ("Translate this page; This page has changes…") */<br />
body.skin-vector-2022 .mw-pt-translate-header {<br />
display: none !important;<br />
}<br />
/* Vector 2022 – hide entire tab/navigation bar (left-navigation) for all users */<br />
.skin-vector-2022 #left-navigation {<br />
display: none !important;<br />
}<br />
/* Vector 2022: right-align items in the page toolbar (Edit / View history / Tools) */<br />
.skin-vector-2022 .vector-page-toolbar-container {<br />
display: flex !important;<br />
justify-content: flex-end !important; /* pushes items to the right */<br />
align-items: center; /* vertical alignment */<br />
}<br />
<br />
/* Remove Vector “switch to old look” link + banner */<br />
.skin-vector-2022 .vector-feature-switch,<br />
.skin-vector-2022 a[href*="mw-prefsection-rendering-skin"],<br />
.skin-vector-2022 a[title*="legacy Vector"],<br />
.skin-vector-2022 a[title*="old look"] {<br />
display: none !important;<br />
}<br />
<br />
.mw-anon.skin-vector-2022 #ca-nstab-main, /* page title tab (Main Page / Article) */<br />
.mw-anon.skin-vector-2022 #ca-talk, /* Talk tab */<br />
.mw-anon.skin-vector-2022 #ca-view, /* "Read" tab */<br />
.mw-anon.skin-vector-2022 #ca-history, /* View history */<br />
.mw-anon.skin-vector-2022 #ca-watch,<br />
.mw-anon.skin-vector-2022 #ca-unwatch,<br />
.mw-anon.skin-vector-2022 #ca-more { /* "Tools" dropdown */<br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* === GLOBAL TYPOGRAPHY === */<br />
<br />
/* Base body text — Liberation Sans */<br />
html,<br />
body,<br />
.mw-body,<br />
.mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 1.2rem; /* base = 16px */<br />
line-height: 1.15; <br />
}<br />
<br />
/* Paragraphs and list text */<br />
p, li, td, th {<br />
font-size: 1.1rem; /* slightly larger than base text */<br />
}<br />
<br />
/* === HEADINGS — Linux Libertine === */<br />
h1, h2, h3, h4, h5, h6,<br />
.firstHeading,<br />
.mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
.mw-body h1, .mw-heading1, .mw-body-content h1, .mw-body-content .mw-heading1 { font-size: 3rem; line-height: 1.15; } <br />
<br />
<br />
<br />
/* === SIDEBAR MENU === */<br />
#mw-panel,<br />
.vector-menu-content,<br />
#p-navigation,<br />
#p-tb,<br />
#p-lang {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem; /* sidebar smaller for contrast */<br />
line-height: 1.4;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
#partner-logos {<br />
display: flex;<br />
justify-content: right;<br />
align-items: right;<br />
flex-wrap: wrap;<br />
gap: 1rem;<br />
margin-top:0.8rem;<br />
<br />
}<br />
<br />
#partner-logos img {<br />
height: 32px;<br />
object-fit: contain; /* keeps aspect ratio, fits within the box */<br />
max-width: 100%; /* prevents overflow */<br />
display: block; /* removes inline gaps below images */<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
.wikitable.custom-table {<br />
width: 100%;<br />
border-collapse: separate;<br />
border-spacing: 0;<br />
border: none;<br />
background-color: #fff;<br />
border-radius: 0.5rem;<br />
overflow: hidden; /* so rounded corners clip correctly */<br />
font-size: 0.95rem;<br />
}<br />
<br />
<br />
<br />
/* Header cells */<br />
.wikitable.custom-table th {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
color: #000;<br />
font-weight: 600;<br />
text-align: left;<br />
padding: 0.75rem 1rem;<br />
border-bottom: 2px solid #d0d9ff;<br />
}<br />
<br />
/* Data cells */<br />
.wikitable.custom-table td {<br />
padding: 0.65rem 1rem;<br />
border-bottom: 1px solid #eee;<br />
}<br />
<br />
/* Zebra striping */<br />
.wikitable.custom-table tr:nth-child(even) td {<br />
background-color: #f9fbff;<br />
}<br />
<br />
/* Hover effect */<br />
.wikitable.custom-table tr:hover td {<br />
background: #FFF;<br />
background: linear-gradient(0deg,rgba(0, 0, 255, 1) 0%, rgba(255, 255, 255, 1) 15%, rgba(255, 255, 255, 1) 85%, rgba(0, 0, 255, 1) 100%);<br />
}<br />
<br />
<br />
/* Rounded corners for first & last rows */<br />
.wikitable.custom-table tr:first-child th:first-child {<br />
border-top-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:first-child th:last-child {<br />
border-top-right-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:first-child {<br />
border-bottom-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:last-child {<br />
border-bottom-right-radius: 0.5rem;<br />
}<br />
<br />
<br />
/* === Mobile Responsive Tables (no HTML change needed) === */<br />
@media (max-width: 768px) {<br />
<br />
/* Allow horizontal scrolling on narrow screens */<br />
.wikitable.custom-table {<br />
display: block;<br />
width: 100%;<br />
overflow-x: auto;<br />
-webkit-overflow-scrolling: touch;<br />
}<br />
<br />
/* Prevent collapsing/squeezing of long cell content */<br />
.wikitable.custom-table tr,<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
white-space: nowrap;<br />
}<br />
<br />
/* Optional: slightly reduce padding for small screens */<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
padding: 0.5rem 0.75rem;<br />
}<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* Hide the automatic Tools and Special pages sections */<br />
#p-tb { <br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* MAIN-PAGE */<br />
<br />
/* === FONTS (yours) === */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
.mw-pt-languages {<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);}<br />
/* === GLOBAL TYPOGRAPHY === */<br />
html, body, .mw-body, .mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem;<br />
line-height: 1.1;<br />
}<br />
p, li, td, th { font-size: 1.1rem; line-height: 1.1; }<br />
h1, h2, h3, h4, h5, h6, .firstHeading, .mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
<br />
/* === d*sign week layout === */<br />
:root {<br />
--dw-border: #cfd8e3;<br />
--dw-card-bg: #f8fbff;<br />
}<br />
<br />
/* top ribbon */<br />
.dw-ribbon {<br />
height: 26px;<br />
background: linear-gradient(#8aa9ff, #ffffff);<br />
border-radius: 6px;<br />
margin: 0 0 14px 0;<br />
}<br />
<br />
<br />
.banner {<br />
display: flex;<br />
align-items: center;<br />
justify-content: space-between;<br />
gap: 1.5rem;<br />
padding: 0rem 1rem 0rem 1rem;<br />
text-align: left; /* centers text within its box */<br />
flex-wrap: wrap; <br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
background-size: 100% 200%;<br />
background-position: top;<br />
transition: background-position 0.4s ease-in-out;<br />
}<br />
.banner:hover {<br />
background-position: bottom;<br />
}<br />
<br />
<br />
.banner-icon img { <br />
width: 20vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 650px; /* prevent it from getting too big */ <br />
min-width: 120px; /* prevent it from getting too small */ <br />
padding-left: 2rem;}<br />
<br />
.dw-subtitle {<br />
font-size: 1.5rem;<br />
line-height: 1;<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle-banner {<br />
font-size: 3rem;<br />
}<br />
.dw-subtitle strong {<br />
<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle a {<br />
color: #0000FF !important; /* link color similar to your example */<br />
text-decoration: none;<br />
}<br />
<br />
.dw-subtitle a:hover {<br />
text-decoration: underline;<br />
}<br />
<br />
<br />
/* title & subtitle */<br />
.dw-title {<br />
text-align: center;<br />
line-height: 1.2;<br />
font-size: 2.5rem;<br />
font-weight: 700;<br />
letter-spacing: .02em;<br />
display: block;<br />
}<br />
<br />
<br />
/* grid */<br />
.dw-grid {<br />
display: flex;<br />
flex-wrap: wrap;<br />
gap: 16px;<br />
align-items: flex-start;<br />
margin-top: 14px;<br />
}<br />
.dw-col {<br />
flex: 1 1 520px;<br />
min-width: 320px;<br />
}<br />
<br />
/* cards */<br />
.dw-card {<br />
position: relative;<br />
border: 1px solid #C0C0C0;<br />
background: #FFFFFF !important;<br />
padding: 10px;<br />
margin-bottom: 10px;<br />
}<br />
.dw-card:hover {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 75%, rgba(192, 192, 192, 1) 100%)!important;<br />
}<br />
span.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
<br />
}<br />
<br />
.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 2rem !important; <br />
}<br />
<br />
<br />
.dw-card .dw-row {<br />
display: flex;<br />
flex-wrap: wrap;<br />
align-items: flex-start;<br />
gap: 12px;<br />
width: 100%;<br />
box-sizing: border-box;<br />
padding: 14px; /* ✅ move the spacing here instead of .dw-card */<br />
}<br />
<br />
.dw-card .dw-row > div:last-child {<br />
flex: 1;<br />
min-width: 0; /* ✅ prevents overflow due to long text/links */<br />
}<br />
<br />
<br />
<br />
.dw-card .dw-icon img { height: auto; }<br />
.dw-card .dw-headline {<br />
display: block;<br />
font-size: 1.5rem;<br />
font-weight: 700;<br />
margin: 0px 0 0px;<br />
}<br />
.dw-card .dw-body { line-height: 1.6; width: 100%;}<br />
.dw-card .dw-body--spacious { line-height: 1.8; }<br />
<br />
<br />
.dw-icon,<br />
.dw-subtitle {<br />
background: transparent !important; /* ✅ makes logo + text boxes transparent */<br />
}<br />
<br />
<br />
/* Code blocks explicitly monospace (so they don't inherit) */<br />
pre, code, kbd, samp, tt, .mw-code {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
text-indent: 0 !important;<br />
}<br />
<br />
/* ===== Remove first-line indentation site-wide ===== */<br />
.mw-parser-output p,<br />
.mw-parser-output li p,<br />
.mw-body-content p,<br />
.dw-card .dw-body p {<br />
text-indent: 0 !important;<br />
}<br />
<br />
<br />
pre {<br />
margin: 0 !important;<br />
padding: 0rem !important; /* add a little inner spacing so text isn’t on the edge */<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);<br />
border: none !important;<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
white-space: pre-wrap !important; /* allows wrapping */<br />
word-break: break-word !important;<br />
line-height: 1 !important;<br />
<br />
}<br />
<br />
.dw-card .pre {<br />
display: block; /* ensures it behaves as a block element */<br />
width: 100% !important;/* takes up the full width of .dw-card */<br />
box-sizing: border-box;/* includes padding/border in width calculation */<br />
margin: 0;<br />
padding: 0;<br />
}<br />
<br />
<br />
div.mw-content-ltr.mw-parser-output {<br />
background: #FFFFFF;<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 97%, rgba(192, 192, 192, 1) 100%);<br />
padding: 1rem;<br />
}<br />
<br />
<br />
<br />
.mw-page-container { <br />
background-image: url("https://dsignweek.servus.at/images/9/9d/Bg-01.png"); background-repeat: repeat-y; <br />
/* ✅ repeat vertically */ background-size: 100% auto; <br />
/* stretch to page width, keep height natural <br />
*/ background-position: center top; <br />
/* start at the top, center horizontally <br />
*/ background-attachment: scroll; <br />
/* move with page scroll */ background-color: #ffffff; /* fallback behind transparent areas */ }<br />
<br />
<br />
div#mw-head {<br />
background: transparent !important;<br />
}<br />
<br />
<br />
.dw-headline, .mw-headline {<br />
margin: 0 !important;<br />
}<br />
<br />
.skin-vector-2022 header.vector-header { box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8)!important; }<br />
<br />
.skin-vector-2022 #vector-sticky-header.vector-sticky-header {<br />
box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8) !important;<br />
}<br />
<br />
/* Global link color */<br />
a,<br />
a:visited,<br />
a:active {<br />
color: #0000FF !important;<br />
}<br />
<br />
/* Optional: link hover color (still blue but darker) */<br />
a:hover {<br />
text-decoration: underline;<br />
}<br />
<br />
<br />
<br />
/* ===== Mobile: stack card content vertically ===== */<br />
@media (max-width: 720px) {<br />
<br />
html, body {<br />
overflow-x: hidden !important;<br />
width: 100% !important;<br />
}<br />
.mw-page-container {<br />
max-width: 100vw !important;<br />
}<br />
<br />
.mw-parser-output {<br />
box-sizing: border-box;<br />
overflow-x: hidden !important;<br />
}<br />
<br />
.banner-icon img, img {<br />
max-width: 100% !important;<br />
width: 100% !important;<br />
object-fit: contain;<br />
}<br />
<br />
.mw-page-container { <br />
background-image: none !important;<br />
background-color: #ffffff !important;<br />
padding: 0 !important; /* ← fixed */<br />
padding-right: 10px !important; /* ← fixed */<br />
padding-left: 10px !important; /* ← fixed */<br />
margin: 0 !important;<br />
box-sizing: border-box;<br />
overflow-x: hidden !important;<br />
}<br />
.dw-col {<br />
flex: 1 1 auto !important; /* let them shrink freely */<br />
min-width: 0 !important; /* remove the minimum width restriction */<br />
}<br />
<br />
.vector-header-container .mw-header, .vector-header-container .vector-sticky-header {<br />
padding-left: 2rem;<br />
padding-right:2rem;<br />
box-sizing: border-box;<br />
}<br />
.mw-header {<br />
gap: 0;<br />
}<br />
.vector-dropdown-content {<br />
width: 100vw !important;<br />
max-width: none !important;<br />
box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8)!important;<br />
}<br />
.dw-card {<br />
padding:0;}<br />
div#content.mw-body {<br />
padding: 0rem;}<br />
div.mw-content-ltr.mw-parser-output {<br />
padding: 0.5rem;<br />
}<br />
<br />
.banner-icon img { <br />
width: 75vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 400px; /* prevent it from getting too big */ <br />
min-width: 80px; /* prevent it from getting too small */ <br />
padding-left: 0rem;}<br />
<br />
/* Stack everything in a column */<br />
.dw-card .dw-row {<br />
display: flex;<br />
flex-direction: column;<br />
align-items: stretch; /* full width for text block */<br />
gap: 10px;<br />
}<br />
<br />
/* Make the icon its own row and center it */<br />
.dw-card .dw-icon {<br />
display: flex;<br />
justify-content: center;<br />
align-items: center;<br />
margin: 0; /* remove any left/right spacing from desktop */<br />
}<br />
<br />
.dw-card .dw-icon img {<br />
width: 72px; /* tidy mobile size */<br />
height: auto;<br />
}<br />
<br />
/* Ensure the text block fills width */<br />
.dw-card .dw-row > div {<br />
width: 100%;<br />
}<br />
<br />
/* Slight spacing tweaks for headings on mobile */<br />
.dw-card .dw-headline {<br />
margin: 4px 0 4px;<br />
}<br />
/* Stack footer sections vertically */<br />
#footer {<br />
display: flex !important;<br />
flex-direction: column !important;<br />
align-items: center !important;<br />
gap: 0 !important;<br />
width: 100% !important;<br />
padding: 1rem 1rem !important;<br />
box-sizing: border-box;<br />
}<br />
<br />
/* Each UL gets full width + centered */<br />
#footer ul {<br />
width: 100% !important;<br />
display: flex !important;<br />
flex-direction: row !important; <br />
justify-content: space-between !important; <br />
align-items: center !important;<br />
margin: 0 !important;<br />
padding: 0 !important;<br />
list-style: none !important;<br />
}<br />
.partner-logos {<br />
display: flex;<br />
flex-wrap: wrap; <br />
justify-content: space-between !important; <br />
align-items: center!important; <br />
gap: 2.2rem; <br />
padding: 0 1rem 1rem 1rem; <br />
background: transparent;<br />
}<br />
#partner-logos { <br />
justify-content: space-between !important; <br />
}<br />
.partner-logos img {<br />
height: 24px;<br />
width: auto;<br />
object-fit:contain;<br />
}<br />
<br />
}</div>
Ivans
https://dsignweek.servus.at/index.php?title=MediaWiki:Common.css&diff=1739
MediaWiki:Common.css
2025-11-24T10:52:55Z
<p>Ivans: </p>
<hr />
<div>/* CSS placed here will be applied to all skins */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
#footer-info-lastmod {<br />
display: none !important;<br />
}<br />
<br />
/* Vector 2022: align user links (language, username, etc.) to the top */<br />
body.skin-vector-2022 .vector-user-links-main {<br />
display: flex; /* make sure it's flexbox */<br />
align-items: flex-start; /* align children to the top of the div */<br />
}<br />
/* Hide the Translate extension banner ("Translate this page; This page has changes…") */<br />
body.skin-vector-2022 .mw-pt-translate-header {<br />
display: none !important;<br />
}<br />
/* Vector 2022 – hide entire tab/navigation bar (left-navigation) for all users */<br />
.skin-vector-2022 #left-navigation {<br />
display: none !important;<br />
}<br />
/* Vector 2022: right-align items in the page toolbar (Edit / View history / Tools) */<br />
.skin-vector-2022 .vector-page-toolbar-container {<br />
display: flex !important;<br />
justify-content: flex-end !important; /* pushes items to the right */<br />
align-items: center; /* vertical alignment */<br />
}<br />
<br />
/* Remove Vector “switch to old look” link + banner */<br />
.skin-vector-2022 .vector-feature-switch,<br />
.skin-vector-2022 a[href*="mw-prefsection-rendering-skin"],<br />
.skin-vector-2022 a[title*="legacy Vector"],<br />
.skin-vector-2022 a[title*="old look"] {<br />
display: none !important;<br />
}<br />
<br />
.mw-anon.skin-vector-2022 #ca-nstab-main, /* page title tab (Main Page / Article) */<br />
.mw-anon.skin-vector-2022 #ca-talk, /* Talk tab */<br />
.mw-anon.skin-vector-2022 #ca-view, /* "Read" tab */<br />
.mw-anon.skin-vector-2022 #ca-history, /* View history */<br />
.mw-anon.skin-vector-2022 #ca-watch,<br />
.mw-anon.skin-vector-2022 #ca-unwatch,<br />
.mw-anon.skin-vector-2022 #ca-more { /* "Tools" dropdown */<br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* === GLOBAL TYPOGRAPHY === */<br />
<br />
/* Base body text — Liberation Sans */<br />
html,<br />
body,<br />
.mw-body,<br />
.mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 1.2rem; /* base = 16px */<br />
line-height: 1.15; <br />
}<br />
<br />
/* Paragraphs and list text */<br />
p, li, td, th {<br />
font-size: 1.1rem; /* slightly larger than base text */<br />
}<br />
<br />
/* === HEADINGS — Linux Libertine === */<br />
h1, h2, h3, h4, h5, h6,<br />
.firstHeading,<br />
.mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
.mw-body h1, .mw-heading1, .mw-body-content h1, .mw-body-content .mw-heading1 { font-size: 3rem; line-height: 1.15; } <br />
<br />
<br />
<br />
/* === SIDEBAR MENU === */<br />
#mw-panel,<br />
.vector-menu-content,<br />
#p-navigation,<br />
#p-tb,<br />
#p-lang {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem; /* sidebar smaller for contrast */<br />
line-height: 1.4;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
#partner-logos {<br />
display: flex;<br />
justify-content: right;<br />
align-items: right;<br />
flex-wrap: wrap;<br />
gap: 1rem;<br />
margin-top:0.8rem;<br />
<br />
}<br />
<br />
#partner-logos img {<br />
height: 32px;<br />
object-fit: contain; /* keeps aspect ratio, fits within the box */<br />
max-width: 100%; /* prevents overflow */<br />
display: block; /* removes inline gaps below images */<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
.wikitable.custom-table {<br />
width: 100%;<br />
border-collapse: separate;<br />
border-spacing: 0;<br />
border: none;<br />
background-color: #fff;<br />
border-radius: 0.5rem;<br />
overflow: hidden; /* so rounded corners clip correctly */<br />
font-size: 0.95rem;<br />
}<br />
<br />
<br />
<br />
/* Header cells */<br />
.wikitable.custom-table th {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
color: #000;<br />
font-weight: 600;<br />
text-align: left;<br />
padding: 0.75rem 1rem;<br />
border-bottom: 2px solid #d0d9ff;<br />
}<br />
<br />
/* Data cells */<br />
.wikitable.custom-table td {<br />
padding: 0.65rem 1rem;<br />
border-bottom: 1px solid #eee;<br />
}<br />
<br />
/* Zebra striping */<br />
.wikitable.custom-table tr:nth-child(even) td {<br />
background-color: #f9fbff;<br />
}<br />
<br />
/* Hover effect */<br />
.wikitable.custom-table tr:hover td {<br />
background: #FFF;<br />
background: linear-gradient(0deg,rgba(0, 0, 255, 1) 0%, rgba(255, 255, 255, 1) 15%, rgba(255, 255, 255, 1) 85%, rgba(0, 0, 255, 1) 100%);<br />
}<br />
<br />
<br />
/* Rounded corners for first & last rows */<br />
.wikitable.custom-table tr:first-child th:first-child {<br />
border-top-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:first-child th:last-child {<br />
border-top-right-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:first-child {<br />
border-bottom-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:last-child {<br />
border-bottom-right-radius: 0.5rem;<br />
}<br />
<br />
<br />
/* === Mobile Responsive Tables (no HTML change needed) === */<br />
@media (max-width: 768px) {<br />
<br />
/* Allow horizontal scrolling on narrow screens */<br />
.wikitable.custom-table {<br />
display: block;<br />
width: 100%;<br />
overflow-x: auto;<br />
-webkit-overflow-scrolling: touch;<br />
}<br />
<br />
/* Prevent collapsing/squeezing of long cell content */<br />
.wikitable.custom-table tr,<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
white-space: nowrap;<br />
}<br />
<br />
/* Optional: slightly reduce padding for small screens */<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
padding: 0.5rem 0.75rem;<br />
}<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* Hide the automatic Tools and Special pages sections */<br />
#p-tb { <br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* MAIN-PAGE */<br />
<br />
/* === FONTS (yours) === */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
.mw-pt-languages {<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);}<br />
/* === GLOBAL TYPOGRAPHY === */<br />
html, body, .mw-body, .mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem;<br />
line-height: 1.1;<br />
}<br />
p, li, td, th { font-size: 1.1rem; line-height: 1.1; }<br />
h1, h2, h3, h4, h5, h6, .firstHeading, .mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
<br />
/* === d*sign week layout === */<br />
:root {<br />
--dw-border: #cfd8e3;<br />
--dw-card-bg: #f8fbff;<br />
}<br />
<br />
/* top ribbon */<br />
.dw-ribbon {<br />
height: 26px;<br />
background: linear-gradient(#8aa9ff, #ffffff);<br />
border-radius: 6px;<br />
margin: 0 0 14px 0;<br />
}<br />
<br />
<br />
.banner {<br />
display: flex;<br />
align-items: center;<br />
justify-content: space-between;<br />
gap: 1.5rem;<br />
padding: 0rem 1rem 0rem 1rem;<br />
text-align: left; /* centers text within its box */<br />
flex-wrap: wrap; <br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
background-size: 100% 200%;<br />
background-position: top;<br />
transition: background-position 0.4s ease-in-out;<br />
}<br />
.banner:hover {<br />
background-position: bottom;<br />
}<br />
<br />
<br />
.banner-icon img { <br />
width: 20vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 650px; /* prevent it from getting too big */ <br />
min-width: 120px; /* prevent it from getting too small */ <br />
padding-left: 2rem;}<br />
<br />
.dw-subtitle {<br />
font-size: 1.5rem;<br />
line-height: 1;<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle-banner {<br />
font-size: 3rem;<br />
}<br />
.dw-subtitle strong {<br />
<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle a {<br />
color: #0000FF !important; /* link color similar to your example */<br />
text-decoration: none;<br />
}<br />
<br />
.dw-subtitle a:hover {<br />
text-decoration: underline;<br />
}<br />
<br />
<br />
/* title & subtitle */<br />
.dw-title {<br />
text-align: center;<br />
line-height: 1.2;<br />
font-size: 2.5rem;<br />
font-weight: 700;<br />
letter-spacing: .02em;<br />
display: block;<br />
}<br />
<br />
<br />
/* grid */<br />
.dw-grid {<br />
display: flex;<br />
flex-wrap: wrap;<br />
gap: 16px;<br />
align-items: flex-start;<br />
margin-top: 14px;<br />
}<br />
.dw-col {<br />
flex: 1 1 520px;<br />
min-width: 320px;<br />
}<br />
<br />
/* cards */<br />
.dw-card {<br />
position: relative;<br />
border: 1px solid #C0C0C0;<br />
background: #FFFFFF !important;<br />
padding: 10px;<br />
margin-bottom: 10px;<br />
}<br />
.dw-card:hover {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 75%, rgba(192, 192, 192, 1) 100%)!important;<br />
}<br />
span.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
<br />
}<br />
<br />
.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 2rem !important; <br />
}<br />
<br />
<br />
.dw-card .dw-row {<br />
display: flex;<br />
flex-wrap: wrap;<br />
align-items: flex-start;<br />
gap: 12px;<br />
width: 100%;<br />
box-sizing: border-box;<br />
padding: 14px; /* ✅ move the spacing here instead of .dw-card */<br />
}<br />
<br />
/* everything that is NOT the icon becomes the flexible text column */<br />
.dw-card .dw-row > :not(.dw-icon) {<br />
flex: 1 1 auto;<br />
min-width: 0;<br />
}<br />
<br />
<br />
.dw-card .dw-icon img { height: auto; }<br />
.dw-card .dw-headline {<br />
display: block;<br />
font-size: 1.5rem;<br />
font-weight: 700;<br />
margin: 0px 0 0px;<br />
}<br />
.dw-card .dw-body { line-height: 1.6; width: 100%;}<br />
.dw-card .dw-body--spacious { line-height: 1.8; }<br />
<br />
<br />
.dw-icon,<br />
.dw-subtitle {<br />
background: transparent !important; /* ✅ makes logo + text boxes transparent */<br />
}<br />
<br />
<br />
/* Code blocks explicitly monospace (so they don't inherit) */<br />
pre, code, kbd, samp, tt, .mw-code {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
text-indent: 0 !important;<br />
}<br />
<br />
/* ===== Remove first-line indentation site-wide ===== */<br />
.mw-parser-output p,<br />
.mw-parser-output li p,<br />
.mw-body-content p,<br />
.dw-card .dw-body p {<br />
text-indent: 0 !important;<br />
}<br />
<br />
<br />
pre {<br />
margin: 0 !important;<br />
padding: 0rem !important; /* add a little inner spacing so text isn’t on the edge */<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);<br />
border: none !important;<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
white-space: pre-wrap !important; /* allows wrapping */<br />
word-break: break-word !important;<br />
line-height: 1 !important;<br />
<br />
}<br />
<br />
.dw-card .pre {<br />
display: block; /* ensures it behaves as a block element */<br />
width: 100% !important;/* takes up the full width of .dw-card */<br />
box-sizing: border-box;/* includes padding/border in width calculation */<br />
margin: 0;<br />
padding: 0;<br />
}<br />
<br />
<br />
div.mw-content-ltr.mw-parser-output {<br />
background: #FFFFFF;<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 97%, rgba(192, 192, 192, 1) 100%);<br />
padding: 1rem;<br />
}<br />
<br />
<br />
<br />
.mw-page-container { <br />
background-image: url("https://dsignweek.servus.at/images/9/9d/Bg-01.png"); background-repeat: repeat-y; <br />
/* ✅ repeat vertically */ background-size: 100% auto; <br />
/* stretch to page width, keep height natural <br />
*/ background-position: center top; <br />
/* start at the top, center horizontally <br />
*/ background-attachment: scroll; <br />
/* move with page scroll */ background-color: #ffffff; /* fallback behind transparent areas */ }<br />
<br />
<br />
div#mw-head {<br />
background: transparent !important;<br />
}<br />
<br />
<br />
.dw-headline, .mw-headline {<br />
margin: 0 !important;<br />
}<br />
<br />
.skin-vector-2022 header.vector-header { box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8)!important; }<br />
<br />
.skin-vector-2022 #vector-sticky-header.vector-sticky-header {<br />
box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8) !important;<br />
}<br />
<br />
/* Global link color */<br />
a,<br />
a:visited,<br />
a:active {<br />
color: #0000FF !important;<br />
}<br />
<br />
/* Optional: link hover color (still blue but darker) */<br />
a:hover {<br />
text-decoration: underline;<br />
}<br />
<br />
<br />
<br />
/* ===== Mobile: stack card content vertically ===== */<br />
@media (max-width: 720px) {<br />
<br />
html, body {<br />
overflow-x: hidden !important;<br />
width: 100% !important;<br />
}<br />
.mw-page-container {<br />
max-width: 100vw !important;<br />
}<br />
<br />
.mw-parser-output {<br />
box-sizing: border-box;<br />
overflow-x: hidden !important;<br />
}<br />
<br />
.banner-icon img, img {<br />
max-width: 100% !important;<br />
width: 100% !important;<br />
object-fit: contain;<br />
}<br />
<br />
.mw-page-container { <br />
background-image: none !important;<br />
background-color: #ffffff !important;<br />
padding: 0 !important; /* ← fixed */<br />
padding-right: 10px !important; /* ← fixed */<br />
padding-left: 10px !important; /* ← fixed */<br />
margin: 0 !important;<br />
box-sizing: border-box;<br />
overflow-x: hidden !important;<br />
}<br />
.dw-col {<br />
flex: 1 1 auto !important; /* let them shrink freely */<br />
min-width: 0 !important; /* remove the minimum width restriction */<br />
}<br />
<br />
.vector-header-container .mw-header, .vector-header-container .vector-sticky-header {<br />
padding-left: 2rem;<br />
padding-right:2rem;<br />
box-sizing: border-box;<br />
}<br />
.mw-header {<br />
gap: 0;<br />
}<br />
.vector-dropdown-content {<br />
width: 100vw !important;<br />
max-width: none !important;<br />
box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8)!important;<br />
}<br />
.dw-card {<br />
padding:0;}<br />
div#content.mw-body {<br />
padding: 0rem;}<br />
div.mw-content-ltr.mw-parser-output {<br />
padding: 0.5rem;<br />
}<br />
<br />
.banner-icon img { <br />
width: 75vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 400px; /* prevent it from getting too big */ <br />
min-width: 80px; /* prevent it from getting too small */ <br />
padding-left: 0rem;}<br />
<br />
/* Stack everything in a column */<br />
.dw-card .dw-row {<br />
display: flex;<br />
flex-direction: column;<br />
align-items: stretch; /* full width for text block */<br />
gap: 10px;<br />
}<br />
<br />
/* Make the icon its own row and center it */<br />
.dw-card .dw-icon {<br />
display: flex;<br />
justify-content: center;<br />
align-items: center;<br />
margin: 0; /* remove any left/right spacing from desktop */<br />
}<br />
<br />
.dw-card .dw-icon img {<br />
width: 72px; /* tidy mobile size */<br />
height: auto;<br />
}<br />
<br />
/* Ensure the text block fills width */<br />
.dw-card .dw-row > div {<br />
width: 100%;<br />
}<br />
<br />
/* Slight spacing tweaks for headings on mobile */<br />
.dw-card .dw-headline {<br />
margin: 4px 0 4px;<br />
}<br />
/* Stack footer sections vertically */<br />
#footer {<br />
display: flex !important;<br />
flex-direction: column !important;<br />
align-items: center !important;<br />
gap: 0 !important;<br />
width: 100% !important;<br />
padding: 1rem 1rem !important;<br />
box-sizing: border-box;<br />
}<br />
<br />
/* Each UL gets full width + centered */<br />
#footer ul {<br />
width: 100% !important;<br />
display: flex !important;<br />
flex-direction: row !important; <br />
justify-content: space-between !important; <br />
align-items: center !important;<br />
margin: 0 !important;<br />
padding: 0 !important;<br />
list-style: none !important;<br />
}<br />
.partner-logos {<br />
display: flex;<br />
flex-wrap: wrap; <br />
justify-content: space-between !important; <br />
align-items: center!important; <br />
gap: 2.2rem; <br />
padding: 0 1rem 1rem 1rem; <br />
background: transparent;<br />
}<br />
#partner-logos { <br />
justify-content: space-between !important; <br />
}<br />
.partner-logos img {<br />
height: 24px;<br />
width: auto;<br />
object-fit:contain;<br />
}<br />
<br />
}</div>
Ivans
https://dsignweek.servus.at/index.php?title=For_who(m)_is_the_making%3F&diff=1738
For who(m) is the making?
2025-11-24T09:59:17Z
<p>Ivans: </p>
<hr />
<div><languages/><br />
<translate><br />
<!--T:11--><br />
<div class="banner"><br />
<div class="banner-icon"><br />
[[File:Lettering.png|class=noviewer|link=]]<br />
</div><br />
<div class="dw-headline mw-headline"><br />
<strong>24th – 30th November 2025</strong> Linz (AT)<br /><br />
@ [https://www.instagram.com/die.schiassn Kulturverein zur Schießhalle],<br />
[https://stwst.at Stadtwerkstatt],<br />
[https://www.ufg.at University of Arts Linz]<br />
</div><br />
</div><br />
<br />
<div class="dw-grid"><br />
<br />
<!--T:13--><br />
<!-- LEFT COLUMN --><br />
<div class="dw-col"><br />
<br />
<!--T:14--><br />
<!-- 1. For who(m) is the making? --><br />
<div class="dw-card"><br />
<div class="dw-row"><br />
<div class="dw-icon">[[File:Artboard_4.png|160px|class=noviewer|link=]]</div><br />
<div><br />
<span class="dw-headline mw-headline">For who(m) is the making?</span><br />
<div class="dw-body"><br />
<p>The 2025 edition of the d*sign week is organized around the question “[[For who(m) is the making?]]”, which sets attention on who is involved in the design process and how design connects needs and everyday life. Understanding for whom we design, and the context and practice of the designer, has strong influence on outcomes.</p><br />
<br />
<!--T:15--><br />
<p>Even materials and tools play a role. As a discursive practice, design interacts with aesthetic and artistic intentions. If “contemporary design” is often experienced as excluding and exclusive, how can we make it more accessible? How do we balance the need for accessibility with the ever-evolving language of visual communication?</p><br />
</div><br />
</div><br />
</div><br />
</div><br />
<br />
<!--T:16--><br />
<!-- 2. Programme --><br />
<div class="dw-card" onclick="window.location.href='https://dsignweek.servus.at/index.php?title=Programme';" style="cursor: pointer;"><br />
<div class="dw-row"><br />
<div class="dw-icon">[[File:Artboard_3.png|160px|class=noviewer|link=]]</div><br />
<div><br />
<span class="dw-headline mw-headline">[https://dsignweek.servus.at/index.php?title=Programme Programme] und [https://dsignweek.servus.at/index.php?title=Visit_d*sign_week Participants]</span><br />
<div class="dw-body"><br />
<p>Structured as a week-long series of [[:Category:Workshop | workshops]], [[:Category:Talk | talks]] and [[:Category:Performance | Performances]], the d*sign week investigates how access, participation and inclusion can be values that guide independent design practices. How can they become a common goal in non-commercial and socially-oriented projects?</p><br />
<br />
<!--T:17--><br />
<p>The event wants to be a space for exchange for designers, coders and artists. The [[Programme | programm]] opens itself up and aims to be accessible for a broader audience—through note-taking, [[Inter*Printer | editing]] and translations across languages and contexts. The exploration of approaches and tools is the ground for collective learning, reflection-in-action and knowledge exchange during the festival.</p><br />
</div><br />
</div><br />
</div><br />
</div><br />
<br />
<!--T:18--><br />
</div><br />
<br />
<!--T:19--><br />
<!-- RIGHT COLUMN --><br />
<div class="dw-col"><br />
<br />
<!--T:20--><br />
<!-- 3. d*sign week 2025 --><br />
<div class="dw-card"><br />
<div class="dw-row"><br />
<div class="dw-icon">[[File:Artboard_1.png|160px|class=noviewer|link=]]</div><br />
<div><br />
<span class="dw-headline mw-headline">d*sign week 2025</span><br />
<div class="dw-body"><br />
<p>The d*sign week is a festival for experimental and independent design practices. It is organized by the initiatives [[Potato Publishing]] and [https://dsignweek.servus.at/index.php?title=Partners_and_supporters servus.at] together with the departments of Visual Communication and Timebased Media of the [https://dsignweek.servus.at/index.php?title=Partners_and_supporters University of Arts Linz] organisiert.</p><br />
<p>Living in times that require novel forms of being together, the d*sign week proposes asking ourselves “For who(m) is the making?” as a method to radically open the design flow. This creates spaces for new perspectives, alliances and networks of solidarity.</p><br />
</div><br />
</div><br />
</div><br />
</div><br />
<br />
<!--T:21--><br />
<!-- 4. More about d*sign week --><br />
<div class="dw-card"><br />
<div class="dw-row"><br />
<div class="dw-icon">[[File:Artboard_2.png|160px|class=noviewer|link=]]</div><br />
<div><br />
<span class="dw-headline mw-headline">More about the d*sign week</span><br />
<div class="dw-body"><br />
<p><b>Partners:</b> RadioFRO, Stadtwerkstatt STWST.<br /><br />
<b>Participants:</b> [https://dsignweek.servus.at/index.php?title=Festival_contributors Contributors of the Festival] <br /><br />
<b>Programm:</b> [https://dsignweek.servus.at/index.php?title=Programme 2025 Programm Overview]</p><br />
<p><b>Previous Editions:</b><br /><br />
[https://dsignweek.servus.at/2023 https://dsignweek.servus.at/2023]<br /><br />
[https://dsignweek.servus.at/2021 https://dsignweek.servus.at/2021]</p><br />
</div><br />
</div><br />
</div><br />
</div><br />
<br />
<!--T:22--><br />
<!-- 5. Support us! --><br />
<div class="dw-card"><br />
<div class="dw-row"><br />
<div class="dw-icon">[[File:DwLogo.png|160px|class=noviewer|link=]]</div><br />
<div><br />
<span class="dw-headline mw-headline">Support us!</span><br />
<div class="dw-body"><br />
<p><b>d*sign week supporter Tickets:</b><br />[https://kupfticket.com/en/events/dsign-week-2025 KUPFticket.com]</p><br />
</div><br />
</div><br />
</div><br />
</div><br />
<br />
<!--T:23--><br />
</div><br />
<br />
<!--T:24--><br />
</div><br />
<br />
<br />
</translate></div>
Ivans
https://dsignweek.servus.at/index.php?title=MediaWiki:Common.css&diff=1483
MediaWiki:Common.css
2025-11-20T19:15:46Z
<p>Ivans: </p>
<hr />
<div>/* CSS placed here will be applied to all skins */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
#footer-info-lastmod {<br />
display: none !important;<br />
}<br />
<br />
/* Vector 2022: align user links (language, username, etc.) to the top */<br />
body.skin-vector-2022 .vector-user-links-main {<br />
display: flex; /* make sure it's flexbox */<br />
align-items: flex-start; /* align children to the top of the div */<br />
}<br />
/* Hide the Translate extension banner ("Translate this page; This page has changes…") */<br />
body.skin-vector-2022 .mw-pt-translate-header {<br />
display: none !important;<br />
}<br />
/* Vector 2022 – hide entire tab/navigation bar (left-navigation) for all users */<br />
.skin-vector-2022 #left-navigation {<br />
display: none !important;<br />
}<br />
/* Vector 2022: right-align items in the page toolbar (Edit / View history / Tools) */<br />
.skin-vector-2022 .vector-page-toolbar-container {<br />
display: flex !important;<br />
justify-content: flex-end !important; /* pushes items to the right */<br />
align-items: center; /* vertical alignment */<br />
}<br />
<br />
/* Remove Vector “switch to old look” link + banner */<br />
.skin-vector-2022 .vector-feature-switch,<br />
.skin-vector-2022 a[href*="mw-prefsection-rendering-skin"],<br />
.skin-vector-2022 a[title*="legacy Vector"],<br />
.skin-vector-2022 a[title*="old look"] {<br />
display: none !important;<br />
}<br />
<br />
.mw-anon.skin-vector-2022 #ca-nstab-main, /* page title tab (Main Page / Article) */<br />
.mw-anon.skin-vector-2022 #ca-talk, /* Talk tab */<br />
.mw-anon.skin-vector-2022 #ca-view, /* "Read" tab */<br />
.mw-anon.skin-vector-2022 #ca-history, /* View history */<br />
.mw-anon.skin-vector-2022 #ca-watch,<br />
.mw-anon.skin-vector-2022 #ca-unwatch,<br />
.mw-anon.skin-vector-2022 #ca-more { /* "Tools" dropdown */<br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* === GLOBAL TYPOGRAPHY === */<br />
<br />
/* Base body text — Liberation Sans */<br />
html,<br />
body,<br />
.mw-body,<br />
.mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 1.2rem; /* base = 16px */<br />
line-height: 1.15; <br />
}<br />
<br />
/* Paragraphs and list text */<br />
p, li, td, th {<br />
font-size: 1.1rem; /* slightly larger than base text */<br />
}<br />
<br />
/* === HEADINGS — Linux Libertine === */<br />
h1, h2, h3, h4, h5, h6,<br />
.firstHeading,<br />
.mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
.mw-body h1, .mw-heading1, .mw-body-content h1, .mw-body-content .mw-heading1 { font-size: 3rem; line-height: 1.15; } <br />
<br />
<br />
<br />
/* === SIDEBAR MENU === */<br />
#mw-panel,<br />
.vector-menu-content,<br />
#p-navigation,<br />
#p-tb,<br />
#p-lang {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem; /* sidebar smaller for contrast */<br />
line-height: 1.4;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
#partner-logos {<br />
display: flex;<br />
justify-content: right;<br />
align-items: right;<br />
flex-wrap: wrap;<br />
gap: 1rem;<br />
margin-top:0.8rem;<br />
<br />
}<br />
<br />
#partner-logos img {<br />
height: 32px;<br />
object-fit: contain; /* keeps aspect ratio, fits within the box */<br />
max-width: 100%; /* prevents overflow */<br />
display: block; /* removes inline gaps below images */<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
.wikitable.custom-table {<br />
width: 100%;<br />
border-collapse: separate;<br />
border-spacing: 0;<br />
border: none;<br />
background-color: #fff;<br />
border-radius: 0.5rem;<br />
overflow: hidden; /* so rounded corners clip correctly */<br />
font-size: 0.95rem;<br />
}<br />
<br />
<br />
<br />
/* Header cells */<br />
.wikitable.custom-table th {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
color: #000;<br />
font-weight: 600;<br />
text-align: left;<br />
padding: 0.75rem 1rem;<br />
border-bottom: 2px solid #d0d9ff;<br />
}<br />
<br />
/* Data cells */<br />
.wikitable.custom-table td {<br />
padding: 0.65rem 1rem;<br />
border-bottom: 1px solid #eee;<br />
}<br />
<br />
/* Zebra striping */<br />
.wikitable.custom-table tr:nth-child(even) td {<br />
background-color: #f9fbff;<br />
}<br />
<br />
/* Hover effect */<br />
.wikitable.custom-table tr:hover td {<br />
background: #FFF;<br />
background: linear-gradient(0deg,rgba(0, 0, 255, 1) 0%, rgba(255, 255, 255, 1) 15%, rgba(255, 255, 255, 1) 85%, rgba(0, 0, 255, 1) 100%);<br />
}<br />
<br />
<br />
/* Rounded corners for first & last rows */<br />
.wikitable.custom-table tr:first-child th:first-child {<br />
border-top-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:first-child th:last-child {<br />
border-top-right-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:first-child {<br />
border-bottom-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:last-child {<br />
border-bottom-right-radius: 0.5rem;<br />
}<br />
<br />
<br />
/* === Mobile Responsive Tables (no HTML change needed) === */<br />
@media (max-width: 768px) {<br />
<br />
/* Allow horizontal scrolling on narrow screens */<br />
.wikitable.custom-table {<br />
display: block;<br />
width: 100%;<br />
overflow-x: auto;<br />
-webkit-overflow-scrolling: touch;<br />
}<br />
<br />
/* Prevent collapsing/squeezing of long cell content */<br />
.wikitable.custom-table tr,<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
white-space: nowrap;<br />
}<br />
<br />
/* Optional: slightly reduce padding for small screens */<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
padding: 0.5rem 0.75rem;<br />
}<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* Hide the automatic Tools and Special pages sections */<br />
#p-tb { <br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* MAIN-PAGE */<br />
<br />
/* === FONTS (yours) === */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
.mw-pt-languages {<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);}<br />
/* === GLOBAL TYPOGRAPHY === */<br />
html, body, .mw-body, .mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem;<br />
line-height: 1.1;<br />
}<br />
p, li, td, th { font-size: 1.1rem; line-height: 1.1; }<br />
h1, h2, h3, h4, h5, h6, .firstHeading, .mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
<br />
/* === d*sign week layout === */<br />
:root {<br />
--dw-border: #cfd8e3;<br />
--dw-card-bg: #f8fbff;<br />
}<br />
<br />
/* top ribbon */<br />
.dw-ribbon {<br />
height: 26px;<br />
background: linear-gradient(#8aa9ff, #ffffff);<br />
border-radius: 6px;<br />
margin: 0 0 14px 0;<br />
}<br />
<br />
<br />
.banner {<br />
display: flex;<br />
align-items: center;<br />
justify-content: space-between;<br />
gap: 1.5rem;<br />
padding: 0rem 1rem 0rem 1rem;<br />
text-align: left; /* centers text within its box */<br />
flex-wrap: wrap; <br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
background-size: 100% 200%;<br />
background-position: top;<br />
transition: background-position 0.4s ease-in-out;<br />
}<br />
.banner:hover {<br />
background-position: bottom;<br />
}<br />
<br />
<br />
.banner-icon img { <br />
width: 20vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 650px; /* prevent it from getting too big */ <br />
min-width: 120px; /* prevent it from getting too small */ <br />
padding-left: 2rem;}<br />
<br />
.dw-subtitle {<br />
font-size: 1.5rem;<br />
line-height: 1;<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle-banner {<br />
font-size: 3rem;<br />
}<br />
.dw-subtitle strong {<br />
<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle a {<br />
color: #0000FF !important; /* link color similar to your example */<br />
text-decoration: none;<br />
}<br />
<br />
.dw-subtitle a:hover {<br />
text-decoration: underline;<br />
}<br />
<br />
<br />
/* title & subtitle */<br />
.dw-title {<br />
text-align: center;<br />
line-height: 1.2;<br />
font-size: 2.5rem;<br />
font-weight: 700;<br />
letter-spacing: .02em;<br />
display: block;<br />
}<br />
<br />
<br />
/* grid */<br />
.dw-grid {<br />
display: flex;<br />
flex-wrap: wrap;<br />
gap: 16px;<br />
align-items: flex-start;<br />
margin-top: 14px;<br />
}<br />
.dw-col {<br />
flex: 1 1 520px;<br />
min-width: 320px;<br />
}<br />
<br />
/* cards */<br />
.dw-card {<br />
position: relative;<br />
border: 1px solid #C0C0C0;<br />
background: #FFFFFF !important;<br />
padding: 10px;<br />
margin-bottom: 10px;<br />
}<br />
.dw-card:hover {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 75%, rgba(192, 192, 192, 1) 100%)!important;<br />
}<br />
span.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
<br />
}<br />
<br />
.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 2rem !important; <br />
}<br />
<br />
<br />
.dw-card .dw-row {<br />
display: flex;<br />
flex-wrap: wrap;<br />
align-items: flex-start;<br />
gap: 12px;<br />
width: 100%;<br />
box-sizing: border-box;<br />
padding: 14px; /* ✅ move the spacing here instead of .dw-card */<br />
}<br />
<br />
.dw-card .dw-row > div:last-child {<br />
flex: 1;<br />
min-width: 0; /* ✅ prevents overflow due to long text/links */<br />
}<br />
<br />
.dw-card .dw-icon img { height: auto; }<br />
.dw-card .dw-headline {<br />
display: block;<br />
font-size: 1.5rem;<br />
font-weight: 700;<br />
margin: 0px 0 0px;<br />
}<br />
.dw-card .dw-body { line-height: 1.6; width: 100%;}<br />
.dw-card .dw-body--spacious { line-height: 1.8; }<br />
<br />
<br />
.dw-icon,<br />
.dw-subtitle {<br />
background: transparent !important; /* ✅ makes logo + text boxes transparent */<br />
}<br />
<br />
<br />
/* Code blocks explicitly monospace (so they don't inherit) */<br />
pre, code, kbd, samp, tt, .mw-code {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
text-indent: 0 !important;<br />
}<br />
<br />
/* ===== Remove first-line indentation site-wide ===== */<br />
.mw-parser-output p,<br />
.mw-parser-output li p,<br />
.mw-body-content p,<br />
.dw-card .dw-body p {<br />
text-indent: 0 !important;<br />
}<br />
<br />
<br />
pre {<br />
margin: 0 !important;<br />
padding: 0rem !important; /* add a little inner spacing so text isn’t on the edge */<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);<br />
border: none !important;<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
white-space: pre-wrap !important; /* allows wrapping */<br />
word-break: break-word !important;<br />
line-height: 1 !important;<br />
<br />
}<br />
<br />
.dw-card .pre {<br />
display: block; /* ensures it behaves as a block element */<br />
width: 100% !important;/* takes up the full width of .dw-card */<br />
box-sizing: border-box;/* includes padding/border in width calculation */<br />
margin: 0;<br />
padding: 0;<br />
}<br />
<br />
<br />
div.mw-content-ltr.mw-parser-output {<br />
background: #FFFFFF;<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 97%, rgba(192, 192, 192, 1) 100%);<br />
padding: 1rem;<br />
}<br />
<br />
<br />
<br />
.mw-page-container { <br />
background-image: url("https://dsignweek.servus.at/images/9/9d/Bg-01.png"); background-repeat: repeat-y; <br />
/* ✅ repeat vertically */ background-size: 100% auto; <br />
/* stretch to page width, keep height natural <br />
*/ background-position: center top; <br />
/* start at the top, center horizontally <br />
*/ background-attachment: scroll; <br />
/* move with page scroll */ background-color: #ffffff; /* fallback behind transparent areas */ }<br />
<br />
<br />
div#mw-head {<br />
background: transparent !important;<br />
}<br />
<br />
<br />
.dw-headline, .mw-headline {<br />
margin: 0 !important;<br />
}<br />
<br />
.skin-vector-2022 header.vector-header { box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8)!important; }<br />
<br />
.skin-vector-2022 #vector-sticky-header.vector-sticky-header {<br />
box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8) !important;<br />
}<br />
<br />
/* Global link color */<br />
a,<br />
a:visited,<br />
a:active {<br />
color: #0000FF !important;<br />
}<br />
<br />
/* Optional: link hover color (still blue but darker) */<br />
a:hover {<br />
text-decoration: underline;<br />
}<br />
<br />
<br />
<br />
/* ===== Mobile: stack card content vertically ===== */<br />
@media (max-width: 720px) {<br />
<br />
html, body {<br />
overflow-x: hidden !important;<br />
width: 100% !important;<br />
}<br />
.mw-page-container {<br />
max-width: 100vw !important;<br />
}<br />
<br />
.mw-parser-output {<br />
box-sizing: border-box;<br />
overflow-x: hidden !important;<br />
}<br />
<br />
.banner-icon img, img {<br />
max-width: 100% !important;<br />
width: 100% !important;<br />
object-fit: contain;<br />
}<br />
<br />
.mw-page-container { <br />
background-image: none !important;<br />
background-color: #ffffff !important;<br />
padding: 0 !important; /* ← fixed */<br />
padding-right: 10px !important; /* ← fixed */<br />
padding-left: 10px !important; /* ← fixed */<br />
margin: 0 !important;<br />
box-sizing: border-box;<br />
overflow-x: hidden !important;<br />
}<br />
.dw-col {<br />
flex: 1 1 auto !important; /* let them shrink freely */<br />
min-width: 0 !important; /* remove the minimum width restriction */<br />
}<br />
<br />
.vector-header-container .mw-header, .vector-header-container .vector-sticky-header {<br />
padding-left: 2rem;<br />
padding-right:2rem;<br />
box-sizing: border-box;<br />
}<br />
.mw-header {<br />
gap: 0;<br />
}<br />
.vector-dropdown-content {<br />
width: 100vw !important;<br />
max-width: none !important;<br />
box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8)!important;<br />
}<br />
.dw-card {<br />
padding:0;}<br />
div#content.mw-body {<br />
padding: 0rem;}<br />
div.mw-content-ltr.mw-parser-output {<br />
padding: 0.5rem;<br />
}<br />
<br />
.banner-icon img { <br />
width: 75vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 400px; /* prevent it from getting too big */ <br />
min-width: 80px; /* prevent it from getting too small */ <br />
padding-left: 0rem;}<br />
<br />
/* Stack everything in a column */<br />
.dw-card .dw-row {<br />
display: flex;<br />
flex-direction: column;<br />
align-items: stretch; /* full width for text block */<br />
gap: 10px;<br />
}<br />
<br />
/* Make the icon its own row and center it */<br />
.dw-card .dw-icon {<br />
display: flex;<br />
justify-content: center;<br />
align-items: center;<br />
margin: 0; /* remove any left/right spacing from desktop */<br />
}<br />
<br />
.dw-card .dw-icon img {<br />
width: 72px; /* tidy mobile size */<br />
height: auto;<br />
}<br />
<br />
/* Ensure the text block fills width */<br />
.dw-card .dw-row > div {<br />
width: 100%;<br />
}<br />
<br />
/* Slight spacing tweaks for headings on mobile */<br />
.dw-card .dw-headline {<br />
margin: 4px 0 4px;<br />
}<br />
/* Stack footer sections vertically */<br />
#footer {<br />
display: flex !important;<br />
flex-direction: column !important;<br />
align-items: center !important;<br />
gap: 0 !important;<br />
width: 100% !important;<br />
padding: 1rem 1rem !important;<br />
box-sizing: border-box;<br />
}<br />
<br />
/* Each UL gets full width + centered */<br />
#footer ul {<br />
width: 100% !important;<br />
display: flex !important;<br />
flex-direction: row !important; <br />
justify-content: space-between !important; <br />
align-items: center !important;<br />
margin: 0 !important;<br />
padding: 0 !important;<br />
list-style: none !important;<br />
}<br />
.partner-logos {<br />
display: flex;<br />
flex-wrap: wrap; <br />
justify-content: space-between !important; <br />
align-items: center!important; <br />
gap: 2.2rem; <br />
padding: 0 1rem 1rem 1rem; <br />
background: transparent;<br />
}<br />
#partner-logos { <br />
justify-content: space-between !important; <br />
}<br />
.partner-logos img {<br />
height: 24px;<br />
width: auto;<br />
object-fit:contain;<br />
}<br />
<br />
}</div>
Ivans
https://dsignweek.servus.at/index.php?title=MediaWiki:Common.css&diff=1482
MediaWiki:Common.css
2025-11-20T19:15:07Z
<p>Ivans: </p>
<hr />
<div>/* CSS placed here will be applied to all skins */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
#footer-info-lastmod {<br />
display: none !important;<br />
}<br />
<br />
/* Vector 2022: align user links (language, username, etc.) to the top */<br />
body.skin-vector-2022 .vector-user-links-main {<br />
display: flex; /* make sure it's flexbox */<br />
align-items: flex-start; /* align children to the top of the div */<br />
}<br />
/* Hide the Translate extension banner ("Translate this page; This page has changes…") */<br />
body.skin-vector-2022 .mw-pt-translate-header {<br />
display: none !important;<br />
}<br />
/* Vector 2022 – hide entire tab/navigation bar (left-navigation) for all users */<br />
.skin-vector-2022 #left-navigation {<br />
display: none !important;<br />
}<br />
/* Vector 2022: right-align items in the page toolbar (Edit / View history / Tools) */<br />
.skin-vector-2022 .vector-page-toolbar-container {<br />
display: flex !important;<br />
justify-content: flex-end !important; /* pushes items to the right */<br />
align-items: center; /* vertical alignment */<br />
}<br />
<br />
/* Remove Vector “switch to old look” link + banner */<br />
.skin-vector-2022 .vector-feature-switch,<br />
.skin-vector-2022 a[href*="mw-prefsection-rendering-skin"],<br />
.skin-vector-2022 a[title*="legacy Vector"],<br />
.skin-vector-2022 a[title*="old look"] {<br />
display: none !important;<br />
}<br />
<br />
.mw-anon.skin-vector-2022 #ca-nstab-main, /* page title tab (Main Page / Article) */<br />
.mw-anon.skin-vector-2022 #ca-talk, /* Talk tab */<br />
.mw-anon.skin-vector-2022 #ca-view, /* "Read" tab */<br />
.mw-anon.skin-vector-2022 #ca-history, /* View history */<br />
.mw-anon.skin-vector-2022 #ca-watch,<br />
.mw-anon.skin-vector-2022 #ca-unwatch,<br />
.mw-anon.skin-vector-2022 #ca-more { /* "Tools" dropdown */<br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* === GLOBAL TYPOGRAPHY === */<br />
<br />
/* Base body text — Liberation Sans */<br />
html,<br />
body,<br />
.mw-body,<br />
.mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 1.2rem; /* base = 16px */<br />
line-height: 1.15; <br />
}<br />
<br />
/* Paragraphs and list text */<br />
p, li, td, th {<br />
font-size: 1.1rem; /* slightly larger than base text */<br />
}<br />
<br />
/* === HEADINGS — Linux Libertine === */<br />
h1, h2, h3, h4, h5, h6,<br />
.firstHeading,<br />
.mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
.mw-body h1, .mw-heading1, .mw-body-content h1, .mw-body-content .mw-heading1 { font-size: 3rem; line-height: 1.15; } <br />
<br />
<br />
<br />
/* === SIDEBAR MENU === */<br />
#mw-panel,<br />
.vector-menu-content,<br />
#p-navigation,<br />
#p-tb,<br />
#p-lang {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem; /* sidebar smaller for contrast */<br />
line-height: 1.4;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
#partner-logos {<br />
display: flex;<br />
justify-content: right;<br />
align-items: right;<br />
flex-wrap: wrap;<br />
gap: 1rem;<br />
margin-top:0.8rem;<br />
<br />
}<br />
<br />
#partner-logos img {<br />
height: 32px;<br />
object-fit: contain; /* keeps aspect ratio, fits within the box */<br />
max-width: 100%; /* prevents overflow */<br />
display: block; /* removes inline gaps below images */<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
.wikitable.custom-table {<br />
width: 100%;<br />
border-collapse: separate;<br />
border-spacing: 0;<br />
border: none;<br />
background-color: #fff;<br />
border-radius: 0.5rem;<br />
overflow: hidden; /* so rounded corners clip correctly */<br />
font-size: 0.95rem;<br />
}<br />
<br />
<br />
<br />
/* Header cells */<br />
.wikitable.custom-table th {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
color: #000;<br />
font-weight: 600;<br />
text-align: left;<br />
padding: 0.75rem 1rem;<br />
border-bottom: 2px solid #d0d9ff;<br />
}<br />
<br />
/* Data cells */<br />
.wikitable.custom-table td {<br />
padding: 0.65rem 1rem;<br />
border-bottom: 1px solid #eee;<br />
}<br />
<br />
/* Zebra striping */<br />
.wikitable.custom-table tr:nth-child(even) td {<br />
background-color: #f9fbff;<br />
}<br />
<br />
/* Hover effect */<br />
.wikitable.custom-table td:hover {<br />
box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.8)!important;<br />
}<br />
<br />
.wikitable.custom-table tr:nth-child(even) td:hover {<br />
box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.8)!important;<br />
}<br />
<br />
/* Rounded corners for first & last rows */<br />
.wikitable.custom-table tr:first-child th:first-child {<br />
border-top-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:first-child th:last-child {<br />
border-top-right-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:first-child {<br />
border-bottom-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:last-child {<br />
border-bottom-right-radius: 0.5rem;<br />
}<br />
<br />
<br />
/* === Mobile Responsive Tables (no HTML change needed) === */<br />
@media (max-width: 768px) {<br />
<br />
/* Allow horizontal scrolling on narrow screens */<br />
.wikitable.custom-table {<br />
display: block;<br />
width: 100%;<br />
overflow-x: auto;<br />
-webkit-overflow-scrolling: touch;<br />
}<br />
<br />
/* Prevent collapsing/squeezing of long cell content */<br />
.wikitable.custom-table tr,<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
white-space: nowrap;<br />
}<br />
<br />
/* Optional: slightly reduce padding for small screens */<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
padding: 0.5rem 0.75rem;<br />
}<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* Hide the automatic Tools and Special pages sections */<br />
#p-tb { <br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* MAIN-PAGE */<br />
<br />
/* === FONTS (yours) === */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
.mw-pt-languages {<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);}<br />
/* === GLOBAL TYPOGRAPHY === */<br />
html, body, .mw-body, .mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem;<br />
line-height: 1.1;<br />
}<br />
p, li, td, th { font-size: 1.1rem; line-height: 1.1; }<br />
h1, h2, h3, h4, h5, h6, .firstHeading, .mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
<br />
/* === d*sign week layout === */<br />
:root {<br />
--dw-border: #cfd8e3;<br />
--dw-card-bg: #f8fbff;<br />
}<br />
<br />
/* top ribbon */<br />
.dw-ribbon {<br />
height: 26px;<br />
background: linear-gradient(#8aa9ff, #ffffff);<br />
border-radius: 6px;<br />
margin: 0 0 14px 0;<br />
}<br />
<br />
<br />
.banner {<br />
display: flex;<br />
align-items: center;<br />
justify-content: space-between;<br />
gap: 1.5rem;<br />
padding: 0rem 1rem 0rem 1rem;<br />
text-align: left; /* centers text within its box */<br />
flex-wrap: wrap; <br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
background-size: 100% 200%;<br />
background-position: top;<br />
transition: background-position 0.4s ease-in-out;<br />
}<br />
.banner:hover {<br />
background-position: bottom;<br />
}<br />
<br />
<br />
.banner-icon img { <br />
width: 20vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 650px; /* prevent it from getting too big */ <br />
min-width: 120px; /* prevent it from getting too small */ <br />
padding-left: 2rem;}<br />
<br />
.dw-subtitle {<br />
font-size: 1.5rem;<br />
line-height: 1;<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle-banner {<br />
font-size: 3rem;<br />
}<br />
.dw-subtitle strong {<br />
<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle a {<br />
color: #0000FF !important; /* link color similar to your example */<br />
text-decoration: none;<br />
}<br />
<br />
.dw-subtitle a:hover {<br />
text-decoration: underline;<br />
}<br />
<br />
<br />
/* title & subtitle */<br />
.dw-title {<br />
text-align: center;<br />
line-height: 1.2;<br />
font-size: 2.5rem;<br />
font-weight: 700;<br />
letter-spacing: .02em;<br />
display: block;<br />
}<br />
<br />
<br />
/* grid */<br />
.dw-grid {<br />
display: flex;<br />
flex-wrap: wrap;<br />
gap: 16px;<br />
align-items: flex-start;<br />
margin-top: 14px;<br />
}<br />
.dw-col {<br />
flex: 1 1 520px;<br />
min-width: 320px;<br />
}<br />
<br />
/* cards */<br />
.dw-card {<br />
position: relative;<br />
border: 1px solid #C0C0C0;<br />
background: #FFFFFF !important;<br />
padding: 10px;<br />
margin-bottom: 10px;<br />
}<br />
.dw-card:hover {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 75%, rgba(192, 192, 192, 1) 100%)!important;<br />
}<br />
span.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
<br />
}<br />
<br />
.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 2rem !important; <br />
}<br />
<br />
<br />
.dw-card .dw-row {<br />
display: flex;<br />
flex-wrap: wrap;<br />
align-items: flex-start;<br />
gap: 12px;<br />
width: 100%;<br />
box-sizing: border-box;<br />
padding: 14px; /* ✅ move the spacing here instead of .dw-card */<br />
}<br />
<br />
.dw-card .dw-row > div:last-child {<br />
flex: 1;<br />
min-width: 0; /* ✅ prevents overflow due to long text/links */<br />
}<br />
<br />
.dw-card .dw-icon img { height: auto; }<br />
.dw-card .dw-headline {<br />
display: block;<br />
font-size: 1.5rem;<br />
font-weight: 700;<br />
margin: 0px 0 0px;<br />
}<br />
.dw-card .dw-body { line-height: 1.6; width: 100%;}<br />
.dw-card .dw-body--spacious { line-height: 1.8; }<br />
<br />
<br />
.dw-icon,<br />
.dw-subtitle {<br />
background: transparent !important; /* ✅ makes logo + text boxes transparent */<br />
}<br />
<br />
<br />
/* Code blocks explicitly monospace (so they don't inherit) */<br />
pre, code, kbd, samp, tt, .mw-code {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
text-indent: 0 !important;<br />
}<br />
<br />
/* ===== Remove first-line indentation site-wide ===== */<br />
.mw-parser-output p,<br />
.mw-parser-output li p,<br />
.mw-body-content p,<br />
.dw-card .dw-body p {<br />
text-indent: 0 !important;<br />
}<br />
<br />
<br />
pre {<br />
margin: 0 !important;<br />
padding: 0rem !important; /* add a little inner spacing so text isn’t on the edge */<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);<br />
border: none !important;<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
white-space: pre-wrap !important; /* allows wrapping */<br />
word-break: break-word !important;<br />
line-height: 1 !important;<br />
<br />
}<br />
<br />
.dw-card .pre {<br />
display: block; /* ensures it behaves as a block element */<br />
width: 100% !important;/* takes up the full width of .dw-card */<br />
box-sizing: border-box;/* includes padding/border in width calculation */<br />
margin: 0;<br />
padding: 0;<br />
}<br />
<br />
<br />
div.mw-content-ltr.mw-parser-output {<br />
background: #FFFFFF;<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 97%, rgba(192, 192, 192, 1) 100%);<br />
padding: 1rem;<br />
}<br />
<br />
<br />
<br />
.mw-page-container { <br />
background-image: url("https://dsignweek.servus.at/images/9/9d/Bg-01.png"); background-repeat: repeat-y; <br />
/* ✅ repeat vertically */ background-size: 100% auto; <br />
/* stretch to page width, keep height natural <br />
*/ background-position: center top; <br />
/* start at the top, center horizontally <br />
*/ background-attachment: scroll; <br />
/* move with page scroll */ background-color: #ffffff; /* fallback behind transparent areas */ }<br />
<br />
<br />
div#mw-head {<br />
background: transparent !important;<br />
}<br />
<br />
<br />
.dw-headline, .mw-headline {<br />
margin: 0 !important;<br />
}<br />
<br />
.skin-vector-2022 header.vector-header { box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8)!important; }<br />
<br />
.skin-vector-2022 #vector-sticky-header.vector-sticky-header {<br />
box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8) !important;<br />
}<br />
<br />
/* Global link color */<br />
a,<br />
a:visited,<br />
a:active {<br />
color: #0000FF !important;<br />
}<br />
<br />
/* Optional: link hover color (still blue but darker) */<br />
a:hover {<br />
text-decoration: underline;<br />
}<br />
<br />
<br />
<br />
/* ===== Mobile: stack card content vertically ===== */<br />
@media (max-width: 720px) {<br />
<br />
html, body {<br />
overflow-x: hidden !important;<br />
width: 100% !important;<br />
}<br />
.mw-page-container {<br />
max-width: 100vw !important;<br />
}<br />
<br />
.mw-parser-output {<br />
box-sizing: border-box;<br />
overflow-x: hidden !important;<br />
}<br />
<br />
.banner-icon img, img {<br />
max-width: 100% !important;<br />
width: 100% !important;<br />
object-fit: contain;<br />
}<br />
<br />
.mw-page-container { <br />
background-image: none !important;<br />
background-color: #ffffff !important;<br />
padding: 0 !important; /* ← fixed */<br />
padding-right: 10px !important; /* ← fixed */<br />
padding-left: 10px !important; /* ← fixed */<br />
margin: 0 !important;<br />
box-sizing: border-box;<br />
overflow-x: hidden !important;<br />
}<br />
.dw-col {<br />
flex: 1 1 auto !important; /* let them shrink freely */<br />
min-width: 0 !important; /* remove the minimum width restriction */<br />
}<br />
<br />
.vector-header-container .mw-header, .vector-header-container .vector-sticky-header {<br />
padding-left: 2rem;<br />
padding-right:2rem;<br />
box-sizing: border-box;<br />
}<br />
.mw-header {<br />
gap: 0;<br />
}<br />
.vector-dropdown-content {<br />
width: 100vw !important;<br />
max-width: none !important;<br />
box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8)!important;<br />
}<br />
.dw-card {<br />
padding:0;}<br />
div#content.mw-body {<br />
padding: 0rem;}<br />
div.mw-content-ltr.mw-parser-output {<br />
padding: 0.5rem;<br />
}<br />
<br />
.banner-icon img { <br />
width: 75vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 400px; /* prevent it from getting too big */ <br />
min-width: 80px; /* prevent it from getting too small */ <br />
padding-left: 0rem;}<br />
<br />
/* Stack everything in a column */<br />
.dw-card .dw-row {<br />
display: flex;<br />
flex-direction: column;<br />
align-items: stretch; /* full width for text block */<br />
gap: 10px;<br />
}<br />
<br />
/* Make the icon its own row and center it */<br />
.dw-card .dw-icon {<br />
display: flex;<br />
justify-content: center;<br />
align-items: center;<br />
margin: 0; /* remove any left/right spacing from desktop */<br />
}<br />
<br />
.dw-card .dw-icon img {<br />
width: 72px; /* tidy mobile size */<br />
height: auto;<br />
}<br />
<br />
/* Ensure the text block fills width */<br />
.dw-card .dw-row > div {<br />
width: 100%;<br />
}<br />
<br />
/* Slight spacing tweaks for headings on mobile */<br />
.dw-card .dw-headline {<br />
margin: 4px 0 4px;<br />
}<br />
/* Stack footer sections vertically */<br />
#footer {<br />
display: flex !important;<br />
flex-direction: column !important;<br />
align-items: center !important;<br />
gap: 0 !important;<br />
width: 100% !important;<br />
padding: 1rem 1rem !important;<br />
box-sizing: border-box;<br />
}<br />
<br />
/* Each UL gets full width + centered */<br />
#footer ul {<br />
width: 100% !important;<br />
display: flex !important;<br />
flex-direction: row !important; <br />
justify-content: space-between !important; <br />
align-items: center !important;<br />
margin: 0 !important;<br />
padding: 0 !important;<br />
list-style: none !important;<br />
}<br />
.partner-logos {<br />
display: flex;<br />
flex-wrap: wrap; <br />
justify-content: space-between !important; <br />
align-items: center!important; <br />
gap: 2.2rem; <br />
padding: 0 1rem 1rem 1rem; <br />
background: transparent;<br />
}<br />
#partner-logos { <br />
justify-content: space-between !important; <br />
}<br />
.partner-logos img {<br />
height: 24px;<br />
width: auto;<br />
object-fit:contain;<br />
}<br />
<br />
}</div>
Ivans
https://dsignweek.servus.at/index.php?title=MediaWiki:Common.css&diff=1481
MediaWiki:Common.css
2025-11-20T19:14:23Z
<p>Ivans: </p>
<hr />
<div>/* CSS placed here will be applied to all skins */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
#footer-info-lastmod {<br />
display: none !important;<br />
}<br />
<br />
/* Vector 2022: align user links (language, username, etc.) to the top */<br />
body.skin-vector-2022 .vector-user-links-main {<br />
display: flex; /* make sure it's flexbox */<br />
align-items: flex-start; /* align children to the top of the div */<br />
}<br />
/* Hide the Translate extension banner ("Translate this page; This page has changes…") */<br />
body.skin-vector-2022 .mw-pt-translate-header {<br />
display: none !important;<br />
}<br />
/* Vector 2022 – hide entire tab/navigation bar (left-navigation) for all users */<br />
.skin-vector-2022 #left-navigation {<br />
display: none !important;<br />
}<br />
/* Vector 2022: right-align items in the page toolbar (Edit / View history / Tools) */<br />
.skin-vector-2022 .vector-page-toolbar-container {<br />
display: flex !important;<br />
justify-content: flex-end !important; /* pushes items to the right */<br />
align-items: center; /* vertical alignment */<br />
}<br />
<br />
/* Remove Vector “switch to old look” link + banner */<br />
.skin-vector-2022 .vector-feature-switch,<br />
.skin-vector-2022 a[href*="mw-prefsection-rendering-skin"],<br />
.skin-vector-2022 a[title*="legacy Vector"],<br />
.skin-vector-2022 a[title*="old look"] {<br />
display: none !important;<br />
}<br />
<br />
.mw-anon.skin-vector-2022 #ca-nstab-main, /* page title tab (Main Page / Article) */<br />
.mw-anon.skin-vector-2022 #ca-talk, /* Talk tab */<br />
.mw-anon.skin-vector-2022 #ca-view, /* "Read" tab */<br />
.mw-anon.skin-vector-2022 #ca-history, /* View history */<br />
.mw-anon.skin-vector-2022 #ca-watch,<br />
.mw-anon.skin-vector-2022 #ca-unwatch,<br />
.mw-anon.skin-vector-2022 #ca-more { /* "Tools" dropdown */<br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* === GLOBAL TYPOGRAPHY === */<br />
<br />
/* Base body text — Liberation Sans */<br />
html,<br />
body,<br />
.mw-body,<br />
.mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 1.2rem; /* base = 16px */<br />
line-height: 1.15; <br />
}<br />
<br />
/* Paragraphs and list text */<br />
p, li, td, th {<br />
font-size: 1.1rem; /* slightly larger than base text */<br />
}<br />
<br />
/* === HEADINGS — Linux Libertine === */<br />
h1, h2, h3, h4, h5, h6,<br />
.firstHeading,<br />
.mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
.mw-body h1, .mw-heading1, .mw-body-content h1, .mw-body-content .mw-heading1 { font-size: 3rem; line-height: 1.15; } <br />
<br />
<br />
<br />
/* === SIDEBAR MENU === */<br />
#mw-panel,<br />
.vector-menu-content,<br />
#p-navigation,<br />
#p-tb,<br />
#p-lang {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem; /* sidebar smaller for contrast */<br />
line-height: 1.4;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
#partner-logos {<br />
display: flex;<br />
justify-content: right;<br />
align-items: right;<br />
flex-wrap: wrap;<br />
gap: 1rem;<br />
margin-top:0.8rem;<br />
<br />
}<br />
<br />
#partner-logos img {<br />
height: 32px;<br />
object-fit: contain; /* keeps aspect ratio, fits within the box */<br />
max-width: 100%; /* prevents overflow */<br />
display: block; /* removes inline gaps below images */<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
.wikitable.custom-table {<br />
width: 100%;<br />
border-collapse: separate;<br />
border-spacing: 0;<br />
border: none;<br />
background-color: #fff;<br />
border-radius: 0.5rem;<br />
overflow: hidden; /* so rounded corners clip correctly */<br />
font-size: 0.95rem;<br />
}<br />
<br />
<br />
<br />
/* Header cells */<br />
.wikitable.custom-table th {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
color: #000;<br />
font-weight: 600;<br />
text-align: left;<br />
padding: 0.75rem 1rem;<br />
border-bottom: 2px solid #d0d9ff;<br />
}<br />
<br />
/* Data cells */<br />
.wikitable.custom-table td {<br />
padding: 0.65rem 1rem;<br />
border-bottom: 1px solid #eee;<br />
}<br />
<br />
/* Zebra striping */<br />
.wikitable.custom-table tr:nth-child(even) td {<br />
background-color: #f9fbff;<br />
}<br />
<br />
/* Hover effect */<br />
.wikitable.custom-table td:hover {<br />
box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.8)!important;<br />
}<br />
<br />
/* Rounded corners for first & last rows */<br />
.wikitable.custom-table tr:first-child th:first-child {<br />
border-top-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:first-child th:last-child {<br />
border-top-right-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:first-child {<br />
border-bottom-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:last-child {<br />
border-bottom-right-radius: 0.5rem;<br />
}<br />
<br />
<br />
/* === Mobile Responsive Tables (no HTML change needed) === */<br />
@media (max-width: 768px) {<br />
<br />
/* Allow horizontal scrolling on narrow screens */<br />
.wikitable.custom-table {<br />
display: block;<br />
width: 100%;<br />
overflow-x: auto;<br />
-webkit-overflow-scrolling: touch;<br />
}<br />
<br />
/* Prevent collapsing/squeezing of long cell content */<br />
.wikitable.custom-table tr,<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
white-space: nowrap;<br />
}<br />
<br />
/* Optional: slightly reduce padding for small screens */<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
padding: 0.5rem 0.75rem;<br />
}<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* Hide the automatic Tools and Special pages sections */<br />
#p-tb { <br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* MAIN-PAGE */<br />
<br />
/* === FONTS (yours) === */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
.mw-pt-languages {<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);}<br />
/* === GLOBAL TYPOGRAPHY === */<br />
html, body, .mw-body, .mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem;<br />
line-height: 1.1;<br />
}<br />
p, li, td, th { font-size: 1.1rem; line-height: 1.1; }<br />
h1, h2, h3, h4, h5, h6, .firstHeading, .mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
<br />
/* === d*sign week layout === */<br />
:root {<br />
--dw-border: #cfd8e3;<br />
--dw-card-bg: #f8fbff;<br />
}<br />
<br />
/* top ribbon */<br />
.dw-ribbon {<br />
height: 26px;<br />
background: linear-gradient(#8aa9ff, #ffffff);<br />
border-radius: 6px;<br />
margin: 0 0 14px 0;<br />
}<br />
<br />
<br />
.banner {<br />
display: flex;<br />
align-items: center;<br />
justify-content: space-between;<br />
gap: 1.5rem;<br />
padding: 0rem 1rem 0rem 1rem;<br />
text-align: left; /* centers text within its box */<br />
flex-wrap: wrap; <br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
background-size: 100% 200%;<br />
background-position: top;<br />
transition: background-position 0.4s ease-in-out;<br />
}<br />
.banner:hover {<br />
background-position: bottom;<br />
}<br />
<br />
<br />
.banner-icon img { <br />
width: 20vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 650px; /* prevent it from getting too big */ <br />
min-width: 120px; /* prevent it from getting too small */ <br />
padding-left: 2rem;}<br />
<br />
.dw-subtitle {<br />
font-size: 1.5rem;<br />
line-height: 1;<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle-banner {<br />
font-size: 3rem;<br />
}<br />
.dw-subtitle strong {<br />
<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle a {<br />
color: #0000FF !important; /* link color similar to your example */<br />
text-decoration: none;<br />
}<br />
<br />
.dw-subtitle a:hover {<br />
text-decoration: underline;<br />
}<br />
<br />
<br />
/* title & subtitle */<br />
.dw-title {<br />
text-align: center;<br />
line-height: 1.2;<br />
font-size: 2.5rem;<br />
font-weight: 700;<br />
letter-spacing: .02em;<br />
display: block;<br />
}<br />
<br />
<br />
/* grid */<br />
.dw-grid {<br />
display: flex;<br />
flex-wrap: wrap;<br />
gap: 16px;<br />
align-items: flex-start;<br />
margin-top: 14px;<br />
}<br />
.dw-col {<br />
flex: 1 1 520px;<br />
min-width: 320px;<br />
}<br />
<br />
/* cards */<br />
.dw-card {<br />
position: relative;<br />
border: 1px solid #C0C0C0;<br />
background: #FFFFFF !important;<br />
padding: 10px;<br />
margin-bottom: 10px;<br />
}<br />
.dw-card:hover {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 75%, rgba(192, 192, 192, 1) 100%)!important;<br />
}<br />
span.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
<br />
}<br />
<br />
.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 2rem !important; <br />
}<br />
<br />
<br />
.dw-card .dw-row {<br />
display: flex;<br />
flex-wrap: wrap;<br />
align-items: flex-start;<br />
gap: 12px;<br />
width: 100%;<br />
box-sizing: border-box;<br />
padding: 14px; /* ✅ move the spacing here instead of .dw-card */<br />
}<br />
<br />
.dw-card .dw-row > div:last-child {<br />
flex: 1;<br />
min-width: 0; /* ✅ prevents overflow due to long text/links */<br />
}<br />
<br />
.dw-card .dw-icon img { height: auto; }<br />
.dw-card .dw-headline {<br />
display: block;<br />
font-size: 1.5rem;<br />
font-weight: 700;<br />
margin: 0px 0 0px;<br />
}<br />
.dw-card .dw-body { line-height: 1.6; width: 100%;}<br />
.dw-card .dw-body--spacious { line-height: 1.8; }<br />
<br />
<br />
.dw-icon,<br />
.dw-subtitle {<br />
background: transparent !important; /* ✅ makes logo + text boxes transparent */<br />
}<br />
<br />
<br />
/* Code blocks explicitly monospace (so they don't inherit) */<br />
pre, code, kbd, samp, tt, .mw-code {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
text-indent: 0 !important;<br />
}<br />
<br />
/* ===== Remove first-line indentation site-wide ===== */<br />
.mw-parser-output p,<br />
.mw-parser-output li p,<br />
.mw-body-content p,<br />
.dw-card .dw-body p {<br />
text-indent: 0 !important;<br />
}<br />
<br />
<br />
pre {<br />
margin: 0 !important;<br />
padding: 0rem !important; /* add a little inner spacing so text isn’t on the edge */<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);<br />
border: none !important;<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
white-space: pre-wrap !important; /* allows wrapping */<br />
word-break: break-word !important;<br />
line-height: 1 !important;<br />
<br />
}<br />
<br />
.dw-card .pre {<br />
display: block; /* ensures it behaves as a block element */<br />
width: 100% !important;/* takes up the full width of .dw-card */<br />
box-sizing: border-box;/* includes padding/border in width calculation */<br />
margin: 0;<br />
padding: 0;<br />
}<br />
<br />
<br />
div.mw-content-ltr.mw-parser-output {<br />
background: #FFFFFF;<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 97%, rgba(192, 192, 192, 1) 100%);<br />
padding: 1rem;<br />
}<br />
<br />
<br />
<br />
.mw-page-container { <br />
background-image: url("https://dsignweek.servus.at/images/9/9d/Bg-01.png"); background-repeat: repeat-y; <br />
/* ✅ repeat vertically */ background-size: 100% auto; <br />
/* stretch to page width, keep height natural <br />
*/ background-position: center top; <br />
/* start at the top, center horizontally <br />
*/ background-attachment: scroll; <br />
/* move with page scroll */ background-color: #ffffff; /* fallback behind transparent areas */ }<br />
<br />
<br />
div#mw-head {<br />
background: transparent !important;<br />
}<br />
<br />
<br />
.dw-headline, .mw-headline {<br />
margin: 0 !important;<br />
}<br />
<br />
.skin-vector-2022 header.vector-header { box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8)!important; }<br />
<br />
.skin-vector-2022 #vector-sticky-header.vector-sticky-header {<br />
box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8) !important;<br />
}<br />
<br />
/* Global link color */<br />
a,<br />
a:visited,<br />
a:active {<br />
color: #0000FF !important;<br />
}<br />
<br />
/* Optional: link hover color (still blue but darker) */<br />
a:hover {<br />
text-decoration: underline;<br />
}<br />
<br />
<br />
<br />
/* ===== Mobile: stack card content vertically ===== */<br />
@media (max-width: 720px) {<br />
<br />
html, body {<br />
overflow-x: hidden !important;<br />
width: 100% !important;<br />
}<br />
.mw-page-container {<br />
max-width: 100vw !important;<br />
}<br />
<br />
.mw-parser-output {<br />
box-sizing: border-box;<br />
overflow-x: hidden !important;<br />
}<br />
<br />
.banner-icon img, img {<br />
max-width: 100% !important;<br />
width: 100% !important;<br />
object-fit: contain;<br />
}<br />
<br />
.mw-page-container { <br />
background-image: none !important;<br />
background-color: #ffffff !important;<br />
padding: 0 !important; /* ← fixed */<br />
padding-right: 10px !important; /* ← fixed */<br />
padding-left: 10px !important; /* ← fixed */<br />
margin: 0 !important;<br />
box-sizing: border-box;<br />
overflow-x: hidden !important;<br />
}<br />
.dw-col {<br />
flex: 1 1 auto !important; /* let them shrink freely */<br />
min-width: 0 !important; /* remove the minimum width restriction */<br />
}<br />
<br />
.vector-header-container .mw-header, .vector-header-container .vector-sticky-header {<br />
padding-left: 2rem;<br />
padding-right:2rem;<br />
box-sizing: border-box;<br />
}<br />
.mw-header {<br />
gap: 0;<br />
}<br />
.vector-dropdown-content {<br />
width: 100vw !important;<br />
max-width: none !important;<br />
box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8)!important;<br />
}<br />
.dw-card {<br />
padding:0;}<br />
div#content.mw-body {<br />
padding: 0rem;}<br />
div.mw-content-ltr.mw-parser-output {<br />
padding: 0.5rem;<br />
}<br />
<br />
.banner-icon img { <br />
width: 75vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 400px; /* prevent it from getting too big */ <br />
min-width: 80px; /* prevent it from getting too small */ <br />
padding-left: 0rem;}<br />
<br />
/* Stack everything in a column */<br />
.dw-card .dw-row {<br />
display: flex;<br />
flex-direction: column;<br />
align-items: stretch; /* full width for text block */<br />
gap: 10px;<br />
}<br />
<br />
/* Make the icon its own row and center it */<br />
.dw-card .dw-icon {<br />
display: flex;<br />
justify-content: center;<br />
align-items: center;<br />
margin: 0; /* remove any left/right spacing from desktop */<br />
}<br />
<br />
.dw-card .dw-icon img {<br />
width: 72px; /* tidy mobile size */<br />
height: auto;<br />
}<br />
<br />
/* Ensure the text block fills width */<br />
.dw-card .dw-row > div {<br />
width: 100%;<br />
}<br />
<br />
/* Slight spacing tweaks for headings on mobile */<br />
.dw-card .dw-headline {<br />
margin: 4px 0 4px;<br />
}<br />
/* Stack footer sections vertically */<br />
#footer {<br />
display: flex !important;<br />
flex-direction: column !important;<br />
align-items: center !important;<br />
gap: 0 !important;<br />
width: 100% !important;<br />
padding: 1rem 1rem !important;<br />
box-sizing: border-box;<br />
}<br />
<br />
/* Each UL gets full width + centered */<br />
#footer ul {<br />
width: 100% !important;<br />
display: flex !important;<br />
flex-direction: row !important; <br />
justify-content: space-between !important; <br />
align-items: center !important;<br />
margin: 0 !important;<br />
padding: 0 !important;<br />
list-style: none !important;<br />
}<br />
.partner-logos {<br />
display: flex;<br />
flex-wrap: wrap; <br />
justify-content: space-between !important; <br />
align-items: center!important; <br />
gap: 2.2rem; <br />
padding: 0 1rem 1rem 1rem; <br />
background: transparent;<br />
}<br />
#partner-logos { <br />
justify-content: space-between !important; <br />
}<br />
.partner-logos img {<br />
height: 24px;<br />
width: auto;<br />
object-fit:contain;<br />
}<br />
<br />
}</div>
Ivans
https://dsignweek.servus.at/index.php?title=MediaWiki:Common.css&diff=1480
MediaWiki:Common.css
2025-11-20T19:13:30Z
<p>Ivans: </p>
<hr />
<div>/* CSS placed here will be applied to all skins */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
#footer-info-lastmod {<br />
display: none !important;<br />
}<br />
<br />
/* Vector 2022: align user links (language, username, etc.) to the top */<br />
body.skin-vector-2022 .vector-user-links-main {<br />
display: flex; /* make sure it's flexbox */<br />
align-items: flex-start; /* align children to the top of the div */<br />
}<br />
/* Hide the Translate extension banner ("Translate this page; This page has changes…") */<br />
body.skin-vector-2022 .mw-pt-translate-header {<br />
display: none !important;<br />
}<br />
/* Vector 2022 – hide entire tab/navigation bar (left-navigation) for all users */<br />
.skin-vector-2022 #left-navigation {<br />
display: none !important;<br />
}<br />
/* Vector 2022: right-align items in the page toolbar (Edit / View history / Tools) */<br />
.skin-vector-2022 .vector-page-toolbar-container {<br />
display: flex !important;<br />
justify-content: flex-end !important; /* pushes items to the right */<br />
align-items: center; /* vertical alignment */<br />
}<br />
<br />
/* Remove Vector “switch to old look” link + banner */<br />
.skin-vector-2022 .vector-feature-switch,<br />
.skin-vector-2022 a[href*="mw-prefsection-rendering-skin"],<br />
.skin-vector-2022 a[title*="legacy Vector"],<br />
.skin-vector-2022 a[title*="old look"] {<br />
display: none !important;<br />
}<br />
<br />
.mw-anon.skin-vector-2022 #ca-nstab-main, /* page title tab (Main Page / Article) */<br />
.mw-anon.skin-vector-2022 #ca-talk, /* Talk tab */<br />
.mw-anon.skin-vector-2022 #ca-view, /* "Read" tab */<br />
.mw-anon.skin-vector-2022 #ca-history, /* View history */<br />
.mw-anon.skin-vector-2022 #ca-watch,<br />
.mw-anon.skin-vector-2022 #ca-unwatch,<br />
.mw-anon.skin-vector-2022 #ca-more { /* "Tools" dropdown */<br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* === GLOBAL TYPOGRAPHY === */<br />
<br />
/* Base body text — Liberation Sans */<br />
html,<br />
body,<br />
.mw-body,<br />
.mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 1.2rem; /* base = 16px */<br />
line-height: 1.15; <br />
}<br />
<br />
/* Paragraphs and list text */<br />
p, li, td, th {<br />
font-size: 1.1rem; /* slightly larger than base text */<br />
}<br />
<br />
/* === HEADINGS — Linux Libertine === */<br />
h1, h2, h3, h4, h5, h6,<br />
.firstHeading,<br />
.mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
.mw-body h1, .mw-heading1, .mw-body-content h1, .mw-body-content .mw-heading1 { font-size: 3rem; line-height: 1.15; } <br />
<br />
<br />
<br />
/* === SIDEBAR MENU === */<br />
#mw-panel,<br />
.vector-menu-content,<br />
#p-navigation,<br />
#p-tb,<br />
#p-lang {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem; /* sidebar smaller for contrast */<br />
line-height: 1.4;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
#partner-logos {<br />
display: flex;<br />
justify-content: right;<br />
align-items: right;<br />
flex-wrap: wrap;<br />
gap: 1rem;<br />
margin-top:0.8rem;<br />
<br />
}<br />
<br />
#partner-logos img {<br />
height: 32px;<br />
object-fit: contain; /* keeps aspect ratio, fits within the box */<br />
max-width: 100%; /* prevents overflow */<br />
display: block; /* removes inline gaps below images */<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
.wikitable.custom-table {<br />
width: 100%;<br />
border-collapse: separate;<br />
border-spacing: 0;<br />
border: none;<br />
background-color: #fff;<br />
border-radius: 0.5rem;<br />
overflow: hidden; /* so rounded corners clip correctly */<br />
font-size: 0.95rem;<br />
}<br />
<br />
<br />
<br />
/* Header cells */<br />
.wikitable.custom-table th {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
color: #000;<br />
font-weight: 600;<br />
text-align: left;<br />
padding: 0.75rem 1rem;<br />
border-bottom: 2px solid #d0d9ff;<br />
}<br />
<br />
/* Data cells */<br />
.wikitable.custom-table td {<br />
padding: 0.65rem 1rem;<br />
border-bottom: 1px solid #eee;<br />
}<br />
<br />
/* Zebra striping */<br />
.wikitable.custom-table tr:nth-child(even) td {<br />
background-color: #f9fbff;<br />
}<br />
<br />
/* Hover effect */<br />
.wikitable.custom-table tr:hover td {<br />
box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.8)!important;<br />
}<br />
<br />
/* Rounded corners for first & last rows */<br />
.wikitable.custom-table tr:first-child th:first-child {<br />
border-top-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:first-child th:last-child {<br />
border-top-right-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:first-child {<br />
border-bottom-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:last-child {<br />
border-bottom-right-radius: 0.5rem;<br />
}<br />
<br />
<br />
/* === Mobile Responsive Tables (no HTML change needed) === */<br />
@media (max-width: 768px) {<br />
<br />
/* Allow horizontal scrolling on narrow screens */<br />
.wikitable.custom-table {<br />
display: block;<br />
width: 100%;<br />
overflow-x: auto;<br />
-webkit-overflow-scrolling: touch;<br />
}<br />
<br />
/* Prevent collapsing/squeezing of long cell content */<br />
.wikitable.custom-table tr,<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
white-space: nowrap;<br />
}<br />
<br />
/* Optional: slightly reduce padding for small screens */<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
padding: 0.5rem 0.75rem;<br />
}<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* Hide the automatic Tools and Special pages sections */<br />
#p-tb { <br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* MAIN-PAGE */<br />
<br />
/* === FONTS (yours) === */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
.mw-pt-languages {<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);}<br />
/* === GLOBAL TYPOGRAPHY === */<br />
html, body, .mw-body, .mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem;<br />
line-height: 1.1;<br />
}<br />
p, li, td, th { font-size: 1.1rem; line-height: 1.1; }<br />
h1, h2, h3, h4, h5, h6, .firstHeading, .mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
<br />
/* === d*sign week layout === */<br />
:root {<br />
--dw-border: #cfd8e3;<br />
--dw-card-bg: #f8fbff;<br />
}<br />
<br />
/* top ribbon */<br />
.dw-ribbon {<br />
height: 26px;<br />
background: linear-gradient(#8aa9ff, #ffffff);<br />
border-radius: 6px;<br />
margin: 0 0 14px 0;<br />
}<br />
<br />
<br />
.banner {<br />
display: flex;<br />
align-items: center;<br />
justify-content: space-between;<br />
gap: 1.5rem;<br />
padding: 0rem 1rem 0rem 1rem;<br />
text-align: left; /* centers text within its box */<br />
flex-wrap: wrap; <br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
background-size: 100% 200%;<br />
background-position: top;<br />
transition: background-position 0.4s ease-in-out;<br />
}<br />
.banner:hover {<br />
background-position: bottom;<br />
}<br />
<br />
<br />
.banner-icon img { <br />
width: 20vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 650px; /* prevent it from getting too big */ <br />
min-width: 120px; /* prevent it from getting too small */ <br />
padding-left: 2rem;}<br />
<br />
.dw-subtitle {<br />
font-size: 1.5rem;<br />
line-height: 1;<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle-banner {<br />
font-size: 3rem;<br />
}<br />
.dw-subtitle strong {<br />
<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle a {<br />
color: #0000FF !important; /* link color similar to your example */<br />
text-decoration: none;<br />
}<br />
<br />
.dw-subtitle a:hover {<br />
text-decoration: underline;<br />
}<br />
<br />
<br />
/* title & subtitle */<br />
.dw-title {<br />
text-align: center;<br />
line-height: 1.2;<br />
font-size: 2.5rem;<br />
font-weight: 700;<br />
letter-spacing: .02em;<br />
display: block;<br />
}<br />
<br />
<br />
/* grid */<br />
.dw-grid {<br />
display: flex;<br />
flex-wrap: wrap;<br />
gap: 16px;<br />
align-items: flex-start;<br />
margin-top: 14px;<br />
}<br />
.dw-col {<br />
flex: 1 1 520px;<br />
min-width: 320px;<br />
}<br />
<br />
/* cards */<br />
.dw-card {<br />
position: relative;<br />
border: 1px solid #C0C0C0;<br />
background: #FFFFFF !important;<br />
padding: 10px;<br />
margin-bottom: 10px;<br />
}<br />
.dw-card:hover {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 75%, rgba(192, 192, 192, 1) 100%)!important;<br />
}<br />
span.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
<br />
}<br />
<br />
.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 2rem !important; <br />
}<br />
<br />
<br />
.dw-card .dw-row {<br />
display: flex;<br />
flex-wrap: wrap;<br />
align-items: flex-start;<br />
gap: 12px;<br />
width: 100%;<br />
box-sizing: border-box;<br />
padding: 14px; /* ✅ move the spacing here instead of .dw-card */<br />
}<br />
<br />
.dw-card .dw-row > div:last-child {<br />
flex: 1;<br />
min-width: 0; /* ✅ prevents overflow due to long text/links */<br />
}<br />
<br />
.dw-card .dw-icon img { height: auto; }<br />
.dw-card .dw-headline {<br />
display: block;<br />
font-size: 1.5rem;<br />
font-weight: 700;<br />
margin: 0px 0 0px;<br />
}<br />
.dw-card .dw-body { line-height: 1.6; width: 100%;}<br />
.dw-card .dw-body--spacious { line-height: 1.8; }<br />
<br />
<br />
.dw-icon,<br />
.dw-subtitle {<br />
background: transparent !important; /* ✅ makes logo + text boxes transparent */<br />
}<br />
<br />
<br />
/* Code blocks explicitly monospace (so they don't inherit) */<br />
pre, code, kbd, samp, tt, .mw-code {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
text-indent: 0 !important;<br />
}<br />
<br />
/* ===== Remove first-line indentation site-wide ===== */<br />
.mw-parser-output p,<br />
.mw-parser-output li p,<br />
.mw-body-content p,<br />
.dw-card .dw-body p {<br />
text-indent: 0 !important;<br />
}<br />
<br />
<br />
pre {<br />
margin: 0 !important;<br />
padding: 0rem !important; /* add a little inner spacing so text isn’t on the edge */<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);<br />
border: none !important;<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
white-space: pre-wrap !important; /* allows wrapping */<br />
word-break: break-word !important;<br />
line-height: 1 !important;<br />
<br />
}<br />
<br />
.dw-card .pre {<br />
display: block; /* ensures it behaves as a block element */<br />
width: 100% !important;/* takes up the full width of .dw-card */<br />
box-sizing: border-box;/* includes padding/border in width calculation */<br />
margin: 0;<br />
padding: 0;<br />
}<br />
<br />
<br />
div.mw-content-ltr.mw-parser-output {<br />
background: #FFFFFF;<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 97%, rgba(192, 192, 192, 1) 100%);<br />
padding: 1rem;<br />
}<br />
<br />
<br />
<br />
.mw-page-container { <br />
background-image: url("https://dsignweek.servus.at/images/9/9d/Bg-01.png"); background-repeat: repeat-y; <br />
/* ✅ repeat vertically */ background-size: 100% auto; <br />
/* stretch to page width, keep height natural <br />
*/ background-position: center top; <br />
/* start at the top, center horizontally <br />
*/ background-attachment: scroll; <br />
/* move with page scroll */ background-color: #ffffff; /* fallback behind transparent areas */ }<br />
<br />
<br />
div#mw-head {<br />
background: transparent !important;<br />
}<br />
<br />
<br />
.dw-headline, .mw-headline {<br />
margin: 0 !important;<br />
}<br />
<br />
.skin-vector-2022 header.vector-header { box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8)!important; }<br />
<br />
.skin-vector-2022 #vector-sticky-header.vector-sticky-header {<br />
box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8) !important;<br />
}<br />
<br />
/* Global link color */<br />
a,<br />
a:visited,<br />
a:active {<br />
color: #0000FF !important;<br />
}<br />
<br />
/* Optional: link hover color (still blue but darker) */<br />
a:hover {<br />
text-decoration: underline;<br />
}<br />
<br />
<br />
<br />
/* ===== Mobile: stack card content vertically ===== */<br />
@media (max-width: 720px) {<br />
<br />
html, body {<br />
overflow-x: hidden !important;<br />
width: 100% !important;<br />
}<br />
.mw-page-container {<br />
max-width: 100vw !important;<br />
}<br />
<br />
.mw-parser-output {<br />
box-sizing: border-box;<br />
overflow-x: hidden !important;<br />
}<br />
<br />
.banner-icon img, img {<br />
max-width: 100% !important;<br />
width: 100% !important;<br />
object-fit: contain;<br />
}<br />
<br />
.mw-page-container { <br />
background-image: none !important;<br />
background-color: #ffffff !important;<br />
padding: 0 !important; /* ← fixed */<br />
padding-right: 10px !important; /* ← fixed */<br />
padding-left: 10px !important; /* ← fixed */<br />
margin: 0 !important;<br />
box-sizing: border-box;<br />
overflow-x: hidden !important;<br />
}<br />
.dw-col {<br />
flex: 1 1 auto !important; /* let them shrink freely */<br />
min-width: 0 !important; /* remove the minimum width restriction */<br />
}<br />
<br />
.vector-header-container .mw-header, .vector-header-container .vector-sticky-header {<br />
padding-left: 2rem;<br />
padding-right:2rem;<br />
box-sizing: border-box;<br />
}<br />
.mw-header {<br />
gap: 0;<br />
}<br />
.vector-dropdown-content {<br />
width: 100vw !important;<br />
max-width: none !important;<br />
box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8)!important;<br />
}<br />
.dw-card {<br />
padding:0;}<br />
div#content.mw-body {<br />
padding: 0rem;}<br />
div.mw-content-ltr.mw-parser-output {<br />
padding: 0.5rem;<br />
}<br />
<br />
.banner-icon img { <br />
width: 75vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 400px; /* prevent it from getting too big */ <br />
min-width: 80px; /* prevent it from getting too small */ <br />
padding-left: 0rem;}<br />
<br />
/* Stack everything in a column */<br />
.dw-card .dw-row {<br />
display: flex;<br />
flex-direction: column;<br />
align-items: stretch; /* full width for text block */<br />
gap: 10px;<br />
}<br />
<br />
/* Make the icon its own row and center it */<br />
.dw-card .dw-icon {<br />
display: flex;<br />
justify-content: center;<br />
align-items: center;<br />
margin: 0; /* remove any left/right spacing from desktop */<br />
}<br />
<br />
.dw-card .dw-icon img {<br />
width: 72px; /* tidy mobile size */<br />
height: auto;<br />
}<br />
<br />
/* Ensure the text block fills width */<br />
.dw-card .dw-row > div {<br />
width: 100%;<br />
}<br />
<br />
/* Slight spacing tweaks for headings on mobile */<br />
.dw-card .dw-headline {<br />
margin: 4px 0 4px;<br />
}<br />
/* Stack footer sections vertically */<br />
#footer {<br />
display: flex !important;<br />
flex-direction: column !important;<br />
align-items: center !important;<br />
gap: 0 !important;<br />
width: 100% !important;<br />
padding: 1rem 1rem !important;<br />
box-sizing: border-box;<br />
}<br />
<br />
/* Each UL gets full width + centered */<br />
#footer ul {<br />
width: 100% !important;<br />
display: flex !important;<br />
flex-direction: row !important; <br />
justify-content: space-between !important; <br />
align-items: center !important;<br />
margin: 0 !important;<br />
padding: 0 !important;<br />
list-style: none !important;<br />
}<br />
.partner-logos {<br />
display: flex;<br />
flex-wrap: wrap; <br />
justify-content: space-between !important; <br />
align-items: center!important; <br />
gap: 2.2rem; <br />
padding: 0 1rem 1rem 1rem; <br />
background: transparent;<br />
}<br />
#partner-logos { <br />
justify-content: space-between !important; <br />
}<br />
.partner-logos img {<br />
height: 24px;<br />
width: auto;<br />
object-fit:contain;<br />
}<br />
<br />
}</div>
Ivans
https://dsignweek.servus.at/index.php?title=MediaWiki:Common.css&diff=1479
MediaWiki:Common.css
2025-11-20T19:12:02Z
<p>Ivans: </p>
<hr />
<div>/* CSS placed here will be applied to all skins */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
#footer-info-lastmod {<br />
display: none !important;<br />
}<br />
<br />
/* Vector 2022: align user links (language, username, etc.) to the top */<br />
body.skin-vector-2022 .vector-user-links-main {<br />
display: flex; /* make sure it's flexbox */<br />
align-items: flex-start; /* align children to the top of the div */<br />
}<br />
/* Hide the Translate extension banner ("Translate this page; This page has changes…") */<br />
body.skin-vector-2022 .mw-pt-translate-header {<br />
display: none !important;<br />
}<br />
/* Vector 2022 – hide entire tab/navigation bar (left-navigation) for all users */<br />
.skin-vector-2022 #left-navigation {<br />
display: none !important;<br />
}<br />
/* Vector 2022: right-align items in the page toolbar (Edit / View history / Tools) */<br />
.skin-vector-2022 .vector-page-toolbar-container {<br />
display: flex !important;<br />
justify-content: flex-end !important; /* pushes items to the right */<br />
align-items: center; /* vertical alignment */<br />
}<br />
<br />
/* Remove Vector “switch to old look” link + banner */<br />
.skin-vector-2022 .vector-feature-switch,<br />
.skin-vector-2022 a[href*="mw-prefsection-rendering-skin"],<br />
.skin-vector-2022 a[title*="legacy Vector"],<br />
.skin-vector-2022 a[title*="old look"] {<br />
display: none !important;<br />
}<br />
<br />
.mw-anon.skin-vector-2022 #ca-nstab-main, /* page title tab (Main Page / Article) */<br />
.mw-anon.skin-vector-2022 #ca-talk, /* Talk tab */<br />
.mw-anon.skin-vector-2022 #ca-view, /* "Read" tab */<br />
.mw-anon.skin-vector-2022 #ca-history, /* View history */<br />
.mw-anon.skin-vector-2022 #ca-watch,<br />
.mw-anon.skin-vector-2022 #ca-unwatch,<br />
.mw-anon.skin-vector-2022 #ca-more { /* "Tools" dropdown */<br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* === GLOBAL TYPOGRAPHY === */<br />
<br />
/* Base body text — Liberation Sans */<br />
html,<br />
body,<br />
.mw-body,<br />
.mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 1.2rem; /* base = 16px */<br />
line-height: 1.15; <br />
}<br />
<br />
/* Paragraphs and list text */<br />
p, li, td, th {<br />
font-size: 1.1rem; /* slightly larger than base text */<br />
}<br />
<br />
/* === HEADINGS — Linux Libertine === */<br />
h1, h2, h3, h4, h5, h6,<br />
.firstHeading,<br />
.mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
.mw-body h1, .mw-heading1, .mw-body-content h1, .mw-body-content .mw-heading1 { font-size: 3rem; line-height: 1.15; } <br />
<br />
<br />
<br />
/* === SIDEBAR MENU === */<br />
#mw-panel,<br />
.vector-menu-content,<br />
#p-navigation,<br />
#p-tb,<br />
#p-lang {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem; /* sidebar smaller for contrast */<br />
line-height: 1.4;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
#partner-logos {<br />
display: flex;<br />
justify-content: right;<br />
align-items: right;<br />
flex-wrap: wrap;<br />
gap: 1rem;<br />
margin-top:0.8rem;<br />
<br />
}<br />
<br />
#partner-logos img {<br />
height: 32px;<br />
object-fit: contain; /* keeps aspect ratio, fits within the box */<br />
max-width: 100%; /* prevents overflow */<br />
display: block; /* removes inline gaps below images */<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
.wikitable.custom-table {<br />
width: 100%;<br />
border-collapse: separate;<br />
border-spacing: 0;<br />
border: none;<br />
background-color: #fff;<br />
border-radius: 0.5rem;<br />
overflow: hidden; /* so rounded corners clip correctly */<br />
font-size: 0.95rem;<br />
}<br />
<br />
<br />
<br />
/* Header cells */<br />
.wikitable.custom-table th {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
color: #000;<br />
font-weight: 600;<br />
text-align: left;<br />
padding: 0.75rem 1rem;<br />
border-bottom: 2px solid #d0d9ff;<br />
}<br />
<br />
/* Data cells */<br />
.wikitable.custom-table td {<br />
padding: 0.65rem 1rem;<br />
border-bottom: 1px solid #eee;<br />
}<br />
<br />
/* Zebra striping */<br />
.wikitable.custom-table tr:nth-child(even) td {<br />
background-color: #f9fbff;<br />
}<br />
<br />
/* Hover effect */<br />
.wikitable.custom-table tr:hover td {<br />
background: #FFF;<br />
box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.8)!important;<br />
}<br />
<br />
/* Rounded corners for first & last rows */<br />
.wikitable.custom-table tr:first-child th:first-child {<br />
border-top-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:first-child th:last-child {<br />
border-top-right-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:first-child {<br />
border-bottom-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:last-child {<br />
border-bottom-right-radius: 0.5rem;<br />
}<br />
<br />
<br />
/* === Mobile Responsive Tables (no HTML change needed) === */<br />
@media (max-width: 768px) {<br />
<br />
/* Allow horizontal scrolling on narrow screens */<br />
.wikitable.custom-table {<br />
display: block;<br />
width: 100%;<br />
overflow-x: auto;<br />
-webkit-overflow-scrolling: touch;<br />
}<br />
<br />
/* Prevent collapsing/squeezing of long cell content */<br />
.wikitable.custom-table tr,<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
white-space: nowrap;<br />
}<br />
<br />
/* Optional: slightly reduce padding for small screens */<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
padding: 0.5rem 0.75rem;<br />
}<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* Hide the automatic Tools and Special pages sections */<br />
#p-tb { <br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* MAIN-PAGE */<br />
<br />
/* === FONTS (yours) === */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
.mw-pt-languages {<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);}<br />
/* === GLOBAL TYPOGRAPHY === */<br />
html, body, .mw-body, .mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem;<br />
line-height: 1.1;<br />
}<br />
p, li, td, th { font-size: 1.1rem; line-height: 1.1; }<br />
h1, h2, h3, h4, h5, h6, .firstHeading, .mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
<br />
/* === d*sign week layout === */<br />
:root {<br />
--dw-border: #cfd8e3;<br />
--dw-card-bg: #f8fbff;<br />
}<br />
<br />
/* top ribbon */<br />
.dw-ribbon {<br />
height: 26px;<br />
background: linear-gradient(#8aa9ff, #ffffff);<br />
border-radius: 6px;<br />
margin: 0 0 14px 0;<br />
}<br />
<br />
<br />
.banner {<br />
display: flex;<br />
align-items: center;<br />
justify-content: space-between;<br />
gap: 1.5rem;<br />
padding: 0rem 1rem 0rem 1rem;<br />
text-align: left; /* centers text within its box */<br />
flex-wrap: wrap; <br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
background-size: 100% 200%;<br />
background-position: top;<br />
transition: background-position 0.4s ease-in-out;<br />
}<br />
.banner:hover {<br />
background-position: bottom;<br />
}<br />
<br />
<br />
.banner-icon img { <br />
width: 20vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 650px; /* prevent it from getting too big */ <br />
min-width: 120px; /* prevent it from getting too small */ <br />
padding-left: 2rem;}<br />
<br />
.dw-subtitle {<br />
font-size: 1.5rem;<br />
line-height: 1;<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle-banner {<br />
font-size: 3rem;<br />
}<br />
.dw-subtitle strong {<br />
<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle a {<br />
color: #0000FF !important; /* link color similar to your example */<br />
text-decoration: none;<br />
}<br />
<br />
.dw-subtitle a:hover {<br />
text-decoration: underline;<br />
}<br />
<br />
<br />
/* title & subtitle */<br />
.dw-title {<br />
text-align: center;<br />
line-height: 1.2;<br />
font-size: 2.5rem;<br />
font-weight: 700;<br />
letter-spacing: .02em;<br />
display: block;<br />
}<br />
<br />
<br />
/* grid */<br />
.dw-grid {<br />
display: flex;<br />
flex-wrap: wrap;<br />
gap: 16px;<br />
align-items: flex-start;<br />
margin-top: 14px;<br />
}<br />
.dw-col {<br />
flex: 1 1 520px;<br />
min-width: 320px;<br />
}<br />
<br />
/* cards */<br />
.dw-card {<br />
position: relative;<br />
border: 1px solid #C0C0C0;<br />
background: #FFFFFF !important;<br />
padding: 10px;<br />
margin-bottom: 10px;<br />
}<br />
.dw-card:hover {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 75%, rgba(192, 192, 192, 1) 100%)!important;<br />
}<br />
span.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
<br />
}<br />
<br />
.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 2rem !important; <br />
}<br />
<br />
<br />
.dw-card .dw-row {<br />
display: flex;<br />
flex-wrap: wrap;<br />
align-items: flex-start;<br />
gap: 12px;<br />
width: 100%;<br />
box-sizing: border-box;<br />
padding: 14px; /* ✅ move the spacing here instead of .dw-card */<br />
}<br />
<br />
.dw-card .dw-row > div:last-child {<br />
flex: 1;<br />
min-width: 0; /* ✅ prevents overflow due to long text/links */<br />
}<br />
<br />
.dw-card .dw-icon img { height: auto; }<br />
.dw-card .dw-headline {<br />
display: block;<br />
font-size: 1.5rem;<br />
font-weight: 700;<br />
margin: 0px 0 0px;<br />
}<br />
.dw-card .dw-body { line-height: 1.6; width: 100%;}<br />
.dw-card .dw-body--spacious { line-height: 1.8; }<br />
<br />
<br />
.dw-icon,<br />
.dw-subtitle {<br />
background: transparent !important; /* ✅ makes logo + text boxes transparent */<br />
}<br />
<br />
<br />
/* Code blocks explicitly monospace (so they don't inherit) */<br />
pre, code, kbd, samp, tt, .mw-code {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
text-indent: 0 !important;<br />
}<br />
<br />
/* ===== Remove first-line indentation site-wide ===== */<br />
.mw-parser-output p,<br />
.mw-parser-output li p,<br />
.mw-body-content p,<br />
.dw-card .dw-body p {<br />
text-indent: 0 !important;<br />
}<br />
<br />
<br />
pre {<br />
margin: 0 !important;<br />
padding: 0rem !important; /* add a little inner spacing so text isn’t on the edge */<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);<br />
border: none !important;<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
white-space: pre-wrap !important; /* allows wrapping */<br />
word-break: break-word !important;<br />
line-height: 1 !important;<br />
<br />
}<br />
<br />
.dw-card .pre {<br />
display: block; /* ensures it behaves as a block element */<br />
width: 100% !important;/* takes up the full width of .dw-card */<br />
box-sizing: border-box;/* includes padding/border in width calculation */<br />
margin: 0;<br />
padding: 0;<br />
}<br />
<br />
<br />
div.mw-content-ltr.mw-parser-output {<br />
background: #FFFFFF;<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 97%, rgba(192, 192, 192, 1) 100%);<br />
padding: 1rem;<br />
}<br />
<br />
<br />
<br />
.mw-page-container { <br />
background-image: url("https://dsignweek.servus.at/images/9/9d/Bg-01.png"); background-repeat: repeat-y; <br />
/* ✅ repeat vertically */ background-size: 100% auto; <br />
/* stretch to page width, keep height natural <br />
*/ background-position: center top; <br />
/* start at the top, center horizontally <br />
*/ background-attachment: scroll; <br />
/* move with page scroll */ background-color: #ffffff; /* fallback behind transparent areas */ }<br />
<br />
<br />
div#mw-head {<br />
background: transparent !important;<br />
}<br />
<br />
<br />
.dw-headline, .mw-headline {<br />
margin: 0 !important;<br />
}<br />
<br />
.skin-vector-2022 header.vector-header { box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8)!important; }<br />
<br />
.skin-vector-2022 #vector-sticky-header.vector-sticky-header {<br />
box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8) !important;<br />
}<br />
<br />
/* Global link color */<br />
a,<br />
a:visited,<br />
a:active {<br />
color: #0000FF !important;<br />
}<br />
<br />
/* Optional: link hover color (still blue but darker) */<br />
a:hover {<br />
text-decoration: underline;<br />
}<br />
<br />
<br />
<br />
/* ===== Mobile: stack card content vertically ===== */<br />
@media (max-width: 720px) {<br />
<br />
html, body {<br />
overflow-x: hidden !important;<br />
width: 100% !important;<br />
}<br />
.mw-page-container {<br />
max-width: 100vw !important;<br />
}<br />
<br />
.mw-parser-output {<br />
box-sizing: border-box;<br />
overflow-x: hidden !important;<br />
}<br />
<br />
.banner-icon img, img {<br />
max-width: 100% !important;<br />
width: 100% !important;<br />
object-fit: contain;<br />
}<br />
<br />
.mw-page-container { <br />
background-image: none !important;<br />
background-color: #ffffff !important;<br />
padding: 0 !important; /* ← fixed */<br />
padding-right: 10px !important; /* ← fixed */<br />
padding-left: 10px !important; /* ← fixed */<br />
margin: 0 !important;<br />
box-sizing: border-box;<br />
overflow-x: hidden !important;<br />
}<br />
.dw-col {<br />
flex: 1 1 auto !important; /* let them shrink freely */<br />
min-width: 0 !important; /* remove the minimum width restriction */<br />
}<br />
<br />
.vector-header-container .mw-header, .vector-header-container .vector-sticky-header {<br />
padding-left: 2rem;<br />
padding-right:2rem;<br />
box-sizing: border-box;<br />
}<br />
.mw-header {<br />
gap: 0;<br />
}<br />
.vector-dropdown-content {<br />
width: 100vw !important;<br />
max-width: none !important;<br />
box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8)!important;<br />
}<br />
.dw-card {<br />
padding:0;}<br />
div#content.mw-body {<br />
padding: 0rem;}<br />
div.mw-content-ltr.mw-parser-output {<br />
padding: 0.5rem;<br />
}<br />
<br />
.banner-icon img { <br />
width: 75vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 400px; /* prevent it from getting too big */ <br />
min-width: 80px; /* prevent it from getting too small */ <br />
padding-left: 0rem;}<br />
<br />
/* Stack everything in a column */<br />
.dw-card .dw-row {<br />
display: flex;<br />
flex-direction: column;<br />
align-items: stretch; /* full width for text block */<br />
gap: 10px;<br />
}<br />
<br />
/* Make the icon its own row and center it */<br />
.dw-card .dw-icon {<br />
display: flex;<br />
justify-content: center;<br />
align-items: center;<br />
margin: 0; /* remove any left/right spacing from desktop */<br />
}<br />
<br />
.dw-card .dw-icon img {<br />
width: 72px; /* tidy mobile size */<br />
height: auto;<br />
}<br />
<br />
/* Ensure the text block fills width */<br />
.dw-card .dw-row > div {<br />
width: 100%;<br />
}<br />
<br />
/* Slight spacing tweaks for headings on mobile */<br />
.dw-card .dw-headline {<br />
margin: 4px 0 4px;<br />
}<br />
/* Stack footer sections vertically */<br />
#footer {<br />
display: flex !important;<br />
flex-direction: column !important;<br />
align-items: center !important;<br />
gap: 0 !important;<br />
width: 100% !important;<br />
padding: 1rem 1rem !important;<br />
box-sizing: border-box;<br />
}<br />
<br />
/* Each UL gets full width + centered */<br />
#footer ul {<br />
width: 100% !important;<br />
display: flex !important;<br />
flex-direction: row !important; <br />
justify-content: space-between !important; <br />
align-items: center !important;<br />
margin: 0 !important;<br />
padding: 0 !important;<br />
list-style: none !important;<br />
}<br />
.partner-logos {<br />
display: flex;<br />
flex-wrap: wrap; <br />
justify-content: space-between !important; <br />
align-items: center!important; <br />
gap: 2.2rem; <br />
padding: 0 1rem 1rem 1rem; <br />
background: transparent;<br />
}<br />
#partner-logos { <br />
justify-content: space-between !important; <br />
}<br />
.partner-logos img {<br />
height: 24px;<br />
width: auto;<br />
object-fit:contain;<br />
}<br />
<br />
}</div>
Ivans
https://dsignweek.servus.at/index.php?title=For_who(m)_is_the_making%3F&diff=1461
For who(m) is the making?
2025-11-20T14:57:00Z
<p>Ivans: </p>
<hr />
<div><languages/><br />
<translate><br />
<div class="banner"><br />
<div class="banner-icon"><br />
[[File:Lettering.png|class=noviewer|link=]]<br />
</div><br />
<div class="dw-headline mw-headline"><br />
<strong>24th – 30th November 2025</strong> Linz (AT)<br /><br />
@ [https://www.instagram.com/die.schiassn Kulturverein zur Schießhalle],<br />
[https://stwst.at Stadtwerkstatt],<br />
[https://www.ufg.at University of Arts Linz]<br />
</div><br />
</div><br />
<br />
<div class="dw-grid"><br />
<br />
<!-- LEFT COLUMN --><br />
<div class="dw-col"><br />
<br />
<!-- 1. For who(m) is the making? --><br />
<div class="dw-card"><br />
<div class="dw-row"><br />
<div class="dw-icon">[[File:Artboard_4.png|160px|class=noviewer|link=]]</div><br />
<div><br />
<span class="dw-headline mw-headline">For who(m) is the making?</span><br />
<div class="dw-body"><br />
<p>The 2025 edition of the d*sign week is organized around the question “[[For who(m) is the making?]]”, which sets attention on who is involved in the design process and how design connects needs and everyday life. Understanding for whom we design, and the context and practice of the designer, has strong influence on outcomes.</p><br />
<p>Even materials and tools play a role. As a discursive practice, design interacts with aesthetic and artistic intentions. If “contemporary design” is often experienced as excluding and exclusive, how can we make it more accessible? How do we balance the need for accessibility with the ever-evolving language of visual communication?</p><br />
</div><br />
</div><br />
</div><br />
</div><br />
<br />
<!-- 2. Programme --><br />
<div class="dw-card" onclick="window.location.href='https://dsignweek.servus.at/index.php?title=Programme';" style="cursor: pointer;"><br />
<div class="dw-row"><br />
<div class="dw-icon">[[File:Artboard_3.png|160px|class=noviewer|link=]]</div><br />
<div><br />
<span class="dw-headline mw-headline">[https://dsignweek.servus.at/index.php?title=Programme Programme] and [https://dsignweek.servus.at/index.php?title=Festival_contributors Participation]</span><br />
<div class="dw-body"><br />
<p>Structured as a week-long series of workshops, lectures and conversations, the d*sign week investigates how access, participation and inclusion can be values that guide independent design practices. How can they become a common goal in non-commercial and socially-oriented projects?</p><br />
<p>The event wants to be a space for exchange for designers, coders and artists. The programme opens itself up and aims to be accessible for a broader audience—through note-taking, editing and translations across languages and contexts. The exploration of approaches and tools is the ground for collective learning, reflection-in-action and knowledge exchange during the festival.</p><br />
</div><br />
</div><br />
</div><br />
</div><br />
<br />
</div><br />
<br />
<!-- RIGHT COLUMN --><br />
<div class="dw-col"><br />
<br />
<!-- 3. d*sign week 2025 --><br />
<div class="dw-card"><br />
<div class="dw-row"><br />
<div class="dw-icon">[[File:Artboard_1.png|160px|class=noviewer|link=]]</div><br />
<div><br />
<span class="dw-headline mw-headline">d*sign week 2025</span><br />
<div class="dw-body"><br />
<p>The d*sign week is a festival for experimental and independent design practices. It is organized by the initiatives [[Potato Publishing]] and [https://dsignweek.servus.at/index.php?title=Partners_and_supporters servus.at] together with the departments of Visual Communication and Timebased Media of the [https://dsignweek.servus.at/index.php?title=Partners_and_supporters University of Arts Linz].</p><br />
<p>Living in times that require novel forms of being together, the d*sign week proposes asking ourselves “For who(m) is the making?” as a method to radically open the design flow. This creates spaces for new perspectives, alliances and networks of solidarity.</p><br />
</div><br />
</div><br />
</div><br />
</div><br />
<br />
<!-- 4. More about d*sign week --><br />
<div class="dw-card"><br />
<div class="dw-row"><br />
<div class="dw-icon">[[File:Artboard_2.png|160px|class=noviewer|link=]]</div><br />
<div><br />
<span class="dw-headline mw-headline">More about d*sign week</span><br />
<div class="dw-body"><br />
<p><b>Partners:</b> RadioFRO, Stadtwerkstatt STWST.<br /><br />
<b>Participants:</b> [https://dsignweek.servus.at/index.php?title=Festival_contributors Festival Contributors] <br /><br />
<b>Programme:</b> [https://dsignweek.servus.at/index.php?title=Programme 2025 Programme Overview]</p><br />
<p><b>Previous Editions:</b><br /><br />
[https://dsignweek.servus.at/2023 https://dsignweek.servus.at/2023]<br /><br />
[https://dsignweek.servus.at/2021 https://dsignweek.servus.at/2021]</p><br />
</div><br />
</div><br />
</div><br />
</div><br />
<br />
<!-- 5. Support us! --><br />
<div class="dw-card"><br />
<div class="dw-row"><br />
<div class="dw-icon">[[File:DwLogo.png|160px|class=noviewer|link=]]</div><br />
<div><br />
<span class="dw-headline mw-headline">Support us!</span><br />
<div class="dw-body"><br />
<p><b>d*sign week supporters tickets:</b><br />[https://kupfticket.com/en/events/dsign-week-2025 KUPFticket.com]</p><br />
</div><br />
</div><br />
</div><br />
</div><br />
<br />
</div><br />
<br />
</div><br />
<br />
<br />
</translate></div>
Ivans
https://dsignweek.servus.at/index.php?title=MediaWiki:Common.css&diff=1454
MediaWiki:Common.css
2025-11-20T14:50:30Z
<p>Ivans: </p>
<hr />
<div>/* CSS placed here will be applied to all skins */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
#footer-info-lastmod {<br />
display: none !important;<br />
}<br />
<br />
/* Vector 2022: align user links (language, username, etc.) to the top */<br />
body.skin-vector-2022 .vector-user-links-main {<br />
display: flex; /* make sure it's flexbox */<br />
align-items: flex-start; /* align children to the top of the div */<br />
}<br />
/* Hide the Translate extension banner ("Translate this page; This page has changes…") */<br />
body.skin-vector-2022 .mw-pt-translate-header {<br />
display: none !important;<br />
}<br />
/* Vector 2022 – hide entire tab/navigation bar (left-navigation) for all users */<br />
.skin-vector-2022 #left-navigation {<br />
display: none !important;<br />
}<br />
/* Vector 2022: right-align items in the page toolbar (Edit / View history / Tools) */<br />
.skin-vector-2022 .vector-page-toolbar-container {<br />
display: flex !important;<br />
justify-content: flex-end !important; /* pushes items to the right */<br />
align-items: center; /* vertical alignment */<br />
}<br />
<br />
/* Remove Vector “switch to old look” link + banner */<br />
.skin-vector-2022 .vector-feature-switch,<br />
.skin-vector-2022 a[href*="mw-prefsection-rendering-skin"],<br />
.skin-vector-2022 a[title*="legacy Vector"],<br />
.skin-vector-2022 a[title*="old look"] {<br />
display: none !important;<br />
}<br />
<br />
.mw-anon.skin-vector-2022 #ca-nstab-main, /* page title tab (Main Page / Article) */<br />
.mw-anon.skin-vector-2022 #ca-talk, /* Talk tab */<br />
.mw-anon.skin-vector-2022 #ca-view, /* "Read" tab */<br />
.mw-anon.skin-vector-2022 #ca-history, /* View history */<br />
.mw-anon.skin-vector-2022 #ca-watch,<br />
.mw-anon.skin-vector-2022 #ca-unwatch,<br />
.mw-anon.skin-vector-2022 #ca-more { /* "Tools" dropdown */<br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* === GLOBAL TYPOGRAPHY === */<br />
<br />
/* Base body text — Liberation Sans */<br />
html,<br />
body,<br />
.mw-body,<br />
.mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 1.2rem; /* base = 16px */<br />
line-height: 1.15; <br />
}<br />
<br />
/* Paragraphs and list text */<br />
p, li, td, th {<br />
font-size: 1.1rem; /* slightly larger than base text */<br />
}<br />
<br />
/* === HEADINGS — Linux Libertine === */<br />
h1, h2, h3, h4, h5, h6,<br />
.firstHeading,<br />
.mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
.mw-body h1, .mw-heading1, .mw-body-content h1, .mw-body-content .mw-heading1 { font-size: 3rem; line-height: 1.15; } <br />
<br />
<br />
<br />
/* === SIDEBAR MENU === */<br />
#mw-panel,<br />
.vector-menu-content,<br />
#p-navigation,<br />
#p-tb,<br />
#p-lang {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem; /* sidebar smaller for contrast */<br />
line-height: 1.4;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
#partner-logos {<br />
display: flex;<br />
justify-content: right;<br />
align-items: right;<br />
flex-wrap: wrap;<br />
gap: 1rem;<br />
margin-top:0.8rem;<br />
<br />
}<br />
<br />
#partner-logos img {<br />
height: 32px;<br />
object-fit: contain; /* keeps aspect ratio, fits within the box */<br />
max-width: 100%; /* prevents overflow */<br />
display: block; /* removes inline gaps below images */<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
.wikitable.custom-table {<br />
width: 100%;<br />
border-collapse: separate;<br />
border-spacing: 0;<br />
border: none;<br />
background-color: #fff;<br />
border-radius: 0.5rem;<br />
overflow: hidden; /* so rounded corners clip correctly */<br />
font-size: 0.95rem;<br />
}<br />
<br />
<br />
<br />
/* Header cells */<br />
.wikitable.custom-table th {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
color: #000;<br />
font-weight: 600;<br />
text-align: left;<br />
padding: 0.75rem 1rem;<br />
border-bottom: 2px solid #d0d9ff;<br />
}<br />
<br />
/* Data cells */<br />
.wikitable.custom-table td {<br />
padding: 0.65rem 1rem;<br />
border-bottom: 1px solid #eee;<br />
}<br />
<br />
/* Zebra striping */<br />
.wikitable.custom-table tr:nth-child(even) td {<br />
background-color: #f9fbff;<br />
}<br />
<br />
/* Hover effect */<br />
.wikitable.custom-table tr:hover td {<br />
background: #FFF;<br />
background: linear-gradient(0deg,rgba(0, 0, 255, 1) 0%, rgba(255, 255, 255, 1) 15%, rgba(255, 255, 255, 1) 85%, rgba(0, 0, 255, 1) 100%);<br />
}<br />
<br />
/* Rounded corners for first & last rows */<br />
.wikitable.custom-table tr:first-child th:first-child {<br />
border-top-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:first-child th:last-child {<br />
border-top-right-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:first-child {<br />
border-bottom-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:last-child {<br />
border-bottom-right-radius: 0.5rem;<br />
}<br />
<br />
<br />
/* === Mobile Responsive Tables (no HTML change needed) === */<br />
@media (max-width: 768px) {<br />
<br />
/* Allow horizontal scrolling on narrow screens */<br />
.wikitable.custom-table {<br />
display: block;<br />
width: 100%;<br />
overflow-x: auto;<br />
-webkit-overflow-scrolling: touch;<br />
}<br />
<br />
/* Prevent collapsing/squeezing of long cell content */<br />
.wikitable.custom-table tr,<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
white-space: nowrap;<br />
}<br />
<br />
/* Optional: slightly reduce padding for small screens */<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
padding: 0.5rem 0.75rem;<br />
}<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* Hide the automatic Tools and Special pages sections */<br />
#p-tb { <br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* MAIN-PAGE */<br />
<br />
/* === FONTS (yours) === */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
.mw-pt-languages {<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);}<br />
/* === GLOBAL TYPOGRAPHY === */<br />
html, body, .mw-body, .mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem;<br />
line-height: 1.1;<br />
}<br />
p, li, td, th { font-size: 1.1rem; line-height: 1.1; }<br />
h1, h2, h3, h4, h5, h6, .firstHeading, .mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
<br />
/* === d*sign week layout === */<br />
:root {<br />
--dw-border: #cfd8e3;<br />
--dw-card-bg: #f8fbff;<br />
}<br />
<br />
/* top ribbon */<br />
.dw-ribbon {<br />
height: 26px;<br />
background: linear-gradient(#8aa9ff, #ffffff);<br />
border-radius: 6px;<br />
margin: 0 0 14px 0;<br />
}<br />
<br />
<br />
.banner {<br />
display: flex;<br />
align-items: center;<br />
justify-content: space-between;<br />
gap: 1.5rem;<br />
padding: 0rem 1rem 0rem 1rem;<br />
text-align: left; /* centers text within its box */<br />
flex-wrap: wrap; <br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
background-size: 100% 200%;<br />
background-position: top;<br />
transition: background-position 0.4s ease-in-out;<br />
}<br />
.banner:hover {<br />
background-position: bottom;<br />
}<br />
<br />
<br />
.banner-icon img { <br />
width: 20vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 650px; /* prevent it from getting too big */ <br />
min-width: 120px; /* prevent it from getting too small */ <br />
padding-left: 2rem;}<br />
<br />
.dw-subtitle {<br />
font-size: 1.5rem;<br />
line-height: 1;<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle-banner {<br />
font-size: 3rem;<br />
}<br />
.dw-subtitle strong {<br />
<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle a {<br />
color: #0000FF !important; /* link color similar to your example */<br />
text-decoration: none;<br />
}<br />
<br />
.dw-subtitle a:hover {<br />
text-decoration: underline;<br />
}<br />
<br />
<br />
/* title & subtitle */<br />
.dw-title {<br />
text-align: center;<br />
line-height: 1.2;<br />
font-size: 2.5rem;<br />
font-weight: 700;<br />
letter-spacing: .02em;<br />
display: block;<br />
}<br />
<br />
<br />
/* grid */<br />
.dw-grid {<br />
display: flex;<br />
flex-wrap: wrap;<br />
gap: 16px;<br />
align-items: flex-start;<br />
margin-top: 14px;<br />
}<br />
.dw-col {<br />
flex: 1 1 520px;<br />
min-width: 320px;<br />
}<br />
<br />
/* cards */<br />
.dw-card {<br />
position: relative;<br />
border: 1px solid #C0C0C0;<br />
background: #FFFFFF !important;<br />
padding: 10px;<br />
margin-bottom: 10px;<br />
}<br />
.dw-card:hover {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 75%, rgba(192, 192, 192, 1) 100%)!important;<br />
}<br />
span.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
<br />
}<br />
<br />
.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 2rem !important; <br />
}<br />
<br />
<br />
.dw-card .dw-row {<br />
display: flex;<br />
flex-wrap: wrap;<br />
align-items: flex-start;<br />
gap: 12px;<br />
width: 100%;<br />
box-sizing: border-box;<br />
padding: 14px; /* ✅ move the spacing here instead of .dw-card */<br />
}<br />
<br />
.dw-card .dw-row > div:last-child {<br />
flex: 1;<br />
min-width: 0; /* ✅ prevents overflow due to long text/links */<br />
}<br />
<br />
.dw-card .dw-icon img { height: auto; }<br />
.dw-card .dw-headline {<br />
display: block;<br />
font-size: 1.5rem;<br />
font-weight: 700;<br />
margin: 0px 0 0px;<br />
}<br />
.dw-card .dw-body { line-height: 1.6; width: 100%;}<br />
.dw-card .dw-body--spacious { line-height: 1.8; }<br />
<br />
<br />
.dw-icon,<br />
.dw-subtitle {<br />
background: transparent !important; /* ✅ makes logo + text boxes transparent */<br />
}<br />
<br />
<br />
/* Code blocks explicitly monospace (so they don't inherit) */<br />
pre, code, kbd, samp, tt, .mw-code {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
text-indent: 0 !important;<br />
}<br />
<br />
/* ===== Remove first-line indentation site-wide ===== */<br />
.mw-parser-output p,<br />
.mw-parser-output li p,<br />
.mw-body-content p,<br />
.dw-card .dw-body p {<br />
text-indent: 0 !important;<br />
}<br />
<br />
<br />
pre {<br />
margin: 0 !important;<br />
padding: 0rem !important; /* add a little inner spacing so text isn’t on the edge */<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);<br />
border: none !important;<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
white-space: pre-wrap !important; /* allows wrapping */<br />
word-break: break-word !important;<br />
line-height: 1 !important;<br />
<br />
}<br />
<br />
.dw-card .pre {<br />
display: block; /* ensures it behaves as a block element */<br />
width: 100% !important;/* takes up the full width of .dw-card */<br />
box-sizing: border-box;/* includes padding/border in width calculation */<br />
margin: 0;<br />
padding: 0;<br />
}<br />
<br />
<br />
div.mw-content-ltr.mw-parser-output {<br />
background: #FFFFFF;<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 97%, rgba(192, 192, 192, 1) 100%);<br />
padding: 1rem;<br />
}<br />
<br />
<br />
<br />
.mw-page-container { <br />
background-image: url("https://dsignweek.servus.at/images/9/9d/Bg-01.png"); background-repeat: repeat-y; <br />
/* ✅ repeat vertically */ background-size: 100% auto; <br />
/* stretch to page width, keep height natural <br />
*/ background-position: center top; <br />
/* start at the top, center horizontally <br />
*/ background-attachment: scroll; <br />
/* move with page scroll */ background-color: #ffffff; /* fallback behind transparent areas */ }<br />
<br />
<br />
div#mw-head {<br />
background: transparent !important;<br />
}<br />
<br />
<br />
.dw-headline, .mw-headline {<br />
margin: 0 !important;<br />
}<br />
<br />
.skin-vector-2022 header.vector-header { box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8)!important; }<br />
<br />
.skin-vector-2022 #vector-sticky-header.vector-sticky-header {<br />
box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8) !important;<br />
}<br />
<br />
/* Global link color */<br />
a,<br />
a:visited,<br />
a:active {<br />
color: #0000FF !important;<br />
}<br />
<br />
/* Optional: link hover color (still blue but darker) */<br />
a:hover {<br />
text-decoration: underline;<br />
}<br />
<br />
<br />
<br />
/* ===== Mobile: stack card content vertically ===== */<br />
@media (max-width: 720px) {<br />
<br />
html, body {<br />
overflow-x: hidden !important;<br />
width: 100% !important;<br />
}<br />
.mw-page-container {<br />
max-width: 100vw !important;<br />
}<br />
<br />
.mw-parser-output {<br />
box-sizing: border-box;<br />
overflow-x: hidden !important;<br />
}<br />
<br />
.banner-icon img, img {<br />
max-width: 100% !important;<br />
width: 100% !important;<br />
object-fit: contain;<br />
}<br />
<br />
.mw-page-container { <br />
background-image: none !important;<br />
background-color: #ffffff !important;<br />
padding: 0 !important; /* ← fixed */<br />
padding-right: 10px !important; /* ← fixed */<br />
padding-left: 10px !important; /* ← fixed */<br />
margin: 0 !important;<br />
box-sizing: border-box;<br />
overflow-x: hidden !important;<br />
}<br />
.dw-col {<br />
flex: 1 1 auto !important; /* let them shrink freely */<br />
min-width: 0 !important; /* remove the minimum width restriction */<br />
}<br />
<br />
.vector-header-container .mw-header, .vector-header-container .vector-sticky-header {<br />
padding-left: 2rem;<br />
padding-right:2rem;<br />
box-sizing: border-box;<br />
}<br />
.mw-header {<br />
gap: 0;<br />
}<br />
.vector-dropdown-content {<br />
width: 100vw !important;<br />
max-width: none !important;<br />
box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8)!important;<br />
}<br />
.dw-card {<br />
padding:0;}<br />
div#content.mw-body {<br />
padding: 0rem;}<br />
div.mw-content-ltr.mw-parser-output {<br />
padding: 0.5rem;<br />
}<br />
<br />
.banner-icon img { <br />
width: 75vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 400px; /* prevent it from getting too big */ <br />
min-width: 80px; /* prevent it from getting too small */ <br />
padding-left: 0rem;}<br />
<br />
/* Stack everything in a column */<br />
.dw-card .dw-row {<br />
display: flex;<br />
flex-direction: column;<br />
align-items: stretch; /* full width for text block */<br />
gap: 10px;<br />
}<br />
<br />
/* Make the icon its own row and center it */<br />
.dw-card .dw-icon {<br />
display: flex;<br />
justify-content: center;<br />
align-items: center;<br />
margin: 0; /* remove any left/right spacing from desktop */<br />
}<br />
<br />
.dw-card .dw-icon img {<br />
width: 72px; /* tidy mobile size */<br />
height: auto;<br />
}<br />
<br />
/* Ensure the text block fills width */<br />
.dw-card .dw-row > div {<br />
width: 100%;<br />
}<br />
<br />
/* Slight spacing tweaks for headings on mobile */<br />
.dw-card .dw-headline {<br />
margin: 4px 0 4px;<br />
}<br />
/* Stack footer sections vertically */<br />
#footer {<br />
display: flex !important;<br />
flex-direction: column !important;<br />
align-items: center !important;<br />
gap: 0 !important;<br />
width: 100% !important;<br />
padding: 1rem 1rem !important;<br />
box-sizing: border-box;<br />
}<br />
<br />
/* Each UL gets full width + centered */<br />
#footer ul {<br />
width: 100% !important;<br />
display: flex !important;<br />
flex-direction: row !important; <br />
justify-content: space-between !important; <br />
align-items: center !important;<br />
margin: 0 !important;<br />
padding: 0 !important;<br />
list-style: none !important;<br />
}<br />
.partner-logos {<br />
display: flex;<br />
flex-wrap: wrap; <br />
justify-content: space-between !important; <br />
align-items: center!important; <br />
gap: 2.2rem; <br />
padding: 0 1rem 1rem 1rem; <br />
background: transparent;<br />
}<br />
#partner-logos { <br />
justify-content: space-between !important; <br />
}<br />
.partner-logos img {<br />
height: 24px;<br />
width: auto;<br />
object-fit:contain;<br />
}<br />
<br />
}</div>
Ivans
https://dsignweek.servus.at/index.php?title=MediaWiki:Common.css&diff=1453
MediaWiki:Common.css
2025-11-20T14:49:36Z
<p>Ivans: </p>
<hr />
<div>/* CSS placed here will be applied to all skins */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
#footer-info-lastmod {<br />
display: none !important;<br />
}<br />
<br />
/* Vector 2022: align user links (language, username, etc.) to the top */<br />
body.skin-vector-2022 .vector-user-links-main {<br />
display: flex; /* make sure it's flexbox */<br />
align-items: flex-start; /* align children to the top of the div */<br />
}<br />
/* Hide the Translate extension banner ("Translate this page; This page has changes…") */<br />
body.skin-vector-2022 .mw-pt-translate-header {<br />
display: none !important;<br />
}<br />
/* Vector 2022 – hide entire tab/navigation bar (left-navigation) for all users */<br />
.skin-vector-2022 #left-navigation {<br />
display: none !important;<br />
}<br />
/* Vector 2022: right-align items in the page toolbar (Edit / View history / Tools) */<br />
.skin-vector-2022 .vector-page-toolbar-container {<br />
display: flex !important;<br />
justify-content: flex-end !important; /* pushes items to the right */<br />
align-items: center; /* vertical alignment */<br />
}<br />
<br />
/* Remove Vector “switch to old look” link + banner */<br />
.skin-vector-2022 .vector-feature-switch,<br />
.skin-vector-2022 a[href*="mw-prefsection-rendering-skin"],<br />
.skin-vector-2022 a[title*="legacy Vector"],<br />
.skin-vector-2022 a[title*="old look"] {<br />
display: none !important;<br />
}<br />
<br />
.mw-anon.skin-vector-2022 #ca-nstab-main, /* page title tab (Main Page / Article) */<br />
.mw-anon.skin-vector-2022 #ca-talk, /* Talk tab */<br />
.mw-anon.skin-vector-2022 #ca-view, /* "Read" tab */<br />
.mw-anon.skin-vector-2022 #ca-history, /* View history */<br />
.mw-anon.skin-vector-2022 #ca-watch,<br />
.mw-anon.skin-vector-2022 #ca-unwatch,<br />
.mw-anon.skin-vector-2022 #ca-more { /* "Tools" dropdown */<br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* === GLOBAL TYPOGRAPHY === */<br />
<br />
/* Base body text — Liberation Sans */<br />
html,<br />
body,<br />
.mw-body,<br />
.mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 1.2rem; /* base = 16px */<br />
line-height: 1.15; <br />
}<br />
<br />
/* Paragraphs and list text */<br />
p, li, td, th {<br />
font-size: 1.1rem; /* slightly larger than base text */<br />
}<br />
<br />
/* === HEADINGS — Linux Libertine === */<br />
h1, h2, h3, h4, h5, h6,<br />
.firstHeading,<br />
.mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
.mw-body h1, .mw-heading1, .mw-body-content h1, .mw-body-content .mw-heading1 { font-size: 3rem; line-height: 1.15; } <br />
<br />
<br />
<br />
/* === SIDEBAR MENU === */<br />
#mw-panel,<br />
.vector-menu-content,<br />
#p-navigation,<br />
#p-tb,<br />
#p-lang {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem; /* sidebar smaller for contrast */<br />
line-height: 1.4;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
#partner-logos {<br />
display: flex;<br />
justify-content: right;<br />
align-items: right;<br />
flex-wrap: wrap;<br />
gap: 1rem;<br />
margin-top:0.8rem;<br />
<br />
}<br />
<br />
#partner-logos img {<br />
height: 32px;<br />
object-fit: contain; /* keeps aspect ratio, fits within the box */<br />
max-width: 100%; /* prevents overflow */<br />
display: block; /* removes inline gaps below images */<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
.wikitable.custom-table {<br />
width: 100%;<br />
border-collapse: separate;<br />
border-spacing: 0;<br />
border: none;<br />
background-color: #fff;<br />
border-radius: 0.5rem;<br />
overflow: hidden; /* so rounded corners clip correctly */<br />
font-size: 0.95rem;<br />
}<br />
<br />
<br />
<br />
/* Header cells */<br />
.wikitable.custom-table th {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
color: #000;<br />
font-weight: 600;<br />
text-align: left;<br />
padding: 0.75rem 1rem;<br />
border-bottom: 2px solid #d0d9ff;<br />
}<br />
<br />
/* Data cells */<br />
.wikitable.custom-table td {<br />
padding: 0.65rem 1rem;<br />
border-bottom: 1px solid #eee;<br />
}<br />
<br />
/* Zebra striping */<br />
.wikitable.custom-table tr:nth-child(even) td {<br />
background-color: #f9fbff;<br />
}<br />
<br />
/* Hover effect */<br />
.wikitable.custom-table tr:hover td {<br />
background: #FFF;<br />
background: linear-gradient(0deg,rgba(0, 0, 255, 1) 0%, rgba(255, 255, 255, 1) 15%, rgba(255, 255, 255, 1) 85%, rgba(0, 0, 255, 1) 100%);<br />
}<br />
<br />
/* Rounded corners for first & last rows */<br />
.wikitable.custom-table tr:first-child th:first-child {<br />
border-top-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:first-child th:last-child {<br />
border-top-right-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:first-child {<br />
border-bottom-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:last-child {<br />
border-bottom-right-radius: 0.5rem;<br />
}<br />
<br />
<br />
/* === Mobile Responsive Tables (no HTML change needed) === */<br />
@media (max-width: 768px) {<br />
<br />
/* Allow horizontal scrolling on narrow screens */<br />
.wikitable.custom-table {<br />
display: block;<br />
width: 100%;<br />
overflow-x: auto;<br />
-webkit-overflow-scrolling: touch;<br />
}<br />
<br />
/* Prevent collapsing/squeezing of long cell content */<br />
.wikitable.custom-table tr,<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
white-space: nowrap;<br />
}<br />
<br />
/* Optional: slightly reduce padding for small screens */<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
padding: 0.5rem 0.75rem;<br />
}<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* Hide the automatic Tools and Special pages sections */<br />
#p-tb { <br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* MAIN-PAGE */<br />
<br />
/* === FONTS (yours) === */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
.mw-pt-languages {<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);}<br />
/* === GLOBAL TYPOGRAPHY === */<br />
html, body, .mw-body, .mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem;<br />
line-height: 1.1;<br />
}<br />
p, li, td, th { font-size: 1.1rem; line-height: 1.1; }<br />
h1, h2, h3, h4, h5, h6, .firstHeading, .mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
<br />
/* === d*sign week layout === */<br />
:root {<br />
--dw-border: #cfd8e3;<br />
--dw-card-bg: #f8fbff;<br />
}<br />
<br />
/* top ribbon */<br />
.dw-ribbon {<br />
height: 26px;<br />
background: linear-gradient(#8aa9ff, #ffffff);<br />
border-radius: 6px;<br />
margin: 0 0 14px 0;<br />
}<br />
<br />
<br />
.banner {<br />
display: flex;<br />
align-items: center;<br />
justify-content: space-between;<br />
gap: 1.5rem;<br />
padding: 0rem 1rem 0rem 1rem;<br />
text-align: left; /* centers text within its box */<br />
flex-wrap: wrap; <br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
background-size: 100% 200%;<br />
background-position: top;<br />
transition: background-position 0.4s ease-in-out;<br />
}<br />
.banner:hover {<br />
background-position: bottom;<br />
}<br />
<br />
<br />
.banner-icon img { <br />
width: 20vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 650px; /* prevent it from getting too big */ <br />
min-width: 120px; /* prevent it from getting too small */ <br />
padding-left: 2rem;}<br />
<br />
.dw-subtitle {<br />
font-size: 1.5rem;<br />
line-height: 1;<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle-banner {<br />
font-size: 3rem;<br />
}<br />
.dw-subtitle strong {<br />
<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle a {<br />
color: #0000FF !important; /* link color similar to your example */<br />
text-decoration: none;<br />
}<br />
<br />
.dw-subtitle a:hover {<br />
text-decoration: underline;<br />
}<br />
<br />
<br />
/* title & subtitle */<br />
.dw-title {<br />
text-align: center;<br />
line-height: 1.2;<br />
font-size: 2.5rem;<br />
font-weight: 700;<br />
letter-spacing: .02em;<br />
display: block;<br />
}<br />
<br />
<br />
/* grid */<br />
.dw-grid {<br />
display: flex;<br />
flex-wrap: wrap;<br />
gap: 16px;<br />
align-items: flex-start;<br />
margin-top: 14px;<br />
}<br />
.dw-col {<br />
flex: 1 1 520px;<br />
min-width: 320px;<br />
}<br />
<br />
/* cards */<br />
.dw-card {<br />
position: relative;<br />
border: 1px solid #C0C0C0;<br />
background: #FFFFFF !important;<br />
padding: 10px;<br />
margin-bottom: 10px;<br />
}<br />
.dw-card:hover {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 75%, rgba(192, 192, 192, 1) 100%)!important;<br />
}<br />
span.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
<br />
}<br />
<br />
.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 2rem !important; <br />
}<br />
<br />
<br />
.dw-card .dw-row {<br />
display: flex;<br />
flex-wrap: wrap;<br />
align-items: flex-start;<br />
gap: 12px;<br />
width: 100%;<br />
box-sizing: border-box;<br />
padding: 14px; /* ✅ move the spacing here instead of .dw-card */<br />
}<br />
<br />
.dw-card .dw-row > div:last-child {<br />
flex: 1;<br />
min-width: 0; /* ✅ prevents overflow due to long text/links */<br />
}<br />
<br />
.dw-card .dw-icon img { height: auto; }<br />
.dw-card .dw-headline {<br />
display: block;<br />
font-size: 1.5rem;<br />
font-weight: 700;<br />
margin: 0px 0 0px;<br />
}<br />
.dw-card .dw-body { line-height: 1.6; width: 100%;}<br />
.dw-card .dw-body--spacious { line-height: 1.8; }<br />
<br />
<br />
.dw-icon,<br />
.dw-subtitle {<br />
background: transparent !important; /* ✅ makes logo + text boxes transparent */<br />
}<br />
<br />
<br />
/* Code blocks explicitly monospace (so they don't inherit) */<br />
pre, code, kbd, samp, tt, .mw-code {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
text-indent: 0 !important;<br />
}<br />
<br />
/* ===== Remove first-line indentation site-wide ===== */<br />
.mw-parser-output p,<br />
.mw-parser-output li p,<br />
.mw-body-content p,<br />
.dw-card .dw-body p {<br />
text-indent: 0 !important;<br />
}<br />
<br />
<br />
pre {<br />
margin: 0 !important;<br />
padding: 0rem !important; /* add a little inner spacing so text isn’t on the edge */<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);<br />
border: none !important;<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
white-space: pre-wrap !important; /* allows wrapping */<br />
word-break: break-word !important;<br />
line-height: 1 !important;<br />
<br />
}<br />
<br />
.dw-card .pre {<br />
display: block; /* ensures it behaves as a block element */<br />
width: 100% !important;/* takes up the full width of .dw-card */<br />
box-sizing: border-box;/* includes padding/border in width calculation */<br />
margin: 0;<br />
padding: 0;<br />
}<br />
<br />
<br />
div.mw-content-ltr.mw-parser-output {<br />
background: #FFFFFF;<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 97%, rgba(192, 192, 192, 1) 100%);<br />
padding: 1rem;<br />
}<br />
<br />
<br />
<br />
.mw-page-container { <br />
background-image: url("https://dsignweek.servus.at/images/9/9d/Bg-01.png"); background-repeat: repeat-y; <br />
/* ✅ repeat vertically */ background-size: 100% auto; <br />
/* stretch to page width, keep height natural <br />
*/ background-position: center top; <br />
/* start at the top, center horizontally <br />
*/ background-attachment: scroll; <br />
/* move with page scroll */ background-color: #ffffff; /* fallback behind transparent areas */ }<br />
<br />
<br />
div#mw-head {<br />
background: transparent !important;<br />
}<br />
<br />
<br />
.dw-headline, .mw-headline {<br />
margin: 0 !important;<br />
}<br />
<br />
.skin-vector-2022 header.vector-header { box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8)!important; }<br />
<br />
.skin-vector-2022 #vector-sticky-header.vector-sticky-header {<br />
box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8) !important;<br />
}<br />
<br />
/* Global link color */<br />
a,<br />
a:visited,<br />
a:active {<br />
color: #0000FF !important;<br />
}<br />
<br />
/* Optional: link hover color (still blue but darker) */<br />
a:hover {<br />
text-decoration: underline;<br />
}<br />
<br />
<br />
<br />
/* ===== Mobile: stack card content vertically ===== */<br />
@media (max-width: 720px) {<br />
<br />
html, body {<br />
overflow-x: hidden !important;<br />
width: 100% !important;<br />
}<br />
.mw-page-container {<br />
max-width: 100vw !important;<br />
}<br />
<br />
.mw-parser-output {<br />
box-sizing: border-box;<br />
overflow-x: hidden !important;<br />
}<br />
<br />
.banner-icon img, img {<br />
max-width: 100% !important;<br />
width: 100% !important;<br />
object-fit: contain;<br />
}<br />
<br />
.mw-page-container { <br />
background-image: none !important;<br />
background-color: #ffffff !important;<br />
padding: 0 !important; /* ← fixed */<br />
padding-right: 10px !important; /* ← fixed */<br />
padding-left: 10px !important; /* ← fixed */<br />
margin: 0 !important;<br />
box-sizing: border-box;<br />
overflow-x: hidden !important;<br />
}<br />
.dw-col {<br />
flex: 1 1 auto !important; /* let them shrink freely */<br />
min-width: 0 !important; /* remove the minimum width restriction */<br />
}<br />
<br />
.vector-header-container .mw-header, .vector-header-container .vector-sticky-header {<br />
padding-left: 2rem;<br />
padding-right:2rem;<br />
box-sizing: border-box;<br />
}<br />
.mw-header {<br />
gap: 2px;<br />
}<br />
.vector-dropdown-content {<br />
width: 100vw !important;<br />
max-width: none !important;<br />
box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8)!important;<br />
}<br />
.dw-card {<br />
padding:0;}<br />
div#content.mw-body {<br />
padding: 0rem;}<br />
div.mw-content-ltr.mw-parser-output {<br />
padding: 0.5rem;<br />
}<br />
<br />
.banner-icon img { <br />
width: 75vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 400px; /* prevent it from getting too big */ <br />
min-width: 80px; /* prevent it from getting too small */ <br />
padding-left: 0rem;}<br />
<br />
/* Stack everything in a column */<br />
.dw-card .dw-row {<br />
display: flex;<br />
flex-direction: column;<br />
align-items: stretch; /* full width for text block */<br />
gap: 10px;<br />
}<br />
<br />
/* Make the icon its own row and center it */<br />
.dw-card .dw-icon {<br />
display: flex;<br />
justify-content: center;<br />
align-items: center;<br />
margin: 0; /* remove any left/right spacing from desktop */<br />
}<br />
<br />
.dw-card .dw-icon img {<br />
width: 72px; /* tidy mobile size */<br />
height: auto;<br />
}<br />
<br />
/* Ensure the text block fills width */<br />
.dw-card .dw-row > div {<br />
width: 100%;<br />
}<br />
<br />
/* Slight spacing tweaks for headings on mobile */<br />
.dw-card .dw-headline {<br />
margin: 4px 0 4px;<br />
}<br />
/* Stack footer sections vertically */<br />
#footer {<br />
display: flex !important;<br />
flex-direction: column !important;<br />
align-items: center !important;<br />
gap: 0 !important;<br />
width: 100% !important;<br />
padding: 1rem 1rem !important;<br />
box-sizing: border-box;<br />
}<br />
<br />
/* Each UL gets full width + centered */<br />
#footer ul {<br />
width: 100% !important;<br />
display: flex !important;<br />
flex-direction: row !important; <br />
justify-content: space-between !important; <br />
align-items: center !important;<br />
margin: 0 !important;<br />
padding: 0 !important;<br />
list-style: none !important;<br />
}<br />
.partner-logos {<br />
display: flex;<br />
flex-wrap: wrap; <br />
justify-content: space-between !important; <br />
align-items: center!important; <br />
gap: 2.2rem; <br />
padding: 0 1rem 1rem 1rem; <br />
background: transparent;<br />
}<br />
#partner-logos { <br />
justify-content: space-between !important; <br />
}<br />
.partner-logos img {<br />
height: 24px;<br />
width: auto;<br />
object-fit:contain;<br />
}<br />
<br />
}</div>
Ivans
https://dsignweek.servus.at/index.php?title=MediaWiki:Common.css&diff=1452
MediaWiki:Common.css
2025-11-20T14:46:55Z
<p>Ivans: </p>
<hr />
<div>/* CSS placed here will be applied to all skins */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
#footer-info-lastmod {<br />
display: none !important;<br />
}<br />
<br />
/* Vector 2022: align user links (language, username, etc.) to the top */<br />
body.skin-vector-2022 .vector-user-links-main {<br />
display: flex; /* make sure it's flexbox */<br />
align-items: flex-start; /* align children to the top of the div */<br />
}<br />
/* Hide the Translate extension banner ("Translate this page; This page has changes…") */<br />
body.skin-vector-2022 .mw-pt-translate-header {<br />
display: none !important;<br />
}<br />
/* Vector 2022 – hide entire tab/navigation bar (left-navigation) for all users */<br />
.skin-vector-2022 #left-navigation {<br />
display: none !important;<br />
}<br />
/* Vector 2022: right-align items in the page toolbar (Edit / View history / Tools) */<br />
.skin-vector-2022 .vector-page-toolbar-container {<br />
display: flex !important;<br />
justify-content: flex-end !important; /* pushes items to the right */<br />
align-items: center; /* vertical alignment */<br />
}<br />
<br />
/* Remove Vector “switch to old look” link + banner */<br />
.skin-vector-2022 .vector-feature-switch,<br />
.skin-vector-2022 a[href*="mw-prefsection-rendering-skin"],<br />
.skin-vector-2022 a[title*="legacy Vector"],<br />
.skin-vector-2022 a[title*="old look"] {<br />
display: none !important;<br />
}<br />
<br />
.mw-anon.skin-vector-2022 #ca-nstab-main, /* page title tab (Main Page / Article) */<br />
.mw-anon.skin-vector-2022 #ca-talk, /* Talk tab */<br />
.mw-anon.skin-vector-2022 #ca-view, /* "Read" tab */<br />
.mw-anon.skin-vector-2022 #ca-history, /* View history */<br />
.mw-anon.skin-vector-2022 #ca-watch,<br />
.mw-anon.skin-vector-2022 #ca-unwatch,<br />
.mw-anon.skin-vector-2022 #ca-more { /* "Tools" dropdown */<br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* === GLOBAL TYPOGRAPHY === */<br />
<br />
/* Base body text — Liberation Sans */<br />
html,<br />
body,<br />
.mw-body,<br />
.mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 1.2rem; /* base = 16px */<br />
line-height: 1.15; <br />
}<br />
<br />
/* Paragraphs and list text */<br />
p, li, td, th {<br />
font-size: 1.1rem; /* slightly larger than base text */<br />
}<br />
<br />
/* === HEADINGS — Linux Libertine === */<br />
h1, h2, h3, h4, h5, h6,<br />
.firstHeading,<br />
.mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
.mw-body h1, .mw-heading1, .mw-body-content h1, .mw-body-content .mw-heading1 { font-size: 3rem; line-height: 1.15; } <br />
<br />
<br />
<br />
/* === SIDEBAR MENU === */<br />
#mw-panel,<br />
.vector-menu-content,<br />
#p-navigation,<br />
#p-tb,<br />
#p-lang {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem; /* sidebar smaller for contrast */<br />
line-height: 1.4;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
#partner-logos {<br />
display: flex;<br />
justify-content: right;<br />
align-items: right;<br />
flex-wrap: wrap;<br />
gap: 1rem;<br />
margin-top:0.8rem;<br />
<br />
}<br />
<br />
#partner-logos img {<br />
height: 32px;<br />
object-fit: contain; /* keeps aspect ratio, fits within the box */<br />
max-width: 100%; /* prevents overflow */<br />
display: block; /* removes inline gaps below images */<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
.wikitable.custom-table {<br />
width: 100%;<br />
border-collapse: separate;<br />
border-spacing: 0;<br />
border: none;<br />
background-color: #fff;<br />
border-radius: 0.5rem;<br />
overflow: hidden; /* so rounded corners clip correctly */<br />
font-size: 0.95rem;<br />
}<br />
<br />
<br />
<br />
/* Header cells */<br />
.wikitable.custom-table th {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
color: #000;<br />
font-weight: 600;<br />
text-align: left;<br />
padding: 0.75rem 1rem;<br />
border-bottom: 2px solid #d0d9ff;<br />
}<br />
<br />
/* Data cells */<br />
.wikitable.custom-table td {<br />
padding: 0.65rem 1rem;<br />
border-bottom: 1px solid #eee;<br />
}<br />
<br />
/* Zebra striping */<br />
.wikitable.custom-table tr:nth-child(even) td {<br />
background-color: #f9fbff;<br />
}<br />
<br />
/* Hover effect */<br />
.wikitable.custom-table tr:hover td {<br />
background: #FFF;<br />
background: linear-gradient(0deg,rgba(0, 0, 255, 1) 0%, rgba(255, 255, 255, 1) 15%, rgba(255, 255, 255, 1) 85%, rgba(0, 0, 255, 1) 100%);<br />
}<br />
<br />
/* Rounded corners for first & last rows */<br />
.wikitable.custom-table tr:first-child th:first-child {<br />
border-top-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:first-child th:last-child {<br />
border-top-right-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:first-child {<br />
border-bottom-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:last-child {<br />
border-bottom-right-radius: 0.5rem;<br />
}<br />
<br />
<br />
/* === Mobile Responsive Tables (no HTML change needed) === */<br />
@media (max-width: 768px) {<br />
<br />
/* Allow horizontal scrolling on narrow screens */<br />
.wikitable.custom-table {<br />
display: block;<br />
width: 100%;<br />
overflow-x: auto;<br />
-webkit-overflow-scrolling: touch;<br />
}<br />
<br />
/* Prevent collapsing/squeezing of long cell content */<br />
.wikitable.custom-table tr,<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
white-space: nowrap;<br />
}<br />
<br />
/* Optional: slightly reduce padding for small screens */<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
padding: 0.5rem 0.75rem;<br />
}<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* Hide the automatic Tools and Special pages sections */<br />
#p-tb { <br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* MAIN-PAGE */<br />
<br />
/* === FONTS (yours) === */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
.mw-pt-languages {<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);}<br />
/* === GLOBAL TYPOGRAPHY === */<br />
html, body, .mw-body, .mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem;<br />
line-height: 1.1;<br />
}<br />
p, li, td, th { font-size: 1.1rem; line-height: 1.1; }<br />
h1, h2, h3, h4, h5, h6, .firstHeading, .mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
<br />
/* === d*sign week layout === */<br />
:root {<br />
--dw-border: #cfd8e3;<br />
--dw-card-bg: #f8fbff;<br />
}<br />
<br />
/* top ribbon */<br />
.dw-ribbon {<br />
height: 26px;<br />
background: linear-gradient(#8aa9ff, #ffffff);<br />
border-radius: 6px;<br />
margin: 0 0 14px 0;<br />
}<br />
<br />
<br />
.banner {<br />
display: flex;<br />
align-items: center;<br />
justify-content: space-between;<br />
gap: 1.5rem;<br />
padding: 0rem 1rem 0rem 1rem;<br />
text-align: left; /* centers text within its box */<br />
flex-wrap: wrap; <br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
background-size: 100% 200%;<br />
background-position: top;<br />
transition: background-position 0.4s ease-in-out;<br />
}<br />
.banner:hover {<br />
background-position: bottom;<br />
}<br />
<br />
<br />
.banner-icon img { <br />
width: 20vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 650px; /* prevent it from getting too big */ <br />
min-width: 120px; /* prevent it from getting too small */ <br />
padding-left: 2rem;}<br />
<br />
.dw-subtitle {<br />
font-size: 1.5rem;<br />
line-height: 1;<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle-banner {<br />
font-size: 3rem;<br />
}<br />
.dw-subtitle strong {<br />
<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle a {<br />
color: #0000FF !important; /* link color similar to your example */<br />
text-decoration: none;<br />
}<br />
<br />
.dw-subtitle a:hover {<br />
text-decoration: underline;<br />
}<br />
<br />
<br />
/* title & subtitle */<br />
.dw-title {<br />
text-align: center;<br />
line-height: 1.2;<br />
font-size: 2.5rem;<br />
font-weight: 700;<br />
letter-spacing: .02em;<br />
display: block;<br />
}<br />
<br />
<br />
/* grid */<br />
.dw-grid {<br />
display: flex;<br />
flex-wrap: wrap;<br />
gap: 16px;<br />
align-items: flex-start;<br />
margin-top: 14px;<br />
}<br />
.dw-col {<br />
flex: 1 1 520px;<br />
min-width: 320px;<br />
}<br />
<br />
/* cards */<br />
.dw-card {<br />
position: relative;<br />
border: 1px solid #C0C0C0;<br />
background: #FFFFFF !important;<br />
padding: 10px;<br />
margin-bottom: 10px;<br />
}<br />
.dw-card:hover {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 75%, rgba(192, 192, 192, 1) 100%)!important;<br />
}<br />
span.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
<br />
}<br />
<br />
.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 2rem !important; <br />
}<br />
<br />
<br />
.dw-card .dw-row {<br />
display: flex;<br />
flex-wrap: wrap;<br />
align-items: flex-start;<br />
gap: 12px;<br />
width: 100%;<br />
box-sizing: border-box;<br />
padding: 14px; /* ✅ move the spacing here instead of .dw-card */<br />
}<br />
<br />
.dw-card .dw-row > div:last-child {<br />
flex: 1;<br />
min-width: 0; /* ✅ prevents overflow due to long text/links */<br />
}<br />
<br />
.dw-card .dw-icon img { height: auto; }<br />
.dw-card .dw-headline {<br />
display: block;<br />
font-size: 1.5rem;<br />
font-weight: 700;<br />
margin: 0px 0 0px;<br />
}<br />
.dw-card .dw-body { line-height: 1.6; width: 100%;}<br />
.dw-card .dw-body--spacious { line-height: 1.8; }<br />
<br />
<br />
.dw-icon,<br />
.dw-subtitle {<br />
background: transparent !important; /* ✅ makes logo + text boxes transparent */<br />
}<br />
<br />
<br />
/* Code blocks explicitly monospace (so they don't inherit) */<br />
pre, code, kbd, samp, tt, .mw-code {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
text-indent: 0 !important;<br />
}<br />
<br />
/* ===== Remove first-line indentation site-wide ===== */<br />
.mw-parser-output p,<br />
.mw-parser-output li p,<br />
.mw-body-content p,<br />
.dw-card .dw-body p {<br />
text-indent: 0 !important;<br />
}<br />
<br />
<br />
pre {<br />
margin: 0 !important;<br />
padding: 0rem !important; /* add a little inner spacing so text isn’t on the edge */<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);<br />
border: none !important;<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
white-space: pre-wrap !important; /* allows wrapping */<br />
word-break: break-word !important;<br />
line-height: 1 !important;<br />
<br />
}<br />
<br />
.dw-card .pre {<br />
display: block; /* ensures it behaves as a block element */<br />
width: 100% !important;/* takes up the full width of .dw-card */<br />
box-sizing: border-box;/* includes padding/border in width calculation */<br />
margin: 0;<br />
padding: 0;<br />
}<br />
<br />
<br />
div.mw-content-ltr.mw-parser-output {<br />
background: #FFFFFF;<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 97%, rgba(192, 192, 192, 1) 100%);<br />
padding: 1rem;<br />
}<br />
<br />
<br />
<br />
.mw-page-container { <br />
background-image: url("https://dsignweek.servus.at/images/9/9d/Bg-01.png"); background-repeat: repeat-y; <br />
/* ✅ repeat vertically */ background-size: 100% auto; <br />
/* stretch to page width, keep height natural <br />
*/ background-position: center top; <br />
/* start at the top, center horizontally <br />
*/ background-attachment: scroll; <br />
/* move with page scroll */ background-color: #ffffff; /* fallback behind transparent areas */ }<br />
<br />
<br />
div#mw-head {<br />
background: transparent !important;<br />
}<br />
<br />
<br />
.dw-headline, .mw-headline {<br />
margin: 0 !important;<br />
}<br />
<br />
.skin-vector-2022 header.vector-header { box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8)!important; }<br />
<br />
.skin-vector-2022 #vector-sticky-header.vector-sticky-header {<br />
box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8) !important;<br />
}<br />
<br />
/* Global link color */<br />
a,<br />
a:visited,<br />
a:active {<br />
color: #0000FF !important;<br />
}<br />
<br />
/* Optional: link hover color (still blue but darker) */<br />
a:hover {<br />
text-decoration: underline;<br />
}<br />
<br />
<br />
<br />
/* ===== Mobile: stack card content vertically ===== */<br />
@media (max-width: 720px) {<br />
<br />
html, body {<br />
overflow-x: hidden !important;<br />
width: 100% !important;<br />
}<br />
.mw-page-container {<br />
max-width: 100vw !important;<br />
}<br />
<br />
.mw-parser-output {<br />
box-sizing: border-box;<br />
overflow-x: hidden !important;<br />
}<br />
<br />
.banner-icon img, img {<br />
max-width: 100% !important;<br />
width: 100% !important;<br />
object-fit: contain;<br />
}<br />
<br />
.mw-page-container { <br />
background-image: none !important;<br />
background-color: #ffffff !important;<br />
padding: 0 !important; /* ← fixed */<br />
padding-right: 10px !important; /* ← fixed */<br />
padding-left: 10px !important; /* ← fixed */<br />
margin: 0 !important;<br />
box-sizing: border-box;<br />
overflow-x: hidden !important;<br />
}<br />
.dw-col {<br />
flex: 1 1 auto !important; /* let them shrink freely */<br />
min-width: 0 !important; /* remove the minimum width restriction */<br />
}<br />
<br />
.vector-header-container .mw-header, .vector-header-container .vector-sticky-header {<br />
padding-left: 2rem;<br />
padding-right:2rem;<br />
box-sizing: border-box;<br />
}<br />
.vector-dropdown-content {<br />
width: 100vw !important;<br />
max-width: none !important;<br />
box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8)!important;<br />
}<br />
.dw-card {<br />
padding:0;}<br />
div#content.mw-body {<br />
padding: 0rem;}<br />
div.mw-content-ltr.mw-parser-output {<br />
padding: 0.5rem;<br />
}<br />
<br />
.banner-icon img { <br />
width: 75vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 400px; /* prevent it from getting too big */ <br />
min-width: 80px; /* prevent it from getting too small */ <br />
padding-left: 0rem;}<br />
<br />
/* Stack everything in a column */<br />
.dw-card .dw-row {<br />
display: flex;<br />
flex-direction: column;<br />
align-items: stretch; /* full width for text block */<br />
gap: 10px;<br />
}<br />
<br />
/* Make the icon its own row and center it */<br />
.dw-card .dw-icon {<br />
display: flex;<br />
justify-content: center;<br />
align-items: center;<br />
margin: 0; /* remove any left/right spacing from desktop */<br />
}<br />
<br />
.dw-card .dw-icon img {<br />
width: 72px; /* tidy mobile size */<br />
height: auto;<br />
}<br />
<br />
/* Ensure the text block fills width */<br />
.dw-card .dw-row > div {<br />
width: 100%;<br />
}<br />
<br />
/* Slight spacing tweaks for headings on mobile */<br />
.dw-card .dw-headline {<br />
margin: 4px 0 4px;<br />
}<br />
/* Stack footer sections vertically */<br />
#footer {<br />
display: flex !important;<br />
flex-direction: column !important;<br />
align-items: center !important;<br />
gap: 0 !important;<br />
width: 100% !important;<br />
padding: 1rem 1rem !important;<br />
box-sizing: border-box;<br />
}<br />
<br />
/* Each UL gets full width + centered */<br />
#footer ul {<br />
width: 100% !important;<br />
display: flex !important;<br />
flex-direction: row !important; <br />
justify-content: space-between !important; <br />
align-items: center !important;<br />
margin: 0 !important;<br />
padding: 0 !important;<br />
list-style: none !important;<br />
}<br />
.partner-logos {<br />
display: flex;<br />
flex-wrap: wrap; <br />
justify-content: space-between !important; <br />
align-items: center!important; <br />
gap: 2.2rem; <br />
padding: 0 1rem 1rem 1rem; <br />
background: transparent;<br />
}<br />
#partner-logos { <br />
justify-content: space-between !important; <br />
}<br />
.partner-logos img {<br />
height: 24px;<br />
width: auto;<br />
object-fit:contain;<br />
}<br />
<br />
}</div>
Ivans
https://dsignweek.servus.at/index.php?title=MediaWiki:Common.css&diff=1446
MediaWiki:Common.css
2025-11-20T14:43:19Z
<p>Ivans: </p>
<hr />
<div>/* CSS placed here will be applied to all skins */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
#footer-info-lastmod {<br />
display: none !important;<br />
}<br />
<br />
/* Vector 2022: align user links (language, username, etc.) to the top */<br />
body.skin-vector-2022 .vector-user-links-main {<br />
display: flex; /* make sure it's flexbox */<br />
align-items: flex-start; /* align children to the top of the div */<br />
}<br />
/* Hide the Translate extension banner ("Translate this page; This page has changes…") */<br />
body.skin-vector-2022 .mw-pt-translate-header {<br />
display: none !important;<br />
}<br />
/* Vector 2022 – hide entire tab/navigation bar (left-navigation) for all users */<br />
.skin-vector-2022 #left-navigation {<br />
display: none !important;<br />
}<br />
/* Vector 2022: right-align items in the page toolbar (Edit / View history / Tools) */<br />
.skin-vector-2022 .vector-page-toolbar-container {<br />
display: flex !important;<br />
justify-content: flex-end !important; /* pushes items to the right */<br />
align-items: center; /* vertical alignment */<br />
}<br />
<br />
/* Remove Vector “switch to old look” link + banner */<br />
.skin-vector-2022 .vector-feature-switch,<br />
.skin-vector-2022 a[href*="mw-prefsection-rendering-skin"],<br />
.skin-vector-2022 a[title*="legacy Vector"],<br />
.skin-vector-2022 a[title*="old look"] {<br />
display: none !important;<br />
}<br />
<br />
.mw-anon.skin-vector-2022 #ca-nstab-main, /* page title tab (Main Page / Article) */<br />
.mw-anon.skin-vector-2022 #ca-talk, /* Talk tab */<br />
.mw-anon.skin-vector-2022 #ca-view, /* "Read" tab */<br />
.mw-anon.skin-vector-2022 #ca-history, /* View history */<br />
.mw-anon.skin-vector-2022 #ca-watch,<br />
.mw-anon.skin-vector-2022 #ca-unwatch,<br />
.mw-anon.skin-vector-2022 #ca-more { /* "Tools" dropdown */<br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* === GLOBAL TYPOGRAPHY === */<br />
<br />
/* Base body text — Liberation Sans */<br />
html,<br />
body,<br />
.mw-body,<br />
.mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 1.2rem; /* base = 16px */<br />
line-height: 1.15; <br />
}<br />
<br />
/* Paragraphs and list text */<br />
p, li, td, th {<br />
font-size: 1.1rem; /* slightly larger than base text */<br />
}<br />
<br />
/* === HEADINGS — Linux Libertine === */<br />
h1, h2, h3, h4, h5, h6,<br />
.firstHeading,<br />
.mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
.mw-body h1, .mw-heading1, .mw-body-content h1, .mw-body-content .mw-heading1 { font-size: 3rem; line-height: 1.15; } <br />
<br />
<br />
<br />
/* === SIDEBAR MENU === */<br />
#mw-panel,<br />
.vector-menu-content,<br />
#p-navigation,<br />
#p-tb,<br />
#p-lang {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem; /* sidebar smaller for contrast */<br />
line-height: 1.4;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
#partner-logos {<br />
display: flex;<br />
justify-content: right;<br />
align-items: right;<br />
flex-wrap: wrap;<br />
gap: 1rem;<br />
margin-top:0.8rem;<br />
<br />
}<br />
<br />
#partner-logos img {<br />
height: 32px;<br />
object-fit: contain; /* keeps aspect ratio, fits within the box */<br />
max-width: 100%; /* prevents overflow */<br />
display: block; /* removes inline gaps below images */<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
.wikitable.custom-table {<br />
width: 100%;<br />
border-collapse: separate;<br />
border-spacing: 0;<br />
border: none;<br />
background-color: #fff;<br />
border-radius: 0.5rem;<br />
overflow: hidden; /* so rounded corners clip correctly */<br />
font-size: 0.95rem;<br />
}<br />
<br />
<br />
<br />
/* Header cells */<br />
.wikitable.custom-table th {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
color: #000;<br />
font-weight: 600;<br />
text-align: left;<br />
padding: 0.75rem 1rem;<br />
border-bottom: 2px solid #d0d9ff;<br />
}<br />
<br />
/* Data cells */<br />
.wikitable.custom-table td {<br />
padding: 0.65rem 1rem;<br />
border-bottom: 1px solid #eee;<br />
}<br />
<br />
/* Zebra striping */<br />
.wikitable.custom-table tr:nth-child(even) td {<br />
background-color: #f9fbff;<br />
}<br />
<br />
/* Hover effect */<br />
.wikitable.custom-table tr:hover td {<br />
background: #FFF;<br />
background: linear-gradient(0deg,rgba(0, 0, 255, 1) 0%, rgba(255, 255, 255, 1) 15%, rgba(255, 255, 255, 1) 85%, rgba(0, 0, 255, 1) 100%);<br />
}<br />
<br />
/* Rounded corners for first & last rows */<br />
.wikitable.custom-table tr:first-child th:first-child {<br />
border-top-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:first-child th:last-child {<br />
border-top-right-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:first-child {<br />
border-bottom-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:last-child {<br />
border-bottom-right-radius: 0.5rem;<br />
}<br />
<br />
<br />
/* === Mobile Responsive Tables (no HTML change needed) === */<br />
@media (max-width: 768px) {<br />
<br />
/* Allow horizontal scrolling on narrow screens */<br />
.wikitable.custom-table {<br />
display: block;<br />
width: 100%;<br />
overflow-x: auto;<br />
-webkit-overflow-scrolling: touch;<br />
}<br />
<br />
/* Prevent collapsing/squeezing of long cell content */<br />
.wikitable.custom-table tr,<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
white-space: nowrap;<br />
}<br />
<br />
/* Optional: slightly reduce padding for small screens */<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
padding: 0.5rem 0.75rem;<br />
}<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* Hide the automatic Tools and Special pages sections */<br />
#p-tb { <br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* MAIN-PAGE */<br />
<br />
/* === FONTS (yours) === */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
.mw-pt-languages {<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);}<br />
/* === GLOBAL TYPOGRAPHY === */<br />
html, body, .mw-body, .mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem;<br />
line-height: 1.1;<br />
}<br />
p, li, td, th { font-size: 1.1rem; line-height: 1.1; }<br />
h1, h2, h3, h4, h5, h6, .firstHeading, .mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
<br />
/* === d*sign week layout === */<br />
:root {<br />
--dw-border: #cfd8e3;<br />
--dw-card-bg: #f8fbff;<br />
}<br />
<br />
/* top ribbon */<br />
.dw-ribbon {<br />
height: 26px;<br />
background: linear-gradient(#8aa9ff, #ffffff);<br />
border-radius: 6px;<br />
margin: 0 0 14px 0;<br />
}<br />
<br />
<br />
.banner {<br />
display: flex;<br />
align-items: center;<br />
justify-content: space-between;<br />
gap: 1.5rem;<br />
padding: 0rem 1rem 0rem 1rem;<br />
text-align: left; /* centers text within its box */<br />
flex-wrap: wrap; <br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
background-size: 100% 200%;<br />
background-position: top;<br />
transition: background-position 0.4s ease-in-out;<br />
}<br />
.banner:hover {<br />
background-position: bottom;<br />
}<br />
<br />
<br />
.banner-icon img { <br />
width: 20vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 650px; /* prevent it from getting too big */ <br />
min-width: 120px; /* prevent it from getting too small */ <br />
padding-left: 2rem;}<br />
<br />
.dw-subtitle {<br />
font-size: 1.5rem;<br />
line-height: 1;<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle-banner {<br />
font-size: 3rem;<br />
}<br />
.dw-subtitle strong {<br />
<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle a {<br />
color: #0000FF !important; /* link color similar to your example */<br />
text-decoration: none;<br />
}<br />
<br />
.dw-subtitle a:hover {<br />
text-decoration: underline;<br />
}<br />
<br />
<br />
/* title & subtitle */<br />
.dw-title {<br />
text-align: center;<br />
line-height: 1.2;<br />
font-size: 2.5rem;<br />
font-weight: 700;<br />
letter-spacing: .02em;<br />
display: block;<br />
}<br />
<br />
<br />
/* grid */<br />
.dw-grid {<br />
display: flex;<br />
flex-wrap: wrap;<br />
gap: 16px;<br />
align-items: flex-start;<br />
margin-top: 14px;<br />
}<br />
.dw-col {<br />
flex: 1 1 520px;<br />
min-width: 320px;<br />
}<br />
<br />
/* cards */<br />
.dw-card {<br />
position: relative;<br />
border: 1px solid #C0C0C0;<br />
background: #FFFFFF !important;<br />
padding: 10px;<br />
margin-bottom: 10px;<br />
}<br />
.dw-card:hover {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 75%, rgba(192, 192, 192, 1) 100%)!important;<br />
}<br />
span.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
<br />
}<br />
<br />
.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 2rem !important; <br />
}<br />
<br />
<br />
.dw-card .dw-row {<br />
display: flex;<br />
flex-wrap: wrap;<br />
align-items: flex-start;<br />
gap: 12px;<br />
width: 100%;<br />
box-sizing: border-box;<br />
padding: 14px; /* ✅ move the spacing here instead of .dw-card */<br />
}<br />
<br />
.dw-card .dw-row > div:last-child {<br />
flex: 1;<br />
min-width: 0; /* ✅ prevents overflow due to long text/links */<br />
}<br />
<br />
.dw-card .dw-icon img { height: auto; }<br />
.dw-card .dw-headline {<br />
display: block;<br />
font-size: 1.5rem;<br />
font-weight: 700;<br />
margin: 0px 0 0px;<br />
}<br />
.dw-card .dw-body { line-height: 1.6; width: 100%;}<br />
.dw-card .dw-body--spacious { line-height: 1.8; }<br />
<br />
<br />
.dw-icon,<br />
.dw-subtitle {<br />
background: transparent !important; /* ✅ makes logo + text boxes transparent */<br />
}<br />
<br />
<br />
/* Code blocks explicitly monospace (so they don't inherit) */<br />
pre, code, kbd, samp, tt, .mw-code {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
text-indent: 0 !important;<br />
}<br />
<br />
/* ===== Remove first-line indentation site-wide ===== */<br />
.mw-parser-output p,<br />
.mw-parser-output li p,<br />
.mw-body-content p,<br />
.dw-card .dw-body p {<br />
text-indent: 0 !important;<br />
}<br />
<br />
<br />
pre {<br />
margin: 0 !important;<br />
padding: 0rem !important; /* add a little inner spacing so text isn’t on the edge */<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);<br />
border: none !important;<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
white-space: pre-wrap !important; /* allows wrapping */<br />
word-break: break-word !important;<br />
line-height: 1 !important;<br />
<br />
}<br />
<br />
.dw-card .pre {<br />
display: block; /* ensures it behaves as a block element */<br />
width: 100% !important;/* takes up the full width of .dw-card */<br />
box-sizing: border-box;/* includes padding/border in width calculation */<br />
margin: 0;<br />
padding: 0;<br />
}<br />
<br />
<br />
div.mw-content-ltr.mw-parser-output {<br />
background: #FFFFFF;<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 97%, rgba(192, 192, 192, 1) 100%);<br />
padding: 1rem;<br />
}<br />
<br />
<br />
<br />
.mw-page-container { <br />
background-image: url("https://dsignweek.servus.at/images/9/9d/Bg-01.png"); background-repeat: repeat-y; <br />
/* ✅ repeat vertically */ background-size: 100% auto; <br />
/* stretch to page width, keep height natural <br />
*/ background-position: center top; <br />
/* start at the top, center horizontally <br />
*/ background-attachment: scroll; <br />
/* move with page scroll */ background-color: #ffffff; /* fallback behind transparent areas */ }<br />
<br />
<br />
div#mw-head {<br />
background: transparent !important;<br />
}<br />
<br />
<br />
.dw-headline, .mw-headline {<br />
margin: 0 !important;<br />
}<br />
<br />
.skin-vector-2022 header.vector-header { box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8)!important; }<br />
<br />
.skin-vector-2022 #vector-sticky-header.vector-sticky-header {<br />
box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8) !important;<br />
}<br />
<br />
/* Global link color */<br />
a,<br />
a:visited,<br />
a:active {<br />
color: #0000FF !important;<br />
}<br />
<br />
/* Optional: link hover color (still blue but darker) */<br />
a:hover {<br />
text-decoration: underline;<br />
}<br />
<br />
<br />
<br />
/* ===== Mobile: stack card content vertically ===== */<br />
@media (max-width: 720px) {<br />
<br />
html, body {<br />
overflow-x: hidden !important;<br />
width: 100% !important;<br />
}<br />
.mw-page-container {<br />
max-width: 100vw !important;<br />
}<br />
<br />
.mw-parser-output {<br />
box-sizing: border-box;<br />
overflow-x: hidden !important;<br />
}<br />
<br />
.banner-icon img, img {<br />
max-width: 100% !important;<br />
width: 100% !important;<br />
object-fit: contain;<br />
}<br />
<br />
.mw-page-container { <br />
background-image: none !important;<br />
background-color: #ffffff !important;<br />
padding: 0 !important; /* ← fixed */<br />
padding-right: 10px !important; /* ← fixed */<br />
padding-left: 10px !important; /* ← fixed */<br />
margin: 0 !important;<br />
box-sizing: border-box;<br />
overflow-x: hidden !important;<br />
}<br />
.dw-col {<br />
flex: 1 1 auto !important; /* let them shrink freely */<br />
min-width: 0 !important; /* remove the minimum width restriction */<br />
}<br />
<br />
.vector-dropdown-content {<br />
width: 100vw !important;<br />
max-width: none !important;<br />
box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8)!important;<br />
}<br />
.dw-card {<br />
padding:0;}<br />
div#content.mw-body {<br />
padding: 0rem;}<br />
div.mw-content-ltr.mw-parser-output {<br />
padding: 0.5rem;<br />
}<br />
<br />
.banner-icon img { <br />
width: 75vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 400px; /* prevent it from getting too big */ <br />
min-width: 80px; /* prevent it from getting too small */ <br />
padding-left: 0rem;}<br />
<br />
/* Stack everything in a column */<br />
.dw-card .dw-row {<br />
display: flex;<br />
flex-direction: column;<br />
align-items: stretch; /* full width for text block */<br />
gap: 10px;<br />
}<br />
<br />
/* Make the icon its own row and center it */<br />
.dw-card .dw-icon {<br />
display: flex;<br />
justify-content: center;<br />
align-items: center;<br />
margin: 0; /* remove any left/right spacing from desktop */<br />
}<br />
<br />
.dw-card .dw-icon img {<br />
width: 72px; /* tidy mobile size */<br />
height: auto;<br />
}<br />
<br />
/* Ensure the text block fills width */<br />
.dw-card .dw-row > div {<br />
width: 100%;<br />
}<br />
<br />
/* Slight spacing tweaks for headings on mobile */<br />
.dw-card .dw-headline {<br />
margin: 4px 0 4px;<br />
}<br />
/* Stack footer sections vertically */<br />
#footer {<br />
display: flex !important;<br />
flex-direction: column !important;<br />
align-items: center !important;<br />
gap: 0 !important;<br />
width: 100% !important;<br />
padding: 1rem 1rem !important;<br />
box-sizing: border-box;<br />
}<br />
<br />
/* Each UL gets full width + centered */<br />
#footer ul {<br />
width: 100% !important;<br />
display: flex !important;<br />
flex-direction: row !important; <br />
justify-content: space-between !important; <br />
align-items: center !important;<br />
margin: 0 !important;<br />
padding: 0 !important;<br />
list-style: none !important;<br />
}<br />
.partner-logos {<br />
display: flex;<br />
flex-wrap: wrap; <br />
justify-content: space-between !important; <br />
align-items: center!important; <br />
gap: 2.2rem; <br />
padding: 0 1rem 1rem 1rem; <br />
background: transparent;<br />
}<br />
#partner-logos { <br />
justify-content: space-between !important; <br />
}<br />
.partner-logos img {<br />
height: 24px;<br />
width: auto;<br />
object-fit:contain;<br />
}<br />
<br />
}</div>
Ivans
https://dsignweek.servus.at/index.php?title=MediaWiki:Common.css&diff=1445
MediaWiki:Common.css
2025-11-20T14:41:45Z
<p>Ivans: </p>
<hr />
<div>/* CSS placed here will be applied to all skins */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
#footer-info-lastmod {<br />
display: none !important;<br />
}<br />
<br />
/* Vector 2022: align user links (language, username, etc.) to the top */<br />
body.skin-vector-2022 .vector-user-links-main {<br />
display: flex; /* make sure it's flexbox */<br />
align-items: flex-start; /* align children to the top of the div */<br />
}<br />
/* Hide the Translate extension banner ("Translate this page; This page has changes…") */<br />
body.skin-vector-2022 .mw-pt-translate-header {<br />
display: none !important;<br />
}<br />
/* Vector 2022 – hide entire tab/navigation bar (left-navigation) for all users */<br />
.skin-vector-2022 #left-navigation {<br />
display: none !important;<br />
}<br />
/* Vector 2022: right-align items in the page toolbar (Edit / View history / Tools) */<br />
.skin-vector-2022 .vector-page-toolbar-container {<br />
display: flex !important;<br />
justify-content: flex-end !important; /* pushes items to the right */<br />
align-items: center; /* vertical alignment */<br />
}<br />
<br />
<br />
<br />
.mw-anon.skin-vector-2022 #ca-nstab-main, /* page title tab (Main Page / Article) */<br />
.mw-anon.skin-vector-2022 #ca-talk, /* Talk tab */<br />
.mw-anon.skin-vector-2022 #ca-view, /* "Read" tab */<br />
.mw-anon.skin-vector-2022 #ca-history, /* View history */<br />
.mw-anon.skin-vector-2022 #ca-watch,<br />
.mw-anon.skin-vector-2022 #ca-unwatch,<br />
.mw-anon.skin-vector-2022 #ca-more { /* "Tools" dropdown */<br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* === GLOBAL TYPOGRAPHY === */<br />
<br />
/* Base body text — Liberation Sans */<br />
html,<br />
body,<br />
.mw-body,<br />
.mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 1.2rem; /* base = 16px */<br />
line-height: 1.15; <br />
}<br />
<br />
/* Paragraphs and list text */<br />
p, li, td, th {<br />
font-size: 1.1rem; /* slightly larger than base text */<br />
}<br />
<br />
/* === HEADINGS — Linux Libertine === */<br />
h1, h2, h3, h4, h5, h6,<br />
.firstHeading,<br />
.mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
.mw-body h1, .mw-heading1, .mw-body-content h1, .mw-body-content .mw-heading1 { font-size: 3rem; line-height: 1.15; } <br />
<br />
<br />
<br />
/* === SIDEBAR MENU === */<br />
#mw-panel,<br />
.vector-menu-content,<br />
#p-navigation,<br />
#p-tb,<br />
#p-lang {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem; /* sidebar smaller for contrast */<br />
line-height: 1.4;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
#partner-logos {<br />
display: flex;<br />
justify-content: right;<br />
align-items: right;<br />
flex-wrap: wrap;<br />
gap: 1rem;<br />
margin-top:0.8rem;<br />
<br />
}<br />
<br />
#partner-logos img {<br />
height: 32px;<br />
object-fit: contain; /* keeps aspect ratio, fits within the box */<br />
max-width: 100%; /* prevents overflow */<br />
display: block; /* removes inline gaps below images */<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
.wikitable.custom-table {<br />
width: 100%;<br />
border-collapse: separate;<br />
border-spacing: 0;<br />
border: none;<br />
background-color: #fff;<br />
border-radius: 0.5rem;<br />
overflow: hidden; /* so rounded corners clip correctly */<br />
font-size: 0.95rem;<br />
}<br />
<br />
<br />
<br />
/* Header cells */<br />
.wikitable.custom-table th {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
color: #000;<br />
font-weight: 600;<br />
text-align: left;<br />
padding: 0.75rem 1rem;<br />
border-bottom: 2px solid #d0d9ff;<br />
}<br />
<br />
/* Data cells */<br />
.wikitable.custom-table td {<br />
padding: 0.65rem 1rem;<br />
border-bottom: 1px solid #eee;<br />
}<br />
<br />
/* Zebra striping */<br />
.wikitable.custom-table tr:nth-child(even) td {<br />
background-color: #f9fbff;<br />
}<br />
<br />
/* Hover effect */<br />
.wikitable.custom-table tr:hover td {<br />
background: #FFF;<br />
background: linear-gradient(0deg,rgba(0, 0, 255, 1) 0%, rgba(255, 255, 255, 1) 15%, rgba(255, 255, 255, 1) 85%, rgba(0, 0, 255, 1) 100%);<br />
}<br />
<br />
/* Rounded corners for first & last rows */<br />
.wikitable.custom-table tr:first-child th:first-child {<br />
border-top-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:first-child th:last-child {<br />
border-top-right-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:first-child {<br />
border-bottom-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:last-child {<br />
border-bottom-right-radius: 0.5rem;<br />
}<br />
<br />
<br />
/* === Mobile Responsive Tables (no HTML change needed) === */<br />
@media (max-width: 768px) {<br />
<br />
/* Allow horizontal scrolling on narrow screens */<br />
.wikitable.custom-table {<br />
display: block;<br />
width: 100%;<br />
overflow-x: auto;<br />
-webkit-overflow-scrolling: touch;<br />
}<br />
<br />
/* Prevent collapsing/squeezing of long cell content */<br />
.wikitable.custom-table tr,<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
white-space: nowrap;<br />
}<br />
<br />
/* Optional: slightly reduce padding for small screens */<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
padding: 0.5rem 0.75rem;<br />
}<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* Hide the automatic Tools and Special pages sections */<br />
#p-tb { <br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* MAIN-PAGE */<br />
<br />
/* === FONTS (yours) === */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
.mw-pt-languages {<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);}<br />
/* === GLOBAL TYPOGRAPHY === */<br />
html, body, .mw-body, .mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem;<br />
line-height: 1.1;<br />
}<br />
p, li, td, th { font-size: 1.1rem; line-height: 1.1; }<br />
h1, h2, h3, h4, h5, h6, .firstHeading, .mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
<br />
/* === d*sign week layout === */<br />
:root {<br />
--dw-border: #cfd8e3;<br />
--dw-card-bg: #f8fbff;<br />
}<br />
<br />
/* top ribbon */<br />
.dw-ribbon {<br />
height: 26px;<br />
background: linear-gradient(#8aa9ff, #ffffff);<br />
border-radius: 6px;<br />
margin: 0 0 14px 0;<br />
}<br />
<br />
<br />
.banner {<br />
display: flex;<br />
align-items: center;<br />
justify-content: space-between;<br />
gap: 1.5rem;<br />
padding: 0rem 1rem 0rem 1rem;<br />
text-align: left; /* centers text within its box */<br />
flex-wrap: wrap; <br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
background-size: 100% 200%;<br />
background-position: top;<br />
transition: background-position 0.4s ease-in-out;<br />
}<br />
.banner:hover {<br />
background-position: bottom;<br />
}<br />
<br />
<br />
.banner-icon img { <br />
width: 20vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 650px; /* prevent it from getting too big */ <br />
min-width: 120px; /* prevent it from getting too small */ <br />
padding-left: 2rem;}<br />
<br />
.dw-subtitle {<br />
font-size: 1.5rem;<br />
line-height: 1;<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle-banner {<br />
font-size: 3rem;<br />
}<br />
.dw-subtitle strong {<br />
<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle a {<br />
color: #0000FF !important; /* link color similar to your example */<br />
text-decoration: none;<br />
}<br />
<br />
.dw-subtitle a:hover {<br />
text-decoration: underline;<br />
}<br />
<br />
<br />
/* title & subtitle */<br />
.dw-title {<br />
text-align: center;<br />
line-height: 1.2;<br />
font-size: 2.5rem;<br />
font-weight: 700;<br />
letter-spacing: .02em;<br />
display: block;<br />
}<br />
<br />
<br />
/* grid */<br />
.dw-grid {<br />
display: flex;<br />
flex-wrap: wrap;<br />
gap: 16px;<br />
align-items: flex-start;<br />
margin-top: 14px;<br />
}<br />
.dw-col {<br />
flex: 1 1 520px;<br />
min-width: 320px;<br />
}<br />
<br />
/* cards */<br />
.dw-card {<br />
position: relative;<br />
border: 1px solid #C0C0C0;<br />
background: #FFFFFF !important;<br />
padding: 10px;<br />
margin-bottom: 10px;<br />
}<br />
.dw-card:hover {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 75%, rgba(192, 192, 192, 1) 100%)!important;<br />
}<br />
span.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
<br />
}<br />
<br />
.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 2rem !important; <br />
}<br />
<br />
<br />
.dw-card .dw-row {<br />
display: flex;<br />
flex-wrap: wrap;<br />
align-items: flex-start;<br />
gap: 12px;<br />
width: 100%;<br />
box-sizing: border-box;<br />
padding: 14px; /* ✅ move the spacing here instead of .dw-card */<br />
}<br />
<br />
.dw-card .dw-row > div:last-child {<br />
flex: 1;<br />
min-width: 0; /* ✅ prevents overflow due to long text/links */<br />
}<br />
<br />
.dw-card .dw-icon img { height: auto; }<br />
.dw-card .dw-headline {<br />
display: block;<br />
font-size: 1.5rem;<br />
font-weight: 700;<br />
margin: 0px 0 0px;<br />
}<br />
.dw-card .dw-body { line-height: 1.6; width: 100%;}<br />
.dw-card .dw-body--spacious { line-height: 1.8; }<br />
<br />
<br />
.dw-icon,<br />
.dw-subtitle {<br />
background: transparent !important; /* ✅ makes logo + text boxes transparent */<br />
}<br />
<br />
<br />
/* Code blocks explicitly monospace (so they don't inherit) */<br />
pre, code, kbd, samp, tt, .mw-code {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
text-indent: 0 !important;<br />
}<br />
<br />
/* ===== Remove first-line indentation site-wide ===== */<br />
.mw-parser-output p,<br />
.mw-parser-output li p,<br />
.mw-body-content p,<br />
.dw-card .dw-body p {<br />
text-indent: 0 !important;<br />
}<br />
<br />
<br />
pre {<br />
margin: 0 !important;<br />
padding: 0rem !important; /* add a little inner spacing so text isn’t on the edge */<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);<br />
border: none !important;<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
white-space: pre-wrap !important; /* allows wrapping */<br />
word-break: break-word !important;<br />
line-height: 1 !important;<br />
<br />
}<br />
<br />
.dw-card .pre {<br />
display: block; /* ensures it behaves as a block element */<br />
width: 100% !important;/* takes up the full width of .dw-card */<br />
box-sizing: border-box;/* includes padding/border in width calculation */<br />
margin: 0;<br />
padding: 0;<br />
}<br />
<br />
<br />
div.mw-content-ltr.mw-parser-output {<br />
background: #FFFFFF;<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 97%, rgba(192, 192, 192, 1) 100%);<br />
padding: 1rem;<br />
}<br />
<br />
<br />
<br />
.mw-page-container { <br />
background-image: url("https://dsignweek.servus.at/images/9/9d/Bg-01.png"); background-repeat: repeat-y; <br />
/* ✅ repeat vertically */ background-size: 100% auto; <br />
/* stretch to page width, keep height natural <br />
*/ background-position: center top; <br />
/* start at the top, center horizontally <br />
*/ background-attachment: scroll; <br />
/* move with page scroll */ background-color: #ffffff; /* fallback behind transparent areas */ }<br />
<br />
<br />
div#mw-head {<br />
background: transparent !important;<br />
}<br />
<br />
<br />
.dw-headline, .mw-headline {<br />
margin: 0 !important;<br />
}<br />
<br />
.skin-vector-2022 header.vector-header { box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8)!important; }<br />
<br />
.skin-vector-2022 #vector-sticky-header.vector-sticky-header {<br />
box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8) !important;<br />
}<br />
<br />
/* Global link color */<br />
a,<br />
a:visited,<br />
a:active {<br />
color: #0000FF !important;<br />
}<br />
<br />
/* Optional: link hover color (still blue but darker) */<br />
a:hover {<br />
text-decoration: underline;<br />
}<br />
<br />
<br />
<br />
/* ===== Mobile: stack card content vertically ===== */<br />
@media (max-width: 720px) {<br />
<br />
html, body {<br />
overflow-x: hidden !important;<br />
width: 100% !important;<br />
}<br />
.mw-page-container {<br />
max-width: 100vw !important;<br />
}<br />
<br />
.mw-parser-output {<br />
box-sizing: border-box;<br />
overflow-x: hidden !important;<br />
}<br />
<br />
.banner-icon img, img {<br />
max-width: 100% !important;<br />
width: 100% !important;<br />
object-fit: contain;<br />
}<br />
<br />
.mw-page-container { <br />
background-image: none !important;<br />
background-color: #ffffff !important;<br />
padding: 0 !important; /* ← fixed */<br />
padding-right: 10px !important; /* ← fixed */<br />
padding-left: 10px !important; /* ← fixed */<br />
margin: 0 !important;<br />
box-sizing: border-box;<br />
overflow-x: hidden !important;<br />
}<br />
.dw-col {<br />
flex: 1 1 auto !important; /* let them shrink freely */<br />
min-width: 0 !important; /* remove the minimum width restriction */<br />
}<br />
<br />
.vector-dropdown-content {<br />
width: 100vw !important;<br />
max-width: none !important;<br />
box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8)!important;<br />
}<br />
.dw-card {<br />
padding:0;}<br />
div#content.mw-body {<br />
padding: 0rem;}<br />
div.mw-content-ltr.mw-parser-output {<br />
padding: 0.5rem;<br />
}<br />
<br />
.banner-icon img { <br />
width: 75vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 400px; /* prevent it from getting too big */ <br />
min-width: 80px; /* prevent it from getting too small */ <br />
padding-left: 0rem;}<br />
<br />
/* Stack everything in a column */<br />
.dw-card .dw-row {<br />
display: flex;<br />
flex-direction: column;<br />
align-items: stretch; /* full width for text block */<br />
gap: 10px;<br />
}<br />
<br />
/* Make the icon its own row and center it */<br />
.dw-card .dw-icon {<br />
display: flex;<br />
justify-content: center;<br />
align-items: center;<br />
margin: 0; /* remove any left/right spacing from desktop */<br />
}<br />
<br />
.dw-card .dw-icon img {<br />
width: 72px; /* tidy mobile size */<br />
height: auto;<br />
}<br />
<br />
/* Ensure the text block fills width */<br />
.dw-card .dw-row > div {<br />
width: 100%;<br />
}<br />
<br />
/* Slight spacing tweaks for headings on mobile */<br />
.dw-card .dw-headline {<br />
margin: 4px 0 4px;<br />
}<br />
/* Stack footer sections vertically */<br />
#footer {<br />
display: flex !important;<br />
flex-direction: column !important;<br />
align-items: center !important;<br />
gap: 0 !important;<br />
width: 100% !important;<br />
padding: 1rem 1rem !important;<br />
box-sizing: border-box;<br />
}<br />
<br />
/* Each UL gets full width + centered */<br />
#footer ul {<br />
width: 100% !important;<br />
display: flex !important;<br />
flex-direction: row !important; <br />
justify-content: space-between !important; <br />
align-items: center !important;<br />
margin: 0 !important;<br />
padding: 0 !important;<br />
list-style: none !important;<br />
}<br />
.partner-logos {<br />
display: flex;<br />
flex-wrap: wrap; <br />
justify-content: space-between !important; <br />
align-items: center!important; <br />
gap: 2.2rem; <br />
padding: 0 1rem 1rem 1rem; <br />
background: transparent;<br />
}<br />
#partner-logos { <br />
justify-content: space-between !important; <br />
}<br />
.partner-logos img {<br />
height: 24px;<br />
width: auto;<br />
object-fit:contain;<br />
}<br />
<br />
}</div>
Ivans
https://dsignweek.servus.at/index.php?title=MediaWiki:Common.css&diff=1444
MediaWiki:Common.css
2025-11-20T14:39:52Z
<p>Ivans: </p>
<hr />
<div>/* CSS placed here will be applied to all skins */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
#footer-info-lastmod {<br />
display: none !important;<br />
}<br />
<br />
/* Vector 2022: align user links (language, username, etc.) to the top */<br />
body.skin-vector-2022 .vector-user-links-main {<br />
display: flex; /* make sure it's flexbox */<br />
align-items: flex-start; /* align children to the top of the div */<br />
}<br />
/* Hide the Translate extension banner ("Translate this page; This page has changes…") */<br />
body.skin-vector-2022 .mw-pt-translate-header {<br />
display: none !important;<br />
}<br />
/* Vector 2022 – hide entire tab/navigation bar (left-navigation) for all users */<br />
.skin-vector-2022 #left-navigation {<br />
display: none !important;<br />
}<br />
/* Vector 2022: right-align items in the page toolbar (Edit / View history / Tools) */<br />
.skin-vector-2022 .vector-page-toolbar-container {<br />
display: flex !important;<br />
justify-content: flex-end !important; /* pushes items to the right */<br />
align-items: center; /* vertical alignment */<br />
}<br />
<br />
<br />
<br />
.mw-anon.skin-vector-2022 #ca-nstab-main, /* page title tab (Main Page / Article) */<br />
.mw-anon.skin-vector-2022 #ca-talk, /* Talk tab */<br />
.mw-anon.skin-vector-2022 #ca-view, /* "Read" tab */<br />
.mw-anon.skin-vector-2022 #ca-history, /* View history */<br />
.mw-anon.skin-vector-2022 #ca-watch,<br />
.mw-anon.skin-vector-2022 #ca-unwatch,<br />
.mw-anon.skin-vector-2022 #ca-more { /* "Tools" dropdown */<br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* === GLOBAL TYPOGRAPHY === */<br />
<br />
/* Base body text — Liberation Sans */<br />
html,<br />
body,<br />
.mw-body,<br />
.mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 1.2rem; /* base = 16px */<br />
line-height: 1.15; <br />
}<br />
<br />
/* Paragraphs and list text */<br />
p, li, td, th {<br />
font-size: 1.1rem; /* slightly larger than base text */<br />
}<br />
<br />
/* === HEADINGS — Linux Libertine === */<br />
h1, h2, h3, h4, h5, h6,<br />
.firstHeading,<br />
.mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
.mw-body h1, .mw-heading1, .mw-body-content h1, .mw-body-content .mw-heading1 { font-size: 3rem; line-height: 1.15; } <br />
<br />
<br />
<br />
/* === SIDEBAR MENU === */<br />
#mw-panel,<br />
.vector-menu-content,<br />
#p-navigation,<br />
#p-tb,<br />
#p-lang {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem; /* sidebar smaller for contrast */<br />
line-height: 1.4;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
#partner-logos {<br />
display: flex;<br />
justify-content: right;<br />
align-items: right;<br />
flex-wrap: wrap;<br />
gap: 1rem;<br />
margin-top:0.8rem;<br />
<br />
}<br />
<br />
#partner-logos img {<br />
height: 32px;<br />
object-fit: contain; /* keeps aspect ratio, fits within the box */<br />
max-width: 100%; /* prevents overflow */<br />
display: block; /* removes inline gaps below images */<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
.wikitable.custom-table {<br />
width: 100%;<br />
border-collapse: separate;<br />
border-spacing: 0;<br />
border: none;<br />
background-color: #fff;<br />
border-radius: 0.5rem;<br />
overflow: hidden; /* so rounded corners clip correctly */<br />
font-size: 0.95rem;<br />
}<br />
<br />
<br />
<br />
/* Header cells */<br />
.wikitable.custom-table th {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
color: #000;<br />
font-weight: 600;<br />
text-align: left;<br />
padding: 0.75rem 1rem;<br />
border-bottom: 2px solid #d0d9ff;<br />
}<br />
<br />
/* Data cells */<br />
.wikitable.custom-table td {<br />
padding: 0.65rem 1rem;<br />
border-bottom: 1px solid #eee;<br />
}<br />
<br />
/* Zebra striping */<br />
.wikitable.custom-table tr:nth-child(even) td {<br />
background-color: #f9fbff;<br />
}<br />
<br />
/* Hover effect */<br />
.wikitable.custom-table tr:hover td {<br />
background: #FFF;<br />
background: linear-gradient(0deg,rgba(0, 0, 255, 1) 0%, rgba(255, 255, 255, 1) 15%, rgba(255, 255, 255, 1) 85%, rgba(0, 0, 255, 1) 100%);<br />
}<br />
<br />
/* Rounded corners for first & last rows */<br />
.wikitable.custom-table tr:first-child th:first-child {<br />
border-top-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:first-child th:last-child {<br />
border-top-right-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:first-child {<br />
border-bottom-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:last-child {<br />
border-bottom-right-radius: 0.5rem;<br />
}<br />
<br />
<br />
/* === Mobile Responsive Tables (no HTML change needed) === */<br />
@media (max-width: 768px) {<br />
<br />
/* Allow horizontal scrolling on narrow screens */<br />
.wikitable.custom-table {<br />
display: block;<br />
width: 100%;<br />
overflow-x: auto;<br />
-webkit-overflow-scrolling: touch;<br />
}<br />
<br />
/* Prevent collapsing/squeezing of long cell content */<br />
.wikitable.custom-table tr,<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
white-space: nowrap;<br />
}<br />
<br />
/* Optional: slightly reduce padding for small screens */<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
padding: 0.5rem 0.75rem;<br />
}<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* Hide the automatic Tools and Special pages sections */<br />
#p-tb { <br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* MAIN-PAGE */<br />
<br />
/* === FONTS (yours) === */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
.mw-pt-languages {<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);}<br />
/* === GLOBAL TYPOGRAPHY === */<br />
html, body, .mw-body, .mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem;<br />
line-height: 1.1;<br />
}<br />
p, li, td, th { font-size: 1.1rem; line-height: 1.1; }<br />
h1, h2, h3, h4, h5, h6, .firstHeading, .mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
<br />
/* === d*sign week layout === */<br />
:root {<br />
--dw-border: #cfd8e3;<br />
--dw-card-bg: #f8fbff;<br />
}<br />
<br />
/* top ribbon */<br />
.dw-ribbon {<br />
height: 26px;<br />
background: linear-gradient(#8aa9ff, #ffffff);<br />
border-radius: 6px;<br />
margin: 0 0 14px 0;<br />
}<br />
<br />
<br />
.banner {<br />
display: flex;<br />
align-items: center;<br />
justify-content: space-between;<br />
gap: 1.5rem;<br />
padding: 0rem 1rem 0rem 1rem;<br />
text-align: left; /* centers text within its box */<br />
flex-wrap: wrap; <br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
background-size: 100% 200%;<br />
background-position: top;<br />
transition: background-position 0.4s ease-in-out;<br />
}<br />
.banner:hover {<br />
background-position: bottom;<br />
}<br />
<br />
<br />
.banner-icon img { <br />
width: 20vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 650px; /* prevent it from getting too big */ <br />
min-width: 120px; /* prevent it from getting too small */ <br />
padding-left: 2rem;}<br />
<br />
.dw-subtitle {<br />
font-size: 1.5rem;<br />
line-height: 1;<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle-banner {<br />
font-size: 3rem;<br />
}<br />
.dw-subtitle strong {<br />
<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle a {<br />
color: #0000FF !important; /* link color similar to your example */<br />
text-decoration: none;<br />
}<br />
<br />
.dw-subtitle a:hover {<br />
text-decoration: underline;<br />
}<br />
<br />
<br />
/* title & subtitle */<br />
.dw-title {<br />
text-align: center;<br />
line-height: 1.2;<br />
font-size: 2.5rem;<br />
font-weight: 700;<br />
letter-spacing: .02em;<br />
display: block;<br />
}<br />
<br />
<br />
/* grid */<br />
.dw-grid {<br />
display: flex;<br />
flex-wrap: wrap;<br />
gap: 16px;<br />
align-items: flex-start;<br />
margin-top: 14px;<br />
}<br />
.dw-col {<br />
flex: 1 1 520px;<br />
min-width: 320px;<br />
}<br />
<br />
/* cards */<br />
.dw-card {<br />
position: relative;<br />
border: 1px solid #C0C0C0;<br />
background: #FFFFFF !important;<br />
padding: 10px;<br />
margin-bottom: 10px;<br />
}<br />
.dw-card:hover {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 75%, rgba(192, 192, 192, 1) 100%)!important;<br />
}<br />
span.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
<br />
}<br />
<br />
.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 2rem !important; <br />
}<br />
<br />
<br />
.dw-card .dw-row {<br />
display: flex;<br />
flex-wrap: wrap;<br />
align-items: flex-start;<br />
gap: 12px;<br />
width: 100%;<br />
box-sizing: border-box;<br />
padding: 14px; /* ✅ move the spacing here instead of .dw-card */<br />
}<br />
<br />
.dw-card .dw-row > div:last-child {<br />
flex: 1;<br />
min-width: 0; /* ✅ prevents overflow due to long text/links */<br />
}<br />
<br />
.dw-card .dw-icon img { height: auto; }<br />
.dw-card .dw-headline {<br />
display: block;<br />
font-size: 1.5rem;<br />
font-weight: 700;<br />
margin: 0px 0 0px;<br />
}<br />
.dw-card .dw-body { line-height: 1.6; width: 100%;}<br />
.dw-card .dw-body--spacious { line-height: 1.8; }<br />
<br />
<br />
.dw-icon,<br />
.dw-subtitle {<br />
background: transparent !important; /* ✅ makes logo + text boxes transparent */<br />
}<br />
<br />
<br />
/* Code blocks explicitly monospace (so they don't inherit) */<br />
pre, code, kbd, samp, tt, .mw-code {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
text-indent: 0 !important;<br />
}<br />
<br />
/* ===== Remove first-line indentation site-wide ===== */<br />
.mw-parser-output p,<br />
.mw-parser-output li p,<br />
.mw-body-content p,<br />
.dw-card .dw-body p {<br />
text-indent: 0 !important;<br />
}<br />
<br />
<br />
pre {<br />
margin: 0 !important;<br />
padding: 0rem !important; /* add a little inner spacing so text isn’t on the edge */<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);<br />
border: none !important;<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
white-space: pre-wrap !important; /* allows wrapping */<br />
word-break: break-word !important;<br />
line-height: 1 !important;<br />
<br />
}<br />
<br />
.dw-card .pre {<br />
display: block; /* ensures it behaves as a block element */<br />
width: 100% !important;/* takes up the full width of .dw-card */<br />
box-sizing: border-box;/* includes padding/border in width calculation */<br />
margin: 0;<br />
padding: 0;<br />
}<br />
<br />
<br />
div.mw-content-ltr.mw-parser-output {<br />
background: #FFFFFF;<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 97%, rgba(192, 192, 192, 1) 100%);<br />
padding: 1rem;<br />
}<br />
<br />
<br />
<br />
.mw-page-container { <br />
background-image: url("https://dsignweek.servus.at/images/9/9d/Bg-01.png"); background-repeat: repeat-y; <br />
/* ✅ repeat vertically */ background-size: 100% auto; <br />
/* stretch to page width, keep height natural <br />
*/ background-position: center top; <br />
/* start at the top, center horizontally <br />
*/ background-attachment: scroll; <br />
/* move with page scroll */ background-color: #ffffff; /* fallback behind transparent areas */ }<br />
<br />
<br />
div#mw-head {<br />
background: transparent !important;<br />
}<br />
<br />
<br />
.dw-headline, .mw-headline {<br />
margin: 0 !important;<br />
}<br />
<br />
.skin-vector-2022 header.vector-header { box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8)!important; }<br />
<br />
.skin-vector-2022 #vector-sticky-header.vector-sticky-header {<br />
box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8) !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* ===== Mobile: stack card content vertically ===== */<br />
@media (max-width: 720px) {<br />
<br />
html, body {<br />
overflow-x: hidden !important;<br />
width: 100% !important;<br />
}<br />
.mw-page-container {<br />
max-width: 100vw !important;<br />
}<br />
<br />
.mw-parser-output {<br />
box-sizing: border-box;<br />
overflow-x: hidden !important;<br />
}<br />
<br />
.banner-icon img, img {<br />
max-width: 100% !important;<br />
width: 100% !important;<br />
object-fit: contain;<br />
}<br />
<br />
.mw-page-container { <br />
background-image: none !important;<br />
background-color: #ffffff !important;<br />
padding: 0 !important; /* ← fixed */<br />
padding-right: 10px !important; /* ← fixed */<br />
padding-left: 10px !important; /* ← fixed */<br />
margin: 0 !important;<br />
box-sizing: border-box;<br />
overflow-x: hidden !important;<br />
}<br />
.dw-col {<br />
flex: 1 1 auto !important; /* let them shrink freely */<br />
min-width: 0 !important; /* remove the minimum width restriction */<br />
}<br />
<br />
.vector-dropdown-content {<br />
width: 100vw !important;<br />
max-width: none !important;<br />
box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8)!important;<br />
}<br />
.dw-card {<br />
padding:0;}<br />
div#content.mw-body {<br />
padding: 0rem;}<br />
div.mw-content-ltr.mw-parser-output {<br />
padding: 0.5rem;<br />
}<br />
<br />
.banner-icon img { <br />
width: 75vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 400px; /* prevent it from getting too big */ <br />
min-width: 80px; /* prevent it from getting too small */ <br />
padding-left: 0rem;}<br />
<br />
/* Stack everything in a column */<br />
.dw-card .dw-row {<br />
display: flex;<br />
flex-direction: column;<br />
align-items: stretch; /* full width for text block */<br />
gap: 10px;<br />
}<br />
<br />
/* Make the icon its own row and center it */<br />
.dw-card .dw-icon {<br />
display: flex;<br />
justify-content: center;<br />
align-items: center;<br />
margin: 0; /* remove any left/right spacing from desktop */<br />
}<br />
<br />
.dw-card .dw-icon img {<br />
width: 72px; /* tidy mobile size */<br />
height: auto;<br />
}<br />
<br />
/* Ensure the text block fills width */<br />
.dw-card .dw-row > div {<br />
width: 100%;<br />
}<br />
<br />
/* Slight spacing tweaks for headings on mobile */<br />
.dw-card .dw-headline {<br />
margin: 4px 0 4px;<br />
}<br />
/* Stack footer sections vertically */<br />
#footer {<br />
display: flex !important;<br />
flex-direction: column !important;<br />
align-items: center !important;<br />
gap: 0 !important;<br />
width: 100% !important;<br />
padding: 1rem 1rem !important;<br />
box-sizing: border-box;<br />
}<br />
<br />
/* Each UL gets full width + centered */<br />
#footer ul {<br />
width: 100% !important;<br />
display: flex !important;<br />
flex-direction: row !important; <br />
justify-content: space-between !important; <br />
align-items: center !important;<br />
margin: 0 !important;<br />
padding: 0 !important;<br />
list-style: none !important;<br />
}<br />
.partner-logos {<br />
display: flex;<br />
flex-wrap: wrap; <br />
justify-content: space-between !important; <br />
align-items: center!important; <br />
gap: 2.2rem; <br />
padding: 0 1rem 1rem 1rem; <br />
background: transparent;<br />
}<br />
#partner-logos { <br />
justify-content: space-between !important; <br />
}<br />
.partner-logos img {<br />
height: 24px;<br />
width: auto;<br />
object-fit:contain;<br />
}<br />
<br />
}</div>
Ivans
https://dsignweek.servus.at/index.php?title=MediaWiki:Common.css&diff=1442
MediaWiki:Common.css
2025-11-20T14:39:03Z
<p>Ivans: </p>
<hr />
<div>/* CSS placed here will be applied to all skins */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
#footer-info-lastmod {<br />
display: none !important;<br />
}<br />
<br />
/* Vector 2022: align user links (language, username, etc.) to the top */<br />
body.skin-vector-2022 .vector-user-links-main {<br />
display: flex; /* make sure it's flexbox */<br />
align-items: flex-start; /* align children to the top of the div */<br />
}<br />
/* Hide the Translate extension banner ("Translate this page; This page has changes…") */<br />
body.skin-vector-2022 .mw-pt-translate-header {<br />
display: none !important;<br />
}<br />
/* Vector 2022 – hide entire tab/navigation bar (left-navigation) for all users */<br />
.skin-vector-2022 #left-navigation {<br />
display: none !important;<br />
}<br />
/* Vector 2022: right-align items in the page toolbar (Edit / View history / Tools) */<br />
.skin-vector-2022 .vector-page-toolbar-container {<br />
display: flex !important;<br />
justify-content: flex-end !important; /* pushes items to the right */<br />
align-items: center; /* vertical alignment */<br />
}<br />
<br />
<br />
<br />
.mw-anon.skin-vector-2022 #ca-nstab-main, /* page title tab (Main Page / Article) */<br />
.mw-anon.skin-vector-2022 #ca-talk, /* Talk tab */<br />
.mw-anon.skin-vector-2022 #ca-view, /* "Read" tab */<br />
.mw-anon.skin-vector-2022 #ca-history, /* View history */<br />
.mw-anon.skin-vector-2022 #ca-watch,<br />
.mw-anon.skin-vector-2022 #ca-unwatch,<br />
.mw-anon.skin-vector-2022 #ca-more { /* "Tools" dropdown */<br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* === GLOBAL TYPOGRAPHY === */<br />
<br />
/* Base body text — Liberation Sans */<br />
html,<br />
body,<br />
.mw-body,<br />
.mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 1.2rem; /* base = 16px */<br />
line-height: 1.15; <br />
}<br />
<br />
/* Paragraphs and list text */<br />
p, li, td, th {<br />
font-size: 1.1rem; /* slightly larger than base text */<br />
}<br />
<br />
/* === HEADINGS — Linux Libertine === */<br />
h1, h2, h3, h4, h5, h6,<br />
.firstHeading,<br />
.mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
.mw-body h1, .mw-heading1, .mw-body-content h1, .mw-body-content .mw-heading1 { font-size: 3rem; line-height: 1.15; } <br />
<br />
<br />
<br />
/* === SIDEBAR MENU === */<br />
#mw-panel,<br />
.vector-menu-content,<br />
#p-navigation,<br />
#p-tb,<br />
#p-lang {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem; /* sidebar smaller for contrast */<br />
line-height: 1.4;<br />
}<br />
<br />
#mw-panel,<br />
.vector-menu-content {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 90%, rgba(192, 192, 192, 1) 100%);<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
#partner-logos {<br />
display: flex;<br />
justify-content: right;<br />
align-items: right;<br />
flex-wrap: wrap;<br />
gap: 1rem;<br />
margin-top:0.8rem;<br />
<br />
}<br />
<br />
#partner-logos img {<br />
height: 32px;<br />
object-fit: contain; /* keeps aspect ratio, fits within the box */<br />
max-width: 100%; /* prevents overflow */<br />
display: block; /* removes inline gaps below images */<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
.wikitable.custom-table {<br />
width: 100%;<br />
border-collapse: separate;<br />
border-spacing: 0;<br />
border: none;<br />
background-color: #fff;<br />
border-radius: 0.5rem;<br />
overflow: hidden; /* so rounded corners clip correctly */<br />
font-size: 0.95rem;<br />
}<br />
<br />
<br />
<br />
/* Header cells */<br />
.wikitable.custom-table th {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
color: #000;<br />
font-weight: 600;<br />
text-align: left;<br />
padding: 0.75rem 1rem;<br />
border-bottom: 2px solid #d0d9ff;<br />
}<br />
<br />
/* Data cells */<br />
.wikitable.custom-table td {<br />
padding: 0.65rem 1rem;<br />
border-bottom: 1px solid #eee;<br />
}<br />
<br />
/* Zebra striping */<br />
.wikitable.custom-table tr:nth-child(even) td {<br />
background-color: #f9fbff;<br />
}<br />
<br />
/* Hover effect */<br />
.wikitable.custom-table tr:hover td {<br />
background: #FFF;<br />
background: linear-gradient(0deg,rgba(0, 0, 255, 1) 0%, rgba(255, 255, 255, 1) 15%, rgba(255, 255, 255, 1) 85%, rgba(0, 0, 255, 1) 100%);<br />
}<br />
<br />
/* Rounded corners for first & last rows */<br />
.wikitable.custom-table tr:first-child th:first-child {<br />
border-top-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:first-child th:last-child {<br />
border-top-right-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:first-child {<br />
border-bottom-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:last-child {<br />
border-bottom-right-radius: 0.5rem;<br />
}<br />
<br />
<br />
/* === Mobile Responsive Tables (no HTML change needed) === */<br />
@media (max-width: 768px) {<br />
<br />
/* Allow horizontal scrolling on narrow screens */<br />
.wikitable.custom-table {<br />
display: block;<br />
width: 100%;<br />
overflow-x: auto;<br />
-webkit-overflow-scrolling: touch;<br />
}<br />
<br />
/* Prevent collapsing/squeezing of long cell content */<br />
.wikitable.custom-table tr,<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
white-space: nowrap;<br />
}<br />
<br />
/* Optional: slightly reduce padding for small screens */<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
padding: 0.5rem 0.75rem;<br />
}<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* Hide the automatic Tools and Special pages sections */<br />
#p-tb { <br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* MAIN-PAGE */<br />
<br />
/* === FONTS (yours) === */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
.mw-pt-languages {<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);}<br />
/* === GLOBAL TYPOGRAPHY === */<br />
html, body, .mw-body, .mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem;<br />
line-height: 1.1;<br />
}<br />
p, li, td, th { font-size: 1.1rem; line-height: 1.1; }<br />
h1, h2, h3, h4, h5, h6, .firstHeading, .mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
<br />
/* === d*sign week layout === */<br />
:root {<br />
--dw-border: #cfd8e3;<br />
--dw-card-bg: #f8fbff;<br />
}<br />
<br />
/* top ribbon */<br />
.dw-ribbon {<br />
height: 26px;<br />
background: linear-gradient(#8aa9ff, #ffffff);<br />
border-radius: 6px;<br />
margin: 0 0 14px 0;<br />
}<br />
<br />
<br />
.banner {<br />
display: flex;<br />
align-items: center;<br />
justify-content: space-between;<br />
gap: 1.5rem;<br />
padding: 0rem 1rem 0rem 1rem;<br />
text-align: left; /* centers text within its box */<br />
flex-wrap: wrap; <br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
background-size: 100% 200%;<br />
background-position: top;<br />
transition: background-position 0.4s ease-in-out;<br />
}<br />
.banner:hover {<br />
background-position: bottom;<br />
}<br />
<br />
<br />
.banner-icon img { <br />
width: 20vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 650px; /* prevent it from getting too big */ <br />
min-width: 120px; /* prevent it from getting too small */ <br />
padding-left: 2rem;}<br />
<br />
.dw-subtitle {<br />
font-size: 1.5rem;<br />
line-height: 1;<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle-banner {<br />
font-size: 3rem;<br />
}<br />
.dw-subtitle strong {<br />
<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle a {<br />
color: #0000FF !important; /* link color similar to your example */<br />
text-decoration: none;<br />
}<br />
<br />
.dw-subtitle a:hover {<br />
text-decoration: underline;<br />
}<br />
<br />
<br />
/* title & subtitle */<br />
.dw-title {<br />
text-align: center;<br />
line-height: 1.2;<br />
font-size: 2.5rem;<br />
font-weight: 700;<br />
letter-spacing: .02em;<br />
display: block;<br />
}<br />
<br />
<br />
/* grid */<br />
.dw-grid {<br />
display: flex;<br />
flex-wrap: wrap;<br />
gap: 16px;<br />
align-items: flex-start;<br />
margin-top: 14px;<br />
}<br />
.dw-col {<br />
flex: 1 1 520px;<br />
min-width: 320px;<br />
}<br />
<br />
/* cards */<br />
.dw-card {<br />
position: relative;<br />
border: 1px solid #C0C0C0;<br />
background: #FFFFFF !important;<br />
padding: 10px;<br />
margin-bottom: 10px;<br />
}<br />
.dw-card:hover {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 75%, rgba(192, 192, 192, 1) 100%)!important;<br />
}<br />
span.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
<br />
}<br />
<br />
.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 2rem !important; <br />
}<br />
<br />
<br />
.dw-card .dw-row {<br />
display: flex;<br />
flex-wrap: wrap;<br />
align-items: flex-start;<br />
gap: 12px;<br />
width: 100%;<br />
box-sizing: border-box;<br />
padding: 14px; /* ✅ move the spacing here instead of .dw-card */<br />
}<br />
<br />
.dw-card .dw-row > div:last-child {<br />
flex: 1;<br />
min-width: 0; /* ✅ prevents overflow due to long text/links */<br />
}<br />
<br />
.dw-card .dw-icon img { height: auto; }<br />
.dw-card .dw-headline {<br />
display: block;<br />
font-size: 1.5rem;<br />
font-weight: 700;<br />
margin: 0px 0 0px;<br />
}<br />
.dw-card .dw-body { line-height: 1.6; width: 100%;}<br />
.dw-card .dw-body--spacious { line-height: 1.8; }<br />
<br />
<br />
.dw-icon,<br />
.dw-subtitle {<br />
background: transparent !important; /* ✅ makes logo + text boxes transparent */<br />
}<br />
<br />
<br />
/* Code blocks explicitly monospace (so they don't inherit) */<br />
pre, code, kbd, samp, tt, .mw-code {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
text-indent: 0 !important;<br />
}<br />
<br />
/* ===== Remove first-line indentation site-wide ===== */<br />
.mw-parser-output p,<br />
.mw-parser-output li p,<br />
.mw-body-content p,<br />
.dw-card .dw-body p {<br />
text-indent: 0 !important;<br />
}<br />
<br />
<br />
pre {<br />
margin: 0 !important;<br />
padding: 0rem !important; /* add a little inner spacing so text isn’t on the edge */<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);<br />
border: none !important;<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
white-space: pre-wrap !important; /* allows wrapping */<br />
word-break: break-word !important;<br />
line-height: 1 !important;<br />
<br />
}<br />
<br />
.dw-card .pre {<br />
display: block; /* ensures it behaves as a block element */<br />
width: 100% !important;/* takes up the full width of .dw-card */<br />
box-sizing: border-box;/* includes padding/border in width calculation */<br />
margin: 0;<br />
padding: 0;<br />
}<br />
<br />
<br />
div.mw-content-ltr.mw-parser-output {<br />
background: #FFFFFF;<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 97%, rgba(192, 192, 192, 1) 100%);<br />
padding: 1rem;<br />
}<br />
<br />
<br />
<br />
.mw-page-container { <br />
background-image: url("https://dsignweek.servus.at/images/9/9d/Bg-01.png"); background-repeat: repeat-y; <br />
/* ✅ repeat vertically */ background-size: 100% auto; <br />
/* stretch to page width, keep height natural <br />
*/ background-position: center top; <br />
/* start at the top, center horizontally <br />
*/ background-attachment: scroll; <br />
/* move with page scroll */ background-color: #ffffff; /* fallback behind transparent areas */ }<br />
<br />
<br />
div#mw-head {<br />
background: transparent !important;<br />
}<br />
<br />
<br />
.dw-headline, .mw-headline {<br />
margin: 0 !important;<br />
}<br />
<br />
.skin-vector-2022 header.vector-header { box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8)!important; }<br />
<br />
.skin-vector-2022 #vector-sticky-header.vector-sticky-header {<br />
box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8) !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* ===== Mobile: stack card content vertically ===== */<br />
@media (max-width: 720px) {<br />
<br />
html, body {<br />
overflow-x: hidden !important;<br />
width: 100% !important;<br />
}<br />
.mw-page-container {<br />
max-width: 100vw !important;<br />
}<br />
<br />
.mw-parser-output {<br />
box-sizing: border-box;<br />
overflow-x: hidden !important;<br />
}<br />
<br />
.banner-icon img, img {<br />
max-width: 100% !important;<br />
width: 100% !important;<br />
object-fit: contain;<br />
}<br />
<br />
.mw-page-container { <br />
background-image: none !important;<br />
background-color: #ffffff !important;<br />
padding: 0 !important; /* ← fixed */<br />
padding-right: 10px !important; /* ← fixed */<br />
padding-left: 10px !important; /* ← fixed */<br />
margin: 0 !important;<br />
box-sizing: border-box;<br />
overflow-x: hidden !important;<br />
}<br />
.dw-col {<br />
flex: 1 1 auto !important; /* let them shrink freely */<br />
min-width: 0 !important; /* remove the minimum width restriction */<br />
}<br />
<br />
.vector-dropdown-content {<br />
width: 100vw !important;<br />
max-width: none !important;<br />
box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8)!important;<br />
}<br />
.dw-card {<br />
padding:0;}<br />
div#content.mw-body {<br />
padding: 0rem;}<br />
div.mw-content-ltr.mw-parser-output {<br />
padding: 0.5rem;<br />
}<br />
<br />
.banner-icon img { <br />
width: 75vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 400px; /* prevent it from getting too big */ <br />
min-width: 80px; /* prevent it from getting too small */ <br />
padding-left: 0rem;}<br />
<br />
/* Stack everything in a column */<br />
.dw-card .dw-row {<br />
display: flex;<br />
flex-direction: column;<br />
align-items: stretch; /* full width for text block */<br />
gap: 10px;<br />
}<br />
<br />
/* Make the icon its own row and center it */<br />
.dw-card .dw-icon {<br />
display: flex;<br />
justify-content: center;<br />
align-items: center;<br />
margin: 0; /* remove any left/right spacing from desktop */<br />
}<br />
<br />
.dw-card .dw-icon img {<br />
width: 72px; /* tidy mobile size */<br />
height: auto;<br />
}<br />
<br />
/* Ensure the text block fills width */<br />
.dw-card .dw-row > div {<br />
width: 100%;<br />
}<br />
<br />
/* Slight spacing tweaks for headings on mobile */<br />
.dw-card .dw-headline {<br />
margin: 4px 0 4px;<br />
}<br />
/* Stack footer sections vertically */<br />
#footer {<br />
display: flex !important;<br />
flex-direction: column !important;<br />
align-items: center !important;<br />
gap: 0 !important;<br />
width: 100% !important;<br />
padding: 1rem 1rem !important;<br />
box-sizing: border-box;<br />
}<br />
<br />
/* Each UL gets full width + centered */<br />
#footer ul {<br />
width: 100% !important;<br />
display: flex !important;<br />
flex-direction: row !important; <br />
justify-content: space-between !important; <br />
align-items: center !important;<br />
margin: 0 !important;<br />
padding: 0 !important;<br />
list-style: none !important;<br />
}<br />
.partner-logos {<br />
display: flex;<br />
flex-wrap: wrap; <br />
justify-content: space-between !important; <br />
align-items: center!important; <br />
gap: 2.2rem; <br />
padding: 0 1rem 1rem 1rem; <br />
background: transparent;<br />
}<br />
#partner-logos { <br />
justify-content: space-between !important; <br />
}<br />
.partner-logos img {<br />
height: 24px;<br />
width: auto;<br />
object-fit:contain;<br />
}<br />
<br />
}</div>
Ivans
https://dsignweek.servus.at/index.php?title=MediaWiki:Common.css&diff=1439
MediaWiki:Common.css
2025-11-20T14:37:47Z
<p>Ivans: </p>
<hr />
<div>/* CSS placed here will be applied to all skins */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
#footer-info-lastmod {<br />
display: none !important;<br />
}<br />
<br />
/* Vector 2022: align user links (language, username, etc.) to the top */<br />
body.skin-vector-2022 .vector-user-links-main {<br />
display: flex; /* make sure it's flexbox */<br />
align-items: flex-start; /* align children to the top of the div */<br />
}<br />
/* Hide the Translate extension banner ("Translate this page; This page has changes…") */<br />
body.skin-vector-2022 .mw-pt-translate-header {<br />
display: none !important;<br />
}<br />
/* Vector 2022 – hide entire tab/navigation bar (left-navigation) for all users */<br />
.skin-vector-2022 #left-navigation {<br />
display: none !important;<br />
}<br />
/* Vector 2022: right-align items in the page toolbar (Edit / View history / Tools) */<br />
.skin-vector-2022 .vector-page-toolbar-container {<br />
display: flex !important;<br />
justify-content: flex-end !important; /* pushes items to the right */<br />
align-items: center; /* vertical alignment */<br />
}<br />
<br />
<br />
<br />
.mw-anon.skin-vector-2022 #ca-nstab-main, /* page title tab (Main Page / Article) */<br />
.mw-anon.skin-vector-2022 #ca-talk, /* Talk tab */<br />
.mw-anon.skin-vector-2022 #ca-view, /* "Read" tab */<br />
.mw-anon.skin-vector-2022 #ca-history, /* View history */<br />
.mw-anon.skin-vector-2022 #ca-watch,<br />
.mw-anon.skin-vector-2022 #ca-unwatch,<br />
.mw-anon.skin-vector-2022 #ca-more { /* "Tools" dropdown */<br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* === GLOBAL TYPOGRAPHY === */<br />
<br />
/* Base body text — Liberation Sans */<br />
html,<br />
body,<br />
.mw-body,<br />
.mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 1.2rem; /* base = 16px */<br />
line-height: 1.15; <br />
}<br />
<br />
/* Paragraphs and list text */<br />
p, li, td, th {<br />
font-size: 1.1rem; /* slightly larger than base text */<br />
}<br />
<br />
/* === HEADINGS — Linux Libertine === */<br />
h1, h2, h3, h4, h5, h6,<br />
.firstHeading,<br />
.mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
.mw-body h1, .mw-heading1, .mw-body-content h1, .mw-body-content .mw-heading1 { font-size: 3rem; line-height: 1.15; } <br />
<br />
<br />
<br />
/* === SIDEBAR MENU === */<br />
#mw-panel,<br />
.vector-menu-content,<br />
#p-navigation,<br />
#p-tb,<br />
#p-lang {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem; /* sidebar smaller for contrast */<br />
line-height: 1.4;<br />
}<br />
<br />
#mw-panel,<br />
.vector-menu-content {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 90%, rgba(192, 192, 192, 1) 100%);<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
#partner-logos {<br />
display: flex;<br />
justify-content: right;<br />
align-items: right;<br />
flex-wrap: wrap;<br />
gap: 1rem;<br />
margin-top:0.8rem;<br />
<br />
}<br />
<br />
#partner-logos img {<br />
height: 32px;<br />
object-fit: contain; /* keeps aspect ratio, fits within the box */<br />
max-width: 100%; /* prevents overflow */<br />
display: block; /* removes inline gaps below images */<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
.wikitable.custom-table {<br />
width: 100%;<br />
border-collapse: separate;<br />
border-spacing: 0;<br />
border: none;<br />
background-color: #fff;<br />
border-radius: 0.5rem;<br />
overflow: hidden; /* so rounded corners clip correctly */<br />
font-size: 0.95rem;<br />
}<br />
<br />
<br />
<br />
/* Header cells */<br />
.wikitable.custom-table th {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
color: #000;<br />
font-weight: 600;<br />
text-align: left;<br />
padding: 0.75rem 1rem;<br />
border-bottom: 2px solid #d0d9ff;<br />
}<br />
<br />
/* Data cells */<br />
.wikitable.custom-table td {<br />
padding: 0.65rem 1rem;<br />
border-bottom: 1px solid #eee;<br />
}<br />
<br />
/* Zebra striping */<br />
.wikitable.custom-table tr:nth-child(even) td {<br />
background-color: #f9fbff;<br />
}<br />
<br />
/* Hover effect */<br />
.wikitable.custom-table tr:hover td {<br />
background: #FFF;<br />
background: linear-gradient(0deg,rgba(0, 0, 255, 1) 0%, rgba(255, 255, 255, 1) 15%, rgba(255, 255, 255, 1) 85%, rgba(0, 0, 255, 1) 100%);<br />
}<br />
<br />
/* Rounded corners for first & last rows */<br />
.wikitable.custom-table tr:first-child th:first-child {<br />
border-top-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:first-child th:last-child {<br />
border-top-right-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:first-child {<br />
border-bottom-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:last-child {<br />
border-bottom-right-radius: 0.5rem;<br />
}<br />
<br />
<br />
/* === Mobile Responsive Tables (no HTML change needed) === */<br />
@media (max-width: 768px) {<br />
<br />
/* Allow horizontal scrolling on narrow screens */<br />
.wikitable.custom-table {<br />
display: block;<br />
width: 100%;<br />
overflow-x: auto;<br />
-webkit-overflow-scrolling: touch;<br />
}<br />
<br />
/* Prevent collapsing/squeezing of long cell content */<br />
.wikitable.custom-table tr,<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
white-space: nowrap;<br />
}<br />
<br />
/* Optional: slightly reduce padding for small screens */<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
padding: 0.5rem 0.75rem;<br />
}<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* Hide the automatic Tools and Special pages sections */<br />
#p-tb { <br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* MAIN-PAGE */<br />
<br />
/* === FONTS (yours) === */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
.mw-pt-languages {<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);}<br />
/* === GLOBAL TYPOGRAPHY === */<br />
html, body, .mw-body, .mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem;<br />
line-height: 1.1;<br />
}<br />
p, li, td, th { font-size: 1.1rem; line-height: 1.1; }<br />
h1, h2, h3, h4, h5, h6, .firstHeading, .mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
<br />
/* === d*sign week layout === */<br />
:root {<br />
--dw-border: #cfd8e3;<br />
--dw-card-bg: #f8fbff;<br />
}<br />
<br />
/* top ribbon */<br />
.dw-ribbon {<br />
height: 26px;<br />
background: linear-gradient(#8aa9ff, #ffffff);<br />
border-radius: 6px;<br />
margin: 0 0 14px 0;<br />
}<br />
<br />
<br />
.banner {<br />
display: flex;<br />
align-items: center;<br />
justify-content: space-between;<br />
gap: 1.5rem;<br />
padding: 0rem 1rem 0rem 1rem;<br />
text-align: left; /* centers text within its box */<br />
flex-wrap: wrap; <br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
background-size: 100% 200%;<br />
background-position: top;<br />
transition: background-position 0.4s ease-in-out;<br />
}<br />
.banner:hover {<br />
background-position: bottom;<br />
}<br />
<br />
<br />
.banner-icon img { <br />
width: 20vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 650px; /* prevent it from getting too big */ <br />
min-width: 120px; /* prevent it from getting too small */ <br />
padding-left: 2rem;}<br />
<br />
.dw-subtitle {<br />
font-size: 1.5rem;<br />
line-height: 1;<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle-banner {<br />
font-size: 3rem;<br />
}<br />
.dw-subtitle strong {<br />
<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle a {<br />
color: #0000FF !important; /* link color similar to your example */<br />
text-decoration: none;<br />
}<br />
<br />
.dw-subtitle a:hover {<br />
text-decoration: underline;<br />
}<br />
<br />
<br />
/* title & subtitle */<br />
.dw-title {<br />
text-align: center;<br />
line-height: 1.2;<br />
font-size: 2.5rem;<br />
font-weight: 700;<br />
letter-spacing: .02em;<br />
display: block;<br />
}<br />
<br />
<br />
/* grid */<br />
.dw-grid {<br />
display: flex;<br />
flex-wrap: wrap;<br />
gap: 16px;<br />
align-items: flex-start;<br />
margin-top: 14px;<br />
}<br />
.dw-col {<br />
flex: 1 1 520px;<br />
min-width: 320px;<br />
}<br />
<br />
/* cards */<br />
.dw-card {<br />
position: relative;<br />
border: 1px solid #C0C0C0;<br />
background: #FFFFFF !important;<br />
padding: 10px;<br />
margin-bottom: 10px;<br />
}<br />
.dw-card:hover {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 75%, rgba(192, 192, 192, 1) 100%)!important;<br />
}<br />
span.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
<br />
}<br />
<br />
.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 2rem !important; <br />
}<br />
<br />
<br />
.dw-card .dw-row {<br />
display: flex;<br />
flex-wrap: wrap;<br />
align-items: flex-start;<br />
gap: 12px;<br />
width: 100%;<br />
box-sizing: border-box;<br />
padding: 14px; /* ✅ move the spacing here instead of .dw-card */<br />
}<br />
<br />
.dw-card .dw-row > div:last-child {<br />
flex: 1;<br />
min-width: 0; /* ✅ prevents overflow due to long text/links */<br />
}<br />
<br />
.dw-card .dw-icon img { height: auto; }<br />
.dw-card .dw-headline {<br />
display: block;<br />
font-size: 1.5rem;<br />
font-weight: 700;<br />
margin: 0px 0 0px;<br />
}<br />
.dw-card .dw-body { line-height: 1.6; width: 100%;}<br />
.dw-card .dw-body--spacious { line-height: 1.8; }<br />
<br />
<br />
.dw-icon,<br />
.dw-subtitle {<br />
background: transparent !important; /* ✅ makes logo + text boxes transparent */<br />
}<br />
<br />
<br />
/* Code blocks explicitly monospace (so they don't inherit) */<br />
pre, code, kbd, samp, tt, .mw-code {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
text-indent: 0 !important;<br />
}<br />
<br />
/* ===== Remove first-line indentation site-wide ===== */<br />
.mw-parser-output p,<br />
.mw-parser-output li p,<br />
.mw-body-content p,<br />
.dw-card .dw-body p {<br />
text-indent: 0 !important;<br />
}<br />
<br />
<br />
pre {<br />
margin: 0 !important;<br />
padding: 0rem !important; /* add a little inner spacing so text isn’t on the edge */<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);<br />
border: none !important;<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
white-space: pre-wrap !important; /* allows wrapping */<br />
word-break: break-word !important;<br />
line-height: 1 !important;<br />
<br />
}<br />
<br />
.dw-card .pre {<br />
display: block; /* ensures it behaves as a block element */<br />
width: 100% !important;/* takes up the full width of .dw-card */<br />
box-sizing: border-box;/* includes padding/border in width calculation */<br />
margin: 0;<br />
padding: 0;<br />
}<br />
<br />
<br />
div.mw-content-ltr.mw-parser-output {<br />
background: #FFFFFF;<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 97%, rgba(192, 192, 192, 1) 100%);<br />
padding: 1rem;<br />
}<br />
<br />
<br />
<br />
.mw-page-container { <br />
background-image: url("https://dsignweek.servus.at/images/9/9d/Bg-01.png"); background-repeat: repeat-y; <br />
/* ✅ repeat vertically */ background-size: 100% auto; <br />
/* stretch to page width, keep height natural <br />
*/ background-position: center top; <br />
/* start at the top, center horizontally <br />
*/ background-attachment: scroll; <br />
/* move with page scroll */ background-color: #ffffff; /* fallback behind transparent areas */ }<br />
<br />
<br />
div#mw-head {<br />
background: transparent !important;<br />
}<br />
<br />
<br />
.dw-headline, .mw-headline {<br />
margin: 0 !important;<br />
}<br />
<br />
.skin-vector-2022 header.vector-header { box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8)!important; }<br />
<br />
.skin-vector-2022 #vector-sticky-header.vector-sticky-header {<br />
box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8) !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* ===== Mobile: stack card content vertically ===== */<br />
@media (max-width: 720px) {<br />
<br />
html, body {<br />
overflow-x: hidden !important;<br />
width: 100% !important;<br />
}<br />
.mw-page-container {<br />
max-width: 100vw !important;<br />
}<br />
<br />
.mw-parser-output {<br />
box-sizing: border-box;<br />
overflow-x: hidden !important;<br />
}<br />
<br />
.banner-icon img, img {<br />
max-width: 100% !important;<br />
width: 100% !important;<br />
object-fit: contain;<br />
}<br />
<br />
.mw-page-container { <br />
background-image: none !important;<br />
background-color: #ffffff !important;<br />
padding: 0 !important; /* ← fixed */<br />
padding-right: 10px !important; /* ← fixed */<br />
padding-left: 10px !important; /* ← fixed */<br />
margin: 0 !important;<br />
box-sizing: border-box;<br />
overflow-x: hidden !important;<br />
}<br />
.dw-col {<br />
flex: 1 1 auto !important; /* let them shrink freely */<br />
min-width: 0 !important; /* remove the minimum width restriction */<br />
}<br />
<br />
.vector-dropdown-content {<br />
width: 100vw !important;<br />
max-width: none !important;<br />
padding-right: 10px !important; /* ← fixed */<br />
padding-left: 10px !important; /* ← fixed */<br />
}<br />
.dw-card {<br />
padding:0;}<br />
div#content.mw-body {<br />
padding: 0rem;}<br />
div.mw-content-ltr.mw-parser-output {<br />
padding: 0.5rem;<br />
}<br />
<br />
.banner-icon img { <br />
width: 75vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 400px; /* prevent it from getting too big */ <br />
min-width: 80px; /* prevent it from getting too small */ <br />
padding-left: 0rem;}<br />
<br />
/* Stack everything in a column */<br />
.dw-card .dw-row {<br />
display: flex;<br />
flex-direction: column;<br />
align-items: stretch; /* full width for text block */<br />
gap: 10px;<br />
}<br />
<br />
/* Make the icon its own row and center it */<br />
.dw-card .dw-icon {<br />
display: flex;<br />
justify-content: center;<br />
align-items: center;<br />
margin: 0; /* remove any left/right spacing from desktop */<br />
}<br />
<br />
.dw-card .dw-icon img {<br />
width: 72px; /* tidy mobile size */<br />
height: auto;<br />
}<br />
<br />
/* Ensure the text block fills width */<br />
.dw-card .dw-row > div {<br />
width: 100%;<br />
}<br />
<br />
/* Slight spacing tweaks for headings on mobile */<br />
.dw-card .dw-headline {<br />
margin: 4px 0 4px;<br />
}<br />
/* Stack footer sections vertically */<br />
#footer {<br />
display: flex !important;<br />
flex-direction: column !important;<br />
align-items: center !important;<br />
gap: 0 !important;<br />
width: 100% !important;<br />
padding: 1rem 1rem !important;<br />
box-sizing: border-box;<br />
}<br />
<br />
/* Each UL gets full width + centered */<br />
#footer ul {<br />
width: 100% !important;<br />
display: flex !important;<br />
flex-direction: row !important; <br />
justify-content: space-between !important; <br />
align-items: center !important;<br />
margin: 0 !important;<br />
padding: 0 !important;<br />
list-style: none !important;<br />
}<br />
.partner-logos {<br />
display: flex;<br />
flex-wrap: wrap; <br />
justify-content: space-between !important; <br />
align-items: center!important; <br />
gap: 2.2rem; <br />
padding: 0 1rem 1rem 1rem; <br />
background: transparent;<br />
}<br />
#partner-logos { <br />
justify-content: space-between !important; <br />
}<br />
.partner-logos img {<br />
height: 24px;<br />
width: auto;<br />
object-fit:contain;<br />
}<br />
<br />
}</div>
Ivans
https://dsignweek.servus.at/index.php?title=MediaWiki:Common.css&diff=1438
MediaWiki:Common.css
2025-11-20T14:36:49Z
<p>Ivans: </p>
<hr />
<div>/* CSS placed here will be applied to all skins */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
#footer-info-lastmod {<br />
display: none !important;<br />
}<br />
<br />
/* Vector 2022: align user links (language, username, etc.) to the top */<br />
body.skin-vector-2022 .vector-user-links-main {<br />
display: flex; /* make sure it's flexbox */<br />
align-items: flex-start; /* align children to the top of the div */<br />
}<br />
/* Hide the Translate extension banner ("Translate this page; This page has changes…") */<br />
body.skin-vector-2022 .mw-pt-translate-header {<br />
display: none !important;<br />
}<br />
/* Vector 2022 – hide entire tab/navigation bar (left-navigation) for all users */<br />
.skin-vector-2022 #left-navigation {<br />
display: none !important;<br />
}<br />
/* Vector 2022: right-align items in the page toolbar (Edit / View history / Tools) */<br />
.skin-vector-2022 .vector-page-toolbar-container {<br />
display: flex !important;<br />
justify-content: flex-end !important; /* pushes items to the right */<br />
align-items: center; /* vertical alignment */<br />
}<br />
<br />
<br />
<br />
.mw-anon.skin-vector-2022 #ca-nstab-main, /* page title tab (Main Page / Article) */<br />
.mw-anon.skin-vector-2022 #ca-talk, /* Talk tab */<br />
.mw-anon.skin-vector-2022 #ca-view, /* "Read" tab */<br />
.mw-anon.skin-vector-2022 #ca-history, /* View history */<br />
.mw-anon.skin-vector-2022 #ca-watch,<br />
.mw-anon.skin-vector-2022 #ca-unwatch,<br />
.mw-anon.skin-vector-2022 #ca-more { /* "Tools" dropdown */<br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* === GLOBAL TYPOGRAPHY === */<br />
<br />
/* Base body text — Liberation Sans */<br />
html,<br />
body,<br />
.mw-body,<br />
.mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 1.2rem; /* base = 16px */<br />
line-height: 1.15; <br />
}<br />
<br />
/* Paragraphs and list text */<br />
p, li, td, th {<br />
font-size: 1.1rem; /* slightly larger than base text */<br />
}<br />
<br />
/* === HEADINGS — Linux Libertine === */<br />
h1, h2, h3, h4, h5, h6,<br />
.firstHeading,<br />
.mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
.mw-body h1, .mw-heading1, .mw-body-content h1, .mw-body-content .mw-heading1 { font-size: 3rem; line-height: 1.15; } <br />
<br />
<br />
<br />
/* === SIDEBAR MENU === */<br />
#mw-panel,<br />
.vector-menu-content,<br />
#p-navigation,<br />
#p-tb,<br />
#p-lang {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem; /* sidebar smaller for contrast */<br />
line-height: 1.4;<br />
}<br />
<br />
#mw-panel,<br />
.vector-menu-content {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 90%, rgba(192, 192, 192, 1) 100%);<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
#partner-logos {<br />
display: flex;<br />
justify-content: right;<br />
align-items: right;<br />
flex-wrap: wrap;<br />
gap: 1rem;<br />
margin-top:0.8rem;<br />
<br />
}<br />
<br />
#partner-logos img {<br />
height: 32px;<br />
object-fit: contain; /* keeps aspect ratio, fits within the box */<br />
max-width: 100%; /* prevents overflow */<br />
display: block; /* removes inline gaps below images */<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
.wikitable.custom-table {<br />
width: 100%;<br />
border-collapse: separate;<br />
border-spacing: 0;<br />
border: none;<br />
background-color: #fff;<br />
border-radius: 0.5rem;<br />
overflow: hidden; /* so rounded corners clip correctly */<br />
font-size: 0.95rem;<br />
}<br />
<br />
<br />
<br />
/* Header cells */<br />
.wikitable.custom-table th {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
color: #000;<br />
font-weight: 600;<br />
text-align: left;<br />
padding: 0.75rem 1rem;<br />
border-bottom: 2px solid #d0d9ff;<br />
}<br />
<br />
/* Data cells */<br />
.wikitable.custom-table td {<br />
padding: 0.65rem 1rem;<br />
border-bottom: 1px solid #eee;<br />
}<br />
<br />
/* Zebra striping */<br />
.wikitable.custom-table tr:nth-child(even) td {<br />
background-color: #f9fbff;<br />
}<br />
<br />
/* Hover effect */<br />
.wikitable.custom-table tr:hover td {<br />
background: #FFF;<br />
background: linear-gradient(0deg,rgba(0, 0, 255, 1) 0%, rgba(255, 255, 255, 1) 15%, rgba(255, 255, 255, 1) 85%, rgba(0, 0, 255, 1) 100%);<br />
}<br />
<br />
/* Rounded corners for first & last rows */<br />
.wikitable.custom-table tr:first-child th:first-child {<br />
border-top-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:first-child th:last-child {<br />
border-top-right-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:first-child {<br />
border-bottom-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:last-child {<br />
border-bottom-right-radius: 0.5rem;<br />
}<br />
<br />
<br />
/* === Mobile Responsive Tables (no HTML change needed) === */<br />
@media (max-width: 768px) {<br />
<br />
/* Allow horizontal scrolling on narrow screens */<br />
.wikitable.custom-table {<br />
display: block;<br />
width: 100%;<br />
overflow-x: auto;<br />
-webkit-overflow-scrolling: touch;<br />
}<br />
<br />
/* Prevent collapsing/squeezing of long cell content */<br />
.wikitable.custom-table tr,<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
white-space: nowrap;<br />
}<br />
<br />
/* Optional: slightly reduce padding for small screens */<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
padding: 0.5rem 0.75rem;<br />
}<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* Hide the automatic Tools and Special pages sections */<br />
#p-tb { <br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* MAIN-PAGE */<br />
<br />
/* === FONTS (yours) === */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
.mw-pt-languages {<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);}<br />
/* === GLOBAL TYPOGRAPHY === */<br />
html, body, .mw-body, .mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem;<br />
line-height: 1.1;<br />
}<br />
p, li, td, th { font-size: 1.1rem; line-height: 1.1; }<br />
h1, h2, h3, h4, h5, h6, .firstHeading, .mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
<br />
/* === d*sign week layout === */<br />
:root {<br />
--dw-border: #cfd8e3;<br />
--dw-card-bg: #f8fbff;<br />
}<br />
<br />
/* top ribbon */<br />
.dw-ribbon {<br />
height: 26px;<br />
background: linear-gradient(#8aa9ff, #ffffff);<br />
border-radius: 6px;<br />
margin: 0 0 14px 0;<br />
}<br />
<br />
<br />
.banner {<br />
display: flex;<br />
align-items: center;<br />
justify-content: space-between;<br />
gap: 1.5rem;<br />
padding: 0rem 1rem 0rem 1rem;<br />
text-align: left; /* centers text within its box */<br />
flex-wrap: wrap; <br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
background-size: 100% 200%;<br />
background-position: top;<br />
transition: background-position 0.4s ease-in-out;<br />
}<br />
.banner:hover {<br />
background-position: bottom;<br />
}<br />
<br />
<br />
.banner-icon img { <br />
width: 20vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 650px; /* prevent it from getting too big */ <br />
min-width: 120px; /* prevent it from getting too small */ <br />
padding-left: 2rem;}<br />
<br />
.dw-subtitle {<br />
font-size: 1.5rem;<br />
line-height: 1;<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle-banner {<br />
font-size: 3rem;<br />
}<br />
.dw-subtitle strong {<br />
<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle a {<br />
color: #0000FF !important; /* link color similar to your example */<br />
text-decoration: none;<br />
}<br />
<br />
.dw-subtitle a:hover {<br />
text-decoration: underline;<br />
}<br />
<br />
<br />
/* title & subtitle */<br />
.dw-title {<br />
text-align: center;<br />
line-height: 1.2;<br />
font-size: 2.5rem;<br />
font-weight: 700;<br />
letter-spacing: .02em;<br />
display: block;<br />
}<br />
<br />
<br />
/* grid */<br />
.dw-grid {<br />
display: flex;<br />
flex-wrap: wrap;<br />
gap: 16px;<br />
align-items: flex-start;<br />
margin-top: 14px;<br />
}<br />
.dw-col {<br />
flex: 1 1 520px;<br />
min-width: 320px;<br />
}<br />
<br />
/* cards */<br />
.dw-card {<br />
position: relative;<br />
border: 1px solid #C0C0C0;<br />
background: #FFFFFF !important;<br />
padding: 10px;<br />
margin-bottom: 10px;<br />
}<br />
.dw-card:hover {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 75%, rgba(192, 192, 192, 1) 100%)!important;<br />
}<br />
span.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
<br />
}<br />
<br />
.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 2rem !important; <br />
}<br />
<br />
<br />
.dw-card .dw-row {<br />
display: flex;<br />
flex-wrap: wrap;<br />
align-items: flex-start;<br />
gap: 12px;<br />
width: 100%;<br />
box-sizing: border-box;<br />
padding: 14px; /* ✅ move the spacing here instead of .dw-card */<br />
}<br />
<br />
.dw-card .dw-row > div:last-child {<br />
flex: 1;<br />
min-width: 0; /* ✅ prevents overflow due to long text/links */<br />
}<br />
<br />
.dw-card .dw-icon img { height: auto; }<br />
.dw-card .dw-headline {<br />
display: block;<br />
font-size: 1.5rem;<br />
font-weight: 700;<br />
margin: 0px 0 0px;<br />
}<br />
.dw-card .dw-body { line-height: 1.6; width: 100%;}<br />
.dw-card .dw-body--spacious { line-height: 1.8; }<br />
<br />
<br />
.dw-icon,<br />
.dw-subtitle {<br />
background: transparent !important; /* ✅ makes logo + text boxes transparent */<br />
}<br />
<br />
<br />
/* Code blocks explicitly monospace (so they don't inherit) */<br />
pre, code, kbd, samp, tt, .mw-code {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
text-indent: 0 !important;<br />
}<br />
<br />
/* ===== Remove first-line indentation site-wide ===== */<br />
.mw-parser-output p,<br />
.mw-parser-output li p,<br />
.mw-body-content p,<br />
.dw-card .dw-body p {<br />
text-indent: 0 !important;<br />
}<br />
<br />
<br />
pre {<br />
margin: 0 !important;<br />
padding: 0rem !important; /* add a little inner spacing so text isn’t on the edge */<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);<br />
border: none !important;<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
white-space: pre-wrap !important; /* allows wrapping */<br />
word-break: break-word !important;<br />
line-height: 1 !important;<br />
<br />
}<br />
<br />
.dw-card .pre {<br />
display: block; /* ensures it behaves as a block element */<br />
width: 100% !important;/* takes up the full width of .dw-card */<br />
box-sizing: border-box;/* includes padding/border in width calculation */<br />
margin: 0;<br />
padding: 0;<br />
}<br />
<br />
<br />
div.mw-content-ltr.mw-parser-output {<br />
background: #FFFFFF;<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 97%, rgba(192, 192, 192, 1) 100%);<br />
padding: 1rem;<br />
}<br />
<br />
<br />
<br />
.mw-page-container { <br />
background-image: url("https://dsignweek.servus.at/images/9/9d/Bg-01.png"); background-repeat: repeat-y; <br />
/* ✅ repeat vertically */ background-size: 100% auto; <br />
/* stretch to page width, keep height natural <br />
*/ background-position: center top; <br />
/* start at the top, center horizontally <br />
*/ background-attachment: scroll; <br />
/* move with page scroll */ background-color: #ffffff; /* fallback behind transparent areas */ }<br />
<br />
<br />
div#mw-head {<br />
background: transparent !important;<br />
}<br />
<br />
<br />
.dw-headline, .mw-headline {<br />
margin: 0 !important;<br />
}<br />
<br />
.skin-vector-2022 header.vector-header { box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8)!important; }<br />
<br />
.skin-vector-2022 #vector-sticky-header.vector-sticky-header {<br />
box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8) !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* ===== Mobile: stack card content vertically ===== */<br />
@media (max-width: 720px) {<br />
<br />
html, body {<br />
overflow-x: hidden !important;<br />
width: 100% !important;<br />
}<br />
.mw-page-container {<br />
max-width: 100vw !important;<br />
}<br />
<br />
.mw-parser-output {<br />
box-sizing: border-box;<br />
overflow-x: hidden !important;<br />
}<br />
<br />
.banner-icon img, img {<br />
max-width: 100% !important;<br />
width: 100% !important;<br />
object-fit: contain;<br />
}<br />
<br />
.mw-page-container { <br />
background-image: none !important;<br />
background-color: #ffffff !important;<br />
padding: 0 !important; /* ← fixed */<br />
padding-right: 10px !important; /* ← fixed */<br />
padding-left: 10px !important; /* ← fixed */<br />
margin: 0 !important;<br />
box-sizing: border-box;<br />
overflow-x: hidden !important;<br />
}<br />
.dw-col {<br />
flex: 1 1 auto !important; /* let them shrink freely */<br />
min-width: 0 !important; /* remove the minimum width restriction */<br />
}<br />
<br />
.vector-dropdown-content {<br />
width: 100vw !important;<br />
max-width: none !important;<br />
}<br />
.dw-card {<br />
padding:0;}<br />
div#content.mw-body {<br />
padding: 0rem;}<br />
div.mw-content-ltr.mw-parser-output {<br />
padding: 0.5rem;<br />
}<br />
<br />
.banner-icon img { <br />
width: 75vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 400px; /* prevent it from getting too big */ <br />
min-width: 80px; /* prevent it from getting too small */ <br />
padding-left: 0rem;}<br />
<br />
/* Stack everything in a column */<br />
.dw-card .dw-row {<br />
display: flex;<br />
flex-direction: column;<br />
align-items: stretch; /* full width for text block */<br />
gap: 10px;<br />
}<br />
<br />
/* Make the icon its own row and center it */<br />
.dw-card .dw-icon {<br />
display: flex;<br />
justify-content: center;<br />
align-items: center;<br />
margin: 0; /* remove any left/right spacing from desktop */<br />
}<br />
<br />
.dw-card .dw-icon img {<br />
width: 72px; /* tidy mobile size */<br />
height: auto;<br />
}<br />
<br />
/* Ensure the text block fills width */<br />
.dw-card .dw-row > div {<br />
width: 100%;<br />
}<br />
<br />
/* Slight spacing tweaks for headings on mobile */<br />
.dw-card .dw-headline {<br />
margin: 4px 0 4px;<br />
}<br />
/* Stack footer sections vertically */<br />
#footer {<br />
display: flex !important;<br />
flex-direction: column !important;<br />
align-items: center !important;<br />
gap: 0 !important;<br />
width: 100% !important;<br />
padding: 1rem 1rem !important;<br />
box-sizing: border-box;<br />
}<br />
<br />
/* Each UL gets full width + centered */<br />
#footer ul {<br />
width: 100% !important;<br />
display: flex !important;<br />
flex-direction: row !important; <br />
justify-content: space-between !important; <br />
align-items: center !important;<br />
margin: 0 !important;<br />
padding: 0 !important;<br />
list-style: none !important;<br />
}<br />
.partner-logos {<br />
display: flex;<br />
flex-wrap: wrap; <br />
justify-content: space-between !important; <br />
align-items: center!important; <br />
gap: 1.8rem; <br />
padding: 0 1rem 1rem 1rem; <br />
background: transparent;<br />
}<br />
#partner-logos { <br />
justify-content: space-between !important; <br />
}<br />
.partner-logos img {<br />
height: 24px;<br />
width: auto;<br />
object-fit:contain;<br />
}<br />
<br />
}</div>
Ivans
https://dsignweek.servus.at/index.php?title=MediaWiki:Common.css&diff=1437
MediaWiki:Common.css
2025-11-20T14:35:38Z
<p>Ivans: </p>
<hr />
<div>/* CSS placed here will be applied to all skins */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
#footer-info-lastmod {<br />
display: none !important;<br />
}<br />
<br />
/* Vector 2022: align user links (language, username, etc.) to the top */<br />
body.skin-vector-2022 .vector-user-links-main {<br />
display: flex; /* make sure it's flexbox */<br />
align-items: flex-start; /* align children to the top of the div */<br />
}<br />
/* Hide the Translate extension banner ("Translate this page; This page has changes…") */<br />
body.skin-vector-2022 .mw-pt-translate-header {<br />
display: none !important;<br />
}<br />
/* Vector 2022 – hide entire tab/navigation bar (left-navigation) for all users */<br />
.skin-vector-2022 #left-navigation {<br />
display: none !important;<br />
}<br />
/* Vector 2022: right-align items in the page toolbar (Edit / View history / Tools) */<br />
.skin-vector-2022 .vector-page-toolbar-container {<br />
display: flex !important;<br />
justify-content: flex-end !important; /* pushes items to the right */<br />
align-items: center; /* vertical alignment */<br />
}<br />
<br />
<br />
<br />
.mw-anon.skin-vector-2022 #ca-nstab-main, /* page title tab (Main Page / Article) */<br />
.mw-anon.skin-vector-2022 #ca-talk, /* Talk tab */<br />
.mw-anon.skin-vector-2022 #ca-view, /* "Read" tab */<br />
.mw-anon.skin-vector-2022 #ca-history, /* View history */<br />
.mw-anon.skin-vector-2022 #ca-watch,<br />
.mw-anon.skin-vector-2022 #ca-unwatch,<br />
.mw-anon.skin-vector-2022 #ca-more { /* "Tools" dropdown */<br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* === GLOBAL TYPOGRAPHY === */<br />
<br />
/* Base body text — Liberation Sans */<br />
html,<br />
body,<br />
.mw-body,<br />
.mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 1.2rem; /* base = 16px */<br />
line-height: 1.15; <br />
}<br />
<br />
/* Paragraphs and list text */<br />
p, li, td, th {<br />
font-size: 1.1rem; /* slightly larger than base text */<br />
}<br />
<br />
/* === HEADINGS — Linux Libertine === */<br />
h1, h2, h3, h4, h5, h6,<br />
.firstHeading,<br />
.mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
.mw-body h1, .mw-heading1, .mw-body-content h1, .mw-body-content .mw-heading1 { font-size: 3rem; line-height: 1.15; } <br />
<br />
<br />
<br />
/* === SIDEBAR MENU === */<br />
#mw-panel,<br />
.vector-menu-content,<br />
#p-navigation,<br />
#p-tb,<br />
#p-lang {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem; /* sidebar smaller for contrast */<br />
line-height: 1.4;<br />
}<br />
<br />
#mw-panel,<br />
.vector-menu-content {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 90%, rgba(192, 192, 192, 1) 100%);<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
#partner-logos {<br />
display: flex;<br />
justify-content: right;<br />
align-items: right;<br />
flex-wrap: wrap;<br />
gap: 1rem;<br />
margin-top:0.8rem;<br />
<br />
}<br />
<br />
#partner-logos img {<br />
height: 32px;<br />
object-fit: contain; /* keeps aspect ratio, fits within the box */<br />
max-width: 100%; /* prevents overflow */<br />
display: block; /* removes inline gaps below images */<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
.wikitable.custom-table {<br />
width: 100%;<br />
border-collapse: separate;<br />
border-spacing: 0;<br />
border: none;<br />
background-color: #fff;<br />
border-radius: 0.5rem;<br />
overflow: hidden; /* so rounded corners clip correctly */<br />
font-size: 0.95rem;<br />
}<br />
<br />
<br />
<br />
/* Header cells */<br />
.wikitable.custom-table th {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
color: #000;<br />
font-weight: 600;<br />
text-align: left;<br />
padding: 0.75rem 1rem;<br />
border-bottom: 2px solid #d0d9ff;<br />
}<br />
<br />
/* Data cells */<br />
.wikitable.custom-table td {<br />
padding: 0.65rem 1rem;<br />
border-bottom: 1px solid #eee;<br />
}<br />
<br />
/* Zebra striping */<br />
.wikitable.custom-table tr:nth-child(even) td {<br />
background-color: #f9fbff;<br />
}<br />
<br />
/* Hover effect */<br />
.wikitable.custom-table tr:hover td {<br />
background: #FFF;<br />
background: linear-gradient(0deg,rgba(0, 0, 255, 1) 0%, rgba(255, 255, 255, 1) 15%, rgba(255, 255, 255, 1) 85%, rgba(0, 0, 255, 1) 100%);<br />
}<br />
<br />
/* Rounded corners for first & last rows */<br />
.wikitable.custom-table tr:first-child th:first-child {<br />
border-top-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:first-child th:last-child {<br />
border-top-right-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:first-child {<br />
border-bottom-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:last-child {<br />
border-bottom-right-radius: 0.5rem;<br />
}<br />
<br />
<br />
/* === Mobile Responsive Tables (no HTML change needed) === */<br />
@media (max-width: 768px) {<br />
<br />
/* Allow horizontal scrolling on narrow screens */<br />
.wikitable.custom-table {<br />
display: block;<br />
width: 100%;<br />
overflow-x: auto;<br />
-webkit-overflow-scrolling: touch;<br />
}<br />
<br />
/* Prevent collapsing/squeezing of long cell content */<br />
.wikitable.custom-table tr,<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
white-space: nowrap;<br />
}<br />
<br />
/* Optional: slightly reduce padding for small screens */<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
padding: 0.5rem 0.75rem;<br />
}<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* Hide the automatic Tools and Special pages sections */<br />
#p-tb { <br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* MAIN-PAGE */<br />
<br />
/* === FONTS (yours) === */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
.mw-pt-languages {<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);}<br />
/* === GLOBAL TYPOGRAPHY === */<br />
html, body, .mw-body, .mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem;<br />
line-height: 1.1;<br />
}<br />
p, li, td, th { font-size: 1.1rem; line-height: 1.1; }<br />
h1, h2, h3, h4, h5, h6, .firstHeading, .mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
<br />
/* === d*sign week layout === */<br />
:root {<br />
--dw-border: #cfd8e3;<br />
--dw-card-bg: #f8fbff;<br />
}<br />
<br />
/* top ribbon */<br />
.dw-ribbon {<br />
height: 26px;<br />
background: linear-gradient(#8aa9ff, #ffffff);<br />
border-radius: 6px;<br />
margin: 0 0 14px 0;<br />
}<br />
<br />
<br />
.banner {<br />
display: flex;<br />
align-items: center;<br />
justify-content: space-between;<br />
gap: 1.5rem;<br />
padding: 0rem 1rem 0rem 1rem;<br />
text-align: left; /* centers text within its box */<br />
flex-wrap: wrap; <br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
background-size: 100% 200%;<br />
background-position: top;<br />
transition: background-position 0.4s ease-in-out;<br />
}<br />
.banner:hover {<br />
background-position: bottom;<br />
}<br />
<br />
<br />
.banner-icon img { <br />
width: 20vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 650px; /* prevent it from getting too big */ <br />
min-width: 120px; /* prevent it from getting too small */ <br />
padding-left: 2rem;}<br />
<br />
.dw-subtitle {<br />
font-size: 1.5rem;<br />
line-height: 1;<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle-banner {<br />
font-size: 3rem;<br />
}<br />
.dw-subtitle strong {<br />
<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle a {<br />
color: #0000FF !important; /* link color similar to your example */<br />
text-decoration: none;<br />
}<br />
<br />
.dw-subtitle a:hover {<br />
text-decoration: underline;<br />
}<br />
<br />
<br />
/* title & subtitle */<br />
.dw-title {<br />
text-align: center;<br />
line-height: 1.2;<br />
font-size: 2.5rem;<br />
font-weight: 700;<br />
letter-spacing: .02em;<br />
display: block;<br />
}<br />
<br />
<br />
/* grid */<br />
.dw-grid {<br />
display: flex;<br />
flex-wrap: wrap;<br />
gap: 16px;<br />
align-items: flex-start;<br />
margin-top: 14px;<br />
}<br />
.dw-col {<br />
flex: 1 1 520px;<br />
min-width: 320px;<br />
}<br />
<br />
/* cards */<br />
.dw-card {<br />
position: relative;<br />
border: 1px solid #C0C0C0;<br />
background: #FFFFFF !important;<br />
padding: 10px;<br />
margin-bottom: 10px;<br />
}<br />
.dw-card:hover {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 75%, rgba(192, 192, 192, 1) 100%)!important;<br />
}<br />
span.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
<br />
}<br />
<br />
.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 2rem !important; <br />
}<br />
<br />
<br />
.dw-card .dw-row {<br />
display: flex;<br />
flex-wrap: wrap;<br />
align-items: flex-start;<br />
gap: 12px;<br />
width: 100%;<br />
box-sizing: border-box;<br />
padding: 14px; /* ✅ move the spacing here instead of .dw-card */<br />
}<br />
<br />
.dw-card .dw-row > div:last-child {<br />
flex: 1;<br />
min-width: 0; /* ✅ prevents overflow due to long text/links */<br />
}<br />
<br />
.dw-card .dw-icon img { height: auto; }<br />
.dw-card .dw-headline {<br />
display: block;<br />
font-size: 1.5rem;<br />
font-weight: 700;<br />
margin: 0px 0 0px;<br />
}<br />
.dw-card .dw-body { line-height: 1.6; width: 100%;}<br />
.dw-card .dw-body--spacious { line-height: 1.8; }<br />
<br />
<br />
.dw-icon,<br />
.dw-subtitle {<br />
background: transparent !important; /* ✅ makes logo + text boxes transparent */<br />
}<br />
<br />
<br />
/* Code blocks explicitly monospace (so they don't inherit) */<br />
pre, code, kbd, samp, tt, .mw-code {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
text-indent: 0 !important;<br />
}<br />
<br />
/* ===== Remove first-line indentation site-wide ===== */<br />
.mw-parser-output p,<br />
.mw-parser-output li p,<br />
.mw-body-content p,<br />
.dw-card .dw-body p {<br />
text-indent: 0 !important;<br />
}<br />
<br />
<br />
pre {<br />
margin: 0 !important;<br />
padding: 0rem !important; /* add a little inner spacing so text isn’t on the edge */<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);<br />
border: none !important;<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
white-space: pre-wrap !important; /* allows wrapping */<br />
word-break: break-word !important;<br />
line-height: 1 !important;<br />
<br />
}<br />
<br />
.dw-card .pre {<br />
display: block; /* ensures it behaves as a block element */<br />
width: 100% !important;/* takes up the full width of .dw-card */<br />
box-sizing: border-box;/* includes padding/border in width calculation */<br />
margin: 0;<br />
padding: 0;<br />
}<br />
<br />
<br />
div.mw-content-ltr.mw-parser-output {<br />
background: #FFFFFF;<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 97%, rgba(192, 192, 192, 1) 100%);<br />
padding: 1rem;<br />
}<br />
<br />
<br />
<br />
.mw-page-container { <br />
background-image: url("https://dsignweek.servus.at/images/9/9d/Bg-01.png"); background-repeat: repeat-y; <br />
/* ✅ repeat vertically */ background-size: 100% auto; <br />
/* stretch to page width, keep height natural <br />
*/ background-position: center top; <br />
/* start at the top, center horizontally <br />
*/ background-attachment: scroll; <br />
/* move with page scroll */ background-color: #ffffff; /* fallback behind transparent areas */ }<br />
<br />
<br />
div#mw-head {<br />
background: transparent !important;<br />
}<br />
<br />
<br />
.dw-headline, .mw-headline {<br />
margin: 0 !important;<br />
}<br />
<br />
.skin-vector-2022 header.vector-header { box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8)!important; }<br />
<br />
.skin-vector-2022 #vector-sticky-header.vector-sticky-header {<br />
box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8) !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* ===== Mobile: stack card content vertically ===== */<br />
@media (max-width: 720px) {<br />
<br />
html, body {<br />
overflow-x: hidden !important;<br />
width: 100% !important;<br />
}<br />
.mw-page-container {<br />
max-width: 100vw !important;<br />
}<br />
<br />
.mw-parser-output {<br />
box-sizing: border-box;<br />
overflow-x: hidden !important;<br />
}<br />
<br />
.banner-icon img, img {<br />
max-width: 100% !important;<br />
width: 100% !important;<br />
object-fit: contain;<br />
}<br />
<br />
.mw-page-container { <br />
background-image: none !important;<br />
background-color: #ffffff !important;<br />
padding: 0 !important; /* ← fixed */<br />
padding-right: 10px !important; /* ← fixed */<br />
padding-left: 10px !important; /* ← fixed */<br />
margin: 0 !important;<br />
box-sizing: border-box;<br />
overflow-x: hidden !important;<br />
}<br />
.dw-col {<br />
flex: 1 1 auto !important; /* let them shrink freely */<br />
min-width: 0 !important; /* remove the minimum width restriction */<br />
}<br />
<br />
.vector-dropdown-content {<br />
width: auto !important;<br />
max-width: none !important;<br />
}<br />
.dw-card {<br />
padding:0;}<br />
div#content.mw-body {<br />
padding: 0rem;}<br />
div.mw-content-ltr.mw-parser-output {<br />
padding: 0.5rem;<br />
}<br />
<br />
.banner-icon img { <br />
width: 75vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 400px; /* prevent it from getting too big */ <br />
min-width: 80px; /* prevent it from getting too small */ <br />
padding-left: 0rem;}<br />
<br />
/* Stack everything in a column */<br />
.dw-card .dw-row {<br />
display: flex;<br />
flex-direction: column;<br />
align-items: stretch; /* full width for text block */<br />
gap: 10px;<br />
}<br />
<br />
/* Make the icon its own row and center it */<br />
.dw-card .dw-icon {<br />
display: flex;<br />
justify-content: center;<br />
align-items: center;<br />
margin: 0; /* remove any left/right spacing from desktop */<br />
}<br />
<br />
.dw-card .dw-icon img {<br />
width: 72px; /* tidy mobile size */<br />
height: auto;<br />
}<br />
<br />
/* Ensure the text block fills width */<br />
.dw-card .dw-row > div {<br />
width: 100%;<br />
}<br />
<br />
/* Slight spacing tweaks for headings on mobile */<br />
.dw-card .dw-headline {<br />
margin: 4px 0 4px;<br />
}<br />
/* Stack footer sections vertically */<br />
#footer {<br />
display: flex !important;<br />
flex-direction: column !important;<br />
align-items: center !important;<br />
gap: 0 !important;<br />
width: 100% !important;<br />
padding: 1rem 1rem !important;<br />
box-sizing: border-box;<br />
}<br />
<br />
/* Each UL gets full width + centered */<br />
#footer ul {<br />
width: 100% !important;<br />
display: flex !important;<br />
flex-direction: row !important; <br />
align-items: center !important;<br />
margin: 0 !important;<br />
padding: 0 !important;<br />
list-style: none !important;<br />
}<br />
.partner-logos {<br />
display: flex;<br />
flex-wrap: wrap; <br />
justify-content: space-between !important; <br />
align-items: center!important; <br />
gap: 1rem; <br />
padding: 0 1rem 1rem 1rem; <br />
background: transparent;<br />
}<br />
#partner-logos { <br />
justify-content: space-between !important; <br />
}<br />
.partner-logos img {<br />
height: 24px;<br />
width: auto;<br />
object-fit:contain;<br />
}<br />
<br />
}</div>
Ivans
https://dsignweek.servus.at/index.php?title=MediaWiki:Common.css&diff=1436
MediaWiki:Common.css
2025-11-20T14:33:46Z
<p>Ivans: </p>
<hr />
<div>/* CSS placed here will be applied to all skins */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
#footer-info-lastmod {<br />
display: none !important;<br />
}<br />
<br />
/* Vector 2022: align user links (language, username, etc.) to the top */<br />
body.skin-vector-2022 .vector-user-links-main {<br />
display: flex; /* make sure it's flexbox */<br />
align-items: flex-start; /* align children to the top of the div */<br />
}<br />
/* Hide the Translate extension banner ("Translate this page; This page has changes…") */<br />
body.skin-vector-2022 .mw-pt-translate-header {<br />
display: none !important;<br />
}<br />
/* Vector 2022 – hide entire tab/navigation bar (left-navigation) for all users */<br />
.skin-vector-2022 #left-navigation {<br />
display: none !important;<br />
}<br />
/* Vector 2022: right-align items in the page toolbar (Edit / View history / Tools) */<br />
.skin-vector-2022 .vector-page-toolbar-container {<br />
display: flex !important;<br />
justify-content: flex-end !important; /* pushes items to the right */<br />
align-items: center; /* vertical alignment */<br />
}<br />
<br />
<br />
<br />
.mw-anon.skin-vector-2022 #ca-nstab-main, /* page title tab (Main Page / Article) */<br />
.mw-anon.skin-vector-2022 #ca-talk, /* Talk tab */<br />
.mw-anon.skin-vector-2022 #ca-view, /* "Read" tab */<br />
.mw-anon.skin-vector-2022 #ca-history, /* View history */<br />
.mw-anon.skin-vector-2022 #ca-watch,<br />
.mw-anon.skin-vector-2022 #ca-unwatch,<br />
.mw-anon.skin-vector-2022 #ca-more { /* "Tools" dropdown */<br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* === GLOBAL TYPOGRAPHY === */<br />
<br />
/* Base body text — Liberation Sans */<br />
html,<br />
body,<br />
.mw-body,<br />
.mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 1.2rem; /* base = 16px */<br />
line-height: 1.15; <br />
}<br />
<br />
/* Paragraphs and list text */<br />
p, li, td, th {<br />
font-size: 1.1rem; /* slightly larger than base text */<br />
}<br />
<br />
/* === HEADINGS — Linux Libertine === */<br />
h1, h2, h3, h4, h5, h6,<br />
.firstHeading,<br />
.mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
.mw-body h1, .mw-heading1, .mw-body-content h1, .mw-body-content .mw-heading1 { font-size: 3rem; line-height: 1.15; } <br />
<br />
<br />
<br />
/* === SIDEBAR MENU === */<br />
#mw-panel,<br />
.vector-menu-content,<br />
#p-navigation,<br />
#p-tb,<br />
#p-lang {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem; /* sidebar smaller for contrast */<br />
line-height: 1.4;<br />
}<br />
<br />
#mw-panel,<br />
.vector-menu-content {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 90%, rgba(192, 192, 192, 1) 100%);<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
#partner-logos {<br />
display: flex;<br />
justify-content: right;<br />
align-items: right;<br />
flex-wrap: wrap;<br />
gap: 1rem;<br />
margin-top:0.8rem;<br />
<br />
}<br />
<br />
#partner-logos img {<br />
height: 32px;<br />
object-fit: contain; /* keeps aspect ratio, fits within the box */<br />
max-width: 100%; /* prevents overflow */<br />
display: block; /* removes inline gaps below images */<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
.wikitable.custom-table {<br />
width: 100%;<br />
border-collapse: separate;<br />
border-spacing: 0;<br />
border: none;<br />
background-color: #fff;<br />
border-radius: 0.5rem;<br />
overflow: hidden; /* so rounded corners clip correctly */<br />
font-size: 0.95rem;<br />
}<br />
<br />
<br />
<br />
/* Header cells */<br />
.wikitable.custom-table th {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
color: #000;<br />
font-weight: 600;<br />
text-align: left;<br />
padding: 0.75rem 1rem;<br />
border-bottom: 2px solid #d0d9ff;<br />
}<br />
<br />
/* Data cells */<br />
.wikitable.custom-table td {<br />
padding: 0.65rem 1rem;<br />
border-bottom: 1px solid #eee;<br />
}<br />
<br />
/* Zebra striping */<br />
.wikitable.custom-table tr:nth-child(even) td {<br />
background-color: #f9fbff;<br />
}<br />
<br />
/* Hover effect */<br />
.wikitable.custom-table tr:hover td {<br />
background: #FFF;<br />
background: linear-gradient(0deg,rgba(0, 0, 255, 1) 0%, rgba(255, 255, 255, 1) 15%, rgba(255, 255, 255, 1) 85%, rgba(0, 0, 255, 1) 100%);<br />
}<br />
<br />
/* Rounded corners for first & last rows */<br />
.wikitable.custom-table tr:first-child th:first-child {<br />
border-top-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:first-child th:last-child {<br />
border-top-right-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:first-child {<br />
border-bottom-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:last-child {<br />
border-bottom-right-radius: 0.5rem;<br />
}<br />
<br />
<br />
/* === Mobile Responsive Tables (no HTML change needed) === */<br />
@media (max-width: 768px) {<br />
<br />
/* Allow horizontal scrolling on narrow screens */<br />
.wikitable.custom-table {<br />
display: block;<br />
width: 100%;<br />
overflow-x: auto;<br />
-webkit-overflow-scrolling: touch;<br />
}<br />
<br />
/* Prevent collapsing/squeezing of long cell content */<br />
.wikitable.custom-table tr,<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
white-space: nowrap;<br />
}<br />
<br />
/* Optional: slightly reduce padding for small screens */<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
padding: 0.5rem 0.75rem;<br />
}<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* Hide the automatic Tools and Special pages sections */<br />
#p-tb { <br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* MAIN-PAGE */<br />
<br />
/* === FONTS (yours) === */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
.mw-pt-languages {<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);}<br />
/* === GLOBAL TYPOGRAPHY === */<br />
html, body, .mw-body, .mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem;<br />
line-height: 1.1;<br />
}<br />
p, li, td, th { font-size: 1.1rem; line-height: 1.1; }<br />
h1, h2, h3, h4, h5, h6, .firstHeading, .mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
<br />
/* === d*sign week layout === */<br />
:root {<br />
--dw-border: #cfd8e3;<br />
--dw-card-bg: #f8fbff;<br />
}<br />
<br />
/* top ribbon */<br />
.dw-ribbon {<br />
height: 26px;<br />
background: linear-gradient(#8aa9ff, #ffffff);<br />
border-radius: 6px;<br />
margin: 0 0 14px 0;<br />
}<br />
<br />
<br />
.banner {<br />
display: flex;<br />
align-items: center;<br />
justify-content: space-between;<br />
gap: 1.5rem;<br />
padding: 0rem 1rem 0rem 1rem;<br />
text-align: left; /* centers text within its box */<br />
flex-wrap: wrap; <br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
background-size: 100% 200%;<br />
background-position: top;<br />
transition: background-position 0.4s ease-in-out;<br />
}<br />
.banner:hover {<br />
background-position: bottom;<br />
}<br />
<br />
<br />
.banner-icon img { <br />
width: 20vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 650px; /* prevent it from getting too big */ <br />
min-width: 120px; /* prevent it from getting too small */ <br />
padding-left: 2rem;}<br />
<br />
.dw-subtitle {<br />
font-size: 1.5rem;<br />
line-height: 1;<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle-banner {<br />
font-size: 3rem;<br />
}<br />
.dw-subtitle strong {<br />
<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle a {<br />
color: #0000FF !important; /* link color similar to your example */<br />
text-decoration: none;<br />
}<br />
<br />
.dw-subtitle a:hover {<br />
text-decoration: underline;<br />
}<br />
<br />
<br />
/* title & subtitle */<br />
.dw-title {<br />
text-align: center;<br />
line-height: 1.2;<br />
font-size: 2.5rem;<br />
font-weight: 700;<br />
letter-spacing: .02em;<br />
display: block;<br />
}<br />
<br />
<br />
/* grid */<br />
.dw-grid {<br />
display: flex;<br />
flex-wrap: wrap;<br />
gap: 16px;<br />
align-items: flex-start;<br />
margin-top: 14px;<br />
}<br />
.dw-col {<br />
flex: 1 1 520px;<br />
min-width: 320px;<br />
}<br />
<br />
/* cards */<br />
.dw-card {<br />
position: relative;<br />
border: 1px solid #C0C0C0;<br />
background: #FFFFFF !important;<br />
padding: 10px;<br />
margin-bottom: 10px;<br />
}<br />
.dw-card:hover {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 75%, rgba(192, 192, 192, 1) 100%)!important;<br />
}<br />
span.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
<br />
}<br />
<br />
.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 2rem !important; <br />
}<br />
<br />
<br />
.dw-card .dw-row {<br />
display: flex;<br />
flex-wrap: wrap;<br />
align-items: flex-start;<br />
gap: 12px;<br />
width: 100%;<br />
box-sizing: border-box;<br />
padding: 14px; /* ✅ move the spacing here instead of .dw-card */<br />
}<br />
<br />
.dw-card .dw-row > div:last-child {<br />
flex: 1;<br />
min-width: 0; /* ✅ prevents overflow due to long text/links */<br />
}<br />
<br />
.dw-card .dw-icon img { height: auto; }<br />
.dw-card .dw-headline {<br />
display: block;<br />
font-size: 1.5rem;<br />
font-weight: 700;<br />
margin: 0px 0 0px;<br />
}<br />
.dw-card .dw-body { line-height: 1.6; width: 100%;}<br />
.dw-card .dw-body--spacious { line-height: 1.8; }<br />
<br />
<br />
.dw-icon,<br />
.dw-subtitle {<br />
background: transparent !important; /* ✅ makes logo + text boxes transparent */<br />
}<br />
<br />
<br />
/* Code blocks explicitly monospace (so they don't inherit) */<br />
pre, code, kbd, samp, tt, .mw-code {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
text-indent: 0 !important;<br />
}<br />
<br />
/* ===== Remove first-line indentation site-wide ===== */<br />
.mw-parser-output p,<br />
.mw-parser-output li p,<br />
.mw-body-content p,<br />
.dw-card .dw-body p {<br />
text-indent: 0 !important;<br />
}<br />
<br />
<br />
pre {<br />
margin: 0 !important;<br />
padding: 0rem !important; /* add a little inner spacing so text isn’t on the edge */<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);<br />
border: none !important;<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
white-space: pre-wrap !important; /* allows wrapping */<br />
word-break: break-word !important;<br />
line-height: 1 !important;<br />
<br />
}<br />
<br />
.dw-card .pre {<br />
display: block; /* ensures it behaves as a block element */<br />
width: 100% !important;/* takes up the full width of .dw-card */<br />
box-sizing: border-box;/* includes padding/border in width calculation */<br />
margin: 0;<br />
padding: 0;<br />
}<br />
<br />
<br />
div.mw-content-ltr.mw-parser-output {<br />
background: #FFFFFF;<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 97%, rgba(192, 192, 192, 1) 100%);<br />
padding: 1rem;<br />
}<br />
<br />
<br />
<br />
.mw-page-container { <br />
background-image: url("https://dsignweek.servus.at/images/9/9d/Bg-01.png"); background-repeat: repeat-y; <br />
/* ✅ repeat vertically */ background-size: 100% auto; <br />
/* stretch to page width, keep height natural <br />
*/ background-position: center top; <br />
/* start at the top, center horizontally <br />
*/ background-attachment: scroll; <br />
/* move with page scroll */ background-color: #ffffff; /* fallback behind transparent areas */ }<br />
<br />
<br />
div#mw-head {<br />
background: transparent !important;<br />
}<br />
<br />
<br />
.dw-headline, .mw-headline {<br />
margin: 0 !important;<br />
}<br />
<br />
.skin-vector-2022 header.vector-header { box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8)!important; }<br />
<br />
.skin-vector-2022 #vector-sticky-header.vector-sticky-header {<br />
box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8) !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* ===== Mobile: stack card content vertically ===== */<br />
@media (max-width: 720px) {<br />
<br />
html, body {<br />
overflow-x: hidden !important;<br />
width: 100% !important;<br />
}<br />
.mw-page-container {<br />
max-width: 100vw !important;<br />
}<br />
<br />
.mw-parser-output {<br />
box-sizing: border-box;<br />
overflow-x: hidden !important;<br />
}<br />
<br />
.banner-icon img, img {<br />
max-width: 100% !important;<br />
width: 100% !important;<br />
object-fit: contain;<br />
}<br />
<br />
.mw-page-container { <br />
background-image: none !important;<br />
background-color: #ffffff !important;<br />
padding: 0 !important; /* ← fixed */<br />
padding-right: 10px !important; /* ← fixed */<br />
padding-left: 10px !important; /* ← fixed */<br />
margin: 0 !important;<br />
box-sizing: border-box;<br />
overflow-x: hidden !important;<br />
}<br />
.dw-col {<br />
flex: 1 1 auto !important; /* let them shrink freely */<br />
min-width: 0 !important; /* remove the minimum width restriction */<br />
}<br />
<br />
.vector-dropdown-content {<br />
width: 100vh !important;<br />
}<br />
<br />
.dw-card {<br />
padding:0;}<br />
div#content.mw-body {<br />
padding: 0rem;}<br />
div.mw-content-ltr.mw-parser-output {<br />
padding: 0.5rem;<br />
}<br />
<br />
.banner-icon img { <br />
width: 75vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 400px; /* prevent it from getting too big */ <br />
min-width: 80px; /* prevent it from getting too small */ <br />
padding-left: 0rem;}<br />
<br />
/* Stack everything in a column */<br />
.dw-card .dw-row {<br />
display: flex;<br />
flex-direction: column;<br />
align-items: stretch; /* full width for text block */<br />
gap: 10px;<br />
}<br />
<br />
/* Make the icon its own row and center it */<br />
.dw-card .dw-icon {<br />
display: flex;<br />
justify-content: center;<br />
align-items: center;<br />
margin: 0; /* remove any left/right spacing from desktop */<br />
}<br />
<br />
.dw-card .dw-icon img {<br />
width: 72px; /* tidy mobile size */<br />
height: auto;<br />
}<br />
<br />
/* Ensure the text block fills width */<br />
.dw-card .dw-row > div {<br />
width: 100%;<br />
}<br />
<br />
/* Slight spacing tweaks for headings on mobile */<br />
.dw-card .dw-headline {<br />
margin: 4px 0 4px;<br />
}<br />
/* Stack footer sections vertically */<br />
#footer {<br />
display: flex !important;<br />
flex-direction: column !important;<br />
align-items: center !important;<br />
gap: 0.2rem !important;<br />
width: 100% !important;<br />
padding: 1rem 0 !important;<br />
box-sizing: border-box;<br />
}<br />
<br />
/* Each UL gets full width + centered */<br />
#footer ul {<br />
width: 100% !important;<br />
display: flex !important;<br />
flex-direction: row !important; <br />
align-items: center !important;<br />
margin: 0 !important;<br />
padding: 0 !important;<br />
list-style: none !important;<br />
}<br />
.partner-logos {<br />
display: flex;<br />
flex-wrap: wrap; <br />
justify-content: space-between !important; <br />
align-items: center!important; <br />
gap: 1rem; <br />
padding: 0 1rem 1rem 1rem; <br />
background: transparent;<br />
}<br />
#partner-logos { <br />
justify-content: space-between !important; <br />
}<br />
.partner-logos img {<br />
height: 24px;<br />
width: auto;<br />
object-fit:contain;<br />
}<br />
<br />
}</div>
Ivans
https://dsignweek.servus.at/index.php?title=MediaWiki:Common.css&diff=1435
MediaWiki:Common.css
2025-11-20T14:32:57Z
<p>Ivans: </p>
<hr />
<div>/* CSS placed here will be applied to all skins */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
#footer-info-lastmod {<br />
display: none !important;<br />
}<br />
<br />
/* Vector 2022: align user links (language, username, etc.) to the top */<br />
body.skin-vector-2022 .vector-user-links-main {<br />
display: flex; /* make sure it's flexbox */<br />
align-items: flex-start; /* align children to the top of the div */<br />
}<br />
/* Hide the Translate extension banner ("Translate this page; This page has changes…") */<br />
body.skin-vector-2022 .mw-pt-translate-header {<br />
display: none !important;<br />
}<br />
/* Vector 2022 – hide entire tab/navigation bar (left-navigation) for all users */<br />
.skin-vector-2022 #left-navigation {<br />
display: none !important;<br />
}<br />
/* Vector 2022: right-align items in the page toolbar (Edit / View history / Tools) */<br />
.skin-vector-2022 .vector-page-toolbar-container {<br />
display: flex !important;<br />
justify-content: flex-end !important; /* pushes items to the right */<br />
align-items: center; /* vertical alignment */<br />
}<br />
<br />
<br />
<br />
.mw-anon.skin-vector-2022 #ca-nstab-main, /* page title tab (Main Page / Article) */<br />
.mw-anon.skin-vector-2022 #ca-talk, /* Talk tab */<br />
.mw-anon.skin-vector-2022 #ca-view, /* "Read" tab */<br />
.mw-anon.skin-vector-2022 #ca-history, /* View history */<br />
.mw-anon.skin-vector-2022 #ca-watch,<br />
.mw-anon.skin-vector-2022 #ca-unwatch,<br />
.mw-anon.skin-vector-2022 #ca-more { /* "Tools" dropdown */<br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* === GLOBAL TYPOGRAPHY === */<br />
<br />
/* Base body text — Liberation Sans */<br />
html,<br />
body,<br />
.mw-body,<br />
.mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 1.2rem; /* base = 16px */<br />
line-height: 1.15; <br />
}<br />
<br />
/* Paragraphs and list text */<br />
p, li, td, th {<br />
font-size: 1.1rem; /* slightly larger than base text */<br />
}<br />
<br />
/* === HEADINGS — Linux Libertine === */<br />
h1, h2, h3, h4, h5, h6,<br />
.firstHeading,<br />
.mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
.mw-body h1, .mw-heading1, .mw-body-content h1, .mw-body-content .mw-heading1 { font-size: 3rem; line-height: 1.15; } <br />
<br />
<br />
<br />
/* === SIDEBAR MENU === */<br />
#mw-panel,<br />
.vector-menu-content,<br />
#p-navigation,<br />
#p-tb,<br />
#p-lang {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem; /* sidebar smaller for contrast */<br />
line-height: 1.4;<br />
}<br />
<br />
#mw-panel,<br />
.vector-menu-content {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 90%, rgba(192, 192, 192, 1) 100%);<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
#partner-logos {<br />
display: flex;<br />
justify-content: right;<br />
align-items: right;<br />
flex-wrap: wrap;<br />
gap: 1rem;<br />
margin-top:0.8rem;<br />
<br />
}<br />
<br />
#partner-logos img {<br />
height: 32px;<br />
object-fit: contain; /* keeps aspect ratio, fits within the box */<br />
max-width: 100%; /* prevents overflow */<br />
display: block; /* removes inline gaps below images */<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
.wikitable.custom-table {<br />
width: 100%;<br />
border-collapse: separate;<br />
border-spacing: 0;<br />
border: none;<br />
background-color: #fff;<br />
border-radius: 0.5rem;<br />
overflow: hidden; /* so rounded corners clip correctly */<br />
font-size: 0.95rem;<br />
}<br />
<br />
<br />
<br />
/* Header cells */<br />
.wikitable.custom-table th {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
color: #000;<br />
font-weight: 600;<br />
text-align: left;<br />
padding: 0.75rem 1rem;<br />
border-bottom: 2px solid #d0d9ff;<br />
}<br />
<br />
/* Data cells */<br />
.wikitable.custom-table td {<br />
padding: 0.65rem 1rem;<br />
border-bottom: 1px solid #eee;<br />
}<br />
<br />
/* Zebra striping */<br />
.wikitable.custom-table tr:nth-child(even) td {<br />
background-color: #f9fbff;<br />
}<br />
<br />
/* Hover effect */<br />
.wikitable.custom-table tr:hover td {<br />
background: #FFF;<br />
background: linear-gradient(0deg,rgba(0, 0, 255, 1) 0%, rgba(255, 255, 255, 1) 15%, rgba(255, 255, 255, 1) 85%, rgba(0, 0, 255, 1) 100%);<br />
}<br />
<br />
/* Rounded corners for first & last rows */<br />
.wikitable.custom-table tr:first-child th:first-child {<br />
border-top-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:first-child th:last-child {<br />
border-top-right-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:first-child {<br />
border-bottom-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:last-child {<br />
border-bottom-right-radius: 0.5rem;<br />
}<br />
<br />
<br />
/* === Mobile Responsive Tables (no HTML change needed) === */<br />
@media (max-width: 768px) {<br />
<br />
/* Allow horizontal scrolling on narrow screens */<br />
.wikitable.custom-table {<br />
display: block;<br />
width: 100%;<br />
overflow-x: auto;<br />
-webkit-overflow-scrolling: touch;<br />
}<br />
<br />
/* Prevent collapsing/squeezing of long cell content */<br />
.wikitable.custom-table tr,<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
white-space: nowrap;<br />
}<br />
<br />
/* Optional: slightly reduce padding for small screens */<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
padding: 0.5rem 0.75rem;<br />
}<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* Hide the automatic Tools and Special pages sections */<br />
#p-tb { <br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* MAIN-PAGE */<br />
<br />
/* === FONTS (yours) === */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
.mw-pt-languages {<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);}<br />
/* === GLOBAL TYPOGRAPHY === */<br />
html, body, .mw-body, .mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem;<br />
line-height: 1.1;<br />
}<br />
p, li, td, th { font-size: 1.1rem; line-height: 1.1; }<br />
h1, h2, h3, h4, h5, h6, .firstHeading, .mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
<br />
/* === d*sign week layout === */<br />
:root {<br />
--dw-border: #cfd8e3;<br />
--dw-card-bg: #f8fbff;<br />
}<br />
<br />
/* top ribbon */<br />
.dw-ribbon {<br />
height: 26px;<br />
background: linear-gradient(#8aa9ff, #ffffff);<br />
border-radius: 6px;<br />
margin: 0 0 14px 0;<br />
}<br />
<br />
<br />
.banner {<br />
display: flex;<br />
align-items: center;<br />
justify-content: space-between;<br />
gap: 1.5rem;<br />
padding: 0rem 1rem 0rem 1rem;<br />
text-align: left; /* centers text within its box */<br />
flex-wrap: wrap; <br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
background-size: 100% 200%;<br />
background-position: top;<br />
transition: background-position 0.4s ease-in-out;<br />
}<br />
.banner:hover {<br />
background-position: bottom;<br />
}<br />
<br />
<br />
.banner-icon img { <br />
width: 20vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 650px; /* prevent it from getting too big */ <br />
min-width: 120px; /* prevent it from getting too small */ <br />
padding-left: 2rem;}<br />
<br />
.dw-subtitle {<br />
font-size: 1.5rem;<br />
line-height: 1;<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle-banner {<br />
font-size: 3rem;<br />
}<br />
.dw-subtitle strong {<br />
<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle a {<br />
color: #0000FF !important; /* link color similar to your example */<br />
text-decoration: none;<br />
}<br />
<br />
.dw-subtitle a:hover {<br />
text-decoration: underline;<br />
}<br />
<br />
<br />
/* title & subtitle */<br />
.dw-title {<br />
text-align: center;<br />
line-height: 1.2;<br />
font-size: 2.5rem;<br />
font-weight: 700;<br />
letter-spacing: .02em;<br />
display: block;<br />
}<br />
<br />
<br />
/* grid */<br />
.dw-grid {<br />
display: flex;<br />
flex-wrap: wrap;<br />
gap: 16px;<br />
align-items: flex-start;<br />
margin-top: 14px;<br />
}<br />
.dw-col {<br />
flex: 1 1 520px;<br />
min-width: 320px;<br />
}<br />
<br />
/* cards */<br />
.dw-card {<br />
position: relative;<br />
border: 1px solid #C0C0C0;<br />
background: #FFFFFF !important;<br />
padding: 10px;<br />
margin-bottom: 10px;<br />
}<br />
.dw-card:hover {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 75%, rgba(192, 192, 192, 1) 100%)!important;<br />
}<br />
span.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
<br />
}<br />
<br />
.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 2rem !important; <br />
}<br />
<br />
<br />
.dw-card .dw-row {<br />
display: flex;<br />
flex-wrap: wrap;<br />
align-items: flex-start;<br />
gap: 12px;<br />
width: 100%;<br />
box-sizing: border-box;<br />
padding: 14px; /* ✅ move the spacing here instead of .dw-card */<br />
}<br />
<br />
.dw-card .dw-row > div:last-child {<br />
flex: 1;<br />
min-width: 0; /* ✅ prevents overflow due to long text/links */<br />
}<br />
<br />
.dw-card .dw-icon img { height: auto; }<br />
.dw-card .dw-headline {<br />
display: block;<br />
font-size: 1.5rem;<br />
font-weight: 700;<br />
margin: 0px 0 0px;<br />
}<br />
.dw-card .dw-body { line-height: 1.6; width: 100%;}<br />
.dw-card .dw-body--spacious { line-height: 1.8; }<br />
<br />
<br />
.dw-icon,<br />
.dw-subtitle {<br />
background: transparent !important; /* ✅ makes logo + text boxes transparent */<br />
}<br />
<br />
<br />
/* Code blocks explicitly monospace (so they don't inherit) */<br />
pre, code, kbd, samp, tt, .mw-code {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
text-indent: 0 !important;<br />
}<br />
<br />
/* ===== Remove first-line indentation site-wide ===== */<br />
.mw-parser-output p,<br />
.mw-parser-output li p,<br />
.mw-body-content p,<br />
.dw-card .dw-body p {<br />
text-indent: 0 !important;<br />
}<br />
<br />
<br />
pre {<br />
margin: 0 !important;<br />
padding: 0rem !important; /* add a little inner spacing so text isn’t on the edge */<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);<br />
border: none !important;<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
white-space: pre-wrap !important; /* allows wrapping */<br />
word-break: break-word !important;<br />
line-height: 1 !important;<br />
<br />
}<br />
<br />
.dw-card .pre {<br />
display: block; /* ensures it behaves as a block element */<br />
width: 100% !important;/* takes up the full width of .dw-card */<br />
box-sizing: border-box;/* includes padding/border in width calculation */<br />
margin: 0;<br />
padding: 0;<br />
}<br />
<br />
<br />
div.mw-content-ltr.mw-parser-output {<br />
background: #FFFFFF;<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 97%, rgba(192, 192, 192, 1) 100%);<br />
padding: 1rem;<br />
}<br />
<br />
<br />
<br />
.mw-page-container { <br />
background-image: url("https://dsignweek.servus.at/images/9/9d/Bg-01.png"); background-repeat: repeat-y; <br />
/* ✅ repeat vertically */ background-size: 100% auto; <br />
/* stretch to page width, keep height natural <br />
*/ background-position: center top; <br />
/* start at the top, center horizontally <br />
*/ background-attachment: scroll; <br />
/* move with page scroll */ background-color: #ffffff; /* fallback behind transparent areas */ }<br />
<br />
<br />
div#mw-head {<br />
background: transparent !important;<br />
}<br />
<br />
<br />
.dw-headline, .mw-headline {<br />
margin: 0 !important;<br />
}<br />
<br />
.skin-vector-2022 header.vector-header { box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8)!important; }<br />
<br />
.skin-vector-2022 #vector-sticky-header.vector-sticky-header {<br />
box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8) !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* ===== Mobile: stack card content vertically ===== */<br />
@media (max-width: 720px) {<br />
<br />
html, body {<br />
overflow-x: hidden !important;<br />
width: 100% !important;<br />
}<br />
.mw-page-container {<br />
max-width: 100vw !important;<br />
}<br />
<br />
.mw-parser-output {<br />
box-sizing: border-box;<br />
overflow-x: hidden !important;<br />
}<br />
<br />
.banner-icon img, img {<br />
max-width: 100% !important;<br />
width: 100% !important;<br />
object-fit: contain;<br />
}<br />
<br />
.mw-page-container { <br />
background-image: none !important;<br />
background-color: #ffffff !important;<br />
padding: 0 !important; /* ← fixed */<br />
padding-right: 10px !important; /* ← fixed */<br />
padding-left: 10px !important; /* ← fixed */<br />
margin: 0 !important;<br />
box-sizing: border-box;<br />
overflow-x: hidden !important;<br />
}<br />
.dw-col {<br />
flex: 1 1 auto !important; /* let them shrink freely */<br />
min-width: 0 !important; /* remove the minimum width restriction */<br />
}<br />
<br />
<br />
.dw-card {<br />
padding:0;}<br />
div#content.mw-body {<br />
padding: 0rem;}<br />
div.mw-content-ltr.mw-parser-output {<br />
padding: 0.5rem;<br />
}<br />
<br />
.banner-icon img { <br />
width: 75vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 400px; /* prevent it from getting too big */ <br />
min-width: 80px; /* prevent it from getting too small */ <br />
padding-left: 0rem;}<br />
<br />
/* Stack everything in a column */<br />
.dw-card .dw-row {<br />
display: flex;<br />
flex-direction: column;<br />
align-items: stretch; /* full width for text block */<br />
gap: 10px;<br />
}<br />
<br />
/* Make the icon its own row and center it */<br />
.dw-card .dw-icon {<br />
display: flex;<br />
justify-content: center;<br />
align-items: center;<br />
margin: 0; /* remove any left/right spacing from desktop */<br />
}<br />
<br />
.dw-card .dw-icon img {<br />
width: 72px; /* tidy mobile size */<br />
height: auto;<br />
}<br />
<br />
/* Ensure the text block fills width */<br />
.dw-card .dw-row > div {<br />
width: 100%;<br />
}<br />
<br />
/* Slight spacing tweaks for headings on mobile */<br />
.dw-card .dw-headline {<br />
margin: 4px 0 4px;<br />
}<br />
/* Stack footer sections vertically */<br />
#footer {<br />
display: flex !important;<br />
flex-direction: column !important;<br />
align-items: center !important;<br />
gap: 0.2rem !important;<br />
width: 100% !important;<br />
padding: 1rem 0 !important;<br />
box-sizing: border-box;<br />
}<br />
<br />
/* Each UL gets full width + centered */<br />
#footer ul {<br />
width: 100% !important;<br />
display: flex !important;<br />
flex-direction: row !important; <br />
align-items: center !important;<br />
margin: 0 !important;<br />
padding: 0 !important;<br />
list-style: none !important;<br />
}<br />
.partner-logos {<br />
display: flex;<br />
flex-wrap: wrap; <br />
justify-content: space-between !important; <br />
align-items: center!important; <br />
gap: 1rem; <br />
padding: 0 1rem 1rem 1rem; <br />
background: transparent;<br />
}<br />
#partner-logos { <br />
justify-content: space-between !important; <br />
}<br />
.partner-logos img {<br />
height: 24px;<br />
width: auto;<br />
object-fit:contain;<br />
}<br />
<br />
}</div>
Ivans
https://dsignweek.servus.at/index.php?title=MediaWiki:Common.css&diff=1434
MediaWiki:Common.css
2025-11-20T14:31:11Z
<p>Ivans: </p>
<hr />
<div>/* CSS placed here will be applied to all skins */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
#footer-info-lastmod {<br />
display: none !important;<br />
}<br />
<br />
/* Vector 2022: align user links (language, username, etc.) to the top */<br />
body.skin-vector-2022 .vector-user-links-main {<br />
display: flex; /* make sure it's flexbox */<br />
align-items: flex-start; /* align children to the top of the div */<br />
}<br />
/* Hide the Translate extension banner ("Translate this page; This page has changes…") */<br />
body.skin-vector-2022 .mw-pt-translate-header {<br />
display: none !important;<br />
}<br />
/* Vector 2022 – hide entire tab/navigation bar (left-navigation) for all users */<br />
.skin-vector-2022 #left-navigation {<br />
display: none !important;<br />
}<br />
/* Vector 2022: right-align items in the page toolbar (Edit / View history / Tools) */<br />
.skin-vector-2022 .vector-page-toolbar-container {<br />
display: flex !important;<br />
justify-content: flex-end !important; /* pushes items to the right */<br />
align-items: center; /* vertical alignment */<br />
}<br />
<br />
<br />
<br />
.mw-anon.skin-vector-2022 #ca-nstab-main, /* page title tab (Main Page / Article) */<br />
.mw-anon.skin-vector-2022 #ca-talk, /* Talk tab */<br />
.mw-anon.skin-vector-2022 #ca-view, /* "Read" tab */<br />
.mw-anon.skin-vector-2022 #ca-history, /* View history */<br />
.mw-anon.skin-vector-2022 #ca-watch,<br />
.mw-anon.skin-vector-2022 #ca-unwatch,<br />
.mw-anon.skin-vector-2022 #ca-more { /* "Tools" dropdown */<br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* === GLOBAL TYPOGRAPHY === */<br />
<br />
/* Base body text — Liberation Sans */<br />
html,<br />
body,<br />
.mw-body,<br />
.mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 1.2rem; /* base = 16px */<br />
line-height: 1.15; <br />
}<br />
<br />
/* Paragraphs and list text */<br />
p, li, td, th {<br />
font-size: 1.1rem; /* slightly larger than base text */<br />
}<br />
<br />
/* === HEADINGS — Linux Libertine === */<br />
h1, h2, h3, h4, h5, h6,<br />
.firstHeading,<br />
.mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
.mw-body h1, .mw-heading1, .mw-body-content h1, .mw-body-content .mw-heading1 { font-size: 3rem; line-height: 1.15; } <br />
<br />
<br />
<br />
/* === SIDEBAR MENU === */<br />
#mw-panel,<br />
.vector-menu-content,<br />
#p-navigation,<br />
#p-tb,<br />
#p-lang {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem; /* sidebar smaller for contrast */<br />
line-height: 1.4;<br />
}<br />
<br />
#mw-panel,<br />
.vector-menu-content {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 90%, rgba(192, 192, 192, 1) 100%);<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
#partner-logos {<br />
display: flex;<br />
justify-content: right;<br />
align-items: right;<br />
flex-wrap: wrap;<br />
gap: 1rem;<br />
margin-top:0.8rem;<br />
<br />
}<br />
<br />
#partner-logos img {<br />
height: 32px;<br />
object-fit: contain; /* keeps aspect ratio, fits within the box */<br />
max-width: 100%; /* prevents overflow */<br />
display: block; /* removes inline gaps below images */<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
.wikitable.custom-table {<br />
width: 100%;<br />
border-collapse: separate;<br />
border-spacing: 0;<br />
border: none;<br />
background-color: #fff;<br />
border-radius: 0.5rem;<br />
overflow: hidden; /* so rounded corners clip correctly */<br />
font-size: 0.95rem;<br />
}<br />
<br />
<br />
<br />
/* Header cells */<br />
.wikitable.custom-table th {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
color: #000;<br />
font-weight: 600;<br />
text-align: left;<br />
padding: 0.75rem 1rem;<br />
border-bottom: 2px solid #d0d9ff;<br />
}<br />
<br />
/* Data cells */<br />
.wikitable.custom-table td {<br />
padding: 0.65rem 1rem;<br />
border-bottom: 1px solid #eee;<br />
}<br />
<br />
/* Zebra striping */<br />
.wikitable.custom-table tr:nth-child(even) td {<br />
background-color: #f9fbff;<br />
}<br />
<br />
/* Hover effect */<br />
.wikitable.custom-table tr:hover td {<br />
background: #FFF;<br />
background: linear-gradient(0deg,rgba(0, 0, 255, 1) 0%, rgba(255, 255, 255, 1) 15%, rgba(255, 255, 255, 1) 85%, rgba(0, 0, 255, 1) 100%);<br />
}<br />
<br />
/* Rounded corners for first & last rows */<br />
.wikitable.custom-table tr:first-child th:first-child {<br />
border-top-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:first-child th:last-child {<br />
border-top-right-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:first-child {<br />
border-bottom-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:last-child {<br />
border-bottom-right-radius: 0.5rem;<br />
}<br />
<br />
<br />
/* === Mobile Responsive Tables (no HTML change needed) === */<br />
@media (max-width: 768px) {<br />
<br />
/* Allow horizontal scrolling on narrow screens */<br />
.wikitable.custom-table {<br />
display: block;<br />
width: 100%;<br />
overflow-x: auto;<br />
-webkit-overflow-scrolling: touch;<br />
}<br />
<br />
/* Prevent collapsing/squeezing of long cell content */<br />
.wikitable.custom-table tr,<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
white-space: nowrap;<br />
}<br />
<br />
/* Optional: slightly reduce padding for small screens */<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
padding: 0.5rem 0.75rem;<br />
}<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* Hide the automatic Tools and Special pages sections */<br />
#p-tb { <br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* MAIN-PAGE */<br />
<br />
/* === FONTS (yours) === */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
.mw-pt-languages {<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);}<br />
/* === GLOBAL TYPOGRAPHY === */<br />
html, body, .mw-body, .mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem;<br />
line-height: 1.1;<br />
}<br />
p, li, td, th { font-size: 1.1rem; line-height: 1.1; }<br />
h1, h2, h3, h4, h5, h6, .firstHeading, .mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
<br />
/* === d*sign week layout === */<br />
:root {<br />
--dw-border: #cfd8e3;<br />
--dw-card-bg: #f8fbff;<br />
}<br />
<br />
/* top ribbon */<br />
.dw-ribbon {<br />
height: 26px;<br />
background: linear-gradient(#8aa9ff, #ffffff);<br />
border-radius: 6px;<br />
margin: 0 0 14px 0;<br />
}<br />
<br />
<br />
.banner {<br />
display: flex;<br />
align-items: center;<br />
justify-content: space-between;<br />
gap: 1.5rem;<br />
padding: 0rem 1rem 0rem 1rem;<br />
text-align: left; /* centers text within its box */<br />
flex-wrap: wrap; <br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
background-size: 100% 200%;<br />
background-position: top;<br />
transition: background-position 0.4s ease-in-out;<br />
}<br />
.banner:hover {<br />
background-position: bottom;<br />
}<br />
<br />
<br />
.banner-icon img { <br />
width: 20vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 650px; /* prevent it from getting too big */ <br />
min-width: 120px; /* prevent it from getting too small */ <br />
padding-left: 2rem;}<br />
<br />
.dw-subtitle {<br />
font-size: 1.5rem;<br />
line-height: 1;<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle-banner {<br />
font-size: 3rem;<br />
}<br />
.dw-subtitle strong {<br />
<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle a {<br />
color: #0000FF !important; /* link color similar to your example */<br />
text-decoration: none;<br />
}<br />
<br />
.dw-subtitle a:hover {<br />
text-decoration: underline;<br />
}<br />
<br />
<br />
/* title & subtitle */<br />
.dw-title {<br />
text-align: center;<br />
line-height: 1.2;<br />
font-size: 2.5rem;<br />
font-weight: 700;<br />
letter-spacing: .02em;<br />
display: block;<br />
}<br />
<br />
<br />
/* grid */<br />
.dw-grid {<br />
display: flex;<br />
flex-wrap: wrap;<br />
gap: 16px;<br />
align-items: flex-start;<br />
margin-top: 14px;<br />
}<br />
.dw-col {<br />
flex: 1 1 520px;<br />
min-width: 320px;<br />
}<br />
<br />
/* cards */<br />
.dw-card {<br />
position: relative;<br />
border: 1px solid #C0C0C0;<br />
background: #FFFFFF !important;<br />
padding: 10px;<br />
margin-bottom: 10px;<br />
}<br />
.dw-card:hover {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 75%, rgba(192, 192, 192, 1) 100%)!important;<br />
}<br />
span.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
<br />
}<br />
<br />
.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 2rem !important; <br />
}<br />
<br />
<br />
.dw-card .dw-row {<br />
display: flex;<br />
flex-wrap: wrap;<br />
align-items: flex-start;<br />
gap: 12px;<br />
width: 100%;<br />
box-sizing: border-box;<br />
padding: 14px; /* ✅ move the spacing here instead of .dw-card */<br />
}<br />
<br />
.dw-card .dw-row > div:last-child {<br />
flex: 1;<br />
min-width: 0; /* ✅ prevents overflow due to long text/links */<br />
}<br />
<br />
.dw-card .dw-icon img { height: auto; }<br />
.dw-card .dw-headline {<br />
display: block;<br />
font-size: 1.5rem;<br />
font-weight: 700;<br />
margin: 0px 0 0px;<br />
}<br />
.dw-card .dw-body { line-height: 1.6; width: 100%;}<br />
.dw-card .dw-body--spacious { line-height: 1.8; }<br />
<br />
<br />
.dw-icon,<br />
.dw-subtitle {<br />
background: transparent !important; /* ✅ makes logo + text boxes transparent */<br />
}<br />
<br />
<br />
/* Code blocks explicitly monospace (so they don't inherit) */<br />
pre, code, kbd, samp, tt, .mw-code {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
text-indent: 0 !important;<br />
}<br />
<br />
/* ===== Remove first-line indentation site-wide ===== */<br />
.mw-parser-output p,<br />
.mw-parser-output li p,<br />
.mw-body-content p,<br />
.dw-card .dw-body p {<br />
text-indent: 0 !important;<br />
}<br />
<br />
<br />
pre {<br />
margin: 0 !important;<br />
padding: 0rem !important; /* add a little inner spacing so text isn’t on the edge */<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);<br />
border: none !important;<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
white-space: pre-wrap !important; /* allows wrapping */<br />
word-break: break-word !important;<br />
line-height: 1 !important;<br />
<br />
}<br />
<br />
.dw-card .pre {<br />
display: block; /* ensures it behaves as a block element */<br />
width: 100% !important;/* takes up the full width of .dw-card */<br />
box-sizing: border-box;/* includes padding/border in width calculation */<br />
margin: 0;<br />
padding: 0;<br />
}<br />
<br />
<br />
div.mw-content-ltr.mw-parser-output {<br />
background: #FFFFFF;<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 97%, rgba(192, 192, 192, 1) 100%);<br />
padding: 1rem;<br />
}<br />
<br />
<br />
<br />
.mw-page-container { <br />
background-image: url("https://dsignweek.servus.at/images/9/9d/Bg-01.png"); background-repeat: repeat-y; <br />
/* ✅ repeat vertically */ background-size: 100% auto; <br />
/* stretch to page width, keep height natural <br />
*/ background-position: center top; <br />
/* start at the top, center horizontally <br />
*/ background-attachment: scroll; <br />
/* move with page scroll */ background-color: #ffffff; /* fallback behind transparent areas */ }<br />
<br />
<br />
div#mw-head {<br />
background: transparent !important;<br />
}<br />
<br />
<br />
.dw-headline, .mw-headline {<br />
margin: 0 !important;<br />
}<br />
<br />
.skin-vector-2022 header.vector-header { box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8)!important; }<br />
<br />
.skin-vector-2022 #vector-sticky-header.vector-sticky-header {<br />
box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8) !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* ===== Mobile: stack card content vertically ===== */<br />
@media (max-width: 720px) {<br />
<br />
html, body {<br />
overflow-x: hidden !important;<br />
width: 100% !important;<br />
}<br />
.mw-page-container {<br />
max-width: 100vw !important;<br />
}<br />
<br />
.mw-parser-output {<br />
box-sizing: border-box;<br />
overflow-x: hidden !important;<br />
}<br />
<br />
.banner-icon img, img {<br />
max-width: 100% !important;<br />
width: 100% !important;<br />
object-fit: contain;<br />
}<br />
<br />
.mw-page-container { <br />
background-image: none !important;<br />
background-color: #ffffff !important;<br />
padding: 0 !important; /* ← fixed */<br />
padding-right: 10px !important; /* ← fixed */<br />
padding-left: 10px !important; /* ← fixed */<br />
margin: 0 !important;<br />
box-sizing: border-box;<br />
overflow-x: hidden !important;<br />
}<br />
.dw-col {<br />
flex: 1 1 auto !important; /* let them shrink freely */<br />
min-width: 0 !important; /* remove the minimum width restriction */<br />
}<br />
<br />
<br />
.dw-card {<br />
padding:0;}<br />
div#content.mw-body {<br />
padding: 0rem;}<br />
div.mw-content-ltr.mw-parser-output {<br />
padding: 0.5rem;<br />
}<br />
<br />
.banner-icon img { <br />
width: 75vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 400px; /* prevent it from getting too big */ <br />
min-width: 80px; /* prevent it from getting too small */ <br />
padding-left: 0rem;}<br />
<br />
/* Stack everything in a column */<br />
.dw-card .dw-row {<br />
display: flex;<br />
flex-direction: column;<br />
align-items: stretch; /* full width for text block */<br />
gap: 10px;<br />
}<br />
<br />
/* Make the icon its own row and center it */<br />
.dw-card .dw-icon {<br />
display: flex;<br />
justify-content: center;<br />
align-items: center;<br />
margin: 0; /* remove any left/right spacing from desktop */<br />
}<br />
<br />
.dw-card .dw-icon img {<br />
width: 72px; /* tidy mobile size */<br />
height: auto;<br />
}<br />
<br />
/* Ensure the text block fills width */<br />
.dw-card .dw-row > div {<br />
width: 100%;<br />
}<br />
<br />
/* Slight spacing tweaks for headings on mobile */<br />
.dw-card .dw-headline {<br />
margin: 4px 0 4px;<br />
}<br />
/* Stack footer sections vertically */<br />
#footer {<br />
display: flex !important;<br />
flex-direction: column !important;<br />
align-items: center !important;<br />
gap: 0.2rem !important;<br />
width: 100% !important;<br />
padding: 1rem 0 !important;<br />
box-sizing: border-box;<br />
}<br />
<br />
/* Each UL gets full width + centered */<br />
#footer ul {<br />
width: 100% !important;<br />
display: flex !important;<br />
flex-direction: row !important;<br />
justify-content: space-between !important; <br />
align-items: center !important;<br />
margin: 0 !important;<br />
padding: 0 !important;<br />
list-style: none !important;<br />
}<br />
.partner-logos {<br />
display: flex;<br />
flex-wrap: wrap; <br />
justify-content: space-between !important; <br />
align-items: center!important; <br />
gap: 1rem; <br />
padding: 0 1rem 1rem 1rem; <br />
background: transparent;<br />
}<br />
#partner-logos { <br />
justify-content: space-between !important; <br />
}<br />
.partner-logos img {<br />
height: 24px;<br />
width: auto;<br />
object-fit:contain;<br />
}<br />
<br />
}</div>
Ivans
https://dsignweek.servus.at/index.php?title=MediaWiki:Common.css&diff=1433
MediaWiki:Common.css
2025-11-20T14:29:27Z
<p>Ivans: </p>
<hr />
<div>/* CSS placed here will be applied to all skins */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
#footer-info-lastmod {<br />
display: none !important;<br />
}<br />
<br />
/* Vector 2022: align user links (language, username, etc.) to the top */<br />
body.skin-vector-2022 .vector-user-links-main {<br />
display: flex; /* make sure it's flexbox */<br />
align-items: flex-start; /* align children to the top of the div */<br />
}<br />
/* Hide the Translate extension banner ("Translate this page; This page has changes…") */<br />
body.skin-vector-2022 .mw-pt-translate-header {<br />
display: none !important;<br />
}<br />
/* Vector 2022 – hide entire tab/navigation bar (left-navigation) for all users */<br />
.skin-vector-2022 #left-navigation {<br />
display: none !important;<br />
}<br />
/* Vector 2022: right-align items in the page toolbar (Edit / View history / Tools) */<br />
.skin-vector-2022 .vector-page-toolbar-container {<br />
display: flex !important;<br />
justify-content: flex-end !important; /* pushes items to the right */<br />
align-items: center; /* vertical alignment */<br />
}<br />
<br />
<br />
<br />
.mw-anon.skin-vector-2022 #ca-nstab-main, /* page title tab (Main Page / Article) */<br />
.mw-anon.skin-vector-2022 #ca-talk, /* Talk tab */<br />
.mw-anon.skin-vector-2022 #ca-view, /* "Read" tab */<br />
.mw-anon.skin-vector-2022 #ca-history, /* View history */<br />
.mw-anon.skin-vector-2022 #ca-watch,<br />
.mw-anon.skin-vector-2022 #ca-unwatch,<br />
.mw-anon.skin-vector-2022 #ca-more { /* "Tools" dropdown */<br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* === GLOBAL TYPOGRAPHY === */<br />
<br />
/* Base body text — Liberation Sans */<br />
html,<br />
body,<br />
.mw-body,<br />
.mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 1.2rem; /* base = 16px */<br />
line-height: 1.15; <br />
}<br />
<br />
/* Paragraphs and list text */<br />
p, li, td, th {<br />
font-size: 1.1rem; /* slightly larger than base text */<br />
}<br />
<br />
/* === HEADINGS — Linux Libertine === */<br />
h1, h2, h3, h4, h5, h6,<br />
.firstHeading,<br />
.mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
.mw-body h1, .mw-heading1, .mw-body-content h1, .mw-body-content .mw-heading1 { font-size: 3rem; line-height: 1.15; } <br />
<br />
<br />
<br />
/* === SIDEBAR MENU === */<br />
#mw-panel,<br />
.vector-menu-content,<br />
#p-navigation,<br />
#p-tb,<br />
#p-lang {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem; /* sidebar smaller for contrast */<br />
line-height: 1.4;<br />
}<br />
<br />
#mw-panel,<br />
.vector-menu-content {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 90%, rgba(192, 192, 192, 1) 100%);<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
#partner-logos {<br />
display: flex;<br />
justify-content: right;<br />
align-items: right;<br />
flex-wrap: wrap;<br />
gap: 1rem;<br />
margin-top:0.8rem;<br />
<br />
}<br />
<br />
#partner-logos img {<br />
height: 32px;<br />
object-fit: contain; /* keeps aspect ratio, fits within the box */<br />
max-width: 100%; /* prevents overflow */<br />
display: block; /* removes inline gaps below images */<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
.wikitable.custom-table {<br />
width: 100%;<br />
border-collapse: separate;<br />
border-spacing: 0;<br />
border: none;<br />
background-color: #fff;<br />
border-radius: 0.5rem;<br />
overflow: hidden; /* so rounded corners clip correctly */<br />
font-size: 0.95rem;<br />
}<br />
<br />
<br />
<br />
/* Header cells */<br />
.wikitable.custom-table th {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
color: #000;<br />
font-weight: 600;<br />
text-align: left;<br />
padding: 0.75rem 1rem;<br />
border-bottom: 2px solid #d0d9ff;<br />
}<br />
<br />
/* Data cells */<br />
.wikitable.custom-table td {<br />
padding: 0.65rem 1rem;<br />
border-bottom: 1px solid #eee;<br />
}<br />
<br />
/* Zebra striping */<br />
.wikitable.custom-table tr:nth-child(even) td {<br />
background-color: #f9fbff;<br />
}<br />
<br />
/* Hover effect */<br />
.wikitable.custom-table tr:hover td {<br />
background: #FFF;<br />
background: linear-gradient(0deg,rgba(0, 0, 255, 1) 0%, rgba(255, 255, 255, 1) 15%, rgba(255, 255, 255, 1) 85%, rgba(0, 0, 255, 1) 100%);<br />
}<br />
<br />
/* Rounded corners for first & last rows */<br />
.wikitable.custom-table tr:first-child th:first-child {<br />
border-top-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:first-child th:last-child {<br />
border-top-right-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:first-child {<br />
border-bottom-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:last-child {<br />
border-bottom-right-radius: 0.5rem;<br />
}<br />
<br />
<br />
/* === Mobile Responsive Tables (no HTML change needed) === */<br />
@media (max-width: 768px) {<br />
<br />
/* Allow horizontal scrolling on narrow screens */<br />
.wikitable.custom-table {<br />
display: block;<br />
width: 100%;<br />
overflow-x: auto;<br />
-webkit-overflow-scrolling: touch;<br />
}<br />
<br />
/* Prevent collapsing/squeezing of long cell content */<br />
.wikitable.custom-table tr,<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
white-space: nowrap;<br />
}<br />
<br />
/* Optional: slightly reduce padding for small screens */<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
padding: 0.5rem 0.75rem;<br />
}<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* Hide the automatic Tools and Special pages sections */<br />
#p-tb { <br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* MAIN-PAGE */<br />
<br />
/* === FONTS (yours) === */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
.mw-pt-languages {<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);}<br />
/* === GLOBAL TYPOGRAPHY === */<br />
html, body, .mw-body, .mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem;<br />
line-height: 1.1;<br />
}<br />
p, li, td, th { font-size: 1.1rem; line-height: 1.1; }<br />
h1, h2, h3, h4, h5, h6, .firstHeading, .mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
<br />
/* === d*sign week layout === */<br />
:root {<br />
--dw-border: #cfd8e3;<br />
--dw-card-bg: #f8fbff;<br />
}<br />
<br />
/* top ribbon */<br />
.dw-ribbon {<br />
height: 26px;<br />
background: linear-gradient(#8aa9ff, #ffffff);<br />
border-radius: 6px;<br />
margin: 0 0 14px 0;<br />
}<br />
<br />
<br />
.banner {<br />
display: flex;<br />
align-items: center;<br />
justify-content: space-between;<br />
gap: 1.5rem;<br />
padding: 0rem 1rem 0rem 1rem;<br />
text-align: left; /* centers text within its box */<br />
flex-wrap: wrap; <br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
background-size: 100% 200%;<br />
background-position: top;<br />
transition: background-position 0.4s ease-in-out;<br />
}<br />
.banner:hover {<br />
background-position: bottom;<br />
}<br />
<br />
<br />
.banner-icon img { <br />
width: 20vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 650px; /* prevent it from getting too big */ <br />
min-width: 120px; /* prevent it from getting too small */ <br />
padding-left: 2rem;}<br />
<br />
.dw-subtitle {<br />
font-size: 1.5rem;<br />
line-height: 1;<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle-banner {<br />
font-size: 3rem;<br />
}<br />
.dw-subtitle strong {<br />
<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle a {<br />
color: #0000FF !important; /* link color similar to your example */<br />
text-decoration: none;<br />
}<br />
<br />
.dw-subtitle a:hover {<br />
text-decoration: underline;<br />
}<br />
<br />
<br />
/* title & subtitle */<br />
.dw-title {<br />
text-align: center;<br />
line-height: 1.2;<br />
font-size: 2.5rem;<br />
font-weight: 700;<br />
letter-spacing: .02em;<br />
display: block;<br />
}<br />
<br />
<br />
/* grid */<br />
.dw-grid {<br />
display: flex;<br />
flex-wrap: wrap;<br />
gap: 16px;<br />
align-items: flex-start;<br />
margin-top: 14px;<br />
}<br />
.dw-col {<br />
flex: 1 1 520px;<br />
min-width: 320px;<br />
}<br />
<br />
/* cards */<br />
.dw-card {<br />
position: relative;<br />
border: 1px solid #C0C0C0;<br />
background: #FFFFFF !important;<br />
padding: 10px;<br />
margin-bottom: 10px;<br />
}<br />
.dw-card:hover {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 75%, rgba(192, 192, 192, 1) 100%)!important;<br />
}<br />
span.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
<br />
}<br />
<br />
.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 2rem !important; <br />
}<br />
<br />
<br />
.dw-card .dw-row {<br />
display: flex;<br />
flex-wrap: wrap;<br />
align-items: flex-start;<br />
gap: 12px;<br />
width: 100%;<br />
box-sizing: border-box;<br />
padding: 14px; /* ✅ move the spacing here instead of .dw-card */<br />
}<br />
<br />
.dw-card .dw-row > div:last-child {<br />
flex: 1;<br />
min-width: 0; /* ✅ prevents overflow due to long text/links */<br />
}<br />
<br />
.dw-card .dw-icon img { height: auto; }<br />
.dw-card .dw-headline {<br />
display: block;<br />
font-size: 1.5rem;<br />
font-weight: 700;<br />
margin: 0px 0 0px;<br />
}<br />
.dw-card .dw-body { line-height: 1.6; width: 100%;}<br />
.dw-card .dw-body--spacious { line-height: 1.8; }<br />
<br />
<br />
.dw-icon,<br />
.dw-subtitle {<br />
background: transparent !important; /* ✅ makes logo + text boxes transparent */<br />
}<br />
<br />
<br />
/* Code blocks explicitly monospace (so they don't inherit) */<br />
pre, code, kbd, samp, tt, .mw-code {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
text-indent: 0 !important;<br />
}<br />
<br />
/* ===== Remove first-line indentation site-wide ===== */<br />
.mw-parser-output p,<br />
.mw-parser-output li p,<br />
.mw-body-content p,<br />
.dw-card .dw-body p {<br />
text-indent: 0 !important;<br />
}<br />
<br />
<br />
pre {<br />
margin: 0 !important;<br />
padding: 0rem !important; /* add a little inner spacing so text isn’t on the edge */<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);<br />
border: none !important;<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
white-space: pre-wrap !important; /* allows wrapping */<br />
word-break: break-word !important;<br />
line-height: 1 !important;<br />
<br />
}<br />
<br />
.dw-card .pre {<br />
display: block; /* ensures it behaves as a block element */<br />
width: 100% !important;/* takes up the full width of .dw-card */<br />
box-sizing: border-box;/* includes padding/border in width calculation */<br />
margin: 0;<br />
padding: 0;<br />
}<br />
<br />
<br />
div.mw-content-ltr.mw-parser-output {<br />
background: #FFFFFF;<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 97%, rgba(192, 192, 192, 1) 100%);<br />
padding: 1rem;<br />
}<br />
<br />
<br />
<br />
.mw-page-container { <br />
background-image: url("https://dsignweek.servus.at/images/9/9d/Bg-01.png"); background-repeat: repeat-y; <br />
/* ✅ repeat vertically */ background-size: 100% auto; <br />
/* stretch to page width, keep height natural <br />
*/ background-position: center top; <br />
/* start at the top, center horizontally <br />
*/ background-attachment: scroll; <br />
/* move with page scroll */ background-color: #ffffff; /* fallback behind transparent areas */ }<br />
<br />
<br />
div#mw-head {<br />
background: transparent !important;<br />
}<br />
<br />
<br />
.dw-headline, .mw-headline {<br />
margin: 0 !important;<br />
}<br />
<br />
.skin-vector-2022 header.vector-header { box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8)!important; }<br />
<br />
.skin-vector-2022 #vector-sticky-header.vector-sticky-header {<br />
box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8) !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* ===== Mobile: stack card content vertically ===== */<br />
@media (max-width: 720px) {<br />
<br />
html, body {<br />
overflow-x: hidden !important;<br />
width: 100% !important;<br />
}<br />
.mw-page-container {<br />
max-width: 100vw !important;<br />
}<br />
<br />
.mw-parser-output {<br />
box-sizing: border-box;<br />
overflow-x: hidden !important;<br />
}<br />
<br />
.banner-icon img, img {<br />
max-width: 100% !important;<br />
width: 100% !important;<br />
object-fit: contain;<br />
}<br />
<br />
.mw-page-container { <br />
background-image: none !important;<br />
background-color: #ffffff !important;<br />
padding: 0 !important; /* ← fixed */<br />
padding-right: 10px !important; /* ← fixed */<br />
padding-left: 10px !important; /* ← fixed */<br />
margin: 0 !important;<br />
box-sizing: border-box;<br />
overflow-x: hidden !important;<br />
}<br />
.dw-col {<br />
flex: 1 1 auto !important; /* let them shrink freely */<br />
min-width: 0 !important; /* remove the minimum width restriction */<br />
}<br />
<br />
<br />
.dw-card {<br />
padding:0;}<br />
div#content.mw-body {<br />
padding: 0rem;}<br />
div.mw-content-ltr.mw-parser-output {<br />
padding: 0.5rem;<br />
}<br />
<br />
.banner-icon img { <br />
width: 75vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 400px; /* prevent it from getting too big */ <br />
min-width: 80px; /* prevent it from getting too small */ <br />
padding-left: 0rem;}<br />
<br />
/* Stack everything in a column */<br />
.dw-card .dw-row {<br />
display: flex;<br />
flex-direction: column;<br />
align-items: stretch; /* full width for text block */<br />
gap: 10px;<br />
}<br />
<br />
/* Make the icon its own row and center it */<br />
.dw-card .dw-icon {<br />
display: flex;<br />
justify-content: center;<br />
align-items: center;<br />
margin: 0; /* remove any left/right spacing from desktop */<br />
}<br />
<br />
.dw-card .dw-icon img {<br />
width: 72px; /* tidy mobile size */<br />
height: auto;<br />
}<br />
<br />
/* Ensure the text block fills width */<br />
.dw-card .dw-row > div {<br />
width: 100%;<br />
}<br />
<br />
/* Slight spacing tweaks for headings on mobile */<br />
.dw-card .dw-headline {<br />
margin: 4px 0 4px;<br />
}<br />
/* Stack footer sections vertically */<br />
#footer {<br />
display: flex !important;<br />
flex-direction: column !important;<br />
align-items: center !important;<br />
gap: 0.2rem !important;<br />
width: 100% !important;<br />
padding: 1rem 0 !important;<br />
box-sizing: border-box;<br />
}<br />
<br />
/* Each UL gets full width + centered */<br />
#footer ul {<br />
width: 100% !important;<br />
display: flex !important;<br />
flex-direction: column !important;<br />
align-items: center !important;<br />
margin: 0 !important;<br />
padding: 0 !important;<br />
list-style: none !important;<br />
}<br />
.partner-logos {<br />
display: flex;<br />
flex-wrap: wrap; <br />
justify-content: space-between !important; <br />
align-items: center!important; <br />
gap: 1rem; <br />
padding: 0 1rem 1rem 1rem; <br />
background: transparent;<br />
}<br />
#partner-logos { <br />
justify-content: space-between !important; <br />
}<br />
.partner-logos img {<br />
height: 24px;<br />
width: auto;<br />
object-fit:contain;<br />
}<br />
<br />
}</div>
Ivans
https://dsignweek.servus.at/index.php?title=MediaWiki:Common.css&diff=1432
MediaWiki:Common.css
2025-11-20T14:24:17Z
<p>Ivans: </p>
<hr />
<div>/* CSS placed here will be applied to all skins */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
#footer-info-lastmod {<br />
display: none !important;<br />
}<br />
<br />
/* Vector 2022: align user links (language, username, etc.) to the top */<br />
body.skin-vector-2022 .vector-user-links-main {<br />
display: flex; /* make sure it's flexbox */<br />
align-items: flex-start; /* align children to the top of the div */<br />
}<br />
/* Hide the Translate extension banner ("Translate this page; This page has changes…") */<br />
body.skin-vector-2022 .mw-pt-translate-header {<br />
display: none !important;<br />
}<br />
/* Vector 2022 – hide entire tab/navigation bar (left-navigation) for all users */<br />
.skin-vector-2022 #left-navigation {<br />
display: none !important;<br />
}<br />
/* Vector 2022: right-align items in the page toolbar (Edit / View history / Tools) */<br />
.skin-vector-2022 .vector-page-toolbar-container {<br />
display: flex !important;<br />
justify-content: flex-end !important; /* pushes items to the right */<br />
align-items: center; /* vertical alignment */<br />
}<br />
<br />
<br />
<br />
.mw-anon.skin-vector-2022 #ca-nstab-main, /* page title tab (Main Page / Article) */<br />
.mw-anon.skin-vector-2022 #ca-talk, /* Talk tab */<br />
.mw-anon.skin-vector-2022 #ca-view, /* "Read" tab */<br />
.mw-anon.skin-vector-2022 #ca-history, /* View history */<br />
.mw-anon.skin-vector-2022 #ca-watch,<br />
.mw-anon.skin-vector-2022 #ca-unwatch,<br />
.mw-anon.skin-vector-2022 #ca-more { /* "Tools" dropdown */<br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* === GLOBAL TYPOGRAPHY === */<br />
<br />
/* Base body text — Liberation Sans */<br />
html,<br />
body,<br />
.mw-body,<br />
.mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 1.2rem; /* base = 16px */<br />
line-height: 1.15; <br />
}<br />
<br />
/* Paragraphs and list text */<br />
p, li, td, th {<br />
font-size: 1.1rem; /* slightly larger than base text */<br />
}<br />
<br />
/* === HEADINGS — Linux Libertine === */<br />
h1, h2, h3, h4, h5, h6,<br />
.firstHeading,<br />
.mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
.mw-body h1, .mw-heading1, .mw-body-content h1, .mw-body-content .mw-heading1 { font-size: 3rem; line-height: 1.15; } <br />
<br />
<br />
<br />
/* === SIDEBAR MENU === */<br />
#mw-panel,<br />
.vector-menu-content,<br />
#p-navigation,<br />
#p-tb,<br />
#p-lang {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem; /* sidebar smaller for contrast */<br />
line-height: 1.4;<br />
}<br />
<br />
#mw-panel,<br />
.vector-menu-content {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 90%, rgba(192, 192, 192, 1) 100%);<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
#partner-logos {<br />
display: flex;<br />
justify-content: right;<br />
align-items: right;<br />
flex-wrap: wrap;<br />
gap: 1rem;<br />
margin-top:0.8rem;<br />
<br />
}<br />
<br />
#partner-logos img {<br />
height: 32px;<br />
object-fit: contain; /* keeps aspect ratio, fits within the box */<br />
max-width: 100%; /* prevents overflow */<br />
display: block; /* removes inline gaps below images */<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
.wikitable.custom-table {<br />
width: 100%;<br />
border-collapse: separate;<br />
border-spacing: 0;<br />
border: none;<br />
background-color: #fff;<br />
border-radius: 0.5rem;<br />
overflow: hidden; /* so rounded corners clip correctly */<br />
font-size: 0.95rem;<br />
}<br />
<br />
<br />
<br />
/* Header cells */<br />
.wikitable.custom-table th {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
color: #000;<br />
font-weight: 600;<br />
text-align: left;<br />
padding: 0.75rem 1rem;<br />
border-bottom: 2px solid #d0d9ff;<br />
}<br />
<br />
/* Data cells */<br />
.wikitable.custom-table td {<br />
padding: 0.65rem 1rem;<br />
border-bottom: 1px solid #eee;<br />
}<br />
<br />
/* Zebra striping */<br />
.wikitable.custom-table tr:nth-child(even) td {<br />
background-color: #f9fbff;<br />
}<br />
<br />
/* Hover effect */<br />
.wikitable.custom-table tr:hover td {<br />
background: #FFF;<br />
background: linear-gradient(0deg,rgba(0, 0, 255, 1) 0%, rgba(255, 255, 255, 1) 15%, rgba(255, 255, 255, 1) 85%, rgba(0, 0, 255, 1) 100%);<br />
}<br />
<br />
/* Rounded corners for first & last rows */<br />
.wikitable.custom-table tr:first-child th:first-child {<br />
border-top-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:first-child th:last-child {<br />
border-top-right-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:first-child {<br />
border-bottom-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:last-child {<br />
border-bottom-right-radius: 0.5rem;<br />
}<br />
<br />
<br />
/* === Mobile Responsive Tables (no HTML change needed) === */<br />
@media (max-width: 768px) {<br />
<br />
/* Allow horizontal scrolling on narrow screens */<br />
.wikitable.custom-table {<br />
display: block;<br />
width: 100%;<br />
overflow-x: auto;<br />
-webkit-overflow-scrolling: touch;<br />
}<br />
<br />
/* Prevent collapsing/squeezing of long cell content */<br />
.wikitable.custom-table tr,<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
white-space: nowrap;<br />
}<br />
<br />
/* Optional: slightly reduce padding for small screens */<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
padding: 0.5rem 0.75rem;<br />
}<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* Hide the automatic Tools and Special pages sections */<br />
#p-tb { <br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* MAIN-PAGE */<br />
<br />
/* === FONTS (yours) === */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
.mw-pt-languages {<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);}<br />
/* === GLOBAL TYPOGRAPHY === */<br />
html, body, .mw-body, .mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem;<br />
line-height: 1.1;<br />
}<br />
p, li, td, th { font-size: 1.1rem; line-height: 1.1; }<br />
h1, h2, h3, h4, h5, h6, .firstHeading, .mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
<br />
/* === d*sign week layout === */<br />
:root {<br />
--dw-border: #cfd8e3;<br />
--dw-card-bg: #f8fbff;<br />
}<br />
<br />
/* top ribbon */<br />
.dw-ribbon {<br />
height: 26px;<br />
background: linear-gradient(#8aa9ff, #ffffff);<br />
border-radius: 6px;<br />
margin: 0 0 14px 0;<br />
}<br />
<br />
<br />
.banner {<br />
display: flex;<br />
align-items: center;<br />
justify-content: space-between;<br />
gap: 1.5rem;<br />
padding: 0rem 1rem 0rem 1rem;<br />
text-align: left; /* centers text within its box */<br />
flex-wrap: wrap; <br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
background-size: 100% 200%;<br />
background-position: top;<br />
transition: background-position 0.4s ease-in-out;<br />
}<br />
.banner:hover {<br />
background-position: bottom;<br />
}<br />
<br />
<br />
.banner-icon img { <br />
width: 20vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 650px; /* prevent it from getting too big */ <br />
min-width: 120px; /* prevent it from getting too small */ <br />
padding-left: 2rem;}<br />
<br />
.dw-subtitle {<br />
font-size: 1.5rem;<br />
line-height: 1;<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle-banner {<br />
font-size: 3rem;<br />
}<br />
.dw-subtitle strong {<br />
<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle a {<br />
color: #0000FF !important; /* link color similar to your example */<br />
text-decoration: none;<br />
}<br />
<br />
.dw-subtitle a:hover {<br />
text-decoration: underline;<br />
}<br />
<br />
<br />
/* title & subtitle */<br />
.dw-title {<br />
text-align: center;<br />
line-height: 1.2;<br />
font-size: 2.5rem;<br />
font-weight: 700;<br />
letter-spacing: .02em;<br />
display: block;<br />
}<br />
<br />
<br />
/* grid */<br />
.dw-grid {<br />
display: flex;<br />
flex-wrap: wrap;<br />
gap: 16px;<br />
align-items: flex-start;<br />
margin-top: 14px;<br />
}<br />
.dw-col {<br />
flex: 1 1 520px;<br />
min-width: 320px;<br />
}<br />
<br />
/* cards */<br />
.dw-card {<br />
position: relative;<br />
border: 1px solid #C0C0C0;<br />
background: #FFFFFF !important;<br />
padding: 10px;<br />
margin-bottom: 10px;<br />
}<br />
.dw-card:hover {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 75%, rgba(192, 192, 192, 1) 100%)!important;<br />
}<br />
span.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
<br />
}<br />
<br />
.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 2rem !important; <br />
}<br />
<br />
<br />
.dw-card .dw-row {<br />
display: flex;<br />
flex-wrap: wrap;<br />
align-items: flex-start;<br />
gap: 12px;<br />
width: 100%;<br />
box-sizing: border-box;<br />
padding: 14px; /* ✅ move the spacing here instead of .dw-card */<br />
}<br />
<br />
.dw-card .dw-row > div:last-child {<br />
flex: 1;<br />
min-width: 0; /* ✅ prevents overflow due to long text/links */<br />
}<br />
<br />
.dw-card .dw-icon img { height: auto; }<br />
.dw-card .dw-headline {<br />
display: block;<br />
font-size: 1.5rem;<br />
font-weight: 700;<br />
margin: 0px 0 0px;<br />
}<br />
.dw-card .dw-body { line-height: 1.6; width: 100%;}<br />
.dw-card .dw-body--spacious { line-height: 1.8; }<br />
<br />
<br />
.dw-icon,<br />
.dw-subtitle {<br />
background: transparent !important; /* ✅ makes logo + text boxes transparent */<br />
}<br />
<br />
<br />
/* Code blocks explicitly monospace (so they don't inherit) */<br />
pre, code, kbd, samp, tt, .mw-code {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
text-indent: 0 !important;<br />
}<br />
<br />
/* ===== Remove first-line indentation site-wide ===== */<br />
.mw-parser-output p,<br />
.mw-parser-output li p,<br />
.mw-body-content p,<br />
.dw-card .dw-body p {<br />
text-indent: 0 !important;<br />
}<br />
<br />
<br />
pre {<br />
margin: 0 !important;<br />
padding: 0rem !important; /* add a little inner spacing so text isn’t on the edge */<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);<br />
border: none !important;<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
white-space: pre-wrap !important; /* allows wrapping */<br />
word-break: break-word !important;<br />
line-height: 1 !important;<br />
<br />
}<br />
<br />
.dw-card .pre {<br />
display: block; /* ensures it behaves as a block element */<br />
width: 100% !important;/* takes up the full width of .dw-card */<br />
box-sizing: border-box;/* includes padding/border in width calculation */<br />
margin: 0;<br />
padding: 0;<br />
}<br />
<br />
<br />
div.mw-content-ltr.mw-parser-output {<br />
background: #FFFFFF;<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 97%, rgba(192, 192, 192, 1) 100%);<br />
padding: 1rem;<br />
}<br />
<br />
<br />
<br />
.mw-page-container { <br />
background-image: url("https://dsignweek.servus.at/images/9/9d/Bg-01.png"); background-repeat: repeat-y; <br />
/* ✅ repeat vertically */ background-size: 100% auto; <br />
/* stretch to page width, keep height natural <br />
*/ background-position: center top; <br />
/* start at the top, center horizontally <br />
*/ background-attachment: scroll; <br />
/* move with page scroll */ background-color: #ffffff; /* fallback behind transparent areas */ }<br />
<br />
<br />
div#mw-head {<br />
background: transparent !important;<br />
}<br />
<br />
<br />
.dw-headline, .mw-headline {<br />
margin: 0 !important;<br />
}<br />
<br />
.skin-vector-2022 header.vector-header { box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8)!important; }<br />
<br />
.skin-vector-2022 #vector-sticky-header.vector-sticky-header {<br />
box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8) !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* ===== Mobile: stack card content vertically ===== */<br />
@media (max-width: 720px) {<br />
<br />
html, body {<br />
overflow-x: hidden !important;<br />
width: 100% !important;<br />
}<br />
.mw-page-container {<br />
max-width: 100vw !important;<br />
}<br />
<br />
.mw-parser-output {<br />
box-sizing: border-box;<br />
overflow-x: hidden !important;<br />
}<br />
<br />
.banner-icon img, img {<br />
max-width: 100% !important;<br />
width: 100% !important;<br />
object-fit: contain;<br />
}<br />
<br />
.mw-page-container { <br />
background-image: none !important;<br />
background-color: #ffffff !important;<br />
padding: 0 !important; /* ← fixed */<br />
padding-right: 10px !important; /* ← fixed */<br />
padding-left: 10px !important; /* ← fixed */<br />
margin: 0 !important;<br />
box-sizing: border-box;<br />
overflow-x: hidden !important;<br />
}<br />
.dw-col {<br />
flex: 1 1 auto !important; /* let them shrink freely */<br />
min-width: 0 !important; /* remove the minimum width restriction */<br />
}<br />
<br />
.skin-vector-2022 header.vector-header {<br />
padding-right: 10px !important; /* ← fixed */<br />
padding-left: 10px !important; /* ← fixed */<br />
}<br />
.dw-card {<br />
padding:0;}<br />
div#content.mw-body {<br />
padding: 0rem;}<br />
div.mw-content-ltr.mw-parser-output {<br />
padding: 0.5rem;<br />
}<br />
<br />
.banner-icon img { <br />
width: 80vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 650px; /* prevent it from getting too big */ <br />
min-width: 120px; /* prevent it from getting too small */ <br />
padding-left: 0rem;}<br />
<br />
/* Stack everything in a column */<br />
.dw-card .dw-row {<br />
display: flex;<br />
flex-direction: column;<br />
align-items: stretch; /* full width for text block */<br />
gap: 10px;<br />
}<br />
<br />
/* Make the icon its own row and center it */<br />
.dw-card .dw-icon {<br />
display: flex;<br />
justify-content: center;<br />
align-items: center;<br />
margin: 0; /* remove any left/right spacing from desktop */<br />
}<br />
<br />
.dw-card .dw-icon img {<br />
width: 72px; /* tidy mobile size */<br />
height: auto;<br />
}<br />
<br />
/* Ensure the text block fills width */<br />
.dw-card .dw-row > div {<br />
width: 100%;<br />
}<br />
<br />
/* Slight spacing tweaks for headings on mobile */<br />
.dw-card .dw-headline {<br />
margin: 4px 0 4px;<br />
}<br />
/* Stack footer sections vertically */<br />
#footer {<br />
display: flex !important;<br />
flex-direction: column !important;<br />
align-items: center !important;<br />
gap: 1rem !important;<br />
width: 100% !important;<br />
padding: 1rem 0 !important;<br />
box-sizing: border-box;<br />
}<br />
<br />
/* Each UL gets full width + centered */<br />
#footer ul {<br />
width: 100% !important;<br />
display: flex !important;<br />
flex-direction: column !important;<br />
align-items: center !important;<br />
margin: 0 !important;<br />
padding: 0 !important;<br />
list-style: none !important;<br />
}<br />
.partner-logos {<br />
display: flex;<br />
flex-wrap: wrap; /* allows wrapping on small screens */<br />
justify-content: space-between !important; <br />
align-items: center!important; <br />
gap: 1.4rem; <br />
padding: 0 1rem 1rem 1rem; /* breathing room top & bottom */<br />
background: transparent;<br />
}<br />
<br />
.partner-logos img {<br />
height: 24px;<br />
width: auto;<br />
object-fit:contain;<br />
}<br />
<br />
}</div>
Ivans
https://dsignweek.servus.at/index.php?title=MediaWiki:Common.css&diff=1431
MediaWiki:Common.css
2025-11-20T14:20:46Z
<p>Ivans: </p>
<hr />
<div>/* CSS placed here will be applied to all skins */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
#footer-info-lastmod {<br />
display: none !important;<br />
}<br />
<br />
/* Vector 2022: align user links (language, username, etc.) to the top */<br />
body.skin-vector-2022 .vector-user-links-main {<br />
display: flex; /* make sure it's flexbox */<br />
align-items: flex-start; /* align children to the top of the div */<br />
}<br />
/* Hide the Translate extension banner ("Translate this page; This page has changes…") */<br />
body.skin-vector-2022 .mw-pt-translate-header {<br />
display: none !important;<br />
}<br />
/* Vector 2022 – hide entire tab/navigation bar (left-navigation) for all users */<br />
.skin-vector-2022 #left-navigation {<br />
display: none !important;<br />
}<br />
/* Vector 2022: right-align items in the page toolbar (Edit / View history / Tools) */<br />
.skin-vector-2022 .vector-page-toolbar-container {<br />
display: flex !important;<br />
justify-content: flex-end !important; /* pushes items to the right */<br />
align-items: center; /* vertical alignment */<br />
}<br />
<br />
<br />
<br />
.mw-anon.skin-vector-2022 #ca-nstab-main, /* page title tab (Main Page / Article) */<br />
.mw-anon.skin-vector-2022 #ca-talk, /* Talk tab */<br />
.mw-anon.skin-vector-2022 #ca-view, /* "Read" tab */<br />
.mw-anon.skin-vector-2022 #ca-history, /* View history */<br />
.mw-anon.skin-vector-2022 #ca-watch,<br />
.mw-anon.skin-vector-2022 #ca-unwatch,<br />
.mw-anon.skin-vector-2022 #ca-more { /* "Tools" dropdown */<br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* === GLOBAL TYPOGRAPHY === */<br />
<br />
/* Base body text — Liberation Sans */<br />
html,<br />
body,<br />
.mw-body,<br />
.mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 1.2rem; /* base = 16px */<br />
line-height: 1.15; <br />
}<br />
<br />
/* Paragraphs and list text */<br />
p, li, td, th {<br />
font-size: 1.1rem; /* slightly larger than base text */<br />
}<br />
<br />
/* === HEADINGS — Linux Libertine === */<br />
h1, h2, h3, h4, h5, h6,<br />
.firstHeading,<br />
.mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
.mw-body h1, .mw-heading1, .mw-body-content h1, .mw-body-content .mw-heading1 { font-size: 3rem; line-height: 1.15; } <br />
<br />
<br />
<br />
/* === SIDEBAR MENU === */<br />
#mw-panel,<br />
.vector-menu-content,<br />
#p-navigation,<br />
#p-tb,<br />
#p-lang {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem; /* sidebar smaller for contrast */<br />
line-height: 1.4;<br />
}<br />
<br />
#mw-panel,<br />
.vector-menu-content {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 90%, rgba(192, 192, 192, 1) 100%);<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
#partner-logos {<br />
display: flex;<br />
justify-content: right;<br />
align-items: right;<br />
flex-wrap: wrap;<br />
gap: 1rem;<br />
margin-top:0.8rem;<br />
<br />
}<br />
<br />
#partner-logos img {<br />
height: 32px;<br />
object-fit: contain; /* keeps aspect ratio, fits within the box */<br />
max-width: 100%; /* prevents overflow */<br />
display: block; /* removes inline gaps below images */<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
.wikitable.custom-table {<br />
width: 100%;<br />
border-collapse: separate;<br />
border-spacing: 0;<br />
border: none;<br />
background-color: #fff;<br />
border-radius: 0.5rem;<br />
overflow: hidden; /* so rounded corners clip correctly */<br />
font-size: 0.95rem;<br />
}<br />
<br />
<br />
<br />
/* Header cells */<br />
.wikitable.custom-table th {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
color: #000;<br />
font-weight: 600;<br />
text-align: left;<br />
padding: 0.75rem 1rem;<br />
border-bottom: 2px solid #d0d9ff;<br />
}<br />
<br />
/* Data cells */<br />
.wikitable.custom-table td {<br />
padding: 0.65rem 1rem;<br />
border-bottom: 1px solid #eee;<br />
}<br />
<br />
/* Zebra striping */<br />
.wikitable.custom-table tr:nth-child(even) td {<br />
background-color: #f9fbff;<br />
}<br />
<br />
/* Hover effect */<br />
.wikitable.custom-table tr:hover td {<br />
background: #FFF;<br />
background: linear-gradient(0deg,rgba(0, 0, 255, 1) 0%, rgba(255, 255, 255, 1) 15%, rgba(255, 255, 255, 1) 85%, rgba(0, 0, 255, 1) 100%);<br />
}<br />
<br />
/* Rounded corners for first & last rows */<br />
.wikitable.custom-table tr:first-child th:first-child {<br />
border-top-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:first-child th:last-child {<br />
border-top-right-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:first-child {<br />
border-bottom-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:last-child {<br />
border-bottom-right-radius: 0.5rem;<br />
}<br />
<br />
<br />
/* === Mobile Responsive Tables (no HTML change needed) === */<br />
@media (max-width: 768px) {<br />
<br />
/* Allow horizontal scrolling on narrow screens */<br />
.wikitable.custom-table {<br />
display: block;<br />
width: 100%;<br />
overflow-x: auto;<br />
-webkit-overflow-scrolling: touch;<br />
}<br />
<br />
/* Prevent collapsing/squeezing of long cell content */<br />
.wikitable.custom-table tr,<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
white-space: nowrap;<br />
}<br />
<br />
/* Optional: slightly reduce padding for small screens */<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
padding: 0.5rem 0.75rem;<br />
}<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* Hide the automatic Tools and Special pages sections */<br />
#p-tb { <br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* MAIN-PAGE */<br />
<br />
/* === FONTS (yours) === */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
.mw-pt-languages {<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);}<br />
/* === GLOBAL TYPOGRAPHY === */<br />
html, body, .mw-body, .mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem;<br />
line-height: 1.1;<br />
}<br />
p, li, td, th { font-size: 1.1rem; line-height: 1.1; }<br />
h1, h2, h3, h4, h5, h6, .firstHeading, .mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
<br />
/* === d*sign week layout === */<br />
:root {<br />
--dw-border: #cfd8e3;<br />
--dw-card-bg: #f8fbff;<br />
}<br />
<br />
/* top ribbon */<br />
.dw-ribbon {<br />
height: 26px;<br />
background: linear-gradient(#8aa9ff, #ffffff);<br />
border-radius: 6px;<br />
margin: 0 0 14px 0;<br />
}<br />
<br />
<br />
.banner {<br />
display: flex;<br />
align-items: center;<br />
justify-content: space-between;<br />
gap: 1.5rem;<br />
padding: 0rem 1rem 0rem 1rem;<br />
text-align: left; /* centers text within its box */<br />
flex-wrap: wrap; <br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
background-size: 100% 200%;<br />
background-position: top;<br />
transition: background-position 0.4s ease-in-out;<br />
}<br />
.banner:hover {<br />
background-position: bottom;<br />
}<br />
<br />
<br />
.banner-icon img { <br />
width: 20vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 650px; /* prevent it from getting too big */ <br />
min-width: 120px; /* prevent it from getting too small */ <br />
padding-left: 2rem;}<br />
<br />
.dw-subtitle {<br />
font-size: 1.5rem;<br />
line-height: 1;<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle-banner {<br />
font-size: 3rem;<br />
}<br />
.dw-subtitle strong {<br />
<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle a {<br />
color: #0000FF !important; /* link color similar to your example */<br />
text-decoration: none;<br />
}<br />
<br />
.dw-subtitle a:hover {<br />
text-decoration: underline;<br />
}<br />
<br />
<br />
/* title & subtitle */<br />
.dw-title {<br />
text-align: center;<br />
line-height: 1.2;<br />
font-size: 2.5rem;<br />
font-weight: 700;<br />
letter-spacing: .02em;<br />
display: block;<br />
}<br />
<br />
<br />
/* grid */<br />
.dw-grid {<br />
display: flex;<br />
flex-wrap: wrap;<br />
gap: 16px;<br />
align-items: flex-start;<br />
margin-top: 14px;<br />
}<br />
.dw-col {<br />
flex: 1 1 520px;<br />
min-width: 320px;<br />
}<br />
<br />
/* cards */<br />
.dw-card {<br />
position: relative;<br />
border: 1px solid #C0C0C0;<br />
background: #FFFFFF !important;<br />
padding: 10px;<br />
margin-bottom: 10px;<br />
}<br />
.dw-card:hover {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 75%, rgba(192, 192, 192, 1) 100%)!important;<br />
}<br />
span.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
<br />
}<br />
<br />
.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 2rem !important; <br />
}<br />
<br />
<br />
.dw-card .dw-row {<br />
display: flex;<br />
flex-wrap: wrap;<br />
align-items: flex-start;<br />
gap: 12px;<br />
width: 100%;<br />
box-sizing: border-box;<br />
padding: 14px; /* ✅ move the spacing here instead of .dw-card */<br />
}<br />
<br />
.dw-card .dw-row > div:last-child {<br />
flex: 1;<br />
min-width: 0; /* ✅ prevents overflow due to long text/links */<br />
}<br />
<br />
.dw-card .dw-icon img { height: auto; }<br />
.dw-card .dw-headline {<br />
display: block;<br />
font-size: 1.5rem;<br />
font-weight: 700;<br />
margin: 0px 0 0px;<br />
}<br />
.dw-card .dw-body { line-height: 1.6; width: 100%;}<br />
.dw-card .dw-body--spacious { line-height: 1.8; }<br />
<br />
<br />
.dw-icon,<br />
.dw-subtitle {<br />
background: transparent !important; /* ✅ makes logo + text boxes transparent */<br />
}<br />
<br />
<br />
/* Code blocks explicitly monospace (so they don't inherit) */<br />
pre, code, kbd, samp, tt, .mw-code {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
text-indent: 0 !important;<br />
}<br />
<br />
/* ===== Remove first-line indentation site-wide ===== */<br />
.mw-parser-output p,<br />
.mw-parser-output li p,<br />
.mw-body-content p,<br />
.dw-card .dw-body p {<br />
text-indent: 0 !important;<br />
}<br />
<br />
<br />
pre {<br />
margin: 0 !important;<br />
padding: 0rem !important; /* add a little inner spacing so text isn’t on the edge */<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);<br />
border: none !important;<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
white-space: pre-wrap !important; /* allows wrapping */<br />
word-break: break-word !important;<br />
line-height: 1 !important;<br />
<br />
}<br />
<br />
.dw-card .pre {<br />
display: block; /* ensures it behaves as a block element */<br />
width: 100% !important;/* takes up the full width of .dw-card */<br />
box-sizing: border-box;/* includes padding/border in width calculation */<br />
margin: 0;<br />
padding: 0;<br />
}<br />
<br />
<br />
div.mw-content-ltr.mw-parser-output {<br />
background: #FFFFFF;<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 97%, rgba(192, 192, 192, 1) 100%);<br />
padding: 1rem;<br />
}<br />
<br />
<br />
<br />
.mw-page-container { <br />
background-image: url("https://dsignweek.servus.at/images/9/9d/Bg-01.png"); background-repeat: repeat-y; <br />
/* ✅ repeat vertically */ background-size: 100% auto; <br />
/* stretch to page width, keep height natural <br />
*/ background-position: center top; <br />
/* start at the top, center horizontally <br />
*/ background-attachment: scroll; <br />
/* move with page scroll */ background-color: #ffffff; /* fallback behind transparent areas */ }<br />
<br />
<br />
div#mw-head {<br />
background: transparent !important;<br />
}<br />
<br />
<br />
.dw-headline, .mw-headline {<br />
margin: 0 !important;<br />
}<br />
<br />
.skin-vector-2022 header.vector-header { box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8)!important; }<br />
<br />
.skin-vector-2022 #vector-sticky-header.vector-sticky-header {<br />
box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8) !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* ===== Mobile: stack card content vertically ===== */<br />
@media (max-width: 720px) {<br />
<br />
html, body {<br />
overflow-x: hidden !important;<br />
width: 100% !important;<br />
}<br />
.mw-page-container {<br />
max-width: 100vw !important;<br />
}<br />
<br />
.mw-parser-output {<br />
box-sizing: border-box;<br />
overflow-x: hidden !important;<br />
}<br />
<br />
.banner-icon img, img {<br />
max-width: 100% !important;<br />
width: 100% !important;<br />
object-fit: contain;<br />
}<br />
<br />
.mw-page-container { <br />
background-image: none !important;<br />
background-color: #ffffff !important;<br />
padding: 0 !important; /* ← fixed */<br />
padding-right: 10px !important; /* ← fixed */<br />
padding-left: 10px !important; /* ← fixed */<br />
margin: 0 !important;<br />
box-sizing: border-box;<br />
overflow-x: hidden !important;<br />
}<br />
.dw-col {<br />
flex: 1 1 auto !important; /* let them shrink freely */<br />
min-width: 0 !important; /* remove the minimum width restriction */<br />
}<br />
<br />
<br />
.dw-card {<br />
padding:0;}<br />
div#content.mw-body {<br />
padding: 0rem;}<br />
div.mw-content-ltr.mw-parser-output {<br />
padding: 0.5rem;<br />
}<br />
<br />
.banner-icon img { <br />
width: 80vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 650px; /* prevent it from getting too big */ <br />
min-width: 120px; /* prevent it from getting too small */ <br />
padding-left: 0rem;}<br />
<br />
/* Stack everything in a column */<br />
.dw-card .dw-row {<br />
display: flex;<br />
flex-direction: column;<br />
align-items: stretch; /* full width for text block */<br />
gap: 10px;<br />
}<br />
<br />
/* Make the icon its own row and center it */<br />
.dw-card .dw-icon {<br />
display: flex;<br />
justify-content: center;<br />
align-items: center;<br />
margin: 0; /* remove any left/right spacing from desktop */<br />
}<br />
<br />
.dw-card .dw-icon img {<br />
width: 72px; /* tidy mobile size */<br />
height: auto;<br />
}<br />
<br />
/* Ensure the text block fills width */<br />
.dw-card .dw-row > div {<br />
width: 100%;<br />
}<br />
<br />
/* Slight spacing tweaks for headings on mobile */<br />
.dw-card .dw-headline {<br />
margin: 4px 0 4px;<br />
}<br />
<br />
.partner-logos {<br />
display: flex;<br />
flex-wrap: wrap; /* allows wrapping on small screens */<br />
justify-content: space-between !important; <br />
align-items: center!important; <br />
gap: 1.4rem; <br />
padding: 0 1rem 1rem 1rem; /* breathing room top & bottom */<br />
background: transparent;<br />
}<br />
<br />
.partner-logos img {<br />
height: 24px;<br />
width: auto;<br />
object-fit:contain;<br />
}<br />
<br />
}</div>
Ivans
https://dsignweek.servus.at/index.php?title=MediaWiki:Common.css&diff=1430
MediaWiki:Common.css
2025-11-20T14:19:17Z
<p>Ivans: </p>
<hr />
<div>/* CSS placed here will be applied to all skins */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
#footer-info-lastmod {<br />
display: none !important;<br />
}<br />
<br />
/* Vector 2022: align user links (language, username, etc.) to the top */<br />
body.skin-vector-2022 .vector-user-links-main {<br />
display: flex; /* make sure it's flexbox */<br />
align-items: flex-start; /* align children to the top of the div */<br />
}<br />
/* Hide the Translate extension banner ("Translate this page; This page has changes…") */<br />
body.skin-vector-2022 .mw-pt-translate-header {<br />
display: none !important;<br />
}<br />
/* Vector 2022 – hide entire tab/navigation bar (left-navigation) for all users */<br />
.skin-vector-2022 #left-navigation {<br />
display: none !important;<br />
}<br />
/* Vector 2022: right-align items in the page toolbar (Edit / View history / Tools) */<br />
.skin-vector-2022 .vector-page-toolbar-container {<br />
display: flex !important;<br />
justify-content: flex-end !important; /* pushes items to the right */<br />
align-items: center; /* vertical alignment */<br />
}<br />
<br />
<br />
<br />
.mw-anon.skin-vector-2022 #ca-nstab-main, /* page title tab (Main Page / Article) */<br />
.mw-anon.skin-vector-2022 #ca-talk, /* Talk tab */<br />
.mw-anon.skin-vector-2022 #ca-view, /* "Read" tab */<br />
.mw-anon.skin-vector-2022 #ca-history, /* View history */<br />
.mw-anon.skin-vector-2022 #ca-watch,<br />
.mw-anon.skin-vector-2022 #ca-unwatch,<br />
.mw-anon.skin-vector-2022 #ca-more { /* "Tools" dropdown */<br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* === GLOBAL TYPOGRAPHY === */<br />
<br />
/* Base body text — Liberation Sans */<br />
html,<br />
body,<br />
.mw-body,<br />
.mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 1.2rem; /* base = 16px */<br />
line-height: 1.15; <br />
}<br />
<br />
/* Paragraphs and list text */<br />
p, li, td, th {<br />
font-size: 1.1rem; /* slightly larger than base text */<br />
}<br />
<br />
/* === HEADINGS — Linux Libertine === */<br />
h1, h2, h3, h4, h5, h6,<br />
.firstHeading,<br />
.mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
.mw-body h1, .mw-heading1, .mw-body-content h1, .mw-body-content .mw-heading1 { font-size: 3rem; line-height: 1.15; } <br />
<br />
<br />
<br />
/* === SIDEBAR MENU === */<br />
#mw-panel,<br />
.vector-menu-content,<br />
#p-navigation,<br />
#p-tb,<br />
#p-lang {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem; /* sidebar smaller for contrast */<br />
line-height: 1.4;<br />
}<br />
<br />
#mw-panel,<br />
.vector-menu-content {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 90%, rgba(192, 192, 192, 1) 100%);<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
#partner-logos {<br />
display: flex;<br />
justify-content: right;<br />
align-items: right;<br />
flex-wrap: wrap;<br />
gap: 1rem;<br />
margin-top:0.8rem;<br />
<br />
}<br />
<br />
#partner-logos img {<br />
height: 32px;<br />
object-fit: contain; /* keeps aspect ratio, fits within the box */<br />
max-width: 100%; /* prevents overflow */<br />
display: block; /* removes inline gaps below images */<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
.wikitable.custom-table {<br />
width: 100%;<br />
border-collapse: separate;<br />
border-spacing: 0;<br />
border: none;<br />
background-color: #fff;<br />
border-radius: 0.5rem;<br />
overflow: hidden; /* so rounded corners clip correctly */<br />
font-size: 0.95rem;<br />
}<br />
<br />
<br />
<br />
/* Header cells */<br />
.wikitable.custom-table th {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
color: #000;<br />
font-weight: 600;<br />
text-align: left;<br />
padding: 0.75rem 1rem;<br />
border-bottom: 2px solid #d0d9ff;<br />
}<br />
<br />
/* Data cells */<br />
.wikitable.custom-table td {<br />
padding: 0.65rem 1rem;<br />
border-bottom: 1px solid #eee;<br />
}<br />
<br />
/* Zebra striping */<br />
.wikitable.custom-table tr:nth-child(even) td {<br />
background-color: #f9fbff;<br />
}<br />
<br />
/* Hover effect */<br />
.wikitable.custom-table tr:hover td {<br />
background: #FFF;<br />
background: linear-gradient(0deg,rgba(0, 0, 255, 1) 0%, rgba(255, 255, 255, 1) 15%, rgba(255, 255, 255, 1) 85%, rgba(0, 0, 255, 1) 100%);<br />
}<br />
<br />
/* Rounded corners for first & last rows */<br />
.wikitable.custom-table tr:first-child th:first-child {<br />
border-top-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:first-child th:last-child {<br />
border-top-right-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:first-child {<br />
border-bottom-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:last-child {<br />
border-bottom-right-radius: 0.5rem;<br />
}<br />
<br />
<br />
/* === Mobile Responsive Tables (no HTML change needed) === */<br />
@media (max-width: 768px) {<br />
<br />
/* Allow horizontal scrolling on narrow screens */<br />
.wikitable.custom-table {<br />
display: block;<br />
width: 100%;<br />
overflow-x: auto;<br />
-webkit-overflow-scrolling: touch;<br />
}<br />
<br />
/* Prevent collapsing/squeezing of long cell content */<br />
.wikitable.custom-table tr,<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
white-space: nowrap;<br />
}<br />
<br />
/* Optional: slightly reduce padding for small screens */<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
padding: 0.5rem 0.75rem;<br />
}<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* Hide the automatic Tools and Special pages sections */<br />
#p-tb { <br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* MAIN-PAGE */<br />
<br />
/* === FONTS (yours) === */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
.mw-pt-languages {<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);}<br />
/* === GLOBAL TYPOGRAPHY === */<br />
html, body, .mw-body, .mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem;<br />
line-height: 1.1;<br />
}<br />
p, li, td, th { font-size: 1.1rem; line-height: 1.1; }<br />
h1, h2, h3, h4, h5, h6, .firstHeading, .mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
<br />
/* === d*sign week layout === */<br />
:root {<br />
--dw-border: #cfd8e3;<br />
--dw-card-bg: #f8fbff;<br />
}<br />
<br />
/* top ribbon */<br />
.dw-ribbon {<br />
height: 26px;<br />
background: linear-gradient(#8aa9ff, #ffffff);<br />
border-radius: 6px;<br />
margin: 0 0 14px 0;<br />
}<br />
<br />
<br />
.banner {<br />
display: flex;<br />
align-items: center;<br />
justify-content: space-between;<br />
gap: 1.5rem;<br />
padding: 0rem 1rem 0rem 1rem;<br />
text-align: left; /* centers text within its box */<br />
flex-wrap: wrap; <br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
background-size: 100% 200%;<br />
background-position: top;<br />
transition: background-position 0.4s ease-in-out;<br />
}<br />
.banner:hover {<br />
background-position: bottom;<br />
}<br />
<br />
<br />
.banner-icon img { <br />
width: 20vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 650px; /* prevent it from getting too big */ <br />
min-width: 120px; /* prevent it from getting too small */ <br />
padding-left: 2rem;}<br />
<br />
.dw-subtitle {<br />
font-size: 1.5rem;<br />
line-height: 1;<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle-banner {<br />
font-size: 3rem;<br />
}<br />
.dw-subtitle strong {<br />
<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle a {<br />
color: #0000FF !important; /* link color similar to your example */<br />
text-decoration: none;<br />
}<br />
<br />
.dw-subtitle a:hover {<br />
text-decoration: underline;<br />
}<br />
<br />
<br />
/* title & subtitle */<br />
.dw-title {<br />
text-align: center;<br />
line-height: 1.2;<br />
font-size: 2.5rem;<br />
font-weight: 700;<br />
letter-spacing: .02em;<br />
display: block;<br />
}<br />
<br />
<br />
/* grid */<br />
.dw-grid {<br />
display: flex;<br />
flex-wrap: wrap;<br />
gap: 16px;<br />
align-items: flex-start;<br />
margin-top: 14px;<br />
}<br />
.dw-col {<br />
flex: 1 1 520px;<br />
min-width: 320px;<br />
}<br />
<br />
/* cards */<br />
.dw-card {<br />
position: relative;<br />
border: 1px solid #C0C0C0;<br />
background: #FFFFFF !important;<br />
padding: 10px;<br />
margin-bottom: 10px;<br />
}<br />
.dw-card:hover {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 75%, rgba(192, 192, 192, 1) 100%)!important;<br />
}<br />
span.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
<br />
}<br />
<br />
.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 2rem !important; <br />
}<br />
<br />
<br />
.dw-card .dw-row {<br />
display: flex;<br />
flex-wrap: wrap;<br />
align-items: flex-start;<br />
gap: 12px;<br />
width: 100%;<br />
box-sizing: border-box;<br />
padding: 14px; /* ✅ move the spacing here instead of .dw-card */<br />
}<br />
<br />
.dw-card .dw-row > div:last-child {<br />
flex: 1;<br />
min-width: 0; /* ✅ prevents overflow due to long text/links */<br />
}<br />
<br />
.dw-card .dw-icon img { height: auto; }<br />
.dw-card .dw-headline {<br />
display: block;<br />
font-size: 1.5rem;<br />
font-weight: 700;<br />
margin: 0px 0 0px;<br />
}<br />
.dw-card .dw-body { line-height: 1.6; width: 100%;}<br />
.dw-card .dw-body--spacious { line-height: 1.8; }<br />
<br />
<br />
.dw-icon,<br />
.dw-subtitle {<br />
background: transparent !important; /* ✅ makes logo + text boxes transparent */<br />
}<br />
<br />
<br />
/* Code blocks explicitly monospace (so they don't inherit) */<br />
pre, code, kbd, samp, tt, .mw-code {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
text-indent: 0 !important;<br />
}<br />
<br />
/* ===== Remove first-line indentation site-wide ===== */<br />
.mw-parser-output p,<br />
.mw-parser-output li p,<br />
.mw-body-content p,<br />
.dw-card .dw-body p {<br />
text-indent: 0 !important;<br />
}<br />
<br />
<br />
pre {<br />
margin: 0 !important;<br />
padding: 0rem !important; /* add a little inner spacing so text isn’t on the edge */<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);<br />
border: none !important;<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
white-space: pre-wrap !important; /* allows wrapping */<br />
word-break: break-word !important;<br />
line-height: 1 !important;<br />
<br />
}<br />
<br />
.dw-card .pre {<br />
display: block; /* ensures it behaves as a block element */<br />
width: 100% !important;/* takes up the full width of .dw-card */<br />
box-sizing: border-box;/* includes padding/border in width calculation */<br />
margin: 0;<br />
padding: 0;<br />
}<br />
<br />
<br />
div.mw-content-ltr.mw-parser-output {<br />
background: #FFFFFF;<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 97%, rgba(192, 192, 192, 1) 100%);<br />
padding: 1rem;<br />
}<br />
<br />
<br />
<br />
.mw-page-container { <br />
background-image: url("https://dsignweek.servus.at/images/9/9d/Bg-01.png"); background-repeat: repeat-y; <br />
/* ✅ repeat vertically */ background-size: 100% auto; <br />
/* stretch to page width, keep height natural <br />
*/ background-position: center top; <br />
/* start at the top, center horizontally <br />
*/ background-attachment: scroll; <br />
/* move with page scroll */ background-color: #ffffff; /* fallback behind transparent areas */ }<br />
<br />
<br />
div#mw-head {<br />
background: transparent !important;<br />
}<br />
<br />
<br />
.dw-headline, .mw-headline {<br />
margin: 0 !important;<br />
}<br />
<br />
.skin-vector-2022 header.vector-header { box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8)!important; }<br />
<br />
.skin-vector-2022 #vector-sticky-header.vector-sticky-header {<br />
box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8) !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* ===== Mobile: stack card content vertically ===== */<br />
@media (max-width: 720px) {<br />
<br />
html, body {<br />
overflow-x: hidden !important;<br />
width: 100% !important;<br />
}<br />
.mw-page-container {<br />
max-width: 100vw !important;<br />
}<br />
<br />
.mw-parser-output {<br />
box-sizing: border-box;<br />
overflow-x: hidden !important;<br />
}<br />
<br />
.banner-icon img, img {<br />
max-width: 100% !important;<br />
width: 100% !important;<br />
object-fit: contain;<br />
}<br />
<br />
.mw-page-container { <br />
background-image: none !important;<br />
background-color: #ffffff !important;<br />
padding: 0 !important; /* ← fixed */<br />
margin: 0 !important;<br />
box-sizing: border-box;<br />
overflow-x: hidden !important;<br />
}<br />
.dw-col {<br />
flex: 1 1 auto !important; /* let them shrink freely */<br />
min-width: 0 !important; /* remove the minimum width restriction */<br />
}<br />
<br />
<br />
.dw-card {<br />
padding:0;}<br />
div#content.mw-body {<br />
padding: 0rem;}<br />
div.mw-content-ltr.mw-parser-output {<br />
padding: 0.5rem;<br />
}<br />
<br />
.banner-icon img { <br />
width: 80vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 650px; /* prevent it from getting too big */ <br />
min-width: 120px; /* prevent it from getting too small */ <br />
padding-left: 0rem;}<br />
<br />
/* Stack everything in a column */<br />
.dw-card .dw-row {<br />
display: flex;<br />
flex-direction: column;<br />
align-items: stretch; /* full width for text block */<br />
gap: 10px;<br />
}<br />
<br />
/* Make the icon its own row and center it */<br />
.dw-card .dw-icon {<br />
display: flex;<br />
justify-content: center;<br />
align-items: center;<br />
margin: 0; /* remove any left/right spacing from desktop */<br />
}<br />
<br />
.dw-card .dw-icon img {<br />
width: 72px; /* tidy mobile size */<br />
height: auto;<br />
}<br />
<br />
/* Ensure the text block fills width */<br />
.dw-card .dw-row > div {<br />
width: 100%;<br />
}<br />
<br />
/* Slight spacing tweaks for headings on mobile */<br />
.dw-card .dw-headline {<br />
margin: 4px 0 4px;<br />
}<br />
<br />
.partner-logos {<br />
display: flex;<br />
flex-wrap: wrap; /* allows wrapping on small screens */<br />
justify-content: space-between !important; <br />
align-items: center!important; <br />
gap: 1.4rem; <br />
padding: 0 1rem 1rem 1rem; /* breathing room top & bottom */<br />
background: transparent;<br />
}<br />
<br />
.partner-logos img {<br />
height: 24px;<br />
width: auto;<br />
object-fit:contain;<br />
}<br />
<br />
}</div>
Ivans
https://dsignweek.servus.at/index.php?title=MediaWiki:Common.css&diff=1429
MediaWiki:Common.css
2025-11-20T14:16:55Z
<p>Ivans: </p>
<hr />
<div>/* CSS placed here will be applied to all skins */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
#footer-info-lastmod {<br />
display: none !important;<br />
}<br />
<br />
/* Vector 2022: align user links (language, username, etc.) to the top */<br />
body.skin-vector-2022 .vector-user-links-main {<br />
display: flex; /* make sure it's flexbox */<br />
align-items: flex-start; /* align children to the top of the div */<br />
}<br />
/* Hide the Translate extension banner ("Translate this page; This page has changes…") */<br />
body.skin-vector-2022 .mw-pt-translate-header {<br />
display: none !important;<br />
}<br />
/* Vector 2022 – hide entire tab/navigation bar (left-navigation) for all users */<br />
.skin-vector-2022 #left-navigation {<br />
display: none !important;<br />
}<br />
/* Vector 2022: right-align items in the page toolbar (Edit / View history / Tools) */<br />
.skin-vector-2022 .vector-page-toolbar-container {<br />
display: flex !important;<br />
justify-content: flex-end !important; /* pushes items to the right */<br />
align-items: center; /* vertical alignment */<br />
}<br />
<br />
<br />
<br />
.mw-anon.skin-vector-2022 #ca-nstab-main, /* page title tab (Main Page / Article) */<br />
.mw-anon.skin-vector-2022 #ca-talk, /* Talk tab */<br />
.mw-anon.skin-vector-2022 #ca-view, /* "Read" tab */<br />
.mw-anon.skin-vector-2022 #ca-history, /* View history */<br />
.mw-anon.skin-vector-2022 #ca-watch,<br />
.mw-anon.skin-vector-2022 #ca-unwatch,<br />
.mw-anon.skin-vector-2022 #ca-more { /* "Tools" dropdown */<br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* === GLOBAL TYPOGRAPHY === */<br />
<br />
/* Base body text — Liberation Sans */<br />
html,<br />
body,<br />
.mw-body,<br />
.mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 1.2rem; /* base = 16px */<br />
line-height: 1.15; <br />
}<br />
<br />
/* Paragraphs and list text */<br />
p, li, td, th {<br />
font-size: 1.1rem; /* slightly larger than base text */<br />
}<br />
<br />
/* === HEADINGS — Linux Libertine === */<br />
h1, h2, h3, h4, h5, h6,<br />
.firstHeading,<br />
.mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
.mw-body h1, .mw-heading1, .mw-body-content h1, .mw-body-content .mw-heading1 { font-size: 3rem; line-height: 1.15; } <br />
<br />
<br />
<br />
/* === SIDEBAR MENU === */<br />
#mw-panel,<br />
.vector-menu-content,<br />
#p-navigation,<br />
#p-tb,<br />
#p-lang {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem; /* sidebar smaller for contrast */<br />
line-height: 1.4;<br />
}<br />
<br />
#mw-panel,<br />
.vector-menu-content {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 90%, rgba(192, 192, 192, 1) 100%);<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
#partner-logos {<br />
display: flex;<br />
justify-content: right;<br />
align-items: right;<br />
flex-wrap: wrap;<br />
gap: 1rem;<br />
margin-top:0.8rem;<br />
<br />
}<br />
<br />
#partner-logos img {<br />
height: 32px;<br />
object-fit: contain; /* keeps aspect ratio, fits within the box */<br />
max-width: 100%; /* prevents overflow */<br />
display: block; /* removes inline gaps below images */<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
.wikitable.custom-table {<br />
width: 100%;<br />
border-collapse: separate;<br />
border-spacing: 0;<br />
border: none;<br />
background-color: #fff;<br />
border-radius: 0.5rem;<br />
overflow: hidden; /* so rounded corners clip correctly */<br />
font-size: 0.95rem;<br />
}<br />
<br />
<br />
<br />
/* Header cells */<br />
.wikitable.custom-table th {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
color: #000;<br />
font-weight: 600;<br />
text-align: left;<br />
padding: 0.75rem 1rem;<br />
border-bottom: 2px solid #d0d9ff;<br />
}<br />
<br />
/* Data cells */<br />
.wikitable.custom-table td {<br />
padding: 0.65rem 1rem;<br />
border-bottom: 1px solid #eee;<br />
}<br />
<br />
/* Zebra striping */<br />
.wikitable.custom-table tr:nth-child(even) td {<br />
background-color: #f9fbff;<br />
}<br />
<br />
/* Hover effect */<br />
.wikitable.custom-table tr:hover td {<br />
background: #FFF;<br />
background: linear-gradient(0deg,rgba(0, 0, 255, 1) 0%, rgba(255, 255, 255, 1) 15%, rgba(255, 255, 255, 1) 85%, rgba(0, 0, 255, 1) 100%);<br />
}<br />
<br />
/* Rounded corners for first & last rows */<br />
.wikitable.custom-table tr:first-child th:first-child {<br />
border-top-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:first-child th:last-child {<br />
border-top-right-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:first-child {<br />
border-bottom-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:last-child {<br />
border-bottom-right-radius: 0.5rem;<br />
}<br />
<br />
<br />
/* === Mobile Responsive Tables (no HTML change needed) === */<br />
@media (max-width: 768px) {<br />
<br />
/* Allow horizontal scrolling on narrow screens */<br />
.wikitable.custom-table {<br />
display: block;<br />
width: 100%;<br />
overflow-x: auto;<br />
-webkit-overflow-scrolling: touch;<br />
}<br />
<br />
/* Prevent collapsing/squeezing of long cell content */<br />
.wikitable.custom-table tr,<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
white-space: nowrap;<br />
}<br />
<br />
/* Optional: slightly reduce padding for small screens */<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
padding: 0.5rem 0.75rem;<br />
}<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* Hide the automatic Tools and Special pages sections */<br />
#p-tb { <br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* MAIN-PAGE */<br />
<br />
/* === FONTS (yours) === */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
.mw-pt-languages {<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);}<br />
/* === GLOBAL TYPOGRAPHY === */<br />
html, body, .mw-body, .mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem;<br />
line-height: 1.1;<br />
}<br />
p, li, td, th { font-size: 1.1rem; line-height: 1.1; }<br />
h1, h2, h3, h4, h5, h6, .firstHeading, .mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
<br />
/* === d*sign week layout === */<br />
:root {<br />
--dw-border: #cfd8e3;<br />
--dw-card-bg: #f8fbff;<br />
}<br />
<br />
/* top ribbon */<br />
.dw-ribbon {<br />
height: 26px;<br />
background: linear-gradient(#8aa9ff, #ffffff);<br />
border-radius: 6px;<br />
margin: 0 0 14px 0;<br />
}<br />
<br />
<br />
.banner {<br />
display: flex;<br />
align-items: center;<br />
justify-content: space-between;<br />
gap: 1.5rem;<br />
padding: 0rem 1rem 0rem 1rem;<br />
text-align: left; /* centers text within its box */<br />
flex-wrap: wrap; <br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
background-size: 100% 200%;<br />
background-position: top;<br />
transition: background-position 0.4s ease-in-out;<br />
}<br />
.banner:hover {<br />
background-position: bottom;<br />
}<br />
<br />
<br />
.banner-icon img { <br />
width: 20vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 650px; /* prevent it from getting too big */ <br />
min-width: 120px; /* prevent it from getting too small */ <br />
padding-left: 2rem;}<br />
<br />
.dw-subtitle {<br />
font-size: 1.5rem;<br />
line-height: 1;<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle-banner {<br />
font-size: 3rem;<br />
}<br />
.dw-subtitle strong {<br />
<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle a {<br />
color: #0000FF !important; /* link color similar to your example */<br />
text-decoration: none;<br />
}<br />
<br />
.dw-subtitle a:hover {<br />
text-decoration: underline;<br />
}<br />
<br />
<br />
/* title & subtitle */<br />
.dw-title {<br />
text-align: center;<br />
line-height: 1.2;<br />
font-size: 2.5rem;<br />
font-weight: 700;<br />
letter-spacing: .02em;<br />
display: block;<br />
}<br />
<br />
<br />
/* grid */<br />
.dw-grid {<br />
display: flex;<br />
flex-wrap: wrap;<br />
gap: 16px;<br />
align-items: flex-start;<br />
margin-top: 14px;<br />
}<br />
.dw-col {<br />
flex: 1 1 520px;<br />
min-width: 320px;<br />
}<br />
<br />
/* cards */<br />
.dw-card {<br />
position: relative;<br />
border: 1px solid #C0C0C0;<br />
background: #FFFFFF !important;<br />
padding: 10px;<br />
margin-bottom: 10px;<br />
}<br />
.dw-card:hover {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 75%, rgba(192, 192, 192, 1) 100%)!important;<br />
}<br />
span.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
<br />
}<br />
<br />
.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 2rem !important; <br />
}<br />
<br />
<br />
.dw-card .dw-row {<br />
display: flex;<br />
flex-wrap: wrap;<br />
align-items: flex-start;<br />
gap: 12px;<br />
width: 100%;<br />
box-sizing: border-box;<br />
padding: 14px; /* ✅ move the spacing here instead of .dw-card */<br />
}<br />
<br />
.dw-card .dw-row > div:last-child {<br />
flex: 1;<br />
min-width: 0; /* ✅ prevents overflow due to long text/links */<br />
}<br />
<br />
.dw-card .dw-icon img { height: auto; }<br />
.dw-card .dw-headline {<br />
display: block;<br />
font-size: 1.5rem;<br />
font-weight: 700;<br />
margin: 0px 0 0px;<br />
}<br />
.dw-card .dw-body { line-height: 1.6; width: 100%;}<br />
.dw-card .dw-body--spacious { line-height: 1.8; }<br />
<br />
<br />
.dw-icon,<br />
.dw-subtitle {<br />
background: transparent !important; /* ✅ makes logo + text boxes transparent */<br />
}<br />
<br />
<br />
/* Code blocks explicitly monospace (so they don't inherit) */<br />
pre, code, kbd, samp, tt, .mw-code {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
text-indent: 0 !important;<br />
}<br />
<br />
/* ===== Remove first-line indentation site-wide ===== */<br />
.mw-parser-output p,<br />
.mw-parser-output li p,<br />
.mw-body-content p,<br />
.dw-card .dw-body p {<br />
text-indent: 0 !important;<br />
}<br />
<br />
<br />
pre {<br />
margin: 0 !important;<br />
padding: 0rem !important; /* add a little inner spacing so text isn’t on the edge */<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);<br />
border: none !important;<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
white-space: pre-wrap !important; /* allows wrapping */<br />
word-break: break-word !important;<br />
line-height: 1 !important;<br />
<br />
}<br />
<br />
.dw-card .pre {<br />
display: block; /* ensures it behaves as a block element */<br />
width: 100% !important;/* takes up the full width of .dw-card */<br />
box-sizing: border-box;/* includes padding/border in width calculation */<br />
margin: 0;<br />
padding: 0;<br />
}<br />
<br />
<br />
div.mw-content-ltr.mw-parser-output {<br />
background: #FFFFFF;<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 97%, rgba(192, 192, 192, 1) 100%);<br />
padding: 1rem;<br />
}<br />
<br />
<br />
<br />
.mw-page-container { <br />
background-image: url("https://dsignweek.servus.at/images/9/9d/Bg-01.png"); background-repeat: repeat-y; <br />
/* ✅ repeat vertically */ background-size: 100% auto; <br />
/* stretch to page width, keep height natural <br />
*/ background-position: center top; <br />
/* start at the top, center horizontally <br />
*/ background-attachment: scroll; <br />
/* move with page scroll */ background-color: #ffffff; /* fallback behind transparent areas */ }<br />
<br />
<br />
div#mw-head {<br />
background: transparent !important;<br />
}<br />
<br />
<br />
.dw-headline, .mw-headline {<br />
margin: 0 !important;<br />
}<br />
<br />
.skin-vector-2022 header.vector-header { box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8)!important; }<br />
<br />
.skin-vector-2022 #vector-sticky-header.vector-sticky-header {<br />
box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8) !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* ===== Mobile: stack card content vertically ===== */<br />
@media (max-width: 720px) {<br />
<br />
.mw-parser-output {<br />
box-sizing: border-box;<br />
overflow-x: hidden !important;<br />
}<br />
<br />
<br />
.mw-page-container { <br />
background-image: none !important;<br />
background-color: #ffffff !important;<br />
padding: 0 !important; /* ← fixed */<br />
margin: 0 !important;<br />
box-sizing: border-box;<br />
max-width: 100vw !important;<br />
overflow-x: hidden !important;<br />
}<br />
.dw-col {<br />
flex: 1 1 auto !important; /* let them shrink freely */<br />
min-width: 0 !important; /* remove the minimum width restriction */<br />
}<br />
<br />
<br />
.dw-card {<br />
padding:0;}<br />
div#content.mw-body {<br />
padding: 0rem;}<br />
div.mw-content-ltr.mw-parser-output {<br />
padding: 0.5rem;<br />
}<br />
<br />
.banner-icon img { <br />
width: 80vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 650px; /* prevent it from getting too big */ <br />
min-width: 120px; /* prevent it from getting too small */ <br />
padding-left: 0rem;}<br />
<br />
/* Stack everything in a column */<br />
.dw-card .dw-row {<br />
display: flex;<br />
flex-direction: column;<br />
align-items: stretch; /* full width for text block */<br />
gap: 10px;<br />
}<br />
<br />
/* Make the icon its own row and center it */<br />
.dw-card .dw-icon {<br />
display: flex;<br />
justify-content: center;<br />
align-items: center;<br />
margin: 0; /* remove any left/right spacing from desktop */<br />
}<br />
<br />
.dw-card .dw-icon img {<br />
width: 72px; /* tidy mobile size */<br />
height: auto;<br />
}<br />
<br />
/* Ensure the text block fills width */<br />
.dw-card .dw-row > div {<br />
width: 100%;<br />
}<br />
<br />
/* Slight spacing tweaks for headings on mobile */<br />
.dw-card .dw-headline {<br />
margin: 4px 0 4px;<br />
}<br />
<br />
.partner-logos {<br />
display: flex;<br />
flex-wrap: wrap; /* allows wrapping on small screens */<br />
justify-content: space-between !important; <br />
align-items: center!important; <br />
gap: 1.4rem; <br />
padding: 0 1rem 1rem 1rem; /* breathing room top & bottom */<br />
background: transparent;<br />
}<br />
<br />
.partner-logos img {<br />
height: 24px;<br />
width: auto;<br />
object-fit:contain;<br />
}<br />
<br />
}</div>
Ivans
https://dsignweek.servus.at/index.php?title=MediaWiki:Common.css&diff=1428
MediaWiki:Common.css
2025-11-20T14:15:08Z
<p>Ivans: </p>
<hr />
<div>/* CSS placed here will be applied to all skins */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
#footer-info-lastmod {<br />
display: none !important;<br />
}<br />
<br />
/* Vector 2022: align user links (language, username, etc.) to the top */<br />
body.skin-vector-2022 .vector-user-links-main {<br />
display: flex; /* make sure it's flexbox */<br />
align-items: flex-start; /* align children to the top of the div */<br />
}<br />
/* Hide the Translate extension banner ("Translate this page; This page has changes…") */<br />
body.skin-vector-2022 .mw-pt-translate-header {<br />
display: none !important;<br />
}<br />
/* Vector 2022 – hide entire tab/navigation bar (left-navigation) for all users */<br />
.skin-vector-2022 #left-navigation {<br />
display: none !important;<br />
}<br />
/* Vector 2022: right-align items in the page toolbar (Edit / View history / Tools) */<br />
.skin-vector-2022 .vector-page-toolbar-container {<br />
display: flex !important;<br />
justify-content: flex-end !important; /* pushes items to the right */<br />
align-items: center; /* vertical alignment */<br />
}<br />
<br />
<br />
<br />
.mw-anon.skin-vector-2022 #ca-nstab-main, /* page title tab (Main Page / Article) */<br />
.mw-anon.skin-vector-2022 #ca-talk, /* Talk tab */<br />
.mw-anon.skin-vector-2022 #ca-view, /* "Read" tab */<br />
.mw-anon.skin-vector-2022 #ca-history, /* View history */<br />
.mw-anon.skin-vector-2022 #ca-watch,<br />
.mw-anon.skin-vector-2022 #ca-unwatch,<br />
.mw-anon.skin-vector-2022 #ca-more { /* "Tools" dropdown */<br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* === GLOBAL TYPOGRAPHY === */<br />
<br />
/* Base body text — Liberation Sans */<br />
html,<br />
body,<br />
.mw-body,<br />
.mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 1.2rem; /* base = 16px */<br />
line-height: 1.15; <br />
}<br />
<br />
/* Paragraphs and list text */<br />
p, li, td, th {<br />
font-size: 1.1rem; /* slightly larger than base text */<br />
}<br />
<br />
/* === HEADINGS — Linux Libertine === */<br />
h1, h2, h3, h4, h5, h6,<br />
.firstHeading,<br />
.mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
.mw-body h1, .mw-heading1, .mw-body-content h1, .mw-body-content .mw-heading1 { font-size: 3rem; line-height: 1.15; } <br />
<br />
<br />
<br />
/* === SIDEBAR MENU === */<br />
#mw-panel,<br />
.vector-menu-content,<br />
#p-navigation,<br />
#p-tb,<br />
#p-lang {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem; /* sidebar smaller for contrast */<br />
line-height: 1.4;<br />
}<br />
<br />
#mw-panel,<br />
.vector-menu-content {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 90%, rgba(192, 192, 192, 1) 100%);<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
#partner-logos {<br />
display: flex;<br />
justify-content: right;<br />
align-items: right;<br />
flex-wrap: wrap;<br />
gap: 1rem;<br />
margin-top:0.8rem;<br />
<br />
}<br />
<br />
#partner-logos img {<br />
height: 32px;<br />
object-fit: contain; /* keeps aspect ratio, fits within the box */<br />
max-width: 100%; /* prevents overflow */<br />
display: block; /* removes inline gaps below images */<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
.wikitable.custom-table {<br />
width: 100%;<br />
border-collapse: separate;<br />
border-spacing: 0;<br />
border: none;<br />
background-color: #fff;<br />
border-radius: 0.5rem;<br />
overflow: hidden; /* so rounded corners clip correctly */<br />
font-size: 0.95rem;<br />
}<br />
<br />
<br />
<br />
/* Header cells */<br />
.wikitable.custom-table th {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
color: #000;<br />
font-weight: 600;<br />
text-align: left;<br />
padding: 0.75rem 1rem;<br />
border-bottom: 2px solid #d0d9ff;<br />
}<br />
<br />
/* Data cells */<br />
.wikitable.custom-table td {<br />
padding: 0.65rem 1rem;<br />
border-bottom: 1px solid #eee;<br />
}<br />
<br />
/* Zebra striping */<br />
.wikitable.custom-table tr:nth-child(even) td {<br />
background-color: #f9fbff;<br />
}<br />
<br />
/* Hover effect */<br />
.wikitable.custom-table tr:hover td {<br />
background: #FFF;<br />
background: linear-gradient(0deg,rgba(0, 0, 255, 1) 0%, rgba(255, 255, 255, 1) 15%, rgba(255, 255, 255, 1) 85%, rgba(0, 0, 255, 1) 100%);<br />
}<br />
<br />
/* Rounded corners for first & last rows */<br />
.wikitable.custom-table tr:first-child th:first-child {<br />
border-top-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:first-child th:last-child {<br />
border-top-right-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:first-child {<br />
border-bottom-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:last-child {<br />
border-bottom-right-radius: 0.5rem;<br />
}<br />
<br />
<br />
/* === Mobile Responsive Tables (no HTML change needed) === */<br />
@media (max-width: 768px) {<br />
<br />
/* Allow horizontal scrolling on narrow screens */<br />
.wikitable.custom-table {<br />
display: block;<br />
width: 100%;<br />
overflow-x: auto;<br />
-webkit-overflow-scrolling: touch;<br />
}<br />
<br />
/* Prevent collapsing/squeezing of long cell content */<br />
.wikitable.custom-table tr,<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
white-space: nowrap;<br />
}<br />
<br />
/* Optional: slightly reduce padding for small screens */<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
padding: 0.5rem 0.75rem;<br />
}<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* Hide the automatic Tools and Special pages sections */<br />
#p-tb { <br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* MAIN-PAGE */<br />
<br />
/* === FONTS (yours) === */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
.mw-pt-languages {<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);}<br />
/* === GLOBAL TYPOGRAPHY === */<br />
html, body, .mw-body, .mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem;<br />
line-height: 1.1;<br />
}<br />
p, li, td, th { font-size: 1.1rem; line-height: 1.1; }<br />
h1, h2, h3, h4, h5, h6, .firstHeading, .mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
<br />
/* === d*sign week layout === */<br />
:root {<br />
--dw-border: #cfd8e3;<br />
--dw-card-bg: #f8fbff;<br />
}<br />
<br />
/* top ribbon */<br />
.dw-ribbon {<br />
height: 26px;<br />
background: linear-gradient(#8aa9ff, #ffffff);<br />
border-radius: 6px;<br />
margin: 0 0 14px 0;<br />
}<br />
<br />
<br />
.banner {<br />
display: flex;<br />
align-items: center;<br />
justify-content: space-between;<br />
gap: 1.5rem;<br />
padding: 0rem 1rem 0rem 1rem;<br />
text-align: left; /* centers text within its box */<br />
flex-wrap: wrap; <br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
background-size: 100% 200%;<br />
background-position: top;<br />
transition: background-position 0.4s ease-in-out;<br />
}<br />
.banner:hover {<br />
background-position: bottom;<br />
}<br />
<br />
<br />
.banner-icon img { <br />
width: 20vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 650px; /* prevent it from getting too big */ <br />
min-width: 120px; /* prevent it from getting too small */ <br />
padding-left: 2rem;}<br />
<br />
.dw-subtitle {<br />
font-size: 1.5rem;<br />
line-height: 1;<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle-banner {<br />
font-size: 3rem;<br />
}<br />
.dw-subtitle strong {<br />
<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle a {<br />
color: #0000FF !important; /* link color similar to your example */<br />
text-decoration: none;<br />
}<br />
<br />
.dw-subtitle a:hover {<br />
text-decoration: underline;<br />
}<br />
<br />
<br />
/* title & subtitle */<br />
.dw-title {<br />
text-align: center;<br />
line-height: 1.2;<br />
font-size: 2.5rem;<br />
font-weight: 700;<br />
letter-spacing: .02em;<br />
display: block;<br />
}<br />
<br />
<br />
/* grid */<br />
.dw-grid {<br />
display: flex;<br />
flex-wrap: wrap;<br />
gap: 16px;<br />
align-items: flex-start;<br />
margin-top: 14px;<br />
}<br />
.dw-col {<br />
flex: 1 1 520px;<br />
min-width: 320px;<br />
}<br />
<br />
/* cards */<br />
.dw-card {<br />
position: relative;<br />
border: 1px solid #C0C0C0;<br />
background: #FFFFFF !important;<br />
padding: 10px;<br />
margin-bottom: 10px;<br />
}<br />
.dw-card:hover {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 75%, rgba(192, 192, 192, 1) 100%)!important;<br />
}<br />
span.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
<br />
}<br />
<br />
.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 2rem !important; <br />
}<br />
<br />
<br />
.dw-card .dw-row {<br />
display: flex;<br />
flex-wrap: wrap;<br />
align-items: flex-start;<br />
gap: 12px;<br />
width: 100%;<br />
box-sizing: border-box;<br />
padding: 14px; /* ✅ move the spacing here instead of .dw-card */<br />
}<br />
<br />
.dw-card .dw-row > div:last-child {<br />
flex: 1;<br />
min-width: 0; /* ✅ prevents overflow due to long text/links */<br />
}<br />
<br />
.dw-card .dw-icon img { height: auto; }<br />
.dw-card .dw-headline {<br />
display: block;<br />
font-size: 1.5rem;<br />
font-weight: 700;<br />
margin: 0px 0 0px;<br />
}<br />
.dw-card .dw-body { line-height: 1.6; width: 100%;}<br />
.dw-card .dw-body--spacious { line-height: 1.8; }<br />
<br />
<br />
.dw-icon,<br />
.dw-subtitle {<br />
background: transparent !important; /* ✅ makes logo + text boxes transparent */<br />
}<br />
<br />
<br />
/* Code blocks explicitly monospace (so they don't inherit) */<br />
pre, code, kbd, samp, tt, .mw-code {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
text-indent: 0 !important;<br />
}<br />
<br />
/* ===== Remove first-line indentation site-wide ===== */<br />
.mw-parser-output p,<br />
.mw-parser-output li p,<br />
.mw-body-content p,<br />
.dw-card .dw-body p {<br />
text-indent: 0 !important;<br />
}<br />
<br />
<br />
pre {<br />
margin: 0 !important;<br />
padding: 0rem !important; /* add a little inner spacing so text isn’t on the edge */<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);<br />
border: none !important;<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
white-space: pre-wrap !important; /* allows wrapping */<br />
word-break: break-word !important;<br />
line-height: 1 !important;<br />
<br />
}<br />
<br />
.dw-card .pre {<br />
display: block; /* ensures it behaves as a block element */<br />
width: 100% !important;/* takes up the full width of .dw-card */<br />
box-sizing: border-box;/* includes padding/border in width calculation */<br />
margin: 0;<br />
padding: 0;<br />
}<br />
<br />
<br />
div.mw-content-ltr.mw-parser-output {<br />
background: #FFFFFF;<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 97%, rgba(192, 192, 192, 1) 100%);<br />
padding: 1rem;<br />
}<br />
<br />
<br />
<br />
.mw-page-container { <br />
background-image: url("https://dsignweek.servus.at/images/9/9d/Bg-01.png"); background-repeat: repeat-y; <br />
/* ✅ repeat vertically */ background-size: 100% auto; <br />
/* stretch to page width, keep height natural <br />
*/ background-position: center top; <br />
/* start at the top, center horizontally <br />
*/ background-attachment: scroll; <br />
/* move with page scroll */ background-color: #ffffff; /* fallback behind transparent areas */ }<br />
<br />
<br />
div#mw-head {<br />
background: transparent !important;<br />
}<br />
<br />
<br />
.dw-headline, .mw-headline {<br />
margin: 0 !important;<br />
}<br />
<br />
.skin-vector-2022 header.vector-header { box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8)!important; }<br />
<br />
.skin-vector-2022 #vector-sticky-header.vector-sticky-header {<br />
box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8) !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* ===== Mobile: stack card content vertically ===== */<br />
@media (max-width: 720px) {<br />
<br />
.mw-parser-output {<br />
padding: 0 !important;<br />
margin: 0 !important;<br />
box-sizing: border-box;<br />
max-width: 100% !important;<br />
overflow-x: hidden !important;<br />
}<br />
<br />
<br />
.mw-page-container { <br />
background-image: none !important;<br />
background-color: #ffffff !important;<br />
padding: 0 !important; /* ← fixed */<br />
margin: 0 !important;<br />
box-sizing: border-box;<br />
}<br />
.dw-col {<br />
flex: 1 1 auto !important; /* let them shrink freely */<br />
min-width: 0 !important; /* remove the minimum width restriction */<br />
}<br />
<br />
<br />
.dw-card {<br />
padding:0;}<br />
div#content.mw-body {<br />
padding: 0rem;}<br />
div.mw-content-ltr.mw-parser-output {<br />
padding: 0.5rem;<br />
}<br />
<br />
.banner-icon img { <br />
width: 80vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 650px; /* prevent it from getting too big */ <br />
min-width: 120px; /* prevent it from getting too small */ <br />
padding-left: 0rem;}<br />
<br />
/* Stack everything in a column */<br />
.dw-card .dw-row {<br />
display: flex;<br />
flex-direction: column;<br />
align-items: stretch; /* full width for text block */<br />
gap: 10px;<br />
}<br />
<br />
/* Make the icon its own row and center it */<br />
.dw-card .dw-icon {<br />
display: flex;<br />
justify-content: center;<br />
align-items: center;<br />
margin: 0; /* remove any left/right spacing from desktop */<br />
}<br />
<br />
.dw-card .dw-icon img {<br />
width: 72px; /* tidy mobile size */<br />
height: auto;<br />
}<br />
<br />
/* Ensure the text block fills width */<br />
.dw-card .dw-row > div {<br />
width: 100%;<br />
}<br />
<br />
/* Slight spacing tweaks for headings on mobile */<br />
.dw-card .dw-headline {<br />
margin: 4px 0 4px;<br />
}<br />
<br />
.partner-logos {<br />
display: flex;<br />
flex-wrap: wrap; /* allows wrapping on small screens */<br />
justify-content: space-between !important; <br />
align-items: center!important; <br />
gap: 1.4rem; <br />
padding: 0 1rem 1rem 1rem; /* breathing room top & bottom */<br />
background: transparent;<br />
}<br />
<br />
.partner-logos img {<br />
height: 24px;<br />
width: auto;<br />
object-fit:contain;<br />
}<br />
<br />
}</div>
Ivans
https://dsignweek.servus.at/index.php?title=MediaWiki:Common.css&diff=1427
MediaWiki:Common.css
2025-11-20T14:11:21Z
<p>Ivans: </p>
<hr />
<div>/* CSS placed here will be applied to all skins */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
#footer-info-lastmod {<br />
display: none !important;<br />
}<br />
<br />
/* Vector 2022: align user links (language, username, etc.) to the top */<br />
body.skin-vector-2022 .vector-user-links-main {<br />
display: flex; /* make sure it's flexbox */<br />
align-items: flex-start; /* align children to the top of the div */<br />
}<br />
/* Hide the Translate extension banner ("Translate this page; This page has changes…") */<br />
body.skin-vector-2022 .mw-pt-translate-header {<br />
display: none !important;<br />
}<br />
/* Vector 2022 – hide entire tab/navigation bar (left-navigation) for all users */<br />
.skin-vector-2022 #left-navigation {<br />
display: none !important;<br />
}<br />
/* Vector 2022: right-align items in the page toolbar (Edit / View history / Tools) */<br />
.skin-vector-2022 .vector-page-toolbar-container {<br />
display: flex !important;<br />
justify-content: flex-end !important; /* pushes items to the right */<br />
align-items: center; /* vertical alignment */<br />
}<br />
<br />
<br />
<br />
.mw-anon.skin-vector-2022 #ca-nstab-main, /* page title tab (Main Page / Article) */<br />
.mw-anon.skin-vector-2022 #ca-talk, /* Talk tab */<br />
.mw-anon.skin-vector-2022 #ca-view, /* "Read" tab */<br />
.mw-anon.skin-vector-2022 #ca-history, /* View history */<br />
.mw-anon.skin-vector-2022 #ca-watch,<br />
.mw-anon.skin-vector-2022 #ca-unwatch,<br />
.mw-anon.skin-vector-2022 #ca-more { /* "Tools" dropdown */<br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* === GLOBAL TYPOGRAPHY === */<br />
<br />
/* Base body text — Liberation Sans */<br />
html,<br />
body,<br />
.mw-body,<br />
.mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 1.2rem; /* base = 16px */<br />
line-height: 1.15; <br />
}<br />
<br />
/* Paragraphs and list text */<br />
p, li, td, th {<br />
font-size: 1.1rem; /* slightly larger than base text */<br />
}<br />
<br />
/* === HEADINGS — Linux Libertine === */<br />
h1, h2, h3, h4, h5, h6,<br />
.firstHeading,<br />
.mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
.mw-body h1, .mw-heading1, .mw-body-content h1, .mw-body-content .mw-heading1 { font-size: 3rem; line-height: 1.15; } <br />
<br />
<br />
<br />
/* === SIDEBAR MENU === */<br />
#mw-panel,<br />
.vector-menu-content,<br />
#p-navigation,<br />
#p-tb,<br />
#p-lang {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem; /* sidebar smaller for contrast */<br />
line-height: 1.4;<br />
}<br />
<br />
#mw-panel,<br />
.vector-menu-content {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 90%, rgba(192, 192, 192, 1) 100%);<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
#partner-logos {<br />
display: flex;<br />
justify-content: right;<br />
align-items: right;<br />
flex-wrap: wrap;<br />
gap: 1rem;<br />
margin-top:0.8rem;<br />
<br />
}<br />
<br />
#partner-logos img {<br />
height: 32px;<br />
object-fit: contain; /* keeps aspect ratio, fits within the box */<br />
max-width: 100%; /* prevents overflow */<br />
display: block; /* removes inline gaps below images */<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
.wikitable.custom-table {<br />
width: 100%;<br />
border-collapse: separate;<br />
border-spacing: 0;<br />
border: none;<br />
background-color: #fff;<br />
border-radius: 0.5rem;<br />
overflow: hidden; /* so rounded corners clip correctly */<br />
font-size: 0.95rem;<br />
}<br />
<br />
<br />
<br />
/* Header cells */<br />
.wikitable.custom-table th {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
color: #000;<br />
font-weight: 600;<br />
text-align: left;<br />
padding: 0.75rem 1rem;<br />
border-bottom: 2px solid #d0d9ff;<br />
}<br />
<br />
/* Data cells */<br />
.wikitable.custom-table td {<br />
padding: 0.65rem 1rem;<br />
border-bottom: 1px solid #eee;<br />
}<br />
<br />
/* Zebra striping */<br />
.wikitable.custom-table tr:nth-child(even) td {<br />
background-color: #f9fbff;<br />
}<br />
<br />
/* Hover effect */<br />
.wikitable.custom-table tr:hover td {<br />
background: #FFF;<br />
background: linear-gradient(0deg,rgba(0, 0, 255, 1) 0%, rgba(255, 255, 255, 1) 15%, rgba(255, 255, 255, 1) 85%, rgba(0, 0, 255, 1) 100%);<br />
}<br />
<br />
/* Rounded corners for first & last rows */<br />
.wikitable.custom-table tr:first-child th:first-child {<br />
border-top-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:first-child th:last-child {<br />
border-top-right-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:first-child {<br />
border-bottom-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:last-child {<br />
border-bottom-right-radius: 0.5rem;<br />
}<br />
<br />
<br />
/* === Mobile Responsive Tables (no HTML change needed) === */<br />
@media (max-width: 768px) {<br />
<br />
/* Allow horizontal scrolling on narrow screens */<br />
.wikitable.custom-table {<br />
display: block;<br />
width: 100%;<br />
overflow-x: auto;<br />
-webkit-overflow-scrolling: touch;<br />
}<br />
<br />
/* Prevent collapsing/squeezing of long cell content */<br />
.wikitable.custom-table tr,<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
white-space: nowrap;<br />
}<br />
<br />
/* Optional: slightly reduce padding for small screens */<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
padding: 0.5rem 0.75rem;<br />
}<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* Hide the automatic Tools and Special pages sections */<br />
#p-tb { <br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* MAIN-PAGE */<br />
<br />
/* === FONTS (yours) === */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
.mw-pt-languages {<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);}<br />
/* === GLOBAL TYPOGRAPHY === */<br />
html, body, .mw-body, .mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem;<br />
line-height: 1.1;<br />
}<br />
p, li, td, th { font-size: 1.1rem; line-height: 1.1; }<br />
h1, h2, h3, h4, h5, h6, .firstHeading, .mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
<br />
/* === d*sign week layout === */<br />
:root {<br />
--dw-border: #cfd8e3;<br />
--dw-card-bg: #f8fbff;<br />
}<br />
<br />
/* top ribbon */<br />
.dw-ribbon {<br />
height: 26px;<br />
background: linear-gradient(#8aa9ff, #ffffff);<br />
border-radius: 6px;<br />
margin: 0 0 14px 0;<br />
}<br />
<br />
<br />
.banner {<br />
display: flex;<br />
align-items: center;<br />
justify-content: space-between;<br />
gap: 1.5rem;<br />
padding: 0rem 1rem 0rem 1rem;<br />
text-align: left; /* centers text within its box */<br />
flex-wrap: wrap; <br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
background-size: 100% 200%;<br />
background-position: top;<br />
transition: background-position 0.4s ease-in-out;<br />
}<br />
.banner:hover {<br />
background-position: bottom;<br />
}<br />
<br />
<br />
.banner-icon img { <br />
width: 20vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 650px; /* prevent it from getting too big */ <br />
min-width: 120px; /* prevent it from getting too small */ <br />
padding-left: 2rem;}<br />
<br />
.dw-subtitle {<br />
font-size: 1.5rem;<br />
line-height: 1;<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle-banner {<br />
font-size: 3rem;<br />
}<br />
.dw-subtitle strong {<br />
<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle a {<br />
color: #0000FF !important; /* link color similar to your example */<br />
text-decoration: none;<br />
}<br />
<br />
.dw-subtitle a:hover {<br />
text-decoration: underline;<br />
}<br />
<br />
<br />
/* title & subtitle */<br />
.dw-title {<br />
text-align: center;<br />
line-height: 1.2;<br />
font-size: 2.5rem;<br />
font-weight: 700;<br />
letter-spacing: .02em;<br />
display: block;<br />
}<br />
<br />
<br />
/* grid */<br />
.dw-grid {<br />
display: flex;<br />
flex-wrap: wrap;<br />
gap: 16px;<br />
align-items: flex-start;<br />
margin-top: 14px;<br />
}<br />
.dw-col {<br />
flex: 1 1 520px;<br />
min-width: 320px;<br />
}<br />
<br />
/* cards */<br />
.dw-card {<br />
position: relative;<br />
border: 1px solid #C0C0C0;<br />
background: #FFFFFF !important;<br />
padding: 10px;<br />
margin-bottom: 10px;<br />
}<br />
.dw-card:hover {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 75%, rgba(192, 192, 192, 1) 100%)!important;<br />
}<br />
span.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
<br />
}<br />
<br />
.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 2rem !important; <br />
}<br />
<br />
<br />
.dw-card .dw-row {<br />
display: flex;<br />
flex-wrap: wrap;<br />
align-items: flex-start;<br />
gap: 12px;<br />
width: 100%;<br />
box-sizing: border-box;<br />
padding: 14px; /* ✅ move the spacing here instead of .dw-card */<br />
}<br />
<br />
.dw-card .dw-row > div:last-child {<br />
flex: 1;<br />
min-width: 0; /* ✅ prevents overflow due to long text/links */<br />
}<br />
<br />
.dw-card .dw-icon img { height: auto; }<br />
.dw-card .dw-headline {<br />
display: block;<br />
font-size: 1.5rem;<br />
font-weight: 700;<br />
margin: 0px 0 0px;<br />
}<br />
.dw-card .dw-body { line-height: 1.6; width: 100%;}<br />
.dw-card .dw-body--spacious { line-height: 1.8; }<br />
<br />
<br />
.dw-icon,<br />
.dw-subtitle {<br />
background: transparent !important; /* ✅ makes logo + text boxes transparent */<br />
}<br />
<br />
<br />
/* Code blocks explicitly monospace (so they don't inherit) */<br />
pre, code, kbd, samp, tt, .mw-code {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
text-indent: 0 !important;<br />
}<br />
<br />
/* ===== Remove first-line indentation site-wide ===== */<br />
.mw-parser-output p,<br />
.mw-parser-output li p,<br />
.mw-body-content p,<br />
.dw-card .dw-body p {<br />
text-indent: 0 !important;<br />
}<br />
<br />
<br />
pre {<br />
margin: 0 !important;<br />
padding: 0rem !important; /* add a little inner spacing so text isn’t on the edge */<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);<br />
border: none !important;<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
white-space: pre-wrap !important; /* allows wrapping */<br />
word-break: break-word !important;<br />
line-height: 1 !important;<br />
<br />
}<br />
<br />
.dw-card .pre {<br />
display: block; /* ensures it behaves as a block element */<br />
width: 100% !important;/* takes up the full width of .dw-card */<br />
box-sizing: border-box;/* includes padding/border in width calculation */<br />
margin: 0;<br />
padding: 0;<br />
}<br />
<br />
<br />
div.mw-content-ltr.mw-parser-output {<br />
background: #FFFFFF;<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 97%, rgba(192, 192, 192, 1) 100%);<br />
padding: 1rem;<br />
}<br />
<br />
<br />
<br />
.mw-page-container { <br />
background-image: url("https://dsignweek.servus.at/images/9/9d/Bg-01.png"); background-repeat: repeat-y; <br />
/* ✅ repeat vertically */ background-size: 100% auto; <br />
/* stretch to page width, keep height natural <br />
*/ background-position: center top; <br />
/* start at the top, center horizontally <br />
*/ background-attachment: scroll; <br />
/* move with page scroll */ background-color: #ffffff; /* fallback behind transparent areas */ }<br />
<br />
<br />
div#mw-head {<br />
background: transparent !important;<br />
}<br />
<br />
<br />
.dw-headline, .mw-headline {<br />
margin: 0 !important;<br />
}<br />
<br />
.skin-vector-2022 header.vector-header { box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8)!important; }<br />
<br />
.skin-vector-2022 #vector-sticky-header.vector-sticky-header {<br />
box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8) !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* ===== Mobile: stack card content vertically ===== */<br />
@media (max-width: 720px) {<br />
<br />
.mw-page-container { <br />
background-image: none !important;<br />
background-color: #ffffff !important;<br />
padding: 0 !important; /* ← fixed */<br />
margin: 0 !important;<br />
box-sizing: border-box;<br />
}<br />
.dw-col {<br />
flex: 1 1 auto !important; /* let them shrink freely */<br />
min-width: 0 !important; /* remove the minimum width restriction */<br />
}<br />
<br />
<br />
.dw-card {<br />
padding:0;}<br />
div#content.mw-body {<br />
padding: 0rem;}<br />
div.mw-content-ltr.mw-parser-output {<br />
padding: 0.5rem;<br />
}<br />
<br />
.banner-icon img { <br />
width: 80vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 650px; /* prevent it from getting too big */ <br />
min-width: 120px; /* prevent it from getting too small */ <br />
padding-left: 0rem;}<br />
<br />
/* Stack everything in a column */<br />
.dw-card .dw-row {<br />
display: flex;<br />
flex-direction: column;<br />
align-items: stretch; /* full width for text block */<br />
gap: 10px;<br />
}<br />
<br />
/* Make the icon its own row and center it */<br />
.dw-card .dw-icon {<br />
display: flex;<br />
justify-content: center;<br />
align-items: center;<br />
margin: 0; /* remove any left/right spacing from desktop */<br />
}<br />
<br />
.dw-card .dw-icon img {<br />
width: 72px; /* tidy mobile size */<br />
height: auto;<br />
}<br />
<br />
/* Ensure the text block fills width */<br />
.dw-card .dw-row > div {<br />
width: 100%;<br />
}<br />
<br />
/* Slight spacing tweaks for headings on mobile */<br />
.dw-card .dw-headline {<br />
margin: 4px 0 4px;<br />
}<br />
<br />
.partner-logos {<br />
display: flex;<br />
flex-wrap: wrap; /* allows wrapping on small screens */<br />
justify-content: space-between !important; <br />
align-items: center!important; <br />
gap: 1.4rem; <br />
padding: 0 1rem 1rem 1rem; /* breathing room top & bottom */<br />
background: transparent;<br />
}<br />
<br />
.partner-logos img {<br />
height: 24px;<br />
width: auto;<br />
object-fit:contain;<br />
}<br />
<br />
}</div>
Ivans
https://dsignweek.servus.at/index.php?title=MediaWiki:Common.css&diff=1426
MediaWiki:Common.css
2025-11-20T14:06:57Z
<p>Ivans: </p>
<hr />
<div>/* CSS placed here will be applied to all skins */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
#footer-info-lastmod {<br />
display: none !important;<br />
}<br />
<br />
/* Vector 2022: align user links (language, username, etc.) to the top */<br />
body.skin-vector-2022 .vector-user-links-main {<br />
display: flex; /* make sure it's flexbox */<br />
align-items: flex-start; /* align children to the top of the div */<br />
}<br />
/* Hide the Translate extension banner ("Translate this page; This page has changes…") */<br />
body.skin-vector-2022 .mw-pt-translate-header {<br />
display: none !important;<br />
}<br />
/* Vector 2022 – hide entire tab/navigation bar (left-navigation) for all users */<br />
.skin-vector-2022 #left-navigation {<br />
display: none !important;<br />
}<br />
/* Vector 2022: right-align items in the page toolbar (Edit / View history / Tools) */<br />
.skin-vector-2022 .vector-page-toolbar-container {<br />
display: flex !important;<br />
justify-content: flex-end !important; /* pushes items to the right */<br />
align-items: center; /* vertical alignment */<br />
}<br />
<br />
<br />
<br />
.mw-anon.skin-vector-2022 #ca-nstab-main, /* page title tab (Main Page / Article) */<br />
.mw-anon.skin-vector-2022 #ca-talk, /* Talk tab */<br />
.mw-anon.skin-vector-2022 #ca-view, /* "Read" tab */<br />
.mw-anon.skin-vector-2022 #ca-history, /* View history */<br />
.mw-anon.skin-vector-2022 #ca-watch,<br />
.mw-anon.skin-vector-2022 #ca-unwatch,<br />
.mw-anon.skin-vector-2022 #ca-more { /* "Tools" dropdown */<br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* === GLOBAL TYPOGRAPHY === */<br />
<br />
/* Base body text — Liberation Sans */<br />
html,<br />
body,<br />
.mw-body,<br />
.mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 1.2rem; /* base = 16px */<br />
line-height: 1.15; <br />
}<br />
<br />
/* Paragraphs and list text */<br />
p, li, td, th {<br />
font-size: 1.1rem; /* slightly larger than base text */<br />
}<br />
<br />
/* === HEADINGS — Linux Libertine === */<br />
h1, h2, h3, h4, h5, h6,<br />
.firstHeading,<br />
.mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
.mw-body h1, .mw-heading1, .mw-body-content h1, .mw-body-content .mw-heading1 { font-size: 3rem; line-height: 1.15; } <br />
<br />
<br />
<br />
/* === SIDEBAR MENU === */<br />
#mw-panel,<br />
.vector-menu-content,<br />
#p-navigation,<br />
#p-tb,<br />
#p-lang {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem; /* sidebar smaller for contrast */<br />
line-height: 1.4;<br />
}<br />
<br />
#mw-panel,<br />
.vector-menu-content {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 90%, rgba(192, 192, 192, 1) 100%);<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
#partner-logos {<br />
display: flex;<br />
justify-content: right;<br />
align-items: right;<br />
flex-wrap: wrap;<br />
gap: 1rem;<br />
margin-top:0.8rem;<br />
<br />
}<br />
<br />
#partner-logos img {<br />
height: 32px;<br />
object-fit: contain; /* keeps aspect ratio, fits within the box */<br />
max-width: 100%; /* prevents overflow */<br />
display: block; /* removes inline gaps below images */<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
.wikitable.custom-table {<br />
width: 100%;<br />
border-collapse: separate;<br />
border-spacing: 0;<br />
border: none;<br />
background-color: #fff;<br />
border-radius: 0.5rem;<br />
overflow: hidden; /* so rounded corners clip correctly */<br />
font-size: 0.95rem;<br />
}<br />
<br />
<br />
<br />
/* Header cells */<br />
.wikitable.custom-table th {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
color: #000;<br />
font-weight: 600;<br />
text-align: left;<br />
padding: 0.75rem 1rem;<br />
border-bottom: 2px solid #d0d9ff;<br />
}<br />
<br />
/* Data cells */<br />
.wikitable.custom-table td {<br />
padding: 0.65rem 1rem;<br />
border-bottom: 1px solid #eee;<br />
}<br />
<br />
/* Zebra striping */<br />
.wikitable.custom-table tr:nth-child(even) td {<br />
background-color: #f9fbff;<br />
}<br />
<br />
/* Hover effect */<br />
.wikitable.custom-table tr:hover td {<br />
background: #FFF;<br />
background: linear-gradient(0deg,rgba(0, 0, 255, 1) 0%, rgba(255, 255, 255, 1) 15%, rgba(255, 255, 255, 1) 85%, rgba(0, 0, 255, 1) 100%);<br />
}<br />
<br />
/* Rounded corners for first & last rows */<br />
.wikitable.custom-table tr:first-child th:first-child {<br />
border-top-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:first-child th:last-child {<br />
border-top-right-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:first-child {<br />
border-bottom-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:last-child {<br />
border-bottom-right-radius: 0.5rem;<br />
}<br />
<br />
<br />
/* === Mobile Responsive Tables (no HTML change needed) === */<br />
@media (max-width: 768px) {<br />
<br />
/* Allow horizontal scrolling on narrow screens */<br />
.wikitable.custom-table {<br />
display: block;<br />
width: 100%;<br />
overflow-x: auto;<br />
-webkit-overflow-scrolling: touch;<br />
}<br />
<br />
/* Prevent collapsing/squeezing of long cell content */<br />
.wikitable.custom-table tr,<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
white-space: nowrap;<br />
}<br />
<br />
/* Optional: slightly reduce padding for small screens */<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
padding: 0.5rem 0.75rem;<br />
}<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* Hide the automatic Tools and Special pages sections */<br />
#p-tb { <br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* MAIN-PAGE */<br />
<br />
/* === FONTS (yours) === */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
.mw-pt-languages {<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);}<br />
/* === GLOBAL TYPOGRAPHY === */<br />
html, body, .mw-body, .mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem;<br />
line-height: 1.1;<br />
}<br />
p, li, td, th { font-size: 1.1rem; line-height: 1.1; }<br />
h1, h2, h3, h4, h5, h6, .firstHeading, .mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
<br />
/* === d*sign week layout === */<br />
:root {<br />
--dw-border: #cfd8e3;<br />
--dw-card-bg: #f8fbff;<br />
}<br />
<br />
/* top ribbon */<br />
.dw-ribbon {<br />
height: 26px;<br />
background: linear-gradient(#8aa9ff, #ffffff);<br />
border-radius: 6px;<br />
margin: 0 0 14px 0;<br />
}<br />
<br />
<br />
.banner {<br />
display: flex;<br />
align-items: center;<br />
justify-content: space-between;<br />
gap: 1.5rem;<br />
padding: 0rem 1rem 0rem 1rem;<br />
text-align: left; /* centers text within its box */<br />
flex-wrap: wrap; <br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
background-size: 100% 200%;<br />
background-position: top;<br />
transition: background-position 0.4s ease-in-out;<br />
}<br />
.banner:hover {<br />
background-position: bottom;<br />
}<br />
<br />
<br />
.banner-icon img { <br />
width: 20vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 650px; /* prevent it from getting too big */ <br />
min-width: 120px; /* prevent it from getting too small */ <br />
padding-left: 2rem;}<br />
<br />
.dw-subtitle {<br />
font-size: 1.5rem;<br />
line-height: 1;<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle-banner {<br />
font-size: 3rem;<br />
}<br />
.dw-subtitle strong {<br />
<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle a {<br />
color: #0000FF !important; /* link color similar to your example */<br />
text-decoration: none;<br />
}<br />
<br />
.dw-subtitle a:hover {<br />
text-decoration: underline;<br />
}<br />
<br />
<br />
/* title & subtitle */<br />
.dw-title {<br />
text-align: center;<br />
line-height: 1.2;<br />
font-size: 2.5rem;<br />
font-weight: 700;<br />
letter-spacing: .02em;<br />
display: block;<br />
}<br />
<br />
<br />
/* grid */<br />
.dw-grid {<br />
display: flex;<br />
flex-wrap: wrap;<br />
gap: 16px;<br />
align-items: flex-start;<br />
margin-top: 14px;<br />
}<br />
.dw-col {<br />
flex: 1 1 520px;<br />
min-width: 320px;<br />
}<br />
<br />
/* cards */<br />
.dw-card {<br />
position: relative;<br />
border: 1px solid #C0C0C0;<br />
background: #FFFFFF !important;<br />
padding: 10px;<br />
margin-bottom: 10px;<br />
}<br />
.dw-card:hover {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 75%, rgba(192, 192, 192, 1) 100%)!important;<br />
}<br />
span.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
<br />
}<br />
<br />
.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 2rem !important; <br />
}<br />
<br />
<br />
.dw-card .dw-row {<br />
display: flex;<br />
flex-wrap: wrap;<br />
align-items: flex-start;<br />
gap: 12px;<br />
width: 100%;<br />
box-sizing: border-box;<br />
padding: 14px; /* ✅ move the spacing here instead of .dw-card */<br />
}<br />
<br />
.dw-card .dw-row > div:last-child {<br />
flex: 1;<br />
min-width: 0; /* ✅ prevents overflow due to long text/links */<br />
}<br />
<br />
.dw-card .dw-icon img { height: auto; }<br />
.dw-card .dw-headline {<br />
display: block;<br />
font-size: 1.5rem;<br />
font-weight: 700;<br />
margin: 0px 0 0px;<br />
}<br />
.dw-card .dw-body { line-height: 1.6; width: 100%;}<br />
.dw-card .dw-body--spacious { line-height: 1.8; }<br />
<br />
<br />
.dw-icon,<br />
.dw-subtitle {<br />
background: transparent !important; /* ✅ makes logo + text boxes transparent */<br />
}<br />
<br />
<br />
/* Code blocks explicitly monospace (so they don't inherit) */<br />
pre, code, kbd, samp, tt, .mw-code {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
text-indent: 0 !important;<br />
}<br />
<br />
/* ===== Remove first-line indentation site-wide ===== */<br />
.mw-parser-output p,<br />
.mw-parser-output li p,<br />
.mw-body-content p,<br />
.dw-card .dw-body p {<br />
text-indent: 0 !important;<br />
}<br />
<br />
<br />
pre {<br />
margin: 0 !important;<br />
padding: 0rem !important; /* add a little inner spacing so text isn’t on the edge */<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);<br />
border: none !important;<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
white-space: pre-wrap !important; /* allows wrapping */<br />
word-break: break-word !important;<br />
line-height: 1 !important;<br />
<br />
}<br />
<br />
.dw-card .pre {<br />
display: block; /* ensures it behaves as a block element */<br />
width: 100% !important;/* takes up the full width of .dw-card */<br />
box-sizing: border-box;/* includes padding/border in width calculation */<br />
margin: 0;<br />
padding: 0;<br />
}<br />
<br />
<br />
div.mw-content-ltr.mw-parser-output {<br />
background: #FFFFFF;<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 97%, rgba(192, 192, 192, 1) 100%);<br />
padding: 1rem;<br />
}<br />
<br />
<br />
<br />
.mw-page-container { <br />
background-image: url("https://dsignweek.servus.at/images/9/9d/Bg-01.png"); background-repeat: repeat-y; <br />
/* ✅ repeat vertically */ background-size: 100% auto; <br />
/* stretch to page width, keep height natural <br />
*/ background-position: center top; <br />
/* start at the top, center horizontally <br />
*/ background-attachment: scroll; <br />
/* move with page scroll */ background-color: #ffffff; /* fallback behind transparent areas */ }<br />
<br />
<br />
div#mw-head {<br />
background: transparent !important;<br />
}<br />
<br />
<br />
.dw-headline, .mw-headline {<br />
margin: 0 !important;<br />
}<br />
<br />
.skin-vector-2022 header.vector-header { box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8)!important; }<br />
<br />
.skin-vector-2022 #vector-sticky-header.vector-sticky-header {<br />
box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8) !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* ===== Mobile: stack card content vertically ===== */<br />
@media (max-width: 720px) {<br />
<br />
.mw-page-container { <br />
background-image: none !important;<br />
background-color: #ffffff !important;<br />
padding:5px;<br />
}<br />
<br />
.header-container.header-chrome {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 75%, rgba(192, 192, 192, 1) 95%);<br />
}<br />
.minerva-footer {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 75%, rgba(192, 192, 192, 1) 95%);<br />
}<br />
<br />
#content.mw-body {<br />
background: linear-gradient(to top, #0000FF, #ffffff) !important; /* blue → white gradient */<br />
}<br />
<br />
.dw-card {<br />
padding:0;}<br />
div#content.mw-body {<br />
padding: 0rem;}<br />
div.mw-content-ltr.mw-parser-output {<br />
padding: 0.5rem;<br />
}<br />
<br />
.banner-icon img { <br />
width: 80vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 650px; /* prevent it from getting too big */ <br />
min-width: 120px; /* prevent it from getting too small */ <br />
padding-left: 0rem;}<br />
<br />
/* Stack everything in a column */<br />
.dw-card .dw-row {<br />
display: flex;<br />
flex-direction: column;<br />
align-items: stretch; /* full width for text block */<br />
gap: 10px;<br />
}<br />
<br />
/* Make the icon its own row and center it */<br />
.dw-card .dw-icon {<br />
display: flex;<br />
justify-content: center;<br />
align-items: center;<br />
margin: 0; /* remove any left/right spacing from desktop */<br />
}<br />
<br />
.dw-card .dw-icon img {<br />
width: 72px; /* tidy mobile size */<br />
height: auto;<br />
}<br />
<br />
/* Ensure the text block fills width */<br />
.dw-card .dw-row > div {<br />
width: 100%;<br />
}<br />
<br />
/* Slight spacing tweaks for headings on mobile */<br />
.dw-card .dw-headline {<br />
margin: 4px 0 4px;<br />
}<br />
<br />
.partner-logos {<br />
display: flex;<br />
flex-wrap: wrap; /* allows wrapping on small screens */<br />
justify-content: space-between !important; <br />
align-items: center!important; <br />
gap: 1.4rem; <br />
padding: 0 1rem 1rem 1rem; /* breathing room top & bottom */<br />
background: transparent;<br />
}<br />
<br />
.partner-logos img {<br />
height: 24px;<br />
width: auto;<br />
object-fit:contain;<br />
}<br />
<br />
}</div>
Ivans
https://dsignweek.servus.at/index.php?title=MediaWiki:Common.css&diff=1425
MediaWiki:Common.css
2025-11-20T14:04:04Z
<p>Ivans: </p>
<hr />
<div>/* CSS placed here will be applied to all skins */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
#footer-info-lastmod {<br />
display: none !important;<br />
}<br />
<br />
/* Vector 2022: align user links (language, username, etc.) to the top */<br />
body.skin-vector-2022 .vector-user-links-main {<br />
display: flex; /* make sure it's flexbox */<br />
align-items: flex-start; /* align children to the top of the div */<br />
}<br />
/* Hide the Translate extension banner ("Translate this page; This page has changes…") */<br />
body.skin-vector-2022 .mw-pt-translate-header {<br />
display: none !important;<br />
}<br />
/* Vector 2022 – hide entire tab/navigation bar (left-navigation) for all users */<br />
.skin-vector-2022 #left-navigation {<br />
display: none !important;<br />
}<br />
/* Vector 2022: right-align items in the page toolbar (Edit / View history / Tools) */<br />
.skin-vector-2022 .vector-page-toolbar-container {<br />
display: flex !important;<br />
justify-content: flex-end !important; /* pushes items to the right */<br />
align-items: center; /* vertical alignment */<br />
}<br />
<br />
<br />
<br />
.mw-anon.skin-vector-2022 #ca-nstab-main, /* page title tab (Main Page / Article) */<br />
.mw-anon.skin-vector-2022 #ca-talk, /* Talk tab */<br />
.mw-anon.skin-vector-2022 #ca-view, /* "Read" tab */<br />
.mw-anon.skin-vector-2022 #ca-history, /* View history */<br />
.mw-anon.skin-vector-2022 #ca-watch,<br />
.mw-anon.skin-vector-2022 #ca-unwatch,<br />
.mw-anon.skin-vector-2022 #ca-more { /* "Tools" dropdown */<br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* === GLOBAL TYPOGRAPHY === */<br />
<br />
/* Base body text — Liberation Sans */<br />
html,<br />
body,<br />
.mw-body,<br />
.mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 1.2rem; /* base = 16px */<br />
line-height: 1.15; <br />
}<br />
<br />
/* Paragraphs and list text */<br />
p, li, td, th {<br />
font-size: 1.1rem; /* slightly larger than base text */<br />
}<br />
<br />
/* === HEADINGS — Linux Libertine === */<br />
h1, h2, h3, h4, h5, h6,<br />
.firstHeading,<br />
.mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
.mw-body h1, .mw-heading1, .mw-body-content h1, .mw-body-content .mw-heading1 { font-size: 3rem; line-height: 1.15; } <br />
<br />
<br />
<br />
/* === SIDEBAR MENU === */<br />
#mw-panel,<br />
.vector-menu-content,<br />
#p-navigation,<br />
#p-tb,<br />
#p-lang {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem; /* sidebar smaller for contrast */<br />
line-height: 1.4;<br />
}<br />
<br />
#mw-panel,<br />
.vector-menu-content {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 90%, rgba(192, 192, 192, 1) 100%);<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
#partner-logos {<br />
display: flex;<br />
justify-content: right;<br />
align-items: right;<br />
flex-wrap: wrap;<br />
gap: 1rem;<br />
margin-top:0.8rem;<br />
<br />
}<br />
<br />
#partner-logos img {<br />
height: 32px;<br />
object-fit: contain; /* keeps aspect ratio, fits within the box */<br />
max-width: 100%; /* prevents overflow */<br />
display: block; /* removes inline gaps below images */<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
.wikitable.custom-table {<br />
width: 100%;<br />
border-collapse: separate;<br />
border-spacing: 0;<br />
border: none;<br />
background-color: #fff;<br />
border-radius: 0.5rem;<br />
overflow: hidden; /* so rounded corners clip correctly */<br />
font-size: 0.95rem;<br />
}<br />
<br />
<br />
<br />
/* Header cells */<br />
.wikitable.custom-table th {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
color: #000;<br />
font-weight: 600;<br />
text-align: left;<br />
padding: 0.75rem 1rem;<br />
border-bottom: 2px solid #d0d9ff;<br />
}<br />
<br />
/* Data cells */<br />
.wikitable.custom-table td {<br />
padding: 0.65rem 1rem;<br />
border-bottom: 1px solid #eee;<br />
}<br />
<br />
/* Zebra striping */<br />
.wikitable.custom-table tr:nth-child(even) td {<br />
background-color: #f9fbff;<br />
}<br />
<br />
/* Hover effect */<br />
.wikitable.custom-table tr:hover td {<br />
background: #FFF;<br />
background: linear-gradient(0deg,rgba(0, 0, 255, 1) 0%, rgba(255, 255, 255, 1) 15%, rgba(255, 255, 255, 1) 85%, rgba(0, 0, 255, 1) 100%);<br />
}<br />
<br />
/* Rounded corners for first & last rows */<br />
.wikitable.custom-table tr:first-child th:first-child {<br />
border-top-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:first-child th:last-child {<br />
border-top-right-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:first-child {<br />
border-bottom-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:last-child {<br />
border-bottom-right-radius: 0.5rem;<br />
}<br />
<br />
<br />
/* === Mobile Responsive Tables (no HTML change needed) === */<br />
@media (max-width: 768px) {<br />
<br />
/* Allow horizontal scrolling on narrow screens */<br />
.wikitable.custom-table {<br />
display: block;<br />
width: 100%;<br />
overflow-x: auto;<br />
-webkit-overflow-scrolling: touch;<br />
}<br />
<br />
/* Prevent collapsing/squeezing of long cell content */<br />
.wikitable.custom-table tr,<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
white-space: nowrap;<br />
}<br />
<br />
/* Optional: slightly reduce padding for small screens */<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
padding: 0.5rem 0.75rem;<br />
}<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* Hide the automatic Tools and Special pages sections */<br />
#p-tb { <br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* MAIN-PAGE */<br />
<br />
/* === FONTS (yours) === */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
.mw-pt-languages {<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);}<br />
/* === GLOBAL TYPOGRAPHY === */<br />
html, body, .mw-body, .mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem;<br />
line-height: 1.1;<br />
}<br />
p, li, td, th { font-size: 1.1rem; line-height: 1.1; }<br />
h1, h2, h3, h4, h5, h6, .firstHeading, .mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
<br />
/* === d*sign week layout === */<br />
:root {<br />
--dw-border: #cfd8e3;<br />
--dw-card-bg: #f8fbff;<br />
}<br />
<br />
/* top ribbon */<br />
.dw-ribbon {<br />
height: 26px;<br />
background: linear-gradient(#8aa9ff, #ffffff);<br />
border-radius: 6px;<br />
margin: 0 0 14px 0;<br />
}<br />
<br />
<br />
.banner {<br />
display: flex;<br />
align-items: center;<br />
justify-content: space-between;<br />
gap: 1.5rem;<br />
padding: 0rem 1rem 0rem 1rem;<br />
text-align: left; /* centers text within its box */<br />
flex-wrap: wrap; <br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
background-size: 100% 200%;<br />
background-position: top;<br />
transition: background-position 0.4s ease-in-out;<br />
}<br />
.banner:hover {<br />
background-position: bottom;<br />
}<br />
<br />
<br />
.banner-icon img { <br />
width: 20vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 650px; /* prevent it from getting too big */ <br />
min-width: 120px; /* prevent it from getting too small */ <br />
padding-left: 2rem;}<br />
<br />
.dw-subtitle {<br />
font-size: 1.5rem;<br />
line-height: 1;<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle-banner {<br />
font-size: 3rem;<br />
}<br />
.dw-subtitle strong {<br />
<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle a {<br />
color: #0000FF !important; /* link color similar to your example */<br />
text-decoration: none;<br />
}<br />
<br />
.dw-subtitle a:hover {<br />
text-decoration: underline;<br />
}<br />
<br />
<br />
/* title & subtitle */<br />
.dw-title {<br />
text-align: center;<br />
line-height: 1.2;<br />
font-size: 2.5rem;<br />
font-weight: 700;<br />
letter-spacing: .02em;<br />
display: block;<br />
}<br />
<br />
<br />
/* grid */<br />
.dw-grid {<br />
display: flex;<br />
flex-wrap: wrap;<br />
gap: 16px;<br />
align-items: flex-start;<br />
margin-top: 14px;<br />
}<br />
.dw-col {<br />
flex: 1 1 520px;<br />
min-width: 320px;<br />
}<br />
<br />
/* cards */<br />
.dw-card {<br />
position: relative;<br />
border: 1px solid #C0C0C0;<br />
background: #FFFFFF !important;<br />
padding: 10px;<br />
margin-bottom: 10px;<br />
}<br />
.dw-card:hover {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 75%, rgba(192, 192, 192, 1) 100%)!important;<br />
}<br />
span.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
<br />
}<br />
<br />
.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 2rem !important; <br />
}<br />
<br />
<br />
.dw-card .dw-row {<br />
display: flex;<br />
flex-wrap: wrap;<br />
align-items: flex-start;<br />
gap: 12px;<br />
width: 100%;<br />
box-sizing: border-box;<br />
padding: 14px; /* ✅ move the spacing here instead of .dw-card */<br />
}<br />
<br />
.dw-card .dw-row > div:last-child {<br />
flex: 1;<br />
min-width: 0; /* ✅ prevents overflow due to long text/links */<br />
}<br />
<br />
.dw-card .dw-icon img { height: auto; }<br />
.dw-card .dw-headline {<br />
display: block;<br />
font-size: 1.5rem;<br />
font-weight: 700;<br />
margin: 0px 0 0px;<br />
}<br />
.dw-card .dw-body { line-height: 1.6; width: 100%;}<br />
.dw-card .dw-body--spacious { line-height: 1.8; }<br />
<br />
<br />
.dw-icon,<br />
.dw-subtitle {<br />
background: transparent !important; /* ✅ makes logo + text boxes transparent */<br />
}<br />
<br />
<br />
/* Code blocks explicitly monospace (so they don't inherit) */<br />
pre, code, kbd, samp, tt, .mw-code {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
text-indent: 0 !important;<br />
}<br />
<br />
/* ===== Remove first-line indentation site-wide ===== */<br />
.mw-parser-output p,<br />
.mw-parser-output li p,<br />
.mw-body-content p,<br />
.dw-card .dw-body p {<br />
text-indent: 0 !important;<br />
}<br />
<br />
<br />
pre {<br />
margin: 0 !important;<br />
padding: 0rem !important; /* add a little inner spacing so text isn’t on the edge */<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);<br />
border: none !important;<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
white-space: pre-wrap !important; /* allows wrapping */<br />
word-break: break-word !important;<br />
line-height: 1 !important;<br />
<br />
}<br />
<br />
.dw-card .pre {<br />
display: block; /* ensures it behaves as a block element */<br />
width: 100% !important;/* takes up the full width of .dw-card */<br />
box-sizing: border-box;/* includes padding/border in width calculation */<br />
margin: 0;<br />
padding: 0;<br />
}<br />
<br />
<br />
div.mw-content-ltr.mw-parser-output {<br />
background: #FFFFFF;<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 97%, rgba(192, 192, 192, 1) 100%);<br />
padding: 1rem;<br />
}<br />
<br />
<br />
<br />
.mw-page-container { <br />
background-image: url("https://dsignweek.servus.at/images/9/9d/Bg-01.png"); background-repeat: repeat-y; <br />
/* ✅ repeat vertically */ background-size: 100% auto; <br />
/* stretch to page width, keep height natural <br />
*/ background-position: center top; <br />
/* start at the top, center horizontally <br />
*/ background-attachment: scroll; <br />
/* move with page scroll */ background-color: #ffffff; /* fallback behind transparent areas */ }<br />
<br />
<br />
div#mw-head {<br />
background: transparent !important;<br />
}<br />
<br />
<br />
.dw-headline, .mw-headline {<br />
margin: 0 !important;<br />
}<br />
<br />
.skin-vector-2022 header.vector-header { box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8)!important; }<br />
<br />
.skin-vector-2022 #vector-sticky-header.vector-sticky-header {<br />
box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8) !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* ===== Mobile: stack card content vertically ===== */<br />
@media (max-width: 720px) {<br />
.mw-page-container { <br />
padding:5px;<br />
}<br />
.header-container.header-chrome {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 75%, rgba(192, 192, 192, 1) 95%);<br />
}<br />
.minerva-footer {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 75%, rgba(192, 192, 192, 1) 95%);<br />
}<br />
<br />
#content.mw-body {<br />
background: linear-gradient(to top, #0000FF, #ffffff) !important; /* blue → white gradient */<br />
}<br />
<br />
.dw-card {<br />
padding:0;}<br />
div#content.mw-body {<br />
padding: 0rem;}<br />
div.mw-content-ltr.mw-parser-output {<br />
padding: 0.5rem;<br />
}<br />
<br />
.banner-icon img { <br />
width: 80vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 650px; /* prevent it from getting too big */ <br />
min-width: 120px; /* prevent it from getting too small */ <br />
padding-left: 0rem;}<br />
<br />
/* Stack everything in a column */<br />
.dw-card .dw-row {<br />
display: flex;<br />
flex-direction: column;<br />
align-items: stretch; /* full width for text block */<br />
gap: 10px;<br />
}<br />
<br />
/* Make the icon its own row and center it */<br />
.dw-card .dw-icon {<br />
display: flex;<br />
justify-content: center;<br />
align-items: center;<br />
margin: 0; /* remove any left/right spacing from desktop */<br />
}<br />
<br />
.dw-card .dw-icon img {<br />
width: 72px; /* tidy mobile size */<br />
height: auto;<br />
}<br />
<br />
/* Ensure the text block fills width */<br />
.dw-card .dw-row > div {<br />
width: 100%;<br />
}<br />
<br />
/* Slight spacing tweaks for headings on mobile */<br />
.dw-card .dw-headline {<br />
margin: 4px 0 4px;<br />
}<br />
<br />
.partner-logos {<br />
display: flex;<br />
flex-wrap: wrap; /* allows wrapping on small screens */<br />
justify-content: space-between !important; <br />
align-items: center!important; <br />
gap: 1.4rem; <br />
padding: 0 1rem 1rem 1rem; /* breathing room top & bottom */<br />
background: transparent;<br />
}<br />
<br />
.partner-logos img {<br />
height: 24px;<br />
width: auto;<br />
object-fit:contain;<br />
}<br />
<br />
}</div>
Ivans
https://dsignweek.servus.at/index.php?title=MediaWiki:Common.css&diff=1424
MediaWiki:Common.css
2025-11-20T14:02:26Z
<p>Ivans: </p>
<hr />
<div>/* CSS placed here will be applied to all skins */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
#footer-info-lastmod {<br />
display: none !important;<br />
}<br />
<br />
/* Vector 2022: align user links (language, username, etc.) to the top */<br />
body.skin-vector-2022 .vector-user-links-main {<br />
display: flex; /* make sure it's flexbox */<br />
align-items: flex-start; /* align children to the top of the div */<br />
}<br />
/* Hide the Translate extension banner ("Translate this page; This page has changes…") */<br />
body.skin-vector-2022 .mw-pt-translate-header {<br />
display: none !important;<br />
}<br />
/* Vector 2022 – hide entire tab/navigation bar (left-navigation) for all users */<br />
.skin-vector-2022 #left-navigation {<br />
display: none !important;<br />
}<br />
/* Vector 2022: right-align items in the page toolbar (Edit / View history / Tools) */<br />
.skin-vector-2022 .vector-page-toolbar-container {<br />
display: flex !important;<br />
justify-content: flex-end !important; /* pushes items to the right */<br />
align-items: center; /* vertical alignment */<br />
}<br />
<br />
<br />
<br />
.mw-anon.skin-vector-2022 #ca-nstab-main, /* page title tab (Main Page / Article) */<br />
.mw-anon.skin-vector-2022 #ca-talk, /* Talk tab */<br />
.mw-anon.skin-vector-2022 #ca-view, /* "Read" tab */<br />
.mw-anon.skin-vector-2022 #ca-history, /* View history */<br />
.mw-anon.skin-vector-2022 #ca-watch,<br />
.mw-anon.skin-vector-2022 #ca-unwatch,<br />
.mw-anon.skin-vector-2022 #ca-more { /* "Tools" dropdown */<br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* === GLOBAL TYPOGRAPHY === */<br />
<br />
/* Base body text — Liberation Sans */<br />
html,<br />
body,<br />
.mw-body,<br />
.mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 1.2rem; /* base = 16px */<br />
line-height: 1.15; <br />
}<br />
<br />
/* Paragraphs and list text */<br />
p, li, td, th {<br />
font-size: 1.1rem; /* slightly larger than base text */<br />
}<br />
<br />
/* === HEADINGS — Linux Libertine === */<br />
h1, h2, h3, h4, h5, h6,<br />
.firstHeading,<br />
.mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
.mw-body h1, .mw-heading1, .mw-body-content h1, .mw-body-content .mw-heading1 { font-size: 3rem; line-height: 1.15; } <br />
<br />
<br />
<br />
/* === SIDEBAR MENU === */<br />
#mw-panel,<br />
.vector-menu-content,<br />
#p-navigation,<br />
#p-tb,<br />
#p-lang {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem; /* sidebar smaller for contrast */<br />
line-height: 1.4;<br />
}<br />
<br />
#mw-panel,<br />
.vector-menu-content {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 90%, rgba(192, 192, 192, 1) 100%);<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
#partner-logos {<br />
display: flex;<br />
justify-content: right;<br />
align-items: right;<br />
flex-wrap: wrap;<br />
gap: 1rem;<br />
margin-top:0.8rem;<br />
<br />
}<br />
<br />
#partner-logos img {<br />
height: 32px;<br />
object-fit: contain; /* keeps aspect ratio, fits within the box */<br />
max-width: 100%; /* prevents overflow */<br />
display: block; /* removes inline gaps below images */<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
.wikitable.custom-table {<br />
width: 100%;<br />
border-collapse: separate;<br />
border-spacing: 0;<br />
border: none;<br />
background-color: #fff;<br />
border-radius: 0.5rem;<br />
overflow: hidden; /* so rounded corners clip correctly */<br />
font-size: 0.95rem;<br />
}<br />
<br />
<br />
<br />
/* Header cells */<br />
.wikitable.custom-table th {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
color: #000;<br />
font-weight: 600;<br />
text-align: left;<br />
padding: 0.75rem 1rem;<br />
border-bottom: 2px solid #d0d9ff;<br />
}<br />
<br />
/* Data cells */<br />
.wikitable.custom-table td {<br />
padding: 0.65rem 1rem;<br />
border-bottom: 1px solid #eee;<br />
}<br />
<br />
/* Zebra striping */<br />
.wikitable.custom-table tr:nth-child(even) td {<br />
background-color: #f9fbff;<br />
}<br />
<br />
/* Hover effect */<br />
.wikitable.custom-table tr:hover td {<br />
background: #FFF;<br />
background: linear-gradient(0deg,rgba(0, 0, 255, 1) 0%, rgba(255, 255, 255, 1) 15%, rgba(255, 255, 255, 1) 85%, rgba(0, 0, 255, 1) 100%);<br />
}<br />
<br />
/* Rounded corners for first & last rows */<br />
.wikitable.custom-table tr:first-child th:first-child {<br />
border-top-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:first-child th:last-child {<br />
border-top-right-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:first-child {<br />
border-bottom-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:last-child {<br />
border-bottom-right-radius: 0.5rem;<br />
}<br />
<br />
<br />
/* === Mobile Responsive Tables (no HTML change needed) === */<br />
@media (max-width: 768px) {<br />
<br />
/* Allow horizontal scrolling on narrow screens */<br />
.wikitable.custom-table {<br />
display: block;<br />
width: 100%;<br />
overflow-x: auto;<br />
-webkit-overflow-scrolling: touch;<br />
}<br />
<br />
/* Prevent collapsing/squeezing of long cell content */<br />
.wikitable.custom-table tr,<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
white-space: nowrap;<br />
}<br />
<br />
/* Optional: slightly reduce padding for small screens */<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
padding: 0.5rem 0.75rem;<br />
}<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* Hide the automatic Tools and Special pages sections */<br />
#p-tb { <br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* MAIN-PAGE */<br />
<br />
/* === FONTS (yours) === */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
.mw-pt-languages {<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);}<br />
/* === GLOBAL TYPOGRAPHY === */<br />
html, body, .mw-body, .mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem;<br />
line-height: 1.1;<br />
}<br />
p, li, td, th { font-size: 1.1rem; line-height: 1.1; }<br />
h1, h2, h3, h4, h5, h6, .firstHeading, .mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
<br />
/* === d*sign week layout === */<br />
:root {<br />
--dw-border: #cfd8e3;<br />
--dw-card-bg: #f8fbff;<br />
}<br />
<br />
/* top ribbon */<br />
.dw-ribbon {<br />
height: 26px;<br />
background: linear-gradient(#8aa9ff, #ffffff);<br />
border-radius: 6px;<br />
margin: 0 0 14px 0;<br />
}<br />
<br />
<br />
.banner {<br />
display: flex;<br />
align-items: center;<br />
justify-content: space-between;<br />
gap: 1.5rem;<br />
padding: 0rem 1rem 0rem 1rem;<br />
text-align: left; /* centers text within its box */<br />
flex-wrap: wrap; <br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
background-size: 100% 200%;<br />
background-position: top;<br />
transition: background-position 0.4s ease-in-out;<br />
}<br />
.banner:hover {<br />
background-position: bottom;<br />
}<br />
<br />
<br />
.banner-icon img { <br />
width: 20vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 650px; /* prevent it from getting too big */ <br />
min-width: 120px; /* prevent it from getting too small */ <br />
padding-left: 2rem;}<br />
<br />
.dw-subtitle {<br />
font-size: 1.5rem;<br />
line-height: 1;<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle-banner {<br />
font-size: 3rem;<br />
}<br />
.dw-subtitle strong {<br />
<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle a {<br />
color: #0000FF !important; /* link color similar to your example */<br />
text-decoration: none;<br />
}<br />
<br />
.dw-subtitle a:hover {<br />
text-decoration: underline;<br />
}<br />
<br />
<br />
/* title & subtitle */<br />
.dw-title {<br />
text-align: center;<br />
line-height: 1.2;<br />
font-size: 2.5rem;<br />
font-weight: 700;<br />
letter-spacing: .02em;<br />
display: block;<br />
}<br />
<br />
<br />
/* grid */<br />
.dw-grid {<br />
display: flex;<br />
flex-wrap: wrap;<br />
gap: 16px;<br />
align-items: flex-start;<br />
margin-top: 14px;<br />
}<br />
.dw-col {<br />
flex: 1 1 520px;<br />
min-width: 320px;<br />
}<br />
<br />
/* cards */<br />
.dw-card {<br />
position: relative;<br />
border: 1px solid #C0C0C0;<br />
background: #FFFFFF !important;<br />
padding: 10px;<br />
margin-bottom: 10px;<br />
}<br />
.dw-card:hover {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 75%, rgba(192, 192, 192, 1) 100%)!important;<br />
}<br />
span.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
<br />
}<br />
<br />
.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 2rem !important; <br />
}<br />
<br />
<br />
.dw-card .dw-row {<br />
display: flex;<br />
flex-wrap: wrap;<br />
align-items: flex-start;<br />
gap: 12px;<br />
width: 100%;<br />
box-sizing: border-box;<br />
padding: 14px; /* ✅ move the spacing here instead of .dw-card */<br />
}<br />
<br />
.dw-card .dw-row > div:last-child {<br />
flex: 1;<br />
min-width: 0; /* ✅ prevents overflow due to long text/links */<br />
}<br />
<br />
.dw-card .dw-icon img { height: auto; }<br />
.dw-card .dw-headline {<br />
display: block;<br />
font-size: 1.5rem;<br />
font-weight: 700;<br />
margin: 0px 0 0px;<br />
}<br />
.dw-card .dw-body { line-height: 1.6; width: 100%;}<br />
.dw-card .dw-body--spacious { line-height: 1.8; }<br />
<br />
<br />
.dw-icon,<br />
.dw-subtitle {<br />
background: transparent !important; /* ✅ makes logo + text boxes transparent */<br />
}<br />
<br />
<br />
/* Code blocks explicitly monospace (so they don't inherit) */<br />
pre, code, kbd, samp, tt, .mw-code {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
text-indent: 0 !important;<br />
}<br />
<br />
/* ===== Remove first-line indentation site-wide ===== */<br />
.mw-parser-output p,<br />
.mw-parser-output li p,<br />
.mw-body-content p,<br />
.dw-card .dw-body p {<br />
text-indent: 0 !important;<br />
}<br />
<br />
<br />
pre {<br />
margin: 0 !important;<br />
padding: 0rem !important; /* add a little inner spacing so text isn’t on the edge */<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);<br />
border: none !important;<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
white-space: pre-wrap !important; /* allows wrapping */<br />
word-break: break-word !important;<br />
line-height: 1 !important;<br />
<br />
}<br />
<br />
.dw-card .pre {<br />
display: block; /* ensures it behaves as a block element */<br />
width: 100% !important;/* takes up the full width of .dw-card */<br />
box-sizing: border-box;/* includes padding/border in width calculation */<br />
margin: 0;<br />
padding: 0;<br />
}<br />
<br />
<br />
div.mw-content-ltr.mw-parser-output {<br />
background: #FFFFFF;<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 97%, rgba(192, 192, 192, 1) 100%);<br />
padding: 1rem;<br />
}<br />
<br />
<br />
<br />
.mw-page-container { <br />
background-image: url("https://dsignweek.servus.at/images/9/9d/Bg-01.png"); background-repeat: repeat-y; <br />
/* ✅ repeat vertically */ background-size: 100% auto; <br />
/* stretch to page width, keep height natural <br />
*/ background-position: center top; <br />
/* start at the top, center horizontally <br />
*/ background-attachment: scroll; <br />
/* move with page scroll */ background-color: #ffffff; /* fallback behind transparent areas */ }<br />
<br />
<br />
div#mw-head {<br />
background: transparent !important;<br />
}<br />
<br />
<br />
.dw-headline, .mw-headline {<br />
margin: 0 !important;<br />
}<br />
<br />
.skin-vector-2022 header.vector-header { box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8)!important; }<br />
<br />
.skin-vector-2022 #vector-sticky-header.vector-sticky-header {<br />
box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8) !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* ===== Mobile: stack card content vertically ===== */<br />
@media (max-width: 720px) {<br />
<br />
.header-container.header-chrome {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 75%, rgba(192, 192, 192, 1) 95%);<br />
}<br />
.minerva-footer {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 75%, rgba(192, 192, 192, 1) 95%);<br />
}<br />
<br />
#content.mw-body {<br />
background: linear-gradient(to top, #0000FF, #ffffff) !important; /* blue → white gradient */<br />
}<br />
<br />
.dw-card {<br />
padding:0;}<br />
div#content.mw-body {<br />
padding: 0rem;}<br />
div.mw-content-ltr.mw-parser-output {<br />
padding: 0.5rem;<br />
}<br />
<br />
.banner-icon img { <br />
width: 80vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 650px; /* prevent it from getting too big */ <br />
min-width: 120px; /* prevent it from getting too small */ <br />
padding-left: 0rem;}<br />
<br />
/* Stack everything in a column */<br />
.dw-card .dw-row {<br />
display: flex;<br />
flex-direction: column;<br />
align-items: stretch; /* full width for text block */<br />
gap: 10px;<br />
}<br />
<br />
/* Make the icon its own row and center it */<br />
.dw-card .dw-icon {<br />
display: flex;<br />
justify-content: center;<br />
align-items: center;<br />
margin: 0; /* remove any left/right spacing from desktop */<br />
}<br />
<br />
.dw-card .dw-icon img {<br />
width: 72px; /* tidy mobile size */<br />
height: auto;<br />
}<br />
<br />
/* Ensure the text block fills width */<br />
.dw-card .dw-row > div {<br />
width: 100%;<br />
}<br />
<br />
/* Slight spacing tweaks for headings on mobile */<br />
.dw-card .dw-headline {<br />
margin: 4px 0 4px;<br />
}<br />
<br />
.partner-logos {<br />
display: flex;<br />
flex-wrap: wrap; /* allows wrapping on small screens */<br />
justify-content: space-between !important; <br />
align-items: center!important; <br />
gap: 1.4rem; <br />
padding: 0 1rem 1rem 1rem; /* breathing room top & bottom */<br />
background: transparent;<br />
}<br />
<br />
.partner-logos img {<br />
height: 24px;<br />
width: auto;<br />
object-fit:contain;<br />
}<br />
<br />
}</div>
Ivans
https://dsignweek.servus.at/index.php?title=MediaWiki:Common.css&diff=1423
MediaWiki:Common.css
2025-11-20T14:01:15Z
<p>Ivans: </p>
<hr />
<div>/* CSS placed here will be applied to all skins */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
#footer-info-lastmod {<br />
display: none !important;<br />
}<br />
<br />
/* Vector 2022: align user links (language, username, etc.) to the top */<br />
body.skin-vector-2022 .vector-user-links-main {<br />
display: flex; /* make sure it's flexbox */<br />
align-items: flex-start; /* align children to the top of the div */<br />
}<br />
/* Hide the Translate extension banner ("Translate this page; This page has changes…") */<br />
body.skin-vector-2022 .mw-pt-translate-header {<br />
display: none !important;<br />
}<br />
/* Vector 2022 – hide entire tab/navigation bar (left-navigation) for all users */<br />
.skin-vector-2022 #left-navigation {<br />
display: none !important;<br />
}<br />
/* Vector 2022: right-align items in the page toolbar (Edit / View history / Tools) */<br />
.skin-vector-2022 .vector-page-toolbar-container {<br />
display: flex !important;<br />
justify-content: flex-end !important; /* pushes items to the right */<br />
align-items: center; /* vertical alignment */<br />
}<br />
<br />
<br />
<br />
.mw-anon.skin-vector-2022 #ca-nstab-main, /* page title tab (Main Page / Article) */<br />
.mw-anon.skin-vector-2022 #ca-talk, /* Talk tab */<br />
.mw-anon.skin-vector-2022 #ca-view, /* "Read" tab */<br />
.mw-anon.skin-vector-2022 #ca-history, /* View history */<br />
.mw-anon.skin-vector-2022 #ca-watch,<br />
.mw-anon.skin-vector-2022 #ca-unwatch,<br />
.mw-anon.skin-vector-2022 #ca-more { /* "Tools" dropdown */<br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* === GLOBAL TYPOGRAPHY === */<br />
<br />
/* Base body text — Liberation Sans */<br />
html,<br />
body,<br />
.mw-body,<br />
.mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 1.2rem; /* base = 16px */<br />
line-height: 1.15; <br />
}<br />
<br />
/* Paragraphs and list text */<br />
p, li, td, th {<br />
font-size: 1.1rem; /* slightly larger than base text */<br />
}<br />
<br />
/* === HEADINGS — Linux Libertine === */<br />
h1, h2, h3, h4, h5, h6,<br />
.firstHeading,<br />
.mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
.mw-body h1, .mw-heading1, .mw-body-content h1, .mw-body-content .mw-heading1 { font-size: 3rem; line-height: 1.15; } <br />
<br />
<br />
<br />
/* === SIDEBAR MENU === */<br />
#mw-panel,<br />
.vector-menu-content,<br />
#p-navigation,<br />
#p-tb,<br />
#p-lang {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem; /* sidebar smaller for contrast */<br />
line-height: 1.4;<br />
}<br />
<br />
#mw-panel,<br />
.vector-menu-content {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 90%, rgba(192, 192, 192, 1) 100%);<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
#partner-logos {<br />
display: flex;<br />
justify-content: right;<br />
align-items: right;<br />
flex-wrap: wrap;<br />
gap: 1rem;<br />
margin-top:0.8rem;<br />
<br />
}<br />
<br />
#partner-logos img {<br />
height: 32px;<br />
object-fit: contain; /* keeps aspect ratio, fits within the box */<br />
max-width: 100%; /* prevents overflow */<br />
display: block; /* removes inline gaps below images */<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
.wikitable.custom-table {<br />
width: 100%;<br />
border-collapse: separate;<br />
border-spacing: 0;<br />
border: none;<br />
background-color: #fff;<br />
border-radius: 0.5rem;<br />
overflow: hidden; /* so rounded corners clip correctly */<br />
font-size: 0.95rem;<br />
}<br />
<br />
<br />
<br />
/* Header cells */<br />
.wikitable.custom-table th {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
color: #000;<br />
font-weight: 600;<br />
text-align: left;<br />
padding: 0.75rem 1rem;<br />
border-bottom: 2px solid #d0d9ff;<br />
}<br />
<br />
/* Data cells */<br />
.wikitable.custom-table td {<br />
padding: 0.65rem 1rem;<br />
border-bottom: 1px solid #eee;<br />
}<br />
<br />
/* Zebra striping */<br />
.wikitable.custom-table tr:nth-child(even) td {<br />
background-color: #f9fbff;<br />
}<br />
<br />
/* Hover effect */<br />
.wikitable.custom-table tr:hover td {<br />
background: #FFF;<br />
background: linear-gradient(0deg,rgba(0, 0, 255, 1) 0%, rgba(255, 255, 255, 1) 15%, rgba(255, 255, 255, 1) 85%, rgba(0, 0, 255, 1) 100%);<br />
}<br />
<br />
/* Rounded corners for first & last rows */<br />
.wikitable.custom-table tr:first-child th:first-child {<br />
border-top-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:first-child th:last-child {<br />
border-top-right-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:first-child {<br />
border-bottom-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:last-child {<br />
border-bottom-right-radius: 0.5rem;<br />
}<br />
<br />
<br />
/* === Mobile Responsive Tables (no HTML change needed) === */<br />
@media (max-width: 768px) {<br />
<br />
/* Allow horizontal scrolling on narrow screens */<br />
.wikitable.custom-table {<br />
display: block;<br />
width: 100%;<br />
overflow-x: auto;<br />
-webkit-overflow-scrolling: touch;<br />
}<br />
<br />
/* Prevent collapsing/squeezing of long cell content */<br />
.wikitable.custom-table tr,<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
white-space: nowrap;<br />
}<br />
<br />
/* Optional: slightly reduce padding for small screens */<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
padding: 0.5rem 0.75rem;<br />
}<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* Hide the automatic Tools and Special pages sections */<br />
#p-tb { <br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* MAIN-PAGE */<br />
<br />
/* === FONTS (yours) === */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
.mw-pt-languages {<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);}<br />
/* === GLOBAL TYPOGRAPHY === */<br />
html, body, .mw-body, .mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem;<br />
line-height: 1.1;<br />
}<br />
p, li, td, th { font-size: 1.1rem; line-height: 1.1; }<br />
h1, h2, h3, h4, h5, h6, .firstHeading, .mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
<br />
/* === d*sign week layout === */<br />
:root {<br />
--dw-border: #cfd8e3;<br />
--dw-card-bg: #f8fbff;<br />
}<br />
<br />
/* top ribbon */<br />
.dw-ribbon {<br />
height: 26px;<br />
background: linear-gradient(#8aa9ff, #ffffff);<br />
border-radius: 6px;<br />
margin: 0 0 14px 0;<br />
}<br />
<br />
<br />
.banner {<br />
display: flex;<br />
align-items: center;<br />
justify-content: space-between;<br />
gap: 1.5rem;<br />
padding: 0rem 1rem 0rem 1rem;<br />
text-align: left; /* centers text within its box */<br />
flex-wrap: wrap; <br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
background-size: 100% 200%;<br />
background-position: top;<br />
transition: background-position 0.4s ease-in-out;<br />
}<br />
.banner:hover {<br />
background-position: bottom;<br />
}<br />
<br />
<br />
.banner-icon img { <br />
width: 20vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 650px; /* prevent it from getting too big */ <br />
min-width: 120px; /* prevent it from getting too small */ <br />
padding-left: 2rem;}<br />
<br />
.dw-subtitle {<br />
font-size: 1.5rem;<br />
line-height: 1;<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle-banner {<br />
font-size: 3rem;<br />
}<br />
.dw-subtitle strong {<br />
<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle a {<br />
color: #0000FF !important; /* link color similar to your example */<br />
text-decoration: none;<br />
}<br />
<br />
.dw-subtitle a:hover {<br />
text-decoration: underline;<br />
}<br />
<br />
<br />
/* title & subtitle */<br />
.dw-title {<br />
text-align: center;<br />
line-height: 1.2;<br />
font-size: 2.5rem;<br />
font-weight: 700;<br />
letter-spacing: .02em;<br />
display: block;<br />
}<br />
<br />
<br />
/* grid */<br />
.dw-grid {<br />
display: flex;<br />
flex-wrap: wrap;<br />
gap: 16px;<br />
align-items: flex-start;<br />
margin-top: 14px;<br />
}<br />
.dw-col {<br />
flex: 1 1 520px;<br />
min-width: 320px;<br />
}<br />
<br />
/* cards */<br />
.dw-card {<br />
position: relative;<br />
border: 1px solid #C0C0C0;<br />
background: #FFFFFF !important;<br />
padding: 10px;<br />
margin-bottom: 10px;<br />
}<br />
.dw-card:hover {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 75%, rgba(192, 192, 192, 1) 100%)!important;<br />
}<br />
span.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
<br />
}<br />
<br />
.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 2rem !important; <br />
}<br />
<br />
<br />
.dw-card .dw-row {<br />
display: flex;<br />
flex-wrap: wrap;<br />
align-items: flex-start;<br />
gap: 12px;<br />
width: 100%;<br />
box-sizing: border-box;<br />
padding: 14px; /* ✅ move the spacing here instead of .dw-card */<br />
}<br />
<br />
.dw-card .dw-row > div:last-child {<br />
flex: 1;<br />
min-width: 0; /* ✅ prevents overflow due to long text/links */<br />
}<br />
<br />
.dw-card .dw-icon img { height: auto; }<br />
.dw-card .dw-headline {<br />
display: block;<br />
font-size: 1.5rem;<br />
font-weight: 700;<br />
margin: 0px 0 0px;<br />
}<br />
.dw-card .dw-body { line-height: 1.6; width: 100%;}<br />
.dw-card .dw-body--spacious { line-height: 1.8; }<br />
<br />
<br />
.dw-icon,<br />
.dw-subtitle {<br />
background: transparent !important; /* ✅ makes logo + text boxes transparent */<br />
}<br />
<br />
<br />
/* Code blocks explicitly monospace (so they don't inherit) */<br />
pre, code, kbd, samp, tt, .mw-code {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
text-indent: 0 !important;<br />
}<br />
<br />
/* ===== Remove first-line indentation site-wide ===== */<br />
.mw-parser-output p,<br />
.mw-parser-output li p,<br />
.mw-body-content p,<br />
.dw-card .dw-body p {<br />
text-indent: 0 !important;<br />
}<br />
<br />
<br />
pre {<br />
margin: 0 !important;<br />
padding: 0rem !important; /* add a little inner spacing so text isn’t on the edge */<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);<br />
border: none !important;<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
white-space: pre-wrap !important; /* allows wrapping */<br />
word-break: break-word !important;<br />
line-height: 1 !important;<br />
<br />
}<br />
<br />
.dw-card .pre {<br />
display: block; /* ensures it behaves as a block element */<br />
width: 100% !important;/* takes up the full width of .dw-card */<br />
box-sizing: border-box;/* includes padding/border in width calculation */<br />
margin: 0;<br />
padding: 0;<br />
}<br />
<br />
<br />
div.mw-content-ltr.mw-parser-output {<br />
background: #FFFFFF;<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 97%, rgba(192, 192, 192, 1) 100%);<br />
padding: 1rem;<br />
}<br />
<br />
<br />
<br />
.mw-page-container {<br />
/* 1️⃣ TOP layer: gradient */<br />
background-image:<br />
linear-gradient(<br />
0deg,<br />
rgba(0, 0, 255, 1) 0%,<br />
rgba(255, 255, 255, 0) 25%<br />
),<br />
/* 2️⃣ BOTTOM layer: your image */<br />
url("https://dsignweek.servus.at/images/9/9d/Bg-01.png");<br />
<br />
background-repeat:<br />
no-repeat, /* gradient */<br />
repeat-y; /* image */<br />
<br />
background-size:<br />
100% 200px, /* gradient height (adjust!) */<br />
100% auto; /* image full width, natural height */<br />
<br />
background-position:<br />
top center, /* gradient at top */<br />
top center; /* image at top */<br />
<br />
background-color: #ffffff; /* fallback */<br />
}<br />
<br />
<br />
div#mw-head {<br />
background: transparent !important;<br />
}<br />
<br />
<br />
.dw-headline, .mw-headline {<br />
margin: 0 !important;<br />
}<br />
<br />
.skin-vector-2022 header.vector-header { box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8)!important; }<br />
<br />
.skin-vector-2022 #vector-sticky-header.vector-sticky-header {<br />
box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8) !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* ===== Mobile: stack card content vertically ===== */<br />
@media (max-width: 720px) {<br />
<br />
.header-container.header-chrome {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 75%, rgba(192, 192, 192, 1) 95%);<br />
}<br />
.minerva-footer {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 75%, rgba(192, 192, 192, 1) 95%);<br />
}<br />
<br />
#content.mw-body {<br />
background: linear-gradient(to top, #0000FF, #ffffff) !important; /* blue → white gradient */<br />
}<br />
<br />
.dw-card {<br />
padding:0;}<br />
div#content.mw-body {<br />
padding: 0rem;}<br />
div.mw-content-ltr.mw-parser-output {<br />
padding: 0.5rem;<br />
}<br />
<br />
.banner-icon img { <br />
width: 80vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 650px; /* prevent it from getting too big */ <br />
min-width: 120px; /* prevent it from getting too small */ <br />
padding-left: 0rem;}<br />
<br />
/* Stack everything in a column */<br />
.dw-card .dw-row {<br />
display: flex;<br />
flex-direction: column;<br />
align-items: stretch; /* full width for text block */<br />
gap: 10px;<br />
}<br />
<br />
/* Make the icon its own row and center it */<br />
.dw-card .dw-icon {<br />
display: flex;<br />
justify-content: center;<br />
align-items: center;<br />
margin: 0; /* remove any left/right spacing from desktop */<br />
}<br />
<br />
.dw-card .dw-icon img {<br />
width: 72px; /* tidy mobile size */<br />
height: auto;<br />
}<br />
<br />
/* Ensure the text block fills width */<br />
.dw-card .dw-row > div {<br />
width: 100%;<br />
}<br />
<br />
/* Slight spacing tweaks for headings on mobile */<br />
.dw-card .dw-headline {<br />
margin: 4px 0 4px;<br />
}<br />
<br />
.partner-logos {<br />
display: flex;<br />
flex-wrap: wrap; /* allows wrapping on small screens */<br />
justify-content: space-between !important; <br />
align-items: center!important; <br />
gap: 1.4rem; <br />
padding: 0 1rem 1rem 1rem; /* breathing room top & bottom */<br />
background: transparent;<br />
}<br />
<br />
.partner-logos img {<br />
height: 24px;<br />
width: auto;<br />
object-fit:contain;<br />
}<br />
<br />
}</div>
Ivans
https://dsignweek.servus.at/index.php?title=MediaWiki:Common.css&diff=1422
MediaWiki:Common.css
2025-11-20T13:59:07Z
<p>Ivans: </p>
<hr />
<div>/* CSS placed here will be applied to all skins */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
#footer-info-lastmod {<br />
display: none !important;<br />
}<br />
<br />
/* Vector 2022: align user links (language, username, etc.) to the top */<br />
body.skin-vector-2022 .vector-user-links-main {<br />
display: flex; /* make sure it's flexbox */<br />
align-items: flex-start; /* align children to the top of the div */<br />
}<br />
/* Hide the Translate extension banner ("Translate this page; This page has changes…") */<br />
body.skin-vector-2022 .mw-pt-translate-header {<br />
display: none !important;<br />
}<br />
/* Vector 2022 – hide entire tab/navigation bar (left-navigation) for all users */<br />
.skin-vector-2022 #left-navigation {<br />
display: none !important;<br />
}<br />
/* Vector 2022: right-align items in the page toolbar (Edit / View history / Tools) */<br />
.skin-vector-2022 .vector-page-toolbar-container {<br />
display: flex !important;<br />
justify-content: flex-end !important; /* pushes items to the right */<br />
align-items: center; /* vertical alignment */<br />
}<br />
<br />
<br />
<br />
.mw-anon.skin-vector-2022 #ca-nstab-main, /* page title tab (Main Page / Article) */<br />
.mw-anon.skin-vector-2022 #ca-talk, /* Talk tab */<br />
.mw-anon.skin-vector-2022 #ca-view, /* "Read" tab */<br />
.mw-anon.skin-vector-2022 #ca-history, /* View history */<br />
.mw-anon.skin-vector-2022 #ca-watch,<br />
.mw-anon.skin-vector-2022 #ca-unwatch,<br />
.mw-anon.skin-vector-2022 #ca-more { /* "Tools" dropdown */<br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* === GLOBAL TYPOGRAPHY === */<br />
<br />
/* Base body text — Liberation Sans */<br />
html,<br />
body,<br />
.mw-body,<br />
.mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 1.2rem; /* base = 16px */<br />
line-height: 1.15; <br />
}<br />
<br />
/* Paragraphs and list text */<br />
p, li, td, th {<br />
font-size: 1.1rem; /* slightly larger than base text */<br />
}<br />
<br />
/* === HEADINGS — Linux Libertine === */<br />
h1, h2, h3, h4, h5, h6,<br />
.firstHeading,<br />
.mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
.mw-body h1, .mw-heading1, .mw-body-content h1, .mw-body-content .mw-heading1 { font-size: 3rem; line-height: 1.15; } <br />
<br />
<br />
<br />
/* === SIDEBAR MENU === */<br />
#mw-panel,<br />
.vector-menu-content,<br />
#p-navigation,<br />
#p-tb,<br />
#p-lang {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem; /* sidebar smaller for contrast */<br />
line-height: 1.4;<br />
}<br />
<br />
#mw-panel,<br />
.vector-menu-content {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 90%, rgba(192, 192, 192, 1) 100%);<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
#partner-logos {<br />
display: flex;<br />
justify-content: right;<br />
align-items: right;<br />
flex-wrap: wrap;<br />
gap: 1rem;<br />
margin-top:0.8rem;<br />
<br />
}<br />
<br />
#partner-logos img {<br />
height: 32px;<br />
object-fit: contain; /* keeps aspect ratio, fits within the box */<br />
max-width: 100%; /* prevents overflow */<br />
display: block; /* removes inline gaps below images */<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
.wikitable.custom-table {<br />
width: 100%;<br />
border-collapse: separate;<br />
border-spacing: 0;<br />
border: none;<br />
background-color: #fff;<br />
border-radius: 0.5rem;<br />
overflow: hidden; /* so rounded corners clip correctly */<br />
font-size: 0.95rem;<br />
}<br />
<br />
<br />
<br />
/* Header cells */<br />
.wikitable.custom-table th {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
color: #000;<br />
font-weight: 600;<br />
text-align: left;<br />
padding: 0.75rem 1rem;<br />
border-bottom: 2px solid #d0d9ff;<br />
}<br />
<br />
/* Data cells */<br />
.wikitable.custom-table td {<br />
padding: 0.65rem 1rem;<br />
border-bottom: 1px solid #eee;<br />
}<br />
<br />
/* Zebra striping */<br />
.wikitable.custom-table tr:nth-child(even) td {<br />
background-color: #f9fbff;<br />
}<br />
<br />
/* Hover effect */<br />
.wikitable.custom-table tr:hover td {<br />
background: #FFF;<br />
background: linear-gradient(0deg,rgba(0, 0, 255, 1) 0%, rgba(255, 255, 255, 1) 15%, rgba(255, 255, 255, 1) 85%, rgba(0, 0, 255, 1) 100%);<br />
}<br />
<br />
/* Rounded corners for first & last rows */<br />
.wikitable.custom-table tr:first-child th:first-child {<br />
border-top-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:first-child th:last-child {<br />
border-top-right-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:first-child {<br />
border-bottom-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:last-child {<br />
border-bottom-right-radius: 0.5rem;<br />
}<br />
<br />
<br />
/* === Mobile Responsive Tables (no HTML change needed) === */<br />
@media (max-width: 768px) {<br />
<br />
/* Allow horizontal scrolling on narrow screens */<br />
.wikitable.custom-table {<br />
display: block;<br />
width: 100%;<br />
overflow-x: auto;<br />
-webkit-overflow-scrolling: touch;<br />
}<br />
<br />
/* Prevent collapsing/squeezing of long cell content */<br />
.wikitable.custom-table tr,<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
white-space: nowrap;<br />
}<br />
<br />
/* Optional: slightly reduce padding for small screens */<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
padding: 0.5rem 0.75rem;<br />
}<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* Hide the automatic Tools and Special pages sections */<br />
#p-tb { <br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* MAIN-PAGE */<br />
<br />
/* === FONTS (yours) === */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
.mw-pt-languages {<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);}<br />
/* === GLOBAL TYPOGRAPHY === */<br />
html, body, .mw-body, .mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem;<br />
line-height: 1.1;<br />
}<br />
p, li, td, th { font-size: 1.1rem; line-height: 1.1; }<br />
h1, h2, h3, h4, h5, h6, .firstHeading, .mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
<br />
/* === d*sign week layout === */<br />
:root {<br />
--dw-border: #cfd8e3;<br />
--dw-card-bg: #f8fbff;<br />
}<br />
<br />
/* top ribbon */<br />
.dw-ribbon {<br />
height: 26px;<br />
background: linear-gradient(#8aa9ff, #ffffff);<br />
border-radius: 6px;<br />
margin: 0 0 14px 0;<br />
}<br />
<br />
<br />
.banner {<br />
display: flex;<br />
align-items: center;<br />
justify-content: space-between;<br />
gap: 1.5rem;<br />
padding: 0rem 1rem 0rem 1rem;<br />
text-align: left; /* centers text within its box */<br />
flex-wrap: wrap; <br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
background-size: 100% 200%;<br />
background-position: top;<br />
transition: background-position 0.4s ease-in-out;<br />
}<br />
.banner:hover {<br />
background-position: bottom;<br />
}<br />
<br />
<br />
.banner-icon img { <br />
width: 20vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 650px; /* prevent it from getting too big */ <br />
min-width: 120px; /* prevent it from getting too small */ <br />
padding-left: 2rem;}<br />
<br />
.dw-subtitle {<br />
font-size: 1.5rem;<br />
line-height: 1;<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle-banner {<br />
font-size: 3rem;<br />
}<br />
.dw-subtitle strong {<br />
<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle a {<br />
color: #0000FF !important; /* link color similar to your example */<br />
text-decoration: none;<br />
}<br />
<br />
.dw-subtitle a:hover {<br />
text-decoration: underline;<br />
}<br />
<br />
<br />
/* title & subtitle */<br />
.dw-title {<br />
text-align: center;<br />
line-height: 1.2;<br />
font-size: 2.5rem;<br />
font-weight: 700;<br />
letter-spacing: .02em;<br />
display: block;<br />
}<br />
<br />
<br />
/* grid */<br />
.dw-grid {<br />
display: flex;<br />
flex-wrap: wrap;<br />
gap: 16px;<br />
align-items: flex-start;<br />
margin-top: 14px;<br />
}<br />
.dw-col {<br />
flex: 1 1 520px;<br />
min-width: 320px;<br />
}<br />
<br />
/* cards */<br />
.dw-card {<br />
position: relative;<br />
border: 1px solid #C0C0C0;<br />
background: #FFFFFF !important;<br />
padding: 10px;<br />
margin-bottom: 10px;<br />
}<br />
.dw-card:hover {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 75%, rgba(192, 192, 192, 1) 100%)!important;<br />
}<br />
span.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
<br />
}<br />
<br />
.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 2rem !important; <br />
}<br />
<br />
<br />
.dw-card .dw-row {<br />
display: flex;<br />
flex-wrap: wrap;<br />
align-items: flex-start;<br />
gap: 12px;<br />
width: 100%;<br />
box-sizing: border-box;<br />
padding: 14px; /* ✅ move the spacing here instead of .dw-card */<br />
}<br />
<br />
.dw-card .dw-row > div:last-child {<br />
flex: 1;<br />
min-width: 0; /* ✅ prevents overflow due to long text/links */<br />
}<br />
<br />
.dw-card .dw-icon img { height: auto; }<br />
.dw-card .dw-headline {<br />
display: block;<br />
font-size: 1.5rem;<br />
font-weight: 700;<br />
margin: 0px 0 0px;<br />
}<br />
.dw-card .dw-body { line-height: 1.6; width: 100%;}<br />
.dw-card .dw-body--spacious { line-height: 1.8; }<br />
<br />
<br />
.dw-icon,<br />
.dw-subtitle {<br />
background: transparent !important; /* ✅ makes logo + text boxes transparent */<br />
}<br />
<br />
<br />
/* Code blocks explicitly monospace (so they don't inherit) */<br />
pre, code, kbd, samp, tt, .mw-code {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
text-indent: 0 !important;<br />
}<br />
<br />
/* ===== Remove first-line indentation site-wide ===== */<br />
.mw-parser-output p,<br />
.mw-parser-output li p,<br />
.mw-body-content p,<br />
.dw-card .dw-body p {<br />
text-indent: 0 !important;<br />
}<br />
<br />
<br />
pre {<br />
margin: 0 !important;<br />
padding: 0rem !important; /* add a little inner spacing so text isn’t on the edge */<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);<br />
border: none !important;<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
white-space: pre-wrap !important; /* allows wrapping */<br />
word-break: break-word !important;<br />
line-height: 1 !important;<br />
<br />
}<br />
<br />
.dw-card .pre {<br />
display: block; /* ensures it behaves as a block element */<br />
width: 100% !important;/* takes up the full width of .dw-card */<br />
box-sizing: border-box;/* includes padding/border in width calculation */<br />
margin: 0;<br />
padding: 0;<br />
}<br />
<br />
<br />
div.mw-content-ltr.mw-parser-output {<br />
background: #FFFFFF;<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 97%, rgba(192, 192, 192, 1) 100%);<br />
padding: 1rem;<br />
}<br />
<br />
<br />
<br />
.mw-page-container {<br />
background-image: url("https://dsignweek.servus.at/images/9/9d/Bg-01.png");<br />
background-repeat: repeat-y; /* ✅ repeat vertically */<br />
background-size: 100% auto; /* stretch to page width, keep height natural */<br />
background-position: center top; /* start at the top, center horizontally */<br />
background-attachment: scroll; /* move with page scroll */<br />
background-color: #ffffff; /* fallback behind transparent areas */<br />
}<br />
<br />
div#mw-head {<br />
background: transparent !important;<br />
}<br />
<br />
<br />
.dw-headline, .mw-headline {<br />
margin: 0 !important;<br />
}<br />
<br />
.skin-vector-2022 header.vector-header { box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8)!important; }<br />
<br />
.skin-vector-2022 #vector-sticky-header.vector-sticky-header {<br />
box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8) !important;<br />
}<br />
<br />
/* Gradient background at the top of the page content area */ <br />
.skin-vector-2022 .mw-page-container-inner { <br />
background: linear-gradient( 0deg, rgba(0, 0, 255, 1) 0%, rgba(255, 255, 255, 0) 15% ) !important; }<br />
<br />
/* ===== Mobile: stack card content vertically ===== */<br />
@media (max-width: 720px) {<br />
<br />
.header-container.header-chrome {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 75%, rgba(192, 192, 192, 1) 95%);<br />
}<br />
.minerva-footer {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 75%, rgba(192, 192, 192, 1) 95%);<br />
}<br />
<br />
#content.mw-body {<br />
background: linear-gradient(to top, #0000FF, #ffffff) !important; /* blue → white gradient */<br />
}<br />
<br />
.dw-card {<br />
padding:0;}<br />
div#content.mw-body {<br />
padding: 0rem;}<br />
div.mw-content-ltr.mw-parser-output {<br />
padding: 0.5rem;<br />
}<br />
<br />
.banner-icon img { <br />
width: 80vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 650px; /* prevent it from getting too big */ <br />
min-width: 120px; /* prevent it from getting too small */ <br />
padding-left: 0rem;}<br />
<br />
/* Stack everything in a column */<br />
.dw-card .dw-row {<br />
display: flex;<br />
flex-direction: column;<br />
align-items: stretch; /* full width for text block */<br />
gap: 10px;<br />
}<br />
<br />
/* Make the icon its own row and center it */<br />
.dw-card .dw-icon {<br />
display: flex;<br />
justify-content: center;<br />
align-items: center;<br />
margin: 0; /* remove any left/right spacing from desktop */<br />
}<br />
<br />
.dw-card .dw-icon img {<br />
width: 72px; /* tidy mobile size */<br />
height: auto;<br />
}<br />
<br />
/* Ensure the text block fills width */<br />
.dw-card .dw-row > div {<br />
width: 100%;<br />
}<br />
<br />
/* Slight spacing tweaks for headings on mobile */<br />
.dw-card .dw-headline {<br />
margin: 4px 0 4px;<br />
}<br />
<br />
.partner-logos {<br />
display: flex;<br />
flex-wrap: wrap; /* allows wrapping on small screens */<br />
justify-content: space-between !important; <br />
align-items: center!important; <br />
gap: 1.4rem; <br />
padding: 0 1rem 1rem 1rem; /* breathing room top & bottom */<br />
background: transparent;<br />
}<br />
<br />
.partner-logos img {<br />
height: 24px;<br />
width: auto;<br />
object-fit:contain;<br />
}<br />
<br />
}</div>
Ivans
https://dsignweek.servus.at/index.php?title=MediaWiki:Common.css&diff=1421
MediaWiki:Common.css
2025-11-20T13:56:51Z
<p>Ivans: </p>
<hr />
<div>/* CSS placed here will be applied to all skins */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
#footer-info-lastmod {<br />
display: none !important;<br />
}<br />
<br />
/* Vector 2022: align user links (language, username, etc.) to the top */<br />
body.skin-vector-2022 .vector-user-links-main {<br />
display: flex; /* make sure it's flexbox */<br />
align-items: flex-start; /* align children to the top of the div */<br />
}<br />
/* Hide the Translate extension banner ("Translate this page; This page has changes…") */<br />
body.skin-vector-2022 .mw-pt-translate-header {<br />
display: none !important;<br />
}<br />
/* Vector 2022 – hide entire tab/navigation bar (left-navigation) for all users */<br />
.skin-vector-2022 #left-navigation {<br />
display: none !important;<br />
}<br />
/* Vector 2022: right-align items in the page toolbar (Edit / View history / Tools) */<br />
.skin-vector-2022 .vector-page-toolbar-container {<br />
display: flex !important;<br />
justify-content: flex-end !important; /* pushes items to the right */<br />
align-items: center; /* vertical alignment */<br />
}<br />
<br />
<br />
<br />
.mw-anon.skin-vector-2022 #ca-nstab-main, /* page title tab (Main Page / Article) */<br />
.mw-anon.skin-vector-2022 #ca-talk, /* Talk tab */<br />
.mw-anon.skin-vector-2022 #ca-view, /* "Read" tab */<br />
.mw-anon.skin-vector-2022 #ca-history, /* View history */<br />
.mw-anon.skin-vector-2022 #ca-watch,<br />
.mw-anon.skin-vector-2022 #ca-unwatch,<br />
.mw-anon.skin-vector-2022 #ca-more { /* "Tools" dropdown */<br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* === GLOBAL TYPOGRAPHY === */<br />
<br />
/* Base body text — Liberation Sans */<br />
html,<br />
body,<br />
.mw-body,<br />
.mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 1.2rem; /* base = 16px */<br />
line-height: 1.15; <br />
}<br />
<br />
/* Paragraphs and list text */<br />
p, li, td, th {<br />
font-size: 1.1rem; /* slightly larger than base text */<br />
}<br />
<br />
/* === HEADINGS — Linux Libertine === */<br />
h1, h2, h3, h4, h5, h6,<br />
.firstHeading,<br />
.mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
.mw-body h1, .mw-heading1, .mw-body-content h1, .mw-body-content .mw-heading1 { font-size: 3rem; line-height: 1.15; } <br />
<br />
<br />
<br />
/* === SIDEBAR MENU === */<br />
#mw-panel,<br />
.vector-menu-content,<br />
#p-navigation,<br />
#p-tb,<br />
#p-lang {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem; /* sidebar smaller for contrast */<br />
line-height: 1.4;<br />
}<br />
<br />
#mw-panel,<br />
.vector-menu-content {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 90%, rgba(192, 192, 192, 1) 100%);<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
#partner-logos {<br />
display: flex;<br />
justify-content: right;<br />
align-items: right;<br />
flex-wrap: wrap;<br />
gap: 1rem;<br />
margin-top:0.8rem;<br />
<br />
}<br />
<br />
#partner-logos img {<br />
height: 32px;<br />
object-fit: contain; /* keeps aspect ratio, fits within the box */<br />
max-width: 100%; /* prevents overflow */<br />
display: block; /* removes inline gaps below images */<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
.wikitable.custom-table {<br />
width: 100%;<br />
border-collapse: separate;<br />
border-spacing: 0;<br />
border: none;<br />
background-color: #fff;<br />
border-radius: 0.5rem;<br />
overflow: hidden; /* so rounded corners clip correctly */<br />
font-size: 0.95rem;<br />
}<br />
<br />
<br />
<br />
/* Header cells */<br />
.wikitable.custom-table th {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
color: #000;<br />
font-weight: 600;<br />
text-align: left;<br />
padding: 0.75rem 1rem;<br />
border-bottom: 2px solid #d0d9ff;<br />
}<br />
<br />
/* Data cells */<br />
.wikitable.custom-table td {<br />
padding: 0.65rem 1rem;<br />
border-bottom: 1px solid #eee;<br />
}<br />
<br />
/* Zebra striping */<br />
.wikitable.custom-table tr:nth-child(even) td {<br />
background-color: #f9fbff;<br />
}<br />
<br />
/* Hover effect */<br />
.wikitable.custom-table tr:hover td {<br />
background: #FFF;<br />
background: linear-gradient(0deg,rgba(0, 0, 255, 1) 0%, rgba(255, 255, 255, 1) 15%, rgba(255, 255, 255, 1) 85%, rgba(0, 0, 255, 1) 100%);<br />
}<br />
<br />
/* Rounded corners for first & last rows */<br />
.wikitable.custom-table tr:first-child th:first-child {<br />
border-top-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:first-child th:last-child {<br />
border-top-right-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:first-child {<br />
border-bottom-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:last-child {<br />
border-bottom-right-radius: 0.5rem;<br />
}<br />
<br />
<br />
/* === Mobile Responsive Tables (no HTML change needed) === */<br />
@media (max-width: 768px) {<br />
<br />
/* Allow horizontal scrolling on narrow screens */<br />
.wikitable.custom-table {<br />
display: block;<br />
width: 100%;<br />
overflow-x: auto;<br />
-webkit-overflow-scrolling: touch;<br />
}<br />
<br />
/* Prevent collapsing/squeezing of long cell content */<br />
.wikitable.custom-table tr,<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
white-space: nowrap;<br />
}<br />
<br />
/* Optional: slightly reduce padding for small screens */<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
padding: 0.5rem 0.75rem;<br />
}<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* Hide the automatic Tools and Special pages sections */<br />
#p-tb { <br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* MAIN-PAGE */<br />
<br />
/* === FONTS (yours) === */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
.mw-pt-languages {<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);}<br />
/* === GLOBAL TYPOGRAPHY === */<br />
html, body, .mw-body, .mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem;<br />
line-height: 1.1;<br />
}<br />
p, li, td, th { font-size: 1.1rem; line-height: 1.1; }<br />
h1, h2, h3, h4, h5, h6, .firstHeading, .mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
<br />
/* === d*sign week layout === */<br />
:root {<br />
--dw-border: #cfd8e3;<br />
--dw-card-bg: #f8fbff;<br />
}<br />
<br />
/* top ribbon */<br />
.dw-ribbon {<br />
height: 26px;<br />
background: linear-gradient(#8aa9ff, #ffffff);<br />
border-radius: 6px;<br />
margin: 0 0 14px 0;<br />
}<br />
<br />
<br />
.banner {<br />
display: flex;<br />
align-items: center;<br />
justify-content: space-between;<br />
gap: 1.5rem;<br />
padding: 0rem 1rem 0rem 1rem;<br />
text-align: left; /* centers text within its box */<br />
flex-wrap: wrap; <br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
background-size: 100% 200%;<br />
background-position: top;<br />
transition: background-position 0.4s ease-in-out;<br />
}<br />
.banner:hover {<br />
background-position: bottom;<br />
}<br />
<br />
<br />
.banner-icon img { <br />
width: 20vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 650px; /* prevent it from getting too big */ <br />
min-width: 120px; /* prevent it from getting too small */ <br />
padding-left: 2rem;}<br />
<br />
.dw-subtitle {<br />
font-size: 1.5rem;<br />
line-height: 1;<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle-banner {<br />
font-size: 3rem;<br />
}<br />
.dw-subtitle strong {<br />
<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle a {<br />
color: #0000FF !important; /* link color similar to your example */<br />
text-decoration: none;<br />
}<br />
<br />
.dw-subtitle a:hover {<br />
text-decoration: underline;<br />
}<br />
<br />
<br />
/* title & subtitle */<br />
.dw-title {<br />
text-align: center;<br />
line-height: 1.2;<br />
font-size: 2.5rem;<br />
font-weight: 700;<br />
letter-spacing: .02em;<br />
display: block;<br />
}<br />
<br />
<br />
/* grid */<br />
.dw-grid {<br />
display: flex;<br />
flex-wrap: wrap;<br />
gap: 16px;<br />
align-items: flex-start;<br />
margin-top: 14px;<br />
}<br />
.dw-col {<br />
flex: 1 1 520px;<br />
min-width: 320px;<br />
}<br />
<br />
/* cards */<br />
.dw-card {<br />
position: relative;<br />
border: 1px solid #C0C0C0;<br />
background: #FFFFFF !important;<br />
padding: 10px;<br />
margin-bottom: 10px;<br />
}<br />
.dw-card:hover {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 75%, rgba(192, 192, 192, 1) 100%)!important;<br />
}<br />
span.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
<br />
}<br />
<br />
.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 2rem !important; <br />
}<br />
<br />
<br />
.dw-card .dw-row {<br />
display: flex;<br />
flex-wrap: wrap;<br />
align-items: flex-start;<br />
gap: 12px;<br />
width: 100%;<br />
box-sizing: border-box;<br />
padding: 14px; /* ✅ move the spacing here instead of .dw-card */<br />
}<br />
<br />
.dw-card .dw-row > div:last-child {<br />
flex: 1;<br />
min-width: 0; /* ✅ prevents overflow due to long text/links */<br />
}<br />
<br />
.dw-card .dw-icon img { height: auto; }<br />
.dw-card .dw-headline {<br />
display: block;<br />
font-size: 1.5rem;<br />
font-weight: 700;<br />
margin: 0px 0 0px;<br />
}<br />
.dw-card .dw-body { line-height: 1.6; width: 100%;}<br />
.dw-card .dw-body--spacious { line-height: 1.8; }<br />
<br />
<br />
.dw-icon,<br />
.dw-subtitle {<br />
background: transparent !important; /* ✅ makes logo + text boxes transparent */<br />
}<br />
<br />
<br />
/* Code blocks explicitly monospace (so they don't inherit) */<br />
pre, code, kbd, samp, tt, .mw-code {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
text-indent: 0 !important;<br />
}<br />
<br />
/* ===== Remove first-line indentation site-wide ===== */<br />
.mw-parser-output p,<br />
.mw-parser-output li p,<br />
.mw-body-content p,<br />
.dw-card .dw-body p {<br />
text-indent: 0 !important;<br />
}<br />
<br />
<br />
pre {<br />
margin: 0 !important;<br />
padding: 0rem !important; /* add a little inner spacing so text isn’t on the edge */<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);<br />
border: none !important;<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
white-space: pre-wrap !important; /* allows wrapping */<br />
word-break: break-word !important;<br />
line-height: 1 !important;<br />
<br />
}<br />
<br />
.dw-card .pre {<br />
display: block; /* ensures it behaves as a block element */<br />
width: 100% !important;/* takes up the full width of .dw-card */<br />
box-sizing: border-box;/* includes padding/border in width calculation */<br />
margin: 0;<br />
padding: 0;<br />
}<br />
<br />
<br />
div.mw-content-ltr.mw-parser-output {<br />
background: #FFFFFF;<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 97%, rgba(192, 192, 192, 1) 100%);<br />
padding: 1rem;<br />
}<br />
<br />
<br />
<br />
.mw-page-container {<br />
background-image: url("https://dsignweek.servus.at/images/9/9d/Bg-01.png");<br />
background-repeat: repeat-y; /* ✅ repeat vertically */<br />
background-size: 100% auto; /* stretch to page width, keep height natural */<br />
background-position: center top; /* start at the top, center horizontally */<br />
background-attachment: scroll; /* move with page scroll */<br />
background-color: #ffffff; /* fallback behind transparent areas */<br />
}<br />
<br />
div#mw-head {<br />
background: transparent !important;<br />
}<br />
<br />
<br />
.dw-headline, .mw-headline {<br />
margin: 0 !important;<br />
}<br />
<br />
.skin-vector-2022 header.vector-header { box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8)!important; }<br />
<br />
.skin-vector-2022 #vector-sticky-header.vector-sticky-header {<br />
box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8) !important;<br />
}<br />
<br />
<br />
/* ===== Mobile: stack card content vertically ===== */<br />
@media (max-width: 720px) {<br />
<br />
.header-container.header-chrome {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 75%, rgba(192, 192, 192, 1) 95%);<br />
}<br />
.minerva-footer {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 75%, rgba(192, 192, 192, 1) 95%);<br />
}<br />
<br />
#content.mw-body {<br />
background: linear-gradient(to top, #0000FF, #ffffff) !important; /* blue → white gradient */<br />
}<br />
<br />
.dw-card {<br />
padding:0;}<br />
div#content.mw-body {<br />
padding: 0rem;}<br />
div.mw-content-ltr.mw-parser-output {<br />
padding: 0.5rem;<br />
}<br />
<br />
.banner-icon img { <br />
width: 80vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 650px; /* prevent it from getting too big */ <br />
min-width: 120px; /* prevent it from getting too small */ <br />
padding-left: 0rem;}<br />
<br />
/* Stack everything in a column */<br />
.dw-card .dw-row {<br />
display: flex;<br />
flex-direction: column;<br />
align-items: stretch; /* full width for text block */<br />
gap: 10px;<br />
}<br />
<br />
/* Make the icon its own row and center it */<br />
.dw-card .dw-icon {<br />
display: flex;<br />
justify-content: center;<br />
align-items: center;<br />
margin: 0; /* remove any left/right spacing from desktop */<br />
}<br />
<br />
.dw-card .dw-icon img {<br />
width: 72px; /* tidy mobile size */<br />
height: auto;<br />
}<br />
<br />
/* Ensure the text block fills width */<br />
.dw-card .dw-row > div {<br />
width: 100%;<br />
}<br />
<br />
/* Slight spacing tweaks for headings on mobile */<br />
.dw-card .dw-headline {<br />
margin: 4px 0 4px;<br />
}<br />
<br />
.partner-logos {<br />
display: flex;<br />
flex-wrap: wrap; /* allows wrapping on small screens */<br />
justify-content: space-between !important; <br />
align-items: center!important; <br />
gap: 1.4rem; <br />
padding: 0 1rem 1rem 1rem; /* breathing room top & bottom */<br />
background: transparent;<br />
}<br />
<br />
.partner-logos img {<br />
height: 24px;<br />
width: auto;<br />
object-fit:contain;<br />
}<br />
<br />
}</div>
Ivans
https://dsignweek.servus.at/index.php?title=MediaWiki:Common.css&diff=1420
MediaWiki:Common.css
2025-11-20T13:55:23Z
<p>Ivans: </p>
<hr />
<div>/* CSS placed here will be applied to all skins */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
#footer-info-lastmod {<br />
display: none !important;<br />
}<br />
<br />
/* Vector 2022: align user links (language, username, etc.) to the top */<br />
body.skin-vector-2022 .vector-user-links-main {<br />
display: flex; /* make sure it's flexbox */<br />
align-items: flex-start; /* align children to the top of the div */<br />
}<br />
/* Hide the Translate extension banner ("Translate this page; This page has changes…") */<br />
body.skin-vector-2022 .mw-pt-translate-header {<br />
display: none !important;<br />
}<br />
/* Vector 2022 – hide entire tab/navigation bar (left-navigation) for all users */<br />
.skin-vector-2022 #left-navigation {<br />
display: none !important;<br />
}<br />
/* Vector 2022: right-align items in the page toolbar (Edit / View history / Tools) */<br />
.skin-vector-2022 .vector-page-toolbar-container {<br />
display: flex !important;<br />
justify-content: flex-end !important; /* pushes items to the right */<br />
align-items: center; /* vertical alignment */<br />
}<br />
<br />
<br />
<br />
.mw-anon.skin-vector-2022 #ca-nstab-main, /* page title tab (Main Page / Article) */<br />
.mw-anon.skin-vector-2022 #ca-talk, /* Talk tab */<br />
.mw-anon.skin-vector-2022 #ca-view, /* "Read" tab */<br />
.mw-anon.skin-vector-2022 #ca-history, /* View history */<br />
.mw-anon.skin-vector-2022 #ca-watch,<br />
.mw-anon.skin-vector-2022 #ca-unwatch,<br />
.mw-anon.skin-vector-2022 #ca-more { /* "Tools" dropdown */<br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* === GLOBAL TYPOGRAPHY === */<br />
<br />
/* Base body text — Liberation Sans */<br />
html,<br />
body,<br />
.mw-body,<br />
.mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 1.2rem; /* base = 16px */<br />
line-height: 1.15; <br />
}<br />
<br />
/* Paragraphs and list text */<br />
p, li, td, th {<br />
font-size: 1.1rem; /* slightly larger than base text */<br />
}<br />
<br />
/* === HEADINGS — Linux Libertine === */<br />
h1, h2, h3, h4, h5, h6,<br />
.firstHeading,<br />
.mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
.mw-body h1, .mw-heading1, .mw-body-content h1, .mw-body-content .mw-heading1 { font-size: 3rem; line-height: 1.15; } <br />
<br />
<br />
<br />
/* === SIDEBAR MENU === */<br />
#mw-panel,<br />
.vector-menu-content,<br />
#p-navigation,<br />
#p-tb,<br />
#p-lang {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem; /* sidebar smaller for contrast */<br />
line-height: 1.4;<br />
}<br />
<br />
#mw-panel,<br />
.vector-menu-content {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 90%, rgba(192, 192, 192, 1) 100%);<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
#partner-logos {<br />
display: flex;<br />
justify-content: right;<br />
align-items: right;<br />
flex-wrap: wrap;<br />
gap: 1rem;<br />
margin-top:0.8rem;<br />
<br />
}<br />
<br />
#partner-logos img {<br />
height: 32px;<br />
object-fit: contain; /* keeps aspect ratio, fits within the box */<br />
max-width: 100%; /* prevents overflow */<br />
display: block; /* removes inline gaps below images */<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
.wikitable.custom-table {<br />
width: 100%;<br />
border-collapse: separate;<br />
border-spacing: 0;<br />
border: none;<br />
background-color: #fff;<br />
border-radius: 0.5rem;<br />
overflow: hidden; /* so rounded corners clip correctly */<br />
font-size: 0.95rem;<br />
}<br />
<br />
<br />
<br />
/* Header cells */<br />
.wikitable.custom-table th {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
color: #000;<br />
font-weight: 600;<br />
text-align: left;<br />
padding: 0.75rem 1rem;<br />
border-bottom: 2px solid #d0d9ff;<br />
}<br />
<br />
/* Data cells */<br />
.wikitable.custom-table td {<br />
padding: 0.65rem 1rem;<br />
border-bottom: 1px solid #eee;<br />
}<br />
<br />
/* Zebra striping */<br />
.wikitable.custom-table tr:nth-child(even) td {<br />
background-color: #f9fbff;<br />
}<br />
<br />
/* Hover effect */<br />
.wikitable.custom-table tr:hover td {<br />
background: #FFF;<br />
background: linear-gradient(0deg,rgba(0, 0, 255, 1) 0%, rgba(255, 255, 255, 1) 15%, rgba(255, 255, 255, 1) 85%, rgba(0, 0, 255, 1) 100%);<br />
}<br />
<br />
/* Rounded corners for first & last rows */<br />
.wikitable.custom-table tr:first-child th:first-child {<br />
border-top-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:first-child th:last-child {<br />
border-top-right-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:first-child {<br />
border-bottom-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:last-child {<br />
border-bottom-right-radius: 0.5rem;<br />
}<br />
<br />
<br />
/* === Mobile Responsive Tables (no HTML change needed) === */<br />
@media (max-width: 768px) {<br />
<br />
/* Allow horizontal scrolling on narrow screens */<br />
.wikitable.custom-table {<br />
display: block;<br />
width: 100%;<br />
overflow-x: auto;<br />
-webkit-overflow-scrolling: touch;<br />
}<br />
<br />
/* Prevent collapsing/squeezing of long cell content */<br />
.wikitable.custom-table tr,<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
white-space: nowrap;<br />
}<br />
<br />
/* Optional: slightly reduce padding for small screens */<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
padding: 0.5rem 0.75rem;<br />
}<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* Hide the automatic Tools and Special pages sections */<br />
#p-tb { <br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* MAIN-PAGE */<br />
<br />
/* === FONTS (yours) === */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
.mw-pt-languages {<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);}<br />
/* === GLOBAL TYPOGRAPHY === */<br />
html, body, .mw-body, .mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem;<br />
line-height: 1.1;<br />
}<br />
p, li, td, th { font-size: 1.1rem; line-height: 1.1; }<br />
h1, h2, h3, h4, h5, h6, .firstHeading, .mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
<br />
/* === d*sign week layout === */<br />
:root {<br />
--dw-border: #cfd8e3;<br />
--dw-card-bg: #f8fbff;<br />
}<br />
<br />
/* top ribbon */<br />
.dw-ribbon {<br />
height: 26px;<br />
background: linear-gradient(#8aa9ff, #ffffff);<br />
border-radius: 6px;<br />
margin: 0 0 14px 0;<br />
}<br />
<br />
<br />
.banner {<br />
display: flex;<br />
align-items: center;<br />
justify-content: space-between;<br />
gap: 1.5rem;<br />
padding: 0rem 1rem 0rem 1rem;<br />
text-align: left; /* centers text within its box */<br />
flex-wrap: wrap; <br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
background-size: 100% 200%;<br />
background-position: top;<br />
transition: background-position 0.4s ease-in-out;<br />
}<br />
.banner:hover {<br />
background-position: bottom;<br />
}<br />
<br />
<br />
.banner-icon img { <br />
width: 20vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 650px; /* prevent it from getting too big */ <br />
min-width: 120px; /* prevent it from getting too small */ <br />
padding-left: 2rem;}<br />
<br />
.dw-subtitle {<br />
font-size: 1.5rem;<br />
line-height: 1;<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle-banner {<br />
font-size: 3rem;<br />
}<br />
.dw-subtitle strong {<br />
<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle a {<br />
color: #0000FF !important; /* link color similar to your example */<br />
text-decoration: none;<br />
}<br />
<br />
.dw-subtitle a:hover {<br />
text-decoration: underline;<br />
}<br />
<br />
<br />
/* title & subtitle */<br />
.dw-title {<br />
text-align: center;<br />
line-height: 1.2;<br />
font-size: 2.5rem;<br />
font-weight: 700;<br />
letter-spacing: .02em;<br />
display: block;<br />
}<br />
<br />
<br />
/* grid */<br />
.dw-grid {<br />
display: flex;<br />
flex-wrap: wrap;<br />
gap: 16px;<br />
align-items: flex-start;<br />
margin-top: 14px;<br />
}<br />
.dw-col {<br />
flex: 1 1 520px;<br />
min-width: 320px;<br />
}<br />
<br />
/* cards */<br />
.dw-card {<br />
position: relative;<br />
border: 1px solid #C0C0C0;<br />
background: #FFFFFF !important;<br />
padding: 10px;<br />
margin-bottom: 10px;<br />
}<br />
.dw-card:hover {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 75%, rgba(192, 192, 192, 1) 100%)!important;<br />
}<br />
span.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
<br />
}<br />
<br />
.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 2rem !important; <br />
}<br />
<br />
<br />
.dw-card .dw-row {<br />
display: flex;<br />
flex-wrap: wrap;<br />
align-items: flex-start;<br />
gap: 12px;<br />
width: 100%;<br />
box-sizing: border-box;<br />
padding: 14px; /* ✅ move the spacing here instead of .dw-card */<br />
}<br />
<br />
.dw-card .dw-row > div:last-child {<br />
flex: 1;<br />
min-width: 0; /* ✅ prevents overflow due to long text/links */<br />
}<br />
<br />
.dw-card .dw-icon img { height: auto; }<br />
.dw-card .dw-headline {<br />
display: block;<br />
font-size: 1.5rem;<br />
font-weight: 700;<br />
margin: 0px 0 0px;<br />
}<br />
.dw-card .dw-body { line-height: 1.6; width: 100%;}<br />
.dw-card .dw-body--spacious { line-height: 1.8; }<br />
<br />
<br />
.dw-icon,<br />
.dw-subtitle {<br />
background: transparent !important; /* ✅ makes logo + text boxes transparent */<br />
}<br />
<br />
<br />
/* Code blocks explicitly monospace (so they don't inherit) */<br />
pre, code, kbd, samp, tt, .mw-code {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
text-indent: 0 !important;<br />
}<br />
<br />
/* ===== Remove first-line indentation site-wide ===== */<br />
.mw-parser-output p,<br />
.mw-parser-output li p,<br />
.mw-body-content p,<br />
.dw-card .dw-body p {<br />
text-indent: 0 !important;<br />
}<br />
<br />
<br />
pre {<br />
margin: 0 !important;<br />
padding: 0rem !important; /* add a little inner spacing so text isn’t on the edge */<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);<br />
border: none !important;<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
white-space: pre-wrap !important; /* allows wrapping */<br />
word-break: break-word !important;<br />
line-height: 1 !important;<br />
<br />
}<br />
<br />
.dw-card .pre {<br />
display: block; /* ensures it behaves as a block element */<br />
width: 100% !important;/* takes up the full width of .dw-card */<br />
box-sizing: border-box;/* includes padding/border in width calculation */<br />
margin: 0;<br />
padding: 0;<br />
}<br />
<br />
<br />
div.mw-content-ltr.mw-parser-output {<br />
background: #FFFFFF;<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 95%, rgba(192, 192, 192, 1) 100%);<br />
padding: 1rem;<br />
box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.8)!important;<br />
}<br />
<br />
<br />
<br />
.mw-page-container {<br />
background-image: url("https://dsignweek.servus.at/images/9/9d/Bg-01.png");<br />
background-repeat: repeat-y; /* ✅ repeat vertically */<br />
background-size: 100% auto; /* stretch to page width, keep height natural */<br />
background-position: center top; /* start at the top, center horizontally */<br />
background-attachment: scroll; /* move with page scroll */<br />
background-color: #ffffff; /* fallback behind transparent areas */<br />
}<br />
<br />
div#mw-head {<br />
background: transparent !important;<br />
}<br />
<br />
<br />
.dw-headline, .mw-headline {<br />
margin: 0 !important;<br />
}<br />
<br />
.skin-vector-2022 header.vector-header { box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8)!important; }<br />
<br />
.skin-vector-2022 #vector-sticky-header.vector-sticky-header {<br />
box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8) !important;<br />
}<br />
<br />
<br />
/* ===== Mobile: stack card content vertically ===== */<br />
@media (max-width: 720px) {<br />
<br />
.header-container.header-chrome {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 75%, rgba(192, 192, 192, 1) 95%);<br />
}<br />
.minerva-footer {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 75%, rgba(192, 192, 192, 1) 95%);<br />
}<br />
<br />
#content.mw-body {<br />
background: linear-gradient(to top, #0000FF, #ffffff) !important; /* blue → white gradient */<br />
}<br />
<br />
.dw-card {<br />
padding:0;}<br />
div#content.mw-body {<br />
padding: 0rem;}<br />
div.mw-content-ltr.mw-parser-output {<br />
padding: 0.5rem;<br />
}<br />
<br />
.banner-icon img { <br />
width: 80vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 650px; /* prevent it from getting too big */ <br />
min-width: 120px; /* prevent it from getting too small */ <br />
padding-left: 0rem;}<br />
<br />
/* Stack everything in a column */<br />
.dw-card .dw-row {<br />
display: flex;<br />
flex-direction: column;<br />
align-items: stretch; /* full width for text block */<br />
gap: 10px;<br />
}<br />
<br />
/* Make the icon its own row and center it */<br />
.dw-card .dw-icon {<br />
display: flex;<br />
justify-content: center;<br />
align-items: center;<br />
margin: 0; /* remove any left/right spacing from desktop */<br />
}<br />
<br />
.dw-card .dw-icon img {<br />
width: 72px; /* tidy mobile size */<br />
height: auto;<br />
}<br />
<br />
/* Ensure the text block fills width */<br />
.dw-card .dw-row > div {<br />
width: 100%;<br />
}<br />
<br />
/* Slight spacing tweaks for headings on mobile */<br />
.dw-card .dw-headline {<br />
margin: 4px 0 4px;<br />
}<br />
<br />
.partner-logos {<br />
display: flex;<br />
flex-wrap: wrap; /* allows wrapping on small screens */<br />
justify-content: space-between !important; <br />
align-items: center!important; <br />
gap: 1.4rem; <br />
padding: 0 1rem 1rem 1rem; /* breathing room top & bottom */<br />
background: transparent;<br />
}<br />
<br />
.partner-logos img {<br />
height: 24px;<br />
width: auto;<br />
object-fit:contain;<br />
}<br />
<br />
}</div>
Ivans
https://dsignweek.servus.at/index.php?title=MediaWiki:Common.css&diff=1419
MediaWiki:Common.css
2025-11-20T13:53:28Z
<p>Ivans: </p>
<hr />
<div>/* CSS placed here will be applied to all skins */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
#footer-info-lastmod {<br />
display: none !important;<br />
}<br />
<br />
/* Vector 2022: align user links (language, username, etc.) to the top */<br />
body.skin-vector-2022 .vector-user-links-main {<br />
display: flex; /* make sure it's flexbox */<br />
align-items: flex-start; /* align children to the top of the div */<br />
}<br />
/* Hide the Translate extension banner ("Translate this page; This page has changes…") */<br />
body.skin-vector-2022 .mw-pt-translate-header {<br />
display: none !important;<br />
}<br />
/* Vector 2022 – hide entire tab/navigation bar (left-navigation) for all users */<br />
.skin-vector-2022 #left-navigation {<br />
display: none !important;<br />
}<br />
/* Vector 2022: right-align items in the page toolbar (Edit / View history / Tools) */<br />
.skin-vector-2022 .vector-page-toolbar-container {<br />
display: flex !important;<br />
justify-content: flex-end !important; /* pushes items to the right */<br />
align-items: center; /* vertical alignment */<br />
}<br />
<br />
<br />
<br />
.mw-anon.skin-vector-2022 #ca-nstab-main, /* page title tab (Main Page / Article) */<br />
.mw-anon.skin-vector-2022 #ca-talk, /* Talk tab */<br />
.mw-anon.skin-vector-2022 #ca-view, /* "Read" tab */<br />
.mw-anon.skin-vector-2022 #ca-history, /* View history */<br />
.mw-anon.skin-vector-2022 #ca-watch,<br />
.mw-anon.skin-vector-2022 #ca-unwatch,<br />
.mw-anon.skin-vector-2022 #ca-more { /* "Tools" dropdown */<br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* === GLOBAL TYPOGRAPHY === */<br />
<br />
/* Base body text — Liberation Sans */<br />
html,<br />
body,<br />
.mw-body,<br />
.mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 1.2rem; /* base = 16px */<br />
line-height: 1.15; <br />
}<br />
<br />
/* Paragraphs and list text */<br />
p, li, td, th {<br />
font-size: 1.1rem; /* slightly larger than base text */<br />
}<br />
<br />
/* === HEADINGS — Linux Libertine === */<br />
h1, h2, h3, h4, h5, h6,<br />
.firstHeading,<br />
.mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
.mw-body h1, .mw-heading1, .mw-body-content h1, .mw-body-content .mw-heading1 { font-size: 3rem; line-height: 1.15; } <br />
<br />
<br />
<br />
/* === SIDEBAR MENU === */<br />
#mw-panel,<br />
.vector-menu-content,<br />
#p-navigation,<br />
#p-tb,<br />
#p-lang {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem; /* sidebar smaller for contrast */<br />
line-height: 1.4;<br />
}<br />
<br />
#mw-panel,<br />
.vector-menu-content {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 90%, rgba(192, 192, 192, 1) 100%);<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
#partner-logos {<br />
display: flex;<br />
justify-content: right;<br />
align-items: right;<br />
flex-wrap: wrap;<br />
gap: 1rem;<br />
margin-top:0.8rem;<br />
<br />
}<br />
<br />
#partner-logos img {<br />
height: 32px;<br />
object-fit: contain; /* keeps aspect ratio, fits within the box */<br />
max-width: 100%; /* prevents overflow */<br />
display: block; /* removes inline gaps below images */<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
.wikitable.custom-table {<br />
width: 100%;<br />
border-collapse: separate;<br />
border-spacing: 0;<br />
border: none;<br />
background-color: #fff;<br />
border-radius: 0.5rem;<br />
overflow: hidden; /* so rounded corners clip correctly */<br />
font-size: 0.95rem;<br />
}<br />
<br />
<br />
<br />
/* Header cells */<br />
.wikitable.custom-table th {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
color: #000;<br />
font-weight: 600;<br />
text-align: left;<br />
padding: 0.75rem 1rem;<br />
border-bottom: 2px solid #d0d9ff;<br />
}<br />
<br />
/* Data cells */<br />
.wikitable.custom-table td {<br />
padding: 0.65rem 1rem;<br />
border-bottom: 1px solid #eee;<br />
}<br />
<br />
/* Zebra striping */<br />
.wikitable.custom-table tr:nth-child(even) td {<br />
background-color: #f9fbff;<br />
}<br />
<br />
/* Hover effect */<br />
.wikitable.custom-table tr:hover td {<br />
background: #FFF;<br />
background: linear-gradient(0deg,rgba(0, 0, 255, 1) 0%, rgba(255, 255, 255, 1) 15%, rgba(255, 255, 255, 1) 85%, rgba(0, 0, 255, 1) 100%);<br />
}<br />
<br />
/* Rounded corners for first & last rows */<br />
.wikitable.custom-table tr:first-child th:first-child {<br />
border-top-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:first-child th:last-child {<br />
border-top-right-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:first-child {<br />
border-bottom-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:last-child {<br />
border-bottom-right-radius: 0.5rem;<br />
}<br />
<br />
<br />
/* === Mobile Responsive Tables (no HTML change needed) === */<br />
@media (max-width: 768px) {<br />
<br />
/* Allow horizontal scrolling on narrow screens */<br />
.wikitable.custom-table {<br />
display: block;<br />
width: 100%;<br />
overflow-x: auto;<br />
-webkit-overflow-scrolling: touch;<br />
}<br />
<br />
/* Prevent collapsing/squeezing of long cell content */<br />
.wikitable.custom-table tr,<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
white-space: nowrap;<br />
}<br />
<br />
/* Optional: slightly reduce padding for small screens */<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
padding: 0.5rem 0.75rem;<br />
}<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* Hide the automatic Tools and Special pages sections */<br />
#p-tb { <br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* MAIN-PAGE */<br />
<br />
/* === FONTS (yours) === */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
.mw-pt-languages {<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);}<br />
/* === GLOBAL TYPOGRAPHY === */<br />
html, body, .mw-body, .mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem;<br />
line-height: 1.1;<br />
}<br />
p, li, td, th { font-size: 1.1rem; line-height: 1.1; }<br />
h1, h2, h3, h4, h5, h6, .firstHeading, .mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
<br />
/* === d*sign week layout === */<br />
:root {<br />
--dw-border: #cfd8e3;<br />
--dw-card-bg: #f8fbff;<br />
}<br />
<br />
/* top ribbon */<br />
.dw-ribbon {<br />
height: 26px;<br />
background: linear-gradient(#8aa9ff, #ffffff);<br />
border-radius: 6px;<br />
margin: 0 0 14px 0;<br />
}<br />
<br />
<br />
.banner {<br />
display: flex;<br />
align-items: center;<br />
justify-content: space-between;<br />
gap: 1.5rem;<br />
padding: 0rem 1rem 0rem 1rem;<br />
text-align: left; /* centers text within its box */<br />
flex-wrap: wrap; <br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
background-size: 100% 200%;<br />
background-position: top;<br />
transition: background-position 0.4s ease-in-out;<br />
}<br />
.banner:hover {<br />
background-position: bottom;<br />
}<br />
<br />
<br />
.banner-icon img { <br />
width: 20vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 650px; /* prevent it from getting too big */ <br />
min-width: 120px; /* prevent it from getting too small */ <br />
padding-left: 2rem;}<br />
<br />
.dw-subtitle {<br />
font-size: 1.5rem;<br />
line-height: 1;<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle-banner {<br />
font-size: 3rem;<br />
}<br />
.dw-subtitle strong {<br />
<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle a {<br />
color: #0000FF !important; /* link color similar to your example */<br />
text-decoration: none;<br />
}<br />
<br />
.dw-subtitle a:hover {<br />
text-decoration: underline;<br />
}<br />
<br />
<br />
/* title & subtitle */<br />
.dw-title {<br />
text-align: center;<br />
line-height: 1.2;<br />
font-size: 2.5rem;<br />
font-weight: 700;<br />
letter-spacing: .02em;<br />
display: block;<br />
}<br />
<br />
<br />
/* grid */<br />
.dw-grid {<br />
display: flex;<br />
flex-wrap: wrap;<br />
gap: 16px;<br />
align-items: flex-start;<br />
margin-top: 14px;<br />
}<br />
.dw-col {<br />
flex: 1 1 520px;<br />
min-width: 320px;<br />
}<br />
<br />
/* cards */<br />
.dw-card {<br />
position: relative;<br />
border: 1px solid #C0C0C0;<br />
background: #FFFFFF !important;<br />
padding: 10px;<br />
margin-bottom: 10px;<br />
}<br />
.dw-card:hover {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 75%, rgba(192, 192, 192, 1) 100%)!important;<br />
}<br />
span.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
<br />
}<br />
<br />
.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 2rem !important; <br />
}<br />
<br />
<br />
.dw-card .dw-row {<br />
display: flex;<br />
flex-wrap: wrap;<br />
align-items: flex-start;<br />
gap: 12px;<br />
width: 100%;<br />
box-sizing: border-box;<br />
padding: 14px; /* ✅ move the spacing here instead of .dw-card */<br />
}<br />
<br />
.dw-card .dw-row > div:last-child {<br />
flex: 1;<br />
min-width: 0; /* ✅ prevents overflow due to long text/links */<br />
}<br />
<br />
.dw-card .dw-icon img { height: auto; }<br />
.dw-card .dw-headline {<br />
display: block;<br />
font-size: 1.5rem;<br />
font-weight: 700;<br />
margin: 0px 0 0px;<br />
}<br />
.dw-card .dw-body { line-height: 1.6; width: 100%;}<br />
.dw-card .dw-body--spacious { line-height: 1.8; }<br />
<br />
<br />
.dw-icon,<br />
.dw-subtitle {<br />
background: transparent !important; /* ✅ makes logo + text boxes transparent */<br />
}<br />
<br />
<br />
/* Code blocks explicitly monospace (so they don't inherit) */<br />
pre, code, kbd, samp, tt, .mw-code {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
text-indent: 0 !important;<br />
}<br />
<br />
/* ===== Remove first-line indentation site-wide ===== */<br />
.mw-parser-output p,<br />
.mw-parser-output li p,<br />
.mw-body-content p,<br />
.dw-card .dw-body p {<br />
text-indent: 0 !important;<br />
}<br />
<br />
<br />
pre {<br />
margin: 0 !important;<br />
padding: 0rem !important; /* add a little inner spacing so text isn’t on the edge */<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);<br />
border: none !important;<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
white-space: pre-wrap !important; /* allows wrapping */<br />
word-break: break-word !important;<br />
line-height: 1 !important;<br />
<br />
}<br />
<br />
.dw-card .pre {<br />
display: block; /* ensures it behaves as a block element */<br />
width: 100% !important;/* takes up the full width of .dw-card */<br />
box-sizing: border-box;/* includes padding/border in width calculation */<br />
margin: 0;<br />
padding: 0;<br />
}<br />
<br />
<br />
div.mw-content-ltr.mw-parser-output {<br />
background: #FFFFFF;<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 85%, rgba(192, 192, 192, 1) 100%);<br />
padding: 1rem;<br />
}<br />
<br />
div#content.mw-body {<br />
background: linear-gradient(to top, #0000FF, #ffffff) !important; /* blue → white gradient */<br />
}<br />
<br />
<br />
.mw-page-container {<br />
background-image: url("https://dsignweek.servus.at/images/9/9d/Bg-01.png");<br />
background-repeat: repeat-y; /* ✅ repeat vertically */<br />
background-size: 100% auto; /* stretch to page width, keep height natural */<br />
background-position: center top; /* start at the top, center horizontally */<br />
background-attachment: scroll; /* move with page scroll */<br />
background-color: #ffffff; /* fallback behind transparent areas */<br />
}<br />
<br />
div#mw-head {<br />
background: transparent !important;<br />
}<br />
<br />
<br />
.dw-headline, .mw-headline {<br />
margin: 0 !important;<br />
}<br />
<br />
.skin-vector-2022 header.vector-header { box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8)!important; }<br />
<br />
.skin-vector-2022 #vector-sticky-header.vector-sticky-header {<br />
box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8) !important;<br />
}<br />
<br />
<br />
/* ===== Mobile: stack card content vertically ===== */<br />
@media (max-width: 720px) {<br />
<br />
.header-container.header-chrome {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 75%, rgba(192, 192, 192, 1) 95%);<br />
}<br />
.minerva-footer {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 75%, rgba(192, 192, 192, 1) 95%);<br />
}<br />
<br />
#content.mw-body {<br />
background: linear-gradient(to top, #0000FF, #ffffff) !important; /* blue → white gradient */<br />
}<br />
<br />
.dw-card {<br />
padding:0;}<br />
div#content.mw-body {<br />
padding: 0rem;}<br />
div.mw-content-ltr.mw-parser-output {<br />
padding: 0.5rem;<br />
}<br />
<br />
.banner-icon img { <br />
width: 80vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 650px; /* prevent it from getting too big */ <br />
min-width: 120px; /* prevent it from getting too small */ <br />
padding-left: 0rem;}<br />
<br />
/* Stack everything in a column */<br />
.dw-card .dw-row {<br />
display: flex;<br />
flex-direction: column;<br />
align-items: stretch; /* full width for text block */<br />
gap: 10px;<br />
}<br />
<br />
/* Make the icon its own row and center it */<br />
.dw-card .dw-icon {<br />
display: flex;<br />
justify-content: center;<br />
align-items: center;<br />
margin: 0; /* remove any left/right spacing from desktop */<br />
}<br />
<br />
.dw-card .dw-icon img {<br />
width: 72px; /* tidy mobile size */<br />
height: auto;<br />
}<br />
<br />
/* Ensure the text block fills width */<br />
.dw-card .dw-row > div {<br />
width: 100%;<br />
}<br />
<br />
/* Slight spacing tweaks for headings on mobile */<br />
.dw-card .dw-headline {<br />
margin: 4px 0 4px;<br />
}<br />
<br />
.partner-logos {<br />
display: flex;<br />
flex-wrap: wrap; /* allows wrapping on small screens */<br />
justify-content: space-between !important; <br />
align-items: center!important; <br />
gap: 1.4rem; <br />
padding: 0 1rem 1rem 1rem; /* breathing room top & bottom */<br />
background: transparent;<br />
}<br />
<br />
.partner-logos img {<br />
height: 24px;<br />
width: auto;<br />
object-fit:contain;<br />
}<br />
<br />
}</div>
Ivans
https://dsignweek.servus.at/index.php?title=MediaWiki:Common.css&diff=1418
MediaWiki:Common.css
2025-11-20T13:51:55Z
<p>Ivans: </p>
<hr />
<div>/* CSS placed here will be applied to all skins */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
#footer-info-lastmod {<br />
display: none !important;<br />
}<br />
<br />
/* Vector 2022: align user links (language, username, etc.) to the top */<br />
body.skin-vector-2022 .vector-user-links-main {<br />
display: flex; /* make sure it's flexbox */<br />
align-items: flex-start; /* align children to the top of the div */<br />
}<br />
/* Hide the Translate extension banner ("Translate this page; This page has changes…") */<br />
body.skin-vector-2022 .mw-pt-translate-header {<br />
display: none !important;<br />
}<br />
/* Vector 2022 – hide entire tab/navigation bar (left-navigation) for all users */<br />
.skin-vector-2022 #left-navigation {<br />
display: none !important;<br />
}<br />
/* Vector 2022: right-align items in the page toolbar (Edit / View history / Tools) */<br />
.skin-vector-2022 .vector-page-toolbar-container {<br />
display: flex !important;<br />
justify-content: flex-end !important; /* pushes items to the right */<br />
align-items: center; /* vertical alignment */<br />
}<br />
<br />
<br />
<br />
.mw-anon.skin-vector-2022 #ca-nstab-main, /* page title tab (Main Page / Article) */<br />
.mw-anon.skin-vector-2022 #ca-talk, /* Talk tab */<br />
.mw-anon.skin-vector-2022 #ca-view, /* "Read" tab */<br />
.mw-anon.skin-vector-2022 #ca-history, /* View history */<br />
.mw-anon.skin-vector-2022 #ca-watch,<br />
.mw-anon.skin-vector-2022 #ca-unwatch,<br />
.mw-anon.skin-vector-2022 #ca-more { /* "Tools" dropdown */<br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* === GLOBAL TYPOGRAPHY === */<br />
<br />
/* Base body text — Liberation Sans */<br />
html,<br />
body,<br />
.mw-body,<br />
.mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 1.2rem; /* base = 16px */<br />
line-height: 1.15; <br />
}<br />
<br />
/* Paragraphs and list text */<br />
p, li, td, th {<br />
font-size: 1.1rem; /* slightly larger than base text */<br />
}<br />
<br />
/* === HEADINGS — Linux Libertine === */<br />
h1, h2, h3, h4, h5, h6,<br />
.firstHeading,<br />
.mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
.mw-body h1, .mw-heading1, .mw-body-content h1, .mw-body-content .mw-heading1 { font-size: 3rem; line-height: 1.15; } <br />
<br />
<br />
<br />
/* === SIDEBAR MENU === */<br />
#mw-panel,<br />
.vector-menu-content,<br />
#p-navigation,<br />
#p-tb,<br />
#p-lang {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem; /* sidebar smaller for contrast */<br />
line-height: 1.4;<br />
}<br />
<br />
#mw-panel,<br />
.vector-menu-content {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 90%, rgba(192, 192, 192, 1) 100%);<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
#partner-logos {<br />
display: flex;<br />
justify-content: right;<br />
align-items: right;<br />
flex-wrap: wrap;<br />
gap: 1rem;<br />
margin-top:0.8rem;<br />
<br />
}<br />
<br />
#partner-logos img {<br />
height: 32px;<br />
object-fit: contain; /* keeps aspect ratio, fits within the box */<br />
max-width: 100%; /* prevents overflow */<br />
display: block; /* removes inline gaps below images */<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
.wikitable.custom-table {<br />
width: 100%;<br />
border-collapse: separate;<br />
border-spacing: 0;<br />
border: none;<br />
background-color: #fff;<br />
border-radius: 0.5rem;<br />
overflow: hidden; /* so rounded corners clip correctly */<br />
font-size: 0.95rem;<br />
}<br />
<br />
<br />
<br />
/* Header cells */<br />
.wikitable.custom-table th {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
color: #000;<br />
font-weight: 600;<br />
text-align: left;<br />
padding: 0.75rem 1rem;<br />
border-bottom: 2px solid #d0d9ff;<br />
}<br />
<br />
/* Data cells */<br />
.wikitable.custom-table td {<br />
padding: 0.65rem 1rem;<br />
border-bottom: 1px solid #eee;<br />
}<br />
<br />
/* Zebra striping */<br />
.wikitable.custom-table tr:nth-child(even) td {<br />
background-color: #f9fbff;<br />
}<br />
<br />
/* Hover effect */<br />
.wikitable.custom-table tr:hover td {<br />
background: #FFF;<br />
background: linear-gradient(0deg,rgba(0, 0, 255, 1) 0%, rgba(255, 255, 255, 1) 15%, rgba(255, 255, 255, 1) 85%, rgba(0, 0, 255, 1) 100%);<br />
}<br />
<br />
/* Rounded corners for first & last rows */<br />
.wikitable.custom-table tr:first-child th:first-child {<br />
border-top-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:first-child th:last-child {<br />
border-top-right-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:first-child {<br />
border-bottom-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:last-child {<br />
border-bottom-right-radius: 0.5rem;<br />
}<br />
<br />
<br />
/* === Mobile Responsive Tables (no HTML change needed) === */<br />
@media (max-width: 768px) {<br />
<br />
/* Allow horizontal scrolling on narrow screens */<br />
.wikitable.custom-table {<br />
display: block;<br />
width: 100%;<br />
overflow-x: auto;<br />
-webkit-overflow-scrolling: touch;<br />
}<br />
<br />
/* Prevent collapsing/squeezing of long cell content */<br />
.wikitable.custom-table tr,<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
white-space: nowrap;<br />
}<br />
<br />
/* Optional: slightly reduce padding for small screens */<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
padding: 0.5rem 0.75rem;<br />
}<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* Hide the automatic Tools and Special pages sections */<br />
#p-tb { <br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* MAIN-PAGE */<br />
<br />
/* === FONTS (yours) === */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
.mw-pt-languages {<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);}<br />
/* === GLOBAL TYPOGRAPHY === */<br />
html, body, .mw-body, .mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem;<br />
line-height: 1.1;<br />
}<br />
p, li, td, th { font-size: 1.1rem; line-height: 1.1; }<br />
h1, h2, h3, h4, h5, h6, .firstHeading, .mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
<br />
/* === d*sign week layout === */<br />
:root {<br />
--dw-border: #cfd8e3;<br />
--dw-card-bg: #f8fbff;<br />
}<br />
<br />
/* top ribbon */<br />
.dw-ribbon {<br />
height: 26px;<br />
background: linear-gradient(#8aa9ff, #ffffff);<br />
border-radius: 6px;<br />
margin: 0 0 14px 0;<br />
}<br />
<br />
<br />
.banner {<br />
display: flex;<br />
align-items: center;<br />
justify-content: space-between;<br />
gap: 1.5rem;<br />
padding: 0rem 1rem 0rem 1rem;<br />
text-align: left; /* centers text within its box */<br />
flex-wrap: wrap; <br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
background-size: 100% 200%;<br />
background-position: top;<br />
transition: background-position 0.4s ease-in-out;<br />
}<br />
.banner:hover {<br />
background-position: bottom;<br />
}<br />
<br />
<br />
.banner-icon img { <br />
width: 20vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 650px; /* prevent it from getting too big */ <br />
min-width: 120px; /* prevent it from getting too small */ <br />
padding-left: 2rem;}<br />
<br />
.dw-subtitle {<br />
font-size: 1.5rem;<br />
line-height: 1;<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle-banner {<br />
font-size: 3rem;<br />
}<br />
.dw-subtitle strong {<br />
<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle a {<br />
color: #0000FF !important; /* link color similar to your example */<br />
text-decoration: none;<br />
}<br />
<br />
.dw-subtitle a:hover {<br />
text-decoration: underline;<br />
}<br />
<br />
<br />
/* title & subtitle */<br />
.dw-title {<br />
text-align: center;<br />
line-height: 1.2;<br />
font-size: 2.5rem;<br />
font-weight: 700;<br />
letter-spacing: .02em;<br />
display: block;<br />
}<br />
<br />
<br />
/* grid */<br />
.dw-grid {<br />
display: flex;<br />
flex-wrap: wrap;<br />
gap: 16px;<br />
align-items: flex-start;<br />
margin-top: 14px;<br />
}<br />
.dw-col {<br />
flex: 1 1 520px;<br />
min-width: 320px;<br />
}<br />
<br />
/* cards */<br />
.dw-card {<br />
position: relative;<br />
border: 1px solid #C0C0C0;<br />
background: #FFFFFF !important;<br />
padding: 10px;<br />
margin-bottom: 10px;<br />
}<br />
.dw-card:hover {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 75%, rgba(192, 192, 192, 1) 100%)!important;<br />
}<br />
span.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
<br />
}<br />
<br />
.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 2rem !important; <br />
}<br />
<br />
<br />
.dw-card .dw-row {<br />
display: flex;<br />
flex-wrap: wrap;<br />
align-items: flex-start;<br />
gap: 12px;<br />
width: 100%;<br />
box-sizing: border-box;<br />
padding: 14px; /* ✅ move the spacing here instead of .dw-card */<br />
}<br />
<br />
.dw-card .dw-row > div:last-child {<br />
flex: 1;<br />
min-width: 0; /* ✅ prevents overflow due to long text/links */<br />
}<br />
<br />
.dw-card .dw-icon img { height: auto; }<br />
.dw-card .dw-headline {<br />
display: block;<br />
font-size: 1.5rem;<br />
font-weight: 700;<br />
margin: 0px 0 0px;<br />
}<br />
.dw-card .dw-body { line-height: 1.6; width: 100%;}<br />
.dw-card .dw-body--spacious { line-height: 1.8; }<br />
<br />
<br />
.dw-icon,<br />
.dw-subtitle {<br />
background: transparent !important; /* ✅ makes logo + text boxes transparent */<br />
}<br />
<br />
<br />
/* Code blocks explicitly monospace (so they don't inherit) */<br />
pre, code, kbd, samp, tt, .mw-code {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
text-indent: 0 !important;<br />
}<br />
<br />
/* ===== Remove first-line indentation site-wide ===== */<br />
.mw-parser-output p,<br />
.mw-parser-output li p,<br />
.mw-body-content p,<br />
.dw-card .dw-body p {<br />
text-indent: 0 !important;<br />
}<br />
<br />
<br />
pre {<br />
margin: 0 !important;<br />
padding: 0rem !important; /* add a little inner spacing so text isn’t on the edge */<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);<br />
border: none !important;<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
white-space: pre-wrap !important; /* allows wrapping */<br />
word-break: break-word !important;<br />
line-height: 1 !important;<br />
<br />
}<br />
<br />
.dw-card .pre {<br />
display: block; /* ensures it behaves as a block element */<br />
width: 100% !important;/* takes up the full width of .dw-card */<br />
box-sizing: border-box;/* includes padding/border in width calculation */<br />
margin: 0;<br />
padding: 0;<br />
}<br />
<br />
<br />
div.mw-content-ltr.mw-parser-output {<br />
background: #FFFFFF;<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 85%, rgba(192, 192, 192, 1) 100%);<br />
padding: 1rem;<br />
}<br />
<br />
div#content.mw-body {<br />
background: linear-gradient(to top, #0000FF, #ffffff) !important; /* blue → white gradient */<br />
}<br />
<br />
<br />
.mw-page-container {<br />
background-image: url("https://dsignweek.servus.at/images/9/9d/Bg-01.png");<br />
background-repeat: repeat-y; /* ✅ repeat vertically */<br />
background-size: 100% auto; /* stretch to page width, keep height natural */<br />
background-position: center top; /* start at the top, center horizontally */<br />
background-attachment: scroll; /* move with page scroll */<br />
background-color: #ffffff; /* fallback behind transparent areas */<br />
}<br />
<br />
div#mw-head {<br />
background: transparent !important;<br />
}<br />
<br />
<br />
.dw-headline, .mw-headline {<br />
margin: 0 !important;<br />
}<br />
<br />
.skin-vector-2022 header.vector-header { background: linear-gradient( 0deg, rgba(0, 0, 255, 1) 0%, rgba(255, 255, 255, 1) 10% ) !important; }<br />
<br />
.skin-vector-2022 #vector-sticky-header.vector-sticky-header {<br />
box-shadow: 0px 4px 12px rgba(0, 0, 255, 0.8) !important;<br />
}<br />
<br />
<br />
/* ===== Mobile: stack card content vertically ===== */<br />
@media (max-width: 720px) {<br />
<br />
.header-container.header-chrome {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 75%, rgba(192, 192, 192, 1) 95%);<br />
}<br />
.minerva-footer {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 75%, rgba(192, 192, 192, 1) 95%);<br />
}<br />
<br />
#content.mw-body {<br />
background: linear-gradient(to top, #0000FF, #ffffff) !important; /* blue → white gradient */<br />
}<br />
<br />
.dw-card {<br />
padding:0;}<br />
div#content.mw-body {<br />
padding: 0rem;}<br />
div.mw-content-ltr.mw-parser-output {<br />
padding: 0.5rem;<br />
}<br />
<br />
.banner-icon img { <br />
width: 80vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 650px; /* prevent it from getting too big */ <br />
min-width: 120px; /* prevent it from getting too small */ <br />
padding-left: 0rem;}<br />
<br />
/* Stack everything in a column */<br />
.dw-card .dw-row {<br />
display: flex;<br />
flex-direction: column;<br />
align-items: stretch; /* full width for text block */<br />
gap: 10px;<br />
}<br />
<br />
/* Make the icon its own row and center it */<br />
.dw-card .dw-icon {<br />
display: flex;<br />
justify-content: center;<br />
align-items: center;<br />
margin: 0; /* remove any left/right spacing from desktop */<br />
}<br />
<br />
.dw-card .dw-icon img {<br />
width: 72px; /* tidy mobile size */<br />
height: auto;<br />
}<br />
<br />
/* Ensure the text block fills width */<br />
.dw-card .dw-row > div {<br />
width: 100%;<br />
}<br />
<br />
/* Slight spacing tweaks for headings on mobile */<br />
.dw-card .dw-headline {<br />
margin: 4px 0 4px;<br />
}<br />
<br />
.partner-logos {<br />
display: flex;<br />
flex-wrap: wrap; /* allows wrapping on small screens */<br />
justify-content: space-between !important; <br />
align-items: center!important; <br />
gap: 1.4rem; <br />
padding: 0 1rem 1rem 1rem; /* breathing room top & bottom */<br />
background: transparent;<br />
}<br />
<br />
.partner-logos img {<br />
height: 24px;<br />
width: auto;<br />
object-fit:contain;<br />
}<br />
<br />
}</div>
Ivans
https://dsignweek.servus.at/index.php?title=MediaWiki:Common.css&diff=1417
MediaWiki:Common.css
2025-11-20T13:50:03Z
<p>Ivans: </p>
<hr />
<div>/* CSS placed here will be applied to all skins */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
#footer-info-lastmod {<br />
display: none !important;<br />
}<br />
<br />
/* Vector 2022: align user links (language, username, etc.) to the top */<br />
body.skin-vector-2022 .vector-user-links-main {<br />
display: flex; /* make sure it's flexbox */<br />
align-items: flex-start; /* align children to the top of the div */<br />
}<br />
/* Hide the Translate extension banner ("Translate this page; This page has changes…") */<br />
body.skin-vector-2022 .mw-pt-translate-header {<br />
display: none !important;<br />
}<br />
/* Vector 2022 – hide entire tab/navigation bar (left-navigation) for all users */<br />
.skin-vector-2022 #left-navigation {<br />
display: none !important;<br />
}<br />
/* Vector 2022: right-align items in the page toolbar (Edit / View history / Tools) */<br />
.skin-vector-2022 .vector-page-toolbar-container {<br />
display: flex !important;<br />
justify-content: flex-end !important; /* pushes items to the right */<br />
align-items: center; /* vertical alignment */<br />
}<br />
<br />
<br />
<br />
.mw-anon.skin-vector-2022 #ca-nstab-main, /* page title tab (Main Page / Article) */<br />
.mw-anon.skin-vector-2022 #ca-talk, /* Talk tab */<br />
.mw-anon.skin-vector-2022 #ca-view, /* "Read" tab */<br />
.mw-anon.skin-vector-2022 #ca-history, /* View history */<br />
.mw-anon.skin-vector-2022 #ca-watch,<br />
.mw-anon.skin-vector-2022 #ca-unwatch,<br />
.mw-anon.skin-vector-2022 #ca-more { /* "Tools" dropdown */<br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* === GLOBAL TYPOGRAPHY === */<br />
<br />
/* Base body text — Liberation Sans */<br />
html,<br />
body,<br />
.mw-body,<br />
.mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 1.2rem; /* base = 16px */<br />
line-height: 1.15; <br />
}<br />
<br />
/* Paragraphs and list text */<br />
p, li, td, th {<br />
font-size: 1.1rem; /* slightly larger than base text */<br />
}<br />
<br />
/* === HEADINGS — Linux Libertine === */<br />
h1, h2, h3, h4, h5, h6,<br />
.firstHeading,<br />
.mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
.mw-body h1, .mw-heading1, .mw-body-content h1, .mw-body-content .mw-heading1 { font-size: 3rem; line-height: 1.15; } <br />
<br />
<br />
<br />
/* === SIDEBAR MENU === */<br />
#mw-panel,<br />
.vector-menu-content,<br />
#p-navigation,<br />
#p-tb,<br />
#p-lang {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem; /* sidebar smaller for contrast */<br />
line-height: 1.4;<br />
}<br />
<br />
#mw-panel,<br />
.vector-menu-content {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 90%, rgba(192, 192, 192, 1) 100%);<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
#partner-logos {<br />
display: flex;<br />
justify-content: right;<br />
align-items: right;<br />
flex-wrap: wrap;<br />
gap: 1rem;<br />
margin-top:0.8rem;<br />
<br />
}<br />
<br />
#partner-logos img {<br />
height: 32px;<br />
object-fit: contain; /* keeps aspect ratio, fits within the box */<br />
max-width: 100%; /* prevents overflow */<br />
display: block; /* removes inline gaps below images */<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
.wikitable.custom-table {<br />
width: 100%;<br />
border-collapse: separate;<br />
border-spacing: 0;<br />
border: none;<br />
background-color: #fff;<br />
border-radius: 0.5rem;<br />
overflow: hidden; /* so rounded corners clip correctly */<br />
font-size: 0.95rem;<br />
}<br />
<br />
<br />
<br />
/* Header cells */<br />
.wikitable.custom-table th {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
color: #000;<br />
font-weight: 600;<br />
text-align: left;<br />
padding: 0.75rem 1rem;<br />
border-bottom: 2px solid #d0d9ff;<br />
}<br />
<br />
/* Data cells */<br />
.wikitable.custom-table td {<br />
padding: 0.65rem 1rem;<br />
border-bottom: 1px solid #eee;<br />
}<br />
<br />
/* Zebra striping */<br />
.wikitable.custom-table tr:nth-child(even) td {<br />
background-color: #f9fbff;<br />
}<br />
<br />
/* Hover effect */<br />
.wikitable.custom-table tr:hover td {<br />
background: #FFF;<br />
background: linear-gradient(0deg,rgba(0, 0, 255, 1) 0%, rgba(255, 255, 255, 1) 15%, rgba(255, 255, 255, 1) 85%, rgba(0, 0, 255, 1) 100%);<br />
}<br />
<br />
/* Rounded corners for first & last rows */<br />
.wikitable.custom-table tr:first-child th:first-child {<br />
border-top-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:first-child th:last-child {<br />
border-top-right-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:first-child {<br />
border-bottom-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:last-child {<br />
border-bottom-right-radius: 0.5rem;<br />
}<br />
<br />
<br />
/* === Mobile Responsive Tables (no HTML change needed) === */<br />
@media (max-width: 768px) {<br />
<br />
/* Allow horizontal scrolling on narrow screens */<br />
.wikitable.custom-table {<br />
display: block;<br />
width: 100%;<br />
overflow-x: auto;<br />
-webkit-overflow-scrolling: touch;<br />
}<br />
<br />
/* Prevent collapsing/squeezing of long cell content */<br />
.wikitable.custom-table tr,<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
white-space: nowrap;<br />
}<br />
<br />
/* Optional: slightly reduce padding for small screens */<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
padding: 0.5rem 0.75rem;<br />
}<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* Hide the automatic Tools and Special pages sections */<br />
#p-tb { <br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* MAIN-PAGE */<br />
<br />
/* === FONTS (yours) === */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
.mw-pt-languages {<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);}<br />
/* === GLOBAL TYPOGRAPHY === */<br />
html, body, .mw-body, .mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem;<br />
line-height: 1.1;<br />
}<br />
p, li, td, th { font-size: 1.1rem; line-height: 1.1; }<br />
h1, h2, h3, h4, h5, h6, .firstHeading, .mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
<br />
/* === d*sign week layout === */<br />
:root {<br />
--dw-border: #cfd8e3;<br />
--dw-card-bg: #f8fbff;<br />
}<br />
<br />
/* top ribbon */<br />
.dw-ribbon {<br />
height: 26px;<br />
background: linear-gradient(#8aa9ff, #ffffff);<br />
border-radius: 6px;<br />
margin: 0 0 14px 0;<br />
}<br />
<br />
<br />
.banner {<br />
display: flex;<br />
align-items: center;<br />
justify-content: space-between;<br />
gap: 1.5rem;<br />
padding: 0rem 1rem 0rem 1rem;<br />
text-align: left; /* centers text within its box */<br />
flex-wrap: wrap; <br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
background-size: 100% 200%;<br />
background-position: top;<br />
transition: background-position 0.4s ease-in-out;<br />
}<br />
.banner:hover {<br />
background-position: bottom;<br />
}<br />
<br />
<br />
.banner-icon img { <br />
width: 20vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 650px; /* prevent it from getting too big */ <br />
min-width: 120px; /* prevent it from getting too small */ <br />
padding-left: 2rem;}<br />
<br />
.dw-subtitle {<br />
font-size: 1.5rem;<br />
line-height: 1;<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle-banner {<br />
font-size: 3rem;<br />
}<br />
.dw-subtitle strong {<br />
<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle a {<br />
color: #0000FF !important; /* link color similar to your example */<br />
text-decoration: none;<br />
}<br />
<br />
.dw-subtitle a:hover {<br />
text-decoration: underline;<br />
}<br />
<br />
<br />
/* title & subtitle */<br />
.dw-title {<br />
text-align: center;<br />
line-height: 1.2;<br />
font-size: 2.5rem;<br />
font-weight: 700;<br />
letter-spacing: .02em;<br />
display: block;<br />
}<br />
<br />
<br />
/* grid */<br />
.dw-grid {<br />
display: flex;<br />
flex-wrap: wrap;<br />
gap: 16px;<br />
align-items: flex-start;<br />
margin-top: 14px;<br />
}<br />
.dw-col {<br />
flex: 1 1 520px;<br />
min-width: 320px;<br />
}<br />
<br />
/* cards */<br />
.dw-card {<br />
position: relative;<br />
border: 1px solid #C0C0C0;<br />
background: #FFFFFF !important;<br />
padding: 10px;<br />
margin-bottom: 10px;<br />
}<br />
.dw-card:hover {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 75%, rgba(192, 192, 192, 1) 100%)!important;<br />
}<br />
span.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
<br />
}<br />
<br />
.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 2rem !important; <br />
}<br />
<br />
<br />
.dw-card .dw-row {<br />
display: flex;<br />
flex-wrap: wrap;<br />
align-items: flex-start;<br />
gap: 12px;<br />
width: 100%;<br />
box-sizing: border-box;<br />
padding: 14px; /* ✅ move the spacing here instead of .dw-card */<br />
}<br />
<br />
.dw-card .dw-row > div:last-child {<br />
flex: 1;<br />
min-width: 0; /* ✅ prevents overflow due to long text/links */<br />
}<br />
<br />
.dw-card .dw-icon img { height: auto; }<br />
.dw-card .dw-headline {<br />
display: block;<br />
font-size: 1.5rem;<br />
font-weight: 700;<br />
margin: 0px 0 0px;<br />
}<br />
.dw-card .dw-body { line-height: 1.6; width: 100%;}<br />
.dw-card .dw-body--spacious { line-height: 1.8; }<br />
<br />
<br />
.dw-icon,<br />
.dw-subtitle {<br />
background: transparent !important; /* ✅ makes logo + text boxes transparent */<br />
}<br />
<br />
<br />
/* Code blocks explicitly monospace (so they don't inherit) */<br />
pre, code, kbd, samp, tt, .mw-code {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
text-indent: 0 !important;<br />
}<br />
<br />
/* ===== Remove first-line indentation site-wide ===== */<br />
.mw-parser-output p,<br />
.mw-parser-output li p,<br />
.mw-body-content p,<br />
.dw-card .dw-body p {<br />
text-indent: 0 !important;<br />
}<br />
<br />
<br />
pre {<br />
margin: 0 !important;<br />
padding: 0rem !important; /* add a little inner spacing so text isn’t on the edge */<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);<br />
border: none !important;<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
white-space: pre-wrap !important; /* allows wrapping */<br />
word-break: break-word !important;<br />
line-height: 1 !important;<br />
<br />
}<br />
<br />
.dw-card .pre {<br />
display: block; /* ensures it behaves as a block element */<br />
width: 100% !important;/* takes up the full width of .dw-card */<br />
box-sizing: border-box;/* includes padding/border in width calculation */<br />
margin: 0;<br />
padding: 0;<br />
}<br />
<br />
<br />
div.mw-content-ltr.mw-parser-output {<br />
background: #FFFFFF;<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 70%, rgba(192, 192, 192, 1) 100%);<br />
padding: 1rem;<br />
}<br />
<br />
div#content.mw-body {<br />
background: linear-gradient(to top, #0000FF, #ffffff) !important; /* blue → white gradient */<br />
}<br />
<br />
<br />
.mw-page-container {<br />
background-image: url("https://dsignweek.servus.at/images/9/9d/Bg-01.png");<br />
background-repeat: repeat-y; /* ✅ repeat vertically */<br />
background-size: 100% auto; /* stretch to page width, keep height natural */<br />
background-position: center top; /* start at the top, center horizontally */<br />
background-attachment: scroll; /* move with page scroll */<br />
background-color: #ffffff; /* fallback behind transparent areas */<br />
}<br />
<br />
div#mw-head {<br />
background: transparent !important;<br />
}<br />
<br />
<br />
.dw-headline, .mw-headline {<br />
margin: 0 !important;<br />
}<br />
<br />
.skin-vector-2022 header.vector-header { background: linear-gradient( 0deg, rgba(0, 0, 255, 1) 0%, rgba(255, 255, 255, 1) 10% ) !important; }<br />
<br />
.skin-vector-2022 #vector-sticky-header.vector-sticky-header {<br />
box-shadow: 0px 4px 12px rgba(0, 0, 255, 0.8) !important;<br />
}<br />
<br />
<br />
/* ===== Mobile: stack card content vertically ===== */<br />
@media (max-width: 720px) {<br />
<br />
.header-container.header-chrome {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 75%, rgba(192, 192, 192, 1) 95%);<br />
}<br />
.minerva-footer {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 75%, rgba(192, 192, 192, 1) 95%);<br />
}<br />
<br />
#content.mw-body {<br />
background: linear-gradient(to top, #0000FF, #ffffff) !important; /* blue → white gradient */<br />
}<br />
<br />
.dw-card {<br />
padding:0;}<br />
div#content.mw-body {<br />
padding: 0rem;}<br />
div.mw-content-ltr.mw-parser-output {<br />
padding: 0.5rem;<br />
}<br />
<br />
.banner-icon img { <br />
width: 80vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 650px; /* prevent it from getting too big */ <br />
min-width: 120px; /* prevent it from getting too small */ <br />
padding-left: 0rem;}<br />
<br />
/* Stack everything in a column */<br />
.dw-card .dw-row {<br />
display: flex;<br />
flex-direction: column;<br />
align-items: stretch; /* full width for text block */<br />
gap: 10px;<br />
}<br />
<br />
/* Make the icon its own row and center it */<br />
.dw-card .dw-icon {<br />
display: flex;<br />
justify-content: center;<br />
align-items: center;<br />
margin: 0; /* remove any left/right spacing from desktop */<br />
}<br />
<br />
.dw-card .dw-icon img {<br />
width: 72px; /* tidy mobile size */<br />
height: auto;<br />
}<br />
<br />
/* Ensure the text block fills width */<br />
.dw-card .dw-row > div {<br />
width: 100%;<br />
}<br />
<br />
/* Slight spacing tweaks for headings on mobile */<br />
.dw-card .dw-headline {<br />
margin: 4px 0 4px;<br />
}<br />
<br />
.partner-logos {<br />
display: flex;<br />
flex-wrap: wrap; /* allows wrapping on small screens */<br />
justify-content: space-between !important; <br />
align-items: center!important; <br />
gap: 1.4rem; <br />
padding: 0 1rem 1rem 1rem; /* breathing room top & bottom */<br />
background: transparent;<br />
}<br />
<br />
.partner-logos img {<br />
height: 24px;<br />
width: auto;<br />
object-fit:contain;<br />
}<br />
<br />
}</div>
Ivans
https://dsignweek.servus.at/index.php?title=MediaWiki:Common.css&diff=1416
MediaWiki:Common.css
2025-11-20T13:48:41Z
<p>Ivans: </p>
<hr />
<div>/* CSS placed here will be applied to all skins */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
#footer-info-lastmod {<br />
display: none !important;<br />
}<br />
<br />
/* Vector 2022: align user links (language, username, etc.) to the top */<br />
body.skin-vector-2022 .vector-user-links-main {<br />
display: flex; /* make sure it's flexbox */<br />
align-items: flex-start; /* align children to the top of the div */<br />
}<br />
/* Hide the Translate extension banner ("Translate this page; This page has changes…") */<br />
body.skin-vector-2022 .mw-pt-translate-header {<br />
display: none !important;<br />
}<br />
/* Vector 2022 – hide entire tab/navigation bar (left-navigation) for all users */<br />
.skin-vector-2022 #left-navigation {<br />
display: none !important;<br />
}<br />
/* Vector 2022: right-align items in the page toolbar (Edit / View history / Tools) */<br />
.skin-vector-2022 .vector-page-toolbar-container {<br />
display: flex !important;<br />
justify-content: flex-end !important; /* pushes items to the right */<br />
align-items: center; /* vertical alignment */<br />
}<br />
<br />
<br />
<br />
.mw-anon.skin-vector-2022 #ca-nstab-main, /* page title tab (Main Page / Article) */<br />
.mw-anon.skin-vector-2022 #ca-talk, /* Talk tab */<br />
.mw-anon.skin-vector-2022 #ca-view, /* "Read" tab */<br />
.mw-anon.skin-vector-2022 #ca-history, /* View history */<br />
.mw-anon.skin-vector-2022 #ca-watch,<br />
.mw-anon.skin-vector-2022 #ca-unwatch,<br />
.mw-anon.skin-vector-2022 #ca-more { /* "Tools" dropdown */<br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* === GLOBAL TYPOGRAPHY === */<br />
<br />
/* Base body text — Liberation Sans */<br />
html,<br />
body,<br />
.mw-body,<br />
.mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 1.2rem; /* base = 16px */<br />
line-height: 1.15; <br />
}<br />
<br />
/* Paragraphs and list text */<br />
p, li, td, th {<br />
font-size: 1.1rem; /* slightly larger than base text */<br />
}<br />
<br />
/* === HEADINGS — Linux Libertine === */<br />
h1, h2, h3, h4, h5, h6,<br />
.firstHeading,<br />
.mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
.mw-body h1, .mw-heading1, .mw-body-content h1, .mw-body-content .mw-heading1 { font-size: 3rem; line-height: 1.15; } <br />
<br />
<br />
<br />
/* === SIDEBAR MENU === */<br />
#mw-panel,<br />
.vector-menu-content,<br />
#p-navigation,<br />
#p-tb,<br />
#p-lang {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem; /* sidebar smaller for contrast */<br />
line-height: 1.4;<br />
}<br />
<br />
#mw-panel,<br />
.vector-menu-content {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 90%, rgba(192, 192, 192, 1) 100%);<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
#partner-logos {<br />
display: flex;<br />
justify-content: right;<br />
align-items: right;<br />
flex-wrap: wrap;<br />
gap: 1rem;<br />
margin-top:0.8rem;<br />
<br />
}<br />
<br />
#partner-logos img {<br />
height: 32px;<br />
object-fit: contain; /* keeps aspect ratio, fits within the box */<br />
max-width: 100%; /* prevents overflow */<br />
display: block; /* removes inline gaps below images */<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
.wikitable.custom-table {<br />
width: 100%;<br />
border-collapse: separate;<br />
border-spacing: 0;<br />
border: none;<br />
background-color: #fff;<br />
border-radius: 0.5rem;<br />
overflow: hidden; /* so rounded corners clip correctly */<br />
font-size: 0.95rem;<br />
}<br />
<br />
<br />
<br />
/* Header cells */<br />
.wikitable.custom-table th {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
color: #000;<br />
font-weight: 600;<br />
text-align: left;<br />
padding: 0.75rem 1rem;<br />
border-bottom: 2px solid #d0d9ff;<br />
}<br />
<br />
/* Data cells */<br />
.wikitable.custom-table td {<br />
padding: 0.65rem 1rem;<br />
border-bottom: 1px solid #eee;<br />
}<br />
<br />
/* Zebra striping */<br />
.wikitable.custom-table tr:nth-child(even) td {<br />
background-color: #f9fbff;<br />
}<br />
<br />
/* Hover effect */<br />
.wikitable.custom-table tr:hover td {<br />
background: #FFF;<br />
background: linear-gradient(0deg,rgba(0, 0, 255, 1) 0%, rgba(255, 255, 255, 1) 15%, rgba(255, 255, 255, 1) 85%, rgba(0, 0, 255, 1) 100%);<br />
}<br />
<br />
/* Rounded corners for first & last rows */<br />
.wikitable.custom-table tr:first-child th:first-child {<br />
border-top-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:first-child th:last-child {<br />
border-top-right-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:first-child {<br />
border-bottom-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:last-child {<br />
border-bottom-right-radius: 0.5rem;<br />
}<br />
<br />
<br />
/* === Mobile Responsive Tables (no HTML change needed) === */<br />
@media (max-width: 768px) {<br />
<br />
/* Allow horizontal scrolling on narrow screens */<br />
.wikitable.custom-table {<br />
display: block;<br />
width: 100%;<br />
overflow-x: auto;<br />
-webkit-overflow-scrolling: touch;<br />
}<br />
<br />
/* Prevent collapsing/squeezing of long cell content */<br />
.wikitable.custom-table tr,<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
white-space: nowrap;<br />
}<br />
<br />
/* Optional: slightly reduce padding for small screens */<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
padding: 0.5rem 0.75rem;<br />
}<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* Hide the automatic Tools and Special pages sections */<br />
#p-tb { <br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* MAIN-PAGE */<br />
<br />
/* === FONTS (yours) === */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
.mw-pt-languages {<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);}<br />
/* === GLOBAL TYPOGRAPHY === */<br />
html, body, .mw-body, .mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem;<br />
line-height: 1.1;<br />
}<br />
p, li, td, th { font-size: 1.1rem; line-height: 1.1; }<br />
h1, h2, h3, h4, h5, h6, .firstHeading, .mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
<br />
/* === d*sign week layout === */<br />
:root {<br />
--dw-border: #cfd8e3;<br />
--dw-card-bg: #f8fbff;<br />
}<br />
<br />
/* top ribbon */<br />
.dw-ribbon {<br />
height: 26px;<br />
background: linear-gradient(#8aa9ff, #ffffff);<br />
border-radius: 6px;<br />
margin: 0 0 14px 0;<br />
}<br />
<br />
<br />
.banner {<br />
display: flex;<br />
align-items: center;<br />
justify-content: space-between;<br />
gap: 1.5rem;<br />
padding: 0rem 1rem 0rem 1rem;<br />
text-align: left; /* centers text within its box */<br />
flex-wrap: wrap; <br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
background-size: 100% 200%;<br />
background-position: top;<br />
transition: background-position 0.4s ease-in-out;<br />
}<br />
.banner:hover {<br />
background-position: bottom;<br />
}<br />
<br />
<br />
.banner-icon img { <br />
width: 20vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 650px; /* prevent it from getting too big */ <br />
min-width: 120px; /* prevent it from getting too small */ <br />
padding-left: 2rem;}<br />
<br />
.dw-subtitle {<br />
font-size: 1.5rem;<br />
line-height: 1;<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle-banner {<br />
font-size: 3rem;<br />
}<br />
.dw-subtitle strong {<br />
<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle a {<br />
color: #0000FF !important; /* link color similar to your example */<br />
text-decoration: none;<br />
}<br />
<br />
.dw-subtitle a:hover {<br />
text-decoration: underline;<br />
}<br />
<br />
<br />
/* title & subtitle */<br />
.dw-title {<br />
text-align: center;<br />
line-height: 1.2;<br />
font-size: 2.5rem;<br />
font-weight: 700;<br />
letter-spacing: .02em;<br />
display: block;<br />
}<br />
<br />
<br />
/* grid */<br />
.dw-grid {<br />
display: flex;<br />
flex-wrap: wrap;<br />
gap: 16px;<br />
align-items: flex-start;<br />
margin-top: 14px;<br />
}<br />
.dw-col {<br />
flex: 1 1 520px;<br />
min-width: 320px;<br />
}<br />
<br />
/* cards */<br />
.dw-card {<br />
position: relative;<br />
border: 1px solid #C0C0C0;<br />
background: #FFFFFF !important;<br />
padding: 10px;<br />
margin-bottom: 10px;<br />
}<br />
.dw-card:hover {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 75%, rgba(192, 192, 192, 1) 100%)!important;<br />
}<br />
span.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
<br />
}<br />
<br />
.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 2rem !important; <br />
}<br />
<br />
<br />
.dw-card .dw-row {<br />
display: flex;<br />
flex-wrap: wrap;<br />
align-items: flex-start;<br />
gap: 12px;<br />
width: 100%;<br />
box-sizing: border-box;<br />
padding: 14px; /* ✅ move the spacing here instead of .dw-card */<br />
}<br />
<br />
.dw-card .dw-row > div:last-child {<br />
flex: 1;<br />
min-width: 0; /* ✅ prevents overflow due to long text/links */<br />
}<br />
<br />
.dw-card .dw-icon img { height: auto; }<br />
.dw-card .dw-headline {<br />
display: block;<br />
font-size: 1.5rem;<br />
font-weight: 700;<br />
margin: 0px 0 0px;<br />
}<br />
.dw-card .dw-body { line-height: 1.6; width: 100%;}<br />
.dw-card .dw-body--spacious { line-height: 1.8; }<br />
<br />
<br />
.dw-icon,<br />
.dw-subtitle {<br />
background: transparent !important; /* ✅ makes logo + text boxes transparent */<br />
}<br />
<br />
<br />
/* Code blocks explicitly monospace (so they don't inherit) */<br />
pre, code, kbd, samp, tt, .mw-code {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
text-indent: 0 !important;<br />
}<br />
<br />
/* ===== Remove first-line indentation site-wide ===== */<br />
.mw-parser-output p,<br />
.mw-parser-output li p,<br />
.mw-body-content p,<br />
.dw-card .dw-body p {<br />
text-indent: 0 !important;<br />
}<br />
<br />
<br />
pre {<br />
margin: 0 !important;<br />
padding: 0rem !important; /* add a little inner spacing so text isn’t on the edge */<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);<br />
border: none !important;<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
white-space: pre-wrap !important; /* allows wrapping */<br />
word-break: break-word !important;<br />
line-height: 1 !important;<br />
<br />
}<br />
<br />
.dw-card .pre {<br />
display: block; /* ensures it behaves as a block element */<br />
width: 100% !important;/* takes up the full width of .dw-card */<br />
box-sizing: border-box;/* includes padding/border in width calculation */<br />
margin: 0;<br />
padding: 0;<br />
}<br />
<br />
<br />
div.mw-content-ltr.mw-parser-output {<br />
background: #FFFFFF;<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 0%, rgba(255, 255, 255, 1) 40%);<br />
padding: 1rem;<br />
}<br />
<br />
div#content.mw-body {<br />
background: linear-gradient(to top, #0000FF, #ffffff) !important; /* blue → white gradient */<br />
}<br />
<br />
<br />
.mw-page-container {<br />
background-image: url("https://dsignweek.servus.at/images/9/9d/Bg-01.png");<br />
background-repeat: repeat-y; /* ✅ repeat vertically */<br />
background-size: 100% auto; /* stretch to page width, keep height natural */<br />
background-position: center top; /* start at the top, center horizontally */<br />
background-attachment: scroll; /* move with page scroll */<br />
background-color: #ffffff; /* fallback behind transparent areas */<br />
}<br />
<br />
div#mw-head {<br />
background: transparent !important;<br />
}<br />
<br />
<br />
.dw-headline, .mw-headline {<br />
margin: 0 !important;<br />
}<br />
<br />
.skin-vector-2022 header.vector-header { background: linear-gradient( 0deg, rgba(0, 0, 255, 1) 0%, rgba(255, 255, 255, 1) 10% ) !important; }<br />
<br />
.skin-vector-2022 #vector-sticky-header.vector-sticky-header {<br />
box-shadow: 0px 4px 12px rgba(0, 0, 255, 0.8) !important;<br />
}<br />
<br />
<br />
/* ===== Mobile: stack card content vertically ===== */<br />
@media (max-width: 720px) {<br />
<br />
.header-container.header-chrome {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 75%, rgba(192, 192, 192, 1) 95%);<br />
}<br />
.minerva-footer {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 75%, rgba(192, 192, 192, 1) 95%);<br />
}<br />
<br />
#content.mw-body {<br />
background: linear-gradient(to top, #0000FF, #ffffff) !important; /* blue → white gradient */<br />
}<br />
<br />
.dw-card {<br />
padding:0;}<br />
div#content.mw-body {<br />
padding: 0rem;}<br />
div.mw-content-ltr.mw-parser-output {<br />
padding: 0.5rem;<br />
}<br />
<br />
.banner-icon img { <br />
width: 80vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 650px; /* prevent it from getting too big */ <br />
min-width: 120px; /* prevent it from getting too small */ <br />
padding-left: 0rem;}<br />
<br />
/* Stack everything in a column */<br />
.dw-card .dw-row {<br />
display: flex;<br />
flex-direction: column;<br />
align-items: stretch; /* full width for text block */<br />
gap: 10px;<br />
}<br />
<br />
/* Make the icon its own row and center it */<br />
.dw-card .dw-icon {<br />
display: flex;<br />
justify-content: center;<br />
align-items: center;<br />
margin: 0; /* remove any left/right spacing from desktop */<br />
}<br />
<br />
.dw-card .dw-icon img {<br />
width: 72px; /* tidy mobile size */<br />
height: auto;<br />
}<br />
<br />
/* Ensure the text block fills width */<br />
.dw-card .dw-row > div {<br />
width: 100%;<br />
}<br />
<br />
/* Slight spacing tweaks for headings on mobile */<br />
.dw-card .dw-headline {<br />
margin: 4px 0 4px;<br />
}<br />
<br />
.partner-logos {<br />
display: flex;<br />
flex-wrap: wrap; /* allows wrapping on small screens */<br />
justify-content: space-between !important; <br />
align-items: center!important; <br />
gap: 1.4rem; <br />
padding: 0 1rem 1rem 1rem; /* breathing room top & bottom */<br />
background: transparent;<br />
}<br />
<br />
.partner-logos img {<br />
height: 24px;<br />
width: auto;<br />
object-fit:contain;<br />
}<br />
<br />
}</div>
Ivans
https://dsignweek.servus.at/index.php?title=MediaWiki:Common.css&diff=1415
MediaWiki:Common.css
2025-11-20T13:46:05Z
<p>Ivans: </p>
<hr />
<div>/* CSS placed here will be applied to all skins */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
#footer-info-lastmod {<br />
display: none !important;<br />
}<br />
<br />
/* Vector 2022: align user links (language, username, etc.) to the top */<br />
body.skin-vector-2022 .vector-user-links-main {<br />
display: flex; /* make sure it's flexbox */<br />
align-items: flex-start; /* align children to the top of the div */<br />
}<br />
/* Hide the Translate extension banner ("Translate this page; This page has changes…") */<br />
body.skin-vector-2022 .mw-pt-translate-header {<br />
display: none !important;<br />
}<br />
/* Vector 2022 – hide entire tab/navigation bar (left-navigation) for all users */<br />
.skin-vector-2022 #left-navigation {<br />
display: none !important;<br />
}<br />
/* Vector 2022: right-align items in the page toolbar (Edit / View history / Tools) */<br />
.skin-vector-2022 .vector-page-toolbar-container {<br />
display: flex !important;<br />
justify-content: flex-end !important; /* pushes items to the right */<br />
align-items: center; /* vertical alignment */<br />
}<br />
<br />
<br />
<br />
.mw-anon.skin-vector-2022 #ca-nstab-main, /* page title tab (Main Page / Article) */<br />
.mw-anon.skin-vector-2022 #ca-talk, /* Talk tab */<br />
.mw-anon.skin-vector-2022 #ca-view, /* "Read" tab */<br />
.mw-anon.skin-vector-2022 #ca-history, /* View history */<br />
.mw-anon.skin-vector-2022 #ca-watch,<br />
.mw-anon.skin-vector-2022 #ca-unwatch,<br />
.mw-anon.skin-vector-2022 #ca-more { /* "Tools" dropdown */<br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* === GLOBAL TYPOGRAPHY === */<br />
<br />
/* Base body text — Liberation Sans */<br />
html,<br />
body,<br />
.mw-body,<br />
.mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 1.2rem; /* base = 16px */<br />
line-height: 1.15; <br />
}<br />
<br />
/* Paragraphs and list text */<br />
p, li, td, th {<br />
font-size: 1.1rem; /* slightly larger than base text */<br />
}<br />
<br />
/* === HEADINGS — Linux Libertine === */<br />
h1, h2, h3, h4, h5, h6,<br />
.firstHeading,<br />
.mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
.mw-body h1, .mw-heading1, .mw-body-content h1, .mw-body-content .mw-heading1 { font-size: 3rem; line-height: 1.15; } <br />
<br />
<br />
<br />
/* === SIDEBAR MENU === */<br />
#mw-panel,<br />
.vector-menu-content,<br />
#p-navigation,<br />
#p-tb,<br />
#p-lang {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem; /* sidebar smaller for contrast */<br />
line-height: 1.4;<br />
}<br />
<br />
#mw-panel,<br />
.vector-menu-content {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 90%, rgba(192, 192, 192, 1) 100%);<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
#partner-logos {<br />
display: flex;<br />
justify-content: right;<br />
align-items: right;<br />
flex-wrap: wrap;<br />
gap: 1rem;<br />
margin-top:0.8rem;<br />
<br />
}<br />
<br />
#partner-logos img {<br />
height: 32px;<br />
object-fit: contain; /* keeps aspect ratio, fits within the box */<br />
max-width: 100%; /* prevents overflow */<br />
display: block; /* removes inline gaps below images */<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
.wikitable.custom-table {<br />
width: 100%;<br />
border-collapse: separate;<br />
border-spacing: 0;<br />
border: none;<br />
background-color: #fff;<br />
border-radius: 0.5rem;<br />
overflow: hidden; /* so rounded corners clip correctly */<br />
font-size: 0.95rem;<br />
}<br />
<br />
<br />
<br />
/* Header cells */<br />
.wikitable.custom-table th {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
color: #000;<br />
font-weight: 600;<br />
text-align: left;<br />
padding: 0.75rem 1rem;<br />
border-bottom: 2px solid #d0d9ff;<br />
}<br />
<br />
/* Data cells */<br />
.wikitable.custom-table td {<br />
padding: 0.65rem 1rem;<br />
border-bottom: 1px solid #eee;<br />
}<br />
<br />
/* Zebra striping */<br />
.wikitable.custom-table tr:nth-child(even) td {<br />
background-color: #f9fbff;<br />
}<br />
<br />
/* Hover effect */<br />
.wikitable.custom-table tr:hover td {<br />
background: #FFF;<br />
background: linear-gradient(0deg,rgba(0, 0, 255, 1) 0%, rgba(255, 255, 255, 1) 15%, rgba(255, 255, 255, 1) 85%, rgba(0, 0, 255, 1) 100%);<br />
}<br />
<br />
/* Rounded corners for first & last rows */<br />
.wikitable.custom-table tr:first-child th:first-child {<br />
border-top-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:first-child th:last-child {<br />
border-top-right-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:first-child {<br />
border-bottom-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:last-child {<br />
border-bottom-right-radius: 0.5rem;<br />
}<br />
<br />
<br />
/* === Mobile Responsive Tables (no HTML change needed) === */<br />
@media (max-width: 768px) {<br />
<br />
/* Allow horizontal scrolling on narrow screens */<br />
.wikitable.custom-table {<br />
display: block;<br />
width: 100%;<br />
overflow-x: auto;<br />
-webkit-overflow-scrolling: touch;<br />
}<br />
<br />
/* Prevent collapsing/squeezing of long cell content */<br />
.wikitable.custom-table tr,<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
white-space: nowrap;<br />
}<br />
<br />
/* Optional: slightly reduce padding for small screens */<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
padding: 0.5rem 0.75rem;<br />
}<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* Hide the automatic Tools and Special pages sections */<br />
#p-tb { <br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* MAIN-PAGE */<br />
<br />
/* === FONTS (yours) === */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
.mw-pt-languages {<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);}<br />
/* === GLOBAL TYPOGRAPHY === */<br />
html, body, .mw-body, .mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem;<br />
line-height: 1.1;<br />
}<br />
p, li, td, th { font-size: 1.1rem; line-height: 1.1; }<br />
h1, h2, h3, h4, h5, h6, .firstHeading, .mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
<br />
/* === d*sign week layout === */<br />
:root {<br />
--dw-border: #cfd8e3;<br />
--dw-card-bg: #f8fbff;<br />
}<br />
<br />
/* top ribbon */<br />
.dw-ribbon {<br />
height: 26px;<br />
background: linear-gradient(#8aa9ff, #ffffff);<br />
border-radius: 6px;<br />
margin: 0 0 14px 0;<br />
}<br />
<br />
<br />
.banner {<br />
display: flex;<br />
align-items: center;<br />
justify-content: space-between;<br />
gap: 1.5rem;<br />
padding: 0rem 1rem 0rem 1rem;<br />
text-align: left; /* centers text within its box */<br />
flex-wrap: wrap; <br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
background-size: 100% 200%;<br />
background-position: top;<br />
transition: background-position 0.4s ease-in-out;<br />
}<br />
.banner:hover {<br />
background-position: bottom;<br />
}<br />
<br />
<br />
.banner-icon img { <br />
width: 20vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 650px; /* prevent it from getting too big */ <br />
min-width: 120px; /* prevent it from getting too small */ <br />
padding-left: 2rem;}<br />
<br />
.dw-subtitle {<br />
font-size: 1.5rem;<br />
line-height: 1;<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle-banner {<br />
font-size: 3rem;<br />
}<br />
.dw-subtitle strong {<br />
<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle a {<br />
color: #0000FF !important; /* link color similar to your example */<br />
text-decoration: none;<br />
}<br />
<br />
.dw-subtitle a:hover {<br />
text-decoration: underline;<br />
}<br />
<br />
<br />
/* title & subtitle */<br />
.dw-title {<br />
text-align: center;<br />
line-height: 1.2;<br />
font-size: 2.5rem;<br />
font-weight: 700;<br />
letter-spacing: .02em;<br />
display: block;<br />
}<br />
<br />
<br />
/* grid */<br />
.dw-grid {<br />
display: flex;<br />
flex-wrap: wrap;<br />
gap: 16px;<br />
align-items: flex-start;<br />
margin-top: 14px;<br />
}<br />
.dw-col {<br />
flex: 1 1 520px;<br />
min-width: 320px;<br />
}<br />
<br />
/* cards */<br />
.dw-card {<br />
position: relative;<br />
border: 1px solid #C0C0C0;<br />
background: #FFFFFF !important;<br />
padding: 10px;<br />
margin-bottom: 10px;<br />
}<br />
.dw-card:hover {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 75%, rgba(192, 192, 192, 1) 100%)!important;<br />
}<br />
span.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
<br />
}<br />
<br />
.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 2rem !important; <br />
}<br />
<br />
<br />
.dw-card .dw-row {<br />
display: flex;<br />
flex-wrap: wrap;<br />
align-items: flex-start;<br />
gap: 12px;<br />
width: 100%;<br />
box-sizing: border-box;<br />
padding: 14px; /* ✅ move the spacing here instead of .dw-card */<br />
}<br />
<br />
.dw-card .dw-row > div:last-child {<br />
flex: 1;<br />
min-width: 0; /* ✅ prevents overflow due to long text/links */<br />
}<br />
<br />
.dw-card .dw-icon img { height: auto; }<br />
.dw-card .dw-headline {<br />
display: block;<br />
font-size: 1.5rem;<br />
font-weight: 700;<br />
margin: 0px 0 0px;<br />
}<br />
.dw-card .dw-body { line-height: 1.6; width: 100%;}<br />
.dw-card .dw-body--spacious { line-height: 1.8; }<br />
<br />
<br />
.dw-icon,<br />
.dw-subtitle {<br />
background: transparent !important; /* ✅ makes logo + text boxes transparent */<br />
}<br />
<br />
<br />
/* Code blocks explicitly monospace (so they don't inherit) */<br />
pre, code, kbd, samp, tt, .mw-code {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
text-indent: 0 !important;<br />
}<br />
<br />
/* ===== Remove first-line indentation site-wide ===== */<br />
.mw-parser-output p,<br />
.mw-parser-output li p,<br />
.mw-body-content p,<br />
.dw-card .dw-body p {<br />
text-indent: 0 !important;<br />
}<br />
<br />
<br />
pre {<br />
margin: 0 !important;<br />
padding: 0rem !important; /* add a little inner spacing so text isn’t on the edge */<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);<br />
border: none !important;<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
white-space: pre-wrap !important; /* allows wrapping */<br />
word-break: break-word !important;<br />
line-height: 1 !important;<br />
<br />
}<br />
<br />
.dw-card .pre {<br />
display: block; /* ensures it behaves as a block element */<br />
width: 100% !important;/* takes up the full width of .dw-card */<br />
box-sizing: border-box;/* includes padding/border in width calculation */<br />
margin: 0;<br />
padding: 0;<br />
}<br />
<br />
<br />
div.mw-content-ltr.mw-parser-output {<br />
background: #FFFFFF;<br />
<br />
padding: 1rem;<br />
}<br />
<br />
div#content.mw-body {<br />
background: linear-gradient(to top, #0000FF, #ffffff) !important; /* blue → white gradient */<br />
}<br />
<br />
<br />
.mw-page-container {<br />
background-image: url("https://dsignweek.servus.at/images/9/9d/Bg-01.png");<br />
background-repeat: repeat-y; /* ✅ repeat vertically */<br />
background-size: 100% auto; /* stretch to page width, keep height natural */<br />
background-position: center top; /* start at the top, center horizontally */<br />
background-attachment: scroll; /* move with page scroll */<br />
background-color: #ffffff; /* fallback behind transparent areas */<br />
}<br />
<br />
div#mw-head {<br />
background: transparent !important;<br />
}<br />
<br />
<br />
.dw-headline, .mw-headline {<br />
margin: 0 !important;<br />
}<br />
<br />
.skin-vector-2022 header.vector-header { background: linear-gradient( 0deg, rgba(0, 0, 255, 1) 0%, rgba(255, 255, 255, 1) 10% ) !important; }<br />
<br />
.skin-vector-2022 #vector-sticky-header.vector-sticky-header {<br />
box-shadow: 0px 4px 12px rgba(0, 0, 255, 0.8) !important;<br />
}<br />
<br />
<br />
/* ===== Mobile: stack card content vertically ===== */<br />
@media (max-width: 720px) {<br />
<br />
.header-container.header-chrome {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 75%, rgba(192, 192, 192, 1) 95%);<br />
}<br />
.minerva-footer {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 75%, rgba(192, 192, 192, 1) 95%);<br />
}<br />
<br />
#content.mw-body {<br />
background: linear-gradient(to top, #0000FF, #ffffff) !important; /* blue → white gradient */<br />
}<br />
<br />
.dw-card {<br />
padding:0;}<br />
div#content.mw-body {<br />
padding: 0rem;}<br />
div.mw-content-ltr.mw-parser-output {<br />
padding: 0.5rem;<br />
}<br />
<br />
.banner-icon img { <br />
width: 80vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 650px; /* prevent it from getting too big */ <br />
min-width: 120px; /* prevent it from getting too small */ <br />
padding-left: 0rem;}<br />
<br />
/* Stack everything in a column */<br />
.dw-card .dw-row {<br />
display: flex;<br />
flex-direction: column;<br />
align-items: stretch; /* full width for text block */<br />
gap: 10px;<br />
}<br />
<br />
/* Make the icon its own row and center it */<br />
.dw-card .dw-icon {<br />
display: flex;<br />
justify-content: center;<br />
align-items: center;<br />
margin: 0; /* remove any left/right spacing from desktop */<br />
}<br />
<br />
.dw-card .dw-icon img {<br />
width: 72px; /* tidy mobile size */<br />
height: auto;<br />
}<br />
<br />
/* Ensure the text block fills width */<br />
.dw-card .dw-row > div {<br />
width: 100%;<br />
}<br />
<br />
/* Slight spacing tweaks for headings on mobile */<br />
.dw-card .dw-headline {<br />
margin: 4px 0 4px;<br />
}<br />
<br />
.partner-logos {<br />
display: flex;<br />
flex-wrap: wrap; /* allows wrapping on small screens */<br />
justify-content: space-between !important; <br />
align-items: center!important; <br />
gap: 1.4rem; <br />
padding: 0 1rem 1rem 1rem; /* breathing room top & bottom */<br />
background: transparent;<br />
}<br />
<br />
.partner-logos img {<br />
height: 24px;<br />
width: auto;<br />
object-fit:contain;<br />
}<br />
<br />
}</div>
Ivans
https://dsignweek.servus.at/index.php?title=MediaWiki:Common.css&diff=1411
MediaWiki:Common.css
2025-11-20T13:44:27Z
<p>Ivans: </p>
<hr />
<div>/* CSS placed here will be applied to all skins */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
#footer-info-lastmod {<br />
display: none !important;<br />
}<br />
<br />
/* Vector 2022: align user links (language, username, etc.) to the top */<br />
body.skin-vector-2022 .vector-user-links-main {<br />
display: flex; /* make sure it's flexbox */<br />
align-items: flex-start; /* align children to the top of the div */<br />
}<br />
/* Hide the Translate extension banner ("Translate this page; This page has changes…") */<br />
body.skin-vector-2022 .mw-pt-translate-header {<br />
display: none !important;<br />
}<br />
/* Vector 2022 – hide entire tab/navigation bar (left-navigation) for all users */<br />
.skin-vector-2022 #left-navigation {<br />
display: none !important;<br />
}<br />
/* Vector 2022: right-align items in the page toolbar (Edit / View history / Tools) */<br />
.skin-vector-2022 .vector-page-toolbar-container {<br />
display: flex !important;<br />
justify-content: flex-end !important; /* pushes items to the right */<br />
align-items: center; /* vertical alignment */<br />
}<br />
<br />
<br />
<br />
.mw-anon.skin-vector-2022 #ca-nstab-main, /* page title tab (Main Page / Article) */<br />
.mw-anon.skin-vector-2022 #ca-talk, /* Talk tab */<br />
.mw-anon.skin-vector-2022 #ca-view, /* "Read" tab */<br />
.mw-anon.skin-vector-2022 #ca-history, /* View history */<br />
.mw-anon.skin-vector-2022 #ca-watch,<br />
.mw-anon.skin-vector-2022 #ca-unwatch,<br />
.mw-anon.skin-vector-2022 #ca-more { /* "Tools" dropdown */<br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* === GLOBAL TYPOGRAPHY === */<br />
<br />
/* Base body text — Liberation Sans */<br />
html,<br />
body,<br />
.mw-body,<br />
.mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 1.2rem; /* base = 16px */<br />
line-height: 1.15; <br />
}<br />
<br />
/* Paragraphs and list text */<br />
p, li, td, th {<br />
font-size: 1.1rem; /* slightly larger than base text */<br />
}<br />
<br />
/* === HEADINGS — Linux Libertine === */<br />
h1, h2, h3, h4, h5, h6,<br />
.firstHeading,<br />
.mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
.mw-body h1, .mw-heading1, .mw-body-content h1, .mw-body-content .mw-heading1 { font-size: 3rem; line-height: 1.15; } <br />
<br />
<br />
<br />
/* === SIDEBAR MENU === */<br />
#mw-panel,<br />
.vector-menu-content,<br />
#p-navigation,<br />
#p-tb,<br />
#p-lang {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem; /* sidebar smaller for contrast */<br />
line-height: 1.4;<br />
}<br />
<br />
#mw-panel,<br />
.vector-menu-content {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 90%, rgba(192, 192, 192, 1) 100%);<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
#partner-logos {<br />
display: flex;<br />
justify-content: right;<br />
align-items: right;<br />
flex-wrap: wrap;<br />
gap: 1rem;<br />
margin-top:0.8rem;<br />
<br />
}<br />
<br />
#partner-logos img {<br />
height: 32px;<br />
object-fit: contain; /* keeps aspect ratio, fits within the box */<br />
max-width: 100%; /* prevents overflow */<br />
display: block; /* removes inline gaps below images */<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
.wikitable.custom-table {<br />
width: 100%;<br />
border-collapse: separate;<br />
border-spacing: 0;<br />
border: none;<br />
background-color: #fff;<br />
border-radius: 0.5rem;<br />
overflow: hidden; /* so rounded corners clip correctly */<br />
font-size: 0.95rem;<br />
}<br />
<br />
<br />
<br />
/* Header cells */<br />
.wikitable.custom-table th {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
color: #000;<br />
font-weight: 600;<br />
text-align: left;<br />
padding: 0.75rem 1rem;<br />
border-bottom: 2px solid #d0d9ff;<br />
}<br />
<br />
/* Data cells */<br />
.wikitable.custom-table td {<br />
padding: 0.65rem 1rem;<br />
border-bottom: 1px solid #eee;<br />
}<br />
<br />
/* Zebra striping */<br />
.wikitable.custom-table tr:nth-child(even) td {<br />
background-color: #f9fbff;<br />
}<br />
<br />
/* Hover effect */<br />
.wikitable.custom-table tr:hover td {<br />
background: #FFF;<br />
background: linear-gradient(0deg,rgba(0, 0, 255, 1) 0%, rgba(255, 255, 255, 1) 15%, rgba(255, 255, 255, 1) 85%, rgba(0, 0, 255, 1) 100%);<br />
}<br />
<br />
/* Rounded corners for first & last rows */<br />
.wikitable.custom-table tr:first-child th:first-child {<br />
border-top-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:first-child th:last-child {<br />
border-top-right-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:first-child {<br />
border-bottom-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:last-child {<br />
border-bottom-right-radius: 0.5rem;<br />
}<br />
<br />
<br />
/* === Mobile Responsive Tables (no HTML change needed) === */<br />
@media (max-width: 768px) {<br />
<br />
/* Allow horizontal scrolling on narrow screens */<br />
.wikitable.custom-table {<br />
display: block;<br />
width: 100%;<br />
overflow-x: auto;<br />
-webkit-overflow-scrolling: touch;<br />
}<br />
<br />
/* Prevent collapsing/squeezing of long cell content */<br />
.wikitable.custom-table tr,<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
white-space: nowrap;<br />
}<br />
<br />
/* Optional: slightly reduce padding for small screens */<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
padding: 0.5rem 0.75rem;<br />
}<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* Hide the automatic Tools and Special pages sections */<br />
#p-tb { <br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* MAIN-PAGE */<br />
<br />
/* === FONTS (yours) === */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
.mw-pt-languages {<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);}<br />
/* === GLOBAL TYPOGRAPHY === */<br />
html, body, .mw-body, .mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem;<br />
line-height: 1.1;<br />
}<br />
p, li, td, th { font-size: 1.1rem; line-height: 1.1; }<br />
h1, h2, h3, h4, h5, h6, .firstHeading, .mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
<br />
/* === d*sign week layout === */<br />
:root {<br />
--dw-border: #cfd8e3;<br />
--dw-card-bg: #f8fbff;<br />
}<br />
<br />
/* top ribbon */<br />
.dw-ribbon {<br />
height: 26px;<br />
background: linear-gradient(#8aa9ff, #ffffff);<br />
border-radius: 6px;<br />
margin: 0 0 14px 0;<br />
}<br />
<br />
<br />
.banner {<br />
display: flex;<br />
align-items: center;<br />
justify-content: space-between;<br />
gap: 1.5rem;<br />
padding: 0rem 1rem 0rem 1rem;<br />
text-align: left; /* centers text within its box */<br />
flex-wrap: wrap; <br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
background-size: 100% 200%;<br />
background-position: top;<br />
transition: background-position 0.4s ease-in-out;<br />
}<br />
.banner:hover {<br />
background-position: bottom;<br />
}<br />
<br />
<br />
.banner-icon img { <br />
width: 20vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 650px; /* prevent it from getting too big */ <br />
min-width: 120px; /* prevent it from getting too small */ <br />
padding-left: 2rem;}<br />
<br />
.dw-subtitle {<br />
font-size: 1.5rem;<br />
line-height: 1;<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle-banner {<br />
font-size: 3rem;<br />
}<br />
.dw-subtitle strong {<br />
<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle a {<br />
color: #0000FF !important; /* link color similar to your example */<br />
text-decoration: none;<br />
}<br />
<br />
.dw-subtitle a:hover {<br />
text-decoration: underline;<br />
}<br />
<br />
<br />
/* title & subtitle */<br />
.dw-title {<br />
text-align: center;<br />
line-height: 1.2;<br />
font-size: 2.5rem;<br />
font-weight: 700;<br />
letter-spacing: .02em;<br />
display: block;<br />
}<br />
<br />
<br />
/* grid */<br />
.dw-grid {<br />
display: flex;<br />
flex-wrap: wrap;<br />
gap: 16px;<br />
align-items: flex-start;<br />
margin-top: 14px;<br />
}<br />
.dw-col {<br />
flex: 1 1 520px;<br />
min-width: 320px;<br />
}<br />
<br />
/* cards */<br />
.dw-card {<br />
position: relative;<br />
border: 1px solid #C0C0C0;<br />
background: #FFFFFF !important;<br />
padding: 10px;<br />
margin-bottom: 10px;<br />
}<br />
.dw-card:hover {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 75%, rgba(192, 192, 192, 1) 100%)!important;<br />
}<br />
span.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
<br />
}<br />
<br />
.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 2rem !important; <br />
}<br />
<br />
<br />
.dw-card .dw-row {<br />
display: flex;<br />
flex-wrap: wrap;<br />
align-items: flex-start;<br />
gap: 12px;<br />
width: 100%;<br />
box-sizing: border-box;<br />
padding: 14px; /* ✅ move the spacing here instead of .dw-card */<br />
}<br />
<br />
.dw-card .dw-row > div:last-child {<br />
flex: 1;<br />
min-width: 0; /* ✅ prevents overflow due to long text/links */<br />
}<br />
<br />
.dw-card .dw-icon img { height: auto; }<br />
.dw-card .dw-headline {<br />
display: block;<br />
font-size: 1.5rem;<br />
font-weight: 700;<br />
margin: 0px 0 0px;<br />
}<br />
.dw-card .dw-body { line-height: 1.6; width: 100%;}<br />
.dw-card .dw-body--spacious { line-height: 1.8; }<br />
<br />
<br />
.dw-icon,<br />
.dw-subtitle {<br />
background: transparent !important; /* ✅ makes logo + text boxes transparent */<br />
}<br />
<br />
<br />
/* Code blocks explicitly monospace (so they don't inherit) */<br />
pre, code, kbd, samp, tt, .mw-code {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
text-indent: 0 !important;<br />
}<br />
<br />
/* ===== Remove first-line indentation site-wide ===== */<br />
.mw-parser-output p,<br />
.mw-parser-output li p,<br />
.mw-body-content p,<br />
.dw-card .dw-body p {<br />
text-indent: 0 !important;<br />
}<br />
<br />
<br />
pre {<br />
margin: 0 !important;<br />
padding: 0rem !important; /* add a little inner spacing so text isn’t on the edge */<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);<br />
border: none !important;<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
white-space: pre-wrap !important; /* allows wrapping */<br />
word-break: break-word !important;<br />
line-height: 1 !important;<br />
<br />
}<br />
<br />
.dw-card .pre {<br />
display: block; /* ensures it behaves as a block element */<br />
width: 100% !important;/* takes up the full width of .dw-card */<br />
box-sizing: border-box;/* includes padding/border in width calculation */<br />
margin: 0;<br />
padding: 0;<br />
}<br />
<br />
<br />
div.mw-content-ltr.mw-parser-output {<br />
background: #FFFFFF;<br />
background: linear-gradient(0deg, rgba(255, 255, 255, 1) 70%, rgba(192, 192, 192, 1) 95%);<br />
padding: 1rem;<br />
}<br />
<br />
div#content.mw-body {<br />
background: linear-gradient(to top, #0000FF, #ffffff) !important; /* blue → white gradient */<br />
}<br />
<br />
<br />
.mw-page-container {<br />
background-image: url("https://dsignweek.servus.at/images/9/9d/Bg-01.png");<br />
background-repeat: repeat-y; /* ✅ repeat vertically */<br />
background-size: 100% auto; /* stretch to page width, keep height natural */<br />
background-position: center top; /* start at the top, center horizontally */<br />
background-attachment: scroll; /* move with page scroll */<br />
background-color: #ffffff; /* fallback behind transparent areas */<br />
}<br />
<br />
div#mw-head {<br />
background: transparent !important;<br />
}<br />
<br />
<br />
.dw-headline, .mw-headline {<br />
margin: 0 !important;<br />
}<br />
<br />
.skin-vector-2022 header.vector-header { background: linear-gradient( 0deg, rgba(0, 0, 255, 1) 0%, rgba(255, 255, 255, 1) 10% ) !important; }<br />
<br />
.skin-vector-2022 #vector-sticky-header.vector-sticky-header {<br />
box-shadow: 0px 4px 12px rgba(0, 0, 255, 0.6) !important;<br />
}<br />
<br />
<br />
/* ===== Mobile: stack card content vertically ===== */<br />
@media (max-width: 720px) {<br />
<br />
.header-container.header-chrome {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 75%, rgba(192, 192, 192, 1) 95%);<br />
}<br />
.minerva-footer {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 75%, rgba(192, 192, 192, 1) 95%);<br />
}<br />
<br />
#content.mw-body {<br />
background: linear-gradient(to top, #0000FF, #ffffff) !important; /* blue → white gradient */<br />
}<br />
<br />
.dw-card {<br />
padding:0;}<br />
div#content.mw-body {<br />
padding: 0rem;}<br />
div.mw-content-ltr.mw-parser-output {<br />
padding: 0.5rem;<br />
}<br />
<br />
.banner-icon img { <br />
width: 80vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 650px; /* prevent it from getting too big */ <br />
min-width: 120px; /* prevent it from getting too small */ <br />
padding-left: 0rem;}<br />
<br />
/* Stack everything in a column */<br />
.dw-card .dw-row {<br />
display: flex;<br />
flex-direction: column;<br />
align-items: stretch; /* full width for text block */<br />
gap: 10px;<br />
}<br />
<br />
/* Make the icon its own row and center it */<br />
.dw-card .dw-icon {<br />
display: flex;<br />
justify-content: center;<br />
align-items: center;<br />
margin: 0; /* remove any left/right spacing from desktop */<br />
}<br />
<br />
.dw-card .dw-icon img {<br />
width: 72px; /* tidy mobile size */<br />
height: auto;<br />
}<br />
<br />
/* Ensure the text block fills width */<br />
.dw-card .dw-row > div {<br />
width: 100%;<br />
}<br />
<br />
/* Slight spacing tweaks for headings on mobile */<br />
.dw-card .dw-headline {<br />
margin: 4px 0 4px;<br />
}<br />
<br />
.partner-logos {<br />
display: flex;<br />
flex-wrap: wrap; /* allows wrapping on small screens */<br />
justify-content: space-between !important; <br />
align-items: center!important; <br />
gap: 1.4rem; <br />
padding: 0 1rem 1rem 1rem; /* breathing room top & bottom */<br />
background: transparent;<br />
}<br />
<br />
.partner-logos img {<br />
height: 24px;<br />
width: auto;<br />
object-fit:contain;<br />
}<br />
<br />
}</div>
Ivans
https://dsignweek.servus.at/index.php?title=MediaWiki:Common.css&diff=1404
MediaWiki:Common.css
2025-11-20T13:42:11Z
<p>Ivans: </p>
<hr />
<div>/* CSS placed here will be applied to all skins */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
#footer-info-lastmod {<br />
display: none !important;<br />
}<br />
<br />
/* Vector 2022: align user links (language, username, etc.) to the top */<br />
body.skin-vector-2022 .vector-user-links-main {<br />
display: flex; /* make sure it's flexbox */<br />
align-items: flex-start; /* align children to the top of the div */<br />
}<br />
/* Hide the Translate extension banner ("Translate this page; This page has changes…") */<br />
body.skin-vector-2022 .mw-pt-translate-header {<br />
display: none !important;<br />
}<br />
/* Vector 2022 – hide entire tab/navigation bar (left-navigation) for all users */<br />
.skin-vector-2022 #left-navigation {<br />
display: none !important;<br />
}<br />
/* Vector 2022: right-align items in the page toolbar (Edit / View history / Tools) */<br />
.skin-vector-2022 .vector-page-toolbar-container {<br />
display: flex !important;<br />
justify-content: flex-end !important; /* pushes items to the right */<br />
align-items: center; /* vertical alignment */<br />
}<br />
<br />
<br />
<br />
.mw-anon.skin-vector-2022 #ca-nstab-main, /* page title tab (Main Page / Article) */<br />
.mw-anon.skin-vector-2022 #ca-talk, /* Talk tab */<br />
.mw-anon.skin-vector-2022 #ca-view, /* "Read" tab */<br />
.mw-anon.skin-vector-2022 #ca-history, /* View history */<br />
.mw-anon.skin-vector-2022 #ca-watch,<br />
.mw-anon.skin-vector-2022 #ca-unwatch,<br />
.mw-anon.skin-vector-2022 #ca-more { /* "Tools" dropdown */<br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* === GLOBAL TYPOGRAPHY === */<br />
<br />
/* Base body text — Liberation Sans */<br />
html,<br />
body,<br />
.mw-body,<br />
.mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 1.2rem; /* base = 16px */<br />
line-height: 1.15; <br />
}<br />
<br />
/* Paragraphs and list text */<br />
p, li, td, th {<br />
font-size: 1.1rem; /* slightly larger than base text */<br />
}<br />
<br />
/* === HEADINGS — Linux Libertine === */<br />
h1, h2, h3, h4, h5, h6,<br />
.firstHeading,<br />
.mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
.mw-body h1, .mw-heading1, .mw-body-content h1, .mw-body-content .mw-heading1 { font-size: 3rem; line-height: 1.15; } <br />
<br />
<br />
<br />
/* === SIDEBAR MENU === */<br />
#mw-panel,<br />
.vector-menu-content,<br />
#p-navigation,<br />
#p-tb,<br />
#p-lang {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem; /* sidebar smaller for contrast */<br />
line-height: 1.4;<br />
}<br />
<br />
#mw-panel,<br />
.vector-menu-content {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 90%, rgba(192, 192, 192, 1) 100%);<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
#partner-logos {<br />
display: flex;<br />
justify-content: right;<br />
align-items: right;<br />
flex-wrap: wrap;<br />
gap: 1rem;<br />
margin-top:0.8rem;<br />
<br />
}<br />
<br />
#partner-logos img {<br />
height: 32px;<br />
object-fit: contain; /* keeps aspect ratio, fits within the box */<br />
max-width: 100%; /* prevents overflow */<br />
display: block; /* removes inline gaps below images */<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
.wikitable.custom-table {<br />
width: 100%;<br />
border-collapse: separate;<br />
border-spacing: 0;<br />
border: none;<br />
background-color: #fff;<br />
border-radius: 0.5rem;<br />
overflow: hidden; /* so rounded corners clip correctly */<br />
font-size: 0.95rem;<br />
}<br />
<br />
<br />
<br />
/* Header cells */<br />
.wikitable.custom-table th {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
color: #000;<br />
font-weight: 600;<br />
text-align: left;<br />
padding: 0.75rem 1rem;<br />
border-bottom: 2px solid #d0d9ff;<br />
}<br />
<br />
/* Data cells */<br />
.wikitable.custom-table td {<br />
padding: 0.65rem 1rem;<br />
border-bottom: 1px solid #eee;<br />
}<br />
<br />
/* Zebra striping */<br />
.wikitable.custom-table tr:nth-child(even) td {<br />
background-color: #f9fbff;<br />
}<br />
<br />
/* Hover effect */<br />
.wikitable.custom-table tr:hover td {<br />
background: #FFF;<br />
background: linear-gradient(0deg,rgba(0, 0, 255, 1) 0%, rgba(255, 255, 255, 1) 15%, rgba(255, 255, 255, 1) 85%, rgba(0, 0, 255, 1) 100%);<br />
}<br />
<br />
/* Rounded corners for first & last rows */<br />
.wikitable.custom-table tr:first-child th:first-child {<br />
border-top-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:first-child th:last-child {<br />
border-top-right-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:first-child {<br />
border-bottom-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:last-child {<br />
border-bottom-right-radius: 0.5rem;<br />
}<br />
<br />
<br />
/* === Mobile Responsive Tables (no HTML change needed) === */<br />
@media (max-width: 768px) {<br />
<br />
/* Allow horizontal scrolling on narrow screens */<br />
.wikitable.custom-table {<br />
display: block;<br />
width: 100%;<br />
overflow-x: auto;<br />
-webkit-overflow-scrolling: touch;<br />
}<br />
<br />
/* Prevent collapsing/squeezing of long cell content */<br />
.wikitable.custom-table tr,<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
white-space: nowrap;<br />
}<br />
<br />
/* Optional: slightly reduce padding for small screens */<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
padding: 0.5rem 0.75rem;<br />
}<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* Hide the automatic Tools and Special pages sections */<br />
#p-tb { <br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* MAIN-PAGE */<br />
<br />
/* === FONTS (yours) === */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
.mw-pt-languages {<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);}<br />
/* === GLOBAL TYPOGRAPHY === */<br />
html, body, .mw-body, .mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem;<br />
line-height: 1.1;<br />
}<br />
p, li, td, th { font-size: 1.1rem; line-height: 1.1; }<br />
h1, h2, h3, h4, h5, h6, .firstHeading, .mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
<br />
/* === d*sign week layout === */<br />
:root {<br />
--dw-border: #cfd8e3;<br />
--dw-card-bg: #f8fbff;<br />
}<br />
<br />
/* top ribbon */<br />
.dw-ribbon {<br />
height: 26px;<br />
background: linear-gradient(#8aa9ff, #ffffff);<br />
border-radius: 6px;<br />
margin: 0 0 14px 0;<br />
}<br />
<br />
<br />
.banner {<br />
display: flex;<br />
align-items: center;<br />
justify-content: space-between;<br />
gap: 1.5rem;<br />
padding: 0rem 1rem 0rem 1rem;<br />
text-align: left; /* centers text within its box */<br />
flex-wrap: wrap; <br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
background-size: 100% 200%;<br />
background-position: top;<br />
transition: background-position 0.4s ease-in-out;<br />
}<br />
.banner:hover {<br />
background-position: bottom;<br />
}<br />
<br />
<br />
.banner-icon img { <br />
width: 20vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 650px; /* prevent it from getting too big */ <br />
min-width: 120px; /* prevent it from getting too small */ <br />
padding-left: 2rem;}<br />
<br />
.dw-subtitle {<br />
font-size: 1.5rem;<br />
line-height: 1;<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle-banner {<br />
font-size: 3rem;<br />
}<br />
.dw-subtitle strong {<br />
<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle a {<br />
color: #0000FF !important; /* link color similar to your example */<br />
text-decoration: none;<br />
}<br />
<br />
.dw-subtitle a:hover {<br />
text-decoration: underline;<br />
}<br />
<br />
<br />
/* title & subtitle */<br />
.dw-title {<br />
text-align: center;<br />
line-height: 1.2;<br />
font-size: 2.5rem;<br />
font-weight: 700;<br />
letter-spacing: .02em;<br />
display: block;<br />
}<br />
<br />
<br />
/* grid */<br />
.dw-grid {<br />
display: flex;<br />
flex-wrap: wrap;<br />
gap: 16px;<br />
align-items: flex-start;<br />
margin-top: 14px;<br />
}<br />
.dw-col {<br />
flex: 1 1 520px;<br />
min-width: 320px;<br />
}<br />
<br />
/* cards */<br />
.dw-card {<br />
position: relative;<br />
border: 1px solid #C0C0C0;<br />
background: #FFFFFF !important;<br />
padding: 10px;<br />
margin-bottom: 10px;<br />
}<br />
.dw-card:hover {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 75%, rgba(192, 192, 192, 1) 100%)!important;<br />
}<br />
span.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
<br />
}<br />
<br />
.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 2rem !important; <br />
}<br />
<br />
<br />
.dw-card .dw-row {<br />
display: flex;<br />
flex-wrap: wrap;<br />
align-items: flex-start;<br />
gap: 12px;<br />
width: 100%;<br />
box-sizing: border-box;<br />
padding: 14px; /* ✅ move the spacing here instead of .dw-card */<br />
}<br />
<br />
.dw-card .dw-row > div:last-child {<br />
flex: 1;<br />
min-width: 0; /* ✅ prevents overflow due to long text/links */<br />
}<br />
<br />
.dw-card .dw-icon img { height: auto; }<br />
.dw-card .dw-headline {<br />
display: block;<br />
font-size: 1.5rem;<br />
font-weight: 700;<br />
margin: 0px 0 0px;<br />
}<br />
.dw-card .dw-body { line-height: 1.6; width: 100%;}<br />
.dw-card .dw-body--spacious { line-height: 1.8; }<br />
<br />
<br />
.dw-icon,<br />
.dw-subtitle {<br />
background: transparent !important; /* ✅ makes logo + text boxes transparent */<br />
}<br />
<br />
<br />
/* Code blocks explicitly monospace (so they don't inherit) */<br />
pre, code, kbd, samp, tt, .mw-code {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
text-indent: 0 !important;<br />
}<br />
<br />
/* ===== Remove first-line indentation site-wide ===== */<br />
.mw-parser-output p,<br />
.mw-parser-output li p,<br />
.mw-body-content p,<br />
.dw-card .dw-body p {<br />
text-indent: 0 !important;<br />
}<br />
<br />
<br />
pre {<br />
margin: 0 !important;<br />
padding: 0rem !important; /* add a little inner spacing so text isn’t on the edge */<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);<br />
border: none !important;<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
white-space: pre-wrap !important; /* allows wrapping */<br />
word-break: break-word !important;<br />
line-height: 1 !important;<br />
<br />
}<br />
<br />
.dw-card .pre {<br />
display: block; /* ensures it behaves as a block element */<br />
width: 100% !important;/* takes up the full width of .dw-card */<br />
box-sizing: border-box;/* includes padding/border in width calculation */<br />
margin: 0;<br />
padding: 0;<br />
}<br />
<br />
<br />
div.mw-content-ltr.mw-parser-output {<br />
background: #FFFFFF;<br />
background: linear-gradient(0deg, rgba(255, 255, 255, 1) 70%, rgba(192, 192, 192, 1) 95%);<br />
padding: 1rem;<br />
}<br />
<br />
div#content.mw-body {<br />
background: linear-gradient(to top, #0000FF, #ffffff) !important; /* blue → white gradient */<br />
}<br />
<br />
<br />
.mw-page-container {<br />
background-image: url("https://dsignweek.servus.at/images/9/9d/Bg-01.png");<br />
background-repeat: repeat-y; /* ✅ repeat vertically */<br />
background-size: 100% auto; /* stretch to page width, keep height natural */<br />
background-position: center top; /* start at the top, center horizontally */<br />
background-attachment: scroll; /* move with page scroll */<br />
background-color: #ffffff; /* fallback behind transparent areas */<br />
}<br />
<br />
div#mw-head {<br />
background: transparent !important;<br />
}<br />
<br />
<br />
.dw-headline, .mw-headline {<br />
margin: 0 !important;<br />
}<br />
<br />
.skin-vector-2022 header.vector-header { background: linear-gradient( 0deg, rgba(0, 0, 255, 1) 0%, rgba(255, 255, 255, 1) 10% ) !important; }<br />
<br />
<br />
/* ===== Mobile: stack card content vertically ===== */<br />
@media (max-width: 720px) {<br />
<br />
.header-container.header-chrome {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 75%, rgba(192, 192, 192, 1) 95%);<br />
}<br />
.minerva-footer {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 75%, rgba(192, 192, 192, 1) 95%);<br />
}<br />
<br />
#content.mw-body {<br />
background: linear-gradient(to top, #0000FF, #ffffff) !important; /* blue → white gradient */<br />
}<br />
<br />
.dw-card {<br />
padding:0;}<br />
div#content.mw-body {<br />
padding: 0rem;}<br />
div.mw-content-ltr.mw-parser-output {<br />
padding: 0.5rem;<br />
}<br />
<br />
.banner-icon img { <br />
width: 80vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 650px; /* prevent it from getting too big */ <br />
min-width: 120px; /* prevent it from getting too small */ <br />
padding-left: 0rem;}<br />
<br />
/* Stack everything in a column */<br />
.dw-card .dw-row {<br />
display: flex;<br />
flex-direction: column;<br />
align-items: stretch; /* full width for text block */<br />
gap: 10px;<br />
}<br />
<br />
/* Make the icon its own row and center it */<br />
.dw-card .dw-icon {<br />
display: flex;<br />
justify-content: center;<br />
align-items: center;<br />
margin: 0; /* remove any left/right spacing from desktop */<br />
}<br />
<br />
.dw-card .dw-icon img {<br />
width: 72px; /* tidy mobile size */<br />
height: auto;<br />
}<br />
<br />
/* Ensure the text block fills width */<br />
.dw-card .dw-row > div {<br />
width: 100%;<br />
}<br />
<br />
/* Slight spacing tweaks for headings on mobile */<br />
.dw-card .dw-headline {<br />
margin: 4px 0 4px;<br />
}<br />
<br />
.partner-logos {<br />
display: flex;<br />
flex-wrap: wrap; /* allows wrapping on small screens */<br />
justify-content: space-between !important; <br />
align-items: center!important; <br />
gap: 1.4rem; <br />
padding: 0 1rem 1rem 1rem; /* breathing room top & bottom */<br />
background: transparent;<br />
}<br />
<br />
.partner-logos img {<br />
height: 24px;<br />
width: auto;<br />
object-fit:contain;<br />
}<br />
<br />
}</div>
Ivans
https://dsignweek.servus.at/index.php?title=MediaWiki:Common.css&diff=1402
MediaWiki:Common.css
2025-11-20T13:40:56Z
<p>Ivans: </p>
<hr />
<div>/* CSS placed here will be applied to all skins */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
#footer-info-lastmod {<br />
display: none !important;<br />
}<br />
<br />
/* Vector 2022: align user links (language, username, etc.) to the top */<br />
body.skin-vector-2022 .vector-user-links-main {<br />
display: flex; /* make sure it's flexbox */<br />
align-items: flex-start; /* align children to the top of the div */<br />
}<br />
/* Hide the Translate extension banner ("Translate this page; This page has changes…") */<br />
body.skin-vector-2022 .mw-pt-translate-header {<br />
display: none !important;<br />
}<br />
/* Vector 2022 – hide entire tab/navigation bar (left-navigation) for all users */<br />
.skin-vector-2022 #left-navigation {<br />
display: none !important;<br />
}<br />
/* Vector 2022: right-align items in the page toolbar (Edit / View history / Tools) */<br />
.skin-vector-2022 .vector-page-toolbar-container {<br />
display: flex !important;<br />
justify-content: flex-end !important; /* pushes items to the right */<br />
align-items: center; /* vertical alignment */<br />
}<br />
<br />
<br />
<br />
.mw-anon.skin-vector-2022 #ca-nstab-main, /* page title tab (Main Page / Article) */<br />
.mw-anon.skin-vector-2022 #ca-talk, /* Talk tab */<br />
.mw-anon.skin-vector-2022 #ca-view, /* "Read" tab */<br />
.mw-anon.skin-vector-2022 #ca-history, /* View history */<br />
.mw-anon.skin-vector-2022 #ca-watch,<br />
.mw-anon.skin-vector-2022 #ca-unwatch,<br />
.mw-anon.skin-vector-2022 #ca-more { /* "Tools" dropdown */<br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* === GLOBAL TYPOGRAPHY === */<br />
<br />
/* Base body text — Liberation Sans */<br />
html,<br />
body,<br />
.mw-body,<br />
.mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 1.2rem; /* base = 16px */<br />
line-height: 1.15; <br />
}<br />
<br />
/* Paragraphs and list text */<br />
p, li, td, th {<br />
font-size: 1.1rem; /* slightly larger than base text */<br />
}<br />
<br />
/* === HEADINGS — Linux Libertine === */<br />
h1, h2, h3, h4, h5, h6,<br />
.firstHeading,<br />
.mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
.mw-body h1, .mw-heading1, .mw-body-content h1, .mw-body-content .mw-heading1 { font-size: 3rem; line-height: 1.15; } <br />
<br />
<br />
<br />
/* === SIDEBAR MENU === */<br />
#mw-panel,<br />
.vector-menu-content,<br />
#p-navigation,<br />
#p-tb,<br />
#p-lang {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem; /* sidebar smaller for contrast */<br />
line-height: 1.4;<br />
}<br />
<br />
#mw-panel,<br />
.vector-menu-content {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 90%, rgba(192, 192, 192, 1) 100%);<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
#partner-logos {<br />
display: flex;<br />
justify-content: right;<br />
align-items: right;<br />
flex-wrap: wrap;<br />
gap: 1rem;<br />
margin-top:0.8rem;<br />
<br />
}<br />
<br />
#partner-logos img {<br />
height: 32px;<br />
object-fit: contain; /* keeps aspect ratio, fits within the box */<br />
max-width: 100%; /* prevents overflow */<br />
display: block; /* removes inline gaps below images */<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
.wikitable.custom-table {<br />
width: 100%;<br />
border-collapse: separate;<br />
border-spacing: 0;<br />
border: none;<br />
background-color: #fff;<br />
border-radius: 0.5rem;<br />
overflow: hidden; /* so rounded corners clip correctly */<br />
font-size: 0.95rem;<br />
}<br />
<br />
<br />
<br />
/* Header cells */<br />
.wikitable.custom-table th {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
color: #000;<br />
font-weight: 600;<br />
text-align: left;<br />
padding: 0.75rem 1rem;<br />
border-bottom: 2px solid #d0d9ff;<br />
}<br />
<br />
/* Data cells */<br />
.wikitable.custom-table td {<br />
padding: 0.65rem 1rem;<br />
border-bottom: 1px solid #eee;<br />
}<br />
<br />
/* Zebra striping */<br />
.wikitable.custom-table tr:nth-child(even) td {<br />
background-color: #f9fbff;<br />
}<br />
<br />
/* Hover effect */<br />
.wikitable.custom-table tr:hover td {<br />
background: #FFF;<br />
background: linear-gradient(0deg,rgba(0, 0, 255, 1) 0%, rgba(255, 255, 255, 1) 15%, rgba(255, 255, 255, 1) 85%, rgba(0, 0, 255, 1) 100%);<br />
}<br />
<br />
/* Rounded corners for first & last rows */<br />
.wikitable.custom-table tr:first-child th:first-child {<br />
border-top-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:first-child th:last-child {<br />
border-top-right-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:first-child {<br />
border-bottom-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:last-child {<br />
border-bottom-right-radius: 0.5rem;<br />
}<br />
<br />
<br />
/* === Mobile Responsive Tables (no HTML change needed) === */<br />
@media (max-width: 768px) {<br />
<br />
/* Allow horizontal scrolling on narrow screens */<br />
.wikitable.custom-table {<br />
display: block;<br />
width: 100%;<br />
overflow-x: auto;<br />
-webkit-overflow-scrolling: touch;<br />
}<br />
<br />
/* Prevent collapsing/squeezing of long cell content */<br />
.wikitable.custom-table tr,<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
white-space: nowrap;<br />
}<br />
<br />
/* Optional: slightly reduce padding for small screens */<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
padding: 0.5rem 0.75rem;<br />
}<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* Hide the automatic Tools and Special pages sections */<br />
#p-tb { <br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* MAIN-PAGE */<br />
<br />
/* === FONTS (yours) === */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
.mw-pt-languages {<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);}<br />
/* === GLOBAL TYPOGRAPHY === */<br />
html, body, .mw-body, .mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem;<br />
line-height: 1.1;<br />
}<br />
p, li, td, th { font-size: 1.1rem; line-height: 1.1; }<br />
h1, h2, h3, h4, h5, h6, .firstHeading, .mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
<br />
/* === d*sign week layout === */<br />
:root {<br />
--dw-border: #cfd8e3;<br />
--dw-card-bg: #f8fbff;<br />
}<br />
<br />
/* top ribbon */<br />
.dw-ribbon {<br />
height: 26px;<br />
background: linear-gradient(#8aa9ff, #ffffff);<br />
border-radius: 6px;<br />
margin: 0 0 14px 0;<br />
}<br />
<br />
<br />
.banner {<br />
display: flex;<br />
align-items: center;<br />
justify-content: space-between;<br />
gap: 1.5rem;<br />
padding: 0rem 1rem 0rem 1rem;<br />
text-align: left; /* centers text within its box */<br />
flex-wrap: wrap; <br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
background-size: 100% 200%;<br />
background-position: top;<br />
transition: background-position 0.4s ease-in-out;<br />
}<br />
.banner:hover {<br />
background-position: bottom;<br />
}<br />
<br />
<br />
.banner-icon img { <br />
width: 20vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 650px; /* prevent it from getting too big */ <br />
min-width: 120px; /* prevent it from getting too small */ <br />
padding-left: 2rem;}<br />
<br />
.dw-subtitle {<br />
font-size: 1.5rem;<br />
line-height: 1;<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle-banner {<br />
font-size: 3rem;<br />
}<br />
.dw-subtitle strong {<br />
<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle a {<br />
color: #0000FF !important; /* link color similar to your example */<br />
text-decoration: none;<br />
}<br />
<br />
.dw-subtitle a:hover {<br />
text-decoration: underline;<br />
}<br />
<br />
<br />
/* title & subtitle */<br />
.dw-title {<br />
text-align: center;<br />
line-height: 1.2;<br />
font-size: 2.5rem;<br />
font-weight: 700;<br />
letter-spacing: .02em;<br />
display: block;<br />
}<br />
<br />
<br />
/* grid */<br />
.dw-grid {<br />
display: flex;<br />
flex-wrap: wrap;<br />
gap: 16px;<br />
align-items: flex-start;<br />
margin-top: 14px;<br />
}<br />
.dw-col {<br />
flex: 1 1 520px;<br />
min-width: 320px;<br />
}<br />
<br />
/* cards */<br />
.dw-card {<br />
position: relative;<br />
border: 1px solid #C0C0C0;<br />
background: #FFFFFF !important;<br />
padding: 10px;<br />
margin-bottom: 10px;<br />
}<br />
.dw-card:hover {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 75%, rgba(192, 192, 192, 1) 100%)!important;<br />
}<br />
span.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
<br />
}<br />
<br />
.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 2rem !important; <br />
}<br />
<br />
<br />
.dw-card .dw-row {<br />
display: flex;<br />
flex-wrap: wrap;<br />
align-items: flex-start;<br />
gap: 12px;<br />
width: 100%;<br />
box-sizing: border-box;<br />
padding: 14px; /* ✅ move the spacing here instead of .dw-card */<br />
}<br />
<br />
.dw-card .dw-row > div:last-child {<br />
flex: 1;<br />
min-width: 0; /* ✅ prevents overflow due to long text/links */<br />
}<br />
<br />
.dw-card .dw-icon img { height: auto; }<br />
.dw-card .dw-headline {<br />
display: block;<br />
font-size: 1.5rem;<br />
font-weight: 700;<br />
margin: 0px 0 0px;<br />
}<br />
.dw-card .dw-body { line-height: 1.6; width: 100%;}<br />
.dw-card .dw-body--spacious { line-height: 1.8; }<br />
<br />
<br />
.dw-icon,<br />
.dw-subtitle {<br />
background: transparent !important; /* ✅ makes logo + text boxes transparent */<br />
}<br />
<br />
<br />
/* Code blocks explicitly monospace (so they don't inherit) */<br />
pre, code, kbd, samp, tt, .mw-code {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
text-indent: 0 !important;<br />
}<br />
<br />
/* ===== Remove first-line indentation site-wide ===== */<br />
.mw-parser-output p,<br />
.mw-parser-output li p,<br />
.mw-body-content p,<br />
.dw-card .dw-body p {<br />
text-indent: 0 !important;<br />
}<br />
<br />
<br />
pre {<br />
margin: 0 !important;<br />
padding: 0rem !important; /* add a little inner spacing so text isn’t on the edge */<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);<br />
border: none !important;<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
white-space: pre-wrap !important; /* allows wrapping */<br />
word-break: break-word !important;<br />
line-height: 1 !important;<br />
<br />
}<br />
<br />
.dw-card .pre {<br />
display: block; /* ensures it behaves as a block element */<br />
width: 100% !important;/* takes up the full width of .dw-card */<br />
box-sizing: border-box;/* includes padding/border in width calculation */<br />
margin: 0;<br />
padding: 0;<br />
}<br />
<br />
<br />
div.mw-content-ltr.mw-parser-output {<br />
background: #FFFFFF;<br />
background: linear-gradient(0deg, rgba(255, 255, 255, 1) 70%, rgba(192, 192, 192, 1) 95%);<br />
padding: 1rem;<br />
}<br />
<br />
div#content.mw-body {<br />
background: linear-gradient(to top, #0000FF, #ffffff) !important; /* blue → white gradient */<br />
}<br />
<br />
<br />
.mw-page-container {<br />
background-image: url("https://dsignweek.servus.at/images/9/9d/Bg-01.png");<br />
background-repeat: repeat-y; /* ✅ repeat vertically */<br />
background-size: 100% auto; /* stretch to page width, keep height natural */<br />
background-position: center top; /* start at the top, center horizontally */<br />
background-attachment: scroll; /* move with page scroll */<br />
background-color: #ffffff; /* fallback behind transparent areas */<br />
}<br />
<br />
div#mw-head {<br />
background: transparent !important;<br />
}<br />
<br />
<br />
.dw-headline, .mw-headline {<br />
margin: 0 !important;<br />
}<br />
<br />
.skin-vector-2022 header.vector-header {<br />
background: linear-gradient(<br />
0deg,<br />
rgba(0, 0, 255, 1) 0%,<br />
rgba(255, 255, 255, 1) 20%<br />
) !important;<br />
}<br />
<br />
<br />
/* ===== Mobile: stack card content vertically ===== */<br />
@media (max-width: 720px) {<br />
<br />
.header-container.header-chrome {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 75%, rgba(192, 192, 192, 1) 95%);<br />
}<br />
.minerva-footer {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 75%, rgba(192, 192, 192, 1) 95%);<br />
}<br />
<br />
#content.mw-body {<br />
background: linear-gradient(to top, #0000FF, #ffffff) !important; /* blue → white gradient */<br />
}<br />
<br />
.dw-card {<br />
padding:0;}<br />
div#content.mw-body {<br />
padding: 0rem;}<br />
div.mw-content-ltr.mw-parser-output {<br />
padding: 0.5rem;<br />
}<br />
<br />
.banner-icon img { <br />
width: 80vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 650px; /* prevent it from getting too big */ <br />
min-width: 120px; /* prevent it from getting too small */ <br />
padding-left: 0rem;}<br />
<br />
/* Stack everything in a column */<br />
.dw-card .dw-row {<br />
display: flex;<br />
flex-direction: column;<br />
align-items: stretch; /* full width for text block */<br />
gap: 10px;<br />
}<br />
<br />
/* Make the icon its own row and center it */<br />
.dw-card .dw-icon {<br />
display: flex;<br />
justify-content: center;<br />
align-items: center;<br />
margin: 0; /* remove any left/right spacing from desktop */<br />
}<br />
<br />
.dw-card .dw-icon img {<br />
width: 72px; /* tidy mobile size */<br />
height: auto;<br />
}<br />
<br />
/* Ensure the text block fills width */<br />
.dw-card .dw-row > div {<br />
width: 100%;<br />
}<br />
<br />
/* Slight spacing tweaks for headings on mobile */<br />
.dw-card .dw-headline {<br />
margin: 4px 0 4px;<br />
}<br />
<br />
.partner-logos {<br />
display: flex;<br />
flex-wrap: wrap; /* allows wrapping on small screens */<br />
justify-content: space-between !important; <br />
align-items: center!important; <br />
gap: 1.4rem; <br />
padding: 0 1rem 1rem 1rem; /* breathing room top & bottom */<br />
background: transparent;<br />
}<br />
<br />
.partner-logos img {<br />
height: 24px;<br />
width: auto;<br />
object-fit:contain;<br />
}<br />
<br />
}</div>
Ivans
https://dsignweek.servus.at/index.php?title=MediaWiki:Common.css&diff=1396
MediaWiki:Common.css
2025-11-20T13:34:20Z
<p>Ivans: </p>
<hr />
<div>/* CSS placed here will be applied to all skins */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
#footer-info-lastmod {<br />
display: none !important;<br />
}<br />
<br />
/* Vector 2022: align user links (language, username, etc.) to the top */<br />
body.skin-vector-2022 .vector-user-links-main {<br />
display: flex; /* make sure it's flexbox */<br />
align-items: flex-start; /* align children to the top of the div */<br />
}<br />
/* Hide the Translate extension banner ("Translate this page; This page has changes…") */<br />
body.skin-vector-2022 .mw-pt-translate-header {<br />
display: none !important;<br />
}<br />
/* Vector 2022 – hide entire tab/navigation bar (left-navigation) for all users */<br />
.skin-vector-2022 #left-navigation {<br />
display: none !important;<br />
}<br />
/* Vector 2022: right-align items in the page toolbar (Edit / View history / Tools) */<br />
.skin-vector-2022 .vector-page-toolbar-container {<br />
display: flex !important;<br />
justify-content: flex-end !important; /* pushes items to the right */<br />
align-items: center; /* vertical alignment */<br />
}<br />
<br />
<br />
<br />
.mw-anon.skin-vector-2022 #ca-nstab-main, /* page title tab (Main Page / Article) */<br />
.mw-anon.skin-vector-2022 #ca-talk, /* Talk tab */<br />
.mw-anon.skin-vector-2022 #ca-view, /* "Read" tab */<br />
.mw-anon.skin-vector-2022 #ca-history, /* View history */<br />
.mw-anon.skin-vector-2022 #ca-watch,<br />
.mw-anon.skin-vector-2022 #ca-unwatch,<br />
.mw-anon.skin-vector-2022 #ca-more { /* "Tools" dropdown */<br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* === GLOBAL TYPOGRAPHY === */<br />
<br />
/* Base body text — Liberation Sans */<br />
html,<br />
body,<br />
.mw-body,<br />
.mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 1.2rem; /* base = 16px */<br />
line-height: 1.15; <br />
}<br />
<br />
/* Paragraphs and list text */<br />
p, li, td, th {<br />
font-size: 1.1rem; /* slightly larger than base text */<br />
}<br />
<br />
/* === HEADINGS — Linux Libertine === */<br />
h1, h2, h3, h4, h5, h6,<br />
.firstHeading,<br />
.mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
.mw-body h1, .mw-heading1, .mw-body-content h1, .mw-body-content .mw-heading1 { font-size: 3rem; line-height: 1.15; } <br />
<br />
<br />
<br />
/* === SIDEBAR MENU === */<br />
#mw-panel,<br />
.vector-menu-content,<br />
#p-navigation,<br />
#p-tb,<br />
#p-lang {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem; /* sidebar smaller for contrast */<br />
line-height: 1.4;<br />
}<br />
<br />
#mw-panel,<br />
.vector-menu-content {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 90%, rgba(192, 192, 192, 1) 100%);<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
#partner-logos {<br />
display: flex;<br />
justify-content: right;<br />
align-items: right;<br />
flex-wrap: wrap;<br />
gap: 1rem;<br />
margin-top:0.8rem;<br />
<br />
}<br />
<br />
#partner-logos img {<br />
height: 32px;<br />
object-fit: contain; /* keeps aspect ratio, fits within the box */<br />
max-width: 100%; /* prevents overflow */<br />
display: block; /* removes inline gaps below images */<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
.wikitable.custom-table {<br />
width: 100%;<br />
border-collapse: separate;<br />
border-spacing: 0;<br />
border: none;<br />
background-color: #fff;<br />
border-radius: 0.5rem;<br />
overflow: hidden; /* so rounded corners clip correctly */<br />
font-size: 0.95rem;<br />
}<br />
<br />
<br />
<br />
/* Header cells */<br />
.wikitable.custom-table th {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
color: #000;<br />
font-weight: 600;<br />
text-align: left;<br />
padding: 0.75rem 1rem;<br />
border-bottom: 2px solid #d0d9ff;<br />
}<br />
<br />
/* Data cells */<br />
.wikitable.custom-table td {<br />
padding: 0.65rem 1rem;<br />
border-bottom: 1px solid #eee;<br />
}<br />
<br />
/* Zebra striping */<br />
.wikitable.custom-table tr:nth-child(even) td {<br />
background-color: #f9fbff;<br />
}<br />
<br />
/* Hover effect */<br />
.wikitable.custom-table tr:hover td {<br />
background: #FFF;<br />
background: linear-gradient(0deg,rgba(0, 0, 255, 1) 0%, rgba(255, 255, 255, 1) 15%, rgba(255, 255, 255, 1) 85%, rgba(0, 0, 255, 1) 100%);<br />
}<br />
<br />
/* Rounded corners for first & last rows */<br />
.wikitable.custom-table tr:first-child th:first-child {<br />
border-top-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:first-child th:last-child {<br />
border-top-right-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:first-child {<br />
border-bottom-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:last-child {<br />
border-bottom-right-radius: 0.5rem;<br />
}<br />
<br />
<br />
/* === Mobile Responsive Tables (no HTML change needed) === */<br />
@media (max-width: 768px) {<br />
<br />
/* Allow horizontal scrolling on narrow screens */<br />
.wikitable.custom-table {<br />
display: block;<br />
width: 100%;<br />
overflow-x: auto;<br />
-webkit-overflow-scrolling: touch;<br />
}<br />
<br />
/* Prevent collapsing/squeezing of long cell content */<br />
.wikitable.custom-table tr,<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
white-space: nowrap;<br />
}<br />
<br />
/* Optional: slightly reduce padding for small screens */<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
padding: 0.5rem 0.75rem;<br />
}<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* Hide the automatic Tools and Special pages sections */<br />
#p-tb { <br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* MAIN-PAGE */<br />
<br />
/* === FONTS (yours) === */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
.mw-pt-languages {<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);}<br />
/* === GLOBAL TYPOGRAPHY === */<br />
html, body, .mw-body, .mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem;<br />
line-height: 1.1;<br />
}<br />
p, li, td, th { font-size: 1.1rem; line-height: 1.1; }<br />
h1, h2, h3, h4, h5, h6, .firstHeading, .mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
<br />
/* === d*sign week layout === */<br />
:root {<br />
--dw-border: #cfd8e3;<br />
--dw-card-bg: #f8fbff;<br />
}<br />
<br />
/* top ribbon */<br />
.dw-ribbon {<br />
height: 26px;<br />
background: linear-gradient(#8aa9ff, #ffffff);<br />
border-radius: 6px;<br />
margin: 0 0 14px 0;<br />
}<br />
<br />
<br />
.banner {<br />
display: flex;<br />
align-items: center;<br />
justify-content: space-between;<br />
gap: 1.5rem;<br />
padding: 0rem 1rem 0rem 1rem;<br />
text-align: left; /* centers text within its box */<br />
flex-wrap: wrap; <br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
background-size: 100% 200%;<br />
background-position: top;<br />
transition: background-position 0.4s ease-in-out;<br />
}<br />
.banner:hover {<br />
background-position: bottom;<br />
}<br />
<br />
<br />
.banner-icon img { <br />
width: 20vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 650px; /* prevent it from getting too big */ <br />
min-width: 120px; /* prevent it from getting too small */ <br />
padding-left: 2rem;}<br />
<br />
.dw-subtitle {<br />
font-size: 1.5rem;<br />
line-height: 1;<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle-banner {<br />
font-size: 3rem;<br />
}<br />
.dw-subtitle strong {<br />
<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle a {<br />
color: #0000FF !important; /* link color similar to your example */<br />
text-decoration: none;<br />
}<br />
<br />
.dw-subtitle a:hover {<br />
text-decoration: underline;<br />
}<br />
<br />
<br />
/* title & subtitle */<br />
.dw-title {<br />
text-align: center;<br />
line-height: 1.2;<br />
font-size: 2.5rem;<br />
font-weight: 700;<br />
letter-spacing: .02em;<br />
display: block;<br />
}<br />
<br />
<br />
/* grid */<br />
.dw-grid {<br />
display: flex;<br />
flex-wrap: wrap;<br />
gap: 16px;<br />
align-items: flex-start;<br />
margin-top: 14px;<br />
}<br />
.dw-col {<br />
flex: 1 1 520px;<br />
min-width: 320px;<br />
}<br />
<br />
/* cards */<br />
.dw-card {<br />
position: relative;<br />
border: 1px solid #C0C0C0;<br />
background: #FFFFFF !important;<br />
padding: 10px;<br />
margin-bottom: 10px;<br />
}<br />
.dw-card:hover {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 75%, rgba(192, 192, 192, 1) 100%)!important;<br />
}<br />
span.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
<br />
}<br />
<br />
.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 2rem !important; <br />
}<br />
<br />
<br />
.dw-card .dw-row {<br />
display: flex;<br />
flex-wrap: wrap;<br />
align-items: flex-start;<br />
gap: 12px;<br />
width: 100%;<br />
box-sizing: border-box;<br />
padding: 14px; /* ✅ move the spacing here instead of .dw-card */<br />
}<br />
<br />
.dw-card .dw-row > div:last-child {<br />
flex: 1;<br />
min-width: 0; /* ✅ prevents overflow due to long text/links */<br />
}<br />
<br />
.dw-card .dw-icon img { height: auto; }<br />
.dw-card .dw-headline {<br />
display: block;<br />
font-size: 1.5rem;<br />
font-weight: 700;<br />
margin: 0px 0 0px;<br />
}<br />
.dw-card .dw-body { line-height: 1.6; width: 100%;}<br />
.dw-card .dw-body--spacious { line-height: 1.8; }<br />
<br />
<br />
.dw-icon,<br />
.dw-subtitle {<br />
background: transparent !important; /* ✅ makes logo + text boxes transparent */<br />
}<br />
<br />
<br />
/* Code blocks explicitly monospace (so they don't inherit) */<br />
pre, code, kbd, samp, tt, .mw-code {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
text-indent: 0 !important;<br />
}<br />
<br />
/* ===== Remove first-line indentation site-wide ===== */<br />
.mw-parser-output p,<br />
.mw-parser-output li p,<br />
.mw-body-content p,<br />
.dw-card .dw-body p {<br />
text-indent: 0 !important;<br />
}<br />
<br />
<br />
pre {<br />
margin: 0 !important;<br />
padding: 0rem !important; /* add a little inner spacing so text isn’t on the edge */<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);<br />
border: none !important;<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
white-space: pre-wrap !important; /* allows wrapping */<br />
word-break: break-word !important;<br />
line-height: 1 !important;<br />
<br />
}<br />
<br />
.dw-card .pre {<br />
display: block; /* ensures it behaves as a block element */<br />
width: 100% !important;/* takes up the full width of .dw-card */<br />
box-sizing: border-box;/* includes padding/border in width calculation */<br />
margin: 0;<br />
padding: 0;<br />
}<br />
<br />
<br />
div.mw-content-ltr.mw-parser-output {<br />
background: #FFFFFF;<br />
background: linear-gradient(0deg, rgba(255, 255, 255, 1) 70%, rgba(192, 192, 192, 1) 95%);<br />
padding: 1rem;<br />
}<br />
<br />
div#content.mw-body {<br />
background: linear-gradient(to top, #0000FF, #ffffff) !important; /* blue → white gradient */<br />
}<br />
<br />
<br />
.mw-page-container {<br />
background-image: url("https://dsignweek.servus.at/images/9/9d/Bg-01.png");<br />
background-repeat: repeat-y; /* ✅ repeat vertically */<br />
background-size: 100% auto; /* stretch to page width, keep height natural */<br />
background-position: center top; /* start at the top, center horizontally */<br />
background-attachment: scroll; /* move with page scroll */<br />
background-color: #ffffff; /* fallback behind transparent areas */<br />
}<br />
<br />
div#mw-head {<br />
background: transparent !important;<br />
}<br />
<br />
<br />
.dw-headline, .mw-headline {<br />
margin: 0 !important;<br />
}<br />
<br />
<br />
/* ===== Mobile: stack card content vertically ===== */<br />
@media (max-width: 720px) {<br />
<br />
.header-container.header-chrome {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 75%, rgba(192, 192, 192, 1) 95%);<br />
}<br />
.minerva-footer {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 75%, rgba(192, 192, 192, 1) 95%);<br />
}<br />
<br />
#content.mw-body {<br />
background: linear-gradient(to top, #0000FF, #ffffff) !important; /* blue → white gradient */<br />
}<br />
<br />
.dw-card {<br />
padding:0;}<br />
div#content.mw-body {<br />
padding: 0rem;}<br />
div.mw-content-ltr.mw-parser-output {<br />
padding: 0.5rem;<br />
}<br />
<br />
.banner-icon img { <br />
width: 80vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 650px; /* prevent it from getting too big */ <br />
min-width: 120px; /* prevent it from getting too small */ <br />
padding-left: 0rem;}<br />
<br />
/* Stack everything in a column */<br />
.dw-card .dw-row {<br />
display: flex;<br />
flex-direction: column;<br />
align-items: stretch; /* full width for text block */<br />
gap: 10px;<br />
}<br />
<br />
/* Make the icon its own row and center it */<br />
.dw-card .dw-icon {<br />
display: flex;<br />
justify-content: center;<br />
align-items: center;<br />
margin: 0; /* remove any left/right spacing from desktop */<br />
}<br />
<br />
.dw-card .dw-icon img {<br />
width: 72px; /* tidy mobile size */<br />
height: auto;<br />
}<br />
<br />
/* Ensure the text block fills width */<br />
.dw-card .dw-row > div {<br />
width: 100%;<br />
}<br />
<br />
/* Slight spacing tweaks for headings on mobile */<br />
.dw-card .dw-headline {<br />
margin: 4px 0 4px;<br />
}<br />
<br />
.partner-logos {<br />
display: flex;<br />
flex-wrap: wrap; /* allows wrapping on small screens */<br />
justify-content: space-between !important; <br />
align-items: center!important; <br />
gap: 1.4rem; <br />
padding: 0 1rem 1rem 1rem; /* breathing room top & bottom */<br />
background: transparent;<br />
}<br />
<br />
.partner-logos img {<br />
height: 24px;<br />
width: auto;<br />
object-fit:contain;<br />
}<br />
<br />
}</div>
Ivans
https://dsignweek.servus.at/index.php?title=MediaWiki:Common.css&diff=1395
MediaWiki:Common.css
2025-11-20T13:32:32Z
<p>Ivans: </p>
<hr />
<div>/* CSS placed here will be applied to all skins */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
#footer-info-lastmod {<br />
display: none !important;<br />
}<br />
<br />
/* Vector 2022: align user links (language, username, etc.) to the top */<br />
body.skin-vector-2022 .vector-user-links-main {<br />
display: flex; /* make sure it's flexbox */<br />
align-items: flex-start; /* align children to the top of the div */<br />
}<br />
/* Hide the Translate extension banner ("Translate this page; This page has changes…") */<br />
body.skin-vector-2022 .mw-pt-translate-header {<br />
display: none !important;<br />
}<br />
/* Vector 2022 – hide entire tab/navigation bar (left-navigation) for all users */<br />
.skin-vector-2022 #left-navigation {<br />
display: none !important;<br />
}<br />
/* Vector 2022: right-align items in the page toolbar (Edit / View history / Tools) */<br />
.skin-vector-2022 .vector-page-toolbar-container {<br />
display: flex !important;<br />
justify-content: flex-end !important; /* pushes items to the right */<br />
align-items: center; /* vertical alignment */<br />
}<br />
<br />
<br />
<br />
.mw-anon.skin-vector-2022 #ca-nstab-main, /* page title tab (Main Page / Article) */<br />
.mw-anon.skin-vector-2022 #ca-talk, /* Talk tab */<br />
.mw-anon.skin-vector-2022 #ca-view, /* "Read" tab */<br />
.mw-anon.skin-vector-2022 #ca-history, /* View history */<br />
.mw-anon.skin-vector-2022 #ca-watch,<br />
.mw-anon.skin-vector-2022 #ca-unwatch,<br />
.mw-anon.skin-vector-2022 #ca-more { /* "Tools" dropdown */<br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* === GLOBAL TYPOGRAPHY === */<br />
<br />
/* Base body text — Liberation Sans */<br />
html,<br />
body,<br />
.mw-body,<br />
.mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 1.2rem; /* base = 16px */<br />
line-height: 1.15; <br />
}<br />
<br />
/* Paragraphs and list text */<br />
p, li, td, th {<br />
font-size: 1.1rem; /* slightly larger than base text */<br />
}<br />
<br />
/* === HEADINGS — Linux Libertine === */<br />
h1, h2, h3, h4, h5, h6,<br />
.firstHeading,<br />
.mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
.mw-body h1, .mw-heading1, .mw-body-content h1, .mw-body-content .mw-heading1 { font-size: 3rem; line-height: 1.15; } <br />
<br />
<br />
<br />
/* === SIDEBAR MENU === */<br />
#mw-panel,<br />
.vector-menu-content,<br />
#p-navigation,<br />
#p-tb,<br />
#p-lang {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem; /* sidebar smaller for contrast */<br />
line-height: 1.4;<br />
}<br />
<br />
#mw-panel,<br />
.vector-menu-content {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 90%, rgba(192, 192, 192, 1) 100%);<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
#partner-logos {<br />
display: flex;<br />
justify-content: right;<br />
align-items: right;<br />
flex-wrap: wrap;<br />
gap: 1rem;<br />
margin-top:0.8rem;<br />
<br />
}<br />
<br />
#partner-logos img {<br />
height: 32px;<br />
object-fit: contain; /* keeps aspect ratio, fits within the box */<br />
max-width: 100%; /* prevents overflow */<br />
display: block; /* removes inline gaps below images */<br />
}<br />
<br />
<br />
<br />
<br />
<br />
<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
/* === Modern Wiki Table Styling === */<br />
.wikitable.custom-table {<br />
width: 100%;<br />
border-collapse: separate;<br />
border-spacing: 0;<br />
border: none;<br />
background-color: #fff;<br />
border-radius: 0.5rem;<br />
overflow: hidden; /* so rounded corners clip correctly */<br />
font-size: 0.95rem;<br />
}<br />
<br />
<br />
<br />
/* Header cells */<br />
.wikitable.custom-table th {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
color: #000;<br />
font-weight: 600;<br />
text-align: left;<br />
padding: 0.75rem 1rem;<br />
border-bottom: 2px solid #d0d9ff;<br />
}<br />
<br />
/* Data cells */<br />
.wikitable.custom-table td {<br />
padding: 0.65rem 1rem;<br />
border-bottom: 1px solid #eee;<br />
}<br />
<br />
/* Zebra striping */<br />
.wikitable.custom-table tr:nth-child(even) td {<br />
background-color: #f9fbff;<br />
}<br />
<br />
/* Hover effect */<br />
.wikitable.custom-table tr:hover td {<br />
background: #FFF;<br />
background: linear-gradient(0deg,rgba(0, 0, 255, 1) 0%, rgba(255, 255, 255, 1) 15%, rgba(255, 255, 255, 1) 85%, rgba(0, 0, 255, 1) 100%);<br />
}<br />
<br />
/* Rounded corners for first & last rows */<br />
.wikitable.custom-table tr:first-child th:first-child {<br />
border-top-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:first-child th:last-child {<br />
border-top-right-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:first-child {<br />
border-bottom-left-radius: 0.5rem;<br />
}<br />
.wikitable.custom-table tr:last-child td:last-child {<br />
border-bottom-right-radius: 0.5rem;<br />
}<br />
<br />
<br />
/* === Mobile Responsive Tables (no HTML change needed) === */<br />
@media (max-width: 768px) {<br />
<br />
/* Allow horizontal scrolling on narrow screens */<br />
.wikitable.custom-table {<br />
display: block;<br />
width: 100%;<br />
overflow-x: auto;<br />
-webkit-overflow-scrolling: touch;<br />
}<br />
<br />
/* Prevent collapsing/squeezing of long cell content */<br />
.wikitable.custom-table tr,<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
white-space: nowrap;<br />
}<br />
<br />
/* Optional: slightly reduce padding for small screens */<br />
.wikitable.custom-table td,<br />
.wikitable.custom-table th {<br />
padding: 0.5rem 0.75rem;<br />
}<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* Hide the automatic Tools and Special pages sections */<br />
#p-tb { <br />
display: none !important;<br />
}<br />
<br />
<br />
<br />
<br />
<br />
/* MAIN-PAGE */<br />
<br />
/* === FONTS (yours) === */<br />
@font-face {<br />
font-family: "Liberation Sans";<br />
src: url("/resources/fonts/LiberationSans-Regular.ttf");<br />
}<br />
@font-face {<br />
font-family: "Linux Libertine";<br />
src: url("/resources/fonts/LinLibertine_R.ttf");<br />
}<br />
.mw-pt-languages {<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);}<br />
/* === GLOBAL TYPOGRAPHY === */<br />
html, body, .mw-body, .mw-parser-output {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif;<br />
font-size: 1.2rem;<br />
line-height: 1.1;<br />
}<br />
p, li, td, th { font-size: 1.1rem; line-height: 1.1; }<br />
h1, h2, h3, h4, h5, h6, .firstHeading, .mw-headline {<br />
font-family: "Linux Libertine", Georgia, serif;<br />
}<br />
<br />
/* === d*sign week layout === */<br />
:root {<br />
--dw-border: #cfd8e3;<br />
--dw-card-bg: #f8fbff;<br />
}<br />
<br />
/* top ribbon */<br />
.dw-ribbon {<br />
height: 26px;<br />
background: linear-gradient(#8aa9ff, #ffffff);<br />
border-radius: 6px;<br />
margin: 0 0 14px 0;<br />
}<br />
<br />
<br />
.banner {<br />
display: flex;<br />
align-items: center;<br />
justify-content: space-between;<br />
gap: 1.5rem;<br />
padding: 0rem 1rem 0rem 1rem;<br />
text-align: left; /* centers text within its box */<br />
flex-wrap: wrap; <br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 80%, rgba(0, 0, 255, 1) 100%);<br />
background-size: 100% 200%;<br />
background-position: top;<br />
transition: background-position 0.4s ease-in-out;<br />
}<br />
.banner:hover {<br />
background-position: bottom;<br />
}<br />
<br />
<br />
.banner-icon img { <br />
width: 20vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 650px; /* prevent it from getting too big */ <br />
min-width: 120px; /* prevent it from getting too small */ <br />
padding-left: 2rem;}<br />
<br />
.dw-subtitle {<br />
font-size: 1.5rem;<br />
line-height: 1;<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle-banner {<br />
font-size: 3rem;<br />
}<br />
.dw-subtitle strong {<br />
<br />
text-align: left !important;<br />
}<br />
<br />
.dw-subtitle a {<br />
color: #0000FF !important; /* link color similar to your example */<br />
text-decoration: none;<br />
}<br />
<br />
.dw-subtitle a:hover {<br />
text-decoration: underline;<br />
}<br />
<br />
<br />
/* title & subtitle */<br />
.dw-title {<br />
text-align: center;<br />
line-height: 1.2;<br />
font-size: 2.5rem;<br />
font-weight: 700;<br />
letter-spacing: .02em;<br />
display: block;<br />
}<br />
<br />
<br />
/* grid */<br />
.dw-grid {<br />
display: flex;<br />
flex-wrap: wrap;<br />
gap: 16px;<br />
align-items: flex-start;<br />
margin-top: 14px;<br />
}<br />
.dw-col {<br />
flex: 1 1 520px;<br />
min-width: 320px;<br />
}<br />
<br />
/* cards */<br />
.dw-card {<br />
position: relative;<br />
border: 1px solid #C0C0C0;<br />
background: #FFFFFF !important;<br />
padding: 10px;<br />
margin-bottom: 10px;<br />
}<br />
.dw-card:hover {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 75%, rgba(192, 192, 192, 1) 100%)!important;<br />
}<br />
span.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
<br />
}<br />
<br />
.dw-headline.mw-headline {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
font-size: 2rem !important; <br />
}<br />
<br />
<br />
.dw-card .dw-row {<br />
display: flex;<br />
flex-wrap: wrap;<br />
align-items: flex-start;<br />
gap: 12px;<br />
width: 100%;<br />
box-sizing: border-box;<br />
padding: 14px; /* ✅ move the spacing here instead of .dw-card */<br />
}<br />
<br />
.dw-card .dw-row > div:last-child {<br />
flex: 1;<br />
min-width: 0; /* ✅ prevents overflow due to long text/links */<br />
}<br />
<br />
.dw-card .dw-icon img { height: auto; }<br />
.dw-card .dw-headline {<br />
display: block;<br />
font-size: 1.5rem;<br />
font-weight: 700;<br />
margin: 0px 0 0px;<br />
}<br />
.dw-card .dw-body { line-height: 1.6; width: 100%;}<br />
.dw-card .dw-body--spacious { line-height: 1.8; }<br />
<br />
<br />
.dw-icon,<br />
.dw-subtitle {<br />
background: transparent !important; /* ✅ makes logo + text boxes transparent */<br />
}<br />
<br />
<br />
/* Code blocks explicitly monospace (so they don't inherit) */<br />
pre, code, kbd, samp, tt, .mw-code {<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
text-indent: 0 !important;<br />
}<br />
<br />
/* ===== Remove first-line indentation site-wide ===== */<br />
.mw-parser-output p,<br />
.mw-parser-output li p,<br />
.mw-body-content p,<br />
.dw-card .dw-body p {<br />
text-indent: 0 !important;<br />
}<br />
<br />
<br />
pre {<br />
margin: 0 !important;<br />
padding: 0rem !important; /* add a little inner spacing so text isn’t on the edge */<br />
background: linear-gradient(0deg,rgba(192, 192, 192, 1) 2%, rgba(255, 255, 255, 1) 22%);<br />
border: none !important;<br />
font-family: "Liberation Sans", Arial, Helvetica, sans-serif !important;<br />
white-space: pre-wrap !important; /* allows wrapping */<br />
word-break: break-word !important;<br />
line-height: 1 !important;<br />
<br />
}<br />
<br />
.dw-card .pre {<br />
display: block; /* ensures it behaves as a block element */<br />
width: 100% !important;/* takes up the full width of .dw-card */<br />
box-sizing: border-box;/* includes padding/border in width calculation */<br />
margin: 0;<br />
padding: 0;<br />
}<br />
<br />
<br />
div.mw-content-ltr.mw-parser-output {<br />
background: #FFFFFF;<br />
background: linear-gradient(0deg, rgba(255, 255, 255, 1) 70%, rgba(192, 192, 192, 1) 95%);<br />
padding: 1rem;<br />
}<br />
<br />
div#content.mw-body {<br />
background: linear-gradient(to top, #0000FF, #ffffff) !important; /* blue → white gradient */<br />
}<br />
<br />
<br />
body.skin-vector-legacy.mediawiki.ltr.sitedir-ltr.mw-hide-empty-elt.ns-0.ns-subject {<br />
background-image: url("https://dsignweek.servus.at/images/9/9d/Bg-01.png");<br />
background-repeat: repeat-y; /* ✅ repeat vertically */<br />
background-size: 100% auto; /* stretch to page width, keep height natural */<br />
background-position: center top; /* start at the top, center horizontally */<br />
background-attachment: scroll; /* move with page scroll */<br />
background-color: #ffffff; /* fallback behind transparent areas */<br />
}<br />
<br />
div#mw-head {<br />
background: transparent !important;<br />
}<br />
<br />
<br />
.dw-headline, .mw-headline {<br />
margin: 0 !important;<br />
}<br />
<br />
<br />
/* ===== Mobile: stack card content vertically ===== */<br />
@media (max-width: 720px) {<br />
<br />
.header-container.header-chrome {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 75%, rgba(192, 192, 192, 1) 95%);<br />
}<br />
.minerva-footer {<br />
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 75%, rgba(192, 192, 192, 1) 95%);<br />
}<br />
<br />
#content.mw-body {<br />
background: linear-gradient(to top, #0000FF, #ffffff) !important; /* blue → white gradient */<br />
}<br />
<br />
.dw-card {<br />
padding:0;}<br />
div#content.mw-body {<br />
padding: 0rem;}<br />
div.mw-content-ltr.mw-parser-output {<br />
padding: 0.5rem;<br />
}<br />
<br />
.banner-icon img { <br />
width: 80vw; /* 15% of the viewport width */ <br />
height: auto; <br />
max-width: 650px; /* prevent it from getting too big */ <br />
min-width: 120px; /* prevent it from getting too small */ <br />
padding-left: 0rem;}<br />
<br />
/* Stack everything in a column */<br />
.dw-card .dw-row {<br />
display: flex;<br />
flex-direction: column;<br />
align-items: stretch; /* full width for text block */<br />
gap: 10px;<br />
}<br />
<br />
/* Make the icon its own row and center it */<br />
.dw-card .dw-icon {<br />
display: flex;<br />
justify-content: center;<br />
align-items: center;<br />
margin: 0; /* remove any left/right spacing from desktop */<br />
}<br />
<br />
.dw-card .dw-icon img {<br />
width: 72px; /* tidy mobile size */<br />
height: auto;<br />
}<br />
<br />
/* Ensure the text block fills width */<br />
.dw-card .dw-row > div {<br />
width: 100%;<br />
}<br />
<br />
/* Slight spacing tweaks for headings on mobile */<br />
.dw-card .dw-headline {<br />
margin: 4px 0 4px;<br />
}<br />
<br />
.partner-logos {<br />
display: flex;<br />
flex-wrap: wrap; /* allows wrapping on small screens */<br />
justify-content: space-between !important; <br />
align-items: center!important; <br />
gap: 1.4rem; <br />
padding: 0 1rem 1rem 1rem; /* breathing room top & bottom */<br />
background: transparent;<br />
}<br />
<br />
.partner-logos img {<br />
height: 24px;<br />
width: auto;<br />
object-fit:contain;<br />
}<br />
<br />
}</div>
Ivans