MediaWiki:MenuSidebar.css:修订间差异

来自Mooncell - 玩家共同构筑的FGO中文Wiki
跳到导航 跳到搜索
无编辑摘要
无编辑摘要
 
第1行: 第1行:
/* 这里放置的CSS将应用于所有皮肤的侧边栏 */
/* 这里放置的CSS将应用于所有皮肤的侧边栏 */
.skin-vector .mw-body {
.skin-vector .mw-body{margin-left:10.5em!important;padding:1.25em 1.5em 1.5em 1.5em!important}
margin-left: 10.5em!important;
.skin-vector #mw-panel{padding-left:0!important;width:10.5em!important}
padding: 1.25em 1.5em 1.5em 1.5em!important
div#MenuSidebar{margin-bottom:5rem;position:absolute;top:200px;width:100%}
}
div#MenuSidebar a.external{background:0;padding-right:auto}
 
div#MenuSidebar>:first-child{margin-top:0;border-top:2px solid #f4c430}
.skin-vector #mw-panel {
div#MenuSidebar>:first-child>:first-child{box-shadow:none}
padding-left: 0!important;
div#MenuSidebar>ul{list-style:none none;width:100%;margin:0}
width: 10.5em!important
div#MenuSidebar ul{position:relative;font-size:.9rem}
}
div#MenuSidebar>ul>li ul{display:block;opacity:0;pointer-events:none;visibility:hidden;transition:.2s all ease-in-out}
 
div#MenuSidebar>ul ul{list-style:none none;position:absolute;left:100%;width:100%;top:0;margin:0;z-index:1;background-color:#333;box-shadow:-1px 2px 10px 0 rgba(0,0,0,0.4),-1px -2px 10px 0 rgba(0,0,0,0.4)}
div#MenuSidebar {
div#MenuSidebar ul li:first-child{box-shadow:none}
margin-bottom: 5rem;
div#MenuSidebar>p{padding:8px 10px;margin:0;cursor:default;margin-top:8px}
position: absolute;
div#MenuSidebar>ul li:hover>ul{display:block;opacity:1;pointer-events:auto;visibility:visible}
top: 200px;
div#MenuSidebar li{position:relative;margin:0;box-shadow:inset 0 1px rgba(244,196,48,0.5);transition:.15s all ease-in;z-index:1}
width: 100%
div#MenuSidebar li b,div#MenuSidebar li a{padding:5px 0;padding-left:18px;display:block;width:auto;height:100%;font-weight:normal}
}
div#MenuSidebar a{transition:all .15s ease-in;color:#eaeaea}
 
div#MenuSidebar a:hover,div#MenuSidebar b:hover{color:#000;background-color:#f4c430;text-decoration:none!important}
div#MenuSidebar a.external {
div#MenuSidebar b{cursor:default}
background: 0;
div#MenuSidebar li.child>a::after,div#MenuSidebar li.child>b::after{float:right;content:"\f0da";font-family:'Font Awesome 5 Free';font-weight:900;display:inherit;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;display:inline-block;font-style:normal;font-variant:normal;text-rendering:auto;line-height:100%;font-size:1rem;padding-top:2%;margin-right:3px}
padding-right: auto
div#MenuSidebar a.selflink:hover{background-color:inherit;color:#f4c430}
}
div#MenuSidebar>ul>li:last-child>a,div#MenuSidebar>ul>li:last-child>b{border-bottom-right-radius:5px}
 
div#MenuSidebar a.selflink::before{display:block;position:absolute;left:0;top:50%;transform:translateY(-50%);border-top:6px solid transparent;border-bottom:6px solid transparent;border-left:6px solid #f4c430}
div#MenuSidebar>:first-child {
div#MenuSidebar{background-color:rgba(255,255,255,0);box-shadow:none;top:170px}
margin-top: 0;
div#MenuSidebar>ul{background-color:hsla(0,0%,100%,0.6);box-shadow:0 2px 4px rgba(0,0,0,0.16),0 2px 4px rgba(0,0,0,0.23);border-bottom-right-radius:4px;margin-top:-1px;margin-bottom:6px}
border-top: 2px solid #f4c430
div#MenuSidebar>ul>li{box-shadow:inset 0 1px #85c1f7;margin-left:0}
}
div#MenuSidebar>ul ul{background-color:hsla(0,0%,100%,0.9);box-shadow:0 3px 6px rgba(0,0,0,0.16),0 3px 6px rgba(0,0,0,0.23);border-radius:4px;width:unset!important;z-index:2}
 
