Khác biệt giữa bản sửa đổi của “MediaWiki:Timeless.css”

Từ Wiki Du học Nga
Không có tóm lược sửa đổi
Thẻ: Đã bị lùi lại
Không có tóm lược sửa đổi
Thẻ: Lùi lại thủ công
Dòng 30: Dòng 30:
     left: 10px;
     left: 10px;
     width: 220px;
     width: 220px;
     height: calc(100vh - 100px); /* Mới: để TOC không vượt quá chiều cao trình duyệt */
     max-height: 80vh;
     overflow-y: auto;           /* Mới: bật thanh cuộn khi TOC quá dài */
     overflow-y: auto;
     z-index: 1000;
     z-index: 1000;
}
}
Dòng 45: Dòng 45:
         left: auto !important;
         left: auto !important;
         top: auto !important;
         top: auto !important;
        height: auto !important;        /* Mới: khôi phục chiều cao tự nhiên */
     }
     }


     #toc.sticky-toc {
     #toc.sticky-toc {
         position: relative !important;
         position: relative !important;
        overflow: visible !important;    /* Mới: khôi phục scroll tự nhiên */
        height: auto !important;        /* Mới */
     }
     }



Phiên bản lúc 17:06, ngày 21 tháng 4 năm 2025

/* Tất cả mã CSS tại đây sẽ được tải khi người dùng sử dụng giao diện Vượt thời gian */
/* Tăng kích thước logo cho skin Timeless */
#p-logo a {
    display: block;
    max-width: none;
    height: auto;
}

#p-logo img {
    max-height: 200px; /* Hoặc 80px, tuỳ bạn */
    width: auto;
}

/* Floating TOC on the left for Timeless skin */
/* Tùy chỉnh mục lục để nằm trong sidebar */
#toc {
    position: relative;
    margin-top: 1em;
    padding: 0.5em;
    background-color: #f8f9fa;
    border: 1px solid #a2a9b1;
    border-radius: 4px;
    font-size: 0.9em;
}

/* Khi được sticky, sẽ có lớp này thêm vào */
#toc.sticky-toc {
    position: fixed !important;
    top: 80px; /* Điều chỉnh theo chiều cao header */
    left: 10px;
    width: 220px;
    max-height: 80vh;
    overflow-y: auto;
    z-index: 1000;
}

/* Khi màn hình nhỏ: TOC về lại đầu nội dung */
@media (max-width: 1000px) {
    #toc {
        position: relative !important;
        width: auto !important;
        max-height: none !important;
        overflow: visible !important;
        margin: 1em auto !important;
        left: auto !important;
        top: auto !important;
    }

    #toc.sticky-toc {
        position: relative !important;
    }

    #mw-content {
        margin-left: 0 !important;
    }
}

/* Ẩn infobox trên điện thoại */
@media (max-width: 768px) {
    .infobox {
        display: none !important;
    }
}