crap to ignore: Nokia

tipiirai · May 5, 2011 · cd6e656 · cd6e656
1 parent 4166264
commit cd6e656
Show file tree

Hide file tree

Showing 4 changed files with 262 additions and 1 deletion.
diff --git a/media/css/headcss/fix.css b/media/css/headcss/fix.css
@@ -0,0 +1,58 @@
+/* HTML5 elements */
+article,
+aside,
+details,
+footer,
+header,
+hgroup,
+menu,
+nav,
+section {
+  display: block;
+}
+/* bolded */
+strong,
+b,
+th,
+dt {
+  font-weight: bold;
+}
+/* italic */
+em, i, caption {
+  font-style: italic;
+}
+/* code */
+pre, code {
+  font-family: "courier new", monospace;
+}
+/* margin for block level elements */
+p,
+table,
+ul,
+ol {
+  margin: 0.8em 0;
+}
+li {
+  margin-left: 1.6em;
+}
+blockquote {
+  margin: 1.5em;
+}
+/* horizontal rule */
+hr {
+  border: 1px solid #ddd;
+  border-width: 1px 0 0;
+  margin: 1em 0;
+}
+/* clearfix */
+.clear, .clearfix {
+  display: block;
+  zoom: 1;
+}
+.clear:after, .clearfix:after {
+  content: " ";
+  display: block;
+  height: 0;
+  clear: both;
+  visibility: hidden;
+}
diff --git a/media/css/headcss/reset.css b/media/css/headcss/reset.css
@@ -0,0 +1,20 @@
+* {
+  vertical-align: baseline;
+  font-weight: inherit;
+  font-family: inherit;
+  font-style: inherit;
+  text-decoration: inherit;
+  font-size: 100%;
+  padding: 0;
+  border: 0;
+  margin: 0;
+}
+table {
+  border-collapse: collapse;
+}
+:focus {
+  outline: 0;
+}
+::-moz-focus-inner {
+  border: 0;
+}
diff --git a/media/css/style.css b/media/css/style.css
@@ -86,7 +86,7 @@ hr {
 }
 body {
   background: #ffffff url(/media/img/bg.jpg);
-  font: 13px sans-serif;
+  font: 13px "Lucida Sans Unicode", "Lucida Grande", "Lucida Sans", "DejaVu Sans Condensed", sans-serif;
 }
 #wrap {
   margin: 0 auto;
