You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
RnQ/Distro/Template/main.css

344 lines
6.6 KiB
CSS

body {
flow: vertical;
overflow: hidden;
padding: 6dip;
margin: 0;
border-spacing: 2dip;
background-image: url(themepic:wallpaper);
background-color: #FFF;
background-repeat: repeat;
font-family: "Verdana", "Arial", "Tahoma";
font-size: 10pt;
font-rendering-mode: snap-pixel;
image-rendering: optimize-quality;
//height: max-content;
}
a, a:visited {
text-decoration: none;
color: #283593;
}
a:hover, a:focus {
text-decoration: underline;
}
.imgbtn.filterbtn {
position: absolute;
right: 1dip;
top: 0;
}
.imgbtn .emoji {
font-size: 9pt;
font-rendering-mode: sub-pixel;
}
:disabled .imgbtn {
opacity: 1;
}
#bar {
flow: horizontal;
}
#additional {
margin: * 0 * 3dip;
}
#progress {
position: relative;
size: *;
}
#progress.moving:hover {
cursor: move;
}
#pslider {
display: block;
width: *;
height: 18dip;
margin-top: *;
margin-bottom: *;
margin-left: 3dip;
appearance: none;
background-color: transparent;
border-radius: 0;
border: none;
}
#pslider::marker {
appearance: none;
background-color: #cccccc;
}
#pvalue,
#ccount {
position: absolute;
padding: 0;
top: 3dip;
font: system;
font-size: 9pt;
}
#pvalue {
left: 6dip;
}
#ccount {
right: 3dip;
color: #333333;
}
#filter {
position: relative;
}
#clfilter {
width: *;
height: 16dip;
}
#cl {
appearance: none;
display: block;
size: *;
font-rendering-mode: snap-pixel;
background-color: transparent;
background-image: none;
padding: 0;
margin: 0;
scroll-manner: scroll-manner(animation: false);
}
#cl option,
#cl option caption {
width: *;
max-width: auto;
min-height: 1.35em;
line-height: 1.35em;
padding: 0;
margin: 0;
foreground-image: none;
text-selection: #fff @activeColor;
}
#cl option:not(:node):hover,
#cl option:not(:node):current:hover,
#cl option:node > text:hover,
#cl option:node > caption:hover,
#cl option:node:current > text:hover,
#cl option:node:current > caption:hover {
background: #DEDEDE7F;
}
#cl option:current,
#cl option:current > caption {
background-image: none;
background-color: transparent;
transition: background-color 0.1s cubic-out;
}
html:owns-focus #cl option:current > caption {
background-color: #E2E2E2 !important;
}
#cl option.divisor > caption {
flow: horizontal;
text-align: center;
color: #999;
font-size: 11dip;
padding: 2dip 0;
margin-top: 1dip;
margin-bottom: 1dip;
border-spacing: 3dip;
}
#cl option.divisor:first-child > caption {
margin-top: 0;
}
#cl option.divisor option {
color: #333333;
transition: color 0.15s cubic-out;
}
#cl option.divisor option.contact[status=1],
#cl option.divisor option.contact[status=2],
#cl option.divisor option.group {
color: #606060;
transition: color 0.1s cubic-out;
}
html:owns-focus #cl option.divisor option.contact:current {
color: #000000 !important;
}
html:owns-focus #cl option.divisor option.group:current {
color: #333333 !important;
}
#cl.onlineOnly option.divisor[div="1"] {
display: none;
}
#cl option.group {
overflow: hidden;
}
#cl option.group.acceptcontact {
background-color: @activeColorHover;
outline: @activeColor dotted 1dip -1dip;
}
#cl option.group.acceptgrouptop {
border-top: 1dip dotted @activeColor;
padding-top: -2dip;
margin-top: 1dip;
}
#cl option.group.acceptgroupbottom {
border-bottom: 1dip dotted @activeColor;
margin-bottom: -1dip;
}
#cl option.group > caption {
display: block;
flow: horizontal;
padding: 1dip 4dip 1dip 1dip;
vertical-align: middle;
font-size: 9pt;
font-weight: bold;
}
#cl option.group > caption .icon {
background-repeat: no-repeat;
margin: 0 2dip 2dip 1dip;
}
#cl option.group > caption .title {
white-space: pre;
}
#cl option.group.editing > caption .title {
behavior: edit;
flow: text;
outline: #999 dotted 1dip;
}
#cl option.group > caption .count {
margin: 0 0 1dip 5dip;
font-weight: normal;
font-size: 7.5pt;
line-height: 7.5pt;
}
//#cl.animated option.group:expanded > option.contact > caption {
// transform: translate(0, 0);
//}
//#cl.animated option.group:expanded > option.contact.unloaded > caption {
// transform: translate(0, -3dip);
// transition: transform(cubic-out, 0.15s, quad-out, 0.15s);
//}
#cl option.filtered {
display: none !important;
}
#cl option.contact {
height: 18dip;
}
#cl option.contact > caption {
display: block;
flow: horizontal;
padding: 0 4dip;
border-spacing: 2dip;
vertical-align: middle;
}
#cl option.contact.hidden > * {
display: none !important;
}
#cl option.contact > caption > *:first-child {
margin-left: 0 !important;
}
#cl option.contact > caption > *:last-child {
margin-right: 0 !important;
}
#cl option.divisor > option.contact > caption {
padding-left: 4dip !important;
}
#cl.groupPadding option.contact > caption {
padding-left: 20dip;
}
//#cl option.group > caption > *,
//#cl option.contact > caption > * {
// margin-top: 1*;
// margin-bottom: 1*;
//}
#cl option.contact > caption div {
width: max-content;
}
#cl option.contact > caption div.displayed {
width: *;
overflow-x: hidden;
white-space: pre;
text-overflow: ellipsis;
margin-left: 4dip;
margin-right: 4dip;
}
#cl option.contact > caption div.displayed.noclient {
font-style: italic;
}
#cl option.contact.editing > caption div.displayed {
behavior: edit;
flow: text;
outline: #999999 dotted 1dip;
}
#cl option.contact > caption div.client {
margin-left: 4dip;
margin-right: 4dip;
}
#cl option.contact > caption img.avatar {
foreground-size: contain;
max-width: 16dip;
max-height: 16dip;
margin-left: 4dip;
margin-right: 4dip;
//overflow: visible;
}
#cl option.contact > caption img.avatar:incomplete,
#cl option.contact > caption img.avatar.hidden {
display: none;
}
#cl option.contact > caption div.status {
position: relative;
overflow: hidden;
opacity: 1;
}
#cl.eventblink option.contact > caption div.status.blinking {
transition: opacity 0.15s linear;
}
#cl.eventblink option.contact > caption div.status.blinking:expanded {
opacity: 0 !important;
}
#cl.statusblink option.contact > caption div.status.blinking {
transition: blend 0.2s cubic-out;
}
#cl option.contact > caption div.xstatus {
size: 16dip;
padding: 0;
overflow: hidden;
text-align: center;
vertical-align: middle;
}
#cl option.contact > caption div.official {
position: absolute;
bottom: -3dip;
right: -4dip;
}
#cl option.contact > caption div.bot {
position: absolute;
bottom: -3dip;
right: -4dip;
}
#cl option.contact > caption div.deleted {
position: absolute;
bottom: -3dip;
right: -4dip;
}
#cl option.group > caption div.local {
margin-left: 2dip;
margin-right: 2dip;
}
.fineline {
display: inline-block;
width: *;
height: 1dip;
margin-top: *;
margin-bottom: *;
background-color: #ccc;
border: none;
}
.collapsed {
visibility: collapse;
}