[Author Prev][Author Next][Thread Prev][Thread Next][Author Index][Thread Index]

[tor-commits] [nyx/master] Drop wrapper 'panes' div



commit 981e666340bea021408c1a9aebe23b05514f1e98
Author: Damian Johnson <atagar@xxxxxxxxxxxxxx>
Date:   Fri Jul 28 16:49:52 2017 -0700

    Drop wrapper 'panes' div
    
    Oh. Thought this was necessary for tabs to work but that turns out not to be
    the case. Neat.
---
 web/index.html | 252 ++++++++++++++++++++++++++++-----------------------------
 web/styles.css |   4 +-
 2 files changed, 127 insertions(+), 129 deletions(-)

diff --git a/web/index.html b/web/index.html
index e1c3c6d..5da37bf 100644
--- a/web/index.html
+++ b/web/index.html
@@ -25,167 +25,165 @@
       </div>
     </div>
 
-    <div class="panes">
-      <div id="home" class="content">
-        <div id="welcome" class="section"></div>
-        <a href="#welcome" class="section-title">Welcome to Nyx</a>
+    <div id="home" class="page">
+      <div id="welcome" class="section"></div>
+      <a href="#welcome" class="section-title">Welcome to Nyx</a>
 
-        <p>Nyx is a command-line monitor for <a href="https://www.torproject.org/";>Tor</a>. With this you can get detailed real-time information about your relay such as bandwidth usage, connections, logs, and much more.</p>
+      <p>Nyx is a command-line monitor for <a href="https://www.torproject.org/";>Tor</a>. With this you can get detailed real-time information about your relay such as bandwidth usage, connections, logs, and much more.</p>
 
-        <p>Nyx's latest version is <b>1.4.5</b>, released April 28th, 2012. Prior to our upcoming release this application went under the name of '<b>arm</b>'. Sorry for the confusion!</p>
+      <p>Nyx's latest version is <b>1.4.5</b>, released April 28th, 2012. Prior to our upcoming release this application went under the name of '<b>arm</b>'. Sorry for the confusion!</p>
 
-        <div id="features" class="section"></div>
-        <a href="#features" class="section-title">What does Nyx provide?</a>
+      <div id="features" class="section"></div>
+      <a href="#features" class="section-title">What does Nyx provide?</a>
 
-        <div class="feature">
-          <a id="bandwidth"></a>
-          <a href="images/screenshots/front_page.png"><img src="images/features/bandwidth.png" alt="bandwidth" /></a>
-          <span class="feature-arrow">&laquo;</span><a href="#bandwidth" class="feature-title">Bandwidth Graph</a>
-          <p>Bandwidth used by Tor. You can press 'i' to pick the graphing <b>interval</b>, or 's' to show other usage <b>statistics</b>.</p>
-        </div>
+      <div class="feature">
+        <a id="bandwidth"></a>
+        <a href="images/screenshots/front_page.png"><img src="images/features/bandwidth.png" alt="bandwidth" /></a>
+        <span class="feature-arrow">&laquo;</span><a href="#bandwidth" class="feature-title">Bandwidth Graph</a>
+        <p>Bandwidth used by Tor. You can press 'i' to pick the graphing <b>interval</b>, or 's' to show other usage <b>statistics</b>.</p>
+      </div>
 
-        <div class="feature">
-          <a id="events"></a>
-          <a href="images/screenshots/front_page.png"><img src="images/features/events.png" alt="event log" /></a>
-          <span class="feature-arrow">&laquo;</span><a href="#events" class="feature-title">Event Log</a>
-          <p>Tor logs a wealth of information about itself. We present it, colorized and deuplicated. Press 'e' to select what <b>events</b> are logged and 'f' to <b>filter</b> to just what you want.</p>
-        </div>
+      <div class="feature">
+        <a id="events"></a>
+        <a href="images/screenshots/front_page.png"><img src="images/features/events.png" alt="event log" /></a>
+        <span class="feature-arrow">&laquo;</span><a href="#events" class="feature-title">Event Log</a>
+        <p>Tor logs a wealth of information about itself. We present it, colorized and deuplicated. Press 'e' to select what <b>events</b> are logged and 'f' to <b>filter</b> to just what you want.</p>
+      </div>
 
