minor update demo

pm7 · Oct 3, 2012 · d7d3309 · d7d3309
1 parent 5f0d944
commit d7d3309
Show file tree

Hide file tree

Showing 27 changed files with 270 additions and 41 deletions.
diff --git a/public/adsense.php b/public/adsense.php
diff --git a/public/buttons.php b/public/buttons.php
@@ -12,6 +12,7 @@
     <link href="js/google-code-prettify/prettify.css" rel="stylesheet" type="text/css">
 
     <script src="js/jquery-1.8.2.min.js"></script>
+    <script src="js/google-analytics.js"></script>
     <script src="js/google-code-prettify/prettify.js"></script>
 
     <title>Modern UI CSS</title>
@@ -42,7 +43,7 @@
                             <button class="default">Button</button>
                             <button disabled="">Button</button>
 
-                            <p><small>You can also change the color of the button by <br />adding bg-color-* class, on example:</small></p>
+                            <p><small>You can also change the color of the button by <br />adding bg-color-* class. Example:</small></p>
 
                             <button class="bg-color-orange">Button</button>
                             <button class="bg-color-red">Button</button>
@@ -84,8 +85,17 @@
                         </div>
                     </div>
                 </div>
+
+                <div class="grid">
+                    <div class="row">
+                        <? include("adsense.php")?>
+                    </div>
+                </div>
+
+
             </div>
         </div>
+        <? include("footer.php")?>
     </div>
     <?php include("counter.php");?>
 

diff --git a/public/cards.php b/public/cards.php
@@ -12,6 +12,7 @@
     <link href="js/google-code-prettify/prettify.css" rel="stylesheet" type="text/css">
 
     <script src="js/jquery-1.8.2.min.js"></script>
+    <script src="js/google-analytics.js"></script>
     <script src="js/google-code-prettify/prettify.js"></script>
 
     <title>Modern UI CSS</title>
@@ -42,12 +43,12 @@
 </pre>
                 <h3>Set card value</h3>
                 <p class="span10">
-                    For set card value you can be use next subclasses: <code>.two</code>, <code>.three</code>, <code>.four</code>, <code>.five</code>, <code>.six</code>, <code>.seven</code>, <code>.eight</code>, <code>.nine</code>, <code>.ten</code>,
+                    To set card value you can be use next subclasses: <code>.two</code>, <code>.three</code>, <code>.four</code>, <code>.five</code>, <code>.six</code>, <code>.seven</code>, <code>.eight</code>, <code>.nine</code>, <code>.ten</code>,
                     <code>.jack</code>, <code>.dame</code>, <code>.king</code>, <code>.ace</code>.
                 </p>
                 <h3>Set card suit</h3>
                 <p class="span10">
-                    For set card suit you can be use next subclasses: <code>.spades</code>, <code>.clubs</code>, <code>.diamonds</code>, <code>.hearts</code>.
+                    To set card suit you can be use next subclasses: <code>.spades</code>, <code>.clubs</code>, <code>.diamonds</code>, <code>.hearts</code>.
                 </p>
                 <h3>Joker</h3>
 <pre class="prettyprint linenums span10">
@@ -156,8 +157,17 @@
                         </div>
                     </div>
                 </div>
+
+                <div class="grid">
+                    <div class="row">
+                        <? include("adsense.php")?>
+                    </div>
+                </div>
+
             </div>
         </div>
+        <? include("footer.php")?>
+
     </div>
     <?php include("counter.php");?>
 

diff --git a/public/css/site.css b/public/css/site.css
@@ -11,6 +11,28 @@ body {
     margin-right: 20px;
 }
 
