New demo, new layout.less, bug fixed and mmm

sagarsane · Jul 29, 2012 · 44541dd · 44541dd
1 parent 319f668
commit 44541dd
Show file tree

Hide file tree

Showing 100 changed files with 2,659 additions and 0 deletions.
diff --git a/demo/img/ico-paypal.gif b/demo/img/ico-paypal.gif
diff --git a/img/demo-buttons.jpg b/img/demo-buttons.jpg
diff --git a/img/demo-forms.jpg b/img/demo-forms.jpg
diff --git a/img/demo-images.jpg b/img/demo-images.jpg
diff --git a/img/demo-main.jpg b/img/demo-main.jpg
diff --git a/img/demo-notices.jpg b/img/demo-notices.jpg
diff --git a/img/demo-tiles.jpg b/img/demo-tiles.jpg
diff --git a/img/ico-paypal.gif b/img/ico-paypal.gif
diff --git a/new-demo/.htaccess b/new-demo/.htaccess
@@ -0,0 +1,8 @@
+php_value short_open_tag on
+RewriteEngine on
+RewriteBase /
+RewriteCond %{REQUEST_FILENAME} !-f
+RewriteCond %{REQUEST_FILENAME} !-d
+RewriteRule . index.php
+RewriteCond %{THE_REQUEST} ^GET\ .*/index\.(php|html)\ HTTP
+RewriteRule ^(.*)index\.(php|html)$ /$1 [R=301,L]
diff --git a/new-demo/about.html b/new-demo/about.html
@@ -0,0 +1,153 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <meta name="description" content="Metro UI CSS Demo Site">
+    <meta name="author" content="Sergey Pimenov">
+    <meta name="keywords" content="windows 8, metro style, metro ui, style, metro, css">
+
+    <title>Metro UI CSS</title>
+
+    <link href="/css/metro.css" rel="stylesheet">
+    <link href="/css/site.less" rel="stylesheet/less" type="text/css" >
+
+    <script src="/js/less-1.3.0.min.js" type="text/javascript"></script>
+    <script src="/js/jquery-1.7.2.min.js" type="text/javascript"></script>
+    <script src="/js/jquery.mousewheel.min.js" type="text/javascript"></script>
+    <script src="/js/jquery.cookie.js" type="text/javascript"></script>
+    <script src="/js/metroui.js" type="text/javascript"></script>
+    <script src="/js/site.js" type="text/javascript"></script>
+</head>
+<body>
+<div class="metro" id="about">
+    <div class="layout">
+        <!-- Header -->
+        <div class="header" id="header">
+            <div class="command-back-wrapper">
+                <a href="#"><img src="/img/left-32.png"/></a>
+            </div>
+            <ul class="commands-list place-right margin-20">
+                <li><a class="command" href="https://github.com/olton/Metro-UI-CSS/zipball/master"><img src="/img/download-32.png"/></a></li>
+                <li><a class="command" href="https://github.com/olton/Metro-UI-CSS"><img src="/img/github.png"/></a></li>
+                <li><a class="command" data-click="toggleCommands" onclick="toggleCommands()"><img src="/img/commands-32.png"/> </a></li>
+            </ul>
+            <div class="dropdown-container clearfix">
+                <a class="dropdown-toggle">
+                    <h1><img src="/img/logo.gif" style="width: 32px; margin-right: 10px;">Metro UI CSS<b></b></h1>
+                </a>
+
+                <ul class="dropdown-menu">
+                    <li><a href="/about.html">About</a></li>
+                    <li class="divider"></li>
+                    <li><a href="/layout.html">Layout</a></li>
+                    <li><a href="/tiles.html">Tiles</a></li>
+                    <li><a href="/images.html">Images</a></li>
+                    <li><a href="/notices.html">Notices</a></li>
+                    <li><a href="/buttons.html">Buttons</a></li>
+                    <li><a href="/form.html">Form</a></li>
+                    <li><a href="/typography.html">Typography</a></li>
+                    <li><a href="/cards.html">Deck of Cards</a></li>
+                    <li><a href="/">More...</a></li>
+                    <li class="divider"></li>
+                    <li><a href="/">Home</a></li>
+                    <li class="divider"></li>
+                    <li><a href="/donate.html">Donate</a></li>
+                </ul>
+            </div>
+            <b class="stick"></b>
+        </div>
+
+        <!-- Scrollable content -->
+        <div id="scroll" class="scrollable">
+            <div class="content clearfix" id="content">
+                <h1 style="color: #1e1e1e;">About</h1>
+
+                <div class="frames">
+                    <div class="frame size3">
+                        <div class="metro-sections">
+                            <div class="metro-section size2">
+                                <div class="tile bg-color-red">
+                                    <div class="tile-icon-cover">
+                                        <img src="/img/windows-8-metro.jpg"/>
+                                    </div>
+                                </div>
+                                <div class="tile bg-color-green">
+                                    <div class="tile-icon-cover">
+                                        <img src="/img/IC568017.png"/>
+                                    </div>
+                                </div>
+                                <div class="tile">
+                                    <div class="tile-icon-cover">
+                                        <img src="/img/tiles.png"/>
+                                    </div>
+                                </div>
+                                <div class="tile bg-color-yellow">
+                                    <div class="tile-icon-cover">
+                                        <img src="/img/cp_dp.jpg"/>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+
+                    <div class="frame size4">
+                        <div>
+                            <h2 style="color: #1e1e1e;">Metro UI CSS</h2>
+                            <h5 style="margin: 0;">styles in the style of Windows 8 Metro</h5>
+                            <p style="color: #1e1e1e;">Metro UI CSS - a set of styles to create a site with an interface similar to Windows 8 Metro UI. The set of styles developed as a self-contained solution, although it can be used as an addition to any other CSS framework.</p>
+
+                            <br />
+                            <p>Browsers: IE 9+, Chrome, Opera, Safari, Firefox</p>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+
+        <!-- Commands -->
+        <div class="commands" id="commands">
+            <ul class="commands-list place-right">
+                <li>
+                    <a class="command">
+                        <img src="/img/find-32.png" alt="Find"/>
+                        <span>Find</span>
+                    </a>
+                </li>
+            </ul>
+
+            <ul class="commands-list place-left">
+                <li>
+                    <a class="command">
+                        <img src="/img/favorites-32.png" alt="Favorites"/>
+                        <span>Favorites</span>
+                    </a>
+                </li>
+                <li class="divider"></li>
+                <li>
+                    <a class="command" onclick="document.location.reload()">
+                        <img src="/img/refresh-32.png" alt="Refresh"/>
+                        <span>Refresh</span>
+                    </a>
+                </li>
+
+                <li>
+                    <a class="command">
+                        <img src="/img/bookmark-add-32.png" alt="Add bookmark"/>
+                        <span>Bookmark</span>
+                    </a>
+                </li>
+
+            </ul>
+        </div>
+    </div>
+</div>
+
+<script type="text/javascript">
+    $(function(){
+        $("body").metroUI();
+    })
+</script>
+
+</body>
+</html>