-        <div class="feature">
-          <a id="connections"></a>
-          <a href="images/screenshots/connections.png"><img src="images/features/connections.png" alt="connections" /></a>
-          <span class="feature-arrow">&laquo;</span><a href="#connections" class="feature-title">Connections</a>
-          <p>Connection data similar to netstat or lsof, but correlated with Tor relay information to make it much richer. Press 'enter' for more <b>details</b>, 's' to <b>sort</b>, and 'd' to see raw <b>descriptor</b> data.</p>
-        </div>
+      <div class="feature">
+        <a id="connections"></a>
+        <a href="images/screenshots/connections.png"><img src="images/features/connections.png" alt="connections" /></a>
+        <span class="feature-arrow">&laquo;</span><a href="#connections" class="feature-title">Connections</a>
+        <p>Connection data similar to netstat or lsof, but correlated with Tor relay information to make it much richer. Press 'enter' for more <b>details</b>, 's' to <b>sort</b>, and 'd' to see raw <b>descriptor</b> data.</p>
+      </div>
 
-        <div class="feature">
-          <a id="config_editor"></a>
-          <a href="images/screenshots/config_editor.png"><img src="images/features/config_editor.png" alt="configuration editor" /></a>
-          <span class="feature-arrow">&laquo;</span><a href="#config_editor" class="feature-title">Configuration Editor</a>
-          <p>Editor to change Tor's setting on the fly, with usage information from its manual. Press 'enter' to <b>change</b> Tor settings and 'w' to <b>write</b> your changes to disk.</p>
-        </div>
+      <div class="feature">
+        <a id="config_editor"></a>
+        <a href="images/screenshots/config_editor.png"><img src="images/features/config_editor.png" alt="configuration editor" /></a>
+        <span class="feature-arrow">&laquo;</span><a href="#config_editor" class="feature-title">Configuration Editor</a>
+        <p>Editor to change Tor's setting on the fly, with usage information from its manual. Press 'enter' to <b>change</b> Tor settings and 'w' to <b>write</b> your changes to disk.</p>
+      </div>
 
-        <div class="feature">
-          <a id="torrc"></a>
-          <a href="images/screenshots/torrc.png"><img src="images/features/torrc.png" alt="torrc" /></a>
-          <span class="feature-arrow">&laquo;</span><a href="#torrc" class="feature-title">Torrc</a>
-          <p>Provides your torrc with line numbers and syntax highlighting. Comments can be <b>stripped</b> by pressing 's'.</p>
-        </div>
+      <div class="feature">
+        <a id="torrc"></a>
+        <a href="images/screenshots/torrc.png"><img src="images/features/torrc.png" alt="torrc" /></a>
+        <span class="feature-arrow">&laquo;</span><a href="#torrc" class="feature-title">Torrc</a>
+        <p>Provides your torrc with line numbers and syntax highlighting. Comments can be <b>stripped</b> by pressing 's'.</p>
+      </div>
 
-        <div class="feature">
-          <a id="interpreter"></a>
-          <a href="images/screenshots/interpreter.png"><img src="images/features/interpreter.png" alt="interpreter" /></a>
-          <span class="feature-arrow">&laquo;</span><a href="#interpreter" class="feature-title">Interpreter</a>
-          <p>Integration with <a href="https://stem.torproject.org/";>Stem's</a> <a href="https://stem.torproject.org/tutorials/down_the_rabbit_hole.html";>interpreter</a>, providing <a href="https://gitweb.torproject.org/torspec.git/tree/control-spec.txt";>raw controller access</a>, irc-style commands like <b>/help</b>, tab completion, history scrollback, and a python prompt.</p>
-        </div>
+      <div class="feature">
+        <a id="interpreter"></a>
+        <a href="images/screenshots/interpreter.png"><img src="images/features/interpreter.png" alt="interpreter" /></a>
+        <span class="feature-arrow">&laquo;</span><a href="#interpreter" class="feature-title">Interpreter</a>
+        <p>Integration with <a href="https://stem.torproject.org/";>Stem's</a> <a href="https://stem.torproject.org/tutorials/down_the_rabbit_hole.html";>interpreter</a>, providing <a href="https://gitweb.torproject.org/torspec.git/tree/control-spec.txt";>raw controller access</a>, irc-style commands like <b>/help</b>, tab completion, history scrollback, and a python prompt.</p>
+      </div>
 
-        <div class="feature">
-          <a id="and_more"></a>
-          <img src="images/features/menu.png" alt="menu" />
-          <span class="feature-arrow">&laquo;</span><a href="#and_more" class="feature-title">... and more!</a>
-          <p>That's just the tip of the iceburg. All pages within Nyx provide <b>help</b> information when you press 'h' and <b>menu</b> in response to 'm'. So go explore!</p>
-        </div>
+      <div class="feature">
+        <a id="and_more"></a>
+        <img src="images/features/menu.png" alt="menu" />
+        <span class="feature-arrow">&laquo;</span><a href="#and_more" class="feature-title">... and more!</a>
+        <p>That's just the tip of the iceburg. All pages within Nyx provide <b>help</b> information when you press 'h' and <b>menu</b> in response to 'm'. So go explore!</p>
       </div>
