https://virtual-labs.github.io/virtual-labs/exp-reflex-klystron-iitr …

…click on the link to test your code.

README.md

@@ -0,0 +1,7 @@
+This folder has 
+### Aim
+### Theory
+### Procedure
+### Pre Test
+### Post Test
+### References

aim.md

@@ -0,0 +1,2 @@
+
+#### To study the Characteristics of Reflex Klystron.

assesment.log

@@ -0,0 +1,30 @@
+=/pretest.json
+{
+  _: [],
+  f: [
+    '/home/runner/work/exp-reflex-klystron-iitr/exp-reflex-klystron-iitr/experiment/pretest.json'
+  ],
+  files: [
+    '/home/runner/work/exp-reflex-klystron-iitr/exp-reflex-klystron-iitr/experiment/pretest.json'
+  ],
+  c: 'assessment',
+  contentTypes: 'assessment',
+  'content-types': 'assessment',
+  '$0': 'validate'
+}
+Validated true
+=/posttest.json
+{
+  _: [],
+  f: [
+    '/home/runner/work/exp-reflex-klystron-iitr/exp-reflex-klystron-iitr/experiment/posttest.json'
+  ],
+  files: [
+    '/home/runner/work/exp-reflex-klystron-iitr/exp-reflex-klystron-iitr/experiment/posttest.json'
+  ],
+  c: 'assessment',
+  contentTypes: 'assessment',
+  'content-types': 'assessment',
+  '$0': 'validate'
+}
+Validated true

assets/css/common-styles-responsive.css

@@ -0,0 +1,97 @@
+.slidecontainer {
+    text-align: center;
+}
+
+.slider {
+    width: 10%;
+}
+
+.text-box {
+    padding: 7px 20px;
+    margin: 8px 0;
+    box-sizing: border-box;
+    width: 14%; 
+}
+
+.legend { list-style: none; }
+.legend li { padding-bottom : 1.5vw; width: 20vw; }
+.legend span { border: 0.1vw solid black; float: left; border-radius: 50%;}
+.legend .grey { background-color: grey; }
+.legend .green { background-color: #a4c652; }
+.legend .black { background-color: black; }
+
+.button-input {
+    border-radius: 50vw;
+    background-color: #288ec8;
+    border: none;
+    color: white;
+    padding: 1%;
+    margin-left: 1%;
+    margin-right: 1%;
+    padding-bottom: 1%;
+    padding-top: 1%;
+    padding-left: 2%;
+    padding-right: 2%;
+}
+
+.button-input:hover {
+    background-color:gray;
+    cursor:pointer;
+}
+
+.comment-box {
+    position: relative;
+    padding: 1vw;
+    width: 30vw;
+    text-align: center;
+}
+
+.instruction-box {
+    position: relative;
+    width: 100%;
+    transition: width 0.2s ease-out;
+    border: 0.1vw solid grey;
+    z-index : 10;
+}
+
+.collapsible {
+    background-color: Transparent;
+    color: "grey";
+    cursor: pointer;
+    width: 100%;
+    border: none;
+    text-align: center;
+    outline: none;
+    font-weight: bold;
+    padding-top: 1%;
+    padding-bottom: 1%;
+}
+
+.collapsible::-moz-focus-inner {
+    border: 0;
+}
+
+.active, .collapsible:hover {
+    background-color: "white";
+}
+
+/*The unicode \25BE is for ▾ (Dropdown arrow) */
+.collapsible:after {
+    content: "\25BE";
+    color: "grey";
+    font-weight: bold;
+    float: right;
+    margin-left: 5px;
+}
+
+.active:after {
+    content: "\25B4";
+}
+
+.content {
+    padding: 0 1.8vw;
+    max-height: 0;
+    overflow: hidden;
+    transition: max-height 0.2s ease-out;
+    background-color: "white";
+}

assets/css/common-styles.css

@@ -0,0 +1,104 @@
+.slidecontainer {
+    text-align: center;
+}
+
+.slider {
+    width: 10%;
+}
+
+.text-box {
+    padding: 7px 20px;
+    margin: 8px 0;
+    box-sizing: border-box;
+    width: 14%; 
+}
+
+.legend{
+    font-size: 1.4vw;
+}
+.legend { list-style: none; }
+.legend li { padding-bottom : 1.5vw; width: 20vw; }
+.legend span { border: 0.1vw solid black; float: left; width: 2vw; height: 2vw; margin-right : 0.5vw; border-radius: 50%;}
+.legend .grey { background-color: grey; }
+.legend .green { background-color: #a4c652; }
+.legend .black { background-color: black; }
+
+.button-input {
+    border-radius: 50vw;
+    background-color: #288ec8;
+    border: none;
+    color: white;
+    padding: 1%;
+    font-size: 1.3vw;
+    margin-left: 1%;
+    margin-right: 1%;
+    padding-bottom: 1%;
+    padding-top: 1%;
+    padding-left: 2%;
+    padding-right: 2%;
+}
+
+.button-input:hover {
+    background-color:gray;
+    cursor:pointer;
+}
+
+.comment-box {
+    position: relative;
+    padding: 1vw;
+    width: 30vw;
+    font-size: 1.5vw;
+    text-align: center;
+}
+
+.instruction-box {
+    position: relative;
+    width: 100%;
+    transition: width 0.2s ease-out;
+    border: 0.1vw solid grey;
+    font-size: 1.5vw;
+    z-index : 10;
+}
+
+.collapsible {
+    background-color: Transparent;
+    color: "grey";
+    cursor: pointer;
+    width: 100%;
+    border: none;
+    text-align: center;
+    outline: none;
+    font-size: 1.5vw;
+    font-weight: bold;
+    padding-top: 1%;
+    padding-bottom: 1%;
+}
+
+.collapsible::-moz-focus-inner {
+    border: 0;
+}
+
+.active, .collapsible:hover {
+    background-color: "white";
+}
+
+.collapsible:after {
+    content: '\25BE';
+    color: "grey";
+    font-weight: bold;
+    float: right;
+    margin-left: 5px;
+}
+
+.active:after {
+    content: "\25B4";
+}
+
+.content {
+    padding: 0 1.8vw;
+    max-height: 0;
+    overflow: hidden;
+    transition: max-height 0.2s ease-out;
+    background-color: "white";
+}
+

assets/css/toast.css

@@ -0,0 +1,16 @@
+/* assets/css/toast.css */
+.custom-toast-popup {
+    border-radius: 10px; /* Rounded corners */
+    box-shadow: 0 0 10px rgba(0, 0, 0, 0.5); /* Custom shadow */
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    position: fixed; /* Fixed positioning */
+    top: 50%; /* Center vertically */
+    left: 50%; /* Center horizontally */
+    transform: translate(-50%, -50%); /* Adjust for exact centering */
+    z-index: 1000; /* Ensure it appears above other elements */
+    padding: 10px;
+    color: #fff;
+    font-size: 1rem;
+  }