vtm/source/manifestation/web/game.scss

/*
 * Verrückte Turing-Maschinen — A turing complete game
 * Copyright (C) 2016-2018 kcf <vidofnir@folksprak.org>
 * 
 * This program is free software: you can redistribute it and/or modify
 * it under the terms of the GNU General Public License as published by
 * the Free Software Foundation, either version 3 of the License, or
 * (at your option) any later version.
 * 
 * This program is distributed in the hope that it will be useful,
 * but WITHOUT ANY WARRANTY; without even the implied warranty of
 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
 * GNU General Public License for more details.
 * 
 * You should have received a copy of the GNU General Public License
 * along with this program.  If not, see <https://www.gnu.org/licenses/>.
 */

$phi: 0.6180339887498949;
// $sigma: $phi;
$sigma: 0.25;

$offset: 0.0;
$hue_symbol_0: (((($sigma*0)+$offset)%1)*360);
$hue_symbol_1: (((($sigma*1)+$offset)%1)*360);
$hue_symbol_2: (((($sigma*2)+$offset)%1)*360);
$hue_symbol_3: (((($sigma*3)+$offset)%1)*360);


$saturation_symbol: 75%;
$lightness_symbol: 50%;

@keyframes spin
	{
		from
			{
				transform: rotate(0deg);
			}
		to
			{
				transform: rotate(360deg);
			}
	}

.frame
	{
		stroke: none;
		fill: hsl(  0,  0%, 25%);
	}

.frame:hover
	{
		/*
		fill: hsl(  0,  0%, 37.5%);
		transition: 0.25s ease;
		 */
	}

.stone
	{
		/*
		stroke-width: 0.05;
		stroke: hsl(  0,  0%, 0%);
		 */
		stroke: none;
		fill: hsl(  0,  0%, 0%);
	}

.arrow
	{
		stroke: none;
	}

.generator
	{
		fill: hsl(  0,  0%, 100%);
	}

.neutral
	{
		fill: hsl(  0,  0%, 50%);
	}

.symbol_0
	{
		fill: hsl($hue_symbol_0, $saturation_symbol, $lightness_symbol);
		background-color: hsl($hue_symbol_0, $saturation_symbol, $lightness_symbol);
	}

.symbol_1
	{
		fill: hsl($hue_symbol_1, $saturation_symbol, $lightness_symbol);
		background-color: hsl($hue_symbol_1, $saturation_symbol, $lightness_symbol);
	}

.symbol_2
	{
		fill: hsl($hue_symbol_2, $saturation_symbol, $lightness_symbol);
		background-color: hsl($hue_symbol_2, $saturation_symbol, $lightness_symbol);
	}

.symbol_3
	{
		fill: hsl($hue_symbol_3, $saturation_symbol, $lightness_symbol);
		background-color: hsl($hue_symbol_3, $saturation_symbol, $lightness_symbol);
	}

.circle
	{
		stroke: none;
	}

.positive
	{
		fill: hsl(  0,  0%, 100%);
	}

.negative
	{
		/*
		fill: hsl(  0,  0%,  0%);
		 */
		display: none;
	}

.entry
	{
		stroke: black;
		stroke-width: 0.01;
		/*
		stroke: none;
		 */
		
		animation-name: spin;
		animation-duration: 4s;
		animation-timing-function: linear;
		animation-iteration-count: infinite;
	}