+    </div>
 
-      <div id="faq" class="content">
-        <div class="section"></div>
-        <a href="#faq" class="section-title">Fact &amp; Question</a>
+    <div id="faq" class="page">
+      <div class="section"></div>
+      <a href="#faq" class="section-title">Fact &amp; Question</a>
 
-        <br /><br />
+      <br /><br />
 
-        <div class="question" id="what_is_nyx">
-          <span>What is Nyx?</span>
-          <div class="answer">
-            <a href="images/screenshots/front_page.png"><img src="images/faq/front_page.png" alt="screenshot" /></a>
-            <p>Nyx is a command-line application for monitoring real time <a href="https://www.torproject.org/";>Tor</a> status information. This includes bandwidth usage, logs, connections, configuration, and more.</p>
-            <p>As a curses interface Nyx is particularly well suited for ssh connections, tty terminals, and command-line aficionados.</p>
-          </div>
+      <div class="question" id="what_is_nyx">
+        <span>What is Nyx?</span>
+        <div class="answer">
+          <a href="images/screenshots/front_page.png"><img src="images/faq/front_page.png" alt="screenshot" /></a>
+          <p>Nyx is a command-line application for monitoring real time <a href="https://www.torproject.org/";>Tor</a> status information. This includes bandwidth usage, logs, connections, configuration, and more.</p>
+          <p>As a curses interface Nyx is particularly well suited for ssh connections, tty terminals, and command-line aficionados.</p>
         </div>
+      </div>
 
-        <div class="question" id="why_is_it_called_nyx">
-          <span>Why is it called Nyx?</span>
-          <div class="answer">
-            <a href="http://fallenlights.net/";><img src="images/faq/shadowgirl.jpg" alt="greek goddess" title="Nyx by Shadowgirl, used with permission." /></a>
-            <p style="min-height: 340px">Simple - because the <a href="https://en.wikipedia.org/wiki/Nyx";>Greek goddess of night</a> is short and memorable. Terminal applications are handiest when they're brief and easy to type. Top, ssh, scp - anything longer is just begging to be aliased down.</p>
-          </div>
+      <div class="question" id="why_is_it_called_nyx">
+        <span>Why is it called Nyx?</span>
+        <div class="answer">
+          <a href="http://fallenlights.net/";><img src="images/faq/shadowgirl.jpg" alt="greek goddess" title="Nyx by Shadowgirl, used with permission." /></a>
+          <p style="min-height: 340px">Simple - because the <a href="https://en.wikipedia.org/wiki/Nyx";>Greek goddess of night</a> is short and memorable. Terminal applications are handiest when they're brief and easy to type. Top, ssh, scp - anything longer is just begging to be aliased down.</p>
         </div>
       </div>
+    </div>
 
-      <div id="download" class="content">
-        <div class="section"></div>
-        <a href="#download" class="section-title">Download</a>
+    <div id="download" class="page">
+      <div class="section"></div>
+      <a href="#download" class="section-title">Download</a>
 
-        <p>Nyx is available Mac OSX, Linux, and BSD but <a href="#windows">not Windows</a>. Find your platform below to get started.</p>
+      <p>Nyx is available Mac OSX, Linux, and BSD but <a href="#windows">not Windows</a>. Find your platform below to get started.</p>
 
-        <br />
+      <br />
 
-        <div class="platform">
-          <a href="https://pypi.python.org/pypi/nyx/"; id="pypi"><img src="images/download/pypi.png" alt="PyPI" /></a>
-          <a href="https://pypi.python.org/pypi/nyx/"; class="platform-title">Python Package Index</a>
-          <p>Signed releases and instructions for both Python 2.x and 3.x. You can easily install from its <a href="https://www.atagar.com/arm/resources/static/arm-1.4.5.0.tar.bz2";>tarball</a> (<a href="https://www.atagar.com/arm/resources/static/arm-1.4.5.0.tar.bz2.asc";>sig</a>), or with <b>pip</b>...</p>
-          <pre>
+      <div class="platform">
+        <a href="https://pypi.python.org/pypi/nyx/"; id="pypi"><img src="images/download/pypi.png" alt="PyPI" /></a>
+        <a href="https://pypi.python.org/pypi/nyx/"; class="platform-title">Python Package Index</a>
+        <p>Signed releases and instructions for both Python 2.x and 3.x. You can easily install from its <a href="https://www.atagar.com/arm/resources/static/arm-1.4.5.0.tar.bz2";>tarball</a> (<a href="https://www.atagar.com/arm/resources/static/arm-1.4.5.0.tar.bz2.asc";>sig</a>), or with <b>pip</b>...</p>
+        <pre>
 % sudo easy_install pip
 % sudo pip install nyx
 </pre>
