hallo flummer #51

Merged
schrumpel merged 2 commits from dev into master 2022-10-22 23:48:20 +00:00
Showing only changes of commit d13eeea588 - Show all commits

View File

@ -48,7 +48,8 @@ html[theme="f0ck"] .admin-search button {
color: var(--black) !important;
}
html[theme="f0ck"] .pagination > a, .pagination > span {
html[theme="f0ck"] .pagination>a,
.pagination>span {
border-radius: 3px;
border: 1px solid var(--black);
}
@ -82,7 +83,8 @@ html[theme='p1nk'] {
--nav-brand-font: 'VCR';
--font: 'monospace';
--pagination-background: #2b2b2b;
--pagination-box-shadow: inset 0 0 0 1px rgba(255,255,255,.04),inset 0 1px rgba(255,255,255,.04),inset 0 -1px rgba(0,0,0,.15),0 1px 1px rgba(0,0,0,.1);;
--pagination-box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .04), inset 0 1px rgba(255, 255, 255, .04), inset 0 -1px rgba(0, 0, 0, .15), 0 1px 1px rgba(0, 0, 0, .1);
;
--pagination-anchor-box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .04), inset 0 1px rgba(255, 255, 255, .04), inset 0 -1px rgba(0, 0, 0, .15), 0 1px 1px rgba(0, 0, 0, .1);
--pagination-background-hover: #333;
--pagination-border-color: rgba(0, 0, 0, .8) rgba(0, 0, 0, .65) rgba(0, 0, 0, .5);
@ -100,7 +102,8 @@ html[theme='p1nk'] {
--img-border-color: #363636;
}
html[theme="p1nk"] .pagination > a, .pagination > span {
html[theme="p1nk"] .pagination>a,
.pagination>span {
border-radius: 3px;
border: 1px solid var(--black);
}
@ -152,7 +155,8 @@ html[theme='orange'] {
--img-border-color: #363636;
}
html[theme="orange"] .pagination > a, .pagination > span {
html[theme="orange"] .pagination>a,
.pagination>span {
border-radius: 3px;
border: 1px solid var(--black);
}
@ -210,7 +214,8 @@ html[theme="amoled"] .metadata {
border: none;
}
html[theme="amoled"] .pagination > a, .pagination > span {
html[theme="amoled"] .pagination>a,
.pagination>span {
border-radius: 3px;
border: 1px solid var(--black);
}
@ -305,7 +310,8 @@ html[theme="paper"] .iconset#a_delete {
stroke: var(--white);
}
html[theme="paper"] .pagination > a, .pagination > span {
html[theme="paper"] .pagination>a,
.pagination>span {
border-radius: 3px;
border: 1px solid var(--black);
}
@ -394,7 +400,8 @@ html[theme="paper"] .v0ck_player_button svg:hover {
stroke: var(--white);
}
html[theme="paper"] .badge-dark, #themeselector {
html[theme="paper"] .badge-dark,
#themeselector {
border: 1px solid var(--white);
}
@ -463,7 +470,8 @@ html[theme="atmos"] {
--img-border-color: #363636;
}
html[theme="atmos"] .pagination > a, .pagination > span {
html[theme="atmos"] .pagination>a,
.pagination>span {
border-radius: 3px;
border: 1px solid var(--black);
}
@ -517,7 +525,8 @@ html[theme="term"] {
--img-border-color: #363636;
}
html[theme="term"] .pagination > a, .pagination > span {
html[theme="term"] .pagination>a,
.pagination>span {
border-radius: 3px;
border: 1px solid var(--black);
}
@ -536,7 +545,8 @@ html[theme="term"] .metadata {
text-shadow: 0px 0px 1px var(--accent), 1px 0px 2px var(--accent), 0px 0px 5px var(--black);
}
html[theme="term"] .metadata > .badge-dark, #themeselector {
html[theme="term"] .metadata>.badge-dark,
#themeselector {
box-shadow: var(--pagination-anchor-box-shadow);
background-image: linear-gradient(to bottom, var(--nav-link-background-linear-gradient));
}
@ -598,7 +608,8 @@ html[theme="iced"] svg.iconset:hover {
background: #1b2f5a;
}
html[theme="iced"] .pagination > a, .pagination > span {
html[theme="iced"] .pagination>a,
.pagination>span {
border-radius: 3px;
border: 1px solid var(--black);
}
@ -656,7 +667,8 @@ html[theme='f0ck95'] {
--img-border-color: #808080;
}
html[theme="f0ck95"] html, body {
html[theme="f0ck95"] html,
body {
color: var(--black);
}
@ -672,7 +684,9 @@ html[theme="f0ck95"] .embed-responsive-image {
border: none;
}
html[theme="f0ck95"] .nav-link, .pagination > a, .pagination > span {
html[theme="f0ck95"] .nav-link,
.pagination>a,
.pagination>span {
border-radius: 0;
border-left: inset 1px silver;
border-bottom: outset 1px silver;
@ -682,11 +696,13 @@ html[theme="f0ck95"] .nav-link, .pagination > a, .pagination > span {
background-image: linear-gradient(to bottom, var(--nav-link-background-linear-gradient));
}
html[theme="f0ck95"] .pagination > a:active, .pagination > span {
html[theme="f0ck95"] .pagination>a:active,
.pagination>span {
color: black;
}
html[theme="f0ck95"] .pagination > a, .pagination > span {
html[theme="f0ck95"] .pagination>a,
.pagination>span {
border-radius: 0;
border-left: inset 1px silver;
border-bottom: outset 1px silver;
@ -774,7 +790,8 @@ html[theme="f0ck95"] .about {
color: black;
}
html[theme="f0ck95"] .badge-dark, #themeselector {
html[theme="f0ck95"] .badge-dark,
#themeselector {
border: inset 1px gray;
background: #a8a5a5;
}
@ -965,7 +982,8 @@ html[theme="f0ck95d"] .embed-responsive-image {
background: #0000;
}
html[theme="f0ck95d"] html, body {
html[theme="f0ck95d"] html,
body {
color: var(--white);
}
@ -980,7 +998,9 @@ html[theme="f0ck95d"] span#favs {
box-shadow: var(--nav-link-box-shadow);
}
html[theme="f0ck95d"] .nav-link, .pagination > a, .pagination > span {
html[theme="f0ck95d"] .nav-link,
.pagination>a,
.pagination>span {
border-radius: 0;
border-left: inset 1px black;
border-bottom: outset 1px black;
@ -1051,7 +1071,8 @@ html[theme="f0ck95d"] .about {
color: var(--white);
}
html[theme="f0ck95d"] .badge-dark, #themeselector {
html[theme="f0ck95d"] .badge-dark,
#themeselector {
border: inset 1px gray;
background: rgba(255, 255, 255, .04), rgba(255, 255, 255, 0);
background-image: linear-gradient(to bottom, var(--nav-link-background-linear-gradient));
@ -1083,14 +1104,18 @@ html[theme="f0ck95d"] .admin-search button {
::-webkit-scrollbar {
width: 2px;
}
::-webkit-scrollbar-thumb {
background-color: var(--scrollbar-color);
}
::-webkit-scrollbar-track {
background-color: transparent;
}
*, ::before, ::after {
*,
::before,
::after {
box-sizing: border-box;
outline: 0;
-webkit-tap-highlight-color: transparent;
@ -1102,7 +1127,8 @@ html[theme="f0ck95d"] .admin-search button {
/* https://www.dafont.com/vcr-osd-mono.font */
}
html, body {
html,
body {
background-color: var(--bg);
color: var(--white);
margin: 0;
@ -1124,13 +1150,16 @@ html, body {
}
a {
color: var(--accent) /* !important */;
color: var(--accent)
/* !important */
;
cursor: pointer;
text-decoration: none;
display: inline-block;
}
a.post_source:hover, a.id-link:hover {
a.post_source:hover,
a.id-link:hover {
text-decoration: underline;
}
@ -1139,7 +1168,8 @@ a.btn.disabled {
user-select: none;
}
.btn.disabled, .btn:disabled {
.btn.disabled,
.btn:disabled {
user-select: none;
font-weight: bold;
text-shadow: 1px 1px 1px var(--black);
@ -1178,11 +1208,13 @@ div.posts > a {
background-size: cover;
background-position: center;
}
div.posts>a::before {
content: "";
display: block;
margin-top: 100%;
}
div.posts>a:hover {
opacity: 0.8;
box-shadow: 0 0 0 2px var(--accent);
@ -1203,6 +1235,7 @@ div.posts > a::after {
font-family: vcr;
text-transform: uppercase;
}
div.posts>a:hover::after {
visibility: visible;
}
@ -1312,23 +1345,28 @@ ul.navbar-nav li.nav-item {
box-shadow: var(--nav-link-box-shadow);
}
.navbar-expand-lg .navbar-nav .nav-link, .pagination > a, .pagination > span {
.navbar-expand-lg .navbar-nav .nav-link,
.pagination>a,
.pagination>span {
padding-right: .5rem;
padding-left: .5rem;
}
.pagination > a, .pagination > span {
.pagination>a,
.pagination>span {
margin-right: 5px;
margin-left: 5px;
}
.nav-item:hover > a:hover, .dropdown-item:hover > a:hover {
.nav-item:hover>a:hover,
.dropdown-item:hover>a:hover {
background-color: var(--nav-link-hover-bg);
}
.nav-link[data-toggle="dropdown"].ddcontent::after {
content: "\00a0("attr(content) ")\00a0\25bc";
}
.nav-link[data-toggle="dropdown"]:not(.ddcontent)::after {
content: "\00a0\25bc";
}
@ -1419,7 +1457,10 @@ span.placeholder {
display: none;
}
.dropup, .dropright, .dropdown, .dropleft {
.dropup,
.dropright,
.dropdown,
.dropleft {
position: relative;
}
@ -1433,6 +1474,7 @@ span.placeholder {
transition: .2s ease;
background-color: var(--nav-link-hover-bg);
}
.dropdown:hover .nav-link>img.avatar {
border-bottom-left-radius: 0;
}
@ -1492,12 +1534,15 @@ span.placeholder {
justify-content: flex-end !important;
}
.pagination a:nth-last-child(2), .pagination a:nth-last-child(3),
.pagination a:nth-child(2), .pagination a:nth-child(3) {
.pagination a:nth-last-child(2),
.pagination a:nth-last-child(3),
.pagination a:nth-child(2),
.pagination a:nth-child(3) {
display: none;
}
html, body {
html,
body {
text-align: center;
}
}
@ -1507,7 +1552,9 @@ span.placeholder {
grid-template-columns: 1fr 1fr !important;
}
.by-user, .by-stats, .by-hoster {
.by-user,
.by-stats,
.by-hoster {
grid-column: unset !important;
grid-row: unset !important;
}
@ -1558,7 +1605,8 @@ span.placeholder {
color: transparent;
}
.pagination > a, .pagination > span {
.pagination>a,
.pagination>span {
float: left;
padding: 0 5px;
min-width: 17px;
@ -1588,7 +1636,8 @@ span.placeholder {
background-color: var(--pagination-background-hover);
}
.pagination>a:active,.pagination>span {
.pagination>a:active,
.pagination>span {
color: var(--accent);
text-shadow: 0 -1px var(--black);
box-shadow: var(--pagination-anchor-box-shadow);
@ -1740,12 +1789,14 @@ span.placeholder {
.embed-responsive-16by9::before {
padding-top: 50%;
}
.embed-responsive::before {
display: block;
content: "";
}
.embed-responsive .embed-responsive-item, .embed-responsive video {
.embed-responsive .embed-responsive-item,
.embed-responsive video {
position: absolute;
top: 0;
bottom: 0;
@ -1770,7 +1821,8 @@ span.placeholder {
border-top: none;
}
.previous-post, .next-post {
.previous-post,
.next-post {
display: flex;
height: 100%;
position: relative;
@ -1800,7 +1852,8 @@ span.placeholder {
padding: 25px;
}
#next:hover, #prev:hover {
#next:hover,
#prev:hover {
opacity: 1;
}
@ -1862,7 +1915,8 @@ a#elfe {
text-align: center;
}
.badge-dark, #themeselector {
.badge-dark,
#themeselector {
background-color: var(--badge-bg);
border: 1px solid var(--black);
margin: 5px;
@ -1913,21 +1967,26 @@ span#tags:empty {
padding-top: 1.5px;
padding-bottom: 1.5px;
}
.badge-greentext {
color: #789922;
text-shadow: inherit !important;
background-color: #252525;
}
.badge-german {
background: linear-gradient(180deg, black 33.33%, red 33.33%, red 66.66%, yellow 66.66%) !important;
}
.badge-dutch {
background: linear-gradient(180deg, #ad1c23 33.33%, white 33.33%, white 66.66%, #26468f 66.66%) !important;
color: #000 !important;
}
.badge-ukraine {
background: linear-gradient(180deg, #005bbc 50%, #ffd600 50%) !important;
}
.badge-russia {
background: linear-gradient(180deg, white 33.33%, blue 33.33%, blue 66.66%, red 66.66%) !important;
}
@ -1951,11 +2010,23 @@ span#tags:empty {
animation: pulsate 1s infinite linear;
box-shadow: 0px 2px var(--accent);
}
@keyframes pulsate {
0% { box-shadow: 0px 2px var(--white); }
40% { box-shadow: 0px 2px var(--accent); }
60% { box-shadow: 0px 2px var(--accent); }
100% { box-shadow: 0px 2px var(--white); }
0% {
box-shadow: 0px 2px var(--white);
}
40% {
box-shadow: 0px 2px var(--accent);
}
60% {
box-shadow: 0px 2px var(--accent);
}
100% {
box-shadow: 0px 2px var(--white);
}
}
@media(max-height: 768px) {
@ -2009,7 +2080,8 @@ span#tags:empty {
grid-column: 1/3;
}
a#prev:focus, a#next:focus {
a#prev:focus,
a#next:focus {
background: var(--nav-bg);
border-radius: 350px;
opacity: 0.6;
@ -2043,10 +2115,12 @@ div.about > div {
max-width: 500px;
margin-left: 5px;
}
div.about>div img {
max-width: 99%;
height: auto;
}
div.about>div p {
font-size: 7pt;
margin-top: 0;
@ -2059,6 +2133,7 @@ body[type='login'] {
align-items: center;
min-height: 100vh;
}
.login-form {
display: flex;
flex-direction: column;
@ -2068,6 +2143,7 @@ body[type='login'] {
border-radius: 10px;
border: 1px solid var(--accent);
}
.login-form button[type="submit"] {
width: 100%;
margin: 18px 0 9px 0;
@ -2079,10 +2155,12 @@ body[type='login'] {
border-radius: 0;
overflow: hidden;
}
.login-form button[type="submit"]:hover {
cursor: pointer;
opacity: 1;
}
.login-form input {
background: var(--bg);
border: 1px solid var(--black);
@ -2094,7 +2172,8 @@ body[type='login'] {
/* visualizer */
canvas {
position: absolute;
top: 1px; /* This removes the ugly 1px line seen at the bottom when you hover over the audio element */
top: 1px;
/* This removes the ugly 1px line seen at the bottom when you hover over the audio element */
left: 0;
bottom: 0;
right: 0;
@ -2137,16 +2216,19 @@ div#flash {
text-align: center;
font-weight: bold;
}
div#flash.error {
background-color: #fddfdf;
border-bottom: 2px solid #f1a899;
color: #5f3f3f;
}
div#flash.success {
background-color: #4caf50;
border-bottom: 2px solid #006018;
color: #001c07;
}
div#flash.warn {
background-color: #fffa90;
border-bottom: 2px solid #dad55e;
@ -2160,6 +2242,7 @@ div.posts > a > p {
position: absolute;
bottom: calc(0px - 12px);
}
div.posts>a>p:before {
content: "";
position: absolute;
@ -2168,14 +2251,18 @@ div.posts > a > p:before {
height: 10px;
width: 10px;
}
div.posts>a[data-mode="sfw"]>p:before {
background-color: #5cb85c;
}
div.posts>a[data-mode="nsfw"]>p:before {
background-color: #a72828;
}
div.posts>a[data-mode="null"]>p:before {
background-color: #dcd512; /* untagged */
background-color: #dcd512;
/* untagged */
}
div#footbar {
@ -2204,6 +2291,7 @@ div.logwrap {
height: auto;
text-align: left;
}
div.logwrap>p {
line-height: 0;
}
@ -2214,30 +2302,38 @@ table.table {
margin: 25px 0;
min-width: max-content;
}
table.table thead tr {
font-weight: bolder;
border-bottom: 1px solid var(--accent);
}
table.table tr {
line-height: 12px;
}
table.table th, table.table td {
table.table th,
table.table td {
padding: 7px 15px;
text-align: center;
}
table.table tbody tr:nth-of-type(odd) {
background-color: var(--badge-tag);
}
.topf0ckers {
text-align: center;
padding: 15px;
margin: 5px;
}
.ranking {
display: grid;
grid-template-columns: auto;
justify-content: center;
}
.ranking div {
padding: 15px;
margin: 5px;
@ -2245,12 +2341,15 @@ table.table tbody tr:nth-of-type(odd) {
border: 1px solid black;
border-radius: 3px;
}
.by-user {
grid-column: 1;
}
.by-stats {
grid-column: 3;
}
.by-hoster {
grid-column: 2;
}
@ -2265,6 +2364,7 @@ table.table tbody tr:nth-of-type(odd) {
[tooltip] {
position: relative;
}
[tooltip]::before,
[tooltip]::after {
text-transform: none;
@ -2276,11 +2376,13 @@ table.table tbody tr:nth-of-type(odd) {
display: none;
opacity: 0;
}
[tooltip]::before {
content: '';
border: 5px solid transparent;
z-index: 1001;
}
[tooltip]::after {
content: attr(tooltip);
font-family: Helvetica, sans-serif;
@ -2297,24 +2399,29 @@ table.table tbody tr:nth-of-type(odd) {
color: #fff;
z-index: 1000;
}
[tooltip]:hover::before,
[tooltip]:hover::after {
display: block;
}
[tooltip='']::before,
[tooltip='']::after {
display: none !important;
}
[tooltip]:not([flow])::before,
[tooltip][flow^="up"]::before {
bottom: 100%;
border-bottom-width: 0;
border-top-color: var(--tooltip-bg, #333);
}
[tooltip]:not([flow])::after,
[tooltip][flow^="up"]::after {
bottom: calc(100% + 5px);
}
[tooltip]:not([flow])::before,
[tooltip]:not([flow])::after,
[tooltip][flow^="up"]::before,
@ -2322,19 +2429,23 @@ table.table tbody tr:nth-of-type(odd) {
left: 50%;
transform: translate(-50%, -.5em);
}
[tooltip][flow^="down"]::before {
top: 100%;
border-top-width: 0;
border-bottom-color: var(--tooltip-bg, #333);
}
[tooltip][flow^="down"]::after {
top: calc(100% + 5px);
}
[tooltip][flow^="down"]::before,
[tooltip][flow^="down"]::after {
left: 50%;
transform: translate(-50%, .5em);
}
[tooltip][flow^="left"]::before {
top: 50%;
border-right-width: 0;
@ -2342,11 +2453,13 @@ table.table tbody tr:nth-of-type(odd) {
left: calc(0em - 5px);
transform: translate(-.5em, -50%);
}
[tooltip][flow^="left"]::after {
top: 50%;
right: calc(100% + 5px);
transform: translate(-.5em, -50%);
}
[tooltip][flow^="right"]::before {
top: 50%;
border-left-width: 0;
@ -2354,11 +2467,13 @@ table.table tbody tr:nth-of-type(odd) {
right: calc(0em - 5px);
transform: translate(.5em, -50%);
}
[tooltip][flow^="right"]::after {
top: 50%;
left: calc(100% + 5px);
transform: translate(.5em, -50%);
}
[tooltip]:not([flow]):hover::before,
[tooltip]:not([flow]):hover::after,
[tooltip][flow^="up"]:hover::before,
@ -2368,6 +2483,7 @@ table.table tbody tr:nth-of-type(odd) {
opacity: 1;
transform: translate(-50%, 0);
}
[tooltip][flow^="left"]:hover::before,
[tooltip][flow^="left"]:hover::after,
[tooltip][flow^="right"]:hover::before,
@ -2510,33 +2626,42 @@ table img {
table {
width: inherit;
}
thead {
display: none;
}
tr:nth-of-type(2n) {
background-color: inherit;
}
tr td:first-child {
float: right;
}
tbody td {
display: block;
box-shadow: 0px 1px 0px var(--accent);
}
tbody td:before {
content: attr(data-th);
display: block;
text-align: left;
}
table.table th, table.table td {
table.table th,
table.table td {
padding: 5px;
margin: 5px;
display: flex;
}
table.table td img {
position: relative;
width: 100%;
}
.mview_desc {
visibility: visible;
}
@ -2546,6 +2671,7 @@ table img {
.iconset#a_delete {
stroke: var(--accent);
}
.iconset#a_favo {
fill: var(--accent);
}
@ -2568,4 +2694,14 @@ table img {
grid-template-columns: 0fr 1fr 1fr;
grid-gap: 0.25em;
}
.placeholder {
visibility: hidden;
}
a.nav-link span {
/* This is a dirty and temporary hack to hide long usernames on mobile devices when logged in */
max-width: 10ch;
overflow: auto;
}
}