/* For Main Page Announcement area //this code pulls from the https://ilc.upd.edu.ph/all-posts-and-announcements/ PAGE */
console.log("JS WORKING");

(function () {

console.log("RUNNING IMMEDIATELY");

const container =
document.getElementById("ilc-announcements");

console.log("Container:", container);

if (!container) return;

container.innerHTML = "Loading script...";

fetch("https://ilc.upd.edu.ph/wp-json/wp/v2/posts?per_page=5")
.then(res => res.json())
.then(posts => {

let html = "";

posts.forEach(post => {
html += `
<p>
<a href="${post.link}" target="_blank">
${post.title.rendered}
</a>
</p>
`;
});

container.innerHTML = html;

})
.catch(err => {
console.error("FETCH ERROR:", err);
container.innerHTML = "<p>Failed to load announcements</p>";
});

})();
/*end of new code */

/* Any JavaScript here will be loaded for all users on every page load. */
$(window).on('load', function(){
$('#site-tools ul').append("<li><a href='https://iskwiki.upd.edu.ph' target='_blank'>Flipbook</li>");
});

/*Helpdesk bubble*/
/*
$(function () {
var bubble = $('<div id="ost-bubble">💬</div>');
var panel = $('<div id="ost-panel"><iframe src="https://helpdesk.ilc.upd.edu.ph/o.php"></iframe></div>');

$('body').append(bubble).append(panel);

bubble.on('click', function () {
panel.toggle();
});
});
*/
/* Helpdesk bubble */
$(function () {
var bubble = $('<div id="ost-bubble">' +
'<img src="https://helpdesk.ilc.upd.edu.ph/images/ilc-images/Helpdesk-logo-bubble.png" alt="💬">' +
'</div>');

var panel = $(
'<div id="ost-panel">' +
'<div id="ost-panel-header">' +
'<img src="https://helpdesk.ilc.upd.edu.ph/logo.php" alt="Helpdesk" style="height:80px;"> ' +
'<span id="ost-panel-close">×</span>' +
'</div>' +
'<div id="ost-panel-body">' +
'<iframe src="https://helpdesk.ilc.upd.edu.ph/o.php"></iframe>' +
'</div>' +
'<div id="ost-panel-footer">' +
'' +
'</div>' +
'</div>'
);

$('body').append(bubble).append(panel);

bubble.on('click', function () {
panel.toggleClass('ost-open');
});

panel.find('#ost-panel-close').on('click', function () {
panel.removeClass('ost-open');
});
});

/*Pop-up*/
$(function () {
// Change this whenever you update the popup
const popupVersion = "welcome-v1";

// Only show once
if (localStorage.getItem(popupVersion)) {
return;
}

const overlay = $(`
<div id="welcome-overlay">
<div id="welcome-popup">
<button id="welcome-close">×</button>

<img src="/images/Survey-link.png"
alt="Survey Link" id="welcome-image">

<button id="welcome-ok">Continue</button>
</div>
</div>
`);

$("body").append(overlay);

function closePopup() {
localStorage.setItem(popupVersion, "shown");
overlay.fadeOut(300, function () {
overlay.remove();
});
}

$("#welcome-close").on("click", closePopup);
$("#welcome-ok").on("click", closePopup);
});

2026-06-30T00:57:49Z

PaulineA:

MediaWiki:Common.js

2026-06-30T00:55:16Z

PaulineA:

Another test

2026-06-24T02:57:09Z

PaulineA:

Another test

2026-06-19T04:21:08Z

PaulineA: /* another test */

MediaWiki:Common.css

2026-06-18T01:43:21Z

PaulineA:

/* CSS placed here will be applied to all skins */
/*
* GLOBAL
*/
body{
font-family: 'Helvetica Neue','Nimbus Sans','Helvetica','Arial',sans-serif;
font-size: 0.95em;
line-height: 1.4;

}

/*.mw-userlogin-rememberme {display:none;}*/

