1083ed03ff
FossilOrigin-Name: 0c144ea23f1d0d1490b28492433fcd03032c19070c5826af5ee3583a1cd5c2f4
501 lines
7.3 KiB
CSS
501 lines
7.3 KiB
CSS
:root
|
|
{
|
|
--account-overlay-gradient-top: rgba(50, 50, 50, 0.6);
|
|
--account-overlay-gradient-bottom: #303030;
|
|
}
|
|
|
|
/* Dark color overrides */
|
|
html
|
|
{
|
|
background-color: #202020;
|
|
}
|
|
|
|
body
|
|
{
|
|
color: #fcfcfc;
|
|
}
|
|
|
|
#main-page
|
|
{
|
|
border: 1px solid rgba(60, 60, 60, 0.8);
|
|
}
|
|
|
|
#navbar
|
|
{
|
|
border-top: 2px solid #4e4e4e;
|
|
background: linear-gradient(#3e3e3e, #262626);
|
|
border-bottom: 1px solid #101010;
|
|
}
|
|
|
|
a, a:visited, a:hover, a:active
|
|
{
|
|
color: #eaeaea;
|
|
}
|
|
|
|
#navbar img
|
|
{
|
|
filter: contrast(0);
|
|
}
|
|
|
|
.navbar-btn
|
|
{
|
|
stroke: #aaa;
|
|
}
|
|
|
|
#navbar span.info
|
|
{
|
|
color: #aaa;
|
|
}
|
|
|
|
.mini-links a,
|
|
.mini-links .bullet-separate
|
|
{
|
|
color: #606060;
|
|
}
|
|
|
|
.sidebar
|
|
{
|
|
background-color: rgba(34, 34, 34, var(--sidebar-opacity));
|
|
}
|
|
|
|
.btn
|
|
{
|
|
background: linear-gradient(#303030, #252525);
|
|
color: #bbb;
|
|
text-decoration: none;
|
|
padding: 6px 12px;
|
|
}
|
|
|
|
#main
|
|
{
|
|
background-color: #202020;
|
|
}
|
|
|
|
.btn:hover,
|
|
.btn:active,
|
|
.btn-menu:hover,
|
|
.sidebarbtn:hover
|
|
{
|
|
background: linear-gradient(#424242, #363636);
|
|
color: #fff;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.sidebarbtn
|
|
{
|
|
border: 1px solid transparent;
|
|
}
|
|
|
|
.sidebarbtn:hover
|
|
{
|
|
border: 1px solid #505050;
|
|
}
|
|
|
|
.sidebarbtn, .sidebarbtn:visited
|
|
{
|
|
color: #808080;
|
|
}
|
|
|
|
#leftbar, #rightbar
|
|
{
|
|
border-color: #333;
|
|
}
|
|
|
|
.btn.active
|
|
{
|
|
background: linear-gradient(#606060, #d3d3d3);
|
|
box-shadow: inset 0px -2px 5px rgba(0, 0, 0, 0.2);
|
|
color: #fff;
|
|
text-shadow: 0px 1px 2px rgba(0, 0, 0, 0.4);
|
|
}
|
|
|
|
|
|
.btn-alt.active,
|
|
.btn-alt:active
|
|
{
|
|
background: linear-gradient(#ee0000, #aa0000);
|
|
border-color: #800000;
|
|
}
|
|
|
|
.btn-alt:hover
|
|
{
|
|
background: linear-gradient(#aa0000, #ee0000);
|
|
}
|
|
|
|
.statusbox
|
|
{
|
|
background-color: #303030;
|
|
border-color: #606060;
|
|
}
|
|
|
|
.menubar
|
|
{
|
|
background: linear-gradient(#404040, #303030);
|
|
border-color: #505050;
|
|
}
|
|
|
|
.statusbox textarea,
|
|
input[type=text]
|
|
{
|
|
background-color: #444;
|
|
border-color: #666;
|
|
color: #fff;
|
|
}
|
|
|
|
.status.focused,
|
|
.status:target
|
|
{
|
|
padding-left: 7px;
|
|
background-color: #371b1b;
|
|
border-left: 3px solid #aa0000;
|
|
}
|
|
|
|
input[type=submit]
|
|
{
|
|
border-color: #666;
|
|
}
|
|
|
|
select
|
|
{
|
|
background: linear-gradient(#555, #404040);
|
|
color: #ccc;
|
|
border-color: #666;
|
|
}
|
|
|
|
select:hover
|
|
{
|
|
background: linear-gradient(#666, #505050);
|
|
}
|
|
|
|
.account-sidebar
|
|
{
|
|
background-color: #404040;
|
|
border-bottom: 1px dashed #505050;
|
|
}
|
|
|
|
.header-btn
|
|
{
|
|
background: unset;
|
|
}
|
|
|
|
.header-btn span,
|
|
.header-btn .btn-header,
|
|
.header-btn .btn-content,
|
|
.username
|
|
{
|
|
color: #dadada;
|
|
}
|
|
|
|
.status-interact svg
|
|
{
|
|
stroke: #aaa;
|
|
}
|
|
|
|
.status .instance-info
|
|
{
|
|
color: #aaa;
|
|
}
|
|
|
|
.poster-stats .alignend
|
|
{
|
|
background-color: #202020;
|
|
}
|
|
|
|
.status-view
|
|
{
|
|
background-color: #404040;
|
|
border: 1px solid #505050;
|
|
}
|
|
|
|
.menu
|
|
{
|
|
background-color: #454545;
|
|
color: #ddd;
|
|
border-color: #585858;
|
|
}
|
|
|
|
.menu .btn-menu
|
|
{
|
|
color: #ddd;
|
|
}
|
|
|
|
.menu .btn-menu:hover
|
|
{
|
|
box-shadow: 0px 0px 0px 1px #505050;
|
|
}
|
|
|
|
.time
|
|
{
|
|
color: #6a6a6a;
|
|
}
|
|
|
|
.status
|
|
{
|
|
border-color: #454545;
|
|
}
|
|
|
|
.in-reply-to svg
|
|
{
|
|
stroke: #8c8c8c;
|
|
}
|
|
|
|
.in-reply-to, .in-reply-to a
|
|
{
|
|
color: #8c8c8c;
|
|
}
|
|
|
|
.group-inputbox
|
|
{
|
|
border-color: #707070;
|
|
}
|
|
|
|
#instance-panel
|
|
{
|
|
background: repeating-linear-gradient(-45deg, transparent, transparent 10px, #303030 10px, #303030 20px);
|
|
border-top: 1px dashed #505050;
|
|
border-bottom: 1px dashed #505050;
|
|
}
|
|
|
|
ul.large-list
|
|
{
|
|
border: 1px solid #404040;
|
|
}
|
|
|
|
.lists-view-container ul li:not(:last-child)
|
|
{
|
|
border-bottom: 1px solid #505050;
|
|
}
|
|
|
|
ul.large-list li .edit-list-btn
|
|
{
|
|
background: linear-gradient(#606060, #505050);
|
|
color: #fff;
|
|
border-left: 1px solid #404040;
|
|
}
|
|
|
|
.list-edit-content
|
|
{
|
|
background-color: #404040;
|
|
border-top: #404040;
|
|
}
|
|
|
|
.static.focused .poster-stats .alignend, .status:target .poster-stats .alignend
|
|
{
|
|
background-color: #371b1b;
|
|
}
|
|
|
|
.statusbox .post-group input[type=radio].hidden:checked + .visibility-icon svg
|
|
{
|
|
stroke: #fff;
|
|
}
|
|
|
|
.statusbox .post-group .visibility-icon:hover
|
|
{
|
|
background-color: #4f4f4f;
|
|
}
|
|
|
|
.emoji-react-box
|
|
{
|
|
border: 1px solid #515151;
|
|
padding: 3px 7px;
|
|
}
|
|
|
|
.sidebarbtn-sub
|
|
{
|
|
color: unset;
|
|
}
|
|
|
|
|
|
#leftbar ul.sidebar-config
|
|
{
|
|
background: linear-gradient(#303030, #202020);
|
|
color: #cacaca;
|
|
border-radius: 6px;
|
|
padding: 4px;
|
|
margin: 8px;
|
|
border: 1px solid #505050;
|
|
box-shadow: inset 0px 2px 3px rgba(0, 0, 0, 0.1);
|
|
}
|
|
|
|
.sidebarbtn-sub:active, .sidebarbtn-sub:hover
|
|
{
|
|
background-color: #505050;
|
|
box-shadow: 0px 1px 0px #606060;
|
|
}
|
|
|
|
input[type=submit].post-btn
|
|
{
|
|
|
|
background: linear-gradient(#404040, #303030);
|
|
border: 1px solid #505050;
|
|
}
|
|
|
|
input[type=submit].post-btn:hover
|
|
{
|
|
|
|
background: linear-gradient(#505050, #404040);
|
|
border: 1px solid #505050;
|
|
}
|
|
|
|
.notification-compact
|
|
{
|
|
scrollbar-color: #404040 transparent;
|
|
}
|
|
|
|
.notification-compact .notification-content.is-mention
|
|
{
|
|
color: #f3f3f3;
|
|
}
|
|
|
|
.notification
|
|
{
|
|
border-bottom: 1px solid #505050;
|
|
width: 100%;
|
|
}
|
|
|
|
.sidebar-embed-container .navigation
|
|
{
|
|
background-color: rgba(60, 62, 64, .5);
|
|
}
|
|
|
|
.navigation tr td:not(:last-child), .tabs tr td:not(:last-child)
|
|
{
|
|
border-right: 1px solid #606060;
|
|
}
|
|
|
|
.navigation, .tabs
|
|
{
|
|
box-shadow: 0px 1px 0px #606060;
|
|
}
|
|
|
|
input[type=range] {
|
|
-webkit-appearance: none;
|
|
appearance: none;
|
|
height: 12px;
|
|
background: linear-gradient(#404040, #303030);
|
|
border: 1px solid #505050;
|
|
border-radius: 4px;
|
|
outline: none;
|
|
vertical-align: middle;
|
|
}
|
|
|
|
input[type=range]::-webkit-slider-thumb,
|
|
input[type=range]::-moz-range-thumb
|
|
{
|
|
-webkit-appearance: none;
|
|
appearance: none;
|
|
width: 20px;
|
|
height: 20px;
|
|
border: 1px solid #303236;
|
|
background: linear-gradient(#75777c, #505256);
|
|
cursor: pointer;
|
|
}
|
|
|
|
/* Accounts */
|
|
.acct-header
|
|
{
|
|
z-index: 1;
|
|
padding-left: 160px;
|
|
background: linear-gradient(#505053, #303033);
|
|
border-bottom: 1px solid #202020;
|
|
background-color: #e8e8e8;
|
|
}
|
|
|
|
.account-info
|
|
{
|
|
background: linear-gradient(#28282b, #37373a);
|
|
border-bottom: 1px solid #202020;
|
|
color: #cacaca;
|
|
}
|
|
|
|
.tabs .tab-btn:hover, .tabs .tab-btn:active
|
|
{
|
|
background: linear-gradient(#404040, #303032);
|
|
}
|
|
|
|
.tabs .tab-btn.active, .tabs .tab-btn:checked
|
|
{
|
|
color: #eee;
|
|
background: linear-gradient(#505052, #404045);
|
|
}
|
|
|
|
.tabs .tab-btn
|
|
{
|
|
color: #808080;
|
|
border-bottom: 2px solid #303030;
|
|
}
|
|
|
|
.btn-disabled, .btn-disabled:hover
|
|
{
|
|
background: #252525;
|
|
color: #606060;
|
|
}
|
|
|
|
.header-btn:hover, .header-btn:active
|
|
{
|
|
background: linear-gradient(#5c5c5c,#444);
|
|
}
|
|
|
|
html, body {
|
|
scrollbar-color: #303030 #101010;
|
|
}
|
|
|
|
.file-uploads-container .file-upload
|
|
{
|
|
overflow: hidden;
|
|
display: inline-block;
|
|
width: 200px;
|
|
margin: 2px 4px;
|
|
background: linear-gradient(#, #f7f7f7);
|
|
border: 1px solid #606060;
|
|
box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.2);
|
|
border-radius: 4px;
|
|
}
|
|
|
|
.file-upload .upload-info {
|
|
background: linear-gradient(#202020, #101010);
|
|
border-top: 1px solid #505050;
|
|
color: #ccc;
|
|
}
|
|
|
|
.btn-icon
|
|
{
|
|
border: 1px solid #5f6376;
|
|
background-color: #757991;
|
|
text-align: middle;
|
|
vertical-align: middle;
|
|
border-radius: 3px;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.btn-icon svg
|
|
{
|
|
stroke: #ddd;
|
|
}
|
|
|
|
.btn-icon:hover
|
|
{
|
|
background-color: #696d82;
|
|
}
|
|
|
|
.btn-icon:active
|
|
{
|
|
background-color: #4e5161;
|
|
}
|
|
|
|
.nav-symbol
|
|
{
|
|
color: #aaa;
|
|
}
|
|
|
|
.account-sidebar
|
|
{
|
|
border-bottom: 1px solid #404040;
|
|
}
|
|
|
|
.account-sidebar .acct-info .acct
|
|
{
|
|
color: #ababab;
|
|
}
|
|
|
|
|