react-autoql 8.0.0 → 8.0.1-alpha.0

package/dist/autoql.esm.css

@@ -251,7 +251,7 @@ a {
   height: auto;
   border-radius: 4px;
   outline: none !important;
-  transition: all 0.2s ease;
+  transition: border-color 0.2s ease, background-color 0.2s ease, opacity 0.2s ease, color 0.2s ease;
   cursor: pointer; }
   .react-autoql-btn.btn-no-border {
     border: none !important; }
@@ -963,8 +963,9 @@ a {
       font-size: inherit;
       font-family: inherit;
       outline: none !important;
-      transition: all 0.2s ease;
-      transition-property: border-color, color, opacity;
+      transition-property: color, border-color, background-color, opacity;
+      transition-duration: 0.3s;
+      transition-timing-function: ease;
       padding: 10px;
       line-height: 1em; }
       .react-autoql-input-and-label-container .react-autoql-input-container .react-autoql-input:disabled {
@@ -1037,7 +1038,9 @@ a {
   border: 1px solid transparent;
   background-color: var(--react-autoql-background-color-secondary);
   color: var(--react-autoql-text-color-primary);
-  transition: all 0.2s ease;
+  transition-property: color, border-color, background-color, opacity;
+  transition-duration: 0.2s;
+  transition-timing-function: ease;
   margin-right: 5px;
   font-size: 0.875em;
   border-radius: 50px;
@@ -1128,7 +1131,9 @@ a {
     flex-direction: column;
     padding: 2px 0;
     border-radius: 4px;
-    transition: all 0.3s ease;
+    transition-property: color, border-color, background-color, opacity;
+    transition-duration: 0.3s;
+    transition-timing-function: ease;
     flex: 0 0 auto;
     margin-right: 12px; }
   .react-autoql-rule-simple .react-autoql-notification-rule-container .react-autoql-rule-second-input-container {
@@ -1136,7 +1141,9 @@ a {
     flex-direction: column;
     padding: 2px 0;
     border-radius: 4px;
-    transition: all 0.3s ease;
+    transition-property: color, border-color, background-color, opacity;
+    transition-duration: 0.3s;
+    transition-timing-function: ease;
     flex: 1; }
     .react-autoql-rule-simple .react-autoql-notification-rule-container .react-autoql-rule-second-input-container .react-autoql-rule-condition-select {
       flex: 0;
@@ -1715,7 +1722,9 @@ a {
   right: 50%;
   bottom: 50%;
   left: 50%;
-  transition: all 0.2s;
+  transition-property: color, border-color, background-color, opacity;
+  transition-duration: 0.2s;
+  transition-timing-function: ease;
   background: var(--react-autoql-accent-color, #26a7df); }
 
 .react-autoql-checkbox-tick {
@@ -2254,7 +2263,9 @@ g.legendOrdinal .legendTitle tspan {
   outline: none !important;
   cursor: pointer;
   letter-spacing: 0.05em;
-  transition: all 0.1s ease;
+  transition-property: color, border-color, background-color, opacity;
+  transition-duration: 0.3s;
+  transition-timing-function: ease;
   border: 1px solid rgba(0, 0, 0, 0.15);
   border-radius: 5px;
   color: inherit; }
@@ -2274,7 +2285,9 @@ g.legendOrdinal .legendTitle tspan {
   outline: none !important;
   cursor: pointer;
   letter-spacing: 0.05em;
-  transition: all 0.1s ease;
+  transition-property: color, border-color, background-color, opacity;
+  transition-duration: 0.3s;
+  transition-timing-function: ease;
   border-color: #e2e2e26e;
   color: inherit; }
 
@@ -2775,7 +2788,9 @@ g.legendOrdinal .legendTitle tspan {
   top: 4px;
   left: 4px;
   border-radius: 100%;
-  transition: all 0.2s ease; }
+  transition-property: color, border-color, background-color, opacity;
+  transition-duration: 0.3s;
+  transition-timing-function: ease; }
 
 .react-autoql-radio-btn-container [type='radio']:not(:checked) + label:after {
   opacity: 0;
@@ -2791,7 +2806,9 @@ g.legendOrdinal .legendTitle tspan {
   padding: 3px 12px;
   border: 1px solid var(--react-autoql-border-color, #dcdcdc);
   margin-left: -1px;
-  transition: all 0.2s ease;
+  transition-property: color, border-color, background-color, opacity;
+  transition-duration: 0.3s;
+  transition-timing-function: ease;
   cursor: pointer; }
   .react-autoql-radio-btn-container .react-autoql-radio-btn:not(:first-child) {
     border-left: 1px solid transparent; }
@@ -2830,7 +2847,9 @@ g.legendOrdinal .legendTitle tspan {
   text-align: center;
   font-size: 20px;
   box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.13);
-  transition: all 0.2s ease;
+  transition-property: color, border-color, background-color, opacity;
+  transition-duration: 0.2s;
+  transition-timing-function: ease;
   margin-right: 5px;
   cursor: pointer; }
   .notification-rule-add-group-btn:hover {
@@ -2878,7 +2897,9 @@ g.legendOrdinal .legendTitle tspan {
       text-align: center;
       background: var(--react-autoql-background-color-secondary, white);
       color: var(--react-autoql-text-color-placeholder, rgba(0, 0, 0, 0.2));
-      transition: all 0.3s ease;
+      transition-property: color, border-color, background-color, opacity;
+      transition-duration: 0.3s;
+      transition-timing-function: ease;
       cursor: pointer; }
       .notification-group-wrapper .react-autoql-notification-group-container .react-autoql-notification-group-add-btn:hover,
       .notification-group-wrapper .react-autoql-notification-group-container .react-autoql-notification-group-delete-btn:hover {
@@ -2922,7 +2943,9 @@ g.legendOrdinal .legendTitle tspan {
       color: var(--react-autoql-text-color-primary, rgba(0, 0, 0, 0.2));
       opacity: 0.5;
       border: 1px solid;
-      transition: all 0.2s ease;
+      transition-property: color, border-color, background-color, opacity;
+      transition-duration: 0.3s;
+      transition-timing-function: ease;
       cursor: pointer; }
       .notification-group-wrapper .react-autoql-notification-group-container .react-autoql-notification-rule-add-btn:hover {
         opacity: 1;
@@ -3490,7 +3513,9 @@ g.legendOrdinal .legendTitle tspan {
       .react-autoql-notification-settings .react-autoql-notification-settings-container .react-autoql-notification-setting-item .react-autoql-notification-action-btn {
         display: flex;
         font-size: 18px;
-        transition: all 0.2s ease;
+        transition-property: color, border-color, background-color, opacity;
+        transition-duration: 0.3s;
+        transition-timing-function: ease;
         padding: 0 10px;
         color: var(--react-autoql-text-color-primary);
         cursor: pointer; }
@@ -3886,6 +3911,9 @@ g.legendOrdinal .legendTitle tspan {
         .react-autoql-notification-list-item .react-autoql-notification-display-name-container .react-autoql-notification-timestamp-container .react-autoql-notification-timestamp .react-autoql-icon {
           margin-right: 3px; }
 
+.react-autoql-notification-options-popover .popover-container-content {
+  padding: 0; }
+
 .react-autoql-notification-list-item:nth-of-type(1) {
   animation-delay: 0s; }
 
@@ -3957,7 +3985,8 @@ g.legendOrdinal .legendTitle tspan {
   color: var(--react-autoql-text-color-primary); }
   .react-autoql-notification-list-container .notification-feed-list {
     padding: 0 20px;
-    padding-bottom: 10px; }
+    padding-bottom: 10px;
+    overflow: hidden; }
 
 .notification-feed-top-options-container {
   display: flex;
@@ -4437,7 +4466,9 @@ g.legendOrdinal .legendTitle tspan {
   .chat-single-message-container:first-of-type {
     margin-top: 10px; }
   .chat-single-message-container .query-more-btn {
-    transition: all 0.3s ease;
+    transition-property: color, border-color, background-color, opacity;
+    transition-duration: 0.3s;
+    transition-timing-function: ease;
     font-size: 22px;
     padding: 13px;
     margin-bottom: 6px;