Updates for mobile view

nbarry10 · May 7, 2013 · 47e7dea · 47e7dea
1 parent ceaab1b
commit 47e7dea
Show file tree

Hide file tree

Showing 29 changed files with 539 additions and 72 deletions.
diff --git a/Makefile b/Makefile
@@ -1,3 +1,2 @@
 all:
-    lessc wdn/templates_4.0/less/all.less css/all.min.css --yui-compress
-    #uglifyjs www/js/lib/handlebars-1.0.0-rc3.js www/js/main.js -o www/js/main.min.js -c -m
+	lessc wdn/templates_4.0/less/all.less wdn/templates_4.0/css/all.css --yui-compress --line-numbers=comments
diff --git a/debug.shtml b/debug.shtml
@@ -6,7 +6,7 @@
 <!--[if (gte IE 9)|(gt IEMobile 7) ]><html class="ie" lang="en"><![endif]-->
 <!--[if !(IEMobile) | !(IE)]><!--><html lang="en"><!-- InstanceBegin template="/Templates/debug.dwt" codeOutsideHTMLIsLocked="false" --><!--<![endif]-->
 <head>
-<!--#include virtual="/wdn/templates_3.1/includes/metanfavico.html" -->
+<!--#include virtual="/wdn/templates_4.0/includes/metanfavico.html" -->
 <!--
     Membership and regular participation in the UNL Web Developer Network
     is required to use the UNL templates. Visit the WDN site at 
@@ -21,7 +21,7 @@
 
     $Id: debug.dwt | ea2608181e2b6604db76106fd982b39218ddcb8b | Fri Mar 9 12:20:43 2012 -0600 | Kevin Abel  $
 -->
-<!--#include virtual="/wdn/templates_3.1/includes/scriptsandstyles_debug.html" -->
+<!--#include virtual="/wdn/templates_4.0/includes/scriptsandstyles_debug.html" -->
 <!-- InstanceBeginEditable name="doctitle" -->
 <title>Debugging Out | WDN Testing Page | University of Nebraska&ndash;Lincoln</title>
 <!-- InstanceEndEditable -->
@@ -31,22 +31,28 @@
 <!-- InstanceEndEditable -->
 <!-- InstanceParam name="class" type="text" value="fixed debug" -->
 </head>
-<body class="fixed debug" data-version="3.1">
+<body class="fixed debug" data-version="4.0">
     <nav class="skipnav" role="navigation">
-        <a class="skipnav" href="#maincontent">Skip Navigation</a>
+        <a class="wdn-text-hidden" href="#maincontent">Skip Navigation</a>
     </nav>
     <div id="wdn_wrapper">
-        <header id="header" role="banner">
+        <input type="checkbox" id="wdn_menu_toggle" value="Show navigation menu" class="wdn-content-slide" checked="checked" />
+        <header id="header" role="banner" class="wdn-content-slide">
             <a id="logo" href="http://www.unl.edu/" title="UNL website">UNL</a>
             <span id="wdn_institution_title">University of Nebraska&ndash;Lincoln</span>
-            <span id="wdn_site_title"><!-- InstanceBeginEditable name="titlegraphic" --><a href="#">The Charles W. Durham School of Architectural Engineering &amp; Construction</a> <span>A division of the College of Arts &amp; Sciences</span><!-- InstanceEndEditable --></span>
-            <!--#include virtual="/wdn/templates_3.1/includes/idm.html" -->
-            <!--#include virtual="/wdn/templates_3.1/includes/wdnTools.html" -->
+            <span id="wdn_site_title">
+                <!-- InstanceBeginEditable name="titlegraphic" -->
+                <a href="#">The Charles W. Durham School of Architectural Engineering &amp; Construction</a> 
+                <span>A division of the College of Arts &amp; Sciences</span>
+                <!-- InstanceEndEditable -->
+            </span>
+            <!--#include virtual="/wdn/templates_4.0/includes/idm.html" -->
+            <!--#include virtual="/wdn/templates_4.0/includes/wdnTools.html" -->
         </header>
         <div id="wdn_navigation_bar" role="navigation">
             <nav id="breadcrumbs">
                 <!-- WDN: see glossary item 'breadcrumbs' -->
-                <h3 class="wdn_list_descriptor hidden">Breadcrumbs</h3>
+                <h3 class="wdn_list_descriptor wdn-text-hidden">Breadcrumbs</h3>
                 <!-- InstanceBeginEditable name="breadcrumbs" -->
                 <ul>
                     <li><a href="http://www.unl.edu/" title="University of Nebraska&ndash;Lincoln">UNL</a></li>
@@ -57,14 +63,19 @@
             </nav>
             <div id="wdn_navigation_wrapper">
                 <nav id="navigation" role="navigation">
