optimized-react-component-library-xyz123 0.14.1 → 0.15.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "optimized-react-component-library-xyz123",
-  "version": "0.14.1",
+  "version": "0.15.2",
   "description": "A modern React component library using TypeScript with React 19 support.",
   "main": "dist/index.cjs",
   "module": "dist/index.mjs",

package/src/css/darkMode.css

@@ -242,6 +242,18 @@
         background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='black' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10l3 3l6-6'/%3e%3c/svg%3e") !important;
     }
 
+    /* ---------- SINGLE CHECKBOX ---------- */
+
+ .pts-singleCheckbox-container input[type='checkbox'] {
+        background-color: var(--dark-main);
+        border-color: var(--dark-info);
+    }
+
+    .pts-singleCheckbox-container input[type='checkbox']:checked {
+        background-color: var(--dark-action);
+        background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='black' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10l3 3l6-6'/%3e%3c/svg%3e") !important;
+    }
+
     /* ---------- TEXTAREA ---------- */
 
     .pts-textArea-container textarea {

package/src/css/mobileView.css

@@ -93,6 +93,10 @@
     padding: 0;
   }
 
+  .pts-header-content{
+    display:block;
+  }
+
   .pts-header-logo-container {
     padding: 13px 0;
     border-bottom: 2px solid #ddd;
@@ -100,6 +104,11 @@
     text-align: center;
   }
 
+  .pts-header-navigation-container{
+    align-items: center;
+    justify-content: center;
+  }
+
   .pts-languageButton {
     margin: 0.4rem 0;
   }

package/src/css/questions.css

@@ -144,6 +144,7 @@ div.pts-root-question:last-child {
 
 /* ---------- SINGLE CHECKBOX ---------- */
 
+
 .pts-singleCheckbox-row {
   display: flex;
   flex-direction: row;
@@ -153,17 +154,15 @@ div.pts-root-question:last-child {
 
 .pts-singleCheckbox-container input[type='checkbox'] {
   -webkit-appearance: none;
-
   width: 1.8rem;
   height: 1.8rem;
   margin-right: 0.8rem;
   flex-shrink: 0;
-
   background-color: var(--main);
   border: 0.15rem solid var(--info);
   border-radius: 0.2rem;
-
   cursor: pointer;
+  margin-left: 0px;
 }
 
 .pts-singleCheckbox-container input[type='checkbox']:checked {
@@ -196,6 +195,7 @@ div.pts-root-question:last-child {
   border: 0.15rem solid var(--info);
   border-radius: 0.2rem;
   cursor: pointer;
+  margin-left: 0px;
 }
 
 .pts-checkboxGroup-container input[type='checkbox']:checked {
@@ -259,7 +259,7 @@ div.pts-root-question:last-child {
 /* ---------- TEXTFIELD / TEXTAREA ABOUT ---------- */
 
 .pts-textField-container {
-  margin-top: 8px;
+  margin-bottom: 16px;
 }
 
 .pts-about {
@@ -312,6 +312,10 @@ div.pts-root-question:last-child {
   width: 100%;
 }
 
+ .pts-root-question-group-fieldset  .pts-root-error{
+    margin-bottom: 1.6rem;
+ } 
+
 /* ---------- FILE UPLOAD ---------- */
 /* ---------- FILE UPLOAD ---------- */
 /* ---------- FILE UPLOAD ---------- */

package/src/css/styles.css

@@ -288,6 +288,27 @@ textarea:focus-visible,
   background-color: var(--main);
 }
 
+.pts-header-content{
+    width: 100%;
+    display: flex;
+}
+
+.pts-header-logo-container{
+    height:4rem;
+}
+
+.pts-header-logo svg{
+    height: 4rem;
+}
+
+.pts-header-navigation-container{
+    display: flex;
+    flex-direction: column;
+    justify-content: flex-end;
+    width: 100%;
+    align-items: flex-end;
+}
+
 .pts-languageButton {
   position: relative;
   display: inline-flex;
@@ -296,15 +317,16 @@ textarea:focus-visible,
   border: transparent;
   color: var(--action);
   cursor: pointer;
+  font-size: 1.6rem;
 }
 
 .pts-languageButton::after {
     content: "";
     position: absolute;
-    left: 0.7rem;
-    right: -0.3rem;
-    bottom: 0;
-    height: 0.2rem;
+    left: 7px;
+    right: 4px;
+    bottom: 3px;
+    height: 0.15rem;
     background-color: currentColor;
     opacity: 0;
 }
@@ -314,21 +336,25 @@ textarea:focus-visible,
 }
 
 .languageIcon{
+  position: relative;
   margin-top: 0.3rem;
   padding-right: 0.6rem;
+  top: 0.01rem;
 }
 
 .pts-languageButton svg {
-  width: 1.5rem;
-  height: 1.5rem;
+  width: 1.6rem;
+  height: 1.6rem;
 }
 
-.languageIcon{
-  padding-left: 0.6rem;
-}
 
 /* ---------- TextBODY ---------- */
 
+.pts-textBody-container p{
+    margin-bottom: 1.6rem;
+
+}
+
 .MoreInfoIcon{
   margin-top: 2px;
 }
@@ -781,8 +807,7 @@ textarea:focus-visible,
     transform: rotate(360deg);
   }
 }
-
-
+/*-----------ALWAYS IN THE END OF STYLES----------------*/
 
 .cleanPadding {
   padding: 0;