MediaWiki:Common.css: Difference between revisions

From Filmwerkplaats MediaWiki
Jump to navigation Jump to search
(Created page with "→‎CSS placed here will be applied to all skins: →‎SimpleCalendar styling: table.calendar { width: 100%; border-collapse: collapse; font-family: sans-serif; font-size: 0.95em; margin: 1em 0; } .calendar th, .calendar td { border: 1px solid #ccc; padding: 0.75em; text-align: center; vertical-align: top; min-width: 100px; } .calendar td a { display: block; color: #0366d6; text-decoration: none; font-weight: bol...")
 
No edit summary
 
(7 intermediate revisions by the same user not shown)
Line 1: Line 1:
/* CSS placed here will be applied to all skins */
/* ==== SimpleCalendar Styling ==== */
/* SimpleCalendar styling */
 
table.calendar {
/* Make calendar table fill the width */
     width: 100%;
.mw-parser-output table.calendar {
     border-collapse: collapse;
     width: 100% !important;
     font-family: sans-serif;
     border-collapse: collapse !important;
     font-size: 0.95em;
     font-family: sans-serif !important;
     margin: 1em 0;
     table-layout: fixed !important;
     margin: 1em 0 !important;
    font-size: 28px !important;
}
}


.calendar th,
/* Style headers (month names and weekdays) */
.calendar td {
.mw-parser-output .calendar th {
     border: 1px solid #ccc;
     background-color: #f0f0f0;
     padding: 0.75em;
     padding: 0.75em;
    font-size: 32px !important;
     text-align: center;
     text-align: center;
}
/* Style each day cell */
.mw-parser-output .calendar td {
    border: 1px solid #ccc;
    padding: 0.6em;
     vertical-align: top;
     vertical-align: top;
     min-width: 100px;
     text-align: center;
    font-size: 28px !important;
    height: 100px;
    overflow: hidden;
}
}


.calendar td a {
/* Style the day number links */
.mw-parser-output .calendar td a {
     display: block;
     display: block;
    font-size: 32px !important;
    line-height: 40px !important;
     color: #0366d6;
     color: #0366d6;
     text-decoration: none;
     text-decoration: none;
Line 26: Line 41:
}
}


.calendar td a:hover {
/* Hover effect */
     background-color: #f5f5f5;
.mw-parser-output .calendar td a:hover {
     border-radius: 4px;
     background-color: #e0e0e0;
     border-radius: 6px;
}
}

Latest revision as of 15:51, 12 May 2025

/* ==== SimpleCalendar Styling ==== */

/* Make calendar table fill the width */
.mw-parser-output table.calendar {
    width: 100% !important;
    border-collapse: collapse !important;
    font-family: sans-serif !important;
    table-layout: fixed !important;
    margin: 1em 0 !important;
    font-size: 28px !important;
}

/* Style headers (month names and weekdays) */
.mw-parser-output .calendar th {
    background-color: #f0f0f0;
    padding: 0.75em;
    font-size: 32px !important;
    text-align: center;
}

/* Style each day cell */
.mw-parser-output .calendar td {
    border: 1px solid #ccc;
    padding: 0.6em;
    vertical-align: top;
    text-align: center;
    font-size: 28px !important;
    height: 100px;
    overflow: hidden;
}

/* Style the day number links */
.mw-parser-output .calendar td a {
    display: block;
    font-size: 32px !important;
    line-height: 40px !important;
    color: #0366d6;
    text-decoration: none;
    font-weight: bold;
    padding: 0.3em;
}

/* Hover effect */
.mw-parser-output .calendar td a:hover {
    background-color: #e0e0e0;
    border-radius: 6px;
}