parsav  Diff

Differences From Artifact [cb730b53e2]:

To Artifact [70dd348543]:


   969    969   	margin: 0.3em 0;
   970    970   	details & { border: none; background: none; }
   971    971   	> input[type="radio"], > input[type="checkbox"] {
   972    972   		display: none;
   973    973   		&+label {
   974    974   			display: block;
   975    975   			flex-grow: 1;
   976         -			padding: 0.08in 0.05in;
          976  +			padding: 0.06in 0.05in;
   977    977   			margin: 0.03in;
   978         -			flex-basis: 15%;
   979    978   			cursor: pointer;
   980    979   			transition: 0.3s;
   981    980   			text-align: center;
   982    981   			border: 1px solid transparent;
   983         -			text-shadow: 1px 1px black;
          982  +			border-radius: 4px;
   984    983   			color: otone(15%);
   985         -			border-radius: 4px;
          984  +			text-shadow: 1px 1px black,
          985  +			// transition hints
          986  +				-0.04ex 0 transparent, 0.04ex 0 transparent,
          987  +				calc(-0.04ex + 1px) 1px transparent,
          988  +				calc(0.04ex + 1px) 1px transparent;
          989  +
   986    990   			&:nth-child(7n+1) { --co: -10 } //silly hack
   987    991   			&:nth-child(7n+2) { --co: -35 }
   988    992   			&:nth-child(7n+3) { --co: -20 }
   989    993   			&:nth-child(7n+4) { --co: -50 }
   990    994   			&:nth-child(7n+5) { --co: -40 }
   991    995   			&:nth-child(7n+6) { --co: -5  }
   992    996   			&:nth-child(7n+7) { --co: -25 }
................................................................................
  1000   1004   			border-bottom: 1px solid otone(-50%);
  1001   1005   			background: linear-gradient(to bottom, otone(-25%,-0.2), otone(-28%,-0.3) 35%, otone(-30%,-0.5));
  1002   1006   			color: white;
  1003   1007   			box-shadow: 0 0 0 1px tone(-60%);
  1004   1008   			&:hover {
  1005   1009   				border-top: 1px solid otone(10%);
  1006   1010   				border-bottom: 1px solid otone(-60%);
  1007         -				font-weight: bold;
         1011  +				text-shadow: -0.04ex 0 white, 0.04ex 0 white,
         1012  +					calc(-0.04ex + 1px) 1px black,
         1013  +					calc(0.04ex + 1px) 1px black; // fake bold
         1014  +				//font-weight: bold;
  1008   1015   			}
  1009   1016   		}
  1010   1017   	}
  1011   1018   }
  1012   1019   
  1013   1020   details {
  1014   1021   	//border: 1px solid tone(-60%);