From 9462f29413dc1320b3899f7fbbbb75be64fbaede Mon Sep 17 00:00:00 2001 From: Patrick Davison Date: Sat, 9 Feb 2013 14:16:37 -0800 Subject: Huge changes; started deprecation of PHP's displayMap() New JS function 'mapAsHTML(mapAsObject)' getScores() will now return solutions if the map has expired. Homepage now uses mapAsHTML. Removed some padding on scoreboard. scoresFormatPage() supports solutions if available. (This can be row-specific) And tons of CSS - deprecating old CSS. --- css/maps.css | 153 ++++++++++++++++++++++++++++++++++++++++++---------------- css/page.css | 2 +- css/stats.css | 27 +++++++++++ 3 files changed, 140 insertions(+), 42 deletions(-) (limited to 'css') diff --git a/css/maps.css b/css/maps.css index 0913320..57ddc7e 100644 --- a/css/maps.css +++ b/css/maps.css @@ -6,105 +6,175 @@ color:#FF2222; } -.map_thumbnail { +.map { border-spacing: 1px; background-size: 100%; } -.map_thumbnail td { +.map div { border: 0px solid #000; - padding: 4px; + padding: 0px; margin: 0px; background-size: 100%; } -.map_thumbnail .o { +.map .w { + background-image: url(../images/OverlayTileFaceted50b.png); + background-size: 100%; + transition:background-color 0.6s ease-out; + -webkit-transition:background-color 0.6s ease-out; + -o-transition:background-color 0.6s ease-out; + -moz-transition:background-color 0.6s ease-out; +} +.map .w:hover { + background-image: url(../images/OverlayTileFaceted30.png); +} + +.map .o { background-image: url(../images/OverlayTile10.png); background-color: #F5FBFE } -.map_thumbnail .r { +.map .r { background-image: url(../images/OverlayTileFaceted50b.png); background-color: #b85555; } -.map_thumbnail .s { +.map .s { background-image: url(../images/OverlayStart50b.png); background-color: #fbfefb; } -.map_thumbnail .f { +.map .s2 { + background-image: url(../images/OverlayStart2.png); + background-color: #fbfefb; +} +.map .f { background-image: url(../images/OverlayFinish50c.png); background-color: #666; } -.map_thumbnail .x { +.map .x { background-image: url(../images/Path1xRock.png); background-color: #fff; } -.map_thumbnail .x2 { +.map .x2 { background-image: url(../images/Path2xRock.png); background-color: #fff; } /* CHECKPOINTS */ -.map_thumbnail .c { +.map .c { background-image: url(../images/OverlayA50.png); background-color: #F777FF; } -.map_thumbnail .c2 { +.map .c2 { background-image: url(../images/OverlayB50.png); background-color: #FFFF11; } -.map_thumbnail .c3 { +.map .c3 { background-image: url(../images/OverlayC50.png); background-color: #FF4466; } -.map_thumbnail .c4 { +.map .c4 { background-image: url(../images/OverlayD50.png); background-color: #ff9911; } -.map_thumbnail .c5 { +.map .c5 { background-image: url(../images/OverlayE50.png); background-color: #00FFFF; } -.map_thumbnail .t { +/* TELEPORTS */ +.map .t { background-image: url(../images/TeleportInW.png); background-color: #3377AA; } -.map_thumbnail .t2 { +.map .t2 { background-image: url(../images/TeleportIn.png); background-color: #44EE66; } -.map_thumbnail .t3 { +.map .t3 { background-image: url(../images/TeleportInW.png); background-color: #992200; } -.map_thumbnail .t4 { +.map .t4 { background-image: url(../images/TeleportIn.png); background-color: #55CCFF; } -.map_thumbnail .t5 { +.map .t5 { background-image: url(../images/TeleportInW.png); background-color: #005533; } -.map_thumbnail .u { +.map .u { background-image: url(../images/TeleportOutW.png); background-color: #3377AA; } -.map_thumbnail .u2 { +.map .u2 { background-image: url(../images/TeleportOut.png); background-color: #44EE66; } -.map_thumbnail .u3 { +.map .u3 { background-image: url(../images/TeleportOutW.png); background-color: #992200; } -.map_thumbnail .u4 { +.map .u4 { background-image: url(../images/TeleportOut.png); background-color: #55CCFF; } -.map_thumbnail .u5 { +.map .u5 { background-image: url(../images/TeleportOutW.png); background-color: #005533; } +/* PATHING */ +.transition { + width:100%; + height:100%; + transition:background-color .5s ease-out; + -webkit-transition:background-color .5s ease-out; + -o-transition:background-color .5s ease-out; + -moz-transition:background-color .5s ease-out; +} +.map .path0-1 { + background-image: url(../images/paths/Path1-1.png); +} +.map .path0-2 { + background-image: url(../images/paths/Path1-2.png); +} +.map .path0-3 { + background-image: url(../images/paths/Path1-3.png); +} +.map .path0-4 { + background-image: url(../images/paths/Path1-4.png); +} +.map .path1-1 { + background-image: url(../images/paths/Path2-1.png); +} +.map .path1-2 { + background-image: url(../images/paths/Path2-2.png); +} +.map .path1-3 { + background-image: url(../images/paths/Path2-3.png); +} +.map .path1-4 { + background-image: url(../images/paths/Path2-4.png); +} + +.map .child { + width:100%; + height:100%; + position:relative; + display:inline-block; + background-size:100%; +} +.playable .o { + background-image: url(../images/OverlayTile10.png); + background-color: #F5FBFE; + transition:background-color .3s; + -webkit-transition:background-color .3s; + -o-transition:background-color .3s; + -moz-transition:background-color .3s; +} +.playable .o :hover +{ + background-image: url(../images/OverlayTileFaceted20.png); +} /* grid stuff */ @@ -120,7 +190,7 @@ .grid_outer { position:relative; - padding: 2px 0 1px; + padding: 2px 3px 3px; margin: 0 auto 2px; background-color: #334; border-radius: 2px; @@ -171,10 +241,10 @@ padding: 0px; margin: 0px; border: 0px; - +/* width: 35px; height: 35px; - + */ } .grid_table { @@ -211,7 +281,7 @@ width: 35px; height: 35px; line-height:3px; - background: url(../images/OverlayTileFaceted50b.png); + background-image: url(../images/OverlayTileFaceted50b.png); background-size: 100%; transition:background-color .3s; -webkit-transition:background-color .3s; @@ -247,25 +317,26 @@ } .grid_td_gray { background-color: #CCCCCC; - background: url(../images/OverlayTileFaceted50b.png); + background-image: url(../images/OverlayTileFaceted50b.png); } .grid_td_path { - background: #FFFFEE url(../images/OverlayTeleport.png); + background-image: url(../images/OverlayTeleport.png); + background-color: #FFFFEE; } .grid_td_blanks { background: inherit; } .grid_td_walls { - background-color: #F00; - background: url(../images/OverlayTileFaceted50b.png); + /* background-color: #F00; */ + background-image: url(../images/OverlayTileFaceted50b.png); transition:background-color 1.6s ease-out; -webkit-transition:background-color 1.6s ease-out; -o-transition:background-color 1.6s ease-out; -moz-transition:background-color 1.6s ease-out; } .grid_td_walls:hover { - background: url(../images/OverlayTileFaceted30.png); + background-image: url(../images/OverlayTileFaceted30.png); } .grid_td_active { @@ -428,16 +499,16 @@ -moz-transition:background-color .5s ease-out; } .grid_td_path0-1 { - background: url(../images/paths/Path1-1.png); + background-image: url(../images/paths/Path1-1.png); } .grid_td_path0-2 { - background: url(../images/paths/Path1-2.png); + background-image: url(../images/paths/Path1-2.png); } .grid_td_path0-3 { - background: url(../images/paths/Path1-3.png); + background-image: url(../images/paths/Path1-3.png); } .grid_td_path0-4 { - background: url(../images/paths/Path1-4.png); + background-image: url(../images/paths/Path1-4.png); } .grid_td_path1-1 , .grid_td_path1-2, .grid_td_path1-3, .grid_td_path1-4 { transition:background-color .5s ease-out; @@ -446,16 +517,16 @@ -moz-transition:background-color .5s ease-out; } .grid_td_path1-1 { - background: url(../images/paths/Path2-1.png); + background-image: url(../images/paths/Path2-1.png); } .grid_td_path1-2 { - background: url(../images/paths/Path2-2.png); + background-image: url(../images/paths/Path2-2.png); } .grid_td_path1-3 { - background: url(../images/paths/Path2-3.png); + background-image: url(../images/paths/Path2-3.png); } .grid_td_path1-4 { - background: url(../images/paths/Path2-4.png); + background-image: url(../images/paths/Path2-4.png); } diff --git a/css/page.css b/css/page.css index db32892..a3d5b87 100644 --- a/css/page.css +++ b/css/page.css @@ -352,7 +352,7 @@ table.score { } table.score th, table.score td { - padding: 2px 4px 1px 4px; + padding: 0px 4px 0px 4px; } table.score td { font-size:105%; diff --git a/css/stats.css b/css/stats.css index d028d0f..a0830da 100644 --- a/css/stats.css +++ b/css/stats.css @@ -176,6 +176,33 @@ td, th { } +.scoreRow1 { + background-color:#262631; +} +.scoreRow2 { + background-color:#20202a; +} +.scoreRowSelf { + background-color: #343c57; +} + +.scoreRowSolutionAvailable { + /* Temporary adjust for font changes */ + font-size:105%; + transition:background .5s; + -webkit-transition:background .5s; + -o-transition:color .5s; + -moz-transition:color .5s; + cursor: default; +} +.scoreRowSolutionAvailable:hover { + background-color: #535D85; + transition:background 0s; + -webkit-transition:background 0s; + -o-transition:color 0s; + -moz-transition:color 0s; + cursor: pointer; +} .scoreMedal { text-align:right; } -- cgit v1.2.3