MediaWiki:Mobile.css: Difference between revisions

MediaWiki:Mobile.css (view source)

Revision as of 03:56, 28 August 2025

331 bytes added , 28 August

no edit summary

Admin

Bureaucrats, Interface administrators, Administrators

161

edits

@@ Line 1: / Line 1: @@
 /* All CSS here will be loaded for users of the mobile site */
-/* Login form styling */
+/* ================================
-#userloginForm {
+   Login form styling (Mobile only)
-    max-width: 400px;
+   ================================ */
-    margin: 30px auto;
+@media screen and (max-width: 768px) {
-    padding: 15px;
+    #userloginForm {
-    background: #fff;
+        max-width: 400px;
-    border-radius: 10px;
+        margin: 30px auto;
-    box-shadow: 0 2px 6px rgba(0,0,0,0.15);
+        padding: 15px;
-}
+        background: #fff;
+        border-radius: 10px;
+        box-shadow: 0 2px 6px rgba(0,0,0,0.15);
+    }
-#userloginForm label {
+    #userloginForm label {
-    display: block;
+        display: block;
-    font-weight: bold;
+        font-weight: bold;
-    margin-bottom: 5px;
+        margin-bottom: 5px;
-    font-size: 14px;
+        font-size: 14px;
-}
+    }
-#userloginForm input[type="text"],
+    #userloginForm input[type="text"],
-#userloginForm input[type="password"] {
+    #userloginForm input[type="password"] {
-    width: 100%;
+        width: 100%;
-    padding: 12px;
+        padding: 12px;
-    font-size: 14px;
+        font-size: 14px;
-    margin-bottom: 15px;
+        margin-bottom: 15px;
-    border: 1px solid #ccc;
+        border: 1px solid #ccc;
-    border-radius: 6px;
+        border-radius: 6px;
-}
+    }
-#wpRemember {
+    #wpRemember {
-    margin-right: 6px;
+        margin-right: 6px;
-}
+    }
-#userloginForm .mw-ui-button {
+    #userloginForm .mw-ui-button {
-    background-color: #1877f2;
+        background-color: #1877f2;
-    border: none;
+        border: none;
-    border-radius: 6px;
+        border-radius: 6px;
-    padding: 12px;
+        padding: 12px;
-    color: #fff;
+        color: #fff;
-    width: 100%;
+        width: 100%;
-    font-size: 15px;
+        font-size: 15px;
-    font-weight: bold;
+        font-weight: bold;
-    cursor: pointer;
+        cursor: pointer;
-}
+    }
-#userloginForm .mw-ui-button:hover {
+    #userloginForm .mw-ui-button:hover {
-    background-color: #166fe5;
+        background-color: #166fe5;
-}
+    }
-#userloginForm .login-links {
+    #userloginForm .login-links {
-    text-align: center;
+        text-align: center;
-    margin-top: 15px;
+        margin-top: 15px;
-}
+    }
-#userloginForm .login-links a {
+    #userloginForm .login-links a {
-    display: block;
+        display: block;
-    color: #5f4dee;
+        color: #5f4dee;
-    margin-top: 8px;
+        margin-top: 8px;
-    font-size: 14px;
+        font-size: 14px;
-    text-decoration: none;
+        text-decoration: none;
+    }
 }