MediaWiki:Common.css

/* 这里放置的CSS将应用于所有皮肤 */


/**
 * by eijux
 * 2021/05/16
 */
/**
 * Styling for links generated by [[MediaWiki:Edittools]]
 * @source https://www.mediawiki.org/wiki/Extension:CharInsert#Styling
 * @updated 2020-03-17
.mw-charinsert-buttons {
	border: 1px solid #aaa;
	margin-top: 10px;
	padding: 1px;
	font-size: 1.1em;
	text-align: center;
}
.mw-charinsert-buttons a {
	background-color: #cde !important;
	color: #000;
	border: thin #069 outset;
	padding: 0 1px 1px;
	font-weight: bold;
	font-size: .9em;
	text-decoration: none;
}
.mw-charinsert-buttons a:hover,
.mw-charinsert-buttons a:active {
	background-color: #bcd;
	border-style: inset;
}
.client-js .mw-edittools-section {
	display: inline;
}
.client-js .mw-edittools-section input[type="button"] {
	font-size: .9em;
	margin-left: 1px;
	padding-left: 1px;
	padding-right: 1px;
}
 */
/**
 * Styling for links generated by [[MediaWiki:Edittools]] in WikimediaUI inspired theme.
 * @source https://www.mediawiki.org/wiki/Extension:CharInsert#Styling
 * @updated 2020-03-17
 */
.mw-charinsert-buttons {
	margin-top: 8px;
	border: 1px solid #c8ccd1;
	padding: 2px 4px 4px;
	font-size: 1.1em;
	text-align: center;
}
.mw-charinsert-buttons a {
	background-color: #f8f9fa !important;
	color: #202122;
	border: thin #36c outset;
	padding: 0 1px 2px;
	font-size: 0.9em;
	font-weight: bold;
	text-decoration: none;
}
.mw-charinsert-buttons a:hover {
	background-color: #fff;
    color: #404244;
}
.mw-charinsert-buttons a:active {
	background-color: #c8ccd1;
	border-style: inset;
}
.client-js .mw-edittools-section {
	display: inline;
}
.client-js .mw-edittools-section input[type="button"] {
	background-color: #f8f9fa;
	color: #202122;
	margin-left: 1px;
    border-radius: 2px;
	padding: 1px 6px;
	font-size: .9em;
    /* Apply pointer cursor to all interactive elements. */
    cursor: pointer;
}
.client-js .mw-edittools-section input[type="button"]:hover {
	background-color: #fff;
    color: #404244;
}
.client-js .mw-edittools-section input[type="button"]:active {
	background-color: #c8ccd1;
    color: #000;
}



/* 
 * by eijux
 * 2021/12/21
 * 
 * 来自“萌娘百科”的浮动效果，https://zh.moegirl.org.cn/index.php?title=User:850710247liu/js/FloatToc.js&action=raw&ctype=text/javascript */
 * 由用户:850710247liu设计的浮动目录效果 
*/
.toc-custom {
  position: fixed;
  right: -195px;
  top: 100px;
  z-index: 10;
  width: 181px;
  filter: alpha(opacity=50);
  -webkit-transition: -webkit-transform .2s ease-in;
  transition: transform .2s ease-in;
  padding: 0.8em;
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 1px rgba(0, 0, 0, 0.12);
  border-radius: 10px;
  overflow: hidden;
  border: 1px solid #ddd;
}
.toc-custom:hover {
  opacity: 1;
  filter: alpha(opacity=50);
  -webkit-transform: translate(-85%, 0);
  -ms-transform: translate(-85%, 0);
  transform: translate(-85%, 0);
  padding: 0.8em;
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 1px rgba(0, 0, 0, 0.12);
  border-radius: 10px;
  overflow: hidden;
  border: 1px solid #ddd;
}
.toc-custom>ul {
  height: 60vh;
  overflow-y: scroll;
}
#btn-showtoc {
  cursor: pointer;
}
.toc .toctoggle {
  display: none;
}