feature: watches on the backend, need frontend implementation for
notifications and unread indicators
This commit is contained in:
parent
7046bb0389
commit
6293374bb7
28 changed files with 1405 additions and 608 deletions
182
public/base.css
182
public/base.css
|
|
@ -6,6 +6,8 @@
|
|||
--bg-darker: hsl(from var(--base-color) h 20% 5%);
|
||||
--bg-lighter: hsl(from var(--base-color) h 20% 10%);
|
||||
|
||||
--blur-radius: 8px;
|
||||
|
||||
--text: hsl(from var(--base-color) h 5% 100%);
|
||||
--accent: hsl(from var(--base-color) h clamp(0, calc(s + 10), 100) clamp(0, calc(l + 20), 100));
|
||||
|
||||
|
|
@ -98,7 +100,7 @@ select {
|
|||
font-size: inherit;
|
||||
}
|
||||
|
||||
details > summary {
|
||||
details>summary {
|
||||
display: block;
|
||||
position: relative;
|
||||
padding-left: 2rem;
|
||||
|
|
@ -106,7 +108,7 @@ details > summary {
|
|||
user-select: none;
|
||||
}
|
||||
|
||||
details > summary:before {
|
||||
details>summary:before {
|
||||
content: "";
|
||||
border-width: 0.6rem;
|
||||
border-style: solid;
|
||||
|
|
@ -119,11 +121,11 @@ details > summary:before {
|
|||
transition: 0.25s transform ease;
|
||||
}
|
||||
|
||||
details[open] > summary:before {
|
||||
details[open]>summary:before {
|
||||
transform: rotate(90deg);
|
||||
}
|
||||
|
||||
details > summary::-webkit-details-marker {
|
||||
details>summary::-webkit-details-marker {
|
||||
display: none;
|
||||
}
|
||||
|
||||
|
|
@ -163,7 +165,22 @@ body {
|
|||
background-color: var(--bg);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: 100vh; /* fixed height? */
|
||||
height: 100vh;
|
||||
/* fixed height? */
|
||||
}
|
||||
|
||||
main {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: grid;
|
||||
grid-template-columns: auto 1fr;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 1200px) {
|
||||
main {
|
||||
grid-template-columns: auto;
|
||||
}
|
||||
}
|
||||
|
||||
input[type="text"]:focus,
|
||||
|
|
@ -240,13 +257,11 @@ textarea:focus {
|
|||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
background: repeating-linear-gradient(
|
||||
-55deg,
|
||||
rgba(0, 0, 0, 0.25) 0px,
|
||||
rgba(0, 0, 0, 0.25) 20px,
|
||||
rgba(255, 177, 1, 0.25) 20px,
|
||||
rgba(255, 177, 1, 0.25) 40px
|
||||
);
|
||||
background: repeating-linear-gradient(-55deg,
|
||||
rgba(0, 0, 0, 0.25) 0px,
|
||||
rgba(0, 0, 0, 0.25) 20px,
|
||||
rgba(255, 177, 1, 0.25) 20px,
|
||||
rgba(255, 177, 1, 0.25) 40px);
|
||||
}
|
||||
|
||||
.collapsed {
|
||||
|
|
@ -268,15 +283,15 @@ label:has(input[collapse-toggle]) {
|
|||
margin-bottom: 2rem;
|
||||
}
|
||||
|
||||
input[collapse-toggle] + .collapsible,
|
||||
label:has(input[collapse-toggle]) + .collapsible {
|
||||
input[collapse-toggle]+.collapsible,
|
||||
label:has(input[collapse-toggle])+.collapsible {
|
||||
transition: all 0.33s;
|
||||
height: 0;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
input[collapse-toggle]:checked + .collapsible,
|
||||
label:has(input[collapse-toggle]:checked) + .collapsible {
|
||||
input[collapse-toggle]:checked+.collapsible,
|
||||
label:has(input[collapse-toggle]:checked)+.collapsible {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
|
|
@ -300,8 +315,8 @@ form label.placeholder {
|
|||
font-size 0.2s ease-in-out;
|
||||
}
|
||||
|
||||
form input:focus ~ label.placeholder,
|
||||
form input:valid ~ label.placeholder {
|
||||
form input:focus~label.placeholder,
|
||||
form input:valid~label.placeholder {
|
||||
top: -1.6rem;
|
||||
font-size: small;
|
||||
border: 1px solid rgba(128, 128, 128, 0.2);
|
||||
|
|
@ -444,11 +459,7 @@ body[data-perms*="files.write.own"] [data-requires-permission="files.write.own"]
|
|||
max-width: 800px;
|
||||
}
|
||||
|
||||
.audio-container
|
||||
.audio-controls-container
|
||||
.progress-container
|
||||
.slider-container
|
||||
input[name="progress"] {
|
||||
.audio-container .audio-controls-container .progress-container .slider-container input[name="progress"] {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
|
|
@ -469,6 +480,7 @@ body[data-perms*="files.write.own"] [data-requires-permission="files.write.own"]
|
|||
max-width: 100px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 480px) {
|
||||
.audio-container .audio-controls-container .blank {
|
||||
width: auto;
|
||||
|
|
@ -480,13 +492,18 @@ body[data-perms*="files.write.own"] [data-requires-permission="files.write.own"]
|
|||
}
|
||||
|
||||
.audio-container .audio-controls-container input[type="range"] {
|
||||
--c: var(--accent); /* active color */
|
||||
--g: 4px; /* the gap */
|
||||
--l: 2px; /* line thickness*/
|
||||
--s: 15px; /* thumb size*/
|
||||
--c: var(--accent);
|
||||
/* active color */
|
||||
--g: 4px;
|
||||
/* the gap */
|
||||
--l: 2px;
|
||||
/* line thickness*/
|
||||
--s: 15px;
|
||||
/* thumb size*/
|
||||
|
||||
width: 100%;
|
||||
height: var(--s); /* needed for Firefox*/
|
||||
height: var(--s);
|
||||
/* needed for Firefox*/
|
||||
--_c: color-mix(in srgb, var(--c), #000 var(--p, 0%));
|
||||
-webkit-appearance: none;
|
||||
-moz-appearance: none;
|
||||
|
|
@ -495,26 +512,29 @@ body[data-perms*="files.write.own"] [data-requires-permission="files.write.own"]
|
|||
cursor: pointer;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.audio-container .audio-controls-container input[type="range"]:focus-visible,
|
||||
.audio-container .audio-controls-container input[type="range"]:hover {
|
||||
--p: 25%;
|
||||
}
|
||||
|
||||
.audio-container .audio-controls-container input[type="range"]:active,
|
||||
.audio-container .audio-controls-container input[type="range"]:focus-visible {
|
||||
--_b: var(--s);
|
||||
}
|
||||
|
||||
/* chromium */
|
||||
.audio-container .audio-controls-container input[type="range"]::-webkit-slider-thumb {
|
||||
height: var(--s);
|
||||
aspect-ratio: 1;
|
||||
border-radius: 50%;
|
||||
box-shadow: 0 0 0 var(--_b, var(--l)) inset var(--_c);
|
||||
border-image: linear-gradient(90deg, var(--_c) 50%, #ababab 0) 0 1 / calc(50% - var(--l) / 2)
|
||||
100vw/0 calc(100vw + var(--g));
|
||||
border-image: linear-gradient(90deg, var(--_c) 50%, #ababab 0) 0 1 / calc(50% - var(--l) / 2) 100vw/0 calc(100vw + var(--g));
|
||||
-webkit-appearance: none;
|
||||
appearance: none;
|
||||
transition: 0.2s;
|
||||
}
|
||||
|
||||
/* Firefox */
|
||||
.audio-container .audio-controls-container input[type="range"]::-moz-range-thumb {
|
||||
height: var(--s);
|
||||
|
|
@ -522,12 +542,12 @@ body[data-perms*="files.write.own"] [data-requires-permission="files.write.own"]
|
|||
background: none;
|
||||
border-radius: 50%;
|
||||
box-shadow: 0 0 0 var(--_b, var(--l)) inset var(--_c);
|
||||
border-image: linear-gradient(90deg, var(--_c) 50%, #ababab 0) 0 1 / calc(50% - var(--l) / 2)
|
||||
100vw/0 calc(100vw + var(--g));
|
||||
border-image: linear-gradient(90deg, var(--_c) 50%, #ababab 0) 0 1 / calc(50% - var(--l) / 2) 100vw/0 calc(100vw + var(--g));
|
||||
-moz-appearance: none;
|
||||
appearance: none;
|
||||
transition: 0.2s;
|
||||
}
|
||||
|
||||
@supports not (color: color-mix(in srgb, red, red)) {
|
||||
.audio-container .audio-controls-container input[type="range"] {
|
||||
--_c: var(--c);
|
||||
|
|
@ -547,6 +567,7 @@ body[data-perms*="files.write.own"] [data-requires-permission="files.write.own"]
|
|||
opacity: 1;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.audio-container .audio-controls-container .audio-control .icon.pause {
|
||||
opacity: 0;
|
||||
display: none;
|
||||
|
|
@ -556,11 +577,24 @@ body[data-perms*="files.write.own"] [data-requires-permission="files.write.own"]
|
|||
opacity: 0;
|
||||
display: none;
|
||||
}
|
||||
|
||||
.audio-container[data-playing] .audio-controls-container .audio-control .icon.pause {
|
||||
opacity: 1;
|
||||
display: block;
|
||||
}
|
||||
|
||||
/* === GLOW EFECTO === from: https://codepen.io/andrewuru/pen/Byjdgrb */
|
||||
.glow {
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
background: radial-gradient(circle at var(--x, 50%) var(--y, 50%),
|
||||
hsla(var(--accent), 100%, 60%, 0.4),
|
||||
transparent 70%);
|
||||
mix-blend-mode: screen;
|
||||
pointer-events: none;
|
||||
filter: blur(calc(2 * var(--blur-radius)));
|
||||
}
|
||||
|
||||
.html-from-markdown {
|
||||
padding: 2em;
|
||||
}
|
||||
|
|
@ -597,6 +631,7 @@ body[data-perms*="files.write.own"] [data-requires-permission="files.write.own"]
|
|||
transform: scale(var(--icon-scale, 1));
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.icon.add::after,
|
||||
.icon.add::before {
|
||||
content: "";
|
||||
|
|
@ -610,6 +645,7 @@ body[data-perms*="files.write.own"] [data-requires-permission="files.write.own"]
|
|||
top: 8px;
|
||||
left: 4px;
|
||||
}
|
||||
|
||||
.icon.add::after {
|
||||
width: 2px;
|
||||
height: 10px;
|
||||
|
|
@ -631,6 +667,7 @@ body[data-perms*="files.write.own"] [data-requires-permission="files.write.own"]
|
|||
transform: scale(var(--icon-scale, 1));
|
||||
margin-top: 11px;
|
||||
}
|
||||
|
||||
.icon.attachment::after,
|
||||
.icon.attachment::before {
|
||||
content: "";
|
||||
|
|
@ -640,6 +677,7 @@ body[data-perms*="files.write.own"] [data-requires-permission="files.write.own"]
|
|||
border-radius: 3px;
|
||||
border: 2px solid;
|
||||
}
|
||||
|
||||
.icon.attachment::after {
|
||||
border-bottom: 0;
|
||||
border-top-left-radius: 100px;
|
||||
|
|
@ -649,6 +687,7 @@ body[data-perms*="files.write.own"] [data-requires-permission="files.write.own"]
|
|||
height: 14px;
|
||||
bottom: 8px;
|
||||
}
|
||||
|
||||
.icon.attachment::before {
|
||||
width: 6px;
|
||||
height: 12px;
|
||||
|
|
@ -670,6 +709,7 @@ body[data-perms*="files.write.own"] [data-requires-permission="files.write.own"]
|
|||
width: 22px;
|
||||
height: 16px;
|
||||
}
|
||||
|
||||
.icon.blurb::after,
|
||||
.icon.blurb::before {
|
||||
content: "";
|
||||
|
|
@ -681,11 +721,13 @@ body[data-perms*="files.write.own"] [data-requires-permission="files.write.own"]
|
|||
background: currentColor;
|
||||
bottom: 2px;
|
||||
}
|
||||
|
||||
.icon.blurb::before {
|
||||
width: 10px;
|
||||
left: 2px;
|
||||
box-shadow: 4px -4px 0;
|
||||
}
|
||||
|
||||
.icon.blurb::after {
|
||||
width: 3px;
|
||||
right: 2px;
|
||||
|
|
@ -698,6 +740,7 @@ body[data-perms*="files.write.own"] [data-requires-permission="files.write.own"]
|
|||
display: block;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.icon.calendar {
|
||||
position: relative;
|
||||
transform: scale(var(--icon-scale, 1));
|
||||
|
|
@ -731,6 +774,7 @@ body[data-perms*="files.write.own"] [data-requires-permission="files.write.own"]
|
|||
height: 12px;
|
||||
perspective: 24px;
|
||||
}
|
||||
|
||||
.icon.camera::after,
|
||||
.icon.camera::before {
|
||||
content: "";
|
||||
|
|
@ -738,6 +782,7 @@ body[data-perms*="files.write.own"] [data-requires-permission="files.write.own"]
|
|||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
.icon.camera::before {
|
||||
border: 2px solid;
|
||||
border-left-color: transparent;
|
||||
|
|
@ -747,6 +792,7 @@ body[data-perms*="files.write.own"] [data-requires-permission="files.write.own"]
|
|||
right: -7px;
|
||||
top: 0;
|
||||
}
|
||||
|
||||
.icon.camera::after {
|
||||
width: 10px;
|
||||
height: 5px;
|
||||
|
|
@ -766,6 +812,7 @@ body[data-perms*="files.write.own"] [data-requires-permission="files.write.own"]
|
|||
width: 14px;
|
||||
height: 10px;
|
||||
}
|
||||
|
||||
.icon.chat::after,
|
||||
.icon.chat::before {
|
||||
content: "";
|
||||
|
|
@ -776,11 +823,13 @@ body[data-perms*="files.write.own"] [data-requires-permission="files.write.own"]
|
|||
height: 2px;
|
||||
background: currentColor;
|
||||
}
|
||||
|
||||
.icon.chat::before {
|
||||
width: 10px;
|
||||
opacity: 0.5;
|
||||
box-shadow: 0 4px 0;
|
||||
}
|
||||
|
||||
.icon.chat::after {
|
||||
width: 14px;
|
||||
bottom: 0;
|
||||
|
|
@ -809,6 +858,7 @@ body[data-perms*="files.write.own"] [data-requires-permission="files.write.own"]
|
|||
border: 2px solid;
|
||||
border-radius: var(--border-radius);
|
||||
}
|
||||
|
||||
.icon.close::after,
|
||||
.icon.close::before {
|
||||
content: "";
|
||||
|
|
@ -823,6 +873,7 @@ body[data-perms*="files.write.own"] [data-requires-permission="files.write.own"]
|
|||
top: 8px;
|
||||
left: 3px;
|
||||
}
|
||||
|
||||
.icon.close::after {
|
||||
transform: rotate(-45deg);
|
||||
}
|
||||
|
|
@ -838,6 +889,7 @@ body[data-perms*="files.write.own"] [data-requires-permission="files.write.own"]
|
|||
border: 2px solid;
|
||||
border-radius: 100px;
|
||||
}
|
||||
|
||||
.icon.controller::before {
|
||||
content: "";
|
||||
display: block;
|
||||
|
|
@ -869,6 +921,7 @@ body[data-perms*="files.write.own"] [data-requires-permission="files.write.own"]
|
|||
border-bottom-right-radius: 2px;
|
||||
margin-top: 8px;
|
||||
}
|
||||
|
||||
.icon.download::after {
|
||||
content: "";
|
||||
display: block;
|
||||
|
|
@ -882,6 +935,7 @@ body[data-perms*="files.write.own"] [data-requires-permission="files.write.own"]
|
|||
left: 2px;
|
||||
bottom: 4px;
|
||||
}
|
||||
|
||||
.icon.download::before {
|
||||
content: "";
|
||||
display: block;
|
||||
|
|
@ -907,6 +961,7 @@ body[data-perms*="files.write.own"] [data-requires-permission="files.write.own"]
|
|||
border-radius: 3px;
|
||||
box-shadow: 0 -1px 0;
|
||||
}
|
||||
|
||||
.icon.essay::after,
|
||||
.icon.essay::before {
|
||||
content: "";
|
||||
|
|
@ -916,6 +971,7 @@ body[data-perms*="files.write.own"] [data-requires-permission="files.write.own"]
|
|||
width: 6px;
|
||||
top: 2px;
|
||||
}
|
||||
|
||||
.icon.essay::before {
|
||||
background: currentColor;
|
||||
left: 2px;
|
||||
|
|
@ -925,6 +981,7 @@ body[data-perms*="files.write.own"] [data-requires-permission="files.write.own"]
|
|||
border-radius: 3px;
|
||||
height: 2px;
|
||||
}
|
||||
|
||||
.icon.essay::after {
|
||||
height: 10px;
|
||||
border: 2px solid;
|
||||
|
|
@ -941,6 +998,7 @@ body[data-perms*="files.write.own"] [data-requires-permission="files.write.own"]
|
|||
width: 8px;
|
||||
height: 8px;
|
||||
}
|
||||
|
||||
.icon.exchange {
|
||||
position: relative;
|
||||
transform: scale(var(--icon-scale, 1));
|
||||
|
|
@ -948,16 +1006,19 @@ body[data-perms*="files.write.own"] [data-requires-permission="files.write.own"]
|
|||
-3px 3px 0 -1px,
|
||||
3px -3px 0 -1px;
|
||||
}
|
||||
|
||||
.icon.exchange::after,
|
||||
.icon.exchange::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
border: 2px solid;
|
||||
}
|
||||
|
||||
.icon.exchange::before {
|
||||
top: -5px;
|
||||
left: -5px;
|
||||
}
|
||||
|
||||
.icon.exchange::after {
|
||||
bottom: -5px;
|
||||
right: -5px;
|
||||
|
|
@ -973,6 +1034,7 @@ body[data-perms*="files.write.own"] [data-requires-permission="files.write.own"]
|
|||
height: 14px;
|
||||
border-bottom: 2px solid;
|
||||
}
|
||||
|
||||
.icon.forum::after,
|
||||
.icon.forum::before {
|
||||
content: "";
|
||||
|
|
@ -981,6 +1043,7 @@ body[data-perms*="files.write.own"] [data-requires-permission="files.write.own"]
|
|||
position: absolute;
|
||||
top: 2px;
|
||||
}
|
||||
|
||||
.icon.forum::before {
|
||||
border-left: 4px solid;
|
||||
left: 1px;
|
||||
|
|
@ -989,6 +1052,7 @@ body[data-perms*="files.write.own"] [data-requires-permission="files.write.own"]
|
|||
border-top: 3px solid transparent;
|
||||
border-bottom: 3px solid transparent;
|
||||
}
|
||||
|
||||
.icon.forum::after {
|
||||
width: 8px;
|
||||
height: 6px;
|
||||
|
|
@ -1007,6 +1071,7 @@ body[data-perms*="files.write.own"] [data-requires-permission="files.write.own"]
|
|||
height: 16px;
|
||||
box-shadow: 6px -6px 0 -4px;
|
||||
}
|
||||
|
||||
.icon.forward-copy::before {
|
||||
content: "";
|
||||
display: block;
|
||||
|
|
@ -1019,6 +1084,7 @@ body[data-perms*="files.write.own"] [data-requires-permission="files.write.own"]
|
|||
left: 0;
|
||||
bottom: 0;
|
||||
}
|
||||
|
||||
.icon.forward-copy::after {
|
||||
content: "";
|
||||
display: block;
|
||||
|
|
@ -1053,6 +1119,7 @@ body[data-perms*="files.write.own"] [data-requires-permission="files.write.own"]
|
|||
border-bottom-left-radius: 0;
|
||||
margin-bottom: -2px;
|
||||
}
|
||||
|
||||
.icon.home::after,
|
||||
.icon.home::before {
|
||||
content: "";
|
||||
|
|
@ -1060,6 +1127,7 @@ body[data-perms*="files.write.own"] [data-requires-permission="files.write.own"]
|
|||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
.icon.home::before {
|
||||
border-top: 2px solid;
|
||||
border-left: 2px solid;
|
||||
|
|
@ -1071,6 +1139,7 @@ body[data-perms*="files.write.own"] [data-requires-permission="files.write.own"]
|
|||
height: 14px;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
.icon.home::after {
|
||||
width: 8px;
|
||||
height: 10px;
|
||||
|
|
@ -1087,6 +1156,7 @@ body[data-perms*="files.write.own"] [data-requires-permission="files.write.own"]
|
|||
.icon.live {
|
||||
transform: scale(var(--icon-scale, 1));
|
||||
}
|
||||
|
||||
.icon.live,
|
||||
.icon.live::after,
|
||||
.icon.live::before {
|
||||
|
|
@ -1099,6 +1169,7 @@ body[data-perms*="files.write.own"] [data-requires-permission="files.write.own"]
|
|||
border-bottom-color: transparent;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.icon.live::after,
|
||||
.icon.live::before {
|
||||
content: "";
|
||||
|
|
@ -1108,6 +1179,7 @@ body[data-perms*="files.write.own"] [data-requires-permission="files.write.own"]
|
|||
top: 2px;
|
||||
left: 2px;
|
||||
}
|
||||
|
||||
.icon.live::after {
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
|
|
@ -1138,6 +1210,7 @@ body[data-perms*="files.write.own"] [data-requires-permission="files.write.own"]
|
|||
border: 2px solid;
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
.icon.more::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
|
|
@ -1158,6 +1231,7 @@ body[data-perms*="files.write.own"] [data-requires-permission="files.write.own"]
|
|||
.icon.more-borderless {
|
||||
transform: scale(var(--icon-scale, 1));
|
||||
}
|
||||
|
||||
.icon.more-borderless,
|
||||
.icon.more-borderless::after,
|
||||
.icon.more-borderless::before {
|
||||
|
|
@ -1169,15 +1243,18 @@ body[data-perms*="files.write.own"] [data-requires-permission="files.write.own"]
|
|||
background: currentColor;
|
||||
border-radius: 100%;
|
||||
}
|
||||
|
||||
.icon.more-borderless::after,
|
||||
.icon.more-borderless::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 0;
|
||||
}
|
||||
|
||||
.icon.more-borderless::after {
|
||||
left: -6px;
|
||||
}
|
||||
|
||||
.icon.more-borderless::before {
|
||||
right: -6px;
|
||||
}
|
||||
|
|
@ -1193,6 +1270,7 @@ body[data-perms*="files.write.own"] [data-requires-permission="files.write.own"]
|
|||
border: 2px solid;
|
||||
border-radius: 24px;
|
||||
}
|
||||
|
||||
.icon.more-circle::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
|
|
@ -1218,6 +1296,7 @@ body[data-perms*="files.write.own"] [data-requires-permission="files.write.own"]
|
|||
height: 22px;
|
||||
transform: scale(var(--icon-scale, 1));
|
||||
}
|
||||
|
||||
.icon.phone::after,
|
||||
.icon.phone::before {
|
||||
content: "";
|
||||
|
|
@ -1225,6 +1304,7 @@ body[data-perms*="files.write.own"] [data-requires-permission="files.write.own"]
|
|||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
.icon.phone::after {
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
|
|
@ -1239,6 +1319,7 @@ body[data-perms*="files.write.own"] [data-requires-permission="files.write.own"]
|
|||
linear-gradient(to left, currentColor 10px, transparent 0) no-repeat right 11px/6px 4px,
|
||||
linear-gradient(to left, currentColor 10px, transparent 0) no-repeat -1px 0/4px 6px;
|
||||
}
|
||||
|
||||
.icon.phone::before {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
|
|
@ -1259,17 +1340,20 @@ body[data-perms*="files.write.own"] [data-requires-permission="files.write.own"]
|
|||
display: block;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.icon.plus::after,
|
||||
.icon.plus::before {
|
||||
border-radius: 10px;
|
||||
background: currentColor;
|
||||
}
|
||||
|
||||
.icon.plus {
|
||||
position: relative;
|
||||
transform: scale(var(--icon-scale, 1));
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
}
|
||||
|
||||
.icon.plus::after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
|
|
@ -1278,6 +1362,7 @@ body[data-perms*="files.write.own"] [data-requires-permission="files.write.own"]
|
|||
top: 0;
|
||||
left: 7px;
|
||||
}
|
||||
|
||||
.icon.plus::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
|
|
@ -1297,6 +1382,7 @@ body[data-perms*="files.write.own"] [data-requires-permission="files.write.own"]
|
|||
height: 16px;
|
||||
box-shadow: -6px -6px 0 -4px;
|
||||
}
|
||||
|
||||
.icon.reply::before {
|
||||
content: "";
|
||||
display: block;
|
||||
|
|
@ -1309,6 +1395,7 @@ body[data-perms*="files.write.own"] [data-requires-permission="files.write.own"]
|
|||
right: 0;
|
||||
bottom: 0;
|
||||
}
|
||||
|
||||
.icon.reply::after {
|
||||
content: "";
|
||||
display: block;
|
||||
|
|
@ -1330,6 +1417,7 @@ body[data-perms*="files.write.own"] [data-requires-permission="files.write.own"]
|
|||
box-sizing: border-box;
|
||||
border-radius: 22px;
|
||||
}
|
||||
|
||||
.icon.resources {
|
||||
position: relative;
|
||||
transform: scale(var(--icon-scale, 1));
|
||||
|
|
@ -1337,6 +1425,7 @@ body[data-perms*="files.write.own"] [data-requires-permission="files.write.own"]
|
|||
height: 20px;
|
||||
border: 2px solid transparent;
|
||||
}
|
||||
|
||||
.icon.resources::after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
|
|
@ -1363,6 +1452,7 @@ body[data-perms*="files.write.own"] [data-requires-permission="files.write.own"]
|
|||
border: 2px solid;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.icon.send::after,
|
||||
.icon.send::before {
|
||||
content: "";
|
||||
|
|
@ -1375,6 +1465,7 @@ body[data-perms*="files.write.own"] [data-requires-permission="files.write.own"]
|
|||
top: 5px;
|
||||
right: 5px;
|
||||
}
|
||||
|
||||
.icon.send::after {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
|
|
@ -1388,6 +1479,7 @@ body[data-perms*="files.write.own"] [data-requires-permission="files.write.own"]
|
|||
.icon.talk {
|
||||
transform: scale(var(--icon-scale, 1));
|
||||
}
|
||||
|
||||
.icon.talk,
|
||||
.icon.talk::after {
|
||||
box-sizing: border-box;
|
||||
|
|
@ -1398,6 +1490,7 @@ body[data-perms*="files.write.own"] [data-requires-permission="files.write.own"]
|
|||
border-radius: 100px;
|
||||
border: 2px dotted currentColor;
|
||||
}
|
||||
|
||||
.icon.talk::after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
|
|
@ -1428,6 +1521,7 @@ body[data-perms*="files.write.own"] [data-requires-permission="files.write.own"]
|
|||
border-bottom-right-radius: 1px;
|
||||
margin-top: 4px;
|
||||
}
|
||||
|
||||
.icon.trash::after,
|
||||
.icon.trash::before {
|
||||
content: "";
|
||||
|
|
@ -1435,6 +1529,7 @@ body[data-perms*="files.write.own"] [data-requires-permission="files.write.own"]
|
|||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
.icon.trash::after {
|
||||
background: currentColor;
|
||||
border-radius: 3px;
|
||||
|
|
@ -1443,6 +1538,7 @@ body[data-perms*="files.write.own"] [data-requires-permission="files.write.own"]
|
|||
top: -4px;
|
||||
left: -5px;
|
||||
}
|
||||
|
||||
.icon.trash::before {
|
||||
width: 10px;
|
||||
height: 4px;
|
||||
|
|
@ -1463,6 +1559,7 @@ body[data-perms*="files.write.own"] [data-requires-permission="files.write.own"]
|
|||
border: 2px solid;
|
||||
border-radius: 100px;
|
||||
}
|
||||
|
||||
.icon.user {
|
||||
overflow: hidden;
|
||||
transform: scale(var(--icon-scale, 1));
|
||||
|
|
@ -1470,6 +1567,7 @@ body[data-perms*="files.write.own"] [data-requires-permission="files.write.own"]
|
|||
height: 22px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.icon.user::after,
|
||||
.icon.user::before {
|
||||
content: "";
|
||||
|
|
@ -1479,6 +1577,7 @@ body[data-perms*="files.write.own"] [data-requires-permission="files.write.own"]
|
|||
width: 8px;
|
||||
height: 8px;
|
||||
}
|
||||
|
||||
.icon.user::after {
|
||||
border-radius: 200px;
|
||||
top: 11px;
|
||||
|
|
@ -1498,6 +1597,7 @@ body[data-perms*="files.write.own"] [data-requires-permission="files.write.own"]
|
|||
border: 2px solid;
|
||||
border-radius: 22px;
|
||||
}
|
||||
|
||||
.icon.work::after,
|
||||
.icon.work::before {
|
||||
content: "";
|
||||
|
|
@ -1505,6 +1605,7 @@ body[data-perms*="files.write.own"] [data-requires-permission="files.write.own"]
|
|||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
.icon.work::before {
|
||||
width: 12px;
|
||||
height: 6px;
|
||||
|
|
@ -1515,6 +1616,7 @@ body[data-perms*="files.write.own"] [data-requires-permission="files.write.own"]
|
|||
left: 2px;
|
||||
border-bottom: 0;
|
||||
}
|
||||
|
||||
.icon.work::after {
|
||||
width: 18px;
|
||||
height: 2px;
|
||||
|
|
@ -1532,6 +1634,7 @@ body[data-perms*="files.write.own"] [data-requires-permission="files.write.own"]
|
|||
width: 22px;
|
||||
height: 22px;
|
||||
}
|
||||
|
||||
.icon.right::after,
|
||||
.icon.right::before {
|
||||
content: "";
|
||||
|
|
@ -1546,6 +1649,7 @@ body[data-perms*="files.write.own"] [data-requires-permission="files.write.own"]
|
|||
top: 7px;
|
||||
right: 6px;
|
||||
}
|
||||
|
||||
.icon.right::after {
|
||||
right: 11px;
|
||||
}
|
||||
|
|
@ -1558,6 +1662,7 @@ body[data-perms*="files.write.own"] [data-requires-permission="files.write.own"]
|
|||
width: 22px;
|
||||
height: 22px;
|
||||
}
|
||||
|
||||
.icon.left::after,
|
||||
.icon.left::before {
|
||||
content: "";
|
||||
|
|
@ -1572,6 +1677,7 @@ body[data-perms*="files.write.own"] [data-requires-permission="files.write.own"]
|
|||
top: 7px;
|
||||
left: 6px;
|
||||
}
|
||||
|
||||
.icon.left::after {
|
||||
left: 11px;
|
||||
}
|
||||
|
|
@ -1587,6 +1693,7 @@ body[data-perms*="files.write.own"] [data-requires-permission="files.write.own"]
|
|||
border: 2px solid;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.icon.skip-back::after,
|
||||
.icon.skip-back::before {
|
||||
content: "";
|
||||
|
|
@ -1596,12 +1703,14 @@ body[data-perms*="files.write.own"] [data-requires-permission="files.write.own"]
|
|||
height: 8px;
|
||||
top: 5px;
|
||||
}
|
||||
|
||||
.icon.skip-back::before {
|
||||
width: 2px;
|
||||
border-radius: 2px;
|
||||
right: 11px;
|
||||
background: currentColor;
|
||||
}
|
||||
|
||||
.icon.skip-back::after {
|
||||
width: 0;
|
||||
border-top: 4px solid transparent;
|
||||
|
|
@ -1620,6 +1729,7 @@ body[data-perms*="files.write.own"] [data-requires-permission="files.write.own"]
|
|||
width: 22px;
|
||||
height: 22px;
|
||||
}
|
||||
|
||||
.icon.rewind::after,
|
||||
.icon.rewind::before {
|
||||
content: "";
|
||||
|
|
@ -1634,6 +1744,7 @@ body[data-perms*="files.write.own"] [data-requires-permission="files.write.own"]
|
|||
top: 6px;
|
||||
left: 5px;
|
||||
}
|
||||
|
||||
.icon.rewind::after {
|
||||
left: 9px;
|
||||
}
|
||||
|
|
@ -1648,6 +1759,7 @@ body[data-perms*="files.write.own"] [data-requires-permission="files.write.own"]
|
|||
border: 2px solid;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.icon.play::before {
|
||||
content: "";
|
||||
display: block;
|
||||
|
|
@ -1672,6 +1784,7 @@ body[data-perms*="files.write.own"] [data-requires-permission="files.write.own"]
|
|||
border: 2px solid;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.icon.pause::before {
|
||||
content: "";
|
||||
display: block;
|
||||
|
|
@ -1695,6 +1808,7 @@ body[data-perms*="files.write.own"] [data-requires-permission="files.write.own"]
|
|||
width: 22px;
|
||||
height: 22px;
|
||||
}
|
||||
|
||||
.icon.fastforward::after,
|
||||
.icon.fastforward::before {
|
||||
content: "";
|
||||
|
|
@ -1709,6 +1823,7 @@ body[data-perms*="files.write.own"] [data-requires-permission="files.write.own"]
|
|||
top: 6px;
|
||||
right: 5px;
|
||||
}
|
||||
|
||||
.icon.fastforward::after {
|
||||
right: 9px;
|
||||
}
|
||||
|
|
@ -1723,6 +1838,7 @@ body[data-perms*="files.write.own"] [data-requires-permission="files.write.own"]
|
|||
border: 2px solid;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.icon.skip-forward::after,
|
||||
.icon.skip-forward::before {
|
||||
content: "";
|
||||
|
|
@ -1732,12 +1848,14 @@ body[data-perms*="files.write.own"] [data-requires-permission="files.write.own"]
|
|||
height: 8px;
|
||||
top: 5px;
|
||||
}
|
||||
|
||||
.icon.skip-forward::before {
|
||||
width: 2px;
|
||||
border-radius: 2px;
|
||||
left: 11px;
|
||||
background: currentColor;
|
||||
}
|
||||
|
||||
.icon.skip-forward::after {
|
||||
width: 0;
|
||||
border-top: 4px solid transparent;
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue