Mercurial > hg > fapweb

changeset 186:4edcce55da9c

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
Improve stylesheets, mobile version is now somewhat usable.
author Matti Hamalainen <ccr@tnsp.org>
date Fri, 08 Nov 2013 18:55:35 +0200
parents 449b2862cc75
children 1fcdc6e752f6
files desktop.css main.css mobile.css
diffstat 3 files changed, 119 insertions(+), 34 deletions(-) [+]
line wrap: on
line diff
--- a/desktop.css	Fri Nov 08 18:55:04 2013 +0200
+++ b/desktop.css	Fri Nov 08 18:55:35 2013 +0200
@@ -2,7 +2,7 @@
 	background: black url(img/grid.png);
 }
 
-a.logo {
+a.logo, a.logo2 {
 	background: url(img/fap.png) no-repeat center;
 	height: 10em;
 	display: block;
--- a/main.css	Fri Nov 08 18:55:04 2013 +0200
+++ b/main.css	Fri Nov 08 18:55:35 2013 +0200
@@ -93,21 +93,20 @@
 	background: rgba(0,255,0,0.25);
 }
 
-table.attendees th.regtime, table.attendees td.regtime {
-	width: 10%;
-	display: none;
+table.attendees .regtime {
+	width: 15%;
 }
 
-table.attendees th.oneliner {
+table.attendees .oneliner  {
 	width: 50%;
 }
 
-table.attendees th.name {
-	width: 10%;
+table.attendees .name {
+	width: 15%;
 }
 
-table.attendees th.groups {
-	width: 10%;
+table.attendees .groups {
+	width: 15%;
 }
 
 tr.rodd td {
--- a/mobile.css	Fri Nov 08 18:55:04 2013 +0200
+++ b/mobile.css	Fri Nov 08 18:55:35 2013 +0200
@@ -1,28 +1,24 @@
 body {
 	background: black url(img/gridsm.png);
-	font-size: 10px;
+	font-size: 12px;
 }
 
 a.logo {
 	display: none;
 }
 
+a.logo2 {
+	background: url(img/fapsm.png) no-repeat center;
+	height: 10em;
+	display: block;
+}
+
 
 #header {
 	display: none;
 }
 
-
 #menu {
-	position: fixed;
-	top: 0.5em;
-	left: 0.5em;
-	right: 0.5em;
-	margin: 0em;
-	width: auto;
-	height: auto;
-	padding: 0.1em;
-
 	color: #0f0;
 	text-shadow: 0px 0px 3px #0f0;
 
@@ -33,10 +29,12 @@
 	border-bottom: 2pt solid #060;
 
 	font-family: Impact;
-	font-size: 1em;
+	font-size: 0.75em;
 
 	border-radius: 5pt;
 	box-shadow: 8px 8px 16px #000;
+
+	text-align: center;
 }
 
 
@@ -44,12 +42,13 @@
 	display: none;
 }
 
+
 #menu a {
-	float: left;
+	float: none;
 	display: inline;
 	text-decoration: none;
 	padding: 5pt;
-	margin: 3pt;
+	
 	background: rgba(0,50,0,0.7);
 
 	color: #0d0;
@@ -75,23 +74,36 @@
 	box-shadow: 2px 2px 4px rgba(0,255,0,0.5) inset, -2px -2px 4px rgba(0,255,0,0.5) inset;
 }
 
-#date {
-	display: none;
+#infobox {
+	position: fixed;
+	z-index: 15;
+
+	margin: 0em;
+	padding: 3pt;
+	min-width: 10em;
+
+	font-family: Impact;
+	font-size: 1em;
+	text-align: center;
+	color: #0f0;
+	text-shadow: 0px 0px 3px #0f0;
+
+	background: rgba(0,0,0,0.6);
+	border-top: 2pt solid #0f0;
+	border-left: 2pt solid #0f0;
+	border-right: 2pt solid #060;
+	border-bottom: 2pt solid #060;
+
+	border-radius: 5pt;
+	box-shadow: 8px 8px 16px #000;
 }
 
 #maincontent {
-	position: fixed;
-	top: 4em;
-	left: 1em;
-	right: 1em;
-	bottom: 1em;
-	padding: 1em;
-	margin: 0em;
 	background: rgba(0,0,0,0.8);
 
 	border: 1pt solid #0f0;
 
-	box-shadow: 4px 4px 4px rgba(0,255,0,0.7), -4px -4px 4px rgba(0,255,0,0.7), 8px 8px 32px rgba(0,255,0,0.4) inset;
+	box-shadow: 4px 4px 4px rgba(0,255,0,0.7), -4px -4px 4px rgba(0,255,0,0.7), 8px 8px 16px rgba(0,255,0,0.4) inset;
 
 	text-shadow: 1px 1px 1px rgba(0,0,0,0.6);
 	-moz-border-radius: 8pt;
@@ -99,9 +111,83 @@
 	color: white;
 }
 
-#maincontent > div, #admin > div {
+
+@media only screen and (orientation: landscape), only screen and (min-width: 640px), only screen and (min-device-width: 640px) {
+	#menu {
+		top: 0em;
+		min-width: 25em;
+
+		margin-left:auto;
+		margin-right:auto;
+		padding: 0.25em;
+
+		line-height: 3.2em;
+	}
+
+	#infobox {
+		top: 4em;
+		right: 3em;
+	}
+
+	#date {
+		display: none;
+	}
+
+	#maincontent {
+		position: absolute;
+		top: 5em;
+		left: 1em;
+		right: 1em;
+		bottom: 1em;
+		padding: 1em;
+	}
+}
+
+
+@media only screen and (orientation: portrait) {
+	#menu {
+		top: 0em;
+		height: 6.5em;
+		min-width: 25em;
+		max-width: 25em;
+
+		margin-left:auto;
+		margin-right:auto;
+		padding: 0.25em;
+
+		line-height: 3.2em;
+	}
+
+	#infobox {
+		top: 8em;
+		right: 3em;
+	}
+
+	#date {
+		display: none;
+	}
+
+	#maincontent {
+		position: absolute;
+		top: 9em;
+		left: 1em;
+		right: 1em;
+		bottom: 1em;
+		padding: 1em;
+	}
+}
+
+#maincontent > div {
 	width: 100%;
 	height: 100%;
 	overflow-y: auto;
 }
 
+table.attendees .regtime {
+	display: none;
+}
+
+
+table.register, table.register input {
+	font-size: 0.4em;
+}
\ No newline at end of file