Update static/style.css

static/style.css

@@ -13,16 +13,6 @@
   
 }
 
-.sub-item {
-  list-style-type: upper-alpha; /* Uppercase letters for sub-items */
-  padding-left: 20px;
-}
-
-.nested-item {
-  list-style-type: lower-roman; /* Lowercase roman numerals for nested items */
-  padding-left: 40px;
-}
-
 body{
   margin-top: 45px;
   position: static;
@@ -65,13 +55,24 @@ body{
   /* margin-top: 5px; */
   color:white;    
   position:static;
-  display: block;
+  display: none;
   margin-left: 348px;
   margin-top: -25px;
   width:28px;
   height: 25px;
   /* display: inline-block; */
 }
+#pdfFrame {
+  margin-top: 45px;
+  position: absolute; /* Fixed positioning to keep it at the top-right corner */
+  top: 0;
+  right: 0;
+  width: 600px; /* Adjust width as needed */
+  height: 100%; /* Adjust height as needed */
+  border: none;
+  display: none; /* Hidden initially */
+  z-index: 0; /* Ensure it's above other content */
+}
 
 /* Tooltip text */
 #refreshDropboxButtonID .dropboxtip {
@@ -109,6 +110,7 @@ body{
   border-width: 5px;
   border-style: solid;
   border-color: transparent black transparent transparent;
+  z-index: 2;
 }
 
 
@@ -166,7 +168,6 @@ body{
 
   width: 51ch;
   font-size: 13px;
-  margin-top: 5px;
   resize: auto;
   background-color: #fff;
   border-radius: 0 0 3px 3px;
@@ -214,7 +215,6 @@ body{
     font-weight: 400;
     font-style: normal;
     margin-left: 13px ;
-    margin-top: 10px;
     font-size: 12;
     cursor: pointer;
     max-width: 50%;
@@ -227,7 +227,7 @@ body{
 #pdftodxfFileButton{
   background-color: #1645c7;
   border: none;
-  padding: 7px 40px; /*102*/
+  padding: 7px 10px; /*102*/
   cursor: pointer;
   border-radius: 5px;
   /* margin-left: 3px; */
@@ -261,6 +261,26 @@ input[type="file"]::-webkit-file-upload-button{
     display:inline-block;
 }
 
+#popupforextratext{
+
+  background-color: #b216c7;
+  border: none;
+  padding: 12px 124px; /*102*/
+  cursor: pointer;
+  border-radius: 5px;
+  margin-left: 3px;
+  font-family: "acumin-pro", sans-serif;
+  font-weight: bold;
+  font-style: normal;
+  font-size: 13px;
+  color:white;
+  display:block;
+  margin-top: 3px;
+  margin-bottom: 5px;
+
+}
+
+
 .measureADRbutton2{
   border: none;
   padding: 10px 121px;
@@ -324,6 +344,42 @@ input[type="file"]::-webkit-file-upload-button{
 /* #selectionsid:hover{
     box-shadow: 4px 4px 4px gray;
 } */
+
+#textextra,#text0extra,#text1extra,#text2extra{
+  width:30ch;
+  text-align: center;
+
+}
+#text0extra,#text1extra,#text2extra{
+  margin-left: -2.5px;
+}
+
+#modalGray{
+  color:#938f8f;
+  font-size: 13px;
+  font-family: "acumin-pro", sans-serif;
+}
+#modalColIndex{
+  margin-left: 3px;
+  font-size: 13px;
+  font-family: "acumin-pro", sans-serif;
+}
+#modalColumn{
+  margin-left: 7px;
+  font-size: 13px;
+  font-family: "acumin-pro", sans-serif;
+}
+#modalKeyword{
+  margin-left:  67px;
+  font-size: 13px;
+  font-family: "acumin-pro", sans-serif;
+}
+#modalCharacter{
+  margin-left:  25px;
+  font-size: 13px;
+  font-family: "acumin-pro", sans-serif;
+}
+
 #repeatforloop{
     margin-left: 5px ;
     margin-top: 8px;
@@ -339,12 +395,18 @@ input[type="file"]::-webkit-file-upload-button{
 #text2{
     width:9ch;
 }
-#text0,#text1,#text2{
-    font-size: 13px;
+#textextra{
+  width: 7ch;
+}
+#text2extra{
+  width: 7ch;
+}
+#text0,#text1,#text2,#textextra,#text0extra,#text1extra, #text2extra{
+    font-size: 12px;
     /* width: 31.5%; */
     height: 33px;
-    border-radius: 2px;
-    margin-bottom: 7px;
+    border-radius: 1px;
+    margin-bottom: 3px;
     margin-right: 0.2%;
     font-family: "acumin-pro", sans-serif;
     font-weight: 400;
