Improved the look of the site and tweaked MathJax a bit

TensorNetwork · Jul 14, 2018 · c03cb0a · c03cb0a
1 parent 6906b79
commit c03cb0a
Show file tree

Hide file tree

Showing 10 changed files with 521 additions and 26 deletions.
diff --git a/footer.html b/footer.html
@@ -6,5 +6,40 @@
 
 </div> <!--class="main"-->
 
+<script type="text/javascript">
+$(document).ready(function() 
+    {
+    $('.rounded').corner("7px");
+
+    $('.example_clicker').next().hide();
+
+    $('.example_clicker').click(
+    function(e)
+        {
+        /*
+        $(e.target).toggle(
+        function(e) { $(e.target).text("Show Example").stop(); },
+        function(e) { $(e.target).text("Hide Example").stop(); });
+        */
+
+        $(e.target).next('.highlight').slideToggle(100);
+
+        /* Change text */
+        var str = $(e.target).text();
+        if(str.search("Show") > -1)
+            {
+            str = str.split("Show").join("Hide");
+            }
+        else
+            {
+            str = str.split("Hide").join("Show");
+            }
+
+        var set_text = function() { $(e.target).text(str); }
+        window.setTimeout(set_text, 200);
+        });
+    });
+</script>
+
 </body>
 </html>
diff --git a/header_prenav.html b/header_prenav.html
@@ -5,19 +5,33 @@
     <title>TensorNetwork</title>
     <meta http-equiv="content-language" content="en" />
     <meta http-equiv="content-type" content="text/html; charset=UTF-8" />
-    <link rel="stylesheet" href="https://tensornetwork.github.io/style.css" type="text/css"/>
+    <!--<link rel="stylesheet" href="https://tensornetwork.github.io/style.css" type="text/css"/>-->
+    <link rel="stylesheet" href="file:///Users/mstoudenmire/projects/tensornetwork/style.css" type="text/css"/>
+
+    <!-- JQuery -->
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.6.2/jquery.min.js" type="text/javascript"></script>
+    <script type="text/javascript" src="file:///Users/mstoudenmire/projects/tensornetwork/scripts/jquery.corner.js"></script>
 
     <link href='https://fonts.googleapis.com/css?family=Inconsolata:400,700' rel='stylesheet' type='text/css'>
     <script type="text/x-mathjax-config">
-      MathJax.Hub.Config({tex2jax: {inlineMath: [['\$','\$'] ]}});
+      MathJax.Hub.Config({tex2jax: {inlineMath: [['\$','\$'] ], displayMath: [ ['@@','@@'] ] }});
     </script>
-    <script type="text/javascript" src="https://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS_HTML">
+    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.4/MathJax.js?config=TeX-AMS_HTML">
     </script>
 </head>
 
 <body>
 
 <div id="main">
 
-<div class="full section rounded"> <h2>Tensor Network Fundamentals</h2>
+<br/>
+<div class="top_navbar">
+    <div class="top_navbar_left">
+        <img class="top_navbar_height" src="file:///Users/mstoudenmire/projects/tensornetwork/tn_logo.png"/>
+    </div>
+    <div class="top_navbar_links top_navbar_middle"> 
+        <a href="index.html">Main</a> <a href="about.html">About</a>
+    </div>
+    <div class="top_navbar_right"></div>
+</div> <!--top_navbar-->
 <span id="nav">
diff --git a/pages/about/index.html b/pages/about/index.html
@@ -5,24 +5,37 @@
     <title>TensorNetwork</title>
     <meta http-equiv="content-language" content="en" />
     <meta http-equiv="content-type" content="text/html; charset=UTF-8" />
-    <link rel="stylesheet" href="https://tensornetwork.github.io/style.css" type="text/css"/>
+    <!--<link rel="stylesheet" href="https://tensornetwork.github.io/style.css" type="text/css"/>-->
+    <link rel="stylesheet" href="file:///Users/mstoudenmire/projects/tensornetwork/style.css" type="text/css"/>
+
+    <!-- JQuery -->
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.6.2/jquery.min.js" type="text/javascript"></script>
+    <script type="text/javascript" src="file:///Users/mstoudenmire/projects/tensornetwork/scripts/jquery.corner.js"></script>
 
     <link href='https://fonts.googleapis.com/css?family=Inconsolata:400,700' rel='stylesheet' type='text/css'>
     <script type="text/x-mathjax-config">
-      MathJax.Hub.Config({tex2jax: {inlineMath: [['\$','\$'] ]}});
+      MathJax.Hub.Config({tex2jax: {inlineMath: [['\$','\$'] ], displayMath: [ ['@@','@@'] ] }});
     </script>