div#MenuSidebar>ul ul li{box-shadow:none}
div#MenuSidebar>:first-child>:first-child {
div#MenuSidebar>ul>li>ul{width:150%;font-size:100%}
box-shadow: none
div#MenuSidebar>ul>li>ul ul{font-size:100%}
}
div#MenuSidebar a,div#MenuSidebar b{color:#333;text-decoration:none!important}
 
div#MenuSidebar>p{border-top:0;border-bottom:2px solid #4487df;color:#4487df;padding:8px 10px 6px;background-color:hsla(0,0%,100%,0.6);box-shadow:0 0 4px rgba(0,0,0,0.16),0 0 4px rgba(0,0,0,0.23);border-top-right-radius:4px}
div#MenuSidebar>ul {
div#MenuSidebar>:first-child,div#MenuSidebar>:not(p)+ul{border-top:0;border-top-right-radius:4px}
list-style: none none;
div#MenuSidebar>:not(p)+ul>:first-child{border-top-right-radius:4px}
width: 100%;
div#MenuSidebar>ul>:first-child{box-shadow:none}
margin: 0
div#MenuSidebar>ul ul a,div#MenuSidebar>ul ul b{padding:5px 18px 5px 10px;white-space:nowrap}
}
div#MenuSidebar>ul>li>a,div#MenuSidebar>ul>li>b{padding-left:18px}
 
div#MenuSidebar li li.child>a::after,div#MenuSidebar li li.child>b::after{float:unset;position:absolute;right:0;bottom:5px}
div#MenuSidebar ul {
div#MenuSidebar a:hover,div#MenuSidebar b:hover{background-color:rgba(205,235,252,0.4)}
position: relative;
div#MenuSidebar a.selflink,div#MenuSidebar b.selflink{font-weight:normal;color:#333;background-image:linear-gradient(90deg,#4487df 4px,transparent 4px)}
font-size: .9rem
div#MenuSidebar a.selflink:hover,div#MenuSidebar b.selflink:hover{background-color:inherit;color:#333}
}
.skin-vector #left-navigation,.skin-vector #content{margin-left:10.5em}
 
div#MenuSidebar>ul,div#MenuSidebar>p{box-shadow:none;border-radius:0!important;background-color:unset;margin:0}
div#MenuSidebar>ul>li ul {
div#MenuSidebar>p{font-weight:normal;padding:8px 10px 3px 10px}
display: block;
div#MenuSidebar>ul>li{box-shadow:none}
opacity: 0;
div#MenuSidebar>p::after{height:4px;display:block;width:100%;position:absolute;bottom:-8px;left:5px;border-radius:25px;content:"";background-image:linear-gradient(90deg,#4487df,transparent 95%)}
pointer-events: none;
div#MenuSidebar>p{color:#4487df;position:relative;padding-left:15px!important;margin-top:0!important;margin-bottom:8px!important;border:0!important}
visibility: hidden;
div#MenuSidebar>ul>li>a,div#MenuSidebar>ul>li>b{padding:2px 0;padding-left:8px;margin-top:2px;margin-left:10px;margin-right:0;border-radius:5px 0 0 5px;transition:.3s all ease;color:#555}
transition: .2s all ease-in-out
div#MenuSidebar>ul>:first-child>a,div#MenuSidebar>ul>:first-child>b{margin-top:5px}
}
div#MenuSidebar>ul>li>a:HOVER,div#MenuSidebar>ul>li>b:HOVER{background-color:rgba(34,170,255,0.2);color:black}
 
