Updates

antonydoyle · Oct 5, 2012 · cbb1810 · cbb1810
1 parent 9fc8af4
commit cbb1810
Show file tree

Hide file tree

Showing 6 changed files with 152 additions and 81 deletions.
diff --git a/css/templateCore.css b/css/templateCore.css
@@ -162,78 +162,106 @@ margin-bottom: 5px;
 input.button[type="submit"], input.medium.button[type="submit"] {
     padding: 6px 20px 9px;
 }
-.toggle {
-    width: 50px;
-    height: 15px;
-    display: block;
-	background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIHZpZXdCb3g9IjAgMCAxIDEiIHByZXNlcnZlQXNwZWN0UmF0aW89Im5vbmUiPgo8bGluZWFyR3JhZGllbnQgaWQ9Imc4MDciIGdyYWRpZW50VW5pdHM9InVzZXJTcGFjZU9uVXNlIiB4MT0idW5kZWZpbmVkIiB5MT0idW5kZWZpbmVkIiB4Mj0idW5kZWZpbmVkIiB5Mj0idW5kZWZpbmVkIj4KPHN0b3Agc3RvcC1jb2xvcj0iIzAwQ0M2NiIgb2Zmc2V0PSIwIi8+PHN0b3Agc3RvcC1jb2xvcj0iIzAwQ0M2NiIgb2Zmc2V0PSIwLjUiLz48c3RvcCBzdG9wLWNvbG9yPSIjRkY2NjY2IiBvZmZzZXQ9IjAuNSIvPjxzdG9wIHN0b3AtY29sb3I9IiNGRjY2NjYiIG9mZnNldD0iMSIvPgo8L2xpbmVhckdyYWRpZW50Pgo8cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2c4MDcpIiAvPgo8L3N2Zz4=);
-	background-image: -webkit-linear-gradient(hsla(0,0%,0%,.1), hsla(0,0%,100%,.1)), -webkit-linear-gradient(left, #0C6  48%, #f66 48%);
-	background-image: -moz-linear-gradient(hsla(0,0%,0%,.1), hsla(0,0%,100%,.1)), -moz-linear-gradient(left, #0C6 48%, #f66 48%);
-	background-image: -o-linear-gradient(hsla(0,0%,0%,.1), hsla(0,0%,100%,.1)), -o-linear-gradient(left, #0C6  48%, #f66 48%);
-	background-image: -ms-linear-gradient(hsla(0,0%,0%,.1), hsla(0,0%,100%,.1)), -ms-linear-gradient(left, #0C6  48%, #f66 48%);
-	background-image: linear-gradient(hsla(0,0%,0%,.1), hsla(0,0%,100%,.1)), linear-gradient(left, #0C6  48%, #f66 48%);    position: relative;
-    border-radius: 20px;
-    box-shadow: 0 1px 1px 0 rgba(255, 255, 255, .45), inset 0 1px 2px 0 rgba(0, 0, 0, .45);
-    font-size: 12px;
-    text-align: left;
+fieldset .dropdown {
+	margin-top:10px;
+}	
 
+    .toggle-switch {
+    height: 33px;
+    overflow: hidden;
+    padding: 3px;
+    width: 78px;
+    -webkit-transform:translateZ(0); /* eliminates flickering */
+    }
+
+    .toggle-switch .bg {
+    width:73px;
+    height:28px;
+    margin-bottom:-27px;
+    -webkit-border-radius:14px; -moz-border-radius:14px; border-radius:14px;
+    background-image:-webkit-gradient(linear,0 0, 100% 0, from(#08c), color-stop(50%, #08c), color-stop(51%, #fefefe), to(#eee));
+    background-image:-moz-linear-gradient(0deg, #08c 0, #08c 50%, #fefefe 51%, #eee 100%);
+    background-image:-linear-gradient(#08c, #08c 50%, #fefefe 51%, #eee);
+    -webkit-background-size:200%; -moz-background-size:200%; background-size:200%;
+    -webkit-transition:background-position 0.16s linear;
+    -moz-transition:background-position 0.2s linear;
+    transition:background-position 0.2s linear;
+    background-position:85%;
+    -webkit-box-shadow:inset 0 0 4px rgba(0,0,0,0.7), inset 0 14px 0 rgba(0,0,0,0.1);
+    -moz-box-shadow:inset 0 0 4px rgba(0,0,0,0.7), inset 0 14px 0 rgba(0,0,0,0.1);
+    box-shadow:inset 0 0 4px rgba(0,0,0,0.7), inset 0 14px 0 rgba(0,0,0,0.1);
+    }
+
+    .toggle-switch label { display:block; display:-webkit-box; display:-moz-box; display:box; width:78px; height:28px; position:relative; z-index:1;
+    -webkit-box-align:center; -moz-box-align:center; box-align:center;
+    -webkit-box-orient:horizontal; -moz-box-orient:horizontal; box-orient:horizontal;
+    -webkit-transform:translateX(-47px); -moz-transform:translateX(-47px); transform:translateX(-50%);
+    -webkit-transition:-webkit-transform 0.19s linear; -moz-transition:-moz-transform 0.2s linear; transition:transform 0.2s linear;
+    -webkit-tap-highlight-color:transparent;
+    }
+
+    .toggle-switch input:checked ~ .bg { background-position-x:20%; background-position:20% 50%; }
+    .toggle-switch input:checked ~ label { -webkit-transform:translateX(0); -moz-transform:translateX(0); transform:translateX(0);}
+    .toggle-switch input:checked ~ label span:last-child { -webkit-opacity:0; opacity:0; -webkit-transition-delay:0s; -moz-transition-delay:0s; transition-delay:0s; }
+
+    .toggle-switch input { display:none; }
+
+    .toggle-switch label span {
+    display:block; width:50%; padding:0 15px; font-size:14px; font-weight:bold; line-height:26px;
+    -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;
+    }
+
+    .toggle-switch label span:first-child { position:relative; color:#fff; padding-right:0; width:46px; }
+
+    .toggle-switch label span:last-child {
+    padding-left:33px;
+    padding-right:0;
+    color:#666;
+    text-shadow:1px 1px 0 #fff;
+    -webkit-opacity:0.7; -moz-opacity:0.7; opacity:0.7;
+    -webkit-transition:-webkit-opacity 0.2s 0.1s linear; -moz-transition:-moz-opacity 0.2s linear; transition:opacity 0.2s 0.1s linear;
+    }
+
+    .toggle-switch label span:first-child::after {
+    position:absolute;
+    right:-28px;
+    top:-2px;
+    display:inline-block;
+    width:28px;
+    height:28px;
+    border:1px solid #666;
+    -webkit-border-radius:14px; -moz-border-radius:14px; border-radius:14px;
+    background-color:#ccc;
+    -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;
+    content:"";
+    -webkit-box-shadow:0 0 2px rgba(0,0,0,0.7), inset 0 0 3px 1px rgba(255,255,255,1);
+    -moz-box-shadow:0 0 2px rgba(0,0,0,0.7), inset 0 0 3px 1px rgba(255,255,255,1);
+    box-shadow:0 0 2px rgba(0,0,0,0.7), inset 0 0 3px 1px rgba(255,255,255,1);
+    background-image:url("../images/dial.png");
+	background-repeat:no-repeat;
+    }
+
+/*Latest News module */
+ul.latestnews {
+	list-style:none;	
 }
-.toggle:before {
-    content: '';
-    position: absolute;
-    top: 0;
-    left: 50%;
-    z-index: 0;
+.latestnews li {
+	overflow:hidden;
+	border-bottom:1px dashed #333;
+	padding-top:5px;	
 }
-.toggle:after {
-    position: relative;
-    z-index: 2;
-    width: 95%;
-    margin: 5px 3px 3px 3px;
-    float: left;
-    content: attr(data-on) "\a" attr(data-off);
-    white-space: pre;
-    text-align: center;
-    -webkit-column-count: 2;
-    -moz-column-count: 2;
-    column-count: 2;
-}
-.toggle input {
-    position: absolute;
-    -webkit-opacity: 0;
-    -moz-opacity: 0;
-    opacity: 0;
-}
-.toggle span {
-    width: 28px;
-    height:18px;
-    background-color: #CCC;
-    display: block;
-    position: absolute;
-    top: -2px;
-    z-index: 99;
-    border-radius: 10px;
-    box-shadow: 0 1px 2px 1px rgba(0, 0, 0, .65), inset 0 1px 0 0 rgba(255, 255, 255, .85);
-    background-color: #fd5555;
-  background-image: -webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#d6d6d6)); /* Safari 4+, Chrome */
-  background-image: -webkit-linear-gradient(top, #ffffff, #d6d6d6); /* Chrome 10+, Safari 5.1+, iOS 5+ */
-  background-image:    -moz-linear-gradient(top, #ffffff, #d6d6d6); /* Firefox 3.6-15 */
-  background-image:      -o-linear-gradient(top, #ffffff, #d6d6d6); /* Opera 11.10-12.00 */
-  background-image:         linear-gradient(to bottom, #ffffff, #d6d6d6); /* Firefox 16+, IE10, Opera 12.50+ */
-	-webkit-transition: .25s;
-	-moz-transition: .25s;
-	-o-transition: .25s;
-	-ms-transition: .25s;
-	transition: .25s;
-}
-.toggle input:checked+span {
-    left: 43%;
-	-webkit-transition: .25s;
-	-moz-transition: .25s;
-	-o-transition: .25s;
-	-ms-transition: .25s;
-	transition: .25s;
-	}
-	.toggle > input:checked {
-		background:#090;	
-	}
+
+.dateReadon {
+	width:20%;
+	float:right;
+}
+.date {
+	width:100%;
+	padding:10px 10px 10px 10px;
+}
+.lnTitle {
+	width:100%;
+	overflow:hidden;	
+}
+.lnTitle a {
+}
diff --git a/html/mod_articles_latest/default.php b/html/mod_articles_latest/default.php
@@ -0,0 +1,35 @@
+<?php
+/**
+ * @package		Joomla.Site
+ * @subpackage	mod_articles_latest
+ * @copyright	Copyright (C) 2005 - 2012 Open Source Matters, Inc. All rights reserved.
+ * @license		GNU General Public License version 2 or later; see LICENSE.txt
+ */
+
+// no direct access
+defined('_JEXEC') or die;
+?>
+<ul class="latestnews<?php echo $moduleclass_sfx; ?>">
+<?php foreach ($list as $item) :  ?>
+	<li>
+		<div class="lnTitle"><a href="<?php echo $item->link; ?>">
+			<?php echo $item->title; ?></a></div>
+            <div class="dateReadon">
+    <div class="button date">    
+		<?php
+        $dateConvert =  $item->publish_up;
+        // previous to PHP 5.1.0 you would compare with -1, instead of false
+        if (($timestamp = strtotime($dateConvert)) === false) {
+            echo "The string ($str) is bogus";
+        } else {
+            echo  date('F dS', $timestamp);
+        }
+        ?>
+	</div>
+		<a class="button date" href="<?php echo $item->link; ?>">►</a>
+</div>
+	<p><?php echo substr($item->introtext, 0, 98); ?>...</p>
+
+	</li>
+<?php endforeach; ?>
+</ul>
diff --git a/html/mod_articles_latest/index.html b/html/mod_articles_latest/index.html
@@ -0,0 +1 @@
+<!DOCTYPE html><title></title>
diff --git a/html/mod_login/default.php b/html/mod_login/default.php
@@ -49,18 +49,24 @@
 	<?php if (JPluginHelper::isEnabled('system', 'remember')) : ?>
 	<p id="form-login-remember">
     <div class="six columns padded">
-             <p class="toggleLabel"><span>Show password</span></p>
-			<label class="toggle" >
-			    <input type='checkbox' onchange="document.getElementById('modlgn-passwd').type = this.checked ? 'text' : 'password'"/>
-			    <span></span>
-			</label>
+
+    <p class="toggleLabel"><span>Hide password</span></p>
+
+    <div class="toggle-switch">
+    <input type="checkbox" id="toggle-1" checked="" onchange="document.getElementById('modlgn-passwd').type = this.checked ? 'password' : 'text'"/>
+    <div class="bg"></div>
+    <label for="toggle-1"><span>ON</span><span>OFF</span></label>
+    </div>
+
        </div>
        <div class="six columns padded">
 		<p class="toggleLabel"><span><?php echo JText::_('MOD_LOGIN_REMEMBER_ME') ?></span></p>
-        <label class="toggle" >
-		<input id="modlgn-remember" type="checkbox" name="remember" class="inputbox" value="yes"/>
-        <span></span>
-        </label>
+
+             <div class="toggle-switch">
+            <input id="toggle-2" checked="checked" type="checkbox" name="remember" class="inputbox"/>
+            <div class="bg"></div>
+            <label for="toggle-2"><span>YES</span><span>NO</span></label>
+            </div>
         </div>
 	</p>
 	<?php endif; ?>

diff --git a/images/dial.png b/images/dial.png
diff --git a/templateDetails.xml b/templateDetails.xml
@@ -18,6 +18,7 @@
 		<folder>css</folder>
 		<folder>html</folder>
 		<folder>images</folder>
+		<folder>layouts</folder>
 		<folder>language</folder>
 		<folder>js</folder>
 	</files>