-    <script type="text/javascript" src="https://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS_HTML">
+    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.4/MathJax.js?config=TeX-AMS_HTML">
     </script>
 </head>
 
 <body>
 
 <div id="main">
 
-<div class="full section rounded"> <h2>Tensor Network Fundamentals</h2>
+<br/>
+<div class="top_navbar">
+    <div class="top_navbar_left">
+        <img class="top_navbar_height" src="file:///Users/mstoudenmire/projects/tensornetwork/tn_logo.png"/>
+    </div>
+    <div class="top_navbar_links top_navbar_middle"> 
+        <a href="index.html">Main</a> <a href="about.html">About</a>
+    </div>
+    <div class="top_navbar_right"></div>
+</div> <!--top_navbar-->
 <span id="nav">
 </span>
-</div>
 
 <div class="full">
 <p>
@@ -38,5 +51,40 @@
 
 </div> <!--class="main"-->
 
+<script type="text/javascript">
+$(document).ready(function() 
+    {
+    $('.rounded').corner("7px");
+
+    $('.example_clicker').next().hide();
+
+    $('.example_clicker').click(
+    function(e)
+        {
+        /*
+        $(e.target).toggle(
+        function(e) { $(e.target).text("Show Example").stop(); },
+        function(e) { $(e.target).text("Hide Example").stop(); });
+        */
+
+        $(e.target).next('.highlight').slideToggle(100);
+
+        /* Change text */
+        var str = $(e.target).text();
+        if(str.search("Show") > -1)
+            {
+            str = str.split("Show").join("Hide");
+            }
+        else
+            {
+            str = str.split("Hide").join("Show");
+            }
+
+        var set_text = function() { $(e.target).text(str); }
+        window.setTimeout(set_text, 200);
+        });
+    });
+</script>
+
 </body>
 </html>
diff --git a/pages/diagrams.html b/pages/diagrams.html
@@ -5,33 +5,47 @@
     <title>TensorNetwork</title>
     <meta http-equiv="content-language" content="en" />
     <meta http-equiv="content-type" content="text/html; charset=UTF-8" />
-    <link rel="stylesheet" href="https://tensornetwork.github.io/style.css" type="text/css"/>
+    <!--<link rel="stylesheet" href="https://tensornetwork.github.io/style.css" type="text/css"/>-->
+    <link rel="stylesheet" href="file:///Users/mstoudenmire/projects/tensornetwork/style.css" type="text/css"/>
+
+    <!-- JQuery -->
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.6.2/jquery.min.js" type="text/javascript"></script>
+    <script type="text/javascript" src="file:///Users/mstoudenmire/projects/tensornetwork/scripts/jquery.corner.js"></script>
 
     <link href='https://fonts.googleapis.com/css?family=Inconsolata:400,700' rel='stylesheet' type='text/css'>
     <script type="text/x-mathjax-config">
-      MathJax.Hub.Config({tex2jax: {inlineMath: [['\$','\$'] ]}});
+      MathJax.Hub.Config({tex2jax: {inlineMath: [['\$','\$'] ], displayMath: [ ['@@','@@'] ] }});
     </script>
-    <script type="text/javascript" src="https://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS_HTML">
+    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.4/MathJax.js?config=TeX-AMS_HTML">
     </script>
 </head>
 
 <body>
 
 <div id="main">
 
-<div class="full section rounded"> <h2>Tensor Network Fundamentals</h2>
+<br/>
+<div class="top_navbar">
+    <div class="top_navbar_left">
+        <img class="top_navbar_height" src="file:///Users/mstoudenmire/projects/tensornetwork/tn_logo.png"/>
+    </div>
+    <div class="top_navbar_links top_navbar_middle"> 
+        <a href="index.html">Main</a> <a href="about.html">About</a>
+    </div>
+    <div class="top_navbar_right"></div>
+</div> <!--top_navbar-->
 <span id="nav">
 </span>
-</div>
 
 <div class="full">
 <p>
 </p>
 </div>
 
 <div class="full edit docs">
-<h1>Tensor Diagrams</h1>
-<p>Tensor diagram notation is a simple, yet very powerful graphical notation for networks of contracted tensors.</p>
+<h1>Tensor Diagram Notation</h1>
+<p>Tensor diagram notation is a simple, yet very powerful
+graphical notation for networks of contracted tensors.</p>
 <p>A tensor contraction of the form &#36;M_&#123;ij&#125; N_&#123;jk&#125;&#36; can be notated </p>
 <p>A link to <a href="https://reddit.com">reddit</a></p>
 
@@ -42,5 +56,40 @@ <h1>Tensor Diagrams</h1>
 
 </div> <!--class="main"-->
 