div#MenuSidebar>ul>li>a.selflink{background-color:rgba(34,170,255,0.2)!important;color:black!important}
div#MenuSidebar>ul ul {
div#MenuSidebar>ul{padding-top:2px;padding-bottom:2px;border:0;background-image:none}
list-style: none none;
div#MenuSidebar{background-color:hsla(0,0%,100%,0.6);border-radius:none!important;padding-top:40px;box-shadow:none!important}
position: absolute;
div#MenuSidebar>ul>li.child>a::after,div#MenuSidebar>ul>li.child>b::after{margin-right:10px!important;color:inherit!important;padding-top:1%!important}
left: 100%;
div#MenuSidebar>ul>li>ul{top:-4px}
width: 100%;
a.feedlink{padding-left:16px!important}
top: 0;
margin: 0;
z-index: 1;
background-color: #333;
box-shadow: -1px 2px 10px 0 rgba(0, 0, 0, 0.4), -1px -2px 10px 0 rgba(0, 0, 0, 0.4)
}
 
div#MenuSidebar ul li:first-child {
box-shadow: none
}
 
div#MenuSidebar>p {
padding: 8px 10px;
margin: 0;
cursor: default;
margin-top: 8px
}
 
div#MenuSidebar>ul li:hover>ul {
display: block;
opacity: 1;
pointer-events: auto;
visibility: visible
}
 
div#MenuSidebar li {
position: relative;
margin: 0;
box-shadow: inset 0 1px rgba(244, 196, 48, 0.5);
transition: .15s all ease-in;
z-index: 1
}
 
div#MenuSidebar li b,
div#MenuSidebar li a {
padding: 5px 0;
padding-left: 18px;
display: block;
width: auto;
height: 100%;
font-weight: normal
}
 
div#MenuSidebar a {
transition: all .15s ease-in;
color: #eaeaea
}
 
div#MenuSidebar a:hover,
div#MenuSidebar b:hover {
color: #000;
background-color: #f4c430;
text-decoration: none!important
}
 
div#MenuSidebar b {
cursor: default
}
 
div#MenuSidebar li.child>a::after,
div#MenuSidebar li.child>b::after {
float: right;
content: "\f0da";
font-family: 'Font Awesome 5 Free';
font-weight: 900;
display: inherit;
-moz-osx-font-smoothing: grayscale;
-webkit-font-smoothing: antialiased;
display: inline-block;
font-style: normal;
font-variant: normal;
text-rendering: auto;
line-height: 100%;
font-size: 1rem;
padding-top: 2%;
margin-right: 3px
}
 
div#MenuSidebar a.selflink:hover {
background-color: inherit;
color: #f4c430
}
 
div#MenuSidebar>ul>li:last-child>a,
div#MenuSidebar>ul>li:last-child>b {
border-bottom-right-radius: 5px
}
 
div#MenuSidebar a.selflink::before {
display: block;
position: absolute;
left: 0;
top: 50%;
transform: translateY(-50%);
border-top: 6px solid transparent;
border-bottom: 6px solid transparent;
border-left: 6px solid #f4c430
}
 
div#MenuSidebar {
background-color: rgba(255, 255, 255, 0);
box-shadow: none;
top: 170px
}
 
div#MenuSidebar>ul {
background-color: hsla(0, 0%, 100%, 0.6);
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.16), 0 2px 4px rgba(0, 0, 0, 0.23);
border-bottom-right-radius: 4px;
margin-top: -1px;
margin-bottom: 6px
}
 
div#MenuSidebar>ul>li {
box-shadow: inset 0 1px #85c1f7;
margin-left: 0
}
 
div#MenuSidebar>ul ul {
background-color: hsla(0, 0%, 100%, 0.9);
box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
border-radius: 4px;
width: unset!important;
z-index: 2
}
 
div#MenuSidebar>ul ul li {
box-shadow: none
}
 
div#MenuSidebar>ul>li>ul {
width: 150%;
font-size: 100%
}
 
div#MenuSidebar>ul>li>ul ul {
font-size: 100%
}
 
div#MenuSidebar a,
div#MenuSidebar b {
color: #333;
text-decoration: none!important
}
 
div#MenuSidebar>p {
border-top: 0;
border-bottom: 2px solid #4487df;
color: #4487df;
padding: 8px 10px 6px;
background-color: hsla(0, 0%, 100%, 0.6);
box-shadow: 0 0 4px rgba(0, 0, 0, 0.16), 0 0 4px rgba(0, 0, 0, 0.23);
border-top-right-radius: 4px
}
 
