X-Git-Url: https://jasonwoof.com/gitweb/?p=hexbog.git;a=blobdiff_plain;f=style.less;h=59ee961bcc4be0bfe73ffe0cc588652682d84512;hp=ee67ce3dbd2c1d9fab225e85a6eea5a2f0457860;hb=fff2ed1a0a156da47c7fa1e9760c8546b9af44fe;hpb=97198e4668d0a8f64c5f5f345bd8f53af4c204d2 diff --git a/style.less b/style.less index ee67ce3..59ee961 100644 --- a/style.less +++ b/style.less @@ -139,7 +139,7 @@ body { font-size: 30px; display: block; position: absolute; - border-radius: 13px; + border-radius: 16px; text-align: center; cursor: pointer; user-select: none; @@ -147,51 +147,62 @@ body { -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; + box-shadow: 3px 3px 2px #aaa; } &.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%); + box-shadow: 2px 2px 1.8px #aaa; } &.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%); + box-shadow: 2px 2px 1.6px #aaa; } &.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%); + box-shadow: 2px 2px 1.4px #bbb; } &.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%); + box-shadow: 1px 1px 1.1px #ddd; } &.hp1 { color: lighten(#000, 36%); - background-color: spin(lighten(desaturate(@tile-color, 70%), 9%), 100); + background-color: spin(lighten(saturate(@tile-color, 30%), 5%), 100); + box-shadow: 1px 1px 1px #ddd; } &.hp0 { + cursor: default; color: lighten(desaturate(@tile-color, 100%), 10%); background-color: lighten(desaturate(@tile-color, 100%), 10%); + box-shadow: inset 1px 1px 1px #aaa; } &.selected, &.selected_word {