- 核桃编程
[核OJ美化 · Stylus] <New Hetao> 更新 v2.0
-
hetao1665716
LV 10
@
2024-4-3 18:38:27
你好，Hydro 核桃！
继上次 link 我的美化插件被 @ 翻修一遍后，也是继续重新翻出来写了 1 个小时，优化了许多不足。
效果展示：
本次更新的内容为：
-
标题栏：分离 独立 透明 圆角化
- 优化了标题栏标签和下拉标签的渲染
- 修复了部分标签获焦无反应的 bug
- 修复了访问后链接的显示渲染问题
- 题库界面背景无透明的问题
- 背景动图（空崎日奈·水着）
- and so on……
目前发现的待修复问题有：
- 部分界面（题库，域管理界面等）显示生硬、渲染错误、无法正常渲染问题（仍未写好代码）
- 底部栏无透明问题
- 标题下拉标签背景渲染问题
- 在线编程界面渲染问题
- 如有其他问题请补充
/* ==UserStyle==
@name New Hetao
@namespace github.com/openstyles/stylus
@version 1.0.2
@description A new userstyle
@author Me
==/UserStyle== */
@-moz-document url-prefix("http://oj.hetao101.com/") {
body .slideout-panel .main{
background-image: url(http://oj.hetao101.com/file/1109/18d1fe8d-6302-4a71-a78a-3e01ef859ef7.gif) !important;
background-repeat: no-repeat;
background-size: cover;
background-position: center;
background-attachment: fixed;
}
body .slideout-menu{
background-color:rgba(255, 255, 255, .5);
}
body .slideout-panel .main .row .large-9 .section{
background-color:rgba(255, 255, 255, .7);
}
body .slideout-panel .main .row .large-3 .section {
background-color:rgba(255, 255, 255, .7);
}
body .slideout-panel .main .row .medium-9 .section{
background-color:rgba(255, 255, 255, .7);
}
body .slideout-panel .main .row .medium-3 .section {
background-color:rgba(255, 255, 255, .7);
}
.typo a:not(.user-profile-name):not(.media-link), .typo .link:not(.user-profile-name):not(.media-link), .typo-a:not(.user-profile-name):not(.media-link), .typo a:visited:not(.user-profile-name):not(.media-link), .typo .link:visited:not(.user-profile-name):not(.media-link), .typo-a:visited:not(.user-profile-name):not(.media-link), .typo a:active:not(.user-profile-name):not(.media-link), .typo .link:active:not(.user-profile-name):not(.media-link), .typo-a:active:not(.user-profile-name):not(.media-link) {
color: #5f9fd6;
}
.typo a:hover:not(.user-profile-name):not(.media-link), .typo .link:hover:not(.user-profile-name):not(.media-link), .typo-a:hover:not(.user-profile-name):not(.media-link) {
color: #fa4b4b;
text-decoration:none;
-webkit-transition:color 300ms;
-o-transition: color 300ms;
transition: color 300ms;
}
body .slideout-panel .footer {
background:rgba(255, 255, 255, .7);
}
.page--discussion_main .discussion__title a:visited {
color: grey;
}
.page--discussion_main .discussion__title a:visited:hover {
color: #fa4b4b;
text-decoration:none;
-webkit-transition:color 300ms;
-o-transition: color 300ms;
transition: color 300ms;
}
.numbox__text {
color: #000;
}
.supplementary li{
color: #464444;
}
body .slideout-panel .main .row .large-9 .section{
border-radius: 20px !important;
}
body .slideout-panel .main .row .large-6 .section{
border-radius: 20px !important;
}
body .slideout-panel .main .row .large-3 .section {
border-radius: 20px !important;
}
body .slideout-panel .main .row .medium-9 .section{
border-radius: 20px !important;
}
body .slideout-panel .main .row .medium-6 .section{
border-radius: 20px !important;
}
body .slideout-panel .main .row .medium-3 .section {
border-radius: 20px !important;
}
body .slideout-panel .main .row .medium-12 .section {
border-radius: 20px !important;
}
body .slideout-panel .main .row .medium-12 .section {
border-radius: 20px !important;
}
body .slideout-panel .main .row .medium-10 .section {
border-radius: 20px !important;
}
body .slideout-panel .main .row .medium-2 .section {
border-radius: 20px !important;
}
body .slideout-panel .footer {
border-radius: 20px !important;
}
a {
position: relative;
}
a:hover{
text-decoration:none;
color: #fa4b4b;
-webkit-transition:color 300ms;
-o-transition: color 300ms;
transition: color 300ms;
}
a:after {
content: "";
width: 0;
height: 2px;
background: rgba(0, 110, 255, .575);
position: absolute;
top: 100%;
left: 50%;
transition: all .3s;
}
a:hover::after {
left: 0%;
width: 100%;
}
.drop-element, .drop-element:after, .drop-element:before, .drop-element *, .drop-element *:after, .drop-element *:before {
border-radius: 20px !important;
}
.nav {
position: absolute;
border-radius: 20px !important;
left: 10%;
top: 10px;
width: 70%;
height: 2.8125rem;
font-size: .875rem;
transition: background .2s;
transition-timing-function: cubic-bezier(.215,.61,.355,1);
z-index: 500;
background:rgba(255, 255, 255, .9);
}
#searchForm {
border-radius: 20px !important;
background:rgba(255, 255, 255, .8);
}
.section__table-container {
border-radius: 20px !important;
background:rgba(255, 255, 255, .8);
}
.dropdown .menu {
background: #e5e5e5ba;
}
.nav .nav__item:hover {
background: #e5e5e599;
color: #fa4b4b;
}
.nav .nav__item {
color: #000;
}
.nav--shadow {
border-radius: 20px !important;
position: absolute;
left: 10%;
top: 10px;
width: 100%;
height: 2.8125rem;
z-index: 300;
transition: box-shadow .2s;
transition-timing-function: cubic-bezier(.215,.61,.355,1);
box-shadow: 0 0 6px rgba(0,0,0,.3);
}
.page--discussion_main .discussion__title a:visited, .page--discussion_node .discussion__title a:visited, .page--blog_main .discussion__title a:visited, .page--user_detail .discussion__title a:visited {
color: grey;
}
}
@-moz-document url-prefix("https://oj.hetao101.com/") {
body .slideout-panel .main{
background-image: url(https://oj.hetao101.com/d/python/file/22930/dxtqwlh5.jpg) !important;
background-repeat: no-repeat;
background-size: cover;
background-position: center;
background-attachment: fixed;
}
body .slideout-menu{
background-color:rgba(255, 255, 255, .5);
}
body .slideout-panel .main .row .large-9 .section{
background-color:rgba(255, 255, 255, .7);
}
body .slideout-panel .main .row .large-3 .section {
background-color:rgba(255, 255, 255, .7);
}
body .slideout-panel .footer {
background:rgba(255, 255, 255, .7);
}
.page--discussion_main .discussion__title a:visited,.page--discussion_node .discussion__title a:visited,.page--blog_main .discussion__title a:visited,.page--user_detail .discussion__title a:visited {
color: #fff;
}
.numbox__text {
color: #000;
}
.supplementary li{
color: #464444;
}
body .slideout-panel .main .row .large-9 .section{
border-radius: 20px !important;
}
body .slideout-panel .main .row .large-6 .section{
border-radius: 20px !important;
}
body .slideout-panel .main .row .large-3 .section {
border-radius: 20px !important;
}
body .slideout-panel .main .row .medium-9 .section{
border-radius: 20px !important;
}
body .slideout-panel .main .row .medium-6 .section{
border-radius: 20px !important;
}
body .slideout-panel .main .row .medium-3 .section {
border-radius: 20px !important;
}
body .slideout-panel .main .row .medium-12 .section {
border-radius: 20px !important;
}
body .slideout-panel .main .row .medium-12 .section {
border-radius: 20px !important;
}
body .slideout-panel .main .row .medium-10 .section {
border-radius: 20px !important;
}
body .slideout-panel .main .row .medium-2 .section {
border-radius: 20px !important;
}
body .slideout-panel .footer {
border-radius: 20px !important;
}
.page--discussion_main .discussion__title a:hover {
text-decoration:none;
color: #fa4b4b;
-webkit-transition:color 300ms;
-o-transition: color 300ms;
transition: color 300ms;
}
a {
position: relative;
}
a:hover{
text-decoration:none;
color: #fa4b4b;
-webkit-transition:color 300ms;
-o-transition: color 300ms;
transition: color 300ms;
}
a:after {
content: "";
width: 0;
height: 2px;
background: rgba(0, 110, 255, .575);
position: absolute;
top: 100%;
left: 50%;
transition: all .3s;
}
a:hover::after {
left: 0%;
width: 100%;
}
}
此贴结