From: Fabrixxm <fabrix.xm@gmail.com>
Date: Wed, 11 Dec 2013 10:25:41 +0000 (-0500)
Subject: Add better support to small screen to duepuntozero theme.
X-Git-Url: https://git.mxchange.org/?a=commitdiff_plain;h=9474a0deedcd7b6e0e940182c4396defa0512387;p=friendica.git

Add better support to small screen to duepuntozero theme.
This close #823. It also add some styles for screens less than 960px.
It's not a mobile theme, but should be better to see in case.
---

diff --git a/view/theme/duepuntozero/style.css b/view/theme/duepuntozero/style.css
index 527b2f4d86..3567062a4e 100644
--- a/view/theme/duepuntozero/style.css
+++ b/view/theme/duepuntozero/style.css
@@ -91,6 +91,7 @@ nav {
 	display: block;
 	margin: 0px 10%;
 	border-bottom: 1px solid #babdb6;
+	position: relative; 
 }
 nav #site-location {
 	color: #888a85;
@@ -2905,6 +2906,8 @@ aside input[type='text'] {
 
 .field.radio .field_help { margin-left: 0px; }
 
+
+
 /**
  * ADMIN
  */
@@ -3252,7 +3255,7 @@ ul.menu-popup {
 	list-style: none;
 	z-index: 100000;
 	top: 90px;
-	left: 400px;
+	left: 200px;
 }
 #nav-notifications-menu {
 	width: 320px;
@@ -3328,3 +3331,63 @@ ul.menu-popup {
 .shared_header span {
 	margin-left: 10px;
 }
+
+/* small screens */
+@media all and (max-width: 1089px) {
+    .field label { width: 90%; }
+    .field input, .field textarea, .field select  { width: 90%; }
+	.field input[type="checkbox"],.field input[type="radio"] {
+		width: 2em;
+	}
+    #id_openid_url { width: 85%; }
+    .field_help { margin-left: 0px; }
+	textarea { width: 100%; }
+}
+@media all and (max-width: 760px) {
+	body { background-image: none; }
+	nav, aside, section, footer { 
+		margin: 0px; 
+		float: none; 
+		position: relative; 
+		width: 100%;
+		padding: 0.5em;
+		height: auto;
+	}
+	aside:before {
+		content: ">>";
+		display: block;
+		background-color: #eee;
+	}
+	aside { overflow: hidden; min-height: 0; height: 1em;}
+	aside:hover, aside:focus { height: auto; }
+
+	nav .nav-link { 
+		float: left;
+		width: 23%;
+		min-width: 100px;
+		height: 15px;	
+		display: block;
+		margin: 0.4em 2px 0 0;
+
+		padding: 6px 3px;
+		border-width: 1px 1px 0px;
+		border-style: solid solid none;
+		border-color: rgb(186, 189, 182);
+		background-color: rgb(174, 192,211)!important;
+	}
+	.nav-commlink.selected,
+	.nav-commlink { 
+		border-bottom: 0px;
+		padding: 6px 3px;
+		min-width: 100px;
+		float: left; 
+		margin-top: 0.4em;
+		width: 23%;
+		bottom: auto;
+	}
+	.nav-ajax-left {margin-left: -1em; margin-top: 0px;	}
+	nav #site-location,
+	nav #banner { position: relative; clear:both; }
+	ul.menu-popup { left: 0px; top 20px; }
+
+}
\ No newline at end of file