MediaWiki:Common.css: Difference between revisions
From Citypedia Online
Super Admin (talk | contribs) mNo edit summary |
Super Admin (talk | contribs) No edit summary |
||
| Line 49: | Line 49: | ||
color: #36c !important; /* Highlights blue on hover */ | color: #36c !important; /* Highlights blue on hover */ | ||
transform: translateY(-1px); | transform: translateY(-1px); | ||
} | |||
.nav-icon { | |||
width: 20px; /* Sets the width of your icon */ | |||
height: 20px; /* Sets the height */ | |||
vertical-align: middle; | |||
margin-right: 5px; /* Space between icon and text */ | |||
object-fit: contain; | |||
} | } | ||
Revision as of 16:12, 2 January 2026
/* CSS placed here will be applied to all skins */
/* Add icons to sidebar city links */
#n-Mumbai a {
background: url(https://citypedia.online/images/0/0b/Mumbai.png) no-repeat left center;
padding-left: 25px !important;
background-size: 18px;
}
#n-Pune a {
background: url(https://citypedia.online/images/8/86/Pune.png) no-repeat left center;
padding-left: 25px !important;
background-size: 18px;
}
#n-Thane a {
background: url(https://citypedia.online/images/d/d0/Thane.png) no-repeat left center;
padding-left: 25px !important;
background-size: 18px;
}
/* Global City Bar Styling */
#global-city-bar {
background-color: #202122; /* Dark professional background */
color: #ffffff;
width: 100%;
padding: 8px 0;
font-family: 'Segoe UI', Roboto, sans-serif;
border-bottom: 3px solid #36c; /* Blue accent line */
z-index: 9999;
}
.city-bar-content {
max-width: 1200px;
margin: 0 auto;
display: flex;
justify-content: center;
gap: 30px;
}
.city-link {
color: #ffffff !important;
text-decoration: none !important;
font-size: 14px;
font-weight: bold;
transition: 0.2s;
}
.city-link:hover {
color: #36c !important; /* Highlights blue on hover */
transform: translateY(-1px);
}
.nav-icon {
width: 20px; /* Sets the width of your icon */
height: 20px; /* Sets the height */
vertical-align: middle;
margin-right: 5px; /* Space between icon and text */
object-fit: contain;
}
/* Hide city names on very small phones to keep it clean */
@media (max-width: 480px) {
.city-name { display: none; }
.city-bar-content { gap: 40px; font-size: 20px; }
}