#p-logo-text a {
font-variant: unset !important;
font-size: 1.50em !important;
}
#p-logo-text a::first-letter {
text-transform: uppercase;
}
#userloginForm .mw-htmlform-field-HTMLInfoField {
display:none;
}
tr.statistics-group-bot,
tr.statistics-group-sysop,
tr.statistics-group-bureaucrat,
tr.statistics-group-widgeteditor {
display:none;
}
a.new:hover, .new a:hover, a.new:visited, .new a:visited {color: #850038;}
a.new, .new a {color: #0E6021;}
.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button {background-color:#1b3256;}
a {color:#36b;}
a:hover, a:visited {color:#0088dd;}
fieldset legend {color:#1b3256;}
.addthis_button_facebook, .addthis_button_google_plusone, .addthis_button_email{
display:none;
}
#mw-content h1.firstHeading { display: none; }
#pt-createaccount {display:none;}

/*
* HEADER
*/
.color-left {background-color:#0E6021;}
.color-right {background-color:#0E6021;}
.color-middle {background-color:#0E6021;}
#mw-header-container {background-color:#850038;color:#ffffff;}
/*
* BLOCKS
*/
#p-logo-text a {font-family:'arial', 'serif';font-weight:600;color:#ffffff;}
/*
* PAGES
*/
body {background-color:#212328;}
#mw-content-container {
background:url(/resources/assets/iskomunidad-22-bg.png) no-repeat center center fixed !important;
background-size:cover !important;}
#mw-content h1.firstHeading {border-bottom: solid 4px #1b3256;}
#mw-page-header-links li.selected {border-bottom-color: #1b3256;}
#mw-site-navigation .sidebar-chunk h3 {border-bottom: solid 2px #1b3256;}
#mw-related-navigation .sidebar-chunk h3 {border-bottom: solid 2px #1b3256;}
#mw-content-container {border-bottom:none; background-image:none;}
#mw-content h1, #mw-content h2 {border-bottom: solid 2px #1b3256 !important;}
/*
* Login
*/
#mw-createaccount-cta {display:none;}
/*
* MainPage
*/

/*Features */
.iskomunidad-features {
display: flex;
flex-direction:row;
}

/*.isk-features-image {display:flex;justify-content:center;}*/
.isk-features-image img{width:100%;max-width:200px;}

.isk-features{
margin:.5em;
background:#fcfcfc;
display:flex;
border: solid #eeeeee;
border-width: 8px 0px 0.2em 0px;
border-radius:5px 5px 0 0;
}
/*
.isk-features-title{font-weight: 600;font-size:1em;}
.isk-features-body {
padding: .5em;
text-align:left;
}*/

.isk-image {
margin:10px;
}

.isko-featured {
box-shadow: rgba(17, 17, 26, 0.1) 0px 1px 0px;
margin:10px;
}

.isko-featured-content {
font-weight:bold;
}

.isko-featured-content #text{
color: #000000;
font-weight:400;
}

/* ILC Announcement */
.ilc-announcement {
display: flex;
flex-direction:row;
}

.isk-article-image {display:flex;justify-content:center;}
.isk-article-image img{width:100%;max-width:330px;}
.isk-article{
margin:.5em;
background:#fcfcfc;
vertical-align:top;
border: solid #eeeeee;
border-width: 8px 0px 0.2em 0px;
border-radius:5px 5px 0 0;
}
.isk-article-title{font-weight: 600;font-size:1em;}
.isk-article-body {
padding: .5em;
text-align:left;
}

@media only screen and (max-width: 600px){
.customized-footer-col {margin-left:-8em !important;}
.isk-lastmod {padding-left: 1.9em !important;margin-left:0;}
}

/* Featured Wiki Pages */
.featuredwiki tr { display:flex; flex-direction: row; }
.communitycontrib tr { display:flex; flex-direction: row; }
.faqandhowto tr { display:flex; flex-direction: row; }
@media (max-width: 800px) {
.featuredwiki tr, .communitycontrib tr, .faqandhowto tr, .ilc-announcement, .iskomunidad-features {
flex-direction: column;
}
}

.main-updates {display:inline-block;}
.main-updates ul {list-style-type: none;}

.mw-body .toctitle{ border-bottom: none; }
hr { border: none; }
#About, #ILC_Diliman_Announcements, #Featured_Wiki, #Community_Contribution, #FAQ_and_How_To, #Features, #Get_Started {
font-size:1.5em;
font-family: "Lato", sans-serif;
font-weight: 800;
color: #012f56;
}

/* background */
#mw-content-container {
background: url('') no-repeat center center fixed !important;
background-size:unset !important;
background-color: #F8F9FA !important;
}

#mw-content,
#mw-related-navigation .sidebar-chunk,
#mw-site-navigation .sidebar-chunk{
box-shadow: rgba(60,64,67,0.3) 0px 1px 2px 0px,rgba(60,64,67,0.15) 0px 2px 6px 2px;
border: solid #fff !important;
}

#mw-related-navigation .sidebar-chunk,
#mw-site-navigation .sidebar-chunk{
background:#ffffff ;
}

.mw-body .mw-parser-output h1:after,
.mw-body .mw-parser-output h2:after {
border-bottom:none;
}

/*
* FOOTER
*/
.isk-lastmod {padding-left: 10em;margin-left:-.5em;}

#f-poweredbyico {display:none;}
#mw-footer-container{border-top:none;background-color:#3a4147;background:url(/resources/assets/iskomunidad-22-footer-revised.jpg) no-repeat center center;background-size: cover;}

.customized-footer-col {display:inline-block;margin-right:3rem !important;vertical-align: top;padding-left:10em !important;}
.customized-footer-col li {margin-left: .5rem !important; line-height: 1.2;}
.customized-footer-col li:nth-child(1) {margin-left: -.5rem !important;font-size: 1.3rem;font-weight: 600;border-bottom:2px solid #FFB81C;}
.customized-footer ul:nth-child(1) .customized-footer-row-5 {margin-left: -.5rem !important;font-size: 1.3rem;font-weight: 600;border-bottom:2px solid #FFB81C;}
.customized-footer ul:nth-child(3) .customized-footer-row-3 {margin-left: -.5rem !important;font-size: 1.3rem;font-weight: 600;border-bottom:2px solid #FFB81C;}
.customized-footer ul:nth-child(4) .customized-footer-row-2 {margin-left: -.5rem !important;font-size: 1.3rem;font-weight: 600;border-bottom:2px solid #FFB81C;}

.customized-footer-two {text-align:center;line-height:.8;}

#mw-footer-container, #mw-footer-container a {
color: #ffffff;
}

/* ConfirmEdit QuestyCaptcha -- on Create Account */
.htmlform-tip + .mw-htmlform-field-HTMLInfoField { color:red; }
/* ConfirmEdit QuestyCaptcha -- on Edit page + add a URL */
label[for=wpCaptchaWord] {
color:green;
font-weight:bold;
font-size:150%;
font-style:italic;
}

/*For NOTES*/

.note {
padding: 5px;
margin: 10px;
border:1px solid;
}

.note-warning {
/**/
background-color: #e7f3fe;
border-color: #ffc107;
}

.note-error {
background-color: #f8d7da;
border-color: #dc3545;
}

.note-info {
/*ackground-color: #e7f3fe; */
background-color: #fff9e3;
border-color: #f5c41c;
}

.note-reminder {
background-color: #dff0d8;
border-color: #28a745;
}

/*images for tutorials*/

/* Add this to MediaWiki:Common.css or your site's CSS */
.noresize {
overflow-x: auto; /* Adds horizontal scrollbar when content overflows */
width: 100%; /* Full width of container */
}

.noresize table {
width: 100%; /* Table fills the container */
min-width: 500px; /* Minimum width before scrolling starts */
}

/* for Helpdesk bubble */
#ost-bubble {
position: fixed;
bottom: 20px;
right: 20px;
width: 60px;
height: 60px;
border-radius: 50%;
background: linear-gradient(135deg, #7B1113 0%, #a3181b 100%);
color: white;
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
z-index: 9999;
box-shadow: 0 4px 14px rgba(123, 17, 19, 0.4);
transition: transform 0.2s ease, box-shadow 0.2s ease;
}

#ost-bubble:hover {
transform: scale(1.08);
box-shadow: 0 6px 20px rgba(123, 17, 19, 0.5);
}

#ost-panel {
position: fixed;
bottom: 90px;
right: 20px;
width: 380px;
height: 500px;
max-height: calc(100vh - 120px);
border: none;
border-radius: 16px;
box-shadow: 0 10px 35px rgba(0,0,0,0.25);
display: none;
flex-direction: column;
overflow: hidden;
z-index: 9999;
background: #fff;
opacity: 0;
transform: translateY(16px);
pointer-events: none;
transition: opacity 0.25s ease, transform 0.25s ease;
}

#ost-panel.ost-open {
display: flex;
opacity: 1;
transform: translateY(0);
pointer-events: auto;
}

/* Red header bar */
#ost-panel-header {
background: linear-gradient(135deg, #7B1113 0%, #a3181b 100%);
color: #fff;
padding: 14px 16px;
font-size: 15px;
font-weight: 600;
display: flex;
align-items: center;
justify-content: center;
position: relative;
flex-shrink: 0;
}

#ost-panel-header img {
max-height: 40px;
width: auto;
}

#ost-panel-close {
cursor: pointer;
font-size: 22px;
line-height: 1;
opacity: 0.85;
transition: opacity 0.15s ease;
position: absolute;
right: 16px;
}

#ost-panel-close:hover {
opacity: 1;
}
/* Scrollable content area */
#ost-panel-body {
flex: 1;
overflow-y: auto;
-webkit-overflow-scrolling: touch;
min-height: 0; /* important so flexbox lets this shrink/scroll */
}

