Merge pull request #464 from pixelroot/master

theme smoothly

view/theme/smoothly/categories_widget.tpl

@@ -0,0 +1,12 @@
+<div id="categories-sidebar" class="widget">
+	<h3>$title</h3>
+	<div id="nets-desc">$desc</div>
+	
+	<ul class="categories-ul">
+		<li class="widget-list"><a href="$base" class="categories-link categories-all{{ if $sel_all }} categories-selected{{ endif }}">$all</a></li>
+		{{ for $terms as $term }}
+			<li class="widget-list"><a href="$base?f=&category=$term.name" class="categories-link{{ if $term.selected }} categories-selected{{ endif }}">$term.name</a></li>
+		{{ endfor }}
+	</ul>
+	
+</div>

view/theme/smoothly/generic_links_widget.tpl

@@ -0,0 +1,11 @@
+<div class="widget{{ if $class }} $class{{ endif }}">
+	{{if $title}}<h3>$title</h3>{{endif}}
+	{{if $desc}}<div class="desc">$desc</div>{{endif}}
+	
+	<ul>
+		{{ for $items as $item }}
+			<li class="widget-list"><a href="$item.url" class="{{ if $item.selected }}selected{{ endif }}">$item.label</a></li>
+		{{ endfor }}
+	</ul>
+	
+</div>

view/theme/smoothly/nav.tpl

@@ -58,9 +58,11 @@
 	</div>
 </nav>
 
+<div id="scrollup">
+<a href="#top"><img src="view/theme/smoothly/totop.png"
+    alt="back to top" title="Back to top" /></a>
+</div>
 
 <ul id="nav-notifications-template" style="display:none;" rel="template">
 	<li class="{4}"><a href="{0}"><img src="{1}" height="24" width="24" alt="" />{2} <span class="notif-when">{3}</span></a></li>
 </ul>
-
-

view/theme/smoothly/style.css

@@ -3,11 +3,10 @@
   	Smoothly
    
   	Created by Anne Walk and Devlon Duthie on 2011-09-24
-	Modified by alex@friendica.pixelbits.de on 2012-09-06
+	Modified by alex@friendica.pixelbits.de on 2012-09-11
 
