Animation Under All Tabs are Working

Highlighting animation are working under all tabs on navigation between different tabs. Fixes #295
coala · Dec 17, 2018 · 65b23b6 · 65b23b6
1 parent 2759b0f
commit 65b23b6
Show file tree

Hide file tree

Showing 5 changed files with 16 additions and 52 deletions.
diff --git a/partials/tabs/about.html b/partials/tabs/about.html
@@ -40,7 +40,6 @@ <h2 class="fine center">about</h2>
               <li>File caching support - run only on changed files.</li>
             </ul>
           </div>
-
         </div>
       </div>
     </div>
@@ -55,7 +54,6 @@ <h2 class="fine center">about</h2>
                 will store all your settings for coala
               <li>using command-line arguments
             </ul>
-
           </div>
           <div class="card-tabs">
             <ul class="tabs tabs-fixed-width">
@@ -89,13 +87,11 @@ <h2 class="fine center">about</h2>
                 setting for the <code>SpaceConsistencyBear</code> defined
                 <a href="https://github.com/coala/bear-docs/blob/master/docs/SpaceConsistencyBear.rst">here</a>.
             </ul>
-
             <code>[Spacing]</code> is a *section*. Sections are executed in the
             order you define them.
             <br>
             Store the file in the project's root directory and run coala:
 <pre>$ coala</pre>
-
             Please read our
             <a href="http://docs.coala.io/en/latest/Users/coafile.html">
               coafile specification
@@ -105,28 +101,21 @@ <h2 class="fine center">about</h2>
             <div id="test6">
               However, if you don't want to save your settings, you can also run coala with
               command line arguments:
-
   <pre>$ coala --files=setup.py --bears=SpaceConsistencyBear -S use_spaces=True</pre>
-
   Note that this command does the same thing as having a coafile and running
   <code>coala</code>. The advantage of having a coafile is that you don't need to enter the
   settings as arguments everytime.
   <br><br>
   To get the complete list of arguments and their meaning, run:
-
   <pre>$ coala --help</pre>
-
-
             </div>
           </div>
         </div>
       </div>
     </div>
-
 </div>
 <script>
 $(document).ready(function(){
   $('ul.tabs').tabs();
 });
-
 </script>
diff --git a/partials/tabs/coalaonline.html b/partials/tabs/coalaonline.html
@@ -154,7 +154,6 @@ <h4>Optional Settings</h4>
           </span>
         </div>
       </div>
-
       <div class="row blue-grey lighten-5 black-text new-section z-depth-1">
         <div class="col m3 offset-m3">
           <input type="text" placeholder="Give a section name!" class="no-margins" id="new-section">
@@ -168,7 +167,6 @@ <h4>Optional Settings</h4>
       </div>
     </div>
   </div>
-
   <div ng-show="sections" class="row">
     <div class="col m12 s12 center">
       <div>
@@ -225,9 +223,7 @@ <h4>Optional Settings</h4>
       </div>
     </div>
   </div>
-
   <br><br>
-
   <div class="row">
     <div class="col m6 s12" ng-show="results">
       <div class="result">
@@ -274,3 +270,8 @@ <h6 class="uppercase"><strong><span class="lowercase">c</span>OAFILE</strong></h
     </div>
   </div>
 </div>
+<script>
+$(document).ready(function(){
+  $('ul.tabs').tabs();
+});
+</script>
diff --git a/partials/tabs/getinvolved.html b/partials/tabs/getinvolved.html
@@ -18,15 +18,11 @@ <h4 class="center light">
             </h4>
         </div>
     </div>
-
 </div>
 <section>
     <div class="container"><br>
-
         <h2 class="fine center">meet the community</h2>
         <h4 class="light center">We, the coalaians.</h4>
-
-
     </div>
     <div class="container user">
         <div class="row parent-wrapper center">
@@ -68,7 +64,6 @@ <h4 class="light center">We, the coalaians.</h4>
     </div>
 </div>
 <div class="container events"><br>
-
     <h2 class="fine center">come meet us</h2>
     <h4 class="light center">We’d love to share a bar of chocolate with you!
     </h4><br>
@@ -77,3 +72,8 @@ <h4 class="light center">We’d love to share a bar of chocolate with you!
     </div>
 </div>
 </section>
+<script>
+ $(document).ready(function(){
+    $('ul.tabs').tabs();
+});
+</script>
diff --git a/partials/tabs/home.html b/partials/tabs/home.html
@@ -5,7 +5,6 @@
                 <img class="logo center" src="https://api.coala.io/en/latest/_static/images/coala_logo.svg">
             </center>
         </div>
-
         <div class="col m6 s12">
             <div class="title flow-text">coala</div>
             <ul class="center row flow-text no-margin">
@@ -17,12 +16,10 @@ <h4 class="center light">linting and fixing code for all languages</h4>
         </div>
     </div>
 </div>
-
 <section id="installation">
     <div class="container">
         <div class="install-tip">
             <h2 class="fine">install coala</h2>
-
             <div class="thin-row-small row no-border">
                 <div class="col m6 s12">
                     <h5 class="light">simply install coala</h5>
