Merge branch 'master' of github.com:relevance/mycroft

relevance · Sep 19, 2010 · f3c70d2 · f3c70d2
2 parents ceca316 + 3fd50ab
commit f3c70d2
Show file tree

Hide file tree

Showing 6 changed files with 118 additions and 24 deletions.
diff --git a/public/index.html b/public/index.html
@@ -1,30 +1,38 @@
 <html>
-
+<head>
+  <title>mycroft.examples</title>
+
+  <link href="/stylesheets/shCore.css" rel="stylesheet" type="text/css" />
+  <link href="/stylesheets/shThemeDefault.css" rel="stylesheet" type="text/css" />
+  <!--<link href="/stylesheets/application.css" rel="stylesheet" type="text/css" />-->
+  <link rel="stylesheet" href="/stylesheets/mobile.css" media="handheld"/>
+  <link rel="stylesheet" type="text/css"  href="/stylesheets/mobile.css" media="only screen and (max-width: 480px)" />
+  <meta name="viewport" content="user-scalable=no, width=device-width" />
+</head>
 <body>
 
-<h2>Clojure Inspector</h2>
-
-Key elements include:
+  <h2 class="logo"><a href="#">Mycroft, a Clojure inspector</a></h2>
 
-<ul>
-<li><a href="vars">Browse Namespaces</a></li>
-<li><a href="vars/clojure.core">Browse Vars in a Namespace</a></li>
-<li><a href="vars/clojure.core/complement">Browse a Var that is a Fn</a></li>
-<li><a href="vars/mycroft.examples">Browse some Vars that are data</a></li>
-</ul>
+  <div id="content">
+    <p>Key elements include:</p>
 
-Everything is made of data and functions:
+    <ul>
+    <li><a href="vars">Browse Namespaces</a></li>
+    <li><a href="vars/clojure.core">Browse Vars in a Namespace</a></li>
+    <li><a href="vars/clojure.core/complement">Browse a Var that is a Fn</a></li>
+    <li><a href="vars/mycroft.examples">Browse some Vars that are data</a></li>
+    </ul>
 
-<ul>
-<li><a href="/vars/mycroft.examples/jmx-beans">Browse JMX Beans</a></li> 
-<li>Browse recent <a href="/vars/mycroft.history">history</a></li>
-<li>Browse Interactive REPL result</li>
-<li>Browse Java things</li>
-</ul>
+    <p>Everything is made of data and functions:</p>
 
-Everything is thread safe.
+    <ul>
+    <li><a href="/vars/mycroft.examples/jmx-beans">Browse JMX Beans</a></li> 
+    <li><a href="/vars/mycroft.history">Browse recent history</a></li>
+    <li><a href="#">Browse Interactive REPL result</a></li>
+    <li><a href="#">Browse Java things</a></li>
+    </ul>
 
+    <p>Everything is thread safe.</p>
+  </div>
 </body>
-</html>
-
-
+</html>
diff --git a/public/stylesheets/application.css b/public/stylesheets/application.css
@@ -94,7 +94,7 @@ ol li { list-style-type: decimal; margin-left: 20px; }
   margin: 0 auto;
 }
 #browser #header, #browser #footer, #browser #content {
-  width: 940px;
+  max-width: 940px;
 }
 
 /* Header styles */

diff --git a/public/stylesheets/clojure_logo_sm.png b/public/stylesheets/clojure_logo_sm.png
diff --git a/public/stylesheets/mobile.css b/public/stylesheets/mobile.css
@@ -0,0 +1,83 @@
+body {
+  background-color: #ddd;
+  color: #222;
+  font-family: Helvetica; 
+  font-size: 14px;
+  margin: 0;
+  padding: 0;
+  border: none;
+}
+#header {
+  background:#ccc;
+  border-bottom: 1px solid #666;
+}
+h2.logo {
+  background:#ccc;
+  border-bottom: 1px solid #666;
+  margin: 0;
+  padding: 0;
+  text-align: center;
+}
+a:visited { color: #222;}
+h2.logo a:link,
+h2.logo a:visited {
+  background: transparent url(clojure_logo_sm.png) 0 6px no-repeat;
+  color: #222;
+  display: inline-block;
+  margin: 0 auto;
+  font-size: 16px;
+  font-weight: bold;
+  padding: 10px 0 10px 35px;
+  text-align: center;
+  text-decoration: none;
+}
+
+ul {
+  list-style: none;
+  margin: 10px;
+  padding: 0;
+}
+ul li a {
+  background-color: #FFFFFF;
+  border: 1px solid #999999;
+  color: #222222;
+  display: block;
+  font-size: 14px;
+  font-weight: bold;
+  margin-bottom: -1px;
+  padding: 12px 10px;
+  text-decoration: none;
+}
+#content,
+#header,
+#footer {
+  width: 100%;
+}
+#content {
+
+}
+
+#footer p,
+#content p {
+  padding: 0 10px;
+}
+#footer {
+    display: none;
+}
+
+ul li:first-child a {
+  -webkit-border-top-left-radius: 8px;
+  -webkit-border-top-right-radius: 8px;
+}
+ul li:last-child a {
+  -webkit-border-bottom-left-radius: 8px;
+  -webkit-border-bottom-right-radius: 8px;
+}
+code {
+
+}
+pre { 
+
+}
+#browser div.syntaxhighlighter { width: 100em !important; }
+div.syntaxhighlighter.nogutter div.line { background-color: #F8F8F8 !important; }
diff --git a/public/stylesheets/shCore.css b/public/stylesheets/shCore.css
@@ -28,6 +28,7 @@
 	font-size: 1em !important;
 	min-height: inherit !important; /* For IE8, FF & WebKit */
 	min-height: auto !important; /* For IE7 */
+	white-space: pre !important;
 }
 
 .syntaxhighlighter

diff --git a/src/mycroft/main.clj b/src/mycroft/main.clj
@@ -21,8 +21,10 @@
     [:head
      [:title title]
      (include-css "/stylesheets/shCore.css"
-                  "/stylesheets/shThemeDefault.css"
-                  "/stylesheets/application.css")
+                  "/stylesheets/shThemeDefault.css")
+                  [:link {:type "text/css", :href "/stylesheets/application.css", :rel "stylesheet", :media "screen (min-width: 600px)"}]
+                  [:link {:type "text/css", :href "/stylesheets/mobile.css", :rel "stylesheet", :media "only screen and (max-width: 600px)"}]
+     [:meta {:name "viewport" :content "user-scalable=no, width=device-width"}]
      (include-js "/jqtouch/jquery.1.3.2.min.js"
                  "/javascripts/application.js"
                  "/javascripts/shCore.js"