跳转到内容

MediaWiki:Gadget-popups.css

勤求古训,博采众方

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

  • Firefox或Safari:按住Shift的同时单击刷新,或按Ctrl-F5Ctrl-R(Mac为⌘-R
  • Google Chrome:Ctrl-Shift-R(Mac为⌘-Shift-R
  • Edge:按住Ctrl的同时单击刷新,或按Ctrl-F5
/* 更多链接弹出样式 */
.popupMoreLink {
  display: block;
  text-align: right;
  cursor: pointer;
}

/* 差异对比样式 */
ins.popupDiff {
  background: #afe; /* 新增内容背景色 */
}

del.popupDiff {
  background: #ffe6e6; /* 删除内容背景色 */
}

/* 深色模式适配 */
html.skin-theme-clientpref-night ins.popupDiff {
  background: #026c5f; /* 深色模式新增内容背景色 */
}
html.skin-theme-clientpref-night del.popupDiff {
  background: #89474b; /* 深色模式删除内容背景色 */
}
@media (prefers-color-scheme: dark) {
  html.skin-theme-clientpref-os ins.popupDiff {
    background: #026c5f; /* 操作系统深色模式新增内容背景色 */
  }
  html.skin-theme-clientpref-os del.popupDiff {
    background: #89474b; /* 操作系统深色模式删除内容背景色 */
  }
}

/* 选择预览区域 */
#selectionPreview {
  border: 2px solid var(--border-color-subtle, #c8ccd1);
  background-color: var(--background-color-progressive-subtle, #eaf3ff);
  padding: 6px;
}

/* 导航弹出框基础样式 */
.navpopup {
  border: 1px solid var(--border-color-base, #a2a9b1);
  background-color: var(--background-color-base, #fff);
  color: var(--color-base, #202122);
  padding: 10px;
  padding-bottom: 5px;
  font-size: 11px;
  box-shadow: 0 3px 8px rgba(50, 50, 50, 0.35);
  word-wrap: break-word;
}

.navpopup hr {
  color: #aaa !important;
  background-color: #aaa !important;
}

/* 拖动条样式 */
.popupDrag {
  background-color: #ffbe20; /* 拖动条颜色 */
  height: 5px;
  margin-top: -5px;
  margin-bottom: 5px;
}

.popupDragHandle {
  cursor: move;
  position: relative;
}

/* 菜单样式 - 感谢 [[User:Zocky]]! */

/* 弹出菜单 */
.popup_menu {
  display: none;
  position: absolute;
  left: 0;
  margin: 0;
  margin-top: 1.4em;
  line-height: 1.25em;
  top: 0;
  z-index: 2;
  width: 10em;
  background: var(--background-color-base, #fff);
  border: 1px solid grey;
  padding: 0 !important;
  margin-left: -6px;
  border-width: 1px 1px 1px 6px;
}

.popup_menu li { /* 同时适用于 popup_menu_row 和 popup_menu_item */
  list-style: none;
  margin: 0;
  padding: 0;
}

.popup_menu a {
  display: block;
  padding: 3px;
}

.popup_menu_row a {
  display: inline-block;
}

.popup_menu_row {
  color: #aaa;
}

.popup_drop {
  display: inline;
  position: relative;
}

.popup_drop a,
.popup_drop a:visited {
  padding: 3px;
  margin: 0;
  font-weight: bold;
}

.popup_drop:hover .popup_menu,
.popup_drop .popup_menu:hover {
  display: inline;
  padding: 2px;
}

.popup_drop:hover {
  background: #ccf;
  color: #44f;
}

/* 其他颜色和样式 */
.popup_menu a:hover {
  background: grey;
  color: #fff;
  text-decoration: none;
}

.popup_mainlink {
  font-size: 140%;
  font-weight: bold;
}

.popup_mainlink a {
  color: var(--color-emphasized, #000);
}

a.popup_change_title_link {
  color: #152;
}

/* 深色模式适配 */
html.skin-theme-clientpref-night a.popup_change_title_link {
  color: #25b84a;
}
@media (prefers-color-scheme: dark) {
  html.skin-theme-clientpref-os a.popup_change_title_link {
    color: #25b84a;
  }
}

.popup_diff_dates {
  font-style: italic;
  background: none;
}

.popup_menu_item a {
  display: block;
}

.popup_history_row_even {
  background: var(--background-color-neutral, #eaecf0); /* 偶数行背景色 */
}

.popup_history_date {
  font-weight: bold;
  font-size: 120%;
}

.popup_history_row_odd,
.popup_history_row_even {
  display: flex;
}

.popup_history_row_even td:nth-child(3),
.popup_history_row_odd td:nth-child(3) {
  flex: 3;
  word-break: break-word;
}
.popup_history_row_even td:nth-child(4),
.popup_history_row_odd td:nth-child(4) {
  flex: 7;
  word-break: break-word;
}
.popup_history_row_even > td:not(:last-child),
.popup_history_row_odd > td:not(:last-child) {
  margin-right: 2px;
}

/* 禁用跨维基链接样式 */
.popupPreview a.extiw,
.popupPreview a.extiw:active {
  color: #36b;
  background: none;
  padding: 0;
}

.popupPreview .external {
  color: #36b;
}

/* 在内容区域关闭特殊外部链接样式 */
.popupPreview .plainlinks a {
  background: none !important;
  padding: 0 !important;
}

/*
  弹出菜单的鼠标安全区域
*/

/* 视觉引导建议 */	
.popup_menu:hover {
  box-shadow: 0 0 5px 5px rgba(179, 179, 255, 0.3);
}
/* 深色模式适配 */
html.skin-theme-clientpref-night .popup_menu:hover {
  box-shadow: 0 0 5px 5px rgba(0, 0, 90, 0.3);
}
@media (prefers-color-scheme: dark) {
  html.skin-theme-clientpref-os .popup_menu:hover {
    box-shadow: 0 0 5px 5px rgba(0, 0, 90, 0.3);
  }
}

/* 鼠标光标梯形引导区域 */	
.popup_menu::before {
  content: '';
  display: block;
  position: absolute;
  height: 1.5em;
  top: -1.4em;
  left: -1.2em;
  width: calc(2 * var(--navpop-m-len, 6ch));
  transform: perspective(1px) rotateX(1deg);
}

/* 将梯形区域置于菜单项后面 */
.popup_menu::before {
  z-index: 1;
}

.popup_menu li {
  position: relative;
  z-index: 2;
}

/* 两侧额外的悬停边距 */
.popup_menu li::before {
  content: '';
  display: block;
  position: absolute;
  top: 0;
  height: calc(100% + .5em);
  left: -1.7em;
  width: 1.7em;
}

.popup_menu li::after {
  content: '';
  display: block;
  position: absolute;
  top: 0;
  height: calc(100% + .5em);
  left: calc(10em - 1px); /* 取决于菜单宽度 */
  width: 1em;
}