Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP
Browse files

Merge pull request #4 from afarber/master

Nicer button for dev menu + 2 new mixins
  • Loading branch information...
commit b6ef275e801503e770f93e24ac251d18ad439424 2 parents f56a4b5 + e63f2a7
@hdragomir hdragomir authored
View
26 css/dev-menu.less
@@ -22,13 +22,13 @@
.transform(rotate(1deg));
color: white;
font: 45px 'Bubblegum Sans', sans-serif;
- left: 20px;
+ left: -120px;
overflow: hidden;
padding:0;
margin:-10px 0 0 120px;
position:relative;
- right: 0px;
+ right: 20px;
text-overflow: ellipsis;
text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5);
top: -50px;
@@ -42,13 +42,17 @@
}
#dev-menu button.cancel{
- text-indent: -1000px;
- width: 90px;
- height: 90px;
- position:absolute;
- margin:0;
- padding: 0;
- position:absolute;
- top: 0;
- right: 32px;
+ position: absolute;
+ top: 0; right: 64px;
+ width: 92px; height: 92px;
+ text-indent: 92px;
+ background: url("../images/popup/close_button.png") no-repeat 0 0;
+ -webkit-appearance: none;
+ -moz-appearance: none;
+ margin: 0;
+ border: 0;
+ padding: 0;
+ &:active {
+ background-position: -92px 0;
+ }
}
View
12 css/hud.less
@@ -45,10 +45,8 @@ padding-top: 10px;
z-index: 1101;
text-align: center;
color: #fff;
- -webkit-user-select: none;
- -webkit-user-drag: none;
- -moz-user-select: none;
- -moz-user-drag: none;
+ .user-select(none);
+ .user-drag(none);
border-radius: 10px;
}
header > div {
@@ -65,10 +63,8 @@ header #coins, header #food, header #population, header #level {
}
header div.doober-tooltips{
pointer-events: none;
- -webkit-user-select: none;
- -webkit-user-drag: none;
- -moz-user-select: none;
- -moz-user-drag: none;
+ .user-select(none);
+ .user-drag(none);
position: absolute;
text-align: center;
width: 100%;
View
47 css/main.less
@@ -25,8 +25,7 @@ canvas {
position: relative;
z-index: 199;
display: block;
- -webkit-user-select: none;
- -moz-user-select: none;
+ .user-select(none);
}
#info-grid {
opacity: 0.5;
@@ -36,10 +35,8 @@ canvas {
left: 0;
z-index: 200;
pointer-events: none;
- -webkit-user-select: none;
- -webkit-user-drag: none;
- -moz-user-select: none;
- -moz-user-drag: none;
+ .user-select(none);
+ .user-drag(none);
.transition(opacity .4s);
}
.invisible {
@@ -66,10 +63,8 @@ canvas {
}
#game_overlay {
pointer-events: none;
- -webkit-user-select: none;
- -moz-user-select: none;
- -webkit-user-drag: none;
- -moz-user-drag: none;
+ .user-select(none);
+ .user-drag(none);
z-index: 1000;
}
@@ -285,8 +280,7 @@ div.navigation .buttons {
-moz-animation-name: revealandslideOutter, fadePlusSlideUp;
-moz-animation-duration: 1.5s;
pointer-events: none;
- -webkit-user-select: none;
- -moz-user-select: none;
+ .user-select(none);
}
.quick-notif.flyout{
@@ -321,8 +315,7 @@ div.navigation .buttons {
.feedback_anim{
pointer-events: none;
- -webkit-user-select: none;
- -moz-user-select: none;
+ .user-select(none);
position: absolute;
top: 0;
left: 0;
@@ -370,8 +363,8 @@ body[data-level-treshold="4"] .feedback_anim{
.tuthilite{
pointer-events: none!important;
- -webkit-user-select: none;
- -webkit-user-drag:none;
+ .user-select(none);
+ .user-drag(none);
display: block;
outline: 3px solid rgba(100, 255, 100, 1.0);
background: rgba(100, 255, 100, .4);
@@ -381,8 +374,8 @@ body[data-level-treshold="4"] .feedback_anim{
.tutarrow{
pointer-events: none!important;
- -webkit-user-select: none;
- -webkit-user-drag:none;
+ .user-select(none);
+ .user-drag(none);
display: block;
width: 178px;
height: 177px;
@@ -393,8 +386,8 @@ body[data-level-treshold="4"] .feedback_anim{
background: url(../images/hud/hand.png) no-repeat;
background-size: contain;
pointer-events: none!important;
- -webkit-user-select: none;
- -webkit-user-drag:none;
+ .user-select(none);
+ .user-drag(none);
position: relative;
left: 0; top: 0;
margin: 0;
@@ -428,7 +421,7 @@ body[data-level-treshold="4"] .feedback_anim{
display: none;
pointer-events: none;
z-index: 80001;
- -webkit-user-select: none;
+ .user-select(none);
*{
pointer-events: auto;
}
@@ -491,10 +484,8 @@ body[data-level-treshold="4"] .feedback_anim{
top: 0; left: 0;
display: block;
opacity: 1;
- -webkit-user-select: none;
- -webkit-user-drag: none;
- -moz-user-select: none;
- -moz-user-drag: none;
+ .user-select(none);
+ .user-drag(none);
.transition(opacity .6s);
}
#enforce-modal, #uiblocker{
@@ -530,10 +521,8 @@ body[data-level-treshold="4"] .feedback_anim{
z-index: 100000;
opacity: 1;
pointer-events: auto;
- -webkit-user-select: none;
- -webkit-user-drag: none;
- -moz-user-select: none;
- -moz-user-drag: none;
+ .user-select(none);
+ .user-drag(none);
}
@-webkit-keyframes spin{
View
24 css/mix.less
@@ -21,3 +21,27 @@
-o-transition: @transition;
transition: @transition;
}
+
+.user-select(@mode) when (@mode = none) {
+ -webkit-touch-callout: none;
+ -moz-touch-callout: none;
+ -webkit-tap-higlight: none;
+ -moz-tap-higlight: none;
+ -webkit-tap-highlight-color: rgba(0,0,0,0);
+ -moz-tap-highlight-color: rgba(0,0,0,0);
+}
+
+.user-select(@mode) {
+ -webkit-user-select: @mode;
+ -moz-user-select: @mode;
+ -ms-user-select: @mode;
+ user-select: @mode;
+}
+
+.user-drag(@mode) {
+ -webkit-user-drag: @mode;
+ -moz-user-drag: @mode;
+ -ms-user-drag: @mode;
+ user-drag: @mode;
+}
+
View
16 css/shop.less
@@ -111,12 +111,8 @@
left: 30px; right: 30px;
overflow: hidden;
background: transparent;
- -webkit-tap-higlight: none;
- -webkit-user-select: none;
- -webkit-tap-highlight-color: rgba(0,0,0,0);
- -moz-tap-higlight: none;
- -moz-user-select: none;
- -moz-tap-highlight-color: rgba(0,0,0,0);
+ .user-select(none);
+ .user-drag(none);
}
hr {
border: none;
@@ -134,12 +130,8 @@
}
.department {
display: none;
- -webkit-tap-higlight: none;
- -webkit-user-select: none;
- -webkit-tap-highlight-color: rgba(0,0,0,0);
- -moz-tap-higlight: none;
- -moz-user-select: none;
- -moz-tap-highlight-color: rgba(0,0,0,0);
+ .user-select(none);
+ .user-drag(none);
.transform(translate3d(0, 0, 0));
&.active {
display: block;
Please sign in to comment.
Something went wrong with that request. Please try again.