changeset 194:6fefa0f6af05 gmap2

Some work on second style.
author Matti Hamalainen <ccr@tnsp.org>
date Wed, 12 Mar 2014 04:36:51 +0200
parents b98f05d27502
children 20958bb31ee6
files css/mapstyle2.css
diffstat 1 files changed, 156 insertions(+), 65 deletions(-) [+]
line wrap: on
line diff
--- a/css/mapstyle2.css	Wed Mar 12 04:35:00 2014 +0200
+++ b/css/mapstyle2.css	Wed Mar 12 04:36:51 2014 +0200
@@ -1,56 +1,43 @@
-/* $Id: mapstyle.css 2290 2009-09-21 14:33:05Z jeskko $ */
-
 body {
 	background-image: url(../img/dark.jpg);
-	color: white; 
 	font-family: sans-serif;
 }
 
 #footer {
 	position: absolute;
 	bottom: 0px;
-	height: 1.5em;
+	height: 2em;
 	left: 0px;
 	right: 0px;
-	padding-top: 0.25em;
-	padding-left: 0.25em;
 	margin: 0px;
 }
 
-#sidebar {
-	background-image: url(../img/gray.jpg);
+#footercontent {
 	position: absolute;
-	right: 0px;
-	top: 3em;
-	bottom: 1.5em;
-	width: 290px;	
-	padding: 0px;
-	margin-top: 10px;
-	margin-bottom: 10px;
+
+	left: 0.2em;
+	right: 0.2em;
+	top: 0.25em;
+
+	padding: 0.5em;
+
+	color: white;
+	font-size: 10pt;
+
+	background: rgba(0,0,0, 0.6);
+	border-radius: 0.2em;
 }
 
-#topcorner {
-	position: absolute;
-	top: -6px;
-	left: 0px;
-	padding: 0px;
-	margin: 0px;
-}
- 
-#bottomcorner {
-	position: absolute;
-	bottom: -4px;
-	left: 0px;
-	margin: 0px;
-	padding: 0px;
+#footercontent span {
+	color: red;
 }
 
 #sidebar {
 	position: absolute;
 	right: 0px;
-	top: 50px;
+	top: 80px;
 	bottom: 80px;
-	width: 290px;
+	width: 270px;
 	padding: 0px;
 	margin: 0px;
 }
@@ -61,40 +48,41 @@
 
 	width: 100%;
 	height: 100%;
+	z-index: 5;
 }
 
 #sidetop {
 	position: absolute;
-	right: 0px;
-	top: -10px;
 	background-image: url(../img/graytop.jpg);
-	height: 10px;
-	width: 290px;
+	z-index: 10;
 
-	padding: 0px; 
-	margin: 0px;
+	width: 100%;
+	height: 65px;
+	top: -50px;
 }
 
 #sidebottom {
 	position: absolute;
 	background-image: url(../img/graybottom.jpg);
-	bottom: -10px;
-	right: 0px;
-	height: 10px;
-	width: 290px;
-	padding: 0px;
-	margin: 0px;
+	z-index: 10;
+
+	width: 100%;
+	height: 75px;
+	bottom: -35px;
+
 }
 
 #sidecontent {
 	position: absolute;
-	top: 80px;
-	bottom: 16px;
+	z-index: 15;
+
+	top: 140px;
+	bottom: 32px;
 
 	right: 16px;
 	left: 16px;
 
-	color: white;
+	color: black;
 	overflow: auto;
 
 	font-size: 10pt;
@@ -102,21 +90,25 @@
 }
 
 #sidecontent a {
+	display: inline-block;
+	width: 85%;
 	text-decoration: none;
-	color: white;
+	color: black;
+	padding: 2px;
+	margin: 2px;
+	border-radius: 4px;
+	text-shadow: 1px 1px 1px rgba(0,0,0,0.2);
 }
 
-#sidecontent div {
-	padding: 1px;
-}
-
-#sidecontent div:hover {
-	background: url(../img/dark.jpg);
+#sidecontent a:hover {
+	background: rgba(0,0,0,0.5);
+	color: #0f0;
 }
 
 #controls {
 	position: absolute;
 
+	top: 28px;
 	right: 16px;
 	left: 16px;
 
@@ -124,8 +116,10 @@
 }
 
 #controls span {
-	text-shadow: 2px 2px 2px #000;
-	margin: 4px;
+	text-shadow: 1px 1px 1px #000;
+	border: 1px solid black;
+	margin: 2px;
+	display: inline-table;
 }
 
 #controls * a {
@@ -139,16 +133,16 @@
 	width: 8px;
 	background-image: url(../img/graystrip.jpg);
 	position : absolute;
-	right: 290px;
-	top: 3em;
-	bottom: 1.5em;
+	right: 270px;
+	top: 0px;
+	bottom: 0px;
 	min-height: 50px;
 	padding-left: 1px;
 	padding-right: 1px;
 	padding-top: 0px;
 	padding-bottom: 0px;
 	margin: 0px;
-	}
+}
 
 #collbuttondiv {
 	position: relative; 
@@ -169,18 +163,115 @@
 	left: 0px;
 	right: 0px;
 	top: 0px;
-	height: 3em;
-	padding-left: 0.25em;
-	padding-top: 0.25em;	
+	height: 120px;
+	padding: 8px;
+}
+
+#headcontent {
+	color: white;
+	background: url(../img/batmud_logo2.png) no-repeat 0px 0px;
+	height: 100%;
+	padding: 0px;
+	padding-left: 200px;
+
+	text-shadow: 0px 0px 4px #000;
+	font-size: 0.7em;
+}
+
+#headcontent h1 {
+	font-size: 2em;
+	padding: 0px;
+	margin: 0px;
+}
+
+#headcontent h2 {
+	font-size: 1.5em;
+	padding: 0px;
+	margin: 0px;
+	color: red;
+}
+
+#headcontent div {
+	display: inline-block;
+}
+
+#headcontent .info {
+	position: absolute;
+	right: 280px;
+	width: auto;
+}
+
+#headcontent a {
+	color: white;
 }
 
 #map {
 	position: absolute;
 	left: 0px;
-	top: 3em;
-	right: 300px;
-	bottom: 1.5em;
+	top: 100px;
+	right: 280px;
+	bottom: 2em;
 	padding: 0px;
 	margin: 0px;
+
+	box-shadow: 10px 10px 5px #000;
+}
+
+#copyrights {
+	position: absolute;
+	padding: 0.2em;
+	left: 80px;
+	bottom: 4em;
+	height: auto;
+	width: auto;
+	font-size: 8pt;
+	color: rgba(255,255,255, 0.85);
+	text-shadow: 1px 1px 1px #000;
+}
+
+
+.labels {
+	color: white;
+	background: black;
+	font-family: "Arial", sans-serif;
+	font-weight: bold;
+	font-size: 10px;
+	white-space: nowrap;
+	padding: 2px;
+	border: 1px dotted white;
 }
 
+
+
+#sidecontent div div {
+	display: inline-block;
+	width: 10%;
+	height: auto;
+	border-radius: 0.5em;
+	box-shadow: 2px 2px 2px rgba(0,0,0,0.7);
+}
+
+#sidecontent div.c_laenor div {
+	color: yellow;
+	background: yellow;
+}
+
+#sidecontent div.c_rothikgen div {
+	color: blue;
+	background: blue;
+}
+
+#sidecontent div.c_furnachia div {
+	color: red;
+	background: red;
+}
+
+#sidecontent div.c_lucentium div {
+	color: green;
+	background: green;
+}
+
+#sidecontent div.c_desolathya div {
+	color: purple;
+	background: purple;
+}