@@ -48,9 +45,7 @@ <h5 class="light">simply install coala</h5>
 </pre>
                 </div>
             </div>
-
             <div class="divider"></div>
-
             <div class="thin-row-small row">
                 <div class="col m6 s12">
                     <h5 class="light">get it in docker</h5>
@@ -66,9 +61,7 @@ <h5 class="light">get it in docker</h5>
                     </p>
                 </div>
             </div>
-
             <div class="divider"></div>
-
             <div class="thin-row-small row">
                 <div class="col m6 s12">
                     <h5 class="light">coala is available in a lot of editors!</h5>
@@ -92,12 +85,10 @@ <h5>
         </div>
     </div>
 </section>
-
 <section ng-controller="SnippetController as sc">
     <div class="container">
         <div class="examples">
             <h2 class="fine">get started</div>
-
             <div class="row">
                 <div class="col m4 s12">
                     <br>
@@ -117,7 +108,6 @@ <h2 class="fine">get started</div>
                         </a>
                     </p>
                 </div>
-
                 <div class="col m8 s12">
                     <div btf-markdown ng-include="'data/snippets/' + sc.snip[sc.lang_selected]" class="card card-content"></div>
                     <p>
@@ -131,3 +121,8 @@ <h2 class="fine">get started</div>
         </div>
     </div>
 </section>
+<script>
+$(document).ready(function(){
+  $('ul.tabs').tabs();
+});
+</script>
diff --git a/partials/tabs/languages.html b/partials/tabs/languages.html
@@ -1,6 +1,5 @@
 <section class="container">
 <div>
-
     <div class="col-md-8 col-md-offset-2 input-field searchbar">
       <input ng-model="searchText" placeholder="Search for a bear or a language" id="search" class="validate" type="search" required>
       <label id="icon" class="label-icon" for="search"><i class="material-icons">search</i></label>
@@ -9,11 +8,8 @@
         If you find an issue with this documentation, you can report it
         <a href="https://github.com/coala/coala-bears/issues">at the coala-bears repository</a>.
     </div>
-
 </div>
-
 <br>
-
 <section>
   <div class="section">
     <div class="showcase">
@@ -30,7 +26,6 @@
               <div class="circle"></div>
             </div>
           </div>
-
           <div class="spinner-layer spinner-red">
             <div class="circle-clipper left">
               <div class="circle"></div>
@@ -42,7 +37,6 @@
               <div class="circle"></div>
             </div>
           </div>
-
           <div class="spinner-layer spinner-yellow">
             <div class="circle-clipper left">
               <div class="circle"></div>
@@ -54,7 +48,6 @@
               <div class="circle"></div>
             </div>
           </div>
-
           <div class="spinner-layer spinner-green">
             <div class="circle-clipper left">
               <div class="circle"></div>
@@ -88,41 +81,32 @@
     </div>
   </div>
 </section>
-
 <div id="modal1" class="modal theatre">
     <div class="modal-content">
-
         <div class="container profile">
             <div class="name">
                 {{currentBear.name}}
             </div>
-
             <div class="label" ng-show="currentBear.CAN_DETECT.length>0" >
                 <div class="small-heading">CAN DETECT</div>
                 <span class="candetect chip" ng-repeat="candetect in currentBear.CAN_DETECT">{{ candetect }}</span><br>
             </div>
-
             <div class="label" ng-show="currentBear.CAN_FIX.length>0">
                 <div class="small-heading">CAN FIX</div>
                 <span class="candetect chip" ng-repeat="canfix in currentBear.CAN_FIX">{{ canfix }}</span><br>
             </div>
-
             <div class="label" ng-show="currentBear.LANGUAGES.length>0">
                 <div class="small-heading">LANGUAGES</div>
                 <span ng-repeat="langs in currentBear.LANGUAGES" style="cursor:pointer;"> <a class="candetect chip"ng-click = "langSearch(langs)">{{ langs }}</a></span><br>
             </div><br>
-
         </div>
         <div class="container dashboard">
             <div btf-markdown="currentBear.metadata.desc" class="description">
             </div>
-
             <div ng-show="currentBear.metadata.non_optional_params.length>0 ||
               currentBear.metadata.optional_params.length>0" >
               <div class="small-heading">SETTINGS</div>
-
               <br>
-
               <div class="settings">
                 <span class="settings-options">
                   <i class="fa fa-square light-blue-text text-accent-3" aria-hidden="true"></i>
@@ -159,9 +143,7 @@
                 </div>
               </div>
             </div>
-
             <br>
-
             <div class="row detail-row">
                 <center>
                     <div class="col m4">
@@ -197,9 +179,9 @@
     </div>
 </div>
 </section>
-
 <script>
     $(document).ready(function () {
+      $('ul.tabs').tabs();
         $('.modal').modal({
       dismissible: true, // Modal can be dismissed by clicking outside of the modal
       opacity: 0.8, // Opacity of modal background
@@ -214,9 +196,6 @@
       complete: function() {  } // Callback for Modal close
   }
   );
-
-
     $('.tooltipped').tooltip({delay: 50});
-
     })
 </script>