word/memory: manual grid size override option

[sheet.git] / word / memory.plp

diff --git a/word/memory.plp b/word/memory.plp
index 26a7cd4e04330feae707c0b84b53b5e5c0032e2d..11520b19b483d3a6860742e62b6ca151db83b39f 100644 (file)
--- a/word/memory.plp
+++ b/word/memory.plp
@@ -64,17 +64,24 @@ figure.good {
 }
 
 .good figure {
-       animation: celebration 5s linear infinite;
+       animation: celebration 7s linear infinite;
        background: none;
        border: 0;
+       opacity: 1;
 }
 @keyframes celebration {
        0% { filter: hue-rotate(0deg); transform: rotate(0deg) }
-       50% { filter: hue-rotate(180deg); transform: rotate(180deg) }
+       33% { filter: hue-rotate(180deg); transform: rotate(180deg) }
+       66% { filter: hue-rotate(360deg); transform: rotate(360deg) }
        100% { filter: hue-rotate(360deg); transform: rotate(360deg) }
 }
 </style>
 EOT
 });
+if (my $gridsize = $get{grid}) {
+       printf "<style>#quiz {grid: repeat(%d, 1fr) / repeat(%d, 1fr)}</style>",
+               reverse split /\D+/, $gridsize;
+       say '';
+}
 say '<h1>memory</h1><p id="quiz"></p>';
 say "<script>new WordMemory('/$wordlistbase.json')</script>";