diff --git a/src/components/stage/stage.css b/src/components/stage/stage.css index 97f7e1ebf0b395a853e6e5e382fc55dc12123d80..7e0a59c2e786842feb556423fc0d4c08ffec81f2 100644 --- a/src/components/stage/stage.css +++ b/src/components/stage/stage.css @@ -141,16 +141,36 @@ to adjust for the border using a different method */ animation-fill-mode: forwards; /* Leave at 0 opacity after animation */ } -.green-flag-overlay { - width: 100%; - height: 100%; +.green-flag-overlay-wrapper { display: flex; justify-content: center; align-items: center; + background: rgba(0,0,0,0.25); + border-radius: 0.5rem; +} + +.green-flag-overlay { + padding: 1rem; + border-radius: 100%; + background: rgba(255,255,255,0.75); + border: 3px solid $ui-white; pointer-events: all; cursor: pointer; + display: flex; + justify-content: center; + align-items: center; + box-sizing: border-box; + width: 5rem; + height: 5rem; +} + +.green-flag-overlay > img { + width: 100%; + object-fit: contain; } + + @keyframes flash { 0% { opacity: 1; } 100% { opacity: 0; }