summaryrefslogtreecommitdiffstats
path: root/css
diff options
context:
space:
mode:
Diffstat (limited to 'css')
-rw-r--r--css/achievements.css (renamed from css/profile.css)133
-rw-r--r--css/chat.css59
-rw-r--r--css/mapeditor.css10
-rw-r--r--css/maps.css11
-rw-r--r--css/page.css83
-rw-r--r--css/stats.css67
6 files changed, 270 insertions, 93 deletions
diff --git a/css/profile.css b/css/achievements.css
index 3adf15e..24fd034 100644
--- a/css/profile.css
+++ b/css/achievements.css
@@ -1,56 +1,79 @@
-
-
-@keyframes badgeAnimate
-{
-0% {transform: rotate(-90deg);}
-80% {transform: rotate(10deg);}
-95% {transform: rotate(-4deg);}
-97% {transform: rotate(1deg);}
-99% {transform: rotate(-1deg);}
-100% {transform: rotate(0deg);}
-}
-@-moz-keyframes badgeAnimate /* Firefox */
-{
-0% {-moz-transform: rotate(-90deg);}
-80% {-moz-transform: rotate(10deg);}
-95% {-moz-transform: rotate(-4deg);}
-97% {-moz-transform: rotate(1deg);}
-99% {-moz-transform: rotate(-1deg);}
-100% {-moz-transform: rotate(0deg);}
-}
-@-o-keyframes badgeAnimate /* Opera */
-{
-0% {-o-transform: rotate(-90deg);}
-80% {-o-transform: rotate(10deg);}
-95% {-o-transform: rotate(-4deg);}
-97% {-o-transform: rotate(1deg);}
-99% {-o-transform: rotate(-1deg);}
-100% {-o-transform: rotate(0deg);}
-}
-@-webkit-keyframes badgeAnimate /* Safari and Chrome */
-{
-0% {-webkit-transform: rotate(-90deg);}
-90% {-webkit-transform: rotate(8deg);}
-95% {-webkit-transform: rotate(-4deg);}
-97% {-webkit-transform: rotate(1deg);}
-99% {-webkit-transform: rotate(-1deg);}
-100% {-webkit-transform: rotate(0deg);}
-}
-
-.badge
-{
- animation: badgeAnimate 1s linear;
- -moz-animation: badgeAnimate 1s linear; /* Firefox */
- -o-animation: badgeAnimate 1s linear; /* Opera */
- -webkit-animation: badgeAnimate 1s linear; /* Safari and Chrome */
-
- width:45px;
- height:45px;
- background-color: #666666;
- background-size:100%;
- padding: 1px 1px;
- border-radius: 5px;
- text-decoration: none;
- border: 2px solid #888;
- box-shadow: 0 0 3px #445;
+
+.progressBar {
+ align:left;
+ width:310px;
+ height:16px;
+ background-color:#222;
+ border:1px solid #26b;
+ border-radius: 0px 6px 6px 0px;
+}
+
+.progressBar div {
+ border-right:1px solid #37e;
+ height:16px;
+ border-radius: 0px 6px 6px 0px;
+ background: #1e5799; /* Old browsers */
+ background: -moz-linear-gradient(45deg, #1e5799 0%, #7db9e8 100%); /* FF3.6+ */
+ background: -webkit-gradient(linear, left bottom, right top, color-stop(0%,#1e5799), color-stop(100%,#7db9e8)); /* Chrome,Safari4+ */
+ background: -webkit-linear-gradient(45deg, #1e5799 0%,#7db9e8 100%); /* Chrome10+,Safari5.1+ */
+ background: -o-linear-gradient(45deg, #1e5799 0%,#7db9e8 100%); /* Opera 11.10+ */
+ background: -ms-linear-gradient(45deg, #1e5799 0%,#7db9e8 100%); /* IE10+ */
+ background: linear-gradient(45deg, #1e5799 0%,#7db9e8 100%); /* W3C */
+ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1e5799', endColorstr='#7db9e8',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
+}
+
+
+@keyframes badgeAnimate
+{
+0% {transform: rotate(-90deg);}
+80% {transform: rotate(10deg);}
+95% {transform: rotate(-4deg);}
+97% {transform: rotate(1deg);}
+99% {transform: rotate(-1deg);}
+100% {transform: rotate(0deg);}
+}
+@-moz-keyframes badgeAnimate /* Firefox */
+{
+0% {-moz-transform: rotate(-90deg);}
+80% {-moz-transform: rotate(10deg);}
+95% {-moz-transform: rotate(-4deg);}
+97% {-moz-transform: rotate(1deg);}
+99% {-moz-transform: rotate(-1deg);}
+100% {-moz-transform: rotate(0deg);}
+}
+@-o-keyframes badgeAnimate /* Opera */
+{
+0% {-o-transform: rotate(-90deg);}
+80% {-o-transform: rotate(10deg);}
+95% {-o-transform: rotate(-4deg);}
+97% {-o-transform: rotate(1deg);}
+99% {-o-transform: rotate(-1deg);}
+100% {-o-transform: rotate(0deg);}
+}
+@-webkit-keyframes badgeAnimate /* Safari and Chrome */
+{
+0% {-webkit-transform: rotate(-90deg);}
+90% {-webkit-transform: rotate(8deg);}
+95% {-webkit-transform: rotate(-4deg);}
+97% {-webkit-transform: rotate(1deg);}
+99% {-webkit-transform: rotate(-1deg);}
+100% {-webkit-transform: rotate(0deg);}
+}
+
+.badge
+{
+ animation: badgeAnimate 1s linear;
+ -moz-animation: badgeAnimate 1s linear; /* Firefox */
+ -o-animation: badgeAnimate 1s linear; /* Opera */
+ -webkit-animation: badgeAnimate 1s linear; /* Safari and Chrome */
+
+ width:45px;
+ height:45px;
+ background-color: #666666;
+ background-size:100%;
+ padding: 1px 1px;
+ border-radius: 5px;
+ text-decoration: none;
+ border: 2px solid #888;
+ box-shadow: 0 0 3px #445;
} \ No newline at end of file
diff --git a/css/chat.css b/css/chat.css
index 0b38d70..f612887 100644
--- a/css/chat.css
+++ b/css/chat.css
@@ -3,15 +3,34 @@
font-family: 'Trebuchet MS1', 'Trebuchet MS', sans-serif;
border: 1px solid gray;
background-color:#999;
- width: 700px;
- margin: 7px;
+ width: 680px;
+ margin: 7px 3px;
padding: 2px;
border-radius: 10px;
border-bottom-right-radius: 20px;
border-top-right-radius: 20px;
}
.chatButton {
- margin: 4px;
+ margin: 0px;
+ width: 50px;
+}
+
+#chatMute {
+ display:inline-block;
+ border:1px solid gray;
+ width:17px;
+ height:17px;
+ background-size: 100%;
+ position: relative;
+ top: 5px;
+ margin-right: 5px;
+}
+
+.chatMute_true {
+ background-image: url(../images/Sound.png);
+}
+.chatMute_false {
+ background-image: url(../images/Mute.png);
}
#chatContainer {
@@ -29,17 +48,30 @@
.chatBadge {
height:100%;
+ z-index:2;
float:left;
}
.chatUsername {
font-family: 'Trebuchet MS1', 'Trebuchet MS', sans-serif;
font-size: 17px;
- text-overflow: ellipsis;
+ text-overflow: clip;
overflow:hidden;
float: left;
padding-top: 5px;
width: 115px;
}
+.chatUsername:after {
+ content:":";
+}
+.chatUsername.me {
+ text-align:right;
+}
+.chatUsername.me:after {
+ content:"";
+}
+.chatUsername.me:before {
+ content:"*";
+}
.chatText {
font-family: 'Trebuchet MS1', 'Trebuchet MS', sans-serif;
font-size: 16px;
@@ -53,12 +85,13 @@
word-wrap: break-word; /* IE */
}
.chatTimestamp {
- font-family:"Times New Roman", Times, serif;
+ font-family: Trebuchet MS1, Trebuchet MS, sans-serif;
+ font-size: 1em;
float:left;
- padding: 5px 3px 3px 3px;
- min-width:70px;
+ padding: 5px 0px 3px 0px;
+ width:83px;
overflow:hidden;
- text-overflow: ellipsis;
+ text-overflow: clip;
white-space:nowrap;
}
.chatColumn1 {
@@ -95,6 +128,16 @@
background-color: #844;
}
+.chatText.spoiler {
+ color:transparent;
+}
+.chatText.spoiler:before {
+ content: " Click to reveal Spoiler ";
+ color:#7AF;
+ font-style: italic;
+}
+
+
.chatContainer2 {
background-color: #222;
padding:10px;
diff --git a/css/mapeditor.css b/css/mapeditor.css
new file mode 100644
index 0000000..60a6e78
--- /dev/null
+++ b/css/mapeditor.css
@@ -0,0 +1,10 @@
+
+
+
+.plusMinus {
+ float:left;
+ width:130px;
+ border:1px solid gray;
+ padding:2px;
+ margin:2px;
+} \ No newline at end of file
diff --git a/css/maps.css b/css/maps.css
index 857647a..86a2f76 100644
--- a/css/maps.css
+++ b/css/maps.css
@@ -15,6 +15,10 @@
padding: 0px;
margin: 0px;
background-size: 100%;
+ transition:background-color .4s;
+ -webkit-transition:background-color .4s;
+ -o-transition:background-color .4s;
+ -moz-transition:background-color .4s;
}
.map .w {
background-image: url(../images/OverlayTileFaceted50b.png);
@@ -184,6 +188,13 @@
background-image: url(../images/OverlayTileFaceted20.png);
}
+.tileDisplay div {
+ float:left;
+ border:1px solid blue;
+ margin:2px;
+ width:36px;
+ height:36px;
+}
/* grid stuff */
diff --git a/css/page.css b/css/page.css
index ad45e8b..ec0f1c9 100644
--- a/css/page.css
+++ b/css/page.css
@@ -56,7 +56,7 @@ form {
padding: 15px 0px;
text-align: center;
position: relative;
- min-width: 900px;
+ min-width: 960px;
background: #272727;
background: -moz-linear-gradient(top, #272727 0%, #111111 100%);
@@ -72,7 +72,7 @@ form {
.copyAndButtons
{
margin: 0 auto;
- width: 900px;
+ width: 960px;
}
.copyAndButtons #copy
@@ -255,19 +255,24 @@ position:absolute;color:#333;left:25px;bottom:20px;
-.topbarSpacer {
- width:900px;
- height:70px;
-}
.wrapper {
- width: 900px;
+ width: 960px;
margin: 0 auto;
}
.wrapper2 {
- width:900px;
+ width:960px;
min-height:20px;
margin: 0 auto;
}
+.contentWrapper {
+ width: 930px;
+ margin: 0 auto;
+ border: 1px solid #333;
+ border-top:0px;
+ border-bottom:0px;
+ padding-left:15px;
+ padding-right:15px;
+}
.hidden-maps {
display:none;
@@ -283,13 +288,18 @@ position:absolute;color:#333;left:25px;bottom:20px;
float:right;
}
+.topbarSpacer {
+ width:960px;
+ height:0px;
+}
#topbar {
font-weight:bold;
- padding: 15px 15px;
- margin: 0 auto 40px;
- text-align: center;
- position: fixed; /* for #user */
- min-width: 900px;
+ padding: 15px 0px 15px 0px;
+ padding: 0px;
+ height:50px
+ text-align:center;
+ position: relative;
+ min-width: 960px;
width:100%;
background: -moz-linear-gradient(top, #555, #222);
background: -webkit-linear-gradient(top, #555, #222);
@@ -300,25 +310,47 @@ position:absolute;color:#333;left:25px;bottom:20px;
-khtml-opacity: 0.9;
opacity: 0.9;
}
-#topbar a.nav {
+#topbarContent {
+ margin: 0 auto;
+ position: relative;
+ text-align: center;
+ width:960px;
+ height:100%;
+}
+#topbarContent a.nav {
background-color: #222;
- margin-right: 15px;
+ display: inline-block;
+ margin: 7px;
padding: 7px 10px;
border-radius: 5px;
text-decoration: none;
border: 1px solid #333;
box-shadow: 0 0 1px #444;
}
-#topbar a.nav.selected, #topbar a.nav:hover {
+#topbarContent a.nav.selected, #topbarContent a.nav:hover {
border: 1px solid #222;
- background-color: #2c2c2c;
+ background-color: inherit;
}
-#topbar #user {
- position: absolute;
- right: 45px;
- top: 5px;
+#topbarContent #user {
+ position: fixed;
+ right: 10px;
+ top: 2px;
text-align: right;
}
+#topbarBadge {
+ margin-left:10px;
+ margin-top:4px;
+ background-size: 100%;
+ width:41px;
+ height:41px;
+ float:left;
+}
+#topbarBadge div {
+ width:100%;
+ height:100%;
+ background-image: url(../images/OverlayTileFaceted50b.png);
+ background-size:100%;
+}
#difficulties {
width: 100%;
@@ -475,5 +507,14 @@ table.score th {
background-color:#356;
cursor:default;
}
+.unselectable
+{
+ -webkit-touch-callout: none;
+ -webkit-user-select: none;
+ -khtml-user-select: none;
+ -moz-user-select: none;
+ -ms-user-select: none;
+ user-select: none;
+}
diff --git a/css/stats.css b/css/stats.css
index 166573d..e63be80 100644
--- a/css/stats.css
+++ b/css/stats.css
@@ -1,3 +1,9 @@
+#displayDate
+{
+ font-size: 105%;
+ text-align: center;
+ padding: 7px 0px;
+}
.col1 {
float: left;
margin-right: 8px;
@@ -32,7 +38,7 @@
.mapNavCon {
height:135px;
- width:900px;
+ width:960px;
margin-bottom:10px;
}
.mapNavLeft {
@@ -48,23 +54,31 @@
border-radius: 0px 25px 6px 0px;
vertical-align: middle;
text-align:center;
- line-height: 130px;
+ line-height: 126px;
text-decoration: none;
background-color: #262631;
font-size:200%;
border-radius: 5px;
border: 1px solid #333;
+ cursor: auto;
+}
+.mapNavActive {
+ cursor: pointer;
}
.mapNavActive:hover {
background-color: #343c57;
}
+.mapNavActive:active {
+ background-color: #555588;
+}
.mapNavDisabled {
background-color: #222223;
+ cursor: default;
}
.mapNavCenter {
float:left;
height:135px;
- width:780px;
+ width:840px;
margin-left:20px;
margin-right:20px;
background-color:#222223;
@@ -74,18 +88,30 @@
overflow-y:hidden;
}
#mapNavigation {
- margin-left: 45px;
+ margin-left: 75px;
padding:1px;
white-space: nowrap;
overflow-x:hidden;
overflow-y:hidden;
}
+.scoreCol {
+ min-height:500px;
+ min-width:277px;
+ float:left;
+}
+.mapCol {
+ min-height:500px;
+ float:left;
+ margin-left: 7px;
+ max-width:500px;
+}
+
.mapThumbnail {
display:inline-block;
padding: 8px;
background-color:#334;
- margin: 3px;
+ margin: 4px;
border-radius:10px;
cursor:pointer;
padding-top: 0px;
@@ -94,11 +120,31 @@
background-color:#445;
}
-.mapThumbnail.current {
- background-color:#557;
+.mapThumbnail.selectedMap {
+ border-color: #CC3333;
+ border-style: solid;
+ /* Make sure border-width + margin == .mapThumbnail margin */
+ border-width: 3px;
+ margin: 1px;
+}
+.mapThumbnail.currentlyRunning {
+ background-color: #373737;
+ color: #CCCCCC;
+}
+.mapThumbnail.currentlyRunning:hover {
+ background-color:#474747;
+}
+#currentlyRunningMessage {
+ color: #FF2818;
+ display: none;
+ text-align: center;
+ padding-bottom: 12px;
}
-.mapThumbnail.current:hover {
- background-color:#668;
+
+#currentlyRunningMessage span {
+ background-color: #1A1A1A;
+ border-radius: 8px 8px 8px 8px;
+ padding: 3px 10px;
}
@@ -168,6 +214,9 @@ td, th {
.scoreActive:hover {
background-color: #343c57;
}
+.scoreActive:active {
+ background-color: #555588;
+}
.scoreDisabled {
background-color: #222223;
}
generated by cgit v1.2.3 (git 2.46.0) at 2025-06-28 23:16:51 +0000