MediaWiki:Common.css: Difference between revisions

mNo edit summary
mNo edit summary
Line 62: Line 62:
}
}


/* Center the specific notice element */
/* Center the body of the dismissable notice */
.vector-sitenotice-container #siteNotice > div > .mw-dismissable-notice > .mw-dismissable-notice-body > #localNotice > div > #namespace-notice > div.notice.hide-for-print.curved.dismissible-notice {
.vector-sitenotice-container .mw-dismissable-notice-body {
     text-align: center;
     text-align: center;
     display: block;
     display: block;
     margin-left: auto;
     margin-left: auto;
     margin-right: auto;
     margin-right: auto;
    width: 65%; /* Or whatever width you desire for the notice box */
}
}


/* Position the close button */
/* Also try centering the localNotice container */
.vector-sitenotice-container .mw-dismissable-notice-close {
.vector-sitenotice-container #localNotice {
     position: absolute;
     text-align: center;
     top: 0.5em; /* Adjust as needed */
     display: block;
     right: 0.5em; /* Adjust as needed */
     margin-left: auto;
     cursor: pointer;
     margin-right: auto;
}
}


/* Ensure the mw-dismissable-notice has relative positioning and padding */
/* Ensure the dismissable notice has relative positioning and padding for the button */
.vector-sitenotice-container .mw-dismissable-notice {
.vector-sitenotice-container .mw-dismissable-notice {
     position: relative;
     position: relative;
     padding-right: 3em; /* Adjust based on button size */
     padding-right: 2em; /* Adjust based on button size */
    display: inline-block; /* To contain the width of the notice */
}
}


/* Ensure #siteNotice doesn't collapse */
/* Position the close button (adjust if needed) */
.vector-sitenotice-container #siteNotice {
.vector-sitenotice-container .mw-dismissable-notice-close {
     display: block; /* Or inline-block, adjust as needed */
     position: absolute;
     width: 100%; /* Allow it to take full width */
    top: 0.5em;
    right: 0.5em;
     cursor: pointer;
}
}


/* Center the #siteNotice within vector-sitenotice-container */
/* Ensure the vector-sitenotice-container centers its content */
.vector-sitenotice-container {
.vector-sitenotice-container {
     text-align: center;
     text-align: center;
}
}