@@ -155,7 +155,9 @@ body {
 #forward {
   color: #fff;
   display: block;
+  text-align: right;
   float: right;
+  width: 200px;
   font-weight: bold;
   margin: 10px;
   padding-right: 10px;

diff --git a/nokia.html b/nokia.html
@@ -0,0 +1,181 @@
+<!doctype html>
+<html class="no-js">
+<head>
+    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
+    <meta name="viewport" content="width=device-width; initial-scale=1.0">
+
+    <title>Nokia @ CLOUD PANIC</title>
+    <meta name="description" content="Once ahead of others. Then all the mistakes you can imagine. The latest one is fatal. Welcome to Finland.">
+    <meta name="keywords" content="nokia and microsoft fails, nokia fails, nokia will be dead, nokia is crap">
+    <meta name="author" content="">
+
+    <link rel="icon" type="image/png" href="/media/img/favicon.png">
+    <link rel="stylesheet" href="/media/css/style.css?v=4">
+
+
+    <!-- CSS scripting & LabJS only-->
+    <script src="/media/js/head.min.js"></script>
+</head>
+
+
+<body>
+    <div id="wrap" class="panic">
+
+        <a href="/about.html" id="logo" title="About Cloudpanic">
+            <strong>!!</strong> cloudpanic
+            <em>Technologies to master. Crap to ignore.</em>
+        </a>
+        <div id="story" class="clear" style="background:url(http://farm4.static.flickr.com/3207/2994909573_5fbbf9f1d7_o.jpg) 0 -90px">
+    <a id="forward"
+            href="http://cloudpanic.com/features.html">
+            <em>
+                Next Crap:
+            </em>Features
+                        <span></span>
+        </a>
+            <div id="content">
+        <div id="title">
+            <h1>Nokia</h1>
+            <h2>
+                Once ahead of others. Then all the mistakes you can imagine. The latest one is fatal. Welcome to Finland.
+                <em id="created">
+                    Thu, 05 May 2011 09:00:00 +0200
+                </em>
+            </h2>
+        </div>
+        <div id="bottom">
+            <div id="share">
+    <a id="tweet" href="http://twitter.com/share"
+        data-text="Crap to ignore: Nokia @ cloudpanic.com"
+        class="twitter-share-button" data-count="vertical"
+        data-via="cloudpanic">Tweet</a>
+    <iframe id="facebook" frameborder="0" src="http://www.facebook.com/plugins/like.php?href=http://cloudpanic.com/nokia.html&amp;layout=box_count&amp;show_faces=true&amp;width=450&amp;action=like&amp;colorscheme=light&amp;height=65" scrolling="no" allowTransparency="true"></iframe>
+</div>            <div id="facts" class="clear ">
+                <ul>
+<li>
+<h3>Connecting people</h3>
+<p>Symbian, MeeGo, OVI, N9, XY-who-cares-01 ... Millions of hours and billions of dollars.
+Now trashed, forgotten or slowly dying. Major consequences are yet to come.</p>
+</li>
+<li>
+<h3>Microsoft</h3>
+<p>The world is open and they married Microsoft. Luckily the aging 50+ lead shares the same vision:
+features over quality, shareholders over users, leaders over labor and 1000+ almost products instead of handful
+of awesomeness. Congratulations.</p>
+</li>
+<li>
+<h3>The End.</h3>
+<p>Think of Android for a second. Huge open source community backed up by Google. Five more years and they are leaping.
+Only way to compete is by being radically different. When Nokia gets innovative they switch from gray suits to t-shirts. 
+They want to look like Steve Jobs.</p>
+</li>
+</ul>            </div>
+            <div id="links" class="clear">
+                <p><a href="http://www.gsmdome.com/microsoft/nokia-and-microsoft-fail-in-first-promo-clip-as-they-copy-apple-macbook-pro-song-video_21604">Just compare these videos.</a>
+<a href="http://www.goodcellphonereviews.com/wp-content/uploads/nokia_evolution.jpg">1000+ models and growing</a>
+<a href="http://nokia.com">Better than apple.com?</a></p>            </div>
+        </div>
+    </div>
+</div>
+        <div id="navi" class="clear">
+
+    <div id="incloud" class="navi">
+    <h3>Technologies to master</h3>
+            <a
+            href="http://cloudpanic.com/redis.html"
+            >
+            Redis
+        </a>
+            <a
+            href="http://cloudpanic.com/user-interfaces.html"
+            >
+            User Interfaces
+        </a>
+            <a
+            href="http://cloudpanic.com/cloud.html"
+            >
+            The Cloud
+        </a>
+            <a
+            href="http://cloudpanic.com/javascript.html"
+            >
+            JavaScript
+        </a>
+            <a
+            href="http://cloudpanic.com/services.html"
+            >
+            Services
+        </a>
+            <a
+            href="http://cloudpanic.com/stateless-design.html"
+            >
+            Stateless design
+        </a>
+            <a
+            href="http://cloudpanic.com/static-html.html"
+            >
+            Static HTML
+        </a>
+    </div>
+
+    <div id="inpanic" class="navi">
+    <h3>Crap to ignore</h3>
+            <a
+            href="http://cloudpanic.com/nokia.html"
+             class="active">
+            Nokia
+        </a>
+            <a
+            href="http://cloudpanic.com/features.html"
+            >
+            Features
+        </a>
+            <a
+            href="http://cloudpanic.com/enterprise-solutions.html"
+            >
+            Enterprise solutions
+        </a>
+            <a
+            href="http://cloudpanic.com/flash.html"
+            >
+            Flash
+        </a>
+            <a
+            href="http://cloudpanic.com/java.html"
+            >
+            Java
+        </a>
+            <a
+            href="http://cloudpanic.com/sap.html"
+            >
+            SAP
+        </a>
+    </div>
+
+
+    <div id="marketing-crap">
+        <strong>Next story that matters</strong>
+        <h2 id="after">Fri, 15 Jul 2011 11:00:00 +0200</h2>
+        <a href="http://twitter.com/cloudpanic">Hear about it!</a>
+    </div>
+</div>    </div>
+
+    <div id="footer">
+        <a href="/about.html">About</a> &bull;
+        <a href="http://www.flickr.com/photos/photos/pekkatamminen/2994909573/">Photo credits</a> &bull;
+        <a href="http://github.com/tipiirai/cloudpanic">Source code</a> (Github)</a>
+    </div>
+
+    <script>
+    head.js("/media/js/site.js")
+         .js("http://platform.twitter.com/widgets.js")
+         .js("http://www.google-analytics.com/ga.js", function() {
+                    var tracker = _gat._getTracker("UA-19863497-1");
+            tracker._trackPageview();
+            });
+    </script>
+
+</body>
+
+</html>
+