div#MenuSidebar>:first-child,
div#MenuSidebar>:not(p)+ul {
border-top: 0;
border-top-right-radius: 4px
}
 
div#MenuSidebar>:not(p)+ul>:first-child {
border-top-right-radius: 4px
}
 
div#MenuSidebar>ul>:first-child {
box-shadow: none
}
 
div#MenuSidebar>ul ul a,
div#MenuSidebar>ul ul b {
padding: 5px 18px 5px 10px;
white-space: nowrap
}
 
div#MenuSidebar>ul>li>a,
div#MenuSidebar>ul>li>b {
padding-left: 18px
}
 
div#MenuSidebar li li.child>a::after,
div#MenuSidebar li li.child>b::after {
float: unset;
position: absolute;
right: 0;
bottom: 5px
}
 
div#MenuSidebar a:hover,
div#MenuSidebar b:hover {
background-color: rgba(205, 235, 252, 0.4)
}
 
div#MenuSidebar a.selflink,
div#MenuSidebar b.selflink {
font-weight: normal;
color: #333;
background-image: linear-gradient(90deg, #4487df 4px, transparent 4px)
}
 
div#MenuSidebar a.selflink:hover,
div#MenuSidebar b.selflink:hover {
background-color: inherit;
color: #333
}
 
.skin-vector #left-navigation,
.skin-vector #content {
margin-left: 10.5em
}
 
div#MenuSidebar>ul,
div#MenuSidebar>p {
box-shadow: none;
border-radius: 0!important;
background-color: unset;
margin: 0
}
 
div#MenuSidebar>p {
font-weight: normal;
padding: 8px 10px 3px 10px
}
 
div#MenuSidebar>ul>li {
box-shadow: none
}
 
div#MenuSidebar>p::after {
height: 4px;
display: block;
width: 100%;
position: absolute;
bottom: -8px;
left: 5px;
border-radius: 25px;
content: "";
background-image: linear-gradient(90deg, #4487df, transparent 95%)
}
 
div#MenuSidebar>p {
color: #4487df;
position: relative;
padding-left: 15px!important;
margin-top: 0!important;
margin-bottom: 8px!important;
border: 0!important
}
 
div#MenuSidebar>ul>li>a,
div#MenuSidebar>ul>li>b {
padding: 2px 0;
padding-left: 8px;
margin-top: 2px;
margin-left: 10px;
margin-right: 0;
border-radius: 5px 0 0 5px;
transition: .3s all ease;
color: #555
}
 
div#MenuSidebar>ul>:first-child>a,
div#MenuSidebar>ul>:first-child>b {
margin-top: 5px
}
 
div#MenuSidebar>ul>li>a:HOVER,
div#MenuSidebar>ul>li>b:HOVER {
background-color: rgba(34, 170, 255, 0.2);
color: black
}
 
div#MenuSidebar>ul>li>a.selflink {
background-color: rgba(34, 170, 255, 0.2)!important;
color: black!important
}
 
div#MenuSidebar>ul {
padding-top: 2px;
padding-bottom: 2px;
border: 0;
background-image: none
}
 
div#MenuSidebar {
background-color: hsla(0, 0%, 100%, 0.6);
border-radius: none!important;
padding-top: 40px;
box-shadow: none!important
}
 
div#MenuSidebar>ul>li.child>a::after,
div#MenuSidebar>ul>li.child>b::after {
margin-right: 10px!important;
color: inherit!important;
padding-top: 1%!important;
}
 
div#MenuSidebar>ul>li>ul {
top: -4px
}
 
a.feedlink {
padding-left: 16px!important;
}
 
/* 为复制短链接增加一个图标 */
/* 为复制短链接增加一个图标 */
#MenuSidebar #wgCopyURL-url-copy-sidebar::after {
#MenuSidebar #wgCopyURL-url-copy-sidebar::after{content:"\f0c1";font-family:'Font Awesome 5 Free';font-weight:900;-webkit-font-smoothing:antialiased;display:inline-block;font-style:normal;font-variant:normal;text-rendering:auto;line-height:1;font-size:70%;margin-left:.4em;color:var(--darkblue);pointer-events:auto;cursor:pointer}
  content: "\f0c1";
  font-family: 'Font Awesome 5 Free';
  font-weight: 900;
  -webkit-font-smoothing: antialiased;
  display: inline-block;
  font-style: normal;
  font-variant: normal;
  text-rendering: auto;
  line-height: 1;
  font-size: 70%;
  margin-left: .4em;
  color: var(--darkblue);
  pointer-events: auto;
  cursor: pointer;
}

