@openeventkit/event-site 2.0.4 → 2.0.6

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@openeventkit/event-site",
   "description": "Event Site",
-  "version": "2.0.4",
+  "version": "2.0.6",
   "author": "Tipit LLC",
   "dependencies": {
     "@mui/base": "^5.0.0-alpha.114",

package/src/components/summit-my-orders-tickets/components/OrderDetails/order-details.scss

@@ -4,8 +4,8 @@
   position: relative;
   display: flex;
   flex-flow: row nowrap;
-  background-color: $color-white;
-  border: 1px solid $color-gray-light;
+  background-color: var(--color_background_light);
+  border: 1px solid var(--color_gray_light);
   border-radius: 4px;
   min-height: 6em;
   padding: 16px 16px 16px 32px;
@@ -17,11 +17,13 @@
   }
 
   &:hover {
-    background-color: $color-gray-lightest;
+
+    background-color: var(--color-gray-lightest);
   }
 
   &--active {
-    background-color: $color-gray-lighter !important;
+    color: var(--color_text_med);
+    background-color: var(--color-gray-lighter) !important;
   }
 
   * {

package/src/components/summit-my-orders-tickets/components/OrderTicketDetails/order-ticket-details.scss

@@ -4,8 +4,8 @@
   position: relative;
   display: flex;
   flex-flow: row nowrap;
-  background-color: $color-white;
-  border: 1px solid $color-gray-light;
+  background-color: var(--color_background_light);
+  border: 1px solid var(--color_gray_light);
   border-radius: 4px;
   margin-top: 0.5em;
   min-height: 6em;
@@ -18,7 +18,8 @@
   }
 
   &:hover {
-    background-color: $color-gray-lightest;
+    background-color: var(--color_gray_light);
+    color: var(--color_text_light)
   }
 
   * {

package/src/components/summit-my-orders-tickets/components/TicketDetails/ticket-details.scss

@@ -3,8 +3,8 @@
 .ticket-details {
   position: relative;
   display: flex;
-  background-color: $color-white;
-  border: 1px solid $color-gray-light;
+  background-color: var(--color_background_light);
+  border: 1px solid var(--color_gray_light);
   border-radius: 4px;
   min-height: 6em;
   padding: 16px 16px 16px 32px;

package/src/components/summit-my-orders-tickets/components/TicketPopup/ticket-popup.scss

@@ -43,12 +43,13 @@
   top: 0%;
   bottom: 0%;
   margin: auto;
-  background: $color-white;
+  background-color: var(--color_background_light) !important;
   z-index: 15;
+
 }
 
 .ticket-popup-header {
-  background-color: $color-primary;
+  background-color: var(--color_background_light) !important;
   font-weight: bold;
   padding: 15px;
   display: flex;
@@ -274,7 +275,7 @@
 
   &--edit {
     .ticket-popup-footer {
-      border-top: 1px solid $color-gray-lighter;
+      border-top: 1px solid var(--color-gray-lighter);
       left: 0;
       bottom: 0;
       height: 60px;
@@ -282,13 +283,17 @@
       position: absolute;
       text-align: center;
       width: 100%;
-      background-color: $color-white;
+      background-color: var(--color_background_light);
       z-index: 25;
 
+
       button {
         padding: 8px 26px;
         line-height: 22px;
         font-size: 16px;
+        color: var(--color_input_text_color) !important;
+        background-color: var(--color_input_background_color) !important;
+        border-color: var(--color_input_border_color) !important;
       }
     }
 

package/src/styles/colors.scss

@@ -13,6 +13,12 @@ $color_gray_dark : #999999;
 $color_gray_light : #DFDFDF;
 $color_gray_lighter : #F2F2F2;
 $color_text_input_hints : #c4c4c4;
+$color_input_text_color_light: #363636;
+$color_input_background_color_light:#fff;
+$color_input_border_color_light:#dbdbdb;
+$color_input_text_color_dark: #FFFFFF;
+$color_input_background_color_dark:rgb(24, 26, 27);
+$color_input_border_color_dark:rgb(58, 63, 65);
 
 :root {
   --color_primary: #{$color_primary};
@@ -28,6 +34,9 @@ $color_text_input_hints : #c4c4c4;
   --color_gray_dark: #{$color_gray_dark};
   --color_gray_light: #{$color_gray_light};
   --color_gray_lighter: #{$color_gray_lighter};
+  --color_input_text_color: #{$color_input_text_color_light};
+  --color_input_background_color: #{$color_input_background_color_light};
+  --color_input_border_color: #{$color_input_border_color_light};
 }
 
 html[data-theme="DARK"] {
@@ -39,4 +48,7 @@ html[data-theme="DARK"] {
   --color_gray_dark: #{$color_gray_light} !important;
   --color_gray_light: #{$color_gray_dark} !important;
   --color_gray_lighter: #{$color_gray_darker} !important;
+  --color_input_text_color: #{$color_input_text_color_dark} !important;
+  --color_input_background_color: #{$color_input_background_color_dark} !important;
+  --color_input_border_color: #{$color_input_border_color_dark} !important;
 }

package/src/styles/extra-questions.module.scss

@@ -17,10 +17,15 @@
       padding-top: 10px;
     }
   }
+  textarea{
+    width: 100%;
+    resize: none;
+  }
   input[type="checkbox"] {
     margin-right: 3px;
     &~ label {
       padding-left: 13px !important;
+      color: var(--color_input_text_color) !important;
     }
   }
   h4 {
@@ -29,6 +34,7 @@
     line-height: 1;
     padding-top: 4px;
     margin-bottom: 0px;
+    color: var(--color_input_text_color) !important;
   }
 }
 
@@ -49,6 +55,9 @@
 .button-save {
   float: right;
   margin-top: 20px;
+  color: var(--color_input_text_color) !important;
+  background-color: var(--color_input_background_color) !important;
+  border-color: var(--color_input_border_color) !important;
 }
 
 .mandatoryDisclaimer::after {

package/src/styles/full-profile.module.scss

@@ -93,8 +93,15 @@
                     }
 
                     .dropdown {
+
                         >div {
                             width: 100%;
+                            color: var(--color_input_text_color) !important;
+                            background-color: var(--color_input_background_color) !important;
+                            border-color: var(--color_input_border_color) !important;
+                            > div > div {
+                                color:inherit;;
+                            }
                         }
                     }
                 }
