社区讨论

发布,UI 夜视·洛谷。

灌水区参与者 17已保存回复 33

讨论操作

快速查看讨论及其快照的属性,并进行相关操作。

当前回复
33 条
当前快照
1 份
快照标识符
@mi6vvr3a
此快照首次捕获于
2025/11/20 11:40
4 个月前
此快照最后确认于
2025/11/20 16:50
4 个月前
查看原帖

UI 夜视·洛谷


介绍

  • UI 夜视·洛谷:专门针对洛谷3的一个CSS样式;
  • 版本信息:alpha1.0
  • 制作目的:,主要功能是为了保护眼睛(大雾.其实是看到同学用了好看的模板,自己找不到,然后花了一晚上自学了一下CSS,搞出来的弱鸡成果.大概洛谷出4的时候这个就凉了.
  • 功能:将洛谷的页面的静态部分改成夜间模式(辣鸡楼主还没有学到JS
  • 后续版本:在下一个整数版本之前不再维护更新.

效果预览

  • 主页
  • 题库
  • 题目

支持要求

  • firefox浏览器,支持HTML5
  • 洛谷3

使用教程

  1. 下载插件
  2. 复制粘贴源码
  3. 把适用范围改成以"http://www.luogu.org"为前缀的网址.

下载

插件stylus下载地址https://add0n.com/stylus.html
CSS源码:
JAVASCRIPT
body {
    
    background-color:#000000;
    color:#000;
    padding:0;
    margin:0;
    font-family: Verdana, sans-serif;
}

.lg-content{
    background-color:#000;
    background-repeat:no-repeat;
    background-position:center;     
    background-image:url('https://img-blog.csdn.net/20180814103342809?watermark/2/text/aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM1NzAzNzcz/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70'); 
    background-attachment:fixed;
}

.lg-article{
    background-color:#222222;
    color:#aaaaaa;
    opacity:0.8;
}

.am-panel{
    background-color:#222222;
    color:#aaaaaa;
    opacity:0.8;
}

.lg-table-bg0.lg-table-row.am-g{
    background-color:#222222;
    color:#aaaaaa;
    opacity:0.8;
}

a{
    color:#00ffff;
}

.am-progress{
    background-color:#000;
}

.am-progress-bar-secondary{
    background-color:#666666;
    color:#000;
}

.lg-bg-orange{
    background-color:#000;
    color:#e67e22;
}

.lg-bg-red{
    background-color:#000;
    color:#e74c3c;
}

.lg-bg-green{
    background-color:#000;
    color:#5eb95e;;
}

.lg-bg-bluelight{
    background-color:#000;
    color:#3498db;
}

.lg-bg-yellow{
    background-color:#000;
    color:#f1c40f;
}

.lg-bg-purple{
    background-color:#000;
    color:#8e44ad;
}

.lg-bg-bluedark{
    background-color:#000;
    color:#2E468C;
}

.am-u-sm-6.lg-fg-red{
    color:#ff6699 !important;
}

.lg-fg-green{
    color:#00eebb !important;
}

.am-panel-primary{
    border-color:#00ffff;
}

.lg-bold{
    color:#00aaaa;
}

.am-topbar-collapse,.lg-header-li{
    background-color:#555555;
}

.am-u-sm-6{
    color:#aaa;
}

.lg-header-list li{
    background-color:#555 !important;
}

.lg-toolbar,.am-sticky-placeholder{
    background-color:#222;
    border-color:#222
}

.am-input-group-label a{
    background-color:#222;
}

.am-sticky-placeholder{
    background-color:#222 !important;
}

pre{
    background-color:#333;
    color : #fff;
}

.am-btn-sm{
    background-color:#000000;
}

#lg-tag-result{
    background-color:#222222;
}

h1{
    color:#ccc;
}

.lg-sidebar-list li{
    background-color:#333 !important;
}

.lg-rail-sidebar{
    background-color:#111;
}

#topbar-search-text{
    background-color:#111;
}

[type="text"]{
    background-color:#111 !important;
}

.am-panel-success > .am-panel-hd{
    color:#000;
    background-color:#00aa99;
}

.am-panel-danger > .am-panel-hd{
    color:#000;
    background-color:#cc3322;
}

.am-comment-hd{
    background-color:#555;
}

.am-comment-bd{
    background-color:#111;
}

.feed-comment p{
    color:#aaa;
}

.highcharts-color-0{
    fill:#aaa;
}

.highcharts-area{
    fill:#111;
}

.highcharts-color-1 {
    fill:#000;
    opacity:0.8;
}

.am-comment-bd p,ol,h1,h2,h3,h4,h5,h6{
    color:#aaa;
}

.am-pagination-centered a{
    color:#aaa;
}

.highcharts-tracker{
    stroke:#00aaaa;
    opacity:0.6;
    stroke-width:10;
}

代码阅读指南

不要阅读,写得太丑。
也不要试图去阅读洛谷的HTML源码

Copyright

可以任意复制修改与非商业化发行,可以不用注明出处.
made by bzy

回复

33 条回复,欢迎继续交流。

正在加载回复...