mirror of
https://github.com/eliasstepanik/vdo.ninja.git
synced 2026-01-11 13:48:38 +00:00
Replaced background-images due to lackin darktheme
This commit is contained in:
lindenkron
parent
60283c8ba4
commit
ed9a0b3d93
59
index.html
59
index.html
@ -271,11 +271,12 @@
|
||||
</span>
|
||||
<div id="mainmenu" class="row" style="opacity: 0;">
|
||||
|
||||
<div id="container-1" title="Add Group Chat to OBS" alt="Add Group Chat to OBS" tabindex="2" role="button" aria-pressed="false" onkeyup="enterPressedClick(event,this);" class="column columnfade pointer rounded card" style=" overflow-y: auto;">
|
||||
<div id="container-1" title="Add Group Chat to OBS" alt="Add Group Chat to OBS" tabindex="2" role="button" aria-pressed="false" onkeyup="enterPressedClick(event,this);" class="column columnfade pointer rounded card">
|
||||
|
||||
<h2>
|
||||
<span data-translate="add-group-chat">Create a Room</span>
|
||||
</h2>
|
||||
<i class="las la-th-large"></i>
|
||||
<div class="container-inner">
|
||||
<br />
|
||||
<br />
|
||||
@ -393,10 +394,11 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="container-3" title="Add your Camera to OBS" onkeyup="enterPressedClick(event,this);" alt="Add your Camera to OBS" tabindex="3" role="button" aria-pressed="false" class="column columnfade pointer rounded card" onclick="previewWebcam()" style=" overflow-y: auto;">
|
||||
<div id="container-3" title="Add your Camera to OBS" onkeyup="enterPressedClick(event,this);" alt="Add your Camera to OBS" tabindex="3" role="button" aria-pressed="false" class="column columnfade pointer rounded card" onclick="previewWebcam()">
|
||||
<h2 id="add_camera">
|
||||
<span data-translate="add-your-camera">Add your Camera to OBS</span>
|
||||
</h2>
|
||||
<i class="las la-video"></i>
|
||||
<div class="container-inner" id="add_camera_inner">
|
||||
<br />
|
||||
<p>
|
||||
@ -565,10 +567,11 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="container-3a" title="Add your Microphone to OBS" onkeyup="enterPressedClick(event,this);" alt="Add your Microphone to OBS" tabindex="3" role="button" aria-pressed="false" class="microphoneBackground column columnfade pointer rounded card hidden" onclick="previewWebcam(true)" style=" overflow-y: auto;">
|
||||
<div id="container-3a" title="Add your Microphone to OBS" onkeyup="enterPressedClick(event,this);" alt="Add your Microphone to OBS" tabindex="3" role="button" aria-pressed="false" class="microphoneBackground column columnfade pointer rounded card hidden" onclick="previewWebcam(true)">
|
||||
<h2 id="add_microphone">
|
||||
<span data-translate="add-your-microphone">Add your Microphone to OBS</span>
|
||||
</h2>
|
||||
<i class="las la-microphone"></i>
|
||||
<div class="outer close">
|
||||
<div class="inner">
|
||||
<label class="labelclass">
|
||||
@ -577,10 +580,11 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="container-2" title="Remote Screenshare into OBS" onkeyup="enterPressedClick(event,this);" alt="Remote Screenshare into OBS" tabindex="4" role="button" aria-pressed="false" class="column columnfade pointer rounded card" style=" overflow-y: auto;">
|
||||
<div id="container-2" title="Remote Screenshare into OBS" onkeyup="enterPressedClick(event,this);" alt="Remote Screenshare into OBS" tabindex="4" role="button" aria-pressed="false" class="column columnfade pointer rounded card">
|
||||
<h2 id="add_screen">
|
||||
<span data-translate="remote-screenshare-obs">Remote Screenshare into OBS</span>
|
||||
</h2>
|
||||
<i class="las la-desktop"></i>
|
||||
<div class="container-inner">
|
||||
<span>
|
||||
<video id="screenshare" autoplay="true" muted="true" loop src="./media/screenshare.webm" class="lazy" style='background-image: unset;'></video>
|
||||
@ -656,10 +660,11 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="container-4" tabindex="5" alt="Create Reusable Invite" onkeyup="enterPressedClick(event,this);" onclick="loadQR();" title="Create Reusable Invite" role="button" aria-pressed="false" class="column columnfade pointer rounded card" style=" overflow-y: auto;">
|
||||
<div id="container-4" tabindex="5" alt="Create Reusable Invite" onkeyup="enterPressedClick(event,this);" onclick="loadQR();" title="Create Reusable Invite" role="button" aria-pressed="false" class="column columnfade pointer rounded card">
|
||||
<h2>
|
||||
<span data-translate="create-reusable-invite">Create Reusable Invite</span>
|
||||
</h2>
|
||||
<i class="las la-paper-plane"></i>
|
||||
<div id="gencontent2" style="display:none; max-height: 100%;min-height: 90%;"></div>
|
||||
<div id="gencontent" class="container-inner">
|
||||
|
||||
@ -785,10 +790,10 @@
|
||||
|
||||
<div id="dropButton" onclick="dropDownButtonAction()" title="More Options"><i class="las la-chevron-down" ></i></div>
|
||||
|
||||
<div id="container-5" class="column columnfade pointer rounded card hidden" style=" overflow-y: auto;">
|
||||
<div id="container-5" class="column columnfade pointer rounded card hidden">
|
||||
<h2><span data-translate="share-local-video-file">Stream Media File</span></h2>
|
||||
<i class="las la-file-video"></i>
|
||||
<div class="container-inner">
|
||||
|
||||
<br /><br />
|
||||
<span data-translate="select-the-video-files-to-share">SELECT THE VIDEO FILES TO SHARE</span><br /><br />
|
||||
<input id="fileselector" onchange="session.publishFile(this,event);" type="file" accept="video/*,audio/*" alt="Hold CTRL (or CMD) to select multiple files" title="Hold CTRL (or CMD) to select multiple files" multiple/>
|
||||
@ -819,9 +824,9 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="container-6" class="column columnfade pointer rounded card hidden" style=" overflow-y: auto;">
|
||||
<div id="container-6" class="column columnfade pointer rounded card hidden">
|
||||
<h2><span data-translate="share-website-iframe">Share Website</span></h2>
|
||||
<i style="margin-top:30px;font-size:560%;overflow:hidden;" class="las la-broadcast-tower"></i>
|
||||
<i class="las la-broadcast-tower"></i>
|
||||
<div class="container-inner">
|
||||
<br />
|
||||
<div id="previewIframe"></div>
|
||||
@ -850,49 +855,49 @@
|
||||
|
||||
</div>
|
||||
|
||||
<div id="container-7" class="column columnfade pointer rounded card hidden" style="overflow: hidden;" onclick="window.location = './speedtest.html';">
|
||||
<div id="container-7" class="column columnfade pointer rounded card hidden" onclick="window.location = './speedtest.html';">
|
||||
<h2><span data-translate="run-a-speed-test">Run a Speed Test</span></h2>
|
||||
<i style="margin-top:30px;font-size:600%;overflow:hidden;" class="las la-tachometer-alt"></i>
|
||||
<i class="las la-tachometer-alt"></i>
|
||||
</div>
|
||||
|
||||
<div id="container-8" class="column columnfade pointer rounded card hidden" style="overflow: hidden;" onclick="window.location = './mixer.html';">
|
||||
<div id="container-8" class="column columnfade pointer rounded card hidden" onclick="window.location = './mixer.html';">
|
||||
<h2><span data-translate="try-the-mixer-out">Custom Mixed Layouts</span></h2>
|
||||
<i style="margin-top:30px;font-size:600%;overflow:hidden;" class="las la-blender"></i>
|
||||
<i class="las la-blender"></i>
|
||||
</div>
|
||||
|
||||
<div id="container-14" class="column columnfade pointer rounded card hidden" style="overflow: hidden;" onclick="window.location = 'https://versus.cam';">
|
||||
<div id="container-14" class="column columnfade pointer rounded card hidden" onclick="window.location = 'https://versus.cam';">
|
||||
<h2><span data-translate="try-out-versus-cam">Multi-Stream Monitor</span></h2>
|
||||
<i style="margin-top:30px;font-size:600%;overflow:hidden;" class="las la-gamepad"></i>
|
||||
<i class="las la-gamepad"></i>
|
||||
</div>
|
||||
|
||||
<div id="container-15" class="column columnfade pointer rounded card hidden" style="overflow: hidden;" onclick="window.location = './comms.html';">
|
||||
<div id="container-15" class="column columnfade pointer rounded card hidden" onclick="window.location = './comms.html';">
|
||||
<h2><span data-translate="voice-comms-app">Group Voice Comms</span></h2>
|
||||
<i style="margin-top:30px;font-size:600%;overflow:hidden;" class="las la-comments"></i>
|
||||
<i class="las la-comments"></i>
|
||||
</div>
|
||||
|
||||
<div id="container-9" class="column columnfade pointer rounded card hidden" style="overflow: hidden;" onclick="window.location = 'https://guides.vdo.ninja';">
|
||||
<div id="container-9" class="column columnfade pointer rounded card hidden" onclick="window.location = 'https://guides.vdo.ninja';">
|
||||
<h2><span data-translate="read-the-guides">Basic Usage Guides</span></h2>
|
||||
<i style="margin-top:30px;font-size:600%;overflow:hidden;" class="las la-book-open"></i>
|
||||
<i class="las la-book-open"></i>
|
||||
</div>
|
||||
|
||||
<div id="container-13" class="column columnfade pointer rounded card hidden" style="overflow: hidden;" onclick="window.location = 'https://linkgen.vdo.ninja';">
|
||||
<div id="container-13" class="column columnfade pointer rounded card hidden" onclick="window.location = 'https://linkgen.vdo.ninja';">
|
||||
<h2><span data-translate="wizard-link-generator">Wizard Link Generator</span></h2>
|
||||
<i style="margin-top:30px;font-size:600%;overflow:hidden;" class="las la-hat-wizard"></i>
|
||||
<i class="las la-hat-wizard"></i>
|
||||
</div>
|
||||
|
||||
<div id="container-10" class="column columnfade pointer rounded card hidden" style="overflow: hidden;" onclick="window.location = 'https://docs.vdo.ninja';">
|
||||
<div id="container-10" class="column columnfade pointer rounded card hidden" onclick="window.location = 'https://docs.vdo.ninja';">
|
||||
<h2><span data-translate="get-full-documentation">Full Documentation</span></h2>
|
||||
<i style="margin-top:30px;font-size:600%;overflow:hidden;" class="las la-info"></i>
|
||||
<i class="las la-info"></i>
|
||||
</div>
|
||||
|
||||
<div id="container-11" class="column columnfade pointer rounded card hidden" style="overflow: hidden;" onclick="window.location = 'https://github.vdo.ninja';">
|
||||
<div id="container-11" class="column columnfade pointer rounded card hidden" onclick="window.location = 'https://github.vdo.ninja';">
|
||||
<h2><span data-translate="get-the-source-code">Source Code</span></h2>
|
||||
<i style="margin-top:30px;font-size:600%;overflow:hidden;" class="las la-code-branch"></i>
|
||||
<i class="las la-code-branch"></i>
|
||||
</div>
|
||||
|
||||
<div id="container-12" class="column columnfade pointer rounded card hidden" style="overflow: hidden;" onclick="window.location = 'https://docs.vdo.ninja/getting-started/sponsor';">
|
||||
<div id="container-12" class="column columnfade pointer rounded card hidden" onclick="window.location = 'https://docs.vdo.ninja/getting-started/sponsor';">
|
||||
<h2><span data-translate="show-your-support">Show Your Support</span></h2>
|
||||
<i style="margin-top:30px;font-size:600%;overflow:hidden;" class="las la-heartbeat"></i>
|
||||
<i class="las la-heartbeat"></i>
|
||||
</div>
|
||||
|
||||
<p></p>
|
||||
|
||||
39
main.css
39
main.css
@ -2140,9 +2140,9 @@ label {
|
||||
.outer:hover .inner:after {
|
||||
bottom: 0;
|
||||
}
|
||||
.microphoneBackground{
|
||||
/* .microphoneBackground{
|
||||
background-image: url("data:image/svg+xml,%0A%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath d='M 13 4 C 11.90625 4 11 4.90625 11 6 L 11 18 C 11 19.09375 11.90625 20 13 20 L 19 20 C 20.09375 20 21 19.09375 21 18 L 21 6 C 21 4.90625 20.09375 4 19 4 Z M 13 6 L 19 6 L 19 18 L 13 18 Z M 7 14 L 7 18 C 7 21.300781 9.699219 24 13 24 L 15 24 L 15 26 L 11 26 L 11 28 L 21 28 L 21 26 L 17 26 L 17 24 L 19 24 C 22.300781 24 25 21.300781 25 18 L 25 14 L 23 14 L 23 18 C 23 20.21875 21.21875 22 19 22 L 13 22 C 10.78125 22 9 20.21875 9 18 L 9 14 Z'/%3E%3C/svg%3E")!important;
|
||||
}
|
||||
} */
|
||||
|
||||
#dropButton{
|
||||
font-size: 2em;
|
||||
@ -2256,7 +2256,7 @@ span[data-action-type="stats-graphs-details-container"]>span{
|
||||
margin: 1.8%;
|
||||
text-align: center;
|
||||
}
|
||||
#container-1 {
|
||||
/* #container-1 {
|
||||
background-repeat: no-repeat;
|
||||
background-size: 80px;
|
||||
background-position: 50% 65%;
|
||||
@ -2294,7 +2294,7 @@ span[data-action-type="stats-graphs-details-container"]>span{
|
||||
background-size: 80px;
|
||||
background-position: 50% 65%;
|
||||
background-image: url(data:image/svg+xml;utf8;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCAxMjkgMTI5IiBlbmFibGUtYmFja2dyb3VuZD0ibmV3IDAgMCAxMjkgMTI5IiB3aWR0aD0iNTEycHgiIGhlaWdodD0iNTEycHgiPgogIDxnPgogICAgPGc+CiAgICAgIDxwYXRoIGQ9Im0xOC43LDEyMi41aDkxLjZjMi4zLDAgNC4xLTEuOCA0LjEtNC4xdi0xMDcuOWMwLTIuMy0xLjgtNC4xLTQuMS00LjFoLTY4LjdjLTAuMywwLTAuNywwLTEsMC4xLTAuMSwwLTAuMiwwLjEtMC4yLDAuMS0wLjMsMC4xLTAuNSwwLjItMC44LDAuMy0wLjEsMC4xLTAuMiwwLjEtMC4zLDAuMi0wLjMsMC4yLTAuNiwwLjQtMC44LDAuN2wtMjIuOSwyN2MtMC4zLDAuMy0wLjUsMC43LTAuNywxLjEtMC4xLDAuMS0wLjEsMC4zLTAuMSwwLjQtMC4xLDAuMy0wLjEsMC42LTAuMiwwLjkgMCwwLjEgMCwwLjEgMCwwLjJ2ODAuOWMtMS4wNjU4MWUtMTQsMi40IDEuOSw0LjIgNC4xLDQuMnptMTguOC0xMDAuOHYxMS44aC0xMGwxMC0xMS44em0tMTQuNywxOS45aDE4LjhjMi4zLDAgNC4xLTEuOCA0LjEtNC4xdi0yMi45aDYwLjV2OTkuN2gtODMuNHYtNzIuN3oiIGZpbGw9IiMwMDAwMDAiLz4KICAgICAgPHBhdGggZD0ibTk0LDUwLjVoLTU5Yy0yLjMsMC00LjEsMS44LTQuMSw0LjEgMCwyLjMgMS44LDQuMSA0LjEsNC4xaDU5YzIuMywwIDQuMS0xLjggNC4xLTQuMSAwLTIuMy0xLjgtNC4xLTQuMS00LjF6IiBmaWxsPSIjMDAwMDAwIi8+CiAgICAgIDxwYXRoIGQ9Im05NCw3MC4zaC01OWMtMi4zLDAtNC4xLDEuOC00LjEsNC4xIDAsMi4zIDEuOCw0LjEgNC4xLDQuMWg1OWMyLjMsMCA0LjEtMS44IDQuMS00LjEgMC0yLjItMS44LTQuMS00LjEtNC4xeiIgZmlsbD0iIzAwMDAwMCIvPgogICAgPC9nPgogIDwvZz4KPC9zdmc+Cg==)
|
||||
}
|
||||
} */
|
||||
|
||||
.controlVideoBox {
|
||||
position:relative;
|
||||
@ -2314,9 +2314,6 @@ span[data-action-type="stats-graphs-details-container"]>span{
|
||||
padding: 1px 4px;
|
||||
}
|
||||
|
||||
#add_screen {
|
||||
padding-bottom: 20px;
|
||||
}
|
||||
.soloButton{
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
@ -4698,6 +4695,8 @@ input:checked + .slider:before {
|
||||
content: "\f51f"; }
|
||||
.la-random:before {
|
||||
content: "\f074"; }
|
||||
.la-file-video:before {
|
||||
content: "\f1c8"; }
|
||||
|
||||
body.darktheme {
|
||||
color: white;
|
||||
@ -5151,6 +5150,32 @@ input[type='range'] {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* Main page icons */
|
||||
#container-1 > i,
|
||||
#container-2 > i,
|
||||
#container-3 > i,
|
||||
#container-3a > i,
|
||||
#container-4 > i,
|
||||
#container-5 > i,
|
||||
#container-6 > i,
|
||||
#container-7 > i,
|
||||
#container-8 > i,
|
||||
#container-9 > i,
|
||||
#container-10 > i,
|
||||
#container-11 > i,
|
||||
#container-12 > i,
|
||||
#container-13 > i,
|
||||
#container-14 > i,
|
||||
#container-15 > i {
|
||||
margin-top: 20px;
|
||||
font-size: 530%;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.card {
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
#passwordBasicInput {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user