#ost-panel iframe {
width: 100%;
height: 100%;
border: none;
display: block;
}

/* Red footer bar */
#ost-panel-footer {
background: linear-gradient(135deg, #7B1113 0%, #a3181b 100%);
color: #fff;
text-align: center;
font-size: 12px;
padding: 8px 12px;
flex-shrink: 0;
}

/* Phones and small tablets */
@media (max-width: 480px) {
#ost-bubble {
width: 54px;
height: 54px;
bottom: 16px;
right: 16px;
}

#ost-panel {
top: 0;
left: 0;
right: 0;
bottom: 0;
width: 100%;
height: 100%;
max-height: 100%;
border-radius: 0;
}
}

MediaWiki:Common.css

2026-06-18T01:42:33Z

PaulineA:

/* CSS placed here will be applied to all skins */
/*
* GLOBAL
*/
body{
font-family: 'Helvetica Neue','Nimbus Sans','Helvetica','Arial',sans-serif;
font-size: 0.95em;
line-height: 1.4;

}

/*.mw-userlogin-rememberme {display:none;}*/

#p-logo-text a {
font-variant: unset !important;
font-size: 1.50em !important;
}
#p-logo-text a::first-letter {
text-transform: uppercase;
}
#userloginForm .mw-htmlform-field-HTMLInfoField {
display:none;
}
tr.statistics-group-bot,
tr.statistics-group-sysop,
tr.statistics-group-bureaucrat,
tr.statistics-group-widgeteditor {
display:none;
}
a.new:hover, .new a:hover, a.new:visited, .new a:visited {color: #850038;}
a.new, .new a {color: #0E6021;}
.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button {background-color:#1b3256;}
a {color:#36b;}
a:hover, a:visited {color:#0088dd;}
fieldset legend {color:#1b3256;}
.addthis_button_facebook, .addthis_button_google_plusone, .addthis_button_email{
display:none;
}
#mw-content h1.firstHeading { display: none; }
#pt-createaccount {display:none;}

/*
* HEADER
*/
.color-left {background-color:#0E6021;}
.color-right {background-color:#0E6021;}
.color-middle {background-color:#0E6021;}
#mw-header-container {background-color:#850038;color:#ffffff;}
/*
* BLOCKS
*/
#p-logo-text a {font-family:'arial', 'serif';font-weight:600;color:#ffffff;}
/*
* PAGES
*/
body {background-color:#212328;}
#mw-content-container {
background:url(/resources/assets/iskomunidad-22-bg.png) no-repeat center center fixed !important;
background-size:cover !important;}
#mw-content h1.firstHeading {border-bottom: solid 4px #1b3256;}
#mw-page-header-links li.selected {border-bottom-color: #1b3256;}
#mw-site-navigation .sidebar-chunk h3 {border-bottom: solid 2px #1b3256;}
#mw-related-navigation .sidebar-chunk h3 {border-bottom: solid 2px #1b3256;}
#mw-content-container {border-bottom:none; background-image:none;}
#mw-content h1, #mw-content h2 {border-bottom: solid 2px #1b3256 !important;}
/*
* Login
*/
#mw-createaccount-cta {display:none;}
/*
* MainPage
*/

/*Features */
.iskomunidad-features {
display: flex;
flex-direction:row;
}

/*.isk-features-image {display:flex;justify-content:center;}*/
.isk-features-image img{width:100%;max-width:200px;}

.isk-features{
margin:.5em;
background:#fcfcfc;
display:flex;
border: solid #eeeeee;
border-width: 8px 0px 0.2em 0px;
border-radius:5px 5px 0 0;
}
/*
.isk-features-title{font-weight: 600;font-size:1em;}
.isk-features-body {
padding: .5em;
text-align:left;
}*/

.isk-image {
margin:10px;
}

.isko-featured {
box-shadow: rgba(17, 17, 26, 0.1) 0px 1px 0px;
margin:10px;
}

.isko-featured-content {
font-weight:bold;
}

.isko-featured-content #text{
color: #000000;
font-weight:400;
}

/* ILC Announcement */
.ilc-announcement {
display: flex;
flex-direction:row;
}

.isk-article-image {display:flex;justify-content:center;}
.isk-article-image img{width:100%;max-width:330px;}
.isk-article{
margin:.5em;
background:#fcfcfc;
vertical-align:top;
border: solid #eeeeee;
border-width: 8px 0px 0.2em 0px;
border-radius:5px 5px 0 0;
}
.isk-article-title{font-weight: 600;font-size:1em;}
.isk-article-body {
padding: .5em;
text-align:left;
}

@media only screen and (max-width: 600px){
.customized-footer-col {margin-left:-8em !important;}
.isk-lastmod {padding-left: 1.9em !important;margin-left:0;}
}

/* Featured Wiki Pages */
.featuredwiki tr { display:flex; flex-direction: row; }
.communitycontrib tr { display:flex; flex-direction: row; }
.faqandhowto tr { display:flex; flex-direction: row; }
@media (max-width: 800px) {
.featuredwiki tr, .communitycontrib tr, .faqandhowto tr, .ilc-announcement, .iskomunidad-features {
flex-direction: column;
}
}

.main-updates {display:inline-block;}
.main-updates ul {list-style-type: none;}

.mw-body .toctitle{ border-bottom: none; }
hr { border: none; }
#About, #ILC_Diliman_Announcements, #Featured_Wiki, #Community_Contribution, #FAQ_and_How_To, #Features, #Get_Started {
font-size:1.5em;
font-family: "Lato", sans-serif;
font-weight: 800;
color: #012f56;
}

/* background */
#mw-content-container {
background: url('') no-repeat center center fixed !important;
background-size:unset !important;
background-color: #F8F9FA !important;
}

#mw-content,
#mw-related-navigation .sidebar-chunk,
#mw-site-navigation .sidebar-chunk{
box-shadow: rgba(60,64,67,0.3) 0px 1px 2px 0px,rgba(60,64,67,0.15) 0px 2px 6px 2px;
border: solid #fff !important;
}

#mw-related-navigation .sidebar-chunk,
#mw-site-navigation .sidebar-chunk{
background:#ffffff ;
}

.mw-body .mw-parser-output h1:after,
.mw-body .mw-parser-output h2:after {
border-bottom:none;
}

/*
* FOOTER
*/
.isk-lastmod {padding-left: 10em;margin-left:-.5em;}

#f-poweredbyico {display:none;}
#mw-footer-container{border-top:none;background-color:#3a4147;background:url(/resources/assets/iskomunidad-22-footer-revised.jpg) no-repeat center center;background-size: cover;}

.customized-footer-col {display:inline-block;margin-right:3rem !important;vertical-align: top;padding-left:10em !important;}
.customized-footer-col li {margin-left: .5rem !important; line-height: 1.2;}
.customized-footer-col li:nth-child(1) {margin-left: -.5rem !important;font-size: 1.3rem;font-weight: 600;border-bottom:2px solid #FFB81C;}
.customized-footer ul:nth-child(1) .customized-footer-row-5 {margin-left: -.5rem !important;font-size: 1.3rem;font-weight: 600;border-bottom:2px solid #FFB81C;}
.customized-footer ul:nth-child(3) .customized-footer-row-3 {margin-left: -.5rem !important;font-size: 1.3rem;font-weight: 600;border-bottom:2px solid #FFB81C;}
.customized-footer ul:nth-child(4) .customized-footer-row-2 {margin-left: -.5rem !important;font-size: 1.3rem;font-weight: 600;border-bottom:2px solid #FFB81C;}

.customized-footer-two {text-align:center;line-height:.8;}

#mw-footer-container, #mw-footer-container a {
color: #ffffff;
}

/* ConfirmEdit QuestyCaptcha -- on Create Account */
.htmlform-tip + .mw-htmlform-field-HTMLInfoField { color:red; }
/* ConfirmEdit QuestyCaptcha -- on Edit page + add a URL */
label[for=wpCaptchaWord] {
color:green;
font-weight:bold;
font-size:150%;
font-style:italic;
}

/*For NOTES*/

.note {
padding: 5px;
margin: 10px;
border:1px solid;
}

.note-warning {
/**/
background-color: #e7f3fe;
border-color: #ffc107;
}

.note-error {
background-color: #f8d7da;
border-color: #dc3545;
}

.note-info {
/*ackground-color: #e7f3fe; */
background-color: #fff9e3;
border-color: #f5c41c;
}

.note-reminder {
background-color: #dff0d8;
border-color: #28a745;
}

/*images for tutorials*/

/* Add this to MediaWiki:Common.css or your site's CSS */
.noresize {
overflow-x: auto; /* Adds horizontal scrollbar when content overflows */
width: 100%; /* Full width of container */
}

.noresize table {
width: 100%; /* Table fills the container */
min-width: 500px; /* Minimum width before scrolling starts */
}

/* for Helpdesk bubble */
#ost-bubble {
position: fixed;
bottom: 20px;
right: 20px;
width: 60px;
height: 60px;
border-radius: 50%;
background-image: url('/images/helpdesk-icon.png');
/*background: linear-gradient(135deg, #7B1113 0%, #a3181b 100%); */
color: white;
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
z-index: 9999;
box-shadow: 0 4px 14px rgba(123, 17, 19, 0.4);
transition: transform 0.2s ease, box-shadow 0.2s ease;
}

#ost-bubble:hover {
transform: scale(1.08);
box-shadow: 0 6px 20px rgba(123, 17, 19, 0.5);
}

#ost-panel {
position: fixed;
bottom: 90px;
right: 20px;
width: 380px;
height: 500px;
max-height: calc(100vh - 120px);
border: none;
border-radius: 16px;
box-shadow: 0 10px 35px rgba(0,0,0,0.25);
display: none;
flex-direction: column;
overflow: hidden;
z-index: 9999;
background: #fff;
opacity: 0;
transform: translateY(16px);
pointer-events: none;
transition: opacity 0.25s ease, transform 0.25s ease;
}

#ost-panel.ost-open {
display: flex;
opacity: 1;
transform: translateY(0);
pointer-events: auto;
}

/* Red header bar */
#ost-panel-header {
background: linear-gradient(135deg, #7B1113 0%, #a3181b 100%);
color: #fff;
padding: 14px 16px;
font-size: 15px;
font-weight: 600;
display: flex;
align-items: center;
justify-content: center;
position: relative;
flex-shrink: 0;
}

#ost-panel-header img {
max-height: 40px;
width: auto;
}

#ost-panel-close {
cursor: pointer;
font-size: 22px;
line-height: 1;
opacity: 0.85;
transition: opacity 0.15s ease;
position: absolute;
right: 16px;
}

#ost-panel-close:hover {
opacity: 1;
}
/* Scrollable content area */
#ost-panel-body {
flex: 1;
overflow-y: auto;
-webkit-overflow-scrolling: touch;
min-height: 0; /* important so flexbox lets this shrink/scroll */
}

