mirror of
https://github.com/0dayCTF/reverse-shell-generator.git
synced 2024-12-18 10:56:10 +00:00
css changes
This commit is contained in:
parent
29647c1cd2
commit
ccda2bb809
BIN
assets/ComicMono.ttf
Normal file
BIN
assets/ComicMono.ttf
Normal file
Binary file not shown.
@ -1,22 +1,62 @@
|
||||
[data-theme="dark"] {
|
||||
background-color: pink !important;
|
||||
.prompt-sign {
|
||||
position: absolute;
|
||||
top: 25px;
|
||||
left: 40px;
|
||||
pointer-events: none;
|
||||
font-size: 1em;
|
||||
}
|
||||
|
||||
[data-theme="dark"] .bg-light {
|
||||
background-color: #333 !important;
|
||||
.highlighted-parameter {
|
||||
color: #c0c0ba;
|
||||
font-weight: bold;
|
||||
font-size: 1em;
|
||||
}
|
||||
|
||||
[data-theme="dark"] .bg-white {
|
||||
background-color: #000 !important;
|
||||
.highlighted-warning {
|
||||
color: red;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
[data-theme="dark"] .rainbow {
|
||||
font-family: 'Pacifico', cursive;
|
||||
text-shadow: 2px 2px 4px #000000;
|
||||
font-size:40px;
|
||||
-webkit-animation: rainbow 5s infinite;
|
||||
-ms-animation: rainbow 5s infinite;
|
||||
animation: rainbow 5s infinite;
|
||||
font-family: ComicMono;
|
||||
src: url(ComicMono.ttf);
|
||||
.custom-switch label {
|
||||
cursor: pointer;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
_:-ms-fullscreen,
|
||||
:root body {
|
||||
/* IE11 */
|
||||
overflow-y: scroll;
|
||||
}
|
||||
|
||||
#listener-command {
|
||||
border: none !important;
|
||||
border-radius: 5px;
|
||||
box-shadow: 10px 10px 20px 0px rgba(0, 0, 0, 0.75);
|
||||
}
|
||||
|
||||
#reverse-shell-command {
|
||||
border: none !important;
|
||||
border-radius: 5px;
|
||||
box-shadow: 10px 10px 20px 0px rgba(0, 0, 0, 0.75);
|
||||
background-color: rgb(70, 70, 70);
|
||||
}
|
||||
|
||||
.custom-select {
|
||||
background-color: #646464;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.container {
|
||||
padding: 10px;
|
||||
border-radius: 20px;
|
||||
box-shadow: 10px 0px 20px 0px rgba(0, 0, 0, 0.75);
|
||||
max-height: 1000px;
|
||||
}
|
||||
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5 {
|
||||
color: white;
|
||||
}
|
||||
|
1
css/dark-mode.min.css
vendored
Normal file
1
css/dark-mode.min.css
vendored
Normal file
@ -0,0 +1 @@
|
||||
.prompt-sign{position:absolute;top:25px;left:40px;pointer-events:none;font-size:1em}.highlighted-parameter{color:#c0c0ba;font-weight:700;font-size:1em}.highlighted-warning{color:red;font-weight:700}.custom-switch label{cursor:pointer;user-select:none}_:-ms-fullscreen,:root body{overflow-y:scroll}#listener-command{border:none!important;border-radius:5px;box-shadow:10px 10px 20px 0 rgba(0,0,0,.75)}#reverse-shell-command{border:none!important;border-radius:5px;box-shadow:10px 10px 20px 0 rgba(0,0,0,.75);background-color:#464646}.custom-select{background-color:#646464;color:#fff}.container{padding:10px;border-radius:20px;box-shadow:10px 0 20px 0 rgba(0,0,0,.75);max-height:1000px}h1,h2,h3,h4,h5{color:#fff}
|
277
css/light-mode.css
Normal file
277
css/light-mode.css
Normal file
@ -0,0 +1,277 @@
|
||||
/*
|
||||
Ain't got time for using CSS the right way. !important everything!
|
||||
*/
|
||||
|
||||
[data-theme="light"] {
|
||||
background-color: pink !important;
|
||||
}
|
||||
|
||||
[data-theme="light"] .card {
|
||||
background-color: rgb(175, 139, 173) !important;
|
||||
color:#000;
|
||||
}
|
||||
|
||||
[data-theme="light"] .bg-white {
|
||||
background-color: rgb(221, 215, 215) !important;
|
||||
}
|
||||
|
||||
[data-theme="light"] .bg-dark {
|
||||
background-color: rgb(231, 212, 224) !important;
|
||||
}
|
||||
|
||||
[data-theme="light"] .rainbow {
|
||||
text-shadow: 2px 2px 4px #000;
|
||||
font-size: 40px;
|
||||
-webkit-animation: rainbow 5s infinite;
|
||||
-ms-animation: rainbow 5s infinite;
|
||||
animation: rainbow 5s infinite;
|
||||
font-family: 'Comic Mono';
|
||||
}
|
||||
|
||||
[data-theme="light"] .prompt-sign {
|
||||
position: absolute;
|
||||
top: 25px;
|
||||
left: 40px;
|
||||
pointer-events: none;
|
||||
font-size: 1em;
|
||||
color: #2e3e86;
|
||||
}
|
||||
|
||||
[data-theme="light"] .input-group-text {
|
||||
background-color:#f1c6ce;
|
||||
color:#000;
|
||||
}
|
||||
|
||||
[data-theme="light"] .btn {
|
||||
background-color: #a56096;
|
||||
color:#000;
|
||||
border-color:#a56096;
|
||||
}
|
||||
|
||||
[data-theme="light"] .highlighted-parameter {
|
||||
color: #7223b5;
|
||||
font-weight: bold;
|
||||
font-size: 1em;
|
||||
}
|
||||
|
||||
[data-theme="light"] .highlighted-warning {
|
||||
color: red;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
[data-theme="light"] .custom-switch label {
|
||||
cursor: pointer;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
[data-theme="light"] .custom-control-input:checked~.custom-control-label::before{
|
||||
background-color:#7223b5;
|
||||
}
|
||||
|
||||
[data-theme="light"] #listener-command {
|
||||
border: none !important;
|
||||
border-radius: 5px;
|
||||
box-shadow: 10px 10px 20px 0px rgba(153, 28, 143, 0.75);
|
||||
background-color: rgb(45, 139, 135);
|
||||
color:#000;
|
||||
}
|
||||
|
||||
[data-theme="light"] #reverse-shell-command {
|
||||
border: none !important;
|
||||
border-radius: 5px;
|
||||
box-shadow: 10px 10px 20px 0px rgba(153, 28, 143, 0.75);
|
||||
background-color: rgb(45, 139, 135);
|
||||
color:#000;
|
||||
}
|
||||
|
||||
[data-theme="light"] .custom-select {
|
||||
background-color: #f1c6ce;
|
||||
color:#000;
|
||||
border-color:#a56096;
|
||||
}
|
||||
|
||||
[data-theme="light"] .custom-control-input:checked {
|
||||
color:#000;
|
||||
}
|
||||
|
||||
[data-theme="light"] a {
|
||||
background-color:#f1c6ce;
|
||||
color:#000;
|
||||
}
|
||||
|
||||
[data-theme="light"] .list-group-item{
|
||||
color:#000;
|
||||
}
|
||||
|
||||
[data-theme="light"] .list-group-item.active {
|
||||
background-color:#a56096;
|
||||
border-color: #000;
|
||||
}
|
||||
|
||||
[data-theme="light"] .list-group-item:hover {
|
||||
background-color: #a56096;
|
||||
}
|
||||
|
||||
[data-theme="light"] .list-group-item.hover {
|
||||
background-color:rgba(153, 28, 143, 0.75);
|
||||
}
|
||||
|
||||
[data-theme="light"] .container {
|
||||
padding: 10px;
|
||||
border-radius: 20px;
|
||||
box-shadow: 10px 0px 20px 0px rgba(153, 28, 143, 0.75);
|
||||
max-height: 1000px;
|
||||
}
|
||||
|
||||
[data-theme="light"] .card-title {
|
||||
color: #000 !important;
|
||||
}
|
||||
|
||||
[data-theme="light"] .custom-control-label {
|
||||
color: black;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: "Comic Mono";
|
||||
src: url(../assets/ComicMono.ttf);
|
||||
}
|
||||
|
||||
@-webkit-keyframes rainbow {
|
||||
0% {
|
||||
color: orange;
|
||||
}
|
||||
|
||||
10% {
|
||||
color: purple;
|
||||
}
|
||||
|
||||
20% {
|
||||
color: red;
|
||||
}
|
||||
|
||||
30% {
|
||||
color: CadetBlue;
|
||||
}
|
||||
|
||||
40% {
|
||||
color: yellow;
|
||||
}
|
||||
|
||||
50% {
|
||||
color: coral;
|
||||
}
|
||||
|
||||
60% {
|
||||
color: green;
|
||||
}
|
||||
|
||||
70% {
|
||||
color: cyan;
|
||||
}
|
||||
|
||||
80% {
|
||||
color: DeepPink;
|
||||
}
|
||||
|
||||
90% {
|
||||
color: DodgerBlue;
|
||||
}
|
||||
|
||||
100% {
|
||||
color: orange;
|
||||
}
|
||||
}
|
||||
|
||||
/* Internet Explorer */
|
||||
@-ms-keyframes rainbow {
|
||||
0% {
|
||||
color: orange;
|
||||
}
|
||||
|
||||
10% {
|
||||
color: purple;
|
||||
}
|
||||
|
||||
20% {
|
||||
color: red;
|
||||
}
|
||||
|
||||
30% {
|
||||
color: CadetBlue;
|
||||
}
|
||||
|
||||
40% {
|
||||
color: yellow;
|
||||
}
|
||||
|
||||
50% {
|
||||
color: coral;
|
||||
}
|
||||
|
||||
60% {
|
||||
color: green;
|
||||
}
|
||||
|
||||
70% {
|
||||
color: cyan;
|
||||
}
|
||||
|
||||
80% {
|
||||
color: DeepPink;
|
||||
}
|
||||
|
||||
90% {
|
||||
color: DodgerBlue;
|
||||
}
|
||||
|
||||
100% {
|
||||
color: orange;
|
||||
}
|
||||
}
|
||||
|
||||
/* Standar Syntax */
|
||||
@keyframes rainbow {
|
||||
0% {
|
||||
color: orange;
|
||||
}
|
||||
|
||||
10% {
|
||||
color: purple;
|
||||
}
|
||||
|
||||
20% {
|
||||
color: red;
|
||||
}
|
||||
|
||||
30% {
|
||||
color: CadetBlue;
|
||||
}
|
||||
|
||||
40% {
|
||||
color: yellow;
|
||||
}
|
||||
|
||||
50% {
|
||||
color: coral;
|
||||
}
|
||||
|
||||
60% {
|
||||
color: green;
|
||||
}
|
||||
|
||||
70% {
|
||||
color: cyan;
|
||||
}
|
||||
|
||||
80% {
|
||||
color: DeepPink;
|
||||
}
|
||||
|
||||
90% {
|
||||
color: DodgerBlue;
|
||||
}
|
||||
|
||||
100% {
|
||||
color: orange;
|
||||
}
|
||||
}
|
1
css/light-mode.min.css
vendored
Normal file
1
css/light-mode.min.css
vendored
Normal file
@ -0,0 +1 @@
|
||||
[data-theme=light]{background-color:pink!important}[data-theme=light] .card{background-color:#af8bad!important;color:#000}[data-theme=light] .bg-white{background-color:#ddd7d7!important}[data-theme=light] .bg-dark{background-color:#e7d4e0!important}[data-theme=light] .rainbow{text-shadow:2px 2px 4px #000;font-size:40px;-webkit-animation:rainbow 5s infinite;-ms-animation:rainbow 5s infinite;animation:rainbow 5s infinite;font-family:'Comic Mono'}[data-theme=light] .prompt-sign{position:absolute;top:25px;left:40px;pointer-events:none;font-size:1em;color:#2e3e86}[data-theme=light] .input-group-text{background-color:#f1c6ce;color:#000}[data-theme=light] .btn{background-color:#a56096;color:#000;border-color:#a56096}[data-theme=light] .highlighted-parameter{color:#7223b5;font-weight:700;font-size:1em}[data-theme=light] .highlighted-warning{color:red;font-weight:700}[data-theme=light] .custom-switch label{cursor:pointer;user-select:none}[data-theme=light] .custom-control-input:checked~.custom-control-label::before{background-color:#7223b5}[data-theme=light] #listener-command{border:none!important;border-radius:5px;box-shadow:10px 10px 20px 0 rgba(153,28,143,.75);background-color:#2d8b87;color:#000}[data-theme=light] #reverse-shell-command{border:none!important;border-radius:5px;box-shadow:10px 10px 20px 0 rgba(153,28,143,.75);background-color:#2d8b87;color:#000}[data-theme=light] .custom-select{background-color:#f1c6ce;color:#000;border-color:#a56096}[data-theme=light] .custom-control-input:checked{color:#000}[data-theme=light] a{background-color:#f1c6ce;color:#000}[data-theme=light] .list-group-item{color:#000}[data-theme=light] .list-group-item.active{background-color:#a56096;border-color:#000}[data-theme=light] .list-group-item:hover{background-color:#a56096}[data-theme=light] .list-group-item.hover{background-color:rgba(153,28,143,.75)}[data-theme=light] .container{padding:10px;border-radius:20px;box-shadow:10px 0 20px 0 rgba(153,28,143,.75);max-height:1000px}[data-theme=light] .card-title{color:#000!important}[data-theme=light] .custom-control-label{color:#000}@font-face{font-family:"Comic Mono";src:url(../assets/ComicMono.ttf)}@-webkit-keyframes rainbow{0%{color:orange}10%{color:purple}20%{color:red}30%{color:#5f9ea0}40%{color:#ff0}50%{color:coral}60%{color:green}70%{color:#0ff}80%{color:#ff1493}90%{color:#1e90ff}100%{color:orange}}@-ms-keyframes rainbow{0%{color:orange}10%{color:purple}20%{color:red}30%{color:#5f9ea0}40%{color:#ff0}50%{color:coral}60%{color:green}70%{color:#0ff}80%{color:#ff1493}90%{color:#1e90ff}100%{color:orange}}@keyframes rainbow{0%{color:orange}10%{color:purple}20%{color:red}30%{color:#5f9ea0}40%{color:#ff0}50%{color:coral}60%{color:green}70%{color:#0ff}80%{color:#ff1493}90%{color:#1e90ff}100%{color:orange}}
|
254
index.html
254
index.html
@ -10,226 +10,18 @@
|
||||
<script src="assets/jquery-3.5.1.slim.min.js"></script>
|
||||
<script src="assets/popper-1.16.1.min.js"></script>
|
||||
<script src="assets/bootstrap-4.5.2.min.js"></script>
|
||||
<link rel="stylesheet" href="css/dark-mode.css">
|
||||
|
||||
<style>
|
||||
@-webkit-keyframes rainbow {
|
||||
0% {
|
||||
color: orange;
|
||||
}
|
||||
|
||||
10% {
|
||||
color: purple;
|
||||
}
|
||||
|
||||
20% {
|
||||
color: red;
|
||||
}
|
||||
|
||||
30% {
|
||||
color: CadetBlue;
|
||||
}
|
||||
|
||||
40% {
|
||||
color: yellow;
|
||||
}
|
||||
|
||||
50% {
|
||||
color: coral;
|
||||
}
|
||||
|
||||
60% {
|
||||
color: green;
|
||||
}
|
||||
|
||||
70% {
|
||||
color: cyan;
|
||||
}
|
||||
|
||||
80% {
|
||||
color: DeepPink;
|
||||
}
|
||||
|
||||
90% {
|
||||
color: DodgerBlue;
|
||||
}
|
||||
|
||||
100% {
|
||||
color: orange;
|
||||
}
|
||||
}
|
||||
|
||||
/* Internet Explorer */
|
||||
@-ms-keyframes rainbow {
|
||||
0% {
|
||||
color: orange;
|
||||
}
|
||||
|
||||
10% {
|
||||
color: purple;
|
||||
}
|
||||
|
||||
20% {
|
||||
color: red;
|
||||
}
|
||||
|
||||
30% {
|
||||
color: CadetBlue;
|
||||
}
|
||||
|
||||
40% {
|
||||
color: yellow;
|
||||
}
|
||||
|
||||
50% {
|
||||
color: coral;
|
||||
}
|
||||
|
||||
60% {
|
||||
color: green;
|
||||
}
|
||||
|
||||
70% {
|
||||
color: cyan;
|
||||
}
|
||||
|
||||
80% {
|
||||
color: DeepPink;
|
||||
}
|
||||
|
||||
90% {
|
||||
color: DodgerBlue;
|
||||
}
|
||||
|
||||
100% {
|
||||
color: orange;
|
||||
}
|
||||
}
|
||||
|
||||
/* Standar Syntax */
|
||||
@keyframes rainbow {
|
||||
0% {
|
||||
color: orange;
|
||||
}
|
||||
|
||||
10% {
|
||||
color: purple;
|
||||
}
|
||||
|
||||
20% {
|
||||
color: red;
|
||||
}
|
||||
|
||||
30% {
|
||||
color: CadetBlue;
|
||||
}
|
||||
|
||||
40% {
|
||||
color: yellow;
|
||||
}
|
||||
|
||||
50% {
|
||||
color: coral;
|
||||
}
|
||||
|
||||
60% {
|
||||
color: green;
|
||||
}
|
||||
|
||||
70% {
|
||||
color: cyan;
|
||||
}
|
||||
|
||||
80% {
|
||||
color: DeepPink;
|
||||
}
|
||||
|
||||
90% {
|
||||
color: DodgerBlue;
|
||||
}
|
||||
|
||||
100% {
|
||||
color: orange;
|
||||
}
|
||||
}
|
||||
|
||||
.prompt-sign {
|
||||
position: absolute;
|
||||
top: 25px;
|
||||
left: 40px;
|
||||
pointer-events: none;
|
||||
font-size: 1em;
|
||||
}
|
||||
|
||||
.highlighted-parameter {
|
||||
color: #c0c0ba;
|
||||
font-weight: bold;
|
||||
font-size: 1em;
|
||||
}
|
||||
|
||||
.highlighted-warning {
|
||||
color: red;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.custom-switch label {
|
||||
cursor: pointer;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
_:-ms-fullscreen,
|
||||
:root body {
|
||||
/* IE11 */
|
||||
overflow-y: scroll;
|
||||
}
|
||||
|
||||
#listener-command {
|
||||
border: none !important;
|
||||
border-radius: 5px;
|
||||
box-shadow: 10px 10px 20px 0px rgba(0, 0, 0, 0.75);
|
||||
}
|
||||
|
||||
#reverse-shell-command {
|
||||
border: none !important;
|
||||
border-radius: 5px;
|
||||
box-shadow: 10px 10px 20px 0px rgba(0, 0, 0, 0.75);
|
||||
background-color: rgb(70, 70, 70)
|
||||
}
|
||||
|
||||
.custom-select {
|
||||
background-color: #646464;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.container {
|
||||
padding: 10px;
|
||||
border-radius: 20px;
|
||||
box-shadow: 10px 0px 20px 0px rgba(0, 0, 0, 0.75);
|
||||
max-height: 1000px;
|
||||
}
|
||||
|
||||
h1,
|
||||
h2 {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
h1 {
|
||||
color: rgba(100, 50, 255, .8);
|
||||
font-family: 'ComicMono';
|
||||
color: #212121;
|
||||
}
|
||||
</style>
|
||||
<link rel="stylesheet" href="css/dark-mode.min.css">
|
||||
<link rel="stylesheet" href="css/light-mode.min.css">
|
||||
</head>
|
||||
|
||||
<body class="bg-black">
|
||||
<div class="container d-flex flex-column vh-100">
|
||||
<div class="custom-control custom-switch float-right">
|
||||
<input id="darkSwitch" type="checkbox" class="custom-control-input">
|
||||
<label for="darkSwitch" class="custom-control-label small pr-2 pb-1" style="padding-top:2px"
|
||||
data-toggle="tooltip" title="Toggle Dark Mode">🌓
|
||||
<input id="lightSwitch" type="checkbox" class="custom-control-input">
|
||||
<label for="lightSwitch" class="custom-control-label small pr-2 pb-1" style="padding-top:2px"
|
||||
data-toggle="tooltip" title="Toggle Light Mode">Light Mode 🌓
|
||||
</label>
|
||||
</div>
|
||||
<script src="js/dark-mode-switch.min.js"></script>
|
||||
|
||||
<!-- Header -->
|
||||
<div class="mb-auto row justify-content-center mt-3 mb-5">
|
||||
@ -239,7 +31,7 @@
|
||||
|
||||
<div class="row">
|
||||
|
||||
<!-- Step 1 -->
|
||||
<!-- Configuration -->
|
||||
<div class="col-12 col-md-6 mb-4">
|
||||
<div class="card shadow h-100">
|
||||
<div class="card-body">
|
||||
@ -294,17 +86,17 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- /Step 1 -->
|
||||
<!-- /Configuration -->
|
||||
|
||||
<!-- Step 2 -->
|
||||
<!-- Listener -->
|
||||
<div class="col-12 col-md-6 mb-4">
|
||||
<div class="card shadow h-100">
|
||||
<div class="card-body">
|
||||
|
||||
<!-- Advanced switch -->
|
||||
<div class="custom-control custom-switch float-right">
|
||||
<input id="step2-advanced-switch" type="checkbox" class="custom-control-input" checked>
|
||||
<label for="step2-advanced-switch" class="custom-control-label small pr-2 pb-1"
|
||||
<input id="listener-advanced-switch" type="checkbox" class="custom-control-input" checked>
|
||||
<label for="listener-advanced-switch" class="custom-control-label small pr-2 pb-1"
|
||||
style="padding-top:2px" data-toggle="tooltip" title="Display advanced settings">
|
||||
Advanced
|
||||
</label>
|
||||
@ -317,14 +109,14 @@
|
||||
<!-- Command -->
|
||||
<div class="row justify-content-center">
|
||||
<div class="col-auto position-relative" style="min-width: 300px">
|
||||
<pre class="prompt-sign">$</pre>
|
||||
<pre class="prompt-sign">🚀</pre>
|
||||
<pre id="listener-command" class="bg-dark border text-wrap text-break p-4 pl-5 mb-2"
|
||||
style="outline: none; font-size:1em;" contenteditable="true"></pre>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Advanced section-->
|
||||
<form class="row justify-content-center collapse" id="step2-advanced">
|
||||
<form class="row justify-content-center collapse" id="listener-advanced">
|
||||
<label for="listener-selection" class="col-auto col-form-label">Type</label>
|
||||
<div class="col-auto">
|
||||
<select class="custom-select" id="listener-selection">
|
||||
@ -348,14 +140,14 @@
|
||||
|
||||
</div>
|
||||
|
||||
<!-- Step 3 -->
|
||||
<!-- Reverse Shell -->
|
||||
<div class="card shadow mb-5">
|
||||
<div class="card-body">
|
||||
|
||||
<!-- Advanced switch -->
|
||||
<div class="custom-control custom-switch float-right">
|
||||
<input id="step3-advanced-switch" type="checkbox" class="custom-control-input" checked>
|
||||
<label for="step3-advanced-switch" class="custom-control-label small pr-2 pb-1"
|
||||
<input id="revshell-advanced-switch" type="checkbox" class="custom-control-input" checked>
|
||||
<label for="revshell-advanced-switch" class="custom-control-label small pr-2 pb-1"
|
||||
style="padding-top:2px" data-toggle="tooltip" title="Display advanced settings">
|
||||
Advanced
|
||||
</label>
|
||||
@ -380,14 +172,14 @@
|
||||
<!-- Command -->
|
||||
<div class="row flex-grow-1">
|
||||
<div class="col position-relative">
|
||||
<pre class="prompt-sign">$</pre>
|
||||
<pre class="prompt-sign">🚀</pre>
|
||||
<pre id="reverse-shell-command" class="bg-dark border text-wrap text-break p-4 pl-5"
|
||||
style="outline: none; font-size:1em;" contenteditable="true"></pre>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Advanced section -->
|
||||
<form class="row justify-content-center collapse" id="step3-advanced">
|
||||
<form class="row justify-content-center collapse" id="revshell-advanced">
|
||||
|
||||
<!-- Shell -->
|
||||
<div class="col-auto mr-3">
|
||||
@ -443,7 +235,7 @@
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<!-- /Step 3 -->
|
||||
<!-- /Reverse Shell -->
|
||||
|
||||
</div>
|
||||
|
||||
@ -636,8 +428,10 @@
|
||||
},
|
||||
|
||||
updateSwitchStates: function () {
|
||||
$('#step2-advanced').collapse($('#step2-advanced-switch').prop('checked') ? 'show' : 'hide')
|
||||
$('#step3-advanced').collapse($('#step3-advanced-switch').prop('checked') ? 'show' : 'hide')
|
||||
$('#listener-advanced').collapse($('#listener-advanced-switch').prop('checked') ? 'show' :
|
||||
'hide')
|
||||
$('#revshell-advanced').collapse($('#revshell-advanced-switch').prop('checked') ? 'show' :
|
||||
'hide')
|
||||
}
|
||||
}
|
||||
|
||||
@ -652,7 +446,7 @@
|
||||
setLocalStorage(portInput, "port", "value");
|
||||
})
|
||||
|
||||
$('#step2-advanced-switch, #step3-advanced-switch').on('change', rsg.updateSwitchStates)
|
||||
$('#listener-advanced-switch, #revshell-advanced-switch').on('change', rsg.updateSwitchStates)
|
||||
setInterval(rsg.updateSwitchStates, 500) // fix switch changes in rapid succession
|
||||
|
||||
$('#copy-listener').on('click', function () {
|
||||
@ -762,6 +556,8 @@
|
||||
})
|
||||
</script>
|
||||
|
||||
<script src="js/light-mode-switch.min.js"></script>
|
||||
|
||||
</body>
|
||||
|
||||
</html>
|
1
js/dark-mode-switch.min.js
vendored
1
js/dark-mode-switch.min.js
vendored
@ -1 +0,0 @@
|
||||
function initTheme(){var e=null!==localStorage.getItem("darkSwitch")&&"dark"===localStorage.getItem("darkSwitch");darkSwitch.checked=e,e?document.body.setAttribute("data-theme","dark"):document.body.removeAttribute("data-theme")}function resetTheme(){darkSwitch.checked?(document.body.setAttribute("data-theme","dark"),localStorage.setItem("darkSwitch","dark")):(document.body.removeAttribute("data-theme"),localStorage.removeItem("darkSwitch"))}var darkSwitch=document.getElementById("darkSwitch");window.addEventListener("load",function(){darkSwitch&&(initTheme(),darkSwitch.addEventListener("change",function(){resetTheme()}))});
|
@ -1,8 +1,8 @@
|
||||
var darkSwitch = document.getElementById("darkSwitch");
|
||||
var lightSwitch = document.getElementById("lightSwitch");
|
||||
window.addEventListener("load", function () {
|
||||
if (darkSwitch) {
|
||||
if (lightSwitch) {
|
||||
initTheme();
|
||||
darkSwitch.addEventListener("change", function () {
|
||||
lightSwitch.addEventListener("change", function () {
|
||||
resetTheme();
|
||||
});
|
||||
}
|
||||
@ -14,33 +14,33 @@ window.addEventListener("load", function () {
|
||||
*
|
||||
* Description: initTheme is a function that uses localStorage from JavaScript DOM,
|
||||
* to store the value of the HTML switch. If the switch was already switched to
|
||||
* 'on' it will set an HTML attribute to the body named: 'data-theme' to a 'dark'
|
||||
* 'on' it will set an HTML attribute to the body named: 'data-theme' to a 'light'
|
||||
* value. If it is the first time opening the page, or if the switch was off the
|
||||
* 'data-theme' attribute will not be set.
|
||||
* @return {void}
|
||||
*/
|
||||
function initTheme() {
|
||||
var darkThemeSelected =
|
||||
localStorage.getItem("darkSwitch") !== null &&
|
||||
localStorage.getItem("darkSwitch") === "dark";
|
||||
darkSwitch.checked = darkThemeSelected;
|
||||
darkThemeSelected
|
||||
? document.body.setAttribute("data-theme", "dark")
|
||||
var lightThemeSelected =
|
||||
localStorage.getItem("lightSwitch") !== null &&
|
||||
localStorage.getItem("lightSwitch") === "light";
|
||||
lightSwitch.checked = lightThemeSelected;
|
||||
lightThemeSelected
|
||||
? document.body.setAttribute("data-theme", "light")
|
||||
: document.body.removeAttribute("data-theme");
|
||||
}
|
||||
|
||||
/**
|
||||
* Summary: resetTheme checks if the switch is 'on' or 'off' and if it is toggled
|
||||
* on it will set the HTML attribute 'data-theme' to dark so the dark-theme CSS is
|
||||
* on it will set the HTML attribute 'data-theme' to light so the light-theme CSS is
|
||||
* applied.
|
||||
* @return {void}
|
||||
*/
|
||||
function resetTheme() {
|
||||
if (darkSwitch.checked) {
|
||||
document.body.setAttribute("data-theme", "dark");
|
||||
localStorage.setItem("darkSwitch", "dark");
|
||||
if (lightSwitch.checked) {
|
||||
document.body.setAttribute("data-theme", "light");
|
||||
localStorage.setItem("lightSwitch", "light");
|
||||
} else {
|
||||
document.body.removeAttribute("data-theme");
|
||||
localStorage.removeItem("darkSwitch");
|
||||
localStorage.removeItem("lightSwitch");
|
||||
}
|
||||
}
|
1
js/light-mode-switch.min.js
vendored
Normal file
1
js/light-mode-switch.min.js
vendored
Normal file
@ -0,0 +1 @@
|
||||
var lightSwitch=document.getElementById("lightSwitch");function initTheme(){var t=null!==localStorage.getItem("lightSwitch")&&"light"===localStorage.getItem("lightSwitch");lightSwitch.checked=t,t?document.body.setAttribute("data-theme","light"):document.body.removeAttribute("data-theme")}function resetTheme(){lightSwitch.checked?(document.body.setAttribute("data-theme","light"),localStorage.setItem("lightSwitch","light")):(document.body.removeAttribute("data-theme"),localStorage.removeItem("lightSwitch"))}window.addEventListener("load",function(){lightSwitch&&(initTheme(),lightSwitch.addEventListener("change",function(){resetTheme()}))});
|
Loading…
Reference in New Issue
Block a user