跳转到内容

MediaWiki:Common.css:修订间差异

来自共创世界wiki
Hanchie​(留言 | 贡献)
无编辑摘要
Hanchie​(留言 | 贡献)
无编辑摘要
第1行: 第1行:
:root {
/* 页面内顶部栏(随页面滚动,不固定) */
  --ccw-primary: #4c97ff;
  --ccw-primary-dark: #3373cc;
  --ccw-bar-height: 56px;
}
 
/* 顶栏 */
.ccw-topbar {
.ccw-topbar {
   position: fixed;
   background: #252930;
   top: 0; left: 0; right: 0;
   border-radius: 8px;
  height: var(--ccw-bar-height);
   margin: 0 0 1em 0;
  background: var(--ccw-primary);
   box-shadow: 0 2px 6px rgba(0,0,0,.15);
  z-index: 1000;
   font-size: 15px;
   font-size: 15px;
}
}
.ccw-topbar-inner {
.ccw-topbar-inner {
  max-width: 1280px;
  height: 100%;
  margin: 0 auto;
  padding: 0 16px;
   display: flex;
   display: flex;
   align-items: center;
   align-items: center;
   gap: 20px;
   gap: 20px;
  min-height: 52px;
  padding: 0 16px;
}
}
.ccw-topbar a,
.ccw-topbar a,
.ccw-topbar a:visited { color: #fff; text-decoration: none; }
.ccw-topbar a:visited { color: #fff; text-decoration: none; }
.ccw-topbar a.new { color: #fff; }


/* Logo */
/* Logo */
第32行: 第22行:


/* 导航 */
/* 导航 */
.ccw-nav { display: flex; align-items: center; gap: 4px; }
.ccw-nav { display: flex; align-items: center; gap: 4px; flex: 1; }
.ccw-nav a {
.ccw-nav a { padding: 8px 14px; border-radius: 8px; white-space: nowrap; transition: background .15s; }
  padding: 8px 14px;
.ccw-nav a:hover { background: rgba(255,255,255,.12); }
  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); }
.ccw-user { display: flex; align-items: center; gap: 8px; white-space: nowrap; }
/* Vector 旧版:隐藏自带的顶部个人工具栏避免重复(可选) */
.ccw-user a { padding: 6px 14px; border-radius: 18px; transition: background .15s; }
/* #mw-head { display: none; } */
.ccw-user a:hover { background: rgba(255,255,255,.12); }
.ccw-user a:last-child { background: #4c97ff; font-weight: 600; }
.ccw-user a:last-child:hover { background: #3373cc; }


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

2026年11月8日 (日) 21:22的版本

/* 页面内顶部栏(随页面滚动,不固定) */
.ccw-topbar {
  background: #252930;
  border-radius: 8px;
  margin: 0 0 1em 0;
  font-size: 15px;
}
.ccw-topbar-inner {
  display: flex;
  align-items: center;
  gap: 20px;
  min-height: 52px;
  padding: 0 16px;
}
.ccw-topbar a,
.ccw-topbar a:visited { color: #fff; text-decoration: none; }
.ccw-topbar a.new { color: #fff; }

/* 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; flex: 1; }
.ccw-nav a { padding: 8px 14px; border-radius: 8px; white-space: nowrap; transition: background .15s; }
.ccw-nav a:hover { background: rgba(255,255,255,.12); }

/* 右侧用户区 */
.ccw-user { display: flex; align-items: center; gap: 8px; white-space: nowrap; }
.ccw-user a { padding: 6px 14px; border-radius: 18px; transition: background .15s; }
.ccw-user a:hover { background: rgba(255,255,255,.12); }
.ccw-user a:last-child { background: #4c97ff; font-weight: 600; }
.ccw-user a:last-child:hover { background: #3373cc; }

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