Mercurial > web-octave
changeset 51:40cbddf42ce4 kai
Repair download tabs.
author | Kai T. Ohlhus <k.ohlhus@gmail.com> |
---|---|
date | Wed, 28 Sep 2016 21:51:37 +0200 |
parents | 1810308dba49 |
children | 8e3e299baf5e |
files | _includes/footer.html _includes/install.html css/octave.css |
diffstat | 3 files changed, 98 insertions(+), 26 deletions(-) [+] |
line wrap: on
line diff
--- a/_includes/footer.html Wed Sep 28 11:30:27 2016 +0200 +++ b/_includes/footer.html Wed Sep 28 21:51:37 2016 +0200 @@ -13,4 +13,18 @@ x.className = "topnav"; } } + +function openCity(evt, cityName) { + var i, tabcontent, tablinks; + tabcontent = document.getElementsByClassName("tabcontent"); + for (i = 0; i < tabcontent.length; i++) { + tabcontent[i].style.display = "none"; + } + tablinks = document.getElementsByClassName("tablinks"); + for (i = 0; i < tablinks.length; i++) { + tablinks[i].className = tablinks[i].className.replace(" active", ""); + } + document.getElementById(cityName).style.display = "block"; + evt.currentTarget.className += " active"; +} </script>
--- a/_includes/install.html Wed Sep 28 11:30:27 2016 +0200 +++ b/_includes/install.html Wed Sep 28 21:51:37 2016 +0200 @@ -1,12 +1,24 @@ -<ul class="tabs" data-tab> - <li class="tab-title"><a href="#source">Source</a></li> - <li class="tab-title active"><a href="#linux">GNU/Linux</a></li> - <li class="tab-title"><a href="#mac">Mac</a></li> - <li class="tab-title"><a href="#bsd">BSD</a></li> - <li class="tab-title"><a href="#windows">Windows</a></li> +<ul class="tab"> + <li><a href="javascript:void(0);" class="tablinks" onclick="openCity(event, 'Source')">Source</a></li> + <li><a href="javascript:void(0);" class="tablinks" onclick="openCity(event, 'GNU/Linux')">GNU/Linux</a></li> + <li><a href="javascript:void(0);" class="tablinks" onclick="openCity(event, 'Mac')">Mac</a></li> + <li><a href="javascript:void(0);" class="tablinks" onclick="openCity(event, 'BSD')">BSD</a></li> + <li><a href="javascript:void(0);" class="tablinks" onclick="openCity(event, 'Windows')">Windows</a></li> </ul> -<div class="tabs-content"> - <div class="content active" id="linux"> + +<div id="Source" class="tabcontent"> + <p> + The latest released version of Octave is always available from + <a href="ftp://ftp.gnu.org/gnu/octave">ftp://ftp.gnu.org/gnu/octave</a>. + </p> + <p> + If you are interested in working with the latest version of the + Octave sources, check out + the <a href="get-involved.html">resources for developers</a>. + </p> +</div> + +<div id="GNU/Linux" class="tabcontent"> <p> Executable versions of Octave for GNU/Linux systems are provided by the individual distributions. Distributions known to package @@ -19,15 +31,17 @@ distribution varies. The Octave project has no control over that process. </p> - </div> - <div class="content" id="mac"> +</div> + +<div id="Mac" class="tabcontent"> <p> The Wiki has some instructions for <a href="http://wiki.octave.org/Octave_for_MacOS_X">installing Octave on OS X systems</a>. </p> - </div> - <div class="content" id="bsd"> +</div> + +<div id="BSD" class="tabcontent"> <p> Executable versions of Octave for BSD systems are provided by the individual distributions. @@ -38,22 +52,11 @@ for a particular GNU/Linux distribution varies. The Octave project has no control over that process. </p> - </div> - <div class="content" id="windows"> +</div> + +<div id="Windows" class="tabcontent"> <p> Windows binaries with corresponding source code can be downloaded from <a href="https://ftp.gnu.org/gnu/octave/windows/">https://ftp.gnu.org/gnu/octave/windows/</a> </p> - </div> - <div class="content" id="source"> - <p> - The latest released version of Octave is always available - from <a href="ftp://ftp.gnu.org/gnu/octave">ftp://ftp.gnu.org/gnu/octave</a>. - </p> - <p> - If you are interested in working with the latest version of the - Octave sources, check out - the <a href="get-involved.html">resources for developers</a>. - </p> - </div> </div>
--- a/css/octave.css Wed Sep 28 11:30:27 2016 +0200 +++ b/css/octave.css Wed Sep 28 21:51:37 2016 +0200 @@ -193,3 +193,58 @@ margin-right: 10%; } } + +ul.tab { + list-style-type: none; + margin: 0; + padding: 0; + overflow: hidden; + background-color: #0790c0; +} + +ul.tab li { + float: left; +} + +ul.tab li a { + display: inline-block; + color: white; + text-align: center; + padding: 14px 16px; + text-decoration: none; + transition: 0.3s; + font-size: 20px; +} + +ul.tab li a:hover { + background-color: #555; +} + +ul.tab li a:focus, .active { + background-color: #555; +} + +.tabcontent { + display: none; + padding: 6px 12px; + -webkit-animation: fadeEffect 1s; + animation: fadeEffect 1s; +} + +@-webkit-keyframes fadeEffect { + from { + opacity: 0; + } + to { + opacity: 1; + } +} + +@keyframes fadeEffect { + from { + opacity: 0; + } + to { + opacity: 1; + } +}