Add MDC Component Sandbox

Contributor.md

@@ -15,3 +15,4 @@
 * [Shreya Punetha](https://github.com/shreyapuntha)
 * [Sahil Jamwal](https://github.com/sahiljamwal)
 * [Ganapathy Rama Subramanian](https://github.com/Gunsubramanian)
+* [Anhzf](https://github.com/anhzf)

JavaScript/MDC-Sandbox/.gitignore

@@ -0,0 +1 @@
+node_modules

JavaScript/MDC-Sandbox/dist/app.js.LICENSE.txt

@@ -0,0 +1,83 @@
+/*! *****************************************************************************
+Copyright (c) Microsoft Corporation.
+
+Permission to use, copy, modify, and/or distribute this software for any
+purpose with or without fee is hereby granted.
+
+THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
+REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
+AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
+INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
+LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
+OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
+PERFORMANCE OF THIS SOFTWARE.
+***************************************************************************** */
+
+/**
+ * @license
+ * Copyright 2016 Google Inc.
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy
+ * of this software and associated documentation files (the "Software"), to deal
+ * in the Software without restriction, including without limitation the rights
+ * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ * copies of the Software, and to permit persons to whom the Software is
+ * furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in
+ * all copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+ * THE SOFTWARE.
+ */
+
+/**
+ * @license
+ * Copyright 2018 Google Inc.
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy
+ * of this software and associated documentation files (the "Software"), to deal
+ * in the Software without restriction, including without limitation the rights
+ * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ * copies of the Software, and to permit persons to whom the Software is
+ * furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in
+ * all copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+ * THE SOFTWARE.
+ */
+
+/**
+ * @license
+ * Copyright 2019 Google Inc.
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy
+ * of this software and associated documentation files (the "Software"), to deal
+ * in the Software without restriction, including without limitation the rights
+ * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ * copies of the Software, and to permit persons to whom the Software is
+ * furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in
+ * all copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+ * THE SOFTWARE.
+ */

JavaScript/MDC-Sandbox/dist/index.html

@@ -0,0 +1 @@
+<!doctype html><html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width,initial-scale=1"><title>Material Web Components Sandbox</title><link href="https://fonts.googleapis.com/css2?family=Roboto:wght@100;300;400;500;700;900&display=swap" rel="stylesheet"><link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet"><link href="main.css" rel="stylesheet"></head><body><header><h1>Material Components Sandbox</h1></header><section><h2>Buttons</h2><article><button class="mdc-button mdc-button--touch"><div class="mdc-button__ripple"></div><span class="mdc-button__label">Text Button</span><div class="mdc-button__touch"></div></button> <button class="mdc-button mdc-button--touch"><div class="mdc-button__ripple"></div><i class="material-icons mdc-button__icon" aria-hidden="true">bookmark</i> <span class="mdc-button__label">Text Button plus icon</span></button> <button class="mdc-button mdc-button--touch" disabled="disabled"><div class="mdc-button__ripple"></div><span class="mdc-button__label">Disabled Text Button</span><div class="mdc-button__touch"></div></button> <button class="mdc-button mdc-button--touch mdc-button--outlined"><div class="mdc-button__ripple"></div><span class="mdc-button__label">Outlined Button</span></button> <button class="mdc-button mdc-button--touch mdc-button--outlined"><div class="mdc-button__ripple"></div><i class="material-icons mdc-button__icon" aria-hidden="true">bookmark</i> <span class="mdc-button__label">Outlined Button plus Icon</span></button> <button class="mdc-button mdc-button--touch mdc-button--outlined" disabled="disabled"><div class="mdc-button__ripple"></div><span class="mdc-button__label">DisabledOutlined Button</span></button> <button class="mdc-button mdc-button--touch mdc-button--unelevated"><div class="mdc-button__ripple"></div><span class="mdc-button__label">Unelevated Button</span></button> <button class="mdc-button mdc-button--touch mdc-button--unelevated"><div class="mdc-button__ripple"></div><i class="material-icons mdc-button__icon" aria-hidden="true">bookmark</i> <span class="mdc-button__label">Unelevated Button plus Icon</span></button> <button class="mdc-button mdc-button--touch mdc-button--unelevated" disabled="disabled"><div class="mdc-button__ripple"></div><span class="mdc-button__label">Disabled Unelevated Button</span></button> <button class="mdc-button mdc-button--touch mdc-button--raised"><div class="mdc-button__ripple"></div><span class="mdc-button__label">Contained Button</span></button> <button class="mdc-button mdc-button--touch mdc-button--raised"><div class="mdc-button__ripple"></div><i class="material-icons mdc-button__icon" aria-hidden="true">bookmark</i> <span class="mdc-button__label">Contained Button plus Icon</span></button> <button class="mdc-button mdc-button--touch mdc-button--raised" disabled="disabled"><div class="mdc-button__ripple"></div><span class="mdc-button__label">Disabled Contained Button</span></button></article></section><script src="app.js"></script></body></html>