-        </div>
+      </div>
 
-        <div class="platform">
-          <a id="osx"><img src="images/download/osx.png" alt="OSX" /></a>
-          <span class="platform-title">Mac OSX</span>
-          <p>As of OSX 10.8 the platform bundles Python 2.7 by default. This makes installation easy...</p>
-          <pre>
+      <div class="platform">
+        <a id="osx"><img src="images/download/osx.png" alt="OSX" /></a>
+        <span class="platform-title">Mac OSX</span>
+        <p>As of OSX 10.8 the platform bundles Python 2.7 by default. This makes installation easy...</p>
+        <pre>
 % sudo easy_install pip
 % sudo pip install nyx
 </pre>
-        </div>
+      </div>
 
-        <div class="platform">
-          <a href="http://packages.debian.org/sid/tor-arm"; id="debian"><img src="images/download/debian.png" alt="Debian" /></a>
-          <a href="http://packages.debian.org/sid/tor-arm"; class="platform-title">Debian</a>
-          <p>Package maintained by Dererk for Debian.</p>
-          <pre>% sudo apt-get install tor-arm</pre>
-        </div>
+      <div class="platform">
+        <a href="http://packages.debian.org/sid/tor-arm"; id="debian"><img src="images/download/debian.png" alt="Debian" /></a>
+        <a href="http://packages.debian.org/sid/tor-arm"; class="platform-title">Debian</a>
+        <p>Package maintained by Dererk for Debian.</p>
+        <pre>% sudo apt-get install tor-arm</pre>
+      </div>
 
-        <div class="platform">
-          <a href="https://launchpad.net/ubuntu/+source/tor-arm"; id="ubuntu"><img src="images/download/ubuntu.png" alt="Ubuntu" /></a>
-          <a href="https://launchpad.net/ubuntu/+source/tor-arm"; class="platform-title">Ubuntu</a>
-          <p>Package derived from Debian for Ubuntu.</p>
-          <pre>% sudo apt-get install tor-arm</pre>
-        </div>
+      <div class="platform">
+        <a href="https://launchpad.net/ubuntu/+source/tor-arm"; id="ubuntu"><img src="images/download/ubuntu.png" alt="Ubuntu" /></a>
+        <a href="https://launchpad.net/ubuntu/+source/tor-arm"; class="platform-title">Ubuntu</a>
+        <p>Package derived from Debian for Ubuntu.</p>
+        <pre>% sudo apt-get install tor-arm</pre>
+      </div>
 
-        <div class="platform">
-          <a href="https://apps.fedoraproject.org/packages/tor-arm"; id="fedora"><img src="images/download/fedora.png" alt="Fedora" /></a>
-          <a href="https://apps.fedoraproject.org/packages/tor-arm"; class="platform-title">Fedora</a>
-          <p>Packages maintained by Juan for Fedora.</p>
-          <pre>% sudo yum install tor-arm</pre>
-        </div>
+      <div class="platform">
+        <a href="https://apps.fedoraproject.org/packages/tor-arm"; id="fedora"><img src="images/download/fedora.png" alt="Fedora" /></a>
+        <a href="https://apps.fedoraproject.org/packages/tor-arm"; class="platform-title">Fedora</a>
+        <p>Packages maintained by Juan for Fedora.</p>
+        <pre>% sudo yum install tor-arm</pre>
+      </div>
 
-        <div class="platform">
-          <a href="http://packages.gentoo.org/package/net-misc/arm"; id="gentoo"><img src="images/download/gentoo.png" alt="Gentoo" /></a>
-          <a href="http://packages.gentoo.org/package/net-misc/arm"; class="platform-title">Gentoo</a>
-          <p>Package maintained by Jesse for Gentoo.</p>
-          <pre>% sudo emerge arm</pre>
-        </div>
+      <div class="platform">
+        <a href="http://packages.gentoo.org/package/net-misc/arm"; id="gentoo"><img src="images/download/gentoo.png" alt="Gentoo" /></a>
+        <a href="http://packages.gentoo.org/package/net-misc/arm"; class="platform-title">Gentoo</a>
+        <p>Package maintained by Jesse for Gentoo.</p>
+        <pre>% sudo emerge arm</pre>
+      </div>
 
