打开/关闭菜单
打开/关闭外观设置菜单
打开/关闭个人菜单
未登录
未登录用户的IP地址会在进行任意编辑后公开展示。

MediaWiki:Common.css:修订间差异

MediaWiki界面页面
修复链接颜色
更新样式
第1行: 第1行:
/**
/**
  * MediaWiki:Common.css
  * MediaWiki:Common.css
  * 任务 4.2:深色海洋配色
  * DOL ShipMaker Wiki - 大航海时代风格深色主题
* 任务 4.3:首页卡片布局
* 任务 8:Infobox 模板样式
* 将此内容粘贴到 Wiki 站的 MediaWiki:Common.css 页面
  */
  */


/* ── 深色海洋配色变量 ─────────────────────────────────── */
/* ── 首页 Hero 横幅 ───────────────────────────────────────
:root {
* 图片占位:hero-banner.jpg
     --color-bg-primary:   #0a1628;
* 建议尺寸:1920×500px,海洋/船只场景,横向构图
     --color-bg-secondary: #1a3a5c;
* 上传后替换 url() 里的路径
     --color-accent:       #c9a84c;
*/
     --color-link:         #4a9eff;
.wiki-hero {
     --color-text:         #e8eaf0;
    position: relative;
     --color-border:       #2a4a6c;
    width: 100%;
    height: 420px;
    background:
        linear-gradient(to bottom, rgba(10,22,40,0.3) 0%, rgba(10,22,40,0.85) 100%),
        url('/images/hero-banner.jpg') center center / cover no-repeat;
    /* 无图时显示深海渐变占位 */
    background-color: #0a1628;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    margin: -1rem -1rem 2rem -1rem;
}
 
.wiki-hero-logo {
    width: 80px;
    height: 80px;
    margin-bottom: 1rem;
    /* 占位:logo.png,建议 200×200px,透明背景 PNG */
    background: rgba(201,168,76,0.2);
    border-radius: 50%;
    border: 2px solid #c9a84c;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2.5rem;
}
 
.wiki-hero-title {
     font-size: 2.2rem;
    font-weight: bold;
    color: #c9a84c;
    text-shadow: 0 2px 8px rgba(0,0,0,0.8);
    margin-bottom: 0.5rem;
    letter-spacing: 2px;
}
 
.wiki-hero-subtitle {
    font-size: 1rem;
    color: #b0c4d8;
    text-shadow: 0 1px 4px rgba(0,0,0,0.8);
    margin-bottom: 1.5rem;
}
 
.wiki-hero-search {
    display: flex;
    gap: 0.5rem;
}
 
.wiki-hero-search a {
    background: #c9a84c;
    color: #0a1628;
     padding: 0.6rem 1.8rem;
    border-radius: 24px;
    font-weight: bold;
    text-decoration: none;
    font-size: 1rem;
    transition: background 0.2s;
}
 
.wiki-hero-search a:hover {
    background: #e0c070;
    color: #0a1628;
}
 
/* ── 分类图片卡片导航 ─────────────────────────────────────
* 每张卡片图片:建议 320×120px,横向构图
* 图片命名和位置见下方各卡片注释
*/
.wiki-nav-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0.6rem;
    margin: 0 0 2rem 0;
}
 
@media (max-width: 768px) {
    .wiki-nav-grid { grid-template-columns: repeat(2, 1fr); }
    .wiki-hero { height: 300px; }
    .wiki-hero-title { font-size: 1.5rem; }
}
 
.wiki-nav-card {
    position: relative;
    height: 90px;
    border-radius: 6px;
    overflow: hidden;
    border: 1px solid #2a4a6c;
    transition: transform 0.2s, box-shadow 0.2s;
    cursor: pointer;
}
 
.wiki-nav-card:hover {
    transform: translateY(-2px);
     box-shadow: 0 4px 16px rgba(74,158,255,0.3);
    border-color: #c9a84c;
}
 
.wiki-nav-card a {
    display: flex;
    align-items: flex-end;
    width: 100%;
    height: 100%;
     text-decoration: none;
    padding: 0.5rem 0.7rem;
    background: linear-gradient(to top, rgba(10,22,40,0.9) 40%, rgba(10,22,40,0.2) 100%);
    color: #e8eaf0;
    font-weight: bold;
    font-size: 0.95rem;
}
 