+<script type="text/javascript">
+$(document).ready(function() 
+    {
+    $('.rounded').corner("7px");
+
+    $('.example_clicker').next().hide();
+
+    $('.example_clicker').click(
+    function(e)
+        {
+        /*
+        $(e.target).toggle(
+        function(e) { $(e.target).text("Show Example").stop(); },
+        function(e) { $(e.target).text("Hide Example").stop(); });
+        */
+
+        $(e.target).next('.highlight').slideToggle(100);
+
+        /* Change text */
+        var str = $(e.target).text();
+        if(str.search("Show") > -1)
+            {
+            str = str.split("Show").join("Hide");
+            }
+        else
+            {
+            str = str.split("Hide").join("Show");
+            }
+
+        var set_text = function() { $(e.target).text(str); }
+        window.setTimeout(set_text, 200);
+        });
+    });
+</script>
+
 </body>
 </html>
diff --git a/pages/mps/index.html b/pages/mps/index.html
@@ -5,24 +5,37 @@
     <title>TensorNetwork</title>
     <meta http-equiv="content-language" content="en" />
     <meta http-equiv="content-type" content="text/html; charset=UTF-8" />
-    <link rel="stylesheet" href="https://tensornetwork.github.io/style.css" type="text/css"/>
+    <!--<link rel="stylesheet" href="https://tensornetwork.github.io/style.css" type="text/css"/>-->
+    <link rel="stylesheet" href="file:///Users/mstoudenmire/projects/tensornetwork/style.css" type="text/css"/>
+
+    <!-- JQuery -->
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.6.2/jquery.min.js" type="text/javascript"></script>
+    <script type="text/javascript" src="file:///Users/mstoudenmire/projects/tensornetwork/scripts/jquery.corner.js"></script>
 
     <link href='https://fonts.googleapis.com/css?family=Inconsolata:400,700' rel='stylesheet' type='text/css'>
     <script type="text/x-mathjax-config">
-      MathJax.Hub.Config({tex2jax: {inlineMath: [['\$','\$'] ]}});
+      MathJax.Hub.Config({tex2jax: {inlineMath: [['\$','\$'] ], displayMath: [ ['@@','@@'] ] }});
     </script>
-    <script type="text/javascript" src="https://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS_HTML">
+    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.4/MathJax.js?config=TeX-AMS_HTML">
     </script>
 </head>
 
 <body>
 
 <div id="main">
 
-<div class="full section rounded"> <h2>Tensor Network Fundamentals</h2>
+<br/>
+<div class="top_navbar">
+    <div class="top_navbar_left">
+        <img class="top_navbar_height" src="file:///Users/mstoudenmire/projects/tensornetwork/tn_logo.png"/>
+    </div>
+    <div class="top_navbar_links top_navbar_middle"> 
+        <a href="index.html">Main</a> <a href="about.html">About</a>
+    </div>
+    <div class="top_navbar_right"></div>
+</div> <!--top_navbar-->
 <span id="nav">
 </span>
-</div>
 
 <div class="full">
 <p>
@@ -31,7 +44,10 @@
 
 <div class="full edit docs">
 <h1>Matrix Product State / Tensor Train</h1>
-<p>The matrix product state &#40;MPS&#41; or tensor train &#40;TT&#41; is one of the simplest examples of a tensor network, and arguably the best understood type of tensor network decomposition, having the most algorithms associated with it.</p>
+<p>The matrix product state &#40;MPS&#41; or tensor train &#40;TT&#41; is one of the
+simplest examples of a tensor network, and arguably the best understood
+type of tensor network decomposition, having the most algorithms associated
+with it.</p>
 
 </div> <!--class=full edit docs-->
 
@@ -40,5 +56,40 @@ <h1>Matrix Product State / Tensor Train</h1>
 
 </div> <!--class="main"-->
 
+<script type="text/javascript">
+$(document).ready(function() 
+    {
+    $('.rounded').corner("7px");
+
+    $('.example_clicker').next().hide();
+
+    $('.example_clicker').click(
+    function(e)
+        {
+        /*
+        $(e.target).toggle(
+        function(e) { $(e.target).text("Show Example").stop(); },
+        function(e) { $(e.target).text("Hide Example").stop(); });
+        */
+
+        $(e.target).next('.highlight').slideToggle(100);
+
+        /* Change text */
+        var str = $(e.target).text();
+        if(str.search("Show") > -1)
+            {
+            str = str.split("Show").join("Hide");
+            }
+        else
+            {
+            str = str.split("Hide").join("Show");
+            }
+
+        var set_text = function() { $(e.target).text(str); }
+        window.setTimeout(set_text, 200);
+        });
+    });
+</script>
+
 </body>
 </html>