You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@openwhisk.apache.org by pd...@apache.org on 2018/09/05 21:06:43 UTC
[incubator-openwhisk-website] 03/03: Revert "move arrow to the
anchor and nest the lists (#327)"
This is an automated email from the ASF dual-hosted git repository.
pdesai pushed a commit to branch revert-327-fixlist
in repository https://gitbox.apache.org/repos/asf/incubator-openwhisk-website.git
commit 6431e09d6581e7b901c850625e238a0a0fe724d4
Author: Priti Desai <pd...@us.ibm.com>
AuthorDate: Wed Sep 5 14:06:38 2018 -0700
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;
}