The interface beautification of Luogu OJ (theme: cherry blossoms) has the best effect in Chinese mainland.
对洛谷OJ进行界面美化（主题：樱花绽放），中国大陆效果最优。
by liyp （制作者 - 李一平）
Smart Luogu （氪洛谷） MC Cherry blossoms bloom （樱花绽放） by liyp
Details
Authorliyp
LicenseNo License
Categoryhttps://www.luogu.com.cn/
Created
Updated
Size37 kB
Statistics
Learn how we calculate statistics in the FAQ.
Failed to fetch stats.
Description
Notes
更新日志 Changelog
2024.07.13
修复超链接显示问题，将部分细节颜色设置为与背景更加符合的颜色。
Fixed the hyperlink display issue and set some details to a color that more consistent with the background.
Source code
Source code has over 10K characters, so we truncated it. You can inspect the full source code on install link./* ==UserStyle==
@name Smart-Luogu(MC)
@version 20230721.08.42
@namespace ?
==/UserStyle== */
/* ==UserStyle==
@name Smart - Luogu(MC) —— 智能的洛谷
@version 20220819.07.47
@namespace userstyles.world/user/acerkaio
@description 洛谷美化。
详见 UID 514850
https://smart-luogu.github.io/
@author acerkaio
@license CC BY-NC-SA
==/UserStyle== */
/* ==UserStyle==
@name Smart - Luogu(MC)
@version 20220727.01.28
@namespace userstyles.world/user/acerkaio
@description 洛谷美化。
详见 UID 514850
@author acerkaio
@license No License
==/UserStyle== */
@-moz-document regexp("https://www.luogu(.org|.com.cn)/(?!blog).*") {
/*luogu主站*/
/*--------------------------用户自设部分--------------------------*/
/*图片背景*/
html > body {
background-image: url(https://krseoul.imgtbl.com/i/2024/07/13/6691fa4bce955.png) !important;
background-repeat: no-repeat;
background-size: cover;
background-position: center;
background-attachment: fixed;
}
/*侧栏图片*/
#app > .lfe-body > div:first-of-type {
opacity:.8;
background-image: url(https://krseoul.imgtbl.com/i/2024/07/13/6691fa4bce955.png) !important;
background-repeat: no-repeat;
background-size: cover;
background-position: center;
border-radius: 30px;
background-attachment: revert;
}
/*题目分析栏*/
path.highcharts-area {
color: white;
background: white;
fill: #5e72e426;
}
path.highcharts-point.highcharts-color-0 {
fill: #5e98e48f;
}
rect.highcharts-point.highcharts-color-1 {
fill: #ffffff8f;
stroke: #d49ee6ad;
}
/*----透明化----*/
/*benben 讨论*/
.am-comment-main{
opacity:.75;
}
.am-comment-main:hover{
opacity:.75;
}
/*侧栏*/
#app > .lfe-body {
background-color: rgba(255, 255, 255, .07) !important;
}
/*侧栏图标*/
img[data-v-27b2cd59] {
opacity: .7;
}
/*记录详情 */
.wrapper > .test-case {
opacity: .85;
}
.wrapper > .test-case:hover {
opacity: 1;
}
/*卡片*/
/*主页卡片*/
.lg-article {
/*模糊（渣机很卡*/
/*
-webkit-backdrop-filter: blur(20px) !important;
backdrop-filter: blur(20px) !important;
*/
background: rgba(255, 255, 255, .7);
}
.lg-article:hover{
background: rgba(255, 255, 255, .8);
}
/*普通卡片*/
.card{
background: rgba(255, 255, 255, .8) !important;
}
.card:hover{
background: rgba(255, 255, 255, .85) !important;
}
/*应用*/
.popup[data-v-1d675dd8] {
background-color: rgba(255, 255, 255, .55) !important;
}
.popup[data-v-1d675dd8]:hover{
background-color: rgba(255, 255, 255, .9) !important;
}
/*用户顶栏*/
.user-nav[data-v-2dfcfd35] {
background: rgba(255, 255, 255, .4);
}
.user-nav[data-v-2dfcfd35]:hover {
background: rgba(255, 255, 255, .6);
}
/*----------------------------------------------------------------*/
/*定义*/
@keyframes showAPP {
0% {
opacity: 0;
margin-left: -300px;
}
100% {
opacity: .8;
margin-left: 3px;
}
}
@keyframes showtop {
0% {
opacity: 0;
margin-left: -100px;
}
100% {
opacity: 1;
margin-left: 0px;
}
}
@keyframes showUI {
0% {
opacity: 0;
margin-top: -50px;
}
100% {
opacity: 1;
margin-top: 20px;
}
}
@keyframes slowshow {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}
@keyframes clan {
0% {
margin-left: -50px;
}
}
/*滚动条*/
::-webkit-scrollbar-thumb {
background-color: rgba(137, 81, 234, .99);
}
::-webkit-scrollbar-thumb:hover {
background-color: #5e72e4;
}
::-webkit-scrollbar {
width: 5px;
height: 10px;
background-color: rgba(0, 0, 0, .12);
}
/*--标题栏*/
.main-container > .header-layout .background {
display: none !important;
}
/*超链接*/
a {
transition: all .15s ease;
color: #e21bddc9;
}
a:hover {
color: #f004f7c9;
}
a{ position: relative; }
a:not(.exlg-dash-options)::after{ content: ""; width: 0; height: 4px; background: rgba(241, 0, 255, .33); position: absolute; top: 100%; left: 50%; transition: all .3s; }
a:not(.exlg-dash-options):hover::after{ left: 0%; width: 100%; }
a[data-v-303bbf52][data-v-639bc19b][data-v-5e85f938]::after{
height: 0px !important;
}
a[data-v-303bbf52][data-v-258e49ac]::after{
height: 0px !important;
}
/*列表*/
.lfe-h1[data-v-2dfcfd35] {
animation: showtop 1s 1;
}
/*顶栏，低栏*/
.main-container > main.lfe-body {
background: transparent !important;
}
.background[data-v-7958fe72] {
background: transparent !important;
}
/*菜单栏*/
.center {
transition: all .3s ease;
background: rgba(255, 255, 255, .7) !important;
}
.center:hover {
background: rgba(255, 255, 255, .9) !important;
}
/*tiny顶栏*/
#app > .main-container > .header-layout.tiny[data-v-7958fe72] {
height: 60px;
z-index: 999;
margin-left: -10%;
padding-left:10%;
background-color: #ffffff4a !important;
-webkit-backdrop-filter: blur(10px) !important;
backdrop-filter: blur(10px) !important;
font-weight:bolder;
}
/*私信*/
.message{
border-radius:10px !important;
font-weight:bold;
}
/*互相关注*/
span.lfe-caption[data-v-43a42535][data-v-0c66dd62]{
transition:all .3s ease;
box-shadow: 0px 0px 5px #5f5f5f69;
}
span.lfe-caption[data-v-43a42535][data-v-0c66dd62]:hover {
transform: translateY(-2px);
box-shadow: 1px 1px 10px #5f5f5f94;
}
/*顶栏字体*/
.lfe-h1[data-v-2dfcfd35] {
font-size: 45px;
}
/*讨论列表*/
main {
margin-top: 45px;
}
.lg-content-table-left {
transition: all .5s ease;
box-shadow: 1px 1px 5px #3C4143;
border-radius: 30px;
margin-top: 20px;
padding-left: 30px;
padding-right: 30px;
padding-bottom: 20px;
position: relative;
background: #fcfcfc;
}
.lg-content-table-left:hover {
box-shadow: 3px 3px 20px #3C4143;
}
/*选择框*/
.selected:not([data-v-66021821]) {
transition:0s;
color:#fff !important;
background-image: linear-gradient( 135deg, #ce9ffc85 10%, #d931ab91 100%);
padding: 3px 7px 3px 7px !important;
margin-top: 1.7vh !important;
margin-bottom: 1.7vh !important;
border-radius:5px !important;
}
.selected > span{
color:#fff !important;
}
/*帖子、评论及奔奔*/
/*评论奔奔*/
.am-comment-main{
transition: all .5s ease;
box-shadow: 3px 3px 5px #303030;
}
.am-comment-main:hover{
box-shadow: 5px 5px 15px #303030;
}
.center > .am-comment-avatar{
border:0 !important;
transition: all .5s ease;
box-shadow: 1px 1px 5px #6e757a;
}
.center > .am-comment-avatar:hover{
transform:translateY(-1px);
box-shadow: 3px 4px 10px #6e757a;
}
.am-comment-main{
border-radius:10px;
border: #fff 10px solid !important;
}
.am-comment-main::before{
display:none;
}
/*页码*/
.am-pagination.am-pagination-centered > li > a{
border-radius:10px !important;
transition:all .5s ease;
box-shadow:0px 0px 10px #000;
}
.am-pagination.am-pagination-centered > li > a:hover{
border-radius:5px !important;
transform:translateY(-2px);
box-shadow:0px 0px 5px #000;
}
/*奔*/
.feed-selector {
transition: all .2s ease;
}
.feed-selector:hover {
border-radius: 3px !important;
box-shadow: 1px 1px 10px #000 !important;
}
/*头像选择*/
img.avatar{
border:0 !important;
box-shadow: 1px 1px 5px #6e757a;
transition:all .5s ease;
}
img.avatar:hover{
transform:translateY(-1px);
box-shadow: 3px 4px 10px #6e757a;
/*头像旋转自行开启*/
/*transform: rotate(1turn);*/
}
/*举报*/
.am-modal-dialog{
opacity:.9;
border-radius:10px !important;
}
input.am-modal-prompt-input{
border-radius:10px !important;
}
.am-selected-content.am-dropdown-content{
border-radius:15px !important;
}
.am-modal-dialog > .am-modal-footer > .am-modal-btn{
transition:all .4s ease;
}
.am-modal-dialog > .am-modal-footer > .am-modal-btn[data-am-modal-cancel] {
border-radius: 0px 0px 0px 10px;
}
.am-modal-dialog > .am-modal-footer > .am-modal-btn[data-am-modal-confirm] {
border-radius: 0px 0px 10px 0px;
}
.am-modal-dialog > .am-modal-footer > .am-modal-btn:hover{
background: #2bb0e5;
color:#fff;
}
.am-modal-footer{
border-radius:0px 0px 10px 10px;
}
/*按钮*/
.am-btn.am-btn-danger.am-btn-sm {
transition:all .5s ease;
background: #ff416c;
/* fallback for old browsers */
background: -webkit-linear-gradient(to right, rgb(255, 65, 108), rgb(255, 75, 43));
/* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to right, rgb(255, 65, 108), rgb(255, 75, 43));
/* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
border: 1px !important;
box-shadow:1px 1px 3px #00000070;
}
.am-btn.am-btn-danger.am-btn-sm:hover {
transform:translateY(-1px);
box-shadow:1px 1px 15px #00000070;
}
.am-btn.am-btn-primary.am-btn-sm {
transition:all .5s ease;
background: #7f7fd5;
border: 0px !important;
box-shadow:1px 1px 3px #00000070;
}
.am-btn.am-btn-primary.am-btn-sm:hover {
transform:translateY(-1px);
box-shadow:1px 1px 15px #00000070;
}
.am-btn.am-btn-success.am-btn-sm {
transition:all .5s ease;
background: #b993d6;
border: 0px !important;
box-shadow:1px 1px 3px #00000070;
}
.am-btn.am-btn-success.am-btn-sm:hover {
transform:translateY(-1px);
box-shadow:1px 1px 15px #00000070;
}
.am-input-group-label{
transition:all .5s ease;
border: 0px !important;
border-radius:10px;
box-shadow:1px 1px 3px #00000070;
}
/*样例*/
pre[data-v-52f2d52f] {
transition:all .4s ease;
border-radius:10px;
box-shadow: 0px 0px 1px #00000070;
}
pre[data-v-52f2d52f]:hover {
border-radius:15px;
box-shadow: 0px 0px 1px #00000070;
}
/*提交*/
.lfe-form-sz-middle[data-v-7ade990c] {
transition: all .45s ease;
border-radius: 10px;
}
.button-in-anchor.lfe-form-sz-middle[data-v-cc52fb5c] {
transition: all .45s ease;
border-radius: 10px;
}
.lfe-form-sz-middle[data-v-7ade990c]:hover {
transform: translateY(-3px);
border-radius: 99px;
}
.button-in-anchor.lfe-form-sz-middle[data-v-cc52fb5c]:hover {
transform: translateY(-3px);
border-radius: 99...