From abdda721480417cf632df28916405ee24b8cf707 Mon Sep 17 00:00:00 2001 From: Mike Gerwitz Date: Sat, 24 Mar 2012 23:54:00 -0400 Subject: [PATCH] Added titlebar to entire game "window" --- index.html | 119 +++++++++++++++++++++++++++-------------------------- style.css | 29 ++++++++----- 2 files changed, 80 insertions(+), 68 deletions(-) diff --git a/index.html b/index.html index 8b08605..07577fb 100644 --- a/index.html +++ b/index.html @@ -35,69 +35,72 @@
- +
LaserTank.js
+
+ - - - Your web browser does not support the canvas element. - + + + Your web browser does not support the canvas element. + -
-   -
+
+   +
-
- - - - - - - - - -
- +
+ + + + + + + + + +
+ -
-
- Load LTG and LVL -

This section is temporary and is used during development.

+
+
+ Load LTG and LVL +

This section is temporary and is used during development.

- - -
+ + +
+
diff --git a/style.css b/style.css index c2126af..9642a9c 100644 --- a/style.css +++ b/style.css @@ -15,6 +15,25 @@ body { width: 696px; } +/* simply ensures that absolute-positioned elements are below the title bar */ +.game > div { + position: relative; +} + +/* common to all titles (dialog-specific is further down) */ +.title { + background-color: #000080; + background-image: -webkit-linear-gradient( left, #000080, #1084d0 ); + background-image: -moz-linear-gradient( left, #000080, #1084d0 ); + background-image: -ms-linear-gradient( left, #000080, #1084d0 ); + background-image: -o-linear-gradient( left, #000080, #1084d0 ); + + font-weight: bold; + color: white; + + padding: 0.4em; +} + /** menu **/ .game ul.menu, .game ul.menu ul { @@ -187,17 +206,7 @@ body { z-index: 2001; } .dialog > .body > .title { - background-color: #000080; - background-image: -webkit-linear-gradient( left, #000080, #1084d0 ); - background-image: -moz-linear-gradient( left, #000080, #1084d0 ); - background-image: -ms-linear-gradient( left, #000080, #1084d0 ); - background-image: -o-linear-gradient( left, #000080, #1084d0 ); margin: -0.5em -0.5em 0.5em -0.5em; - - font-weight: bold; - color: white; - - padding: 0.4em; } .dialog .close { float: right;