Got questions, comments, patches, etc.?
Contact Jason Woofenden
gitweb
/
hexbog.git
/ commitdiff
commit
grep
author
committer
pickaxe
?
search:
re
summary
|
shortlog
|
log
|
commit
| commitdiff |
tree
raw
|
patch
|
inline
| side by side (parent:
e099c36
)
tweak tile: shadows, corners and hp0 color
author
Jason Woofenden
<jason@jasonwoof.com>
Mon, 25 Nov 2013 12:07:50 +0000
(07:07 -0500)
committer
Jason Woofenden
<jason@jasonwoof.com>
Mon, 25 Nov 2013 12:07:50 +0000
(07:07 -0500)
style.less
patch
|
blob
|
history
diff --git
a/style.less
b/style.less
index
9ab060d
..
59ee961
100644
(file)
--- a/
style.less
+++ b/
style.less
@@
-139,7
+139,7
@@
body {
font-size: 30px;
display: block;
position: absolute;
font-size: 30px;
display: block;
position: absolute;
- border-radius: 15px;
+ border-radius: 16px;
text-align: center;
cursor: pointer;
user-select: none;
text-align: center;
cursor: pointer;
user-select: none;
@@
-147,48
+147,56
@@
body {
-o-user-select: none;
-moz-user-select: -moz-none;
-webkit-user-select: none;
-o-user-select: none;
-moz-user-select: -moz-none;
-webkit-user-select: none;
- box-shadow: 1px 1px 2px #666;
&.hp10 {
color: #000;
background-color: @tile-color;
&.hp10 {
color: #000;
background-color: @tile-color;
+ box-shadow: 3px 3px 2px #aaa;
}
&.hp9 {
color: lighten(#000, 4%);
background-color: lighten(desaturate(@tile-color, 10%), 1%);
}
&.hp9 {
color: lighten(#000, 4%);
background-color: lighten(desaturate(@tile-color, 10%), 1%);
+ box-shadow: 3px 3px 1.9px #aaa;
}
&.hp8 {
color: lighten(#000, 8%);
background-color: lighten(desaturate(@tile-color, 20%), 2%);
}
&.hp8 {
color: lighten(#000, 8%);
background-color: lighten(desaturate(@tile-color, 20%), 2%);
+ box-shadow: 2px 2px 1.8px #aaa;
}
&.hp7 {
color: lighten(#000, 12%);
background-color: lighten(desaturate(@tile-color, 30%), 3%);
}
&.hp7 {
color: lighten(#000, 12%);
background-color: lighten(desaturate(@tile-color, 30%), 3%);
+ box-shadow: 2px 2px 1.7px #aaa;
}
&.hp6 {
color: lighten(#000, 16%);
background-color: lighten(desaturate(@tile-color, 40%), 4%);
}
&.hp6 {
color: lighten(#000, 16%);
background-color: lighten(desaturate(@tile-color, 40%), 4%);
+ box-shadow: 2px 2px 1.6px #aaa;
}
&.hp5 {
color: lighten(#000, 20%);
background-color: lighten(desaturate(@tile-color, 50%), 5%);
}
&.hp5 {
color: lighten(#000, 20%);
background-color: lighten(desaturate(@tile-color, 50%), 5%);
+ box-shadow: 2px 2px 1.5px #bbb;
}
&.hp4 {
color: lighten(#000, 24%);
background-color: lighten(desaturate(@tile-color, 60%), 6%);
}
&.hp4 {
color: lighten(#000, 24%);
background-color: lighten(desaturate(@tile-color, 60%), 6%);
+ box-shadow: 2px 2px 1.4px #bbb;
}
&.hp3 {
color: lighten(#000, 28%);
background-color: lighten(desaturate(@tile-color, 70%), 7%);
}
&.hp3 {
color: lighten(#000, 28%);
background-color: lighten(desaturate(@tile-color, 70%), 7%);
+ box-shadow: 2px 2px 1.3px #ccc;
}
&.hp2 {
color: lighten(#000, 32%);
background-color: lighten(desaturate(@tile-color, 80%), 8%);
}
&.hp2 {
color: lighten(#000, 32%);
background-color: lighten(desaturate(@tile-color, 80%), 8%);
+ box-shadow: 1px 1px 1.1px #ddd;
}
&.hp1 {
color: lighten(#000, 36%);
}
&.hp1 {
color: lighten(#000, 36%);
- background-color: spin(lighten(desaturate(@tile-color, 70%), 9%), 100);
- box-shadow: 1px 1px 1px #aaa;
+ background-color: spin(lighten(saturate(@tile-color, 30%), 5%), 100);
+ box-shadow: 1px 1px 1px #ddd;
}
&.hp0 {
cursor: default;
}
&.hp0 {
cursor: default;