docs: add codesandbox link (#392)

SAP · May 15, 2019 · 7c3c453 · 7c3c453
1 parent 49d71af
commit 7c3c453
Show file tree

Hide file tree

Showing 2 changed files with 17 additions and 1 deletion.
diff --git a/packages/playground/webapp/css/index.css b/packages/playground/webapp/css/index.css
@@ -95,6 +95,19 @@ body {
     transition: all 0.5s ease-out;
 }
 
+.coding-button {
+	width: 20.75rem;
+	background: #fff;
+	color: #242424;
+	margin-right: 0.7rem;
+}
+
+.coding-button:hover {
+	background-color: #dbdbdb;
+    border-color: #dbdbdb;
+    transition: all 0.5s ease-out;
+}
+
 .secondary-button {
 	width: 11.44rem;
 	background: transparent;

diff --git a/packages/playground/webapp/index.html b/packages/playground/webapp/index.html
@@ -71,7 +71,10 @@ <h2>Test the UI5 Web Components</h2>
 <ui5-datepicker></ui5-datepicker>
                         </xmp></pre>
                     </div>
-                    <a href="./playground/" target="_blank" class="custom-button main-button">Get Started</a>
+                    <a href="./playground/" target="_blank" class="custom-button coding-button">Get Started</a>
+                    <a href="https://codesandbox.io/s/71r1x5o51q?fontsize=14&module=%2Findex.html"target="_blank" class="custom-button coding-button">
+                        Start coding in your browser (CodeSandbox)
+                    </a>
                 </div>
             </section>