MediaWiki:Mobile.css: Difference between revisions

← Older edit

MediaWiki:Mobile.css (view source)

Revision as of 06:53, 8 January 2026

3,262 bytes added , 8 January

m

Sync with MediaWiki:Common.css

-u ndefined-

Interface administrators, Administrators

1,072

edits

@@ Line 1: / Line 1: @@
-figure.image-mobile {
+/*
-   margin: 0 auto;
+ * Global styles
-   display: table;
+ * Sync with MediaWiki:Common.css
+ */
+@font-face {
+  font-family: "Baloo2";
+  src: url(/wikiw/resources/fonts/Baloo2-Regular.ttf) format("truetype");
+  font-weight: 400;
+  font-style: normal;
+  font-display: swap;
+}
+@font-face {
+  font-family: "Baloo2";
+  src: url(/wikiw/resources/fonts/Baloo2-Medium.ttf) format("truetype");
+  font-weight: 500;
+  font-style: normal;
+  font-display: swap;
+}
+@font-face {
+  font-family: "Baloo2";
+  src: url(/wikiw/resources/fonts/Baloo2-Bold.ttf) format("truetype");
+  font-weight: 700;
+  font-style: normal;
+  font-display: swap;
+}
+html,body, .mw-body {
+  font-family: "Baloo2", sans-serif;
+  font-size: 19px;
+}
+.mw-body h1, .mw-body h2 {
+  font-family: "Baloo2", sans-serif;
+  font-weight: 500;
+  border-bottom: 2px solid #000000b0;
+}
+.quest-icons img {
+  border: 4px solid #000;
+  width: 64px;
+  height: 64px;
+}
+.infobox {
+  width: 272px;
+  background-color: #f9f9f9;
+  border: 2px solid #808080 !important; /* This flag is set to make the boxes appear consistent across all skins */
+  border-radius: 10px;
+  box-sizing: border-box;
+  box-shadow: 0px -6px #0004 inset;
+  padding: 0.4em 0.4em 1em;
+  font-size: 90%;
+  line-height: 1.5em;
+  float: right;
+  clear: right;
+  margin: 0 0 1em 1em;
+}
+.infobox-title {
+  font-size: 140%;
+  font-weight: bold;
+  text-align: center;
+  padding: 5px;
+  border-bottom: 2px solid #a2a9b1;
+}
+.infobox-image {
+  text-align: center;
+   margin: 5px 0;
+}
+.infobox-caption {
+  font-size: 90%;
+  text-align: center;
+  padding: 2px 5px;
+}
+.infobox-table {
+   display: table !important;
+  width: 100%;
    border-collapse: collapse;
-   clear: none;
+}
-   float: none;
+.infobox-header th {
+  background-color: #e6e6e6;
+  font-weight: bold;
+  text-align: left;
+  padding: 5px;
+  border-bottom: 1px solid #a2a9b1;
+}
+.infobox-row td {
+  padding: 2px 5px;
+  border-bottom: 1px solid #bdbdbd; /* Color slightly differs on mobile */
+}
+.infobox-label {
+  font-weight: bold;
+  background-color: #f2f2f2;
+}
+.notice {
+  width: 80%;
+  margin: auto;
+  background-color: #f9f9f9;
+  border: 2px solid #808080;
+  border-radius: 10px;
+  box-shadow: 0px -6px #0004 inset;
+  padding: 0.4em 0.4em 0.6em;
+}
+.port-rectangle {
+  display: inline-block;
+  width: 1em;
+  height: 1em;
+  background-color: #000000;
+  vertical-align: baseline;
+}
+.port-rectangle-execution {
+  background-color: #FFE640;
+}
+.port-rectangle-number {
+  background-color: #00DCFF;
+}
+.port-rectangle-vector {
+  background-color: #00FF80;
+}
+.port-rectangle-rotation {
+  background-color: #FF8040;
+}
+.port-rectangle-truth {
+  background-color: #FF4040;
+}
+.port-rectangle-object {
+  background-color: #FF80C0;
+}
+.port-rectangle-constraint {
+  background-color: #A0AAC8;
+}
+.main-column-box {
+  border: 3px solid #000;
+  border-radius: 20px;
+  box-shadow: 0px -10px #0004 inset;
+  flex: 1 1 30%;
+  margin-bottom: 0.4em;
+  padding: 0.4em 0.4em 1em;
+}
+.main-welcome-box {
+  background-color: #f9f9f9;
+  border: 3px solid #202020;
+  border-radius: 20px;
+  box-shadow: 0px -10px #0004 inset;
+  margin-bottom: 0.4em;
+  padding: 0.4em 0.4em 1em;
+  display: grid;
+  grid-template-columns: auto auto;
+  grid-column-gap: 0.4em;
+}
+.main-image {
+  text-align: center;
+  border-right: inherit;
+}
+@media only screen and (max-width: 600px) {
+   .main-welcome-box {
+    grid-template-columns: auto;
+   }
+  .main-image {
+    border-right: none;
+    border-bottom: inherit;
+  }
 }