-                    <h3 class="wdn_list_descriptor hidden">Navigation</h3>
+                    <h3 class="wdn_list_descriptor wdn-text-hidden">Navigation</h3>
                     <!-- InstanceBeginEditable name="navlinks" -->
                     <!--#include virtual="sharedcode/navigation.html" -->
                     <!-- InstanceEndEditable -->
                 </nav>
             </div>
         </div>
-        <div id="wdn_content_wrapper" role="main">
+        <!-- Navigation Trigger -->
+        <div id="wdn_menu_trigger" class="wdn-content-slide">
+            <label for="wdn_menu_toggle" class="wdn-icon-menu">Menu</label>
+        </div>
+        <!-- End navigation trigger -->
+        <div id="wdn_content_wrapper" role="main" class="wdn-content-slide">
             <div id="pagetitle">
                 <!-- InstanceBeginEditable name="pagetitle" -->
                 <h1>Debugging Out!</h1>
@@ -76,25 +87,17 @@
 
                   <!-- InstanceEndEditable -->
                 <div class="clear"></div>
-                <!--#include virtual="/wdn/templates_3.1/includes/noscript.html" -->
+                <!--#include virtual="/wdn/templates_4.0/includes/noscript.html" -->
                 <!--THIS IS THE END OF THE MAIN CONTENT AREA.-->
             </div>
         </div>
         <footer id="footer" role="contentinfo">
             <div id="footer_floater"></div>
             <div class="footer_col" id="wdn_footer_feedback">
-                <!--#include virtual="/wdn/templates_3.1/includes/feedback.html" -->
+                <!--#include virtual="/wdn/templates_4.0/includes/feedback.html" -->
             </div>
             <div class="footer_col" id="wdn_footer_related">
-                <!-- InstanceBeginEditable name="leftcollinks" -->
-                <!--#include virtual="sharedcode/relatedLinks.html" -->
-                <!-- InstanceEndEditable --></div>
-            <div class="footer_col" id="wdn_footer_contact">
-                <!-- InstanceBeginEditable name="contactinfo" -->
-                <!--#include virtual="sharedcode/footerContactInfo.html" -->
-                <!-- InstanceEndEditable --></div>
-            <div class="footer_col" id="wdn_footer_share">
-                <!--#include virtual="/wdn/templates_3.1/includes/socialmediashare.html" -->
+                <!--#include virtual="/wdn/templates_4.0/includes/socialmediashare.html" -->
             </div>
             <!-- InstanceBeginEditable name="optionalfooter" -->
             <!-- InstanceEndEditable -->
@@ -103,9 +106,9 @@
                     <!-- InstanceBeginEditable name="footercontent" -->
                     <!--#include virtual="sharedcode/footer.html" -->
                     <!-- InstanceEndEditable -->
-                    <!--#include virtual="/wdn/templates_3.1/includes/wdn.html" -->
+                    <!--#include virtual="/wdn/templates_4.0/includes/wdn.html" -->
                 </div>
-                <!--#include virtual="/wdn/templates_3.1/includes/logos.html" -->
+                <!--#include virtual="/wdn/templates_4.0/includes/logos.html" -->
             </div>
         </footer>
     </div>

diff --git a/wdn/templates_3.1/less/_mixins/fonts.less b/wdn/templates_3.1/less/_mixins/fonts.less
@@ -11,7 +11,7 @@
 //Serif, formal font
 @serifFont: Georgia,"Bitstream Charter","Century Schoolbook L","Liberation Serif",Times,serif;
 
