Skip to main content
100%

probando los componentes de material

✓ Published0🌍 Public
Aaaizemberg
Last edited May 27, 2020
Created on May 27, 2020

This example demonstrates the use of Material Design Components (MDC) in a simple HTML page. It displays a filled text input field and a button, both styled with the material-components-web CSS and JavaScript libraries. The code initializes the components via `window.mdc.autoInit()`, which automatically upgrades elements marked with `data-mdc-auto-init`. The page relies on the Google Material Icons font and the MDC ripple effect for the button, but performs no data processing or dynamic rendering.

AI-generated description

Similar vizzes

Loading thumbnail…

React App

This example displays a minimal React interface with a text input, a submit button, and a copyright footer. It uses React state via `useState` to manage an input value and an array of submitted items, updating the list on button click. The code imports danfojs (as `dfd`) and Material-UI components, including `Typography`, `Link`, and `Container`, though the layout renders a static `Box` with text and a Material-UI footer. The app mounts through `ReactDOM.render` in `index.js`, referencing bundled scripts from React, ReactDOM, danfojs, and Material-UI.

Kkennethkamhw
61% match
Loading thumbnail…

MK HTML Starter

This example demonstrates a minimal HTML page that renders a static heading, “Hello HTML MK,” using basic CSS and JavaScript. It serves as a bare-bones template for getting started with web visualization projects. The page consists of a simple `index.html` file with a single `<h1>` element and no interactive features or data. It relies on native HTML and CSS only, with no external libraries or frameworks, making it an accessible foundation for learning or prototyping in the browser.

Mmenachemkatz1
59% match
Loading thumbnail…

Info_Design_210414_Basic

This example demonstrates a minimal web page that introduces fundamental web technologies: HTML for structure, CSS for presentation, and JavaScript for interactivity. The page displays a heading and a greeting, while the embedded script performs simple arithmetic and logs messages to the browser console. A separate external JavaScript file triggers an alert dialog on load. The code uses native HTML elements, a linked stylesheet (`Style.css`), and inline scripting, with no external libraries or frameworks. The primary rendering approach is the standard document flow within the browser.

RRoh-2040
59% match
Loading thumbnail…

CSS Colors from Mozilla

This example shows a simple React app that renders two text elements: a large "Hello React!" message and a smaller "...with CSS" line in rebeccapurple, based on the CSS Colors from Mozilla documentation. The main component uses JSX within a `<g>` element, though the code does not employ SVG-specific behavior. Styling is handled entirely through an external stylesheet (`index.css`), which sets font sizes and text alignment, while the React DOM library mounts the component to the `#root` div. The page loads React and ReactDOM from a CDN, and the bundled script runs client-side.

DDavid Allyn
59% match
Loading thumbnail…

HTML Starter

This example shows a minimal HTML page displaying a single button labeled “hello” at a large font size. The page imports Bootstrap 4 CSS for styling and uses a border class to outline the button, while custom inline CSS centers the content. The rendering approach is straightforward static HTML without any JavaScript interactions or data visualization, serving as a bare-bones starter template for web development projects.

Rrichad97
59% match
Loading thumbnail…

Fork of HTML Starter

This example demonstrates a static HTML page with two clickable buttons, each styled differently. The first button uses inline CSS with a red text color and blue background, while the second remains unstyled. The code relies on native HTML elements and inline style attributes, with no JavaScript or external libraries involved. It serves as a minimal starting point for testing basic web page structure and button interactivity.

JjanoPig
59% match
Loading thumbnail…

HTML Starter

This example demonstrates a minimal web page that displays the text “Funciona perfectamente” centered in the browser with large, default styling. It uses a simple HTML document with an embedded CSS rule to set the text alignment and font size, and a JavaScript snippet that logs “Hello JavaScript!” to the console. The page serves as a bare-bones starter template, showing the fundamental structure of an HTML file within a React framework context.

Aalberto-salgado
59% match
Loading thumbnail…

Hello D3 Starter

This example displays a static webpage with the message “Hello HTML!” centered and styled with large text. It serves as a minimal starter template, showing the foundational structure of an HTML page that integrates CSS for styling and JavaScript for potential interactivity. The code uses plain HTML elements, a `<style>` block for CSS rules, and an empty `index.js` file. No data visualization is present; it only demonstrates the basic layout and styling approach for beginning a project.

MMabelbao
59% match