@@ -115,15 +122,11 @@
                 button {
                     width: 100%;
                     height: 5.5rem;
+                    color: var(--color_input_text_color) !important;
+                    background-color: var(--color_input_background_color) !important;
+                    border-color: var(--color_input_border_color) !important;
                 }
 
-                &:last-of-type {
-                    button {
-                        color: #ffffff;
-                        border-color: #ffffff;
-                        background-color: var(--color-primary);
-                    }
-                }
             }
         }
     }

package/src/styles/style.scss

@@ -7,7 +7,43 @@ body {
   margin: 0;
   padding: 0;
   height: 100%;
+  /********************************************************/
+  /*                  base mode rules                     */
+  /********************************************************/
+
   background-color: var(--color_background_light) !important;
+  color: var(--color_text_dark) !important;
+
+  input, select, textarea {
+    color: var(--color_input_text_color) !important;
+    background-color: var(--color_input_background_color) !important;
+    border-color: var(--color_input_border_color) !important;
+  }
+
+  h2, h1 , h3{
+    color: var(--color_text_dark) !important;
+  }
+
+  .ajax-loader-container {
+    .fa-spinner{
+      color:var(--color_input_text_color) !important;
+    }
+  }
+
+  .rdtPicker{
+    background-color: var(--color_input_background_color);
+    color: var(--color_input_text_color);
+    .rdtDays{
+      table th{
+        color: var(--color_input_text_color);
+        text-align: center;
+      }
+    }
+  }
+
+  /********************************************************/
+  /*            end of base mode rules                    */
+  /********************************************************/
 }
 
 
@@ -235,7 +271,8 @@ h2 {
 }
 
 .talk {
-  color: var(--color_text_dark);
+  color: var(--color_text_med);
+
   &__break {
     background-color: var(--color_secondary);
     min-height: 92vh !important;
@@ -251,13 +288,14 @@ h2 {
 
   h1 {
     font-size: 40px;
+    color: var(--color_text_dark);
   }
 
   &__date {
     font-weight: bold;
+    color: var(--color_text_dark);
   }
 
-
   &__speaker, &__moderator {
     &--name {
       text-transform: capitalize;

package/src/templates/extra-questions-page.js

@@ -30,6 +30,7 @@ export const ExtraQuestionsPageTemplate = ({ user, summit, extraQuestions, saveA
     const hasExtraQuestions = extraQuestions.length > 0;
 
     const initialValues = useMemo(() => {
+
         const {
             email,
             first_name,
@@ -37,7 +38,7 @@ export const ExtraQuestionsPageTemplate = ({ user, summit, extraQuestions, saveA
             company,
             disclaimer_accepted_date,
             extra_questions
-        } = ticket.owner || {};
+        } = ticket?.owner || {};
 
         const formattedExtraQuestions = extra_questions ?
             extra_questions.map(({ question_id, value }) => (