openwhisk-commits mailing list archives

Site index · List index
Message view « Date » · « Thread »
Top « Date » · « Thread »
From pde...@apache.org
Subject [incubator-openwhisk-website] branch master updated: Revert "move arrow to the anchor and nest the lists" (#330)
Date Wed, 05 Sep 2018 21:30:34 GMT
This is an automated email from the ASF dual-hosted git repository.

pdesai pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/incubator-openwhisk-website.git


The following commit(s) were added to refs/heads/master by this push:
     new 7e6f25e  Revert "move arrow to the anchor and nest the lists" (#330)
7e6f25e is described below

commit 7e6f25ed816635553eab692b849b86a8bfa05ef5
Author: Priti Desai <pdesai@us.ibm.com>
AuthorDate: Wed Sep 5 14:30:32 2018 -0700

    Revert "move arrow to the anchor and nest the lists" (#330)
    
    * Revert "Revert "Fix documentation typos and adjust layout (#328)" (#329)"
    
    This reverts commit 38d350b3d0cfe2cc5658b5b3dc0f42b9983c585f.
    
    * Revert "Fix documentation typos and adjust layout (#328)"
    
    This reverts commit 01ae665ec571f04cb2a5f3ed575c5252ee467856.
    
    * Revert "move arrow to the anchor and nest the lists (#327)"
    
    This reverts commit 7628f735ba77a43da0d7b44bb92f472a2ffc04a2.
---
 _includes/index/index.js    |  59 ++++++++++-----
 _layouts/community.html     |  24 +++---
 _layouts/documentation.html | 173 +++++++++++++++++++-------------------------
 _layouts/downloads.html     |  18 ++---
 _scss/_base.scss            |  44 +++++------
 _scss/_desktop.scss         |   4 +-
 _scss/_tablet.scss          |   4 +-
 7 files changed, 160 insertions(+), 166 deletions(-)

diff --git a/_includes/index/index.js b/_includes/index/index.js
index 69543d1..a85cf49 100644
--- a/_includes/index/index.js
+++ b/_includes/index/index.js
@@ -1,29 +1,52 @@
+
 function applyCollapsible() {
-  var coll = document.getElementsByClassName("collapsible-toggle");
-  var i;
 
-  for (i = 0; i < coll.length; i++) {
-    // Set "click" event listener on all menuitems
-    coll[i].querySelector("a").addEventListener("click", function() {
-      var parent = this.parentElement;
-      var sibling = this.nextElementSibling;
-      // alternate menu open/close states
-      if (sibling !== null) {
-        if (parent.classList.contains("collapsible-toggle-toggled")) {
-          parent.classList.remove("collapsible-toggle-toggled");
-        } else {
-          parent.classList.add("collapsible-toggle-toggled");
-        }
+    var coll = document.getElementsByClassName("collapsible-toggle");
+    var i;
+
+    // Apply exapandable (arrows) to all menuitems with a sibling
+    for (i = 0; i < coll.length; i++) {
+      var sibling = coll[i].nextElementSibling;
+
+      if(sibling!==null){
+          coll[i].style.listStyleImage = "url('../images/elements/arrow-right-12px.png')";
+          // (top right bottom left)
+          sibling.style.padding = "0px 0px 0px 20px";
       }
-    });
-  }
+
+      // Set "click" event listener on all menuitems
+      coll[i].addEventListener("click", function() {
+        var sibling = this.nextElementSibling;
+        // alternate menu open/close states
+        if(sibling!==null){
+          if (sibling.style.display === "block") {
+            this.style.listStyleImage = "url('../images/elements/arrow-right-12px.png')";
+            sibling.style.display = "none";
+          } else {
+            this.style.listStyleImage = "url('../images/elements/arrow-down-12px.png')";
+            sibling.style.display = "block";
+          }
+        }
+      });
+    }
 }
 
+// If sizing of arrows becomes an issue, we can use background approach instead
+// li
+// {
+//     background: url(../images/arrow_icon.gif) no-repeat 4px 4px transparent;
+//     background-image: url("x.png");
+//     list-style-type: none;
+//     margin: 0;
+//     padding: 2px;
+//     vertical-align: middle;
+// }
+
 function openIndex() {
-  console.log("openIndex");
+          console.log("openIndex")
   document.getElementById("index").style.display = "block";
 }
 function closeIndex() {
-  console.log("closeIndex");
+            console.log("closeIndex")
   document.getElementById("index").style.display = "none";
 }
diff --git a/_layouts/community.html b/_layouts/community.html
index 31f94c0..a6fb6ed 100644
--- a/_layouts/community.html
+++ b/_layouts/community.html
@@ -6,25 +6,23 @@ layout: default
 # license agreements; and to You under the Apache License, Version 2.0.
 -->
 
-<div class="whiskIndexedLayout">
+<div id="whiskIndexedLayout">
 
   <!-- Community Index -->
-  <div class="whiskIndex">
+  <div id="whiskIndex">
     <ul>
       <li><a href="#community">Community</a></li>
 
       <!-- Social Media -->
-      <li class="collapsible-toggle">
-          <a href="#social">Media</a>
-          <ul class="collapse-content">
-            <li><a href="#github">GitHub</a></li>
-            <li><a href="#slack">Slack</a></li>
-            <li><a href="#twitter">Twitter</a></li>
-            <li><a href="#youtube">YouTube</a></li>
-            <li><a href="#stackoverflow">Stack Overflow</a></li>
-            <li><a href="#slideshare">Slideshare</a></li>
-          </ul>
-      </li>
+      <li class="collapsible-toggle"><a href="#social">Media</a></li>
+      <ul class="collapse-content">
+        <li><a href="#github">GitHub</a></li>
+        <li><a href="#slack">Slack</a></li>
+        <li><a href="#twitter">Twitter</a></li>
+        <li><a href="#youtube">YouTube</a></li>
+        <li><a href="#stackoverflow">Stack Overflow</a></li>
+        <li><a href="#slideshare">Slideshare</a></li>
+      </ul>
 
       <!-- Mailing lists -->
       <li><a href="#mailing-lists">Mailing Lists</a></li>
diff --git a/_layouts/documentation.html b/_layouts/documentation.html
index f208877..45e4404 100644
--- a/_layouts/documentation.html
+++ b/_layouts/documentation.html
@@ -6,115 +6,94 @@ layout: default
 # license agreements; and to You under the Apache License, Version 2.0.
 -->
 
-<div class="whiskIndexedLayout">
+<div id="whiskIndexedLayout">
     <!-- Documentation Index -->
-    <div class="whiskIndex">
+    <div id="whiskIndex">
         <ul>
             <li><a href="#documentation">Documentation</a></li>
             <li><a href="#project-structure">Project Structure</a></li>
 
             <!-- Operators -->
-            <li class="collapsible-toggle">
-                <a href="#operators">Operators</a>
+            <li class="collapsible-toggle"><a href="#operators">Operators</a></li>
+            <ul class="collapse-content">
+                <li class="collapsible-toggle"><a href="#openwhisk_deployment">OpenWhisk
Deployment</a></li>
                 <ul class="collapse-content">
-                    <li class="collapsible-toggle"><a href="#openwhisk_deployment">OpenWhisk
Deployment</a>
-                        <ul class="collapse-content">
-                            <li><a href="#deploy_docker_compose">Docker Compose</a></li>
-                            <li><a href="#deploy_kubernetes">Kubernetes</a></li>
-                            <li><a href="#deploy_mesos">Mesos</a></li>
-                            <li><a href="#deploy_openshift">OpenShift</a></li>
-                            <li><a href="#deploy_ansible">Ansible</a></li>
-                            <li><a href="#deploy_vagrant">Vagrant</a></li>
-                        </ul>
-                    </li>
-                    <li><a href="#deployment_admin">Administrative Operations</a></li>
-                    <li><a href="#operators_resources">Operators Resources</a></li>
+                    <li><a href="#deploy_docker_compose">Docker Compose</a></li>
+                    <li><a href="#deploy_kubernetes">Kubernetes</a></li>
+                    <li><a href="#deploy_mesos">Mesos</a></li>
+                    <li><a href="#deploy_openshift">OpenShift</a></li>
+                    <li><a href="#deploy_ansible">Ansible</a></li>
+                    <li><a href="#deploy_vagrant">Vagrant</a></li>
                 </ul>
-            </li>
+                <li><a href="#deployment_admin">Administrative Operations</a></li>
+                <li><a href="#operators_resources">Operators Resources</a></li>
+            </ul>
 
             <!-- Developers -->
-            <li class="collapsible-toggle">
-                <a href="#developers">Developers</a>
+            <li class="collapsible-toggle"><a href="#developers">Developers</a></li>
+            <ul class="collapse-content">
+                <li><a href="#pre-requisites">Pre-requisites</a></li>
+                <li class="collapsible-toggle"><a href="#using-openwhisk">Using
OpenWhisk</a></li>
                 <ul class="collapse-content">
-                    <li><a href="#pre-requisites">Pre-requisites</a></li>
-                    <li class="collapsible-toggle">
-                        <a href="#using-openwhisk">Using OpenWhisk</a>
-                        <ul class="collapse-content">
-                            <li><a href="#wsk-cli-install">Installing wsk CLI</a></li>
-                            <li><a href="#wsk-cli">Configuring wsk CLI</a></li>
-                            <li><a href="#wskdeploy">Deployment Tool - wskdeploy</a></li>
-                            <li><a href="#rest-api">OpenWhisk REST API</a></li>
-                            <li><a href="#openwhisk-clients">OpenWhisk Clients</a></li>
-                        </ul>
-                    </li>
-                    <li class="collapsible-toggle">
-                        <a href="#actions">Actions</a>
-                        <ul class="collapse-content">
-                            <li class="collapsible-toggle">
-                                <a href="#nodejs">NodeJS</a>
-                                <ul class="collapse-content">
-                                    <li><a href="#nodejs-actions">Creating and
Invoking Sample Action</a></li>
-                                    <li><a href="#nodejs-runtime">NodeJS Runtime</a></li>
-                                    <li><a href="#nodejs-additional-resources">Additional
Resources</a></li>
-                                </ul>
-                            </li>
-                            <li class="collapsible-toggle">
-                                <a href="#python">Python</a>
-                                <ul class="collapse-content">
-                                    <li><a href="#python-actions">Creating and
Invoking Sample Action</a></li>
-                                    <li><a href="#python-runtime">Python Runtime</a></li>
-                                    <li><a href="#python-additional-resources">Additional
Resources</a></li>
-                                </ul>
-                            </li>
-                            <!--li><a href="#docker">Docker</a>
-                            <ul>
-                                <li>Zip Action</li>
-                                <li>SDK (Writing Your Own Runtime)</li>
-                                <li>Other Resources</li>
-                            </ul></li>-->
-                            <li class="collapsible-toggle">
-                                <a href="#go">Go</a>
-                                <ul class="collapse-content">
-                                    <li><a href="#go-actions">Creating and Invoking
Action</a></li>
-                                    <li><a href="#go-runtime">Go Runtime</a></li>
-                                    <li><a href="#go-additional-resources">Additional
Resources</a></li>
-                                </ul>
-                            </li>
-                            <li class="collapsible-toggle">
-                                <a href="#java">Java</a>
-                                <ul class="collapse-content">
-                                    <li><a href="#java-actions">Creating and
Invoking Action</a></li>
-                                    <li><a href="#java-runtime">Java Runtime</a></li>
-                                    <li><a href="#java-additional-resources">Additional
Resources</a></li>
-                                </ul>
-                            </li>
-                            <li class="collapsible-toggle">
-                                <a href="#php">PHP</a>
-                                <ul class="collapse-content">
-                                    <li><a href="#php-actions">Creating and Invoking
Action</a></li>
-                                    <li><a href="#php-runtime">PHP Runtime</a></li>
-                                    <li><a href="#php-additional-resources">Additional
Resources</a></li>
-                                </ul>
-                            </li>
-                            <!--li class="collapsible-toggle">
-                              <a href="#swift">Swift</a>
-                                <ul class="collapse-content">
-                                    <li><a href="#swift-actions">Creating and
Invoking Action</a></li>
-                                    <li><a href="#swift-runtime">Swift Runtime</a></li>
-                                    <li><a href="#swift-additional-resources">Additional
Resources</a></li>
-                                </ul>
-                            </li>-->
-                        </ul>
-                    </li>
-                    <li><a href="#managing_actions_with_openwhisk_packages">Managing
Actions with OpenWhisk Packages</a></li>
-                    <li><a href="#connecting_actions_to_event_sources">Connecting
Actions to Event Sources</a></li>
-                    <li><a href="#using_openwhisk_enabled_services">Using OpenWhisk
Enabled Services</a></li>
-                    <!--li><a href="#exposing_apis_from_actions">Exposing APIs
from Actions</a></li-->
-                    <li><a href="#sample_openwhisk_applications">Sample OpenWhisk
Applications</a></li>
-                    <li><a href="#tutorial_and_workshop">Tutorial And Workshop</a></li>
-                    <li><a href="#development_tools">Development Tools</a></li>
+                    <li><a href="#wsk-cli-install">Installing wsk CLI</a></li>
+                    <li><a href="#wsk-cli">Configuring wsk CLI</a></li>
+                    <li><a href="#wskdeploy">Deployment Tool - wskdeploy</a></li>
+                    <li><a href="#rest-api">OpenWhisk REST API</a></li>
+                    <li><a href="#openwhisk-clients">OpenWhisk Clients</a></li>
+                </ul>
+                <li class="collapsible-toggle"><a href="#actions">Actions</a></li>
+                <ul class="collapse-content">
+                    <li class="collapsible-toggle"><a href="#nodejs">NodeJS</a></li>
+                    <ul class="collapse-content">
+                        <li><a href="#nodejs-actions">Creating and Invoking Sample
Action</a></li>
+                        <li><a href="#nodejs-runtime">NodeJS Runtime</a></li>
+                        <li><a href="#nodejs-additional-resources">Additional
Resources</a></li>
+                    </ul>
+                    <li class="collapsible-toggle"><a href="#python">Python</a></li>
+                    <ul class="collapse-content">
+                        <li><a href="#python-actions">Creating and Invoking Sample
Action</a></li>
+                        <li><a href="#python-runtime">Python Runtime</a></li>
+                        <li><a href="#python-additional-resources">Additional
Resources</a></li>
+                    </ul>
+                    <!--li><a href="#docker">Docker</a></li>
+                    <ul>
+                        <li>Zip Action</li>
+                        <li>SDK (Writing Your Own Runtime)</li>
+                        <li>Other Resources</li>
+                    </ul-->
+                    <li class="collapsible-toggle"><a href="#go">Go</a></li>
+                    <ul class="collapse-content">
+                        <li><a href="#go-actions">Creating and Invoking Action</a></li>
+                        <li><a href="#go-runtime">Go Runtime</a></li>
+                        <li><a href="#go-additional-resources">Additional Resources</a></li>
+                    </ul>
+                    <li class="collapsible-toggle"><a href="#java">Java</a></li>
+                    <ul class="collapse-content">
+                        <li><a href="#java-actions">Creating and Invoking Action</a></li>
+                        <li><a href="#java-runtime">Java Runtime</a></li>
+                        <li><a href="#java-additional-resources">Additional Resources</a></li>
+                    </ul>
+                    <li class="collapsible-toggle"><a href="#php">PHP</a></li>
+                    <ul class="collapse-content">
+                        <li><a href="#php-actions">Creating and Invoking Action</a></li>
+                        <li><a href="#php-runtime">PHP Runtime</a></li>
+                        <li><a href="#php-additional-resources">Additional Resources</a></li>
+                    </ul>
+                    <!--li class="collapsible-toggle"><a href="#swift">Swift</a></li>
+                    <ul class="collapse-content">
+                        <li><a href="#swift-actions">Creating and Invoking Action</a></li>
+                        <li><a href="#swift-runtime">Swift Runtime</a></li>
+                        <li><a href="#swift-additional-resources">Additional
Resources</a></li>
+                    </ul-->
                 </ul>
-            </li>
+                <li><a href="#managing_actions_with_openwhisk_packages">Managing
Actions with OpenWhisk Packages</a></li>
+                <li><a href="#connecting_actions_to_event_sources">Connecting
Actions to Event Sources</a></li>
+                <li><a href="#using_openwhisk_enabled_services">Using OpenWhisk
Enabled Services</a></li>
+                <!--li><a href="#exposing_apis_from_actions">Exposing APIs from
Actions</a></li-->
+                <li><a href="#sample_openwhisk_applications">Sample OpenWhisk
Applications</a></li>
+                <li><a href="#tutorial_and_workshop">Tutorial And Workshop</a></li>
+                <li><a href="#development_tools">Development Tools</a></li>
+            </ul>
 
             <!-- Contributors -->
             <li><a href="#contributors">Contributors</a></li>
diff --git a/_layouts/downloads.html b/_layouts/downloads.html
index 69f8301..5b2b0b4 100644
--- a/_layouts/downloads.html
+++ b/_layouts/downloads.html
@@ -5,10 +5,10 @@ layout: default
 # Licensed to the Apache Software Foundation (ASF) under one or more contributor
 # license agreements; and to You under the Apache License, Version 2.0.
 -->
-<div class="whiskIndexedLayout">
+<div id="whiskIndexedLayout">
 
     <!-- Community Index -->
-    <div class="whiskIndex">
+    <div id="whiskIndex">
         <ul>
             <li><a href="#downloads">Downloads</a></li>
 
@@ -16,14 +16,12 @@ layout: default
             <li><a href="#versioning">Versioning</a></li>
 
             <!-- Downloads -->
-            <li class="collapsible-toggle">
-                <a href="#releases">Releases</a>
-                <ul class="collapse-content">
-                    <li><a href="#verifying">Verifying</a></li>
-                    <li><a href="#keys">Keys</a></li>
-                    <li><a href="#versions">Versions</a></li>
-                </ul>
-            </li>
+            <li class="collapsible-toggle"><a href="#releases">Releases</a></li>
+            <ul class="collapse-content">
+                <li><a href="#verifying">Verifying</a></li>
+                <li><a href="#keys">Keys</a></li>
+                <li><a href="#versions">Versions</a></li>
+            </ul>
         </ul>
     </div>
 
diff --git a/_scss/_base.scss b/_scss/_base.scss
index 67d78d9..da2ac1a 100644
--- a/_scss/_base.scss
+++ b/_scss/_base.scss
@@ -81,11 +81,11 @@ footer {
 #whiskFooter {
 }
 
-.whiskIndexedLayout {
+#whiskIndexedLayout {
   display: table;
   padding-top: $whisk-header-base-padding-top;
 
-  .whiskIndex {
+  #whiskIndex {
     //vertical-align: top;
     // position menu relative to header
     display: float;
@@ -279,24 +279,15 @@ footer {
   cursor: pointer; // finger shown to let ppl know you can click it
 }
 
-.collapsible-toggle > a {
-  background: url(../images/elements/arrow-right-12px.png) center left no-repeat;
-  padding-left: 18px !important;
+.collapsible-toggle:hover {
+  background-color: $color-menu-collapsible-hover-bg;
 }
 
-.collapsible-toggle.collapsible-toggle-toggled > a {
-  background-image: url(../images/elements/arrow-down-12px.png);
-}
-
-.collapsible-toggle > .collapse-content {
-  margin-left: 20px;
+.collapse-content {
+  padding: 0 18px;
   display: none;
   overflow: hidden;
-}
-
-.collapsible-toggle.collapsible-toggle.collapsible-toggle-toggled
-  > .collapse-content {
-  display: block;
+  background-color: white;
 }
 
 /*
@@ -313,7 +304,7 @@ a.indexable {
   visibility: hidden;
 }
 
-.whiskIndex {
+#whiskIndex {
   // Note: we will turn this off for small/base media, allow other profiles to turn on.
   display: none;
   background-color: $color-index-bg;
@@ -336,18 +327,21 @@ a.indexable {
   li {
     background-color: $color-index-item-bg;
     color: $color-index-fg;
+    border: $index-item-border;
     font-size: $index-menu-font-size;
     font-weight: $index-menu-font-weight;
-    padding: 0;
+    padding: $index-menuitem-padding;
     line-height: $index-menuitem-line-height;
 
     // Control index-item (anchor) text color regardless by state
     a {
-      border: $index-item-border;
       color: $color-index-fg;
       text-decoration: none;
       display: block;
-      padding: $index-menuitem-padding;
+    }
+    a:hover {
+      // use different color on index-item hover
+      color: $color-index-fg-highlight;
     }
     a:visited {
       color: $color-index-fg;
@@ -355,11 +349,13 @@ a.indexable {
     a:active {
       color: $color-index-fg;
     }
-    a:hover {
-      // use different color on index-item hover
+  }
+
+  li:hover {
+    background-color: $color-index-bg-highlight;
+    font-weight: $index-menuitem-font-weight-hover;
+    a {
       color: $color-index-fg-highlight;
-      background-color: $color-index-bg-highlight;
-      font-weight: $index-menuitem-font-weight-hover;
     }
   }
 }
diff --git a/_scss/_desktop.scss b/_scss/_desktop.scss
index 1cd9622..d492c48 100644
--- a/_scss/_desktop.scss
+++ b/_scss/_desktop.scss
@@ -15,11 +15,11 @@
     padding-top: $whisk-header-desktop-padding-top;
   }
 
-  .whiskIndexedLayout {
+  #whiskIndexedLayout {
     // This padding applies to all content pages (no banner)
     padding-top: $whisk-header-desktop-padding-top;
 
-    .whiskIndex {
+    #whiskIndex {
       top: $index-menu-top-offset-desktop;
     }
 
diff --git a/_scss/_tablet.scss b/_scss/_tablet.scss
index 45732e0..4c04a54 100644
--- a/_scss/_tablet.scss
+++ b/_scss/_tablet.scss
@@ -19,11 +19,11 @@
   }
 
   // "Turn on" left index in this profile, as we have width to support it
-  .whiskIndexedLayout {
+  #whiskIndexedLayout {
     padding-top: $whisk-header-tablet-padding-top;
 
     // Show the index area
-    .whiskIndex {
+    #whiskIndex {
       display: block;
     }
 


Mime
View raw message