2022年5月18日 (三) 20:32的最新版本

/* 这里放置的CSS将应用于所有皮肤的侧边栏 */
.skin-vector .mw-body{margin-left:10.5em!important;padding:1.25em 1.5em 1.5em 1.5em!important}
.skin-vector #mw-panel{padding-left:0!important;width:10.5em!important}
div#MenuSidebar{margin-bottom:5rem;position:absolute;top:200px;width:100%}
div#MenuSidebar a.external{background:0;padding-right:auto}
div#MenuSidebar>:first-child{margin-top:0;border-top:2px solid #f4c430}
div#MenuSidebar>:first-child>:first-child{box-shadow:none}
div#MenuSidebar>ul{list-style:none none;width:100%;margin:0}
div#MenuSidebar ul{position:relative;font-size:.9rem}
div#MenuSidebar>ul>li ul{display:block;opacity:0;pointer-events:none;visibility:hidden;transition:.2s all ease-in-out}
div#MenuSidebar>ul ul{list-style:none none;position:absolute;left:100%;width:100%;top:0;margin:0;z-index:1;background-color:#333;box-shadow:-1px 2px 10px 0 rgba(0,0,0,0.4),-1px -2px 10px 0 rgba(0,0,0,0.4)}
div#MenuSidebar ul li:first-child{box-shadow:none}
div#MenuSidebar>p{padding:8px 10px;margin:0;cursor:default;margin-top:8px}
div#MenuSidebar>ul li:hover>ul{display:block;opacity:1;pointer-events:auto;visibility:visible}
div#MenuSidebar li{position:relative;margin:0;box-shadow:inset 0 1px rgba(244,196,48,0.5);transition:.15s all ease-in;z-index:1}
div#MenuSidebar li b,div#MenuSidebar li a{padding:5px 0;padding-left:18px;display:block;width:auto;height:100%;font-weight:normal}
div#MenuSidebar a{transition:all .15s ease-in;color:#eaeaea}
div#MenuSidebar a:hover,div#MenuSidebar b:hover{color:#000;background-color:#f4c430;text-decoration:none!important}
div#MenuSidebar b{cursor:default}
div#MenuSidebar li.child>a::after,div#MenuSidebar li.child>b::after{float:right;content:"\f0da";font-family:'Font Awesome 5 Free';font-weight:900;display:inherit;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;display:inline-block;font-style:normal;font-variant:normal;text-rendering:auto;line-height:100%;font-size:1rem;padding-top:2%;margin-right:3px}
div#MenuSidebar a.selflink:hover{background-color:inherit;color:#f4c430}
div#MenuSidebar>ul>li:last-child>a,div#MenuSidebar>ul>li:last-child>b{border-bottom-right-radius:5px}
div#MenuSidebar a.selflink::before{display:block;position:absolute;left:0;top:50%;transform:translateY(-50%);border-top:6px solid transparent;border-bottom:6px solid transparent;border-left:6px solid #f4c430}
div#MenuSidebar{background-color:rgba(255,255,255,0);box-shadow:none;top:170px}
div#MenuSidebar>ul{background-color:hsla(0,0%,100%,0.6);box-shadow:0 2px 4px rgba(0,0,0,0.16),0 2px 4px rgba(0,0,0,0.23);border-bottom-right-radius:4px;margin-top:-1px;margin-bottom:6px}
div#MenuSidebar>ul>li{box-shadow:inset 0 1px #85c1f7;margin-left:0}
div#MenuSidebar>ul ul{background-color:hsla(0,0%,100%,0.9);box-shadow:0 3px 6px rgba(0,0,0,0.16),0 3px 6px rgba(0,0,0,0.23);border-radius:4px;width:unset!important;z-index:2}
div#MenuSidebar>ul ul li{box-shadow:none}
div#MenuSidebar>ul>li>ul{width:150%;font-size:100%}
div#MenuSidebar>ul>li>ul ul{font-size:100%}
div#MenuSidebar a,div#MenuSidebar b{color:#333;text-decoration:none!important}
div#MenuSidebar>p{border-top:0;border-bottom:2px solid #4487df;color:#4487df;padding:8px 10px 6px;background-color:hsla(0,0%,100%,0.6);box-shadow:0 0 4px rgba(0,0,0,0.16),0 0 4px rgba(0,0,0,0.23);border-top-right-radius:4px}
div#MenuSidebar>:first-child,div#MenuSidebar>:not(p)+ul{border-top:0;border-top-right-radius:4px}
div#MenuSidebar>:not(p)+ul>:first-child{border-top-right-radius:4px}
div#MenuSidebar>ul>:first-child{box-shadow:none}
div#MenuSidebar>ul ul a,div#MenuSidebar>ul ul b{padding:5px 18px 5px 10px;white-space:nowrap}
div#MenuSidebar>ul>li>a,div#MenuSidebar>ul>li>b{padding-left:18px}
div#MenuSidebar li li.child>a::after,div#MenuSidebar li li.child>b::after{float:unset;position:absolute;right:0;bottom:5px}
div#MenuSidebar a:hover,div#MenuSidebar b:hover{background-color:rgba(205,235,252,0.4)}
div#MenuSidebar a.selflink,div#MenuSidebar b.selflink{font-weight:normal;color:#333;background-image:linear-gradient(90deg,#4487df 4px,transparent 4px)}
div#MenuSidebar a.selflink:hover,div#MenuSidebar b.selflink:hover{background-color:inherit;color:#333}
.skin-vector #left-navigation,.skin-vector #content{margin-left:10.5em}
div#MenuSidebar>ul,div#MenuSidebar>p{box-shadow:none;border-radius:0!important;background-color:unset;margin:0}
div#MenuSidebar>p{font-weight:normal;padding:8px 10px 3px 10px}
div#MenuSidebar>ul>li{box-shadow:none}
div#MenuSidebar>p::after{height:4px;display:block;width:100%;position:absolute;bottom:-8px;left:5px;border-radius:25px;content:"";background-image:linear-gradient(90deg,#4487df,transparent 95%)}
div#MenuSidebar>p{color:#4487df;position:relative;padding-left:15px!important;margin-top:0!important;margin-bottom:8px!important;border:0!important}
div#MenuSidebar>ul>li>a,div#MenuSidebar>ul>li>b{padding:2px 0;padding-left:8px;margin-top:2px;margin-left:10px;margin-right:0;border-radius:5px 0 0 5px;transition:.3s all ease;color:#555}
div#MenuSidebar>ul>:first-child>a,div#MenuSidebar>ul>:first-child>b{margin-top:5px}
div#MenuSidebar>ul>li>a:HOVER,div#MenuSidebar>ul>li>b:HOVER{background-color:rgba(34,170,255,0.2);color:black}
div#MenuSidebar>ul>li>a.selflink{background-color:rgba(34,170,255,0.2)!important;color:black!important}
div#MenuSidebar>ul{padding-top:2px;padding-bottom:2px;border:0;background-image:none}
div#MenuSidebar{background-color:hsla(0,0%,100%,0.6);border-radius:none!important;padding-top:40px;box-shadow:none!important}
div#MenuSidebar>ul>li.child>a::after,div#MenuSidebar>ul>li.child>b::after{margin-right:10px!important;color:inherit!important;padding-top:1%!important}
div#MenuSidebar>ul>li>ul{top:-4px}
a.feedlink{padding-left:16px!important}
/* 为复制短链接增加一个图标 */
#MenuSidebar #wgCopyURL-url-copy-sidebar::after{content:"\f0c1";font-family:'Font Awesome 5 Free';font-weight:900;-webkit-font-smoothing:antialiased;display:inline-block;font-style:normal;font-variant:normal;text-rendering:auto;line-height:1;font-size:70%;margin-left:.4em;color:var(--darkblue);pointer-events:auto;cursor:pointer}