MediaWiki:Common.css: Difference between revisions

← Older edit

@@ Line 1: / Line 1: @@
 /* MediaWiki:Common.css */
+/*Styling for CharacterInsert toolbar*/
+#mw-edittools-charinsert {
+	margin: 10px 0;
+	padding: 5px;
+	background: #f8f9fa;
+	border: 1px solid #ccc;
+	box-shadow: 0 2px 1px 0 rgba(0,0,0,0.1);
+}
+#mw-edittools-charinsert input, #mw-edittools-charinsert select {
+	margin: 2px;
+	padding: 4px 8px;
+	border: 1px solid #a2a9b1;
+	font-size: 0.7em;
+	color: #54595d;
+}
+/*Styling for tutorial page "Arbeiten mit DPL3"; KANN ANSCHLIEßEND ENTFERT WERDEN*/
+.page-Arbeiten_mit_DPL3 #page-content > .row {
+	max-width:90%;
+}
 /* Tabelle mit ID 'example' */
@@ Line 44: / Line 67: @@
 table.display tbody tr:hover {
    background-color: #fcffcc;
+}
+/* ================================
+   Custom CSS for #styling-test table
+   MediaWiki with Vector 2022 skin
+   ================================ */
+/* --- Base table styling --- */
+#styling-test {
+    width: 100%;                /* Make table span full container width */
+    border-collapse: collapse;  /* Remove space between borders */
+    background-color: #ffffff;  /* Background color for the table */
+    font-family: Arial, sans-serif;
+    font-size: 14px;
+    color: #333;
+    margin-bottom: 1em;
+}
+/* --- Table headers --- */
+#styling-test thead th {
+    background-color: #f8f9fa;  /* Light gray background */
+    color: #202122;             /* Dark text for contrast */
+    padding: 10px;
+    border: 1px solid #a2a9b1;
+    text-align: left;
+    font-weight: bold;
+}
+/* --- Table body cells --- */
+#styling-test tbody td {
+    padding: 8px;
+    border: 1px solid #ddd;     /* Light border */
+    vertical-align: top;
+}
+/* --- Row hover effect --- */
+#styling-test tbody tr:hover {
+    background-color: #eef6ff;  /* Light blue highlight */
+}
+/* --- Alternating row colors (zebra striping) --- */
+#styling-test tbody tr:nth-child(even) {
+    background-color: #f5f5f5;
+}
+/* --- Sorting indicators (DataTables) --- */
+#styling-test thead th.sorting,
+#styling-test thead th.sorting_asc,
+#styling-test thead th.sorting_desc {
+    cursor: pointer;
+    position: relative;
+    padding-right: 25px;
+}
+#styling-test thead th.sorting::after,
+#styling-test thead th.sorting_asc::after,
+#styling-test thead th.sorting_desc::after {
+    position: absolute;
+    right: 8px;
+    top: 50%;
+    margin-top: -6px;
+    content: "";
+    border: 6px solid transparent;
+}
+/* Ascending arrow */
+#styling-test thead th.sorting_asc::after {
+    border-bottom-color: #000;
+}
+/* Descending arrow */
+#styling-test thead th.sorting_desc::after {
+    border-top-color: #000;
+}
+/* --- Pagination, info, and filter (DataTables UI) --- */
+.dataTables_wrapper {
+    font-size: 14px;
+    margin-top: 10px;
+}
+/* Pagination controls */
+.dataTables_wrapper .dataTables_paginate {
+    text-align: right;
+    margin-top: 10px;
+}
+.dataTables_wrapper .dataTables_paginate a {
+    margin: 0 3px;
+    padding: 5px 10px;
+    border: 1px solid #ccc;
+    border-radius: 3px;
+    text-decoration: none;
+    color: #202122;
+    background-color: #f8f9fa;
+}
+.dataTables_wrapper .dataTables_paginate a.current {
+    background-color: #36c;
+    color: white;
+    border-color: #36c;
+}
+/* Filter box (search) */
+.dataTables_wrapper .dataTables_filter input {
+    padding: 5px;
+    border: 1px solid #ccc;
+    border-radius: 3px;
+}
+/* Length menu (show X entries) */
+.dataTables_wrapper .dataTables_length select {
+    padding: 5px;
+    border: 1px solid #ccc;
+    border-radius: 3px;
+}
+/* Info text (Showing X to Y of Z entries) */
+.dataTables_wrapper .dataTables_info {
+    margin-top: 10px;
+    color: #555;
 }