diff options
Diffstat (limited to 'playgrounds')
| -rw-r--r-- | playgrounds/playground.css | 5 | ||||
| -rw-r--r-- | playgrounds/transforms/transforms.html | 9 |
2 files changed, 9 insertions, 5 deletions
diff --git a/playgrounds/playground.css b/playgrounds/playground.css index 71fabed..f327905 100644 --- a/playgrounds/playground.css +++ b/playgrounds/playground.css @@ -4,8 +4,7 @@ } html { - background-color : #f5f6f7; - /* text-align: center; */ + background-color : #fefefe; } body { @@ -45,7 +44,7 @@ svg { width: 100%; grid-row: 3; grid-column: 2/4; - background-color: white; + background-color: #f5f6f7; border-radius: 20px; border: #f065 1px solid; } diff --git a/playgrounds/transforms/transforms.html b/playgrounds/transforms/transforms.html index ac60f14..89dc419 100644 --- a/playgrounds/transforms/transforms.html +++ b/playgrounds/transforms/transforms.html @@ -10,9 +10,14 @@ <body> - <h1>SVG JS Playground</h1> + <h1>Transformations</h1> - <svg viewBox="-200 -200 400 400"> + <p> + Here you can try out our transformation code, try moving around the pink + box in your console with its variable name: <code>mover</code> + </p> + + <svg viewBox="0 0 1500 1500"> <rect id="old" x=200 y=400 width=200 height=400 class="green"/> <rect id="new" x=200 y=400 width=200 height=400 class="pink"/> |