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 7323a13 Update the `wsk` installation instructions (#321) 7323a13 is described below commit 7323a13662ec90b13a84cb4c1979f3f17ffc96c8 Author: Justin Halsall <juic...@users.noreply.github.com> AuthorDate: Tue Sep 4 15:55:01 2018 -0400 Update the `wsk` installation instructions (#321) * space elements in header equally * set terminal to not trigger horizontal scrollbar on lower screen resolutions * update CLI install docs and prepare for brew * Add seperate section for Windows * add styling for h6 * add installation to naviation * uncomment brew docs * break up installtion and config instructions --- _layouts/documentation.html | 59 +++++++++++++++++++--- _scss/_desktop.scss | 4 +- _scss/_skin.scss | 116 +++++++++++++++++++++++++------------------- _scss/_tablet.scss | 1 - _scss/_variables.scss | 43 ++++++++-------- 5 files changed, 142 insertions(+), 81 deletions(-) diff --git a/_layouts/documentation.html b/_layouts/documentation.html index 22607f7..45e4404 100644 --- a/_layouts/documentation.html +++ b/_layouts/documentation.html @@ -35,6 +35,7 @@ layout: default <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="#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> @@ -633,6 +634,53 @@ $ make quick-start <a href="https://github.com/apache/incubator-openwhisk/blob/master/ansible/files/auth.guest">https://github.com/apache/incubator-openwhisk/blob/master/ansible/files/auth.guest</a>. Also, use the <strong>192.168.33.13</strong> address as the whisk API host. </p> + + </div> + </main> + + <main class="doc"> + <div class="content"> + + <a class="indexable" id="wsk-cli-install"></a> + <h5>Install the wsk CLI</h5> + + <h6>Install the wsk with Homebrew (Mac & Linux)</h6> + <p>To easily install the OpenWhisk CLI (wsk) you can use <a href="https://brew.sh">Homebrew for Mac</a> or <a href="http://linuxbrew.sh">Homebrew for Linux</a>.</p> + <div class="terminal"> +{% highlight bash %} +$ brew update +$ brew install wsk +{% endhighlight %} + </div> + <p>Then you can invoke the OpenWhisk CLI by just typing <code>wsk</code>.</p> + <h6>Install the wsk CLI from a tar.gz (Mac & Linux):</h6> + <p>If for any reason you can't or don't want to use one of the previous installation method, you can still download the OpenWhisk CLI in a standalone .tar.gz file with everything you need to get started.</p> + + <p>The latest files can be found on the Releases page at GitHub: <a href="https://github.com/apache/incubator-openwhisk-cli/releases">https://github.com/apache/incubator-openwhisk-cli/releases</a></p> + <p>Download the file for your platform and uncompress it. Inside it you will have a <code>wsk</code> executable.</p> + <p>To make it simpler to use, you can move the binary into your PATH:</p> + + <div class="terminal"> + {% highlight bash %}$ sudo mv [full path to downloaded wsk] /usr/local/bin/wsk{% endhighlight %} + </div> + + <p>Then you can invoke the OpenWhisk CLI by just typing <code>wsk</code>.</p> + + <h6>Install the wsk CLI from a tar.gz (Windows):</h6> + + <p>The latest files can be found on the Releases page at GitHub: <a href="https://github.com/apache/incubator-openwhisk-cli/releases">https://github.com/apache/incubator-openwhisk-cli/releases</a></p> + <p>Download the file for your platform and uncompress it. Inside it you will have a <code>wsk.exe</code> executable.</p> + <p>To make it simpler to use, you should <a href="https://www.computerhope.com/issues/ch000549.htm">add it to your PATH</a>.</p> + + <p>Then you can invoke the OpenWhisk CLI by just typing <code>wsk</code>.</p> + + </div> + </main> + + <main class="doc"> + <div class="content"> + + <a class="indexable" id="wsk-cli"></a> <h5>Configure the wsk CLI</h5> <p> @@ -640,11 +688,6 @@ $ make quick-start </p> <ul> <li> - <strong>Download the wsk CLI:</strong> - Download wsk binary for your local environment into a location in your shell path from - <a href="https://github.com/apache/incubator-openwhisk-cli/releases">here</a>. - </li> - <li> <strong>CLI Help:</strong> To get the CLI command help, execute the following command: <div class="terminal"> @@ -756,7 +799,7 @@ $ wsk list <a href="https://github.com/apache/incubator-openwhisk/blob/master/docs/actions.md#languages-and-runtimes">Here</a> is the list of runtimes supported by OpenWhisk: </p> - + <ul> <li><a href="#nodejs">JavaScript</a> - OpenWhisk runtime for Node.js v6 and v8</li> <li><a href="https://github.com/apache/incubator-openwhisk-runtime-docker/blob/master/README.md">Docker</a> - OpenWhisk runtime for Docker Actions using SDK</li> @@ -766,7 +809,7 @@ $ wsk list <li><a href="https://github.com/apache/incubator-openwhisk-runtime-swift/blob/master/README.md">Swift</a> - OpenWhisk runtime for Swift 3 and 4</li> <li><a href="#java">Java</a> - OpenWhisk runtime for Java 8</li> </ul> - + <p> While the actual function code will be specific to a language and runtime, the OpenWhisk operations to create, invoke and manage an action are the same regardless of the implementation choice. OpenWhisk wsk CLI and Whisk Deploy @@ -782,7 +825,7 @@ $ wsk list <a href="mailto:d...@openwhisk.incubator.apache.org">d...@openwhisk.incubator.apache.org</a>. once you have followed the guide on creating a new language/runtimes. Here are some examples of runtimes added by community: </p> - + <ul> <li><a href="https://github.com/rainbyte/openwhisk-wrapper">Haskell based OpenWhisk Services</a></li> <li><a href="http://jamesthom.as/blog/2017/01/18/openwhisk-and-rust/">OpenWhisk and Rust</a></li> diff --git a/_scss/_desktop.scss b/_scss/_desktop.scss index 020af02..d492c48 100644 --- a/_scss/_desktop.scss +++ b/_scss/_desktop.scss @@ -11,8 +11,8 @@ } #whiskHeader { - // This padding applies only to the home page which has a banner - padding-top: $whisk-header-desktop-padding-top; + // This padding applies only to the home page which has a banner + padding-top: $whisk-header-desktop-padding-top; } #whiskIndexedLayout { diff --git a/_scss/_skin.scss b/_scss/_skin.scss index 9546f0f..21b22ad 100644 --- a/_scss/_skin.scss +++ b/_scss/_skin.scss @@ -1,56 +1,72 @@ * { - box-sizing: border-box; - background: none; - border: 0 + box-sizing: border-box; + background: none; + border: 0; } body { - font-family: $font-family-default; + font-family: $font-family-default; } -h1, h2, h3, h4, h5 { - font-weight: $font-weight-bold; - margin: 0; +h1, +h2, +h3, +h4, +h5, +h6 { + font-weight: $font-weight-bold; + margin: 0; } h1 { - font-size: $h1-font-size; - line-height: $h1-line-height; + font-size: $h1-font-size; + line-height: $h1-line-height; } h2 { - font-size: $h2-font-size; - line-height: $h2-line-height; + font-size: $h2-font-size; + line-height: $h2-line-height; } h3 { - font-size: $h3-font-size; - line-height: $h3-line-height; + font-size: $h3-font-size; + line-height: $h3-line-height; } h4 { - font-size: $h4-font-size; - line-height: $h4-line-height; + font-size: $h4-font-size; + line-height: $h4-line-height; } h5 { - font-size: $h5-font-size; - line-height: $h5-line-height; + font-size: $h5-font-size; + line-height: $h5-line-height; } -p, ul, ol, li { - font-size: $p-font-size; - font-weight: $p-font-weight; - line-height: $p-line-height; - color: $color-blue-dark-text; +h6 { + font-size: $h6-font-size; + line-height: $h6-line-height; } -a, a:visited, a:hover, a:active { - color: $color-anchors; +p, +ul, +ol, +li { + font-size: $p-font-size; + font-weight: $p-font-weight; + line-height: $p-line-height; + color: $color-blue-dark-text; +} + +a, +a:visited, +a:hover, +a:active { + color: $color-anchors; } a.button { - color: $color-white; + color: $color-white; } // The syntax highlighter uses the "figure" element, but we want to override its default margins @@ -59,35 +75,35 @@ figure { } .button { - background-color: $color-blue-dark; - border-bottom: solid 3px #b2b1b1; - border-radius: 6px; - border: solid 1px $color-gray-percent-82; - box-shadow: inset 0 0 0 1px $color-gray-percent-96; - color: $color-blue-dark; - display: inline-block; - font-family: $font-family-default; - font-size: 13px; - font-weight: 300; - letter-spacing: 0.5px; - line-height: 40px; - padding: 0 20px; - position: relative; - text-align: center; - text-decoration: none; - text-shadow: 0 1px 0 rgba($color-blue-dark, 0.6); + background-color: $color-blue-dark; + border-bottom: solid 3px #b2b1b1; + border-radius: 6px; + border: solid 1px $color-gray-percent-82; + box-shadow: inset 0 0 0 1px $color-gray-percent-96; + color: $color-blue-dark; + display: inline-block; + font-family: $font-family-default; + font-size: 13px; + font-weight: 300; + letter-spacing: 0.5px; + line-height: 40px; + padding: 0 20px; + position: relative; + text-align: center; + text-decoration: none; + text-shadow: 0 1px 0 rgba($color-blue-dark, 0.6); } .button:hover { - background: $color-blue-gray-medium; - border: solid 1px $color-gray-percent-76; - border-bottom: solid 3px $color-gray-percent-70; - box-shadow: inset 0 0 0 1px $color-gray-percent-94; + background: $color-blue-gray-medium; + border: solid 1px $color-gray-percent-76; + border-bottom: solid 3px $color-gray-percent-70; + box-shadow: inset 0 0 0 1px $color-gray-percent-94; } .button:active { - background: #dfdfdf; - border: solid 1px $color-gray-percent-56; - box-shadow: inset 0 10px 15px 0 $color-gray-percent-78; - top:2px; + background: #dfdfdf; + border: solid 1px $color-gray-percent-56; + box-shadow: inset 0 10px 15px 0 $color-gray-percent-78; + top: 2px; } diff --git a/_scss/_tablet.scss b/_scss/_tablet.scss index 8e4aa2c..4c04a54 100644 --- a/_scss/_tablet.scss +++ b/_scss/_tablet.scss @@ -1,5 +1,4 @@ @media screen and (min-width: $media-size-tablet-start) { - footer { padding: $whisk-footer-base-padding-tablet; } diff --git a/_scss/_variables.scss b/_scss/_variables.scss index e1303e6..a0ff1aa 100644 --- a/_scss/_variables.scss +++ b/_scss/_variables.scss @@ -159,6 +159,9 @@ $h4-line-height: 28px; $h5-font-size: 16px; $h5-line-height: 28px; +$h6-font-size: $font-size-default; +$h6-line-height: 24px; + $p-font-size: $font-size-default; $p-font-weight: $font-weight-default; $p-line-height: $line-height-default; @@ -166,25 +169,25 @@ $p-line-height: $line-height-default; /* * Header */ - $header-base-h1-font-size: 32px; - $header-base-h1-font-weight: 300; - $header-base-h1-font-style: normal; - $header-base-h1-line-height: 42px; - - $header-base-h5-font-size: 14px; - $header-base-h5-font-weight: 300; - $header-base-h5-font-style: normal; - $header-base-h5-line-height: 28px; - - $header-tablet-h1-font-size: $header-base-h1-font-size + 4px; - $header-tablet-h1-font-weight: $header-base-h1-font-weight; - $header-tablet-h1-font-style: $header-base-h1-font-style; - $header-tablet-h1-line-height: $header-base-h1-line-height + 2px; - - $header-tablet-h5-font-size: $header-base-h5-font-size + 2px; - $header-tablet-h5-font-weight: $header-base-h5-font-weight; - $header-tablet-h5-font-style: $header-base-h5-font-style; - $header-tablet-h5-line-height: $header-base-h5-line-height; +$header-base-h1-font-size: 32px; +$header-base-h1-font-weight: 300; +$header-base-h1-font-style: normal; +$header-base-h1-line-height: 42px; + +$header-base-h5-font-size: 14px; +$header-base-h5-font-weight: 300; +$header-base-h5-font-style: normal; +$header-base-h5-line-height: 28px; + +$header-tablet-h1-font-size: $header-base-h1-font-size + 4px; +$header-tablet-h1-font-weight: $header-base-h1-font-weight; +$header-tablet-h1-font-style: $header-base-h1-font-style; +$header-tablet-h1-line-height: $header-base-h1-line-height + 2px; + +$header-tablet-h5-font-size: $header-base-h5-font-size + 2px; +$header-tablet-h5-font-weight: $header-base-h5-font-weight; +$header-tablet-h5-font-style: $header-base-h5-font-style; +$header-tablet-h5-line-height: $header-base-h5-line-height; /* * Index @@ -254,7 +257,7 @@ $terminal-line-number-padding: 10px; * Image Wrapper */ - // prevent images from renmdering too large using width to determine scale +// prevent images from renmdering too large using width to determine scale $image-wrapper-width: 100%; $image-wrapper-height: 100%; $image-wrapper-max-width: 500px;