-*/
+
-/* ========== */
+** Colors ** 
-/* = Colors
 Blue links - #1873a2
 Blue link hover - #6da6c4
 Blue Gradients (buttons and other gradients) - #1873a2 and #6da6c4
@@ -18,8 +17,7 @@ Orange - #fec01d
 
 You can switch out the colors of the header, buttons and links by using a find and replace in your text editor.
 
- = */
+*/
-/* ========== */
 
 body {
     margin: 0 auto;
@@ -69,7 +67,14 @@ label {
 }
 
 li {
-	list-style: none;
+	list-style: none outside none;
+}
+li.widget-list {
+	list-style: none outside none;
+	background: url("arrow.png") no-repeat scroll left center transparent;
+	/*border-bottom: 1px dotted #D3D3D3;*/
+	display: block;
+    	padding: 3px 24px;
 }
 
 .required { display: inline; color: #1873a2; }
@@ -155,11 +160,15 @@ section {
 
 .mframe {
 	padding: 2px;
-	background-color: #efefef;
+    background: none repeat scroll 0 0 #FFFFFF;
+    border: 1px solid #C5C5C5;
+    border-radius: 3px 3px 3px 3px;
+    box-shadow: 0 0 8px #BDBDBD;
+	/*background-color: #efefef;
 	border: 1px solid #dddddd;
 	-moz-box-shadow: 3px 3px 4px #959494;
 	-webkit-box-shadow: 3px 3px 4px #959494;
-	box-shadow: 3px 3px 4px #959494;
+	box-shadow: 3px 3px 4px #959494;*/
 }
 
 #wall-item-lock {
@@ -473,7 +482,6 @@ aside a{
 
 .vcard {
 	font-size: 1em;
-/*	font-variant:small-caps; */
 }
 
 .vcard dd {
@@ -493,12 +501,13 @@ aside a{
 	margin: 10px 0px;
 	padding: 12px;
 	width: 175px;
-	background-color: #f3f3f3;
+	background: none repeat scroll 0 0 #FFFFFF;
-	border: 1px solid #dddddd;
+	/*background-color: #f3f3f3;*/
+	border: 1px solid #C5C5C5; /*1px solid #dddddd;*/
 	-moz-box-shadow: 3px 3px 4px #959494;
 	-webkit-box-shadow: 3px 3px 4px #959494;
-	box-shadow: 3px 3px 4px #959494;	
+	box-shadow: 0 0 8px #BDBDBD; /*3px 3px 4px #959494;*/	
-border-radius: 5px 5px 5px 5px;
+	border-radius: 5px 5px 5px 5px;
 }
 
 aside h4 { font-size: 1.3em; }
@@ -507,7 +516,6 @@ aside h4 { font-size: 1.3em; }
 	color: #626262;
 	text-align: center;
 	font-weight: bold;
-/*	font-variant:small-caps; */
 	font-size: 1.1em;
 }
 .allcontact-link a {
@@ -921,7 +929,6 @@ profile-jot-banner-wrapper {
 	min-width: 400px;
 	list-style: none;
 	padding: 20px 0px 0px;
-	/*border-bottom: 1px solid #efefef;*/
 	font-size: 0.9em;
 }
 .tabs li { display: inline;}
@@ -949,14 +956,12 @@ profile-jot-banner-wrapper {
 	margin-bottom: 20px;
 	padding-right: 10px;
 	padding-left: 12px;
-	background: -moz-linear-gradient(center top , #F8F8F8 5%, #F6F6F6 100%) repeat scroll 0 0 #F8F8F8;
+	background: none repeat scroll 0 0 #FFFFFF;
+	/*background: -moz-linear-gradient(center top , #F8F8F8 5%, #F6F6F6 100%) repeat scroll 0 0 #F8F8F8;*/
 	border: 1px solid #CDCDCD;
 	border-radius: 5px 5px 5px 5px;
-	box-shadow: 3px 3px 4px 0 #959494;
+	box-shadow: 0 0 8px #BDBDBD; /*3px 3px 4px 0 #959494;*/
-	/*color: #E6E6E6;*/
 	margin-top: 20px;
-	/*text-shadow: -1px 0 0 #BDBDBD;*/
-	/*	Overflow: hidden; */
 }
 
 .wall-item-outside-wrapper-end { clear: both;}
@@ -989,7 +994,6 @@ profile-jot-banner-wrapper {
 	-o-transition: all 0.25s ease-in-out;
 	-ms-transition: all 0.25s ease-in-out;
 	transition: all 0.25s ease-in-out;	
-	/*margin-left: 140px;*/
 	margin-top: 10px;
 	padding-bottom: 5px;
 	float: right;
@@ -1099,7 +1103,6 @@ profile-jot-banner-wrapper {
 .wall-item-conv a{
 	font-size: 0.9em;
 	color: #898989;
-/*	font-variant:small-caps; */
 }
 
 .wallwall .wwto {
@@ -1216,7 +1219,6 @@ profile-jot-banner-wrapper {
 .icollapse-wrapper {
 	font-size: 0.9em;
 	color: #898989;
-/*	font-variant:small-caps;	*/
 }
 
 .comment-wwedit-wrapper,
@@ -1264,7 +1266,7 @@ profile-jot-banner-wrapper {
 
 #item-delete-selected-desc {
 	color: #898989;
-	float: right;
+	float: left;
 }
 
 .wall-item-body code {
@@ -1326,7 +1328,6 @@ div[id$="wrapper"] br { clear: left; }
 
 .profile-listing-name {
 	font-size: 1em;
-/*	font-variant: small-caps;*/
 }
 .profile-listing-name a {
 	color: #898989;
@@ -1372,7 +1373,6 @@ div[id$="wrapper"] br { clear: left; }
 
 .profile-match-name a{
 	color: #999;
-	/*font-variant: small-caps;*/
 	font-size: 1em;
 }
 
@@ -1492,7 +1492,6 @@ div[id$="wrapper"] br { clear: left; }
 	padding: 0px 5px;
 	font-weight: bold;
 	font-stretch:semi-expanded;
-/*	font-variant:small-caps; */
 } 
 
 .photo-top-album-name a{
@@ -1506,7 +1505,6 @@ div[id$="wrapper"] br { clear: left; }
 	text-align: center;
 	color: #6e6e6e;
 	font-size: 0.9em;
-/*	font-variant: small-caps; */
 }
 
 #photo-photo{
@@ -1517,7 +1515,6 @@ div[id$="wrapper"] br { clear: left; }
 #photo-caption {
 	margin-top: 10px;
 	color: #6E6E6E;
-/*	font-variant:small-caps; */
 	font-size: 1.1em;
 }
 
@@ -1754,7 +1751,6 @@ input#photo_edit_form {
 }
 
 #prvmail-message-label {
-/*	font-variant:small-caps; */
 	font-size: 1em;	
 }
 
@@ -1800,7 +1796,6 @@ margin-left: 0px;
 .mail-list-sender-name {
 	font-size: 1.1em;
 	display: inline;
-/*	font-variant:small-caps; */
 }
 
 .mail-list-date {
@@ -1810,7 +1805,6 @@ margin-left: 0px;
 	font-size: 0.9em;
 	padding-left: 10px;
 	font-stretch:ultra-condensed;
-/*	font-variant:small-caps; */
 }
 
 .mail-list-subject {
@@ -1935,7 +1929,6 @@ margin-left: 0px;
 	font: #999;
 	font-size: 12px;
 	text-align:center;
-/*	font-variant:small-caps; */
 	font-weight: bold;
 	margin-top:5px;
 }
@@ -1954,7 +1947,6 @@ margin-left: 0px;
 
 #contact-edit-banner-name { font-size: 1.5em; margin-left: 30px; }
 
-
 #contact-edit-update-now {
 	padding:7px;
 	width: 165px;
@@ -1995,7 +1987,6 @@ margin-left: 0px;
 	margin: auto;
 }
 
-
 .contact-photo-menu-button {
 	position: absolute;
 	background-image: url("photo-menu.jpg");
@@ -2069,7 +2060,6 @@ margin-left: 0px;
 	width: 158px;
 	padding: 10px;
 	margin: auto 10px 20px;
-	/*margin-bottom: 20px;*/
 	-moz-box-shadow:inset 0px 1px 0px 0px #cfcfcf;
 	-webkit-box-shadow:inset 0px 1px 0px 0px #cfcfcf;
 	box-shadow:inset 0px 1px 0px 0px #cfcfcf;
@@ -2173,7 +2163,6 @@ margin-left: 0px;
 	background-color:#1873a2;	
 }
 
-
 #side-suggest-link:active {
 	background-color: #1873a2;
 	position:relative;
@@ -2329,7 +2318,6 @@ margin-left: 0px;
 	-webkit-box-shadow:inset 0px 1px 0px 0px #cfcfcf;
 	box-shadow:inset 0px 1px 0px 0px #cfcfcf;
 	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #7c7d7b), color-stop(1, #555753) );
-	/*background:-moz-linear-gradient( center top, #7c7d7b 5%, #555753 100% );*/
 	background: -moz-linear-gradient(center top , #BDBDBD 5%, #A2A2A2 100%) repeat scroll 0 0 #BDBDBD;
 	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#7c7d7b', endColorstr='#555753');
 	color: #EFEFEF;
@@ -2441,7 +2429,7 @@ margin-left: 0px;
 	background-color:#bdbdbd;
 	-moz-border-radius:5px;
 	-webkit-border-radius:5px;
-	border-radius:5px;*/
+	border-radius:5px;
 }
 
 .group-delete-wrapper:hover {
@@ -2576,7 +2564,6 @@ margin-left: 0px;
 	margin-bottom: 2px;
 	margin-top: 2px;
 	font-size: 0.9em;
-/*	font-variant: small-caps; */
 	text-align: left;
 }
 
@@ -2642,7 +2629,6 @@ margin-left: 0px;
 .event-list-date {
 	color: #626262;
 	margin-bottom: 10px;
-/*	font-variant:small-caps; */
 	font-stretch:condensed;
 }
 
@@ -2678,7 +2664,6 @@ margin-left: 0px;
 	color: #ffffff;
 	font-weight: bold;
 	text-align:center;
-/*	font-variant:small-caps; */
 	-moz-box-shadow: 5px 2px 8px #959494;
 	-webkit-box-shadow: 5px 2px 8px #959494;
 	box-shadow: 5px 2px 8px #959494;
@@ -2756,13 +2741,11 @@ tr {
 
 .directory-details {
 	font-size: 0.9em;
-/*	font-variant: small-caps; */
 	width: 160px;
 }
 
 .directory-name {
 	font-size: 1em;
-/*	font-variant: small-caps; */
 	width: 150px;	
 }
 
@@ -2859,7 +2842,7 @@ tr {
 
 .field label {
 	float: left;
-	width: 400px; /*550*/
+	width: 480px; /*550*/
 }
 
 .field input,
@@ -2923,7 +2906,7 @@ tr {
 	margin-left: 5px;
 	margin-right: 5px;
 	display: block; width: 20px; height: 20px;
-	background-image: url('icons.png');
+	background-image: url("icons.png");
 }
 .starred { 
 	background-image: url("star.png"); 
@@ -2976,7 +2959,7 @@ tr {
 }
 
 .sharePerms {
-	background-image: url(icons.png);
+	background-image: url("icons.png");
 	width: 20px;
 	height: 20px;
 	margin: 2px 0px 2px 3px;
@@ -3000,7 +2983,7 @@ tr {
 
 .attachtype {
 	display: block; width: 20px; height: 23px;
-	background-image: url('../../../images/content-types.png');
+	background-image: url("../../../images/content-types.png");
 }
 
 .type-video { background-position: 0px 0px; }
@@ -3325,7 +3308,8 @@ ul.menu-popup {
 	background: #000;
 }
 
-/* Pages profile widget */
+/* Pages profile widget
+----------------------------------------------------------- */
 #page-profile div#profile-page-list{
 	margin-left: 45px;
 }
@@ -3335,3 +3319,14 @@ hr.line-dots {
     border: medium none;
     /*padding: 0.5em 0;*/
 }
+
+/* SCROLL TO TOP
+----------------------------------------------------------- */
+#scrollup {
+	position:fixed;
+	right:5px;
+	bottom:5px;
+	z-index:100;
+}
+#scrollup a:hover{text-decoration:none;border:0;}
+

view/theme/smoothly/theme.php

@@ -2,8 +2,8 @@
 
 /*
  * Name: Smoothly
- * Description: Theme opzimized for Tablets
+ * Description: Theme optimized for iPad/iPad2
- * Version: 0.4
+ * Version: 0.5
  * Author: Alex <https://friendica.pixelbits.de/profile/alex>
  * Maintainer: Alex <https://friendica.pixelbits.de/profile/alex>
  * Screenshot: <a href="screenshot.png">Screenshot</a>
@@ -13,6 +13,7 @@ $a->theme_info = array();
 
 function smoothly_init(&$a) {
 $a->page['htmlhead'] .= <<< EOT
+
 <script>
 function insertFormatting(comment,BBcode,id) {
 	
@@ -91,7 +92,6 @@ $('.savedsearchterm').hover(
 
 });
 
-
 </script>
 EOT;
 }