@@ -353,28 +415,83 @@ input[type="file"]::-webkit-file-upload-button{
     
 }
 .addmctnameclass{
-  
-    width:35px;
-    height:35px;
-    /* left: %; */
     margin-top: -1px;
-    margin-left: -1px;
-    cursor: pointer;
-    
-   position: absolute;
-    border: none;
+}
+.addmctnameclass{
+  
+  width:35px;
+  height:35px;
+  /* left: %; */
+  /* margin-top: -1px; */
+  margin-left: -1px;
+  cursor: pointer;
+  
+ position: absolute;
+  border: none;
 }
 .deletemctnameclass{
   width:35px;
   height:35px;
   /* left: %; */
-  margin-top: -1px;
+
   margin-left: 30px;
   cursor: pointer;
   
  position: absolute;
   border: none;
 }
+
+.addmctnameclassExtra {
+  width: 15px;
+  height: 15px;
+  background-color: #2f83c6;
+  border-radius: 100%;
+  position: absolute;
+  border: none;
+  cursor: pointer;
+  margin-top: 10px;
+  margin-left: 10px;
+}
+.addmctnameclassExtra::before {
+  content: "";
+  width: 28px; /* Square background */
+  height: 28px;
+  background-color: rgba(255, 255, 255, 0.2); /* Light blue background */
+  border: 2px solid #2f83c6; /* Blue border */
+  border-radius: 5px; /* Rounded edges */
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+}
+.deletemctnameclassExtra{
+  width: 15px;
+  height: 15px;
+  background-color: #f32b2b;
+  border-radius: 100%;
+  position: absolute;
+  border: none;
+  cursor: pointer;
+  margin-top: 10px;
+  margin-left: 44px;
+}
+.deletemctnameclassExtra::before {
+  content: "";
+  width: 28px; /* Square background */
+  height: 28px;
+  background-color: rgba(255, 255, 255, 0.2); /* Light blue background */
+  border: 2px solid  #f32b2b;
+  border-radius: 5px; /* Rounded edges */
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+}
+
+.deletemctnameclass{
+  margin-top: -1px;
+}
+
 #doneebackground , #summarytoXML{
     top: 10px;
     width:130px;
@@ -459,11 +576,19 @@ cursor: pointer;
   /* margin-top: 10px; */
   margin-left: 6px;
   zoom: 1.3;
+  margin-top: 5px;
   
 }
+#checkboxLine {
+  display: flex;      /* Arranges children in a row */
+  align-items: center; /* Vertically centers the items */
+  gap: 0.5rem;        /* Optional spacing between items */
+  margin-top: 5px;
+}
+
 #radiosColors{
   /* max-width: 50%; */
-  display: flex;
+  display: block;
   margin-top: 10px;
   /* margin-left: 5px; */
 }
@@ -517,16 +642,24 @@ cursor: pointer;
   box-shadow: 0 0 8px 2px  rgba(255, 0, 0, 0.633);
 }
 /* Tooltip container */
-#infotool {
+#infotool , #infotoolModal {
     position: relative;
     display: inline-block;
     margin-top: 4px;
-    margin-left: 4px;
+    margin-left: -1px;
     /* border-bottom: 1px dotted black; If you want dots under the hoverable text */
+    z-index: 100;
+    
   }
-  
+  #infotoolModal::before{
+    margin-left: -2px;
+  }
+  .smallFaIcon {
+    font-size: 13px;
+}
   /* Tooltip text */
-  #infotool .tooltiptext {
+  #infotool .tooltiptext  , #infotoolModal .tooltiptext {
+    z-index: 9999; 
     visibility: hidden;
     width: 350px;
     background-color: #555;
@@ -538,7 +671,7 @@ cursor: pointer;
   
     /* Position the tooltip text */
     position: absolute;
-    z-index: 1;
+    
     bottom: 125%;
     left: 50%;
     margin-left: -60px;
@@ -546,10 +679,20 @@ cursor: pointer;
     /* Fade in tooltip */
     opacity: 0;
     transition: opacity 0.3s;
+
+  }
+  #modaltooltips{
+    font-size: 14px;
+    margin-right: -200px;
+    top: -65px;
+    width: auto;
+    height: auto;
+    position: absolute;
+    display: block;
+    z-index: 9999;
   }
-  
   /* Tooltip arrow */
-  #infotool .tooltiptext::after {
+  #infotool .tooltiptext::after  , #infotoolModal .tooltiptext::after {
     content: "";
     position: absolute;
     top: 100%;
@@ -563,8 +706,9 @@ cursor: pointer;
   
 
   /* Show the tooltip text when you mouse over the tooltip container */
-  #infotool:hover .tooltiptext {
+  #infotool:hover .tooltiptext , #infotoolModal:hover .tooltiptext{
     visibility: visible;
+    /* z-index: 100; */
     opacity: 1;
   }
   #loading {