Shadow Effect for Gears

[paramesis]

It bothered me how flat the gears look, to the point that I had some trouble understanding the game board, so I came up with some CSS that will add a drop shadow effect and make the board a little clearer.



Here is the CSS. If you would like your board to look like the one on the right, you can paste the code below into the custom CSS section under Preferences > Advanced

Code: Select all

#tzolkin-interface .gear_wrap {
--shadow-dist:1px;
--shadow-blur:2px;
--shadow-color:#000000aa;
filter:drop-shadow(var(--shadow-dist)var(--shadow-dist)var(--shadow-blur)var(--shadow-color));
}

A note on the code: It would normally be possible and more elegant to write this as a single line without variables, but BGA trims white space in a way that breaks some code. "filter:drop-shadow(1px 1px 1px #000000aa);" becomes "filter:drop-shadow(1px1px1px#000000aa);" which fails. Is there some other symbol that can be used to separate parameters in CSS besides white space?

[bananasplay]

Here is the CSS. If you would like your board to look like the one on the right, you can paste the code below into the custom CSS section under Preferences > Advanced

Code: Select all

#tzolkin-interface .gear_wrap {
--shadow-dist:1px;
--shadow-blur:2px;
--shadow-color:#000000aa;
filter:drop-shadow(var(--shadow-dist)var(--shadow-dist)var(--shadow-blur)var(--shadow-color));
}

Thanks for taking the time to share this. It's a subtle change that actually has a nice effect. Appreciated!

[Een]

Indeed that's really a nice improvement. I added this css to the project and deployed a new version. Thanks!

[ggcp]

With this new version, the game has become very difficult to play on my computer.
Every move lasts at least 3 seconds before something happens, it's very difficult during the corn/resources exchange...
(before yesterday, no problem playing this game)

[Een]

With this new version, the game has become very difficult to play on my computer.
Every move lasts at least 3 seconds before something happens, it's very difficult during the corn/resources exchange...
(before yesterday, no problem playing this game)

This is just a styling effect that should not impact the game in any way.
Or maybe you play on a very old computer/browser?

[ggcp]

I guess my computer/browser is old, but it's a pity that a simple css rule destroys the playability of the game.
Is there a "reverse" css rule that I can add in the Preferences -> Advanced section to go back to the old version ?
Thank you in advance.

[Een]

I guess my computer/browser is old, but it's a pity that a simple css rule destroys the playability of the game.
Is there a "reverse" css rule that I can add in the Preferences -> Advanced section to go back to the old version ?
Thank you in advance.

You should be able to use this to disable the filter:

Code: Select all

#tzolkin-interface .gear_wrap {
filter:none;
}

[ggcp]

thanks a lot !

[dencho]

Bonjour, hi,

I also noticed that the game is way way (10 maybe more times) slower since the update. I have a recent laptop with the latest version of OSX and Safari.
I even though there was some additional bug, but now I understand it is a 'shadow effect'.

Any idea what is causing that and how I can fix it ?

Many thanks !

[Een]

We indeed have had reports of Safari being slow with some css/graphics upgrades.
Could you try another browser on your computer and let us know if this is indeed specific to Safari?