-        <div class="platform">
-          <a href="https://slackbuilds.org/repository/13.37/network/arm/"; id="slackware"><img src="images/download/slackware.png" alt="Slackware" /></a>
-          <a href="https://slackbuilds.org/repository/13.37/network/arm/"; class="platform-title">Slackware</a>
-          <p>Package maintained by pyllyukko for <a href="http://slackbuilds.org/howto/";>Slackware</a>.</p>
-        </div>
+      <div class="platform">
+        <a href="https://slackbuilds.org/repository/13.37/network/arm/"; id="slackware"><img src="images/download/slackware.png" alt="Slackware" /></a>
+        <a href="https://slackbuilds.org/repository/13.37/network/arm/"; class="platform-title">Slackware</a>
+        <p>Package maintained by pyllyukko for <a href="http://slackbuilds.org/howto/";>Slackware</a>.</p>
+      </div>
 
-        <div class="platform">
-          <a href="http://www.freshports.org/security/arm"; id="freebsd"><img src="images/download/freebsd.png" alt="FreeBSD" /></a>
-          <a href="http://www.freshports.org/security/arm"; class="platform-title">FreeBSD</a>
-          <p>Port maintained by Carlo for <a href="http://www.freebsd.org/doc/en_US.ISO8859-1/books/handbook/ports.html";>FreeBSD</a>.</p>
-          <pre>% pkg install security/arm</pre>
-        </div>
+      <div class="platform">
+        <a href="http://www.freshports.org/security/arm"; id="freebsd"><img src="images/download/freebsd.png" alt="FreeBSD" /></a>
+        <a href="http://www.freshports.org/security/arm"; class="platform-title">FreeBSD</a>
+        <p>Port maintained by Carlo for <a href="http://www.freebsd.org/doc/en_US.ISO8859-1/books/handbook/ports.html";>FreeBSD</a>.</p>
+        <pre>% pkg install security/arm</pre>
+      </div>
 
-        <div class="platform">
-          <a href="https://gitweb.torproject.org/nyx.git"; id="git"><img src="images/download/git.png" alt="Git" /></a>
-          <a href="https://gitweb.torproject.org/nyx.git"; class="platform-title">Source Repository</a>
-          <p>For those that want to live on the bleeding edge or contribute, Nyx's git repository can be fetched with...</p>
-          <pre>% git clone https://git.torproject.org/nyx.git</pre>
-        </div>
+      <div class="platform">
+        <a href="https://gitweb.torproject.org/nyx.git"; id="git"><img src="images/download/git.png" alt="Git" /></a>
+        <a href="https://gitweb.torproject.org/nyx.git"; class="platform-title">Source Repository</a>
+        <p>For those that want to live on the bleeding edge or contribute, Nyx's git repository can be fetched with...</p>
+        <pre>% git clone https://git.torproject.org/nyx.git</pre>
       </div>
     </div>
 
@@ -194,10 +192,10 @@
       // when provided an anchor select the tab it resides within
 
       var anchor = window.location.hash;
-      $(".tabs").tabs(".panes > .content", { history: true });
+      $(".tabs").tabs(".page", { history: true });
 
       if (anchor) {
-        $(".panes").children().each(function () {
+        $(".page").each(function () {
           if ($(this).find(anchor).length) {
             $(".tabs").data("tabs").click(this.id);
             document.getElementById(anchor.substr(1)).scrollIntoView();
diff --git a/web/styles.css b/web/styles.css
index 081ff27..617b74b 100644
--- a/web/styles.css
+++ b/web/styles.css
@@ -91,7 +91,7 @@ Header Bar (logo and nav)
 Common Page Attributes
 ============================================================*/
 
-.content {
+.page {
   background: white;
   border-radius: 10px;
   box-shadow: 0px 0px 25px rgba(0, 0, 0, 0.80);
@@ -102,7 +102,7 @@ Common Page Attributes
   text-align: center;
 }
 
-.content p {
+.page p {
   margin: 20px 0px 0px;
   text-align: justify;
 }



_______________________________________________
tor-commits mailing list
tor-commits@xxxxxxxxxxxxxxxxxxxx
https://lists.torproject.org/cgi-bin/mailman/listinfo/tor-commits