#ost-panel iframe {
width: 100%;
height: 100%;
border: none;
display: block;
}

/* Red footer bar */
#ost-panel-footer {
background: linear-gradient(135deg, #7B1113 0%, #a3181b 100%);
color: #fff;
text-align: center;
font-size: 12px;
padding: 8px 12px;
flex-shrink: 0;
}

/* Phones and small tablets */
@media (max-width: 480px) {
#ost-bubble {
width: 54px;
height: 54px;
bottom: 16px;
right: 16px;
}

#ost-panel {
top: 0;
left: 0;
right: 0;
bottom: 0;
width: 100%;
height: 100%;
max-height: 100%;
border-radius: 0;
}
}

MediaWiki:Common.css

2026-06-18T01:26:26Z

PaulineA:

/* CSS placed here will be applied to all skins */
/*
* GLOBAL
*/
body{
font-family: 'Helvetica Neue','Nimbus Sans','Helvetica','Arial',sans-serif;
font-size: 0.95em;
line-height: 1.4;

}

/*.mw-userlogin-rememberme {display:none;}*/

#p-logo-text a {
font-variant: unset !important;
font-size: 1.50em !important;
}
#p-logo-text a::first-letter {
text-transform: uppercase;
}
#userloginForm .mw-htmlform-field-HTMLInfoField {
display:none;
}
tr.statistics-group-bot,
tr.statistics-group-sysop,
tr.statistics-group-bureaucrat,
tr.statistics-group-widgeteditor {
display:none;
}
a.new:hover, .new a:hover, a.new:visited, .new a:visited {color: #850038;}
a.new, .new a {color: #0E6021;}
.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button {background-color:#1b3256;}
a {color:#36b;}
a:hover, a:visited {color:#0088dd;}
fieldset legend {color:#1b3256;}
.addthis_button_facebook, .addthis_button_google_plusone, .addthis_button_email{
display:none;
}
#mw-content h1.firstHeading { display: none; }
#pt-createaccount {display:none;}

/*
* HEADER
*/
.color-left {background-color:#0E6021;}
.color-right {background-color:#0E6021;}
.color-middle {background-color:#0E6021;}
#mw-header-container {background-color:#850038;color:#ffffff;}
/*
* BLOCKS
*/
#p-logo-text a {font-family:'arial', 'serif';font-weight:600;color:#ffffff;}
/*
* PAGES
*/
body {background-color:#212328;}
#mw-content-container {
background:url(/resources/assets/iskomunidad-22-bg.png) no-repeat center center fixed !important;
background-size:cover !important;}
#mw-content h1.firstHeading {border-bottom: solid 4px #1b3256;}
#mw-page-header-links li.selected {border-bottom-color: #1b3256;}
#mw-site-navigation .sidebar-chunk h3 {border-bottom: solid 2px #1b3256;}
#mw-related-navigation .sidebar-chunk h3 {border-bottom: solid 2px #1b3256;}
#mw-content-container {border-bottom:none; background-image:none;}
#mw-content h1, #mw-content h2 {border-bottom: solid 2px #1b3256 !important;}
/*
* Login
*/
#mw-createaccount-cta {display:none;}
/*
* MainPage
*/

/*Features */
.iskomunidad-features {
display: flex;
flex-direction:row;
}

/*.isk-features-image {display:flex;justify-content:center;}*/
.isk-features-image img{width:100%;max-width:200px;}

.isk-features{
margin:.5em;
background:#fcfcfc;
display:flex;
border: solid #eeeeee;
border-width: 8px 0px 0.2em 0px;
border-radius:5px 5px 0 0;
}
/*
.isk-features-title{font-weight: 600;font-size:1em;}
.isk-features-body {
padding: .5em;
text-align:left;
}*/

.isk-image {
margin:10px;
}

.isko-featured {
box-shadow: rgba(17, 17, 26, 0.1) 0px 1px 0px;
margin:10px;
}

.isko-featured-content {
font-weight:bold;
}

.isko-featured-content #text{
color: #000000;
font-weight:400;
}

/* ILC Announcement */
.ilc-announcement {
display: flex;
flex-direction:row;
}

.isk-article-image {display:flex;justify-content:center;}
.isk-article-image img{width:100%;max-width:330px;}
.isk-article{
margin:.5em;
background:#fcfcfc;
vertical-align:top;
border: solid #eeeeee;
border-width: 8px 0px 0.2em 0px;
border-radius:5px 5px 0 0;
}
.isk-article-title{font-weight: 600;font-size:1em;}
.isk-article-body {
padding: .5em;
text-align:left;
}

@media only screen and (max-width: 600px){
.customized-footer-col {margin-left:-8em !important;}
.isk-lastmod {padding-left: 1.9em !important;margin-left:0;}
}

/* Featured Wiki Pages */
.featuredwiki tr { display:flex; flex-direction: row; }
.communitycontrib tr { display:flex; flex-direction: row; }
.faqandhowto tr { display:flex; flex-direction: row; }
@media (max-width: 800px) {
.featuredwiki tr, .communitycontrib tr, .faqandhowto tr, .ilc-announcement, .iskomunidad-features {
flex-direction: column;
}
}

.main-updates {display:inline-block;}
.main-updates ul {list-style-type: none;}

.mw-body .toctitle{ border-bottom: none; }
hr { border: none; }
#About, #ILC_Diliman_Announcements, #Featured_Wiki, #Community_Contribution, #FAQ_and_How_To, #Features, #Get_Started {
font-size:1.5em;
font-family: "Lato", sans-serif;
font-weight: 800;
color: #012f56;
}

/* background */
#mw-content-container {
background: url('') no-repeat center center fixed !important;
background-size:unset !important;
background-color: #F8F9FA !important;
}

#mw-content,
#mw-related-navigation .sidebar-chunk,
#mw-site-navigation .sidebar-chunk{
box-shadow: rgba(60,64,67,0.3) 0px 1px 2px 0px,rgba(60,64,67,0.15) 0px 2px 6px 2px;
border: solid #fff !important;
}

#mw-related-navigation .sidebar-chunk,
#mw-site-navigation .sidebar-chunk{
background:#ffffff ;
}

.mw-body .mw-parser-output h1:after,
.mw-body .mw-parser-output h2:after {
border-bottom:none;
}

/*
* FOOTER
*/
.isk-lastmod {padding-left: 10em;margin-left:-.5em;}

#f-poweredbyico {display:none;}
#mw-footer-container{border-top:none;background-color:#3a4147;background:url(/resources/assets/iskomunidad-22-footer-revised.jpg) no-repeat center center;background-size: cover;}

.customized-footer-col {display:inline-block;margin-right:3rem !important;vertical-align: top;padding-left:10em !important;}
.customized-footer-col li {margin-left: .5rem !important; line-height: 1.2;}
.customized-footer-col li:nth-child(1) {margin-left: -.5rem !important;font-size: 1.3rem;font-weight: 600;border-bottom:2px solid #FFB81C;}
.customized-footer ul:nth-child(1) .customized-footer-row-5 {margin-left: -.5rem !important;font-size: 1.3rem;font-weight: 600;border-bottom:2px solid #FFB81C;}
.customized-footer ul:nth-child(3) .customized-footer-row-3 {margin-left: -.5rem !important;font-size: 1.3rem;font-weight: 600;border-bottom:2px solid #FFB81C;}
.customized-footer ul:nth-child(4) .customized-footer-row-2 {margin-left: -.5rem !important;font-size: 1.3rem;font-weight: 600;border-bottom:2px solid #FFB81C;}

.customized-footer-two {text-align:center;line-height:.8;}

#mw-footer-container, #mw-footer-container a {
color: #ffffff;
}

/* ConfirmEdit QuestyCaptcha -- on Create Account */
.htmlform-tip + .mw-htmlform-field-HTMLInfoField { color:red; }
/* ConfirmEdit QuestyCaptcha -- on Edit page + add a URL */
label[for=wpCaptchaWord] {
color:green;
font-weight:bold;
font-size:150%;
font-style:italic;
}

/*For NOTES*/

.note {
padding: 5px;
margin: 10px;
border:1px solid;
}

.note-warning {
/**/
background-color: #e7f3fe;
border-color: #ffc107;
}

.note-error {
background-color: #f8d7da;
border-color: #dc3545;
}

.note-info {
/*ackground-color: #e7f3fe; */
background-color: #fff9e3;
border-color: #f5c41c;
}

.note-reminder {
background-color: #dff0d8;
border-color: #28a745;
}

/*images for tutorials*/

/* Add this to MediaWiki:Common.css or your site's CSS */
.noresize {
overflow-x: auto; /* Adds horizontal scrollbar when content overflows */
width: 100%; /* Full width of container */
}

.noresize table {
width: 100%; /* Table fills the container */
min-width: 500px; /* Minimum width before scrolling starts */
}

/* for Helpdesk bubble */
#ost-bubble {
position: fixed;
bottom: 20px;
right: 20px;
width: 60px;
height: 60px;
border-radius: 50%;
background: linear-gradient(135deg, #7B1113 0%, #a3181b 100%);
color: white;
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
z-index: 9999;
box-shadow: 0 4px 14px rgba(123, 17, 19, 0.4);
transition: transform 0.2s ease, box-shadow 0.2s ease;
}

#ost-bubble:hover {
transform: scale(1.08);
box-shadow: 0 6px 20px rgba(123, 17, 19, 0.5);
}

#ost-panel {
position: fixed;
bottom: 90px;
right: 20px;
width: 380px;
height: 500px;
max-height: calc(100vh - 120px);
border: none;
border-radius: 16px;
box-shadow: 0 10px 35px rgba(0,0,0,0.25);
display: none;
flex-direction: column;
overflow: hidden;
z-index: 9999;
background: #fff;
opacity: 0;
transform: translateY(16px);
pointer-events: none;
transition: opacity 0.25s ease, transform 0.25s ease;
}

#ost-panel.ost-open {
display: flex;
opacity: 1;
transform: translateY(0);
pointer-events: auto;
}

/* Red header bar */
#ost-panel-header {
background: linear-gradient(135deg, #7B1113 0%, #a3181b 100%);
color: #fff;
padding: 14px 16px;
font-size: 15px;
font-weight: 600;
display: flex;
align-items: center;
justify-content: center;
position: relative;
flex-shrink: 0;
}

#ost-panel-header img {
max-height: 40px;
width: auto;
}

#ost-panel-close {
cursor: pointer;
font-size: 22px;
line-height: 1;
opacity: 0.85;
transition: opacity 0.15s ease;
position: absolute;
right: 16px;
}

#ost-panel-close:hover {
opacity: 1;
}
/* Scrollable content area */
#ost-panel-body {
flex: 1;
overflow-y: auto;
-webkit-overflow-scrolling: touch;
min-height: 0; /* important so flexbox lets this shrink/scroll */
}

