This commit is contained in:
parent
b216baf619
commit
72e7fe7873
@ -11,7 +11,7 @@
|
||||
<meta property="og:title" content="Fediblock Instance Φ">
|
||||
<meta property="og:type" content="service">
|
||||
<meta property="og:image" content="favicon.ico">
|
||||
<link rel='stylesheet' type='text/css' media='screen' href='main.css'>
|
||||
<link rel='stylesheet' type='text/css' media='screen' id="css" href='main.css'>
|
||||
<link rel='stylesheet' type='text/css' media='screen' href='loaders.css'>
|
||||
<script src='random-text.js'></script>
|
||||
<script src='../node_modules/html2canvas/dist/html2canvas.min.js'></script>
|
||||
@ -60,7 +60,7 @@
|
||||
matrix <a id="matrix" href="/?matrix">off</a> - download json <a id="download_index" href="#"
|
||||
target="_blank">index</a> -
|
||||
by <a href="https://about.manalejandro.com" target="_blank">ale</a>
|
||||
<s>©</s>2024
|
||||
<s>©</s>2024 <a id="darklight" href="#">☼</a>
|
||||
</footer>
|
||||
<div id="modal">
|
||||
<div class="modal-content">
|
||||
|
||||
378
public/light.css
Normal file
378
public/light.css
Normal file
@ -0,0 +1,378 @@
|
||||
body {
|
||||
background-color: #F5F5F5;
|
||||
text-align: center;
|
||||
font-family: Verdana, Geneva, Tahoma, sans-serif;
|
||||
scrollbar-width: thin;
|
||||
}
|
||||
|
||||
h1,
|
||||
h3,
|
||||
h4,
|
||||
#scan {
|
||||
margin: 0 auto;
|
||||
color: #333333;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
h3 {
|
||||
padding: 10px 0;
|
||||
border-bottom: 1px solid #ccc;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
a,
|
||||
a:hover {
|
||||
color: #333333;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
input[type="text"] {
|
||||
padding: 10px;
|
||||
border: none;
|
||||
border-bottom: 1px solid #ccc;
|
||||
background-color: #F0F0F0;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
#placeholder {
|
||||
font-size: small;
|
||||
margin: 0 auto;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
hr {
|
||||
margin: 1rem auto;
|
||||
border-bottom: 1px solid #ccc;
|
||||
width: 50%;
|
||||
}
|
||||
|
||||
#tooltip {
|
||||
visibility: hidden;
|
||||
font-size: small;
|
||||
text-align: left;
|
||||
width: 2.2in;
|
||||
background-color: #F5F5F5;
|
||||
color: #333333;
|
||||
border-radius: 5px;
|
||||
padding: 1rem 1rem 0 0;
|
||||
position: absolute;
|
||||
z-index: 1;
|
||||
opacity: 0;
|
||||
transition: 0.5s;
|
||||
border: 1px solid #ccc;
|
||||
}
|
||||
|
||||
#count:hover #tooltip {
|
||||
visibility: visible;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
#reverse {
|
||||
margin: 0.5rem;
|
||||
padding: 0.5rem;
|
||||
border: 1px solid #ccc;
|
||||
background-color: #333333;
|
||||
color: #F5F5F5;
|
||||
}
|
||||
|
||||
#reverse:hover {
|
||||
color: #333333;
|
||||
background-color: #F5F5F5;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
#instancelist {
|
||||
list-style-type: none;
|
||||
margin: 20px 0;
|
||||
padding: 0;
|
||||
color: #333333;
|
||||
max-height: 58vh;
|
||||
overflow: auto;
|
||||
scrollbar-width: thin;
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
#instancelist li {
|
||||
width: 28%;
|
||||
}
|
||||
|
||||
#instancelist li:hover {
|
||||
width: 33%;
|
||||
}
|
||||
|
||||
#instance,
|
||||
#placeholder,
|
||||
h4 {
|
||||
width: 30%;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 600px) and (max-width: 992px) {
|
||||
#instancelist li {
|
||||
width: 60%;
|
||||
}
|
||||
|
||||
#instancelist li:hover {
|
||||
width: 65%;
|
||||
}
|
||||
|
||||
#instance,
|
||||
#placeholder,
|
||||
h4 {
|
||||
width: 63%;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 600px) {
|
||||
#instancelist li {
|
||||
width: 80%;
|
||||
}
|
||||
|
||||
#instancelist li:hover {
|
||||
width: 85%;
|
||||
}
|
||||
|
||||
#instance,
|
||||
#placeholder,
|
||||
h4 {
|
||||
width: 83%;
|
||||
}
|
||||
|
||||
#apigit {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
#instancelist li {
|
||||
color: #333333;
|
||||
padding: 10px;
|
||||
border-bottom: 1px solid #ccc;
|
||||
margin: 0 auto;
|
||||
max-height: 1.5em;
|
||||
overflow: hidden;
|
||||
min-height: 1.5em;
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
#instancelist li:hover {
|
||||
background-color: #F0F0F0;
|
||||
cursor: pointer;
|
||||
max-height: fit-content;
|
||||
}
|
||||
|
||||
#instancelist li img {
|
||||
width: 70%;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
@keyframes opacity {
|
||||
from {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
to {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
footer {
|
||||
text-align: center;
|
||||
font-size: 12px;
|
||||
padding: 10px;
|
||||
color: #666666;
|
||||
}
|
||||
|
||||
#count {
|
||||
text-decoration: underline dotted #333333;
|
||||
cursor: help;
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
text-underline-offset: 2px;
|
||||
}
|
||||
|
||||
#blocklist {
|
||||
width: 90%;
|
||||
text-align: left;
|
||||
list-style: none;
|
||||
padding: 1rem;
|
||||
}
|
||||
|
||||
#blocklist li {
|
||||
color: #F5F5F5;
|
||||
white-space: nowrap;
|
||||
word-wrap: break-word;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
#blocklist li:hover {
|
||||
white-space: inherit;
|
||||
cursor: pointer;
|
||||
color: #F5F5F5;
|
||||
}
|
||||
|
||||
#blocklist li a,
|
||||
#blocklist li a:hover,
|
||||
#blocklist li a:visited {
|
||||
color: #F5F5F5;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
#blockinstance a,
|
||||
#blockinstance a:hover {
|
||||
color: #F5F5F5;
|
||||
text-decoration: underline;
|
||||
cursor: help;
|
||||
}
|
||||
|
||||
#blockcount {
|
||||
font-weight: bolder;
|
||||
}
|
||||
|
||||
#modal {
|
||||
display: none;
|
||||
position: fixed;
|
||||
z-index: 1;
|
||||
left: 0;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
overflow: auto;
|
||||
scrollbar-width: thin;
|
||||
background-color: rgba(0, 0, 0, 0.4);
|
||||
}
|
||||
|
||||
.modal-content {
|
||||
position: relative;
|
||||
background-color: #F5F5F5;
|
||||
margin: 10px auto;
|
||||
padding: 0;
|
||||
border: 1px solid #888;
|
||||
width: 25%;
|
||||
-webkit-animation-name: animatetop;
|
||||
-webkit-animation-duration: 0.4s;
|
||||
animation-name: animatetop;
|
||||
animation-duration: 0.4s;
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 600px) {
|
||||
.modal-content {
|
||||
width: 90%;
|
||||
}
|
||||
}
|
||||
|
||||
.modal-header {
|
||||
padding: 6px;
|
||||
background-color: #333333;
|
||||
color: #F5F5F5;
|
||||
}
|
||||
|
||||
.modal-body {
|
||||
padding: 6px;
|
||||
}
|
||||
|
||||
.modal-footer {
|
||||
padding: 6px;
|
||||
background-color: #333333;
|
||||
color: #F5F5F5;
|
||||
}
|
||||
|
||||
#closemodal,
|
||||
#download,
|
||||
#capture {
|
||||
color: #aaa;
|
||||
float: right;
|
||||
font-size: 3rem;
|
||||
font-weight: bolder;
|
||||
margin: 0px 15px;
|
||||
}
|
||||
|
||||
#closemodal:hover,
|
||||
#closemodal:focus,
|
||||
#download:hover,
|
||||
#download:focus,
|
||||
#capture:hover,
|
||||
#capture:focus {
|
||||
color: #333333;
|
||||
text-decoration: none;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
@keyframes animatetop {
|
||||
from {
|
||||
top: -300px;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
to {
|
||||
top: 0;
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes animatebottom {
|
||||
from {
|
||||
top: 0;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
to {
|
||||
top: -300px;
|
||||
opacity: 0
|
||||
}
|
||||
}
|
||||
|
||||
h4 {
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
border-left: 1px solid #f5f5f5;
|
||||
border-right: 1px solid #f5f5f5;
|
||||
transition: 0.2s;
|
||||
}
|
||||
|
||||
h4 p {
|
||||
margin: 0.3rem 0;
|
||||
}
|
||||
|
||||
h4:hover {
|
||||
width: 90%;
|
||||
}
|
||||
|
||||
#bounce {
|
||||
display: inline-block;
|
||||
animation: marquee 90s linear infinite;
|
||||
}
|
||||
|
||||
#bounce:hover {
|
||||
animation-play-state: paused;
|
||||
}
|
||||
|
||||
@keyframes marquee {
|
||||
0% {
|
||||
transform: translateX(100vw);
|
||||
}
|
||||
|
||||
100% {
|
||||
transform: translateX(-100%);
|
||||
}
|
||||
}
|
||||
|
||||
#loader-content {
|
||||
z-index: 1;
|
||||
background-color: #0004;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: none;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
overflow: auto;
|
||||
scrollbar-width: thin;
|
||||
}
|
||||
|
||||
#loader {
|
||||
background-color: #f5f5f5;
|
||||
width: fit-content;
|
||||
margin: 50vh auto;
|
||||
z-index: 2;
|
||||
}
|
||||
@ -128,6 +128,15 @@ document.addEventListener('DOMContentLoaded', function () {
|
||||
event.preventDefault()
|
||||
event.stopPropagation()
|
||||
})
|
||||
document.getElementById('darklight').addEventListener('click', function(event) {
|
||||
if(event.target.innerText === '☼') {
|
||||
document.getElementById('css').setAttribute('href', 'light.css')
|
||||
event.target.innerText = '☽'
|
||||
} else {
|
||||
document.getElementById('css').setAttribute('href', 'main.css')
|
||||
event.target.innerText = '☼'
|
||||
}
|
||||
})
|
||||
function keypress(content) {
|
||||
loading()
|
||||
if (timeout) {
|
||||
|
||||
Loading…
Reference in New Issue
Block a user