.wiki-nav-card a.new,
.wiki-nav-card a.new:visited {
    color: #e8eaf0;
}
 
/* 各卡片背景图占位(无图时显示渐变色块)
* card-ships:     图片 nav-ships.jpg    320×120px  船只场景
* card-equipment: 图片 nav-equipment.jpg 320×120px  装备/配件特写
* card-guide:    图片 nav-guide.jpg    320×120px  航海地图/罗盘
* card-community: 图片 nav-community.jpg 320×120px  港口/人群场景
*/
.wiki-nav-card.card-ships    { background-color: #1a3a5c; background-image: url('/images/nav-ships.jpg'); background-size: cover; background-position: center; }
.wiki-nav-card.card-equipment { background-color: #1a2a4c; background-image: url('/images/nav-equipment.jpg'); background-size: cover; background-position: center; }
.wiki-nav-card.card-guide    { background-color: #0f2a3c; background-image: url('/images/nav-guide.jpg'); background-size: cover; background-position: center; }
.wiki-nav-card.card-community { background-color: #1a1a3c; background-image: url('/images/nav-community.jpg'); background-size: cover; background-position: center; }
 
/* ── 精选内容区 ───────────────────────────────────────────*/
.wiki-featured {
     margin-bottom: 2rem;
}
 
.wiki-featured-title {
    font-size: 1rem;
    color: #7a9ab8;
    text-transform: uppercase;
    letter-spacing: 2px;
    margin-bottom: 1rem;
    padding-bottom: 0.4rem;
    border-bottom: 1px solid #2a4a6c;
}
}


/* ── 首页卡片布局(任务 4.3)────────────────────────────── */
.wiki-featured-grid {
.wiki-home-grid {
     display: grid;
     display: grid;
     grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
     grid-template-columns: 2fr 1fr;
     gap: 1.2rem;
     gap: 0.8rem;
    margin: 1.5rem 0;
}
}


.wiki-home-card {
@media (max-width: 768px) {
    background: var(--color-bg-secondary, #1a3a5c);
    .wiki-featured-grid { grid-template-columns: 1fr; }
     border: 1px solid var(--color-border, #2a4a6c);
}
 
.wiki-featured-card {
     position: relative;
     border-radius: 8px;
     border-radius: 8px;
     padding: 1.2rem;
     overflow: hidden;
     text-align: center;
     border: 1px solid #2a4a6c;
     transition: transform 0.2s, box-shadow 0.2s;
     background: #111e30;
    min-height: 200px;
}
}


.wiki-home-card:hover {
/* 精选主卡片图片:featured-main.jpg,建议 640×240px */
     transform: translateY(-3px);
.wiki-featured-card.featured-main {
     box-shadow: 0 6px 20px rgba(74, 158, 255, 0.2);
     background-image: url('/images/featured-main.jpg');
     background-size: cover;
    background-position: center;
    min-height: 240px;
}
}


.wiki-home-card .card-icon {
.wiki-featured-card-body {
     font-size: 2.5rem;
     position: absolute;
     margin-bottom: 0.6rem;
     bottom: 0;
    left: 0;
    right: 0;
    padding: 1rem;
    background: linear-gradient(to top, rgba(10,22,40,0.95) 60%, transparent 100%);
}
}


.wiki-home-card .card-title {
.wiki-featured-card-tag {
     font-size: 1.1rem;
    display: inline-block;
    background: #c9a84c;
    color: #0a1628;
     font-size: 0.7rem;
     font-weight: bold;
     font-weight: bold;
     color: var(--color-accent, #c9a84c);
     padding: 2px 8px;
    border-radius: 3px;
     margin-bottom: 0.4rem;
     margin-bottom: 0.4rem;
    text-transform: uppercase;
}
}


/* 卡片内链接不显示红色(页面未创建时) */
.wiki-featured-card-title {
.wiki-home-card a,
    font-size: 1.2rem;
.wiki-home-card a:visited,
    font-weight: bold;
.wiki-home-card a.new,
    color: #e8eaf0;
.wiki-home-card a.new:visited {
    margin-bottom: 0.3rem;
}
 
.wiki-featured-card-desc {
    font-size: 0.85rem;
    color: #b0c4d8;
    line-height: 1.4;
}
 
.wiki-featured-card a,
.wiki-featured-card a.new {
     color: inherit;
     color: inherit;
     text-decoration: none;
     text-decoration: none;
}
}


.wiki-home-card:hover a {
/* ── 快速导航链接 ─────────────────────────────────────────*/
     color: var(--color-accent, #c9a84c);
.wiki-quicklinks {
    display: flex;
    flex-wrap: wrap;
     gap: 0.5rem;
    margin-bottom: 2rem;
}
}


.wiki-home-card .card-desc {
.wiki-quicklinks a,
.wiki-quicklinks a.new {
    background: #1a3a5c;
    border: 1px solid #2a4a6c;
    color: #b0c4d8;
    padding: 0.3rem 0.9rem;
    border-radius: 16px;
     font-size: 0.85rem;
     font-size: 0.85rem;
     opacity: 0.8;
     text-decoration: none;
    transition: background 0.2s, border-color 0.2s;
}
}


/* ── 船只信息卡(任务 8.1)──────────────────────────────── */
.wiki-quicklinks a:hover {
    background: #2a4a6c;
    border-color: #c9a84c;
    color: #c9a84c;
}
 
/* ── 船只信息卡(Template:ShipInfobox)────────────────────*/
.infobox-ship {
.infobox-ship {
     float: right;
     float: right;
第77行: 第255行:
     min-width: 260px;
     min-width: 260px;
     max-width: 320px;
     max-width: 320px;
     background: var(--color-bg-secondary, #1a3a5c);
     background: #1a3a5c;
     border: 1px solid var(--color-accent, #c9a84c);
     border: 1px solid #c9a84c;
     border-radius: 6px;
     border-radius: 6px;
     font-size: 0.9rem;
     font-size: 0.9rem;
第87行: 第265行:
     font-size: 1.1rem;
     font-size: 1.1rem;
     font-weight: bold;
     font-weight: bold;
     color: var(--color-accent, #c9a84c);
     color: #c9a84c;
     padding-bottom: 0.5rem;
     padding-bottom: 0.5rem;
     border-bottom: 1px solid var(--color-border, #2a4a6c);
     border-bottom: 1px solid #2a4a6c;
     margin-bottom: 0.6rem;
     margin-bottom: 0.6rem;
}
}


.infobox-ship table {
.infobox-ship table { width: 100%; border-collapse: collapse; }
    width: 100%;
.infobox-ship td { padding: 3px 6px; border-bottom: 1px solid rgba(42,74,108,0.5); }
    border-collapse: collapse;
.infobox-ship td:first-child { font-weight: bold; color: #c9a84c; white-space: nowrap; width: 45%; }
}
 
.infobox-ship td {
    padding: 3px 6px;
    border-bottom: 1px solid rgba(42, 74, 108, 0.5);
}


.infobox-ship td:first-child {
/* ── 物品图标网格(Template:ItemIconGrid)────────────────*/
    font-weight: bold;
    color: var(--color-accent, #c9a84c);
    white-space: nowrap;
    width: 45%;
}
 
/* ── 物品图标网格(任务 8.3)────────────────────────────── */
.item-icon-grid {
.item-icon-grid {
     display: grid;
     display: grid;
第119行: 第284行:


.item-icon-grid .item-card {
.item-icon-grid .item-card {
     background: var(--color-bg-secondary, #1a3a5c);
     background: #1a3a5c;
     border: 1px solid var(--color-border, #2a4a6c);
     border: 1px solid #2a4a6c;
     border-radius: 6px;
     border-radius: 6px;
     padding: 0.6rem;
     padding: 0.6rem;
第127行: 第292行:
}
}


.item-icon-grid .item-card img {
.item-icon-grid .item-card img { max-width: 64px; max-height: 64px; margin-bottom: 0.3rem; }
    max-width: 64px;
    max-height: 64px;
    margin-bottom: 0.3rem;
}
 
/* ── 可排序数据表格(任务 8.2)──────────────────────────── */
.wikitable.equipment-table th {
    background: var(--color-bg-secondary, #1a3a5c);
    color: var(--color-accent, #c9a84c);
    border-color: var(--color-border, #2a4a6c);
}


.wikitable.equipment-table td {
/* ── 装备数据表(Template:EquipmentTable)────────────────*/
    border-color: var(--color-border, #2a4a6c);
.wikitable.equipment-table th { background: #1a3a5c; color: #c9a84c; border-color: #2a4a6c; }
}
.wikitable.equipment-table td { border-color: #2a4a6c; }

2026年4月14日 (二) 20:14的版本

/**
 * MediaWiki:Common.css
 * DOL ShipMaker Wiki - 大航海时代风格深色主题
 */

/* ── 首页 Hero 横幅 ───────────────────────────────────────
 * 图片占位:hero-banner.jpg
 * 建议尺寸:1920×500px,海洋/船只场景,横向构图
 * 上传后替换 url() 里的路径
 */
.wiki-hero {
    position: relative;
    width: 100%;
    height: 420px;
    background:
        linear-gradient(to bottom, rgba(10,22,40,0.3) 0%, rgba(10,22,40,0.85) 100%),
        url('/images/hero-banner.jpg') center center / cover no-repeat;
    /* 无图时显示深海渐变占位 */
    background-color: #0a1628;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    margin: -1rem -1rem 2rem -1rem;
}

.wiki-hero-logo {
    width: 80px;
    height: 80px;
    margin-bottom: 1rem;
    /* 占位:logo.png,建议 200×200px,透明背景 PNG */
    background: rgba(201,168,76,0.2);
    border-radius: 50%;
    border: 2px solid #c9a84c;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2.5rem;
}

.wiki-hero-title {
    font-size: 2.2rem;
    font-weight: bold;
    color: #c9a84c;
    text-shadow: 0 2px 8px rgba(0,0,0,0.8);
    margin-bottom: 0.5rem;
    letter-spacing: 2px;
}

.wiki-hero-subtitle {
    font-size: 1rem;
    color: #b0c4d8;
    text-shadow: 0 1px 4px rgba(0,0,0,0.8);
    margin-bottom: 1.5rem;
}

.wiki-hero-search {
    display: flex;
    gap: 0.5rem;
}

.wiki-hero-search a {
    background: #c9a84c;
    color: #0a1628;
    padding: 0.6rem 1.8rem;
    border-radius: 24px;
    font-weight: bold;
    text-decoration: none;
    font-size: 1rem;
    transition: background 0.2s;
}

.wiki-hero-search a:hover {
    background: #e0c070;
    color: #0a1628;
}

/* ── 分类图片卡片导航 ─────────────────────────────────────
 * 每张卡片图片:建议 320×120px,横向构图
 * 图片命名和位置见下方各卡片注释
 */
.wiki-nav-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0.6rem;
    margin: 0 0 2rem 0;
}

@media (max-width: 768px) {
    .wiki-nav-grid { grid-template-columns: repeat(2, 1fr); }
    .wiki-hero { height: 300px; }
    .wiki-hero-title { font-size: 1.5rem; }
}

.wiki-nav-card {
    position: relative;
    height: 90px;
    border-radius: 6px;
    overflow: hidden;
    border: 1px solid #2a4a6c;
    transition: transform 0.2s, box-shadow 0.2s;
    cursor: pointer;
}

.wiki-nav-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 16px rgba(74,158,255,0.3);
    border-color: #c9a84c;
}

.wiki-nav-card a {
    display: flex;
    align-items: flex-end;
    width: 100%;
    height: 100%;
    text-decoration: none;
    padding: 0.5rem 0.7rem;
    background: linear-gradient(to top, rgba(10,22,40,0.9) 40%, rgba(10,22,40,0.2) 100%);
    color: #e8eaf0;
    font-weight: bold;
    font-size: 0.95rem;
}

.wiki-nav-card a.new,
.wiki-nav-card a.new:visited {
    color: #e8eaf0;
}

/* 各卡片背景图占位(无图时显示渐变色块)
 * card-ships:     图片 nav-ships.jpg     320×120px  船只场景
 * card-equipment: 图片 nav-equipment.jpg 320×120px  装备/配件特写
 * card-guide:     图片 nav-guide.jpg     320×120px  航海地图/罗盘
 * card-community: 图片 nav-community.jpg 320×120px  港口/人群场景
 */
.wiki-nav-card.card-ships     { background-color: #1a3a5c; background-image: url('/images/nav-ships.jpg'); background-size: cover; background-position: center; }
.wiki-nav-card.card-equipment { background-color: #1a2a4c; background-image: url('/images/nav-equipment.jpg'); background-size: cover; background-position: center; }
.wiki-nav-card.card-guide     { background-color: #0f2a3c; background-image: url('/images/nav-guide.jpg'); background-size: cover; background-position: center; }
.wiki-nav-card.card-community { background-color: #1a1a3c; background-image: url('/images/nav-community.jpg'); background-size: cover; background-position: center; }

/* ── 精选内容区 ───────────────────────────────────────────*/
.wiki-featured {
    margin-bottom: 2rem;
}

.wiki-featured-title {
    font-size: 1rem;
    color: #7a9ab8;
    text-transform: uppercase;
    letter-spacing: 2px;
    margin-bottom: 1rem;
    padding-bottom: 0.4rem;
    border-bottom: 1px solid #2a4a6c;
}

.wiki-featured-grid {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 0.8rem;
}

@media (max-width: 768px) {
    .wiki-featured-grid { grid-template-columns: 1fr; }
}

.wiki-featured-card {
    position: relative;
    border-radius: 8px;
    overflow: hidden;
    border: 1px solid #2a4a6c;
    background: #111e30;
    min-height: 200px;
}

/* 精选主卡片图片:featured-main.jpg,建议 640×240px */
.wiki-featured-card.featured-main {
    background-image: url('/images/featured-main.jpg');
    background-size: cover;
    background-position: center;
    min-height: 240px;
}

.wiki-featured-card-body {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 1rem;
    background: linear-gradient(to top, rgba(10,22,40,0.95) 60%, transparent 100%);
}

.wiki-featured-card-tag {
    display: inline-block;
    background: #c9a84c;
    color: #0a1628;
    font-size: 0.7rem;
    font-weight: bold;
    padding: 2px 8px;
    border-radius: 3px;
    margin-bottom: 0.4rem;
    text-transform: uppercase;
}

.wiki-featured-card-title {
    font-size: 1.2rem;
    font-weight: bold;
    color: #e8eaf0;
    margin-bottom: 0.3rem;
}

.wiki-featured-card-desc {
    font-size: 0.85rem;
    color: #b0c4d8;
    line-height: 1.4;
}

.wiki-featured-card a,
.wiki-featured-card a.new {
    color: inherit;
    text-decoration: none;
}

/* ── 快速导航链接 ─────────────────────────────────────────*/
.wiki-quicklinks {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-bottom: 2rem;
}

.wiki-quicklinks a,
.wiki-quicklinks a.new {
    background: #1a3a5c;
    border: 1px solid #2a4a6c;
    color: #b0c4d8;
    padding: 0.3rem 0.9rem;
    border-radius: 16px;
    font-size: 0.85rem;
    text-decoration: none;
    transition: background 0.2s, border-color 0.2s;
}

.wiki-quicklinks a:hover {
    background: #2a4a6c;
    border-color: #c9a84c;
    color: #c9a84c;
}

/* ── 船只信息卡(Template:ShipInfobox)────────────────────*/
.infobox-ship {
    float: right;
    clear: right;
    margin: 0 0 1rem 1.5rem;
    padding: 0.8rem;
    min-width: 260px;
    max-width: 320px;
    background: #1a3a5c;
    border: 1px solid #c9a84c;
    border-radius: 6px;
    font-size: 0.9rem;
}

.infobox-ship .infobox-title {
    text-align: center;
    font-size: 1.1rem;
    font-weight: bold;
    color: #c9a84c;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid #2a4a6c;
    margin-bottom: 0.6rem;
}

.infobox-ship table { width: 100%; border-collapse: collapse; }
.infobox-ship td { padding: 3px 6px; border-bottom: 1px solid rgba(42,74,108,0.5); }
.infobox-ship td:first-child { font-weight: bold; color: #c9a84c; white-space: nowrap; width: 45%; }

/* ── 物品图标网格(Template:ItemIconGrid)────────────────*/
.item-icon-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
    gap: 0.8rem;
    margin: 1rem 0;
}

.item-icon-grid .item-card {
    background: #1a3a5c;
    border: 1px solid #2a4a6c;
    border-radius: 6px;
    padding: 0.6rem;
    text-align: center;
    font-size: 0.8rem;
}

.item-icon-grid .item-card img { max-width: 64px; max-height: 64px; margin-bottom: 0.3rem; }

/* ── 装备数据表(Template:EquipmentTable)────────────────*/
.wikitable.equipment-table th { background: #1a3a5c; color: #c9a84c; border-color: #2a4a6c; }
.wikitable.equipment-table td { border-color: #2a4a6c; }