#ost-panel iframe {
width: 100%;
height: 100%;
border: none;
display: block;
}

/* Red footer bar */
#ost-panel-footer {
background: linear-gradient(135deg, #7B1113 0%, #a3181b 100%);
color: #fff;
text-align: center;
font-size: 12px;
padding: 8px 12px;
flex-shrink: 0;
}

/* Phones and small tablets */
@media (max-width: 480px) {
#ost-bubble {
width: 54px;
height: 54px;
bottom: 16px;
right: 16px;
}

#ost-panel {
top: 0;
left: 0;
right: 0;
bottom: 0;
width: 100%;
height: 100%;
max-height: 100%;
border-radius: 0;
}
}

MediaWiki:Common.js

2026-06-17T03:39:11Z

PaulineA:

MediaWiki:Common.css

2026-06-17T03:38:22Z

2026-06-14T23:27:19Z

PaulineA:

/* CSS placed here will be applied to all skins */
/*
* GLOBAL
*/
body{
font-family: 'Helvetica Neue','Nimbus Sans','Helvetica','Arial',sans-serif;
font-size: 0.95em;
line-height: 1.4;

}

/*.mw-userlogin-rememberme {display:none;}*/

#p-logo-text a {
font-variant: unset !important;
font-size: 1.50em !important;
}
#p-logo-text a::first-letter {
text-transform: uppercase;
}
#userloginForm .mw-htmlform-field-HTMLInfoField {
display:none;
}
tr.statistics-group-bot,
tr.statistics-group-sysop,
tr.statistics-group-bureaucrat,
tr.statistics-group-widgeteditor {
display:none;
}
a.new:hover, .new a:hover, a.new:visited, .new a:visited {color: #850038;}
a.new, .new a {color: #0E6021;}
.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button {background-color:#1b3256;}
a {color:#36b;}
a:hover, a:visited {color:#0088dd;}
fieldset legend {color:#1b3256;}
.addthis_button_facebook, .addthis_button_google_plusone, .addthis_button_email{
display:none;
}
#mw-content h1.firstHeading { display: none; }
#pt-createaccount {display:none;}

/*
* HEADER
*/
.color-left {background-color:#0E6021;}
.color-right {background-color:#0E6021;}
.color-middle {background-color:#0E6021;}
#mw-header-container {background-color:#850038;color:#ffffff;}
/*
* BLOCKS
*/
#p-logo-text a {font-family:'arial', 'serif';font-weight:600;color:#ffffff;}
/*
* PAGES
*/
body {background-color:#212328;}
#mw-content-container {
background:url(/resources/assets/iskomunidad-22-bg.png) no-repeat center center fixed !important;
background-size:cover !important;}
#mw-content h1.firstHeading {border-bottom: solid 4px #1b3256;}
#mw-page-header-links li.selected {border-bottom-color: #1b3256;}
#mw-site-navigation .sidebar-chunk h3 {border-bottom: solid 2px #1b3256;}
#mw-related-navigation .sidebar-chunk h3 {border-bottom: solid 2px #1b3256;}
#mw-content-container {border-bottom:none; background-image:none;}
#mw-content h1, #mw-content h2 {border-bottom: solid 2px #1b3256 !important;}
/*
* Login
*/
#mw-createaccount-cta {display:none;}
/*
* MainPage
*/

/*Features */
.iskomunidad-features {
display: flex;
flex-direction:row;
}

/*.isk-features-image {display:flex;justify-content:center;}*/
.isk-features-image img{width:100%;max-width:200px;}

.isk-features{
margin:.5em;
background:#fcfcfc;
display:flex;
border: solid #eeeeee;
border-width: 8px 0px 0.2em 0px;
border-radius:5px 5px 0 0;
}
/*
.isk-features-title{font-weight: 600;font-size:1em;}
.isk-features-body {
padding: .5em;
text-align:left;
}*/

.isk-image {
margin:10px;
}

.isko-featured {
box-shadow: rgba(17, 17, 26, 0.1) 0px 1px 0px;
margin:10px;
}

.isko-featured-content {
font-weight:bold;
}

.isko-featured-content #text{
color: #000000;
font-weight:400;
}

/* ILC Announcement */
.ilc-announcement {
display: flex;
flex-direction:row;
}

.isk-article-image {display:flex;justify-content:center;}
.isk-article-image img{width:100%;max-width:330px;}
.isk-article{
margin:.5em;
background:#fcfcfc;
vertical-align:top;
border: solid #eeeeee;
border-width: 8px 0px 0.2em 0px;
border-radius:5px 5px 0 0;
}
.isk-article-title{font-weight: 600;font-size:1em;}
.isk-article-body {
padding: .5em;
text-align:left;
}

@media only screen and (max-width: 600px){
.customized-footer-col {margin-left:-8em !important;}
.isk-lastmod {padding-left: 1.9em !important;margin-left:0;}
}

/* Featured Wiki Pages */
.featuredwiki tr { display:flex; flex-direction: row; }
.communitycontrib tr { display:flex; flex-direction: row; }
.faqandhowto tr { display:flex; flex-direction: row; }
@media (max-width: 800px) {
.featuredwiki tr, .communitycontrib tr, .faqandhowto tr, .ilc-announcement, .iskomunidad-features {
flex-direction: column;
}
}

.main-updates {display:inline-block;}
.main-updates ul {list-style-type: none;}

.mw-body .toctitle{ border-bottom: none; }
hr { border: none; }
#About, #ILC_Diliman_Announcements, #Featured_Wiki, #Community_Contribution, #FAQ_and_How_To, #Features, #Get_Started {
font-size:1.5em;
font-family: "Lato", sans-serif;
font-weight: 800;
color: #012f56;
}

/* background */
#mw-content-container {
background: url('') no-repeat center center fixed !important;
background-size:unset !important;
background-color: #F8F9FA !important;
}

#mw-content,
#mw-related-navigation .sidebar-chunk,
#mw-site-navigation .sidebar-chunk{
box-shadow: rgba(60,64,67,0.3) 0px 1px 2px 0px,rgba(60,64,67,0.15) 0px 2px 6px 2px;
border: solid #fff !important;
}

#mw-related-navigation .sidebar-chunk,
#mw-site-navigation .sidebar-chunk{
background:#ffffff ;
}

.mw-body .mw-parser-output h1:after,
.mw-body .mw-parser-output h2:after {
border-bottom:none;
}

/*
* FOOTER
*/
.isk-lastmod {padding-left: 10em;margin-left:-.5em;}

#f-poweredbyico {display:none;}
#mw-footer-container{border-top:none;background-color:#3a4147;background:url(/resources/assets/iskomunidad-22-footer-revised.jpg) no-repeat center center;background-size: cover;}

.customized-footer-col {display:inline-block;margin-right:3rem !important;vertical-align: top;padding-left:10em !important;}
.customized-footer-col li {margin-left: .5rem !important; line-height: 1.2;}
.customized-footer-col li:nth-child(1) {margin-left: -.5rem !important;font-size: 1.3rem;font-weight: 600;border-bottom:2px solid #FFB81C;}
.customized-footer ul:nth-child(1) .customized-footer-row-5 {margin-left: -.5rem !important;font-size: 1.3rem;font-weight: 600;border-bottom:2px solid #FFB81C;}
.customized-footer ul:nth-child(3) .customized-footer-row-3 {margin-left: -.5rem !important;font-size: 1.3rem;font-weight: 600;border-bottom:2px solid #FFB81C;}
.customized-footer ul:nth-child(4) .customized-footer-row-2 {margin-left: -.5rem !important;font-size: 1.3rem;font-weight: 600;border-bottom:2px solid #FFB81C;}

.customized-footer-two {text-align:center;line-height:.8;}

#mw-footer-container, #mw-footer-container a {
color: #ffffff;
}

/* ConfirmEdit QuestyCaptcha -- on Create Account */
.htmlform-tip + .mw-htmlform-field-HTMLInfoField { color:red; }
/* ConfirmEdit QuestyCaptcha -- on Edit page + add a URL */
label[for=wpCaptchaWord] {
color:green;
font-weight:bold;
font-size:150%;
font-style:italic;
}

/*For NOTES*/

.note {
padding: 5px;
margin: 10px;
border:1px solid;
}

.note-warning {
/**/
background-color: #e7f3fe;
border-color: #ffc107;
}

.note-error {
background-color: #f8d7da;
border-color: #dc3545;
}

.note-info {
/*ackground-color: #e7f3fe; */
background-color: #fff9e3;
border-color: #f5c41c;
}

.note-reminder {
background-color: #dff0d8;
border-color: #28a745;
}

/*images for tutorials*/

/* Add this to MediaWiki:Common.css or your site's CSS */
.noresize {
overflow-x: auto; /* Adds horizontal scrollbar when content overflows */
width: 100%; /* Full width of container */
}

.noresize table {
width: 100%; /* Table fills the container */
min-width: 500px; /* Minimum width before scrolling starts */
}

/* for Helpdesk bubble*/
/*
#ost-bubble {
position: fixed;
bottom: 20px;
right: 20px;
width: 60px;
height: 60px;
border-radius: 50%;
background-color: #7B1113;
color: white;
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
z-index: 9999;
box-shadow: 0 2px 8px rgba(0,0,0,0.3);
}

#ost-panel {
position: fixed;
bottom: 90px;
right: 20px;
width: 380px;
height: 500px;
border: 1px solid #ccc;
border-radius: 8px;
box-shadow: 0 2px 12px rgba(0,0,0,0.3);
display: none;
z-index: 9999;
background: white;
}

#ost-panel iframe {
width: 100%;
height: 100%;
border: none;
}

/* Phones and small tablets */
@media (max-width: 480px) {
#ost-bubble {
width: 54px;
height: 54px;
bottom: 16px;
right: 16px;
}

#ost-panel {
top: 0;
left: 0;
right: 0;
bottom: 0;
width: 100%;
height: 100%;
max-height: 100%;
border-radius: 0;
}
}
*/
/* for Helpdesk bubble */
#ost-bubble {
position: fixed;
bottom: 20px;
right: 20px;
width: 60px;
height: 60px;
border-radius: 50%;
background: linear-gradient(135deg, #7B1113 0%, #a3181b 100%);
color: white;
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
z-index: 9999;
box-shadow: 0 4px 14px rgba(123, 17, 19, 0.4);
transition: transform 0.2s ease, box-shadow 0.2s ease;
}

#ost-bubble:hover {
transform: scale(1.08);
box-shadow: 0 6px 20px rgba(123, 17, 19, 0.5);
}

#ost-panel {
position: fixed;
bottom: 90px;
right: 20px;
width: 380px;
height: 540px;
max-height: calc(100vh - 120px);
border: none;
border-radius: 16px;
box-shadow: 0 10px 35px rgba(0,0,0,0.25);
display: none;
flex-direction: column;
overflow: hidden;
z-index: 9999;
background: #fff;
opacity: 0;
transform: translateY(16px);
pointer-events: none;
transition: opacity 0.25s ease, transform 0.25s ease;
}

#ost-panel.ost-open {
display: flex;
opacity: 1;
transform: translateY(0);
pointer-events: auto;
}

/* Red header bar */
#ost-panel-header {
background: linear-gradient(135deg, #7B1113 0%, #a3181b 100%);
color: #fff;
padding: 14px 16px;
font-size: 15px;
font-weight: 600;
display: flex;
align-items: center;
justify-content: space-between;
flex-shrink: 0;
}

#ost-panel-close {
cursor: pointer;
font-size: 22px;
line-height: 1;
opacity: 0.85;
transition: opacity 0.15s ease;
}

#ost-panel-close:hover {
opacity: 1;
}

/* Scrollable content area */
#ost-panel-body {
flex: 1;
overflow-y: auto;
-webkit-overflow-scrolling: touch;
min-height: 0; /* important so flexbox lets this shrink/scroll */
}

#ost-panel iframe {
width: 100%;
height: 100%;
border: none;
display: block;
}

/* Red footer bar */
#ost-panel-footer {
background: linear-gradient(135deg, #7B1113 0%, #a3181b 100%);
color: #fff;
text-align: center;
font-size: 12px;
padding: 8px 12px;
flex-shrink: 0;
}

/* Phones and small tablets */
@media (max-width: 480px) {
#ost-bubble {
width: 54px;
height: 54px;
bottom: 16px;
right: 16px;
}

#ost-panel {
top: 0;
left: 0;
right: 0;
bottom: 0;
width: 100%;
height: 100%;
max-height: 100%;
border-radius: 0;
}
}