跳转到内容

MediaWiki:Common.css

来自共创世界wiki
Hanchie​(留言 | 贡献)2026年11月8日 (日) 21:20的版本

注意:在发布之后,您可能需要清除浏览器缓存才能看到所作出的更改的影响。

  • Firefox或Safari:按住Shift的同时单击刷新,或按Ctrl-F5或Ctrl-R(Mac为⌘-R)
  • Google Chrome:按Ctrl-Shift-R(Mac为⌘-Shift-R)
  • Edge:按住Ctrl的同时单击刷新,或按Ctrl-F5。
:root {
  --ccw-primary: #4c97ff;
  --ccw-primary-dark: #3373cc;
  --ccw-bar-height: 56px;
}

/* 顶栏 */
.ccw-topbar {
  position: fixed;
  top: 0; left: 0; right: 0;
  height: var(--ccw-bar-height);
  background: var(--ccw-primary);
  box-shadow: 0 2px 6px rgba(0,0,0,.15);
  z-index: 1000;
  font-size: 15px;
}
.ccw-topbar-inner {
  max-width: 1280px;
  height: 100%;
  margin: 0 auto;
  padding: 0 16px;
  display: flex;
  align-items: center;
  gap: 20px;
}
.ccw-topbar a,
.ccw-topbar a:visited { color: #fff; text-decoration: none; }

/* Logo */
.ccw-logo { display: flex; align-items: center; gap: 8px; font-size: 18px; font-weight: 700; white-space: nowrap; }
.ccw-logo img { vertical-align: middle; }

/* 导航 */
.ccw-nav { display: flex; align-items: center; gap: 4px; }
.ccw-nav a {
  padding: 8px 14px;
  border-radius: 8px;
  transition: background .15s;
  white-space: nowrap;
}
.ccw-nav a:hover { background: rgba(255,255,255,.2); }

/* 搜索 */
.ccw-search { flex: 1; max-width: 360px; margin-left: auto; }
.ccw-search form { margin: 0; }
.ccw-search input[type=search] {
  width: 100%;
  box-sizing: border-box;
  height: 36px;
  padding: 0 16px;
  border: 0;
  border-radius: 18px;
  background: rgba(255,255,255,.25);
  color: #fff;
  outline: none;
  transition: background .15s;
}
.ccw-search input::placeholder { color: rgba(255,255,255,.8); }
.ccw-search input:focus { background: #fff; color: #333; }
.ccw-search input:focus::placeholder { color: #999; }

/* 用户区 */
.ccw-user { display: flex; align-items: center; gap: 10px; white-space: nowrap; }
.ccw-user a { padding: 6px 14px; border-radius: 18px; }
.ccw-user a:last-child { background: #fff; color: var(--ccw-primary-dark) !important; font-weight: 600; }
.ccw-user a:first-child:hover { background: rgba(255,255,255,.2); }

/* 给页面让出顶栏高度 */
body { padding-top: var(--ccw-bar-height); }
/* Vector 旧版:隐藏自带的顶部个人工具栏避免重复(可选) */
/* #mw-head { display: none; } */

/* 窄屏:隐藏导航 */
@media (max-width: 800px) {
  .ccw-nav { display: none; }
  .ccw-search { max-width: none; }
}