Bringing in changes so that failure text no longer times out

Merge remote-tracking branch 'upstream/issues/136' into issues/156
headwirecom · Sep 4, 2020 · f3f372f · f3f372f
2 parents 66f1353 + 51c8a9c
commit f3f372f
Show file tree

Hide file tree

Showing 5 changed files with 14 additions and 57 deletions.
diff --git a/fragments/form/template.html b/fragments/form/template.html
@@ -1,10 +1,8 @@
 <div class="w-full">
-    <transition name="fade">
-        <div class="text-black p-2 rounded-r mt-4 border-l-4 shadow-md note-important">
-            <p class="ml-2"></p>
-            <p class="ml-2"></p>
-        </div>
-    </transition>
+    <div class="text-black p-2 rounded-r mt-4 border-l-4 shadow-md note-important">
+        <p class="ml-2"></p>
+        <p class="ml-2"></p>
+    </div>
     <form class="w-full flex flex-col">
         <div></div>
         <input class="btn mb-4" type="submit">

diff --git a/fragments/form/template.vue b/fragments/form/template.vue
@@ -1,13 +1,11 @@
 <template>
   <themecleanflex-components-block v-bind:model="model">
     <div class="w-full" v-bind:data-per-path="model.path">
-      <transition name="fade">
-        <div class="text-black p-2 rounded-r mt-4 border-l-4 shadow-md note-important"
-        v-if="( failureText || schemaError )">
-          <p class="ml-2" v-if="failureText">{{failureText}}</p>
-          <p class="ml-2" v-if="schemaError">{{schemaError}}</p>
-        </div>
-      </transition>
+      <div class="text-black p-2 rounded-r mt-4 border-l-4 shadow-md note-important"
+      v-if="( failureText || schemaError )">
+        <p class="ml-2" v-if="failureText">{{failureText}}</p>
+        <p class="ml-2" v-if="schemaError">{{schemaError}}</p>
+      </div>
       <form class="w-full flex flex-col" v-bind:class="{
             'justify-button-start': model.submitalignment === 'start',
             'justify-button-center': model.submitalignment === 'center',
@@ -54,16 +52,10 @@ export default {
                 const result = parent[obj](this.model,this.formModel)
                 if(result === false) {
                   Vue.set(this, 'failureText', this.model.failmessage);
-                  setTimeout(() => {
-                    Vue.set(this, 'failureText', '');
-                  }, 1500)
                 }
               } catch(err) {
                 console.error(err)
                 Vue.set(this, 'failureText', this.model.failmessage);
-                setTimeout(() => {
-                  Vue.set(this, 'failureText', '');
-                }, 1500)
               }
               return
             }
@@ -85,9 +77,6 @@ export default {
         })
         .catch( (error) => {
           Vue.set(this, 'failureText', this.model.failmessage);
-          setTimeout(() => {
-            Vue.set(this, 'failureText', '');
-          }, 1500)
         })
       }
     },

diff --git a/ui.apps/src/main/content/jcr_root/apps/themecleanflex/components/form/template.vue b/ui.apps/src/main/content/jcr_root/apps/themecleanflex/components/form/template.vue
@@ -1,13 +1,11 @@
 <template>
   <themecleanflex-components-block v-bind:model="model">
     <div class="w-full" v-bind:data-per-path="model.path">
-      <transition name="fade">
-        <div class="text-black p-2 rounded-r mt-4 border-l-4 shadow-md note-important"
-        v-if="( failureText || schemaError )">
-          <p class="ml-2" v-if="failureText">{{failureText}}</p>
-          <p class="ml-2" v-if="schemaError">{{schemaError}}</p>
-        </div>
-      </transition>
+      <div class="text-black p-2 rounded-r mt-4 border-l-4 shadow-md note-important"
+      v-if="( failureText || schemaError )">
+        <p class="ml-2" v-if="failureText">{{failureText}}</p>
+        <p class="ml-2" v-if="schemaError">{{schemaError}}</p>
+      </div>
       <form class="w-full flex flex-col" v-bind:class="{
             'justify-button-start': model.submitalignment === 'start',
             'justify-button-center': model.submitalignment === 'center',
@@ -54,16 +52,10 @@ export default {
                 const result = parent[obj](this.model,this.formModel)
                 if(result === false) {
                   Vue.set(this, 'failureText', this.model.failmessage);
-                  setTimeout(() => {
-                    Vue.set(this, 'failureText', '');
-                  }, 1500)
                 }
               } catch(err) {
                 console.error(err)
                 Vue.set(this, 'failureText', this.model.failmessage);
-                setTimeout(() => {
-                  Vue.set(this, 'failureText', '');
-                }, 1500)
               }
               return
             }
@@ -85,9 +77,6 @@ export default {
         })
         .catch( (error) => {
           Vue.set(this, 'failureText', this.model.failmessage);
-          setTimeout(() => {
-            Vue.set(this, 'failureText', '');
-          }, 1500)
         })
       }
     },

diff --git a/ui.apps/src/main/content/jcr_root/etc/felibs/themecleanflex/css/build.css b/ui.apps/src/main/content/jcr_root/etc/felibs/themecleanflex/css/build.css
@@ -1341,10 +1341,6 @@ video {
   z-index: 10;
 }
 
-.transition {
-  transition-property: background-color, border-color, color, fill, stroke, opacity, box-shadow, transform;
-}
-
 .transition-colors {
   transition-property: background-color, border-color, color, fill, stroke;
 }
@@ -1728,14 +1724,6 @@ p {
   }
 }
 
-.fade-enter-active, .fade-leave-active {
-  transition: opacity .5s;
-}
-
-.fade-enter, .fade-leave-to /* .fade-leave-active below version 2.1.8 */ {
-  opacity: 0;
-}
-
 /* header */
 
 [class$="components-header"] a {

diff --git a/ui.apps/src/main/content/jcr_root/etc/felibs/themecleanflex/styles.css b/ui.apps/src/main/content/jcr_root/etc/felibs/themecleanflex/styles.css
@@ -280,13 +280,6 @@ p {
   }
 }
 
-.fade-enter-active, .fade-leave-active {
-  transition: opacity .5s;
-}
-.fade-enter, .fade-leave-to /* .fade-leave-active below version 2.1.8 */ {
-  opacity: 0;
-}
-
 /* header */
 [class$="components-header"] a {
   @apply text-sm font-medium;