+
+.github-info {
+    margin-top: 10px;
+}
+
+.github-info li {
+    float: left;
+    margin-left: 10px;
+    width: auto;
+}
+
+.github-info li span{
+    text-align: center;
+    display: block;
+    border: 1px #ccc solid;
+    border-radius: 100%;
+    padding: 5px;
+    margin-top: -5px;
+}
+
+.github-info li a img {width: 24px;}
+
 @media screen and (max-width: 800px) {
     .page {
         width: 768px !important;

diff --git a/public/footer.php b/public/footer.php
@@ -0,0 +1,5 @@
+<div class="header-bar">
+    <div class="header-bar-inner" style="padding-top: 10px;">
+        <p class="place-left tertiary-text fg-color-white">2012, Metro UI CSS Copyright by <a class="fg-color-blueLight" href="mailto:[email protected]">Sergey Pimenov</a></p>
+    </div>
+</div>
diff --git a/public/forms.php b/public/forms.php
@@ -12,6 +12,7 @@
     <link href="js/google-code-prettify/prettify.css" rel="stylesheet" type="text/css">
 
     <script src="js/jquery-1.8.2.min.js"></script>
+    <script src="js/google-analytics.js"></script>
     <script src="js/google-code-prettify/prettify.js"></script>
 
     <title>Modern UI CSS</title>
@@ -347,8 +348,17 @@
                         </div>
                     </div>
                 </div>
+
+                <div class="grid">
+                    <div class="row">
+                        <? include("adsense.php")?>
+                    </div>
+                </div>
+
             </div>
         </div>
+        <? include("footer.php")?>
+
     </div>
     <?php include("counter.php");?>
 

diff --git a/public/global.php b/public/global.php
@@ -12,6 +12,7 @@
     <link href="js/google-code-prettify/prettify.css" rel="stylesheet">
 
     <script src="js/jquery-1.8.2.min.js"></script>
+    <script src="js/google-analytics.js"></script>
     <script src="js/google-code-prettify/prettify.js"></script>
 
     <title>Modern UI CSS</title>
@@ -90,7 +91,7 @@
                     </div>
                     <div class="row">
                         <div class="span10">
-                            <p>For set background color use prefix <strong>bg</strong>, for set text color use prefix <strong>fg</strong></p>
+                            <p>To set background color use prefix <strong>bg</strong>, for set text color use prefix <strong>fg</strong></p>
 <pre class="prettyprint linenums">
     &lt;div class="bg-color-red"&gt;...&lt;/div&gt;
     &lt;span class="fg-color-blue"&gt;...&lt;/span&gt;
@@ -102,13 +103,22 @@
                         <div class="span10">
                             <h2>Fonts</h2>
                             <p class="span10">
-                                In Metro UI CSS i'm use <a href="http://www.google.com/webfonts#UsePlace:use/Collection:Open+Sans">Open Sans</a> font for UI and for text use Lucida Grande, Verdana or Arial (depending on the availability of the system).
+                                In Metro UI CSS i use <a href="http://www.google.com/webfonts#UsePlace:use/Collection:Open+Sans">Open Sans</a> font for UI and Lucida Grande, Verdana or Arial for text (depending on the availability in the system).
                             </p>
                         </div>
                     </div>
                 </div>
+
+                <div class="grid">
+                    <div class="row">
+                        <? include("adsense.php")?>
+                    </div>
+                </div>
+
             </div>
         </div>
+        <? include("footer.php")?>
+
     </div>
 
     <?php include("counter.php");?>

diff --git a/public/grid.php b/public/grid.php
@@ -12,6 +12,7 @@
     <link href="js/google-code-prettify/prettify.css" rel="stylesheet" type="text/css">
 
     <script src="js/jquery-1.8.2.min.js"></script>
+    <script src="js/google-analytics.js"></script>
     <script src="js/google-code-prettify/prettify.js"></script>
 
     <title>Modern UI CSS</title>
@@ -46,7 +47,7 @@
     &lt/div&gt;
 </pre>
                     <p>
-                        Grid no have max width value and fill on 100% parent container. Any cell have spanN class from span1 to span12. span1 has width 60px and margin left 20px and margin bottom 5px.
+                        Grid have no max width value and fill on 100% parent container. Any cells have spanN class from span1 to span12. Class spanN has margin left 20px and margin bottom 5px.
                     </p>
                     <h2>Cells dimention</h2>
                     <table class="stripped bordered">
@@ -72,7 +73,7 @@
                             <tr><td class="span1 center">12</td><td>span12</td><td class="right">940px</td></tr>
                         </tbody>
                     </table>
-                    <p>Class spanN may be used on any tags for setting width.</p>
+                    <p>Class spanN can be used on any tags for setting width.</p>
                 </div>
                 <h3>Example</h3>
                 <div class="grid element-border">
@@ -154,7 +155,7 @@
                 </div>
 
                 <h2>Grid in grid or nested rows</h2>
-                <p>You may be create grid in grid</p>
+                <p>You can create grid in grid</p>
 <pre class="prettyprint linenums span10">
     &lt;div class="grid"&gt;
         &lt;div class="row"&gt;
@@ -262,10 +263,19 @@
                         <tr><td class="span1 center">12</td><td>offset12</td><td class="right">960px</td></tr>
                         </tbody>
                     </table>
-                    <p>Class offsetN may be used on any tags for margin left.</p>
+                    <p>Class offsetN can be used on any tags for margin left.</p>
                 </div>
+
+                <div class="grid">
+                    <div class="row">
+                        <? include("adsense.php")?>
+                    </div>
+                </div>
+
             </div>
         </div>
+        <? include("footer.php")?>
+
     </div>
     <?php include("counter.php");?>
 

diff --git a/public/images.php b/public/images.php
@@ -12,6 +12,7 @@
     <link href="js/google-code-prettify/prettify.css" rel="stylesheet" type="text/css">
 
     <script src="js/jquery-1.8.2.min.js"></script>
+    <script src="js/google-analytics.js"></script>
     <script src="js/google-code-prettify/prettify.js"></script>
 
     <title>Modern UI CSS</title>
@@ -124,8 +125,17 @@
     &lt;/div&gt;
 </pre>
 
+                <div class="grid">
+                    <div class="row">
+                        <? include("adsense.php")?>
+                    </div>
+                </div>
+
+
             </div>
         </div>
+        <? include("footer.php")?>
+
     </div>
     <?php include("counter.php");?>
 

diff --git a/public/images/download-32.png b/public/images/download-32.png
diff --git a/public/images/fork-32.png b/public/images/fork-32.png
diff --git a/public/images/github.png b/public/images/github.png
diff --git a/public/images/view-32.png b/public/images/view-32.png
diff --git a/public/index.php b/public/index.php
@@ -11,6 +11,8 @@
     <link href="css/site.css" rel="stylesheet" type="text/css">
 
     <script src="js/jquery-1.8.2.min.js"></script>
+    <script src="js/google-analytics.js"></script>
+    <script src="js/github.info.js"></script>
 
     <title>Metro UI CSS</title>
 
@@ -19,15 +21,23 @@
     <div class="page">
         <div class="header-bar">
             <div class="header-bar-inner">
-                <p class="place-right tertiary-info-secondary-text fg-color-white" style="margin-top: 10px;">Build in <a class="fg-color-blue" href="http://www.jetbrains.com/phpstorm/">JetBrains PhpStorm</a></p>
+                <ul class="unstyled place-right github-info" data-repo="olton/Metro-UI-CSS">
+                    <li><a href="https://github.com/olton/Metro-UI-CSS/watchers"><img src="images/view-32.png" title="GitHub Wathers"/></a></li>
+                    <li><span class="github-watchers"></span></li>
+                    <li><a href="https://github.com/olton/Metro-UI-CSS/network/members"><img src="images/fork-32.png" title="GitHub Forks"/></a></li>
+                    <li><span class="github-forks"></span></li>
+                    <li>&nbsp;</li>
+                    <li><a href="https://github.com/olton/Metro-UI-CSS/zipball/master"><img src="images/download-32.png"/></a></li>
+                    <li><a href="https://github.com/olton/Metro-UI-CSS"><img src="images/github.png"/></a></li>
+                </ul>
                 <a href="/"><span class="modern-ui-logo place-left"></span></a><h4 class="fg-color-white"> &nbsp;<a class="fg-color-white" href="/">Metro UI CSS</a> - Create site in Windows 8 style</h4>
             </div>
         </div>
 
         <div class="page-region">
             <div class="page-region-content">
-                <h6 class="place-right">this is a next revision of <a href="http://metroui.org.ua">Metro UI CSS</a></h6>
-                <h2>Welcome to Metro UI CSS <sup class="fg-color-red">beta</sup></h2>
+                <p class="place-right tertiary-info-secondary-text" style="margin-top: 10px;">Build in <a class="fg-color-blue" href="http://www.jetbrains.com/phpstorm/">JetBrains PhpStorm</a></p>
+                <h2>Welcome to Metro UI CSS <sup class="fg-color-red"> v 0.1.1</sup></h2>
 
                 <div class="horizontal-menu">
                     <ul>
@@ -92,10 +102,12 @@
                     <h2>Create site in Windows 8 style now!</h2>
 
                     <br />
-                    <p>Metro UI CSS allows quickly, without distractions <br />on routine tasks, create a Web site in the style of <br />Windows 8.</p>
-                    <h3>For use: include modern.css</h3>
+                    <p>Metro UI CSS allows to create a Web site in the style of
+                        Windows 8 quickly and without distractions
+                        on routine tasks.</p>
+                    <h3>To start: include modern.css</h3>
                     <p class="tertiary-info-text">
-                        &lt;link href="css/modern.css" rel="stylesheet"&gt;
+                        &lt;link href="modern.css" rel="stylesheet"&gt;
                     </p>
                     <br />
                     <p class="tertiary-info-secondary-text">
@@ -135,7 +147,7 @@
                                 <div class="row">
                                     <div class="span4">
                                         <p>
-                                            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.
+                                            Metro UI CSS a set of styles to create a site with an interface similar to Windows 8 Metro UI. This set of styles was developed as a self-contained solution.
                                         </p>
                                         <br />
                                         <p class="tertiary-info-text">
@@ -165,32 +177,52 @@
                                             <li><a href="https://github.com/sagarsane/abetterportfolio">Portfolio for Developers</a></li>
                                             <li><a href="http://oazabir.github.com/Droptiles/">Droptiles</a></li>
                                             <li><a href="http://aozora.github.com/metroui-web/">Metroui-Web</a></li>
+                                            <li><a href="http://aozora.github.com/bootmetro/">BootMetro</a></li>
                                         </ul>
                                         <br />
                                         <br />
+                                        <div>
+                                            <form action="https://www.paypal.com/cgi-bin/webscr" method="post">
+                                                <input type="hidden" name="cmd" value="_s-xclick">
+                                                <input type="hidden" name="hosted_button_id" value="AVMB2NYSENK3A">
+                                                <input type="image" src="https://www.paypalobjects.com/en_US/i/btn/btn_donateCC_LG.gif" border="0" name="submit" alt="PayPal - The safer, easier way to pay online!">
+                                                <img alt="" border="0" src="https://www.paypalobjects.com/en_US/i/scr/pixel.gif" width="1" height="1">
+                                            </form>
+                                        </div>
+                                        <!--
+                                        <br />
                                         <div class="">
                                             <form style="display:inline" method=POST action="https://liqpay.com/?do=clickNbuy">
                                                 <input type="hidden" name="preorder" value="c27a4aa9211f4e6735b739850e99d568422af6e7">
-                                                <input type="submit" value="Donate 10 USD for Metro UI CSS">
+                                                <button type="submit" class="span3 command-button default">Donate 10 USD<small>for Metro UI CSS [LiqPay]</small></button>
                                             </form>
                                         </div>
-
+                                        -->
                                     </div>
                                 </div>
                             </div>
                         </div>
                     </div>
+                    <div class="row">
+                        <? include("adsense.php")?>
+                        <div class="span3">
+                            <script type="text/javascript"><!--
+                            google_ad_client = "ca-pub-1632668592742327";
+                            /* Main block */
+                            google_ad_slot = "9714689347";
+                            google_ad_width = 180;
+                            google_ad_height = 150;
+                            //-->
+                            </script>
+                            <script type="text/javascript"
+                                    src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
+                            </script>
+                        </div>
+                    </div>
                 </div>
             </div>
         </div>
-        <div class="header-bar">
-            <div class="header-bar-inner" style="padding-top: 10px;">
-
-                <p class="place-right tertiary-text fg-color-white">Windows 8 UI style Copyright by <a class="fg-color-blueLight" href="http://www.microsoft.com">Microsoft</a></p>
-                <p class="place-left tertiary-text fg-color-white">2012, Metro UI CSS Copyright by <a class="fg-color-blueLight" href="mailto:[email protected]">Sergey Pimenov</a></p>
-            </div>
-        </div>
-
+        <? include("footer.php")?>
     </div>
     <?php include("counter.php");?>