-.text-hidden() 
+.text-hidden()
 {
     text-indent: -9999em;
     line-height: 0;

diff --git a/wdn/templates_4.0/css/all.css b/wdn/templates_4.0/css/all.css
diff --git a/wdn/templates_4.0/fonts/fontello/config.json b/wdn/templates_4.0/fonts/fontello/config.json
@@ -0,0 +1,37 @@
+{
+  "name": "",
+  "css_prefix_text": "wdn-icon-",
+  "css_use_suffix": false,
+  "glyphs": [
+    {
+      "uid": "513ac180ff85bd275f2b736720cbbf5e",
+      "css": "home",
+      "code": 8962,
+      "src": "entypo"
+    },
+    {
+      "uid": "37f6cfbb4062ed0d01b351ec35c334ff",
+      "css": "right-open-mini",
+      "code": 9658,
+      "src": "entypo"
+    },
+    {
+      "uid": "9dd9e835aebe1060ba7190ad2b2ed951",
+      "css": "search",
+      "code": 128269,
+      "src": "fontawesome"
+    },
+    {
+      "uid": "559647a6f430b3aeadbecd67194451dd",
+      "css": "menu",
+      "code": 61641,
+      "src": "fontawesome"
+    },
+    {
+      "uid": "5bb103cd29de77e0e06a52638527b575",
+      "css": "wrench",
+      "code": 128295,
+      "src": "fontawesome"
+    }
+  ]
+}
diff --git a/wdn/templates_4.0/fonts/fontello/fontello.eot b/wdn/templates_4.0/fonts/fontello/fontello.eot
diff --git a/wdn/templates_4.0/fonts/fontello/fontello.svg b/wdn/templates_4.0/fonts/fontello/fontello.svg
diff --git a/wdn/templates_4.0/fonts/fontello/fontello.ttf b/wdn/templates_4.0/fonts/fontello/fontello.ttf
diff --git a/wdn/templates_4.0/fonts/fontello/fontello.woff b/wdn/templates_4.0/fonts/fontello/fontello.woff
diff --git a/wdn/templates_4.0/fonts/fontello/readme.md b/wdn/templates_4.0/fonts/fontello/readme.md
@@ -0,0 +1 @@
+Font icons used in are from [Fontello](http://fontello.com/). To add more more icons to the font, use the `config.json` as a starter.
diff --git a/wdn/templates_4.0/images/n.svg b/wdn/templates_4.0/images/n.svg
diff --git a/wdn/templates_4.0/images/n_outline.svg b/wdn/templates_4.0/images/n_outline.svg
diff --git a/wdn/templates_4.0/includes/feedback.html b/wdn/templates_4.0/includes/feedback.html
diff --git a/wdn/templates_4.0/includes/scriptsandstyles_debug.html b/wdn/templates_4.0/includes/scriptsandstyles_debug.html
@@ -1,19 +1,19 @@
 <!-- Debug.css has all the media queries built in, we don't need a second load -->
-    <link rel="stylesheet" type="text/css" media="all" href="/wdn/templates_3.1/css/debug.css" />
+    <link rel="stylesheet" type="text/css" media="all" href="/wdn/templates_4.0/css/all.css" />
 
 <!-- Load the template JS file -->
-    <script type="text/javascript" src="/wdn/templates_3.1/scripts/debug.js?dep=$DEP_VERSION$" id="wdn_dependents"></script>
+    <script type="text/javascript" src="/wdn/templates_4.0/scripts/debug.js?dep=$DEP_VERSION$" id="wdn_dependents"></script>
 
 <!-- For old IE, bring in all the styles w/o media queries -->
 <!--[if lt IE 9]>
-    <link rel="stylesheet" type="text/css" media="all" href="/wdn/templates_3.1/css/compressed/combined_widths.css" />
+    <link rel="stylesheet" type="text/css" media="all" href="/wdn/templates_4.0/css/compressed/combined_widths.css" />
     <script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
 <![endif]-->
 
 <!-- For all IE versions, bring in the tweaks -->
 <!--[if IE]>
-    <link rel="stylesheet" type="text/css" media="all" href="/wdn/templates_3.1/css/variations/ie.css" />
+    <link rel="stylesheet" type="text/css" media="all" href="/wdn/templates_4.0/css/variations/ie.css" />
 <![endif]-->
 
 <!-- Load the print styles -->
-    <link rel="stylesheet" type="text/css" media="print" href="/wdn/templates_3.1/css/variations/print.css" />
+    <link rel="stylesheet" type="text/css" media="print" href="/wdn/templates_4.0/css/variations/print.css" />
diff --git a/wdn/templates_4.0/includes/wdnTools.html b/wdn/templates_4.0/includes/wdnTools.html
@@ -2,9 +2,9 @@
     <form id="wdn_search_form" action="http://www.google.com/u/UNL1?sa=Google+Search&amp;q=" method="get" role="search">
         <fieldset>
             <legend class="hidden">Search</legend>
-            <label for="q">Search this site, all UNL or for a person</label>
+            <label for="q" class="wdn-icon-search">Search this site, all UNL or for a person</label>
             <input accesskey="f" id="q" name="q" type="search" placeholder="Search this site, all UNL or for a person" />
-            <input class="search" type="submit" value="Go" name="submit" />
+            <input class="search" class="wdn-icon-search" type="submit" value="Go" name="submit" />
         </fieldset>
     </form>
 </div>

diff --git a/wdn/templates_4.0/less/_mixins/colors.less b/wdn/templates_4.0/less/_mixins/colors.less
@@ -0,0 +1,7 @@
+@brand: #ac0302;
+@darkCompliment: #352e01; 
+@bright: rgb(209, 84, 165); //#D154A5
+@lightCompliment: rgb(221, 199, 240); //#DDC7F0
+@neutral: #f6f5ea;
+
+@base-text: @darkCompliment;
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1 @@
		Font icons used in are from [Fontello](http://fontello.com/). To add more more icons to the font, use the `config.json` as a starter.