diff --git a/app/assets/styles/intro.css b/app/assets/styles/intro.css index 5333454..046bf69 100644 --- a/app/assets/styles/intro.css +++ b/app/assets/styles/intro.css @@ -16,9 +16,21 @@ body { transform-origin: right; animation: colorChange 5s linear infinite; animation: fadeaway 30s forwards; - left: calc(50%); transform: translateX(-50%); } +.glowing.lt { + left: 0%; + transform: rotate(-15deg); + top: -15%; +} +.glowing.ct { + left: 50%; +} +.glowing.rt { + left: 50%; + transform: rotate(15deg) +} + .glowing:nth-child(even) { transform-origin: left; @@ -98,7 +110,7 @@ body { 0% { transform: rotate(calc(180deg * var(--i))); scale:20%;} 25% { transform: rotate(calc(90deg * var(--i))); scale:100%;} 50% { transform: rotate(calc(0deg * var(--i))); scale:80%;} - 100% { transform: rotate(calc(360deg * var(--i))); scale:50%;} + 100% { transform: rotate(calc(360deg * var(--i))); scale:10%;} } @@ -106,7 +118,7 @@ body { 0% { transform: rotate(calc(135deg * var(--i))); scale:20%;} 25% { transform: rotate(calc(45deg * var(--i))); scale:100%;} 50% { transform: rotate(calc(-45deg * var(--i))); scale:80%;} - 100% { transform: rotate(calc(315deg * var(--i))); scale:50%;} + 100% { transform: rotate(calc(315deg * var(--i))); scale:10%;} } diff --git a/app/views/editors/KeyframeView.html b/app/views/editors/KeyframeView.html index f93d595..74a193a 100644 --- a/app/views/editors/KeyframeView.html +++ b/app/views/editors/KeyframeView.html @@ -12,11 +12,21 @@ .kf-editor article.agent-preview header { padding:0; } .kf-editor canvas[data-output="agentSampleCanvas"]{ width:100%; aspect-ratio: 1 / 1;} .kf-editor canvas[data-output="kfArenaCanvas"]{ width:100%; height:100%; } - .kf-editor article.agent-preview section, .kf-editor article.agent-properties section{ + .kf-editor article.agent-preview section{ display: grid; - grid-template-rows: 2em auto 2em; - height: 100%; + grid-template-rows: 2em auto; + overflow: visible; } + .kf-editor article.agent-properties section{ + display: grid; + grid-template-rows: 2em auto; + overflow: visible; + height:100%; + } + .kf-editor article.agent-preview section.selector{ padding: 0.5em .5em 1.5em .5em; } + .kf-editor article.agent-preview section.browser{ padding:0; } + .kf-editor article.agent-preview section.browser header { border-top: 1px solid #473; border-bottom: 1px solid #473;} + .kf-editor article.agent-preview section.browser header h1{ text-align: center; margin-top: .3em;} .kf-editor article.kfArena section{ padding: 0; height: 100%; @@ -35,7 +45,8 @@ padding: 0 0 0 0; min-height: 1.2em; } - .kf-editor article.agent-properties section div.kf-actions button{ + .kf-editor article.agent-properties section.kf-actions { border-top: 1px solid #473; padding: 3px 5px 3px 5px; height:3em;} + .kf-editor article.agent-properties section.kf-actions button{ color: #DDD; padding: 0 0 0 0; min-height: 2em; @@ -51,11 +62,11 @@
-
-
- -
-
+
+ +
+
+

Keyframes browser

@@ -71,10 +82,10 @@
-
- - -
+ +
+ +
diff --git a/index.html b/index.html index f91cb4d..e308243 100644 --- a/index.html +++ b/index.html @@ -9,17 +9,17 @@ -
+
-
+
-
+