my-eighties-computer

Renders a four 80s computer styled components to play with

Usage no npm install needed!

<script type="module">
  import myEightiesComputer from 'https://cdn.skypack.dev/my-eighties-computer';
</script>

README

my-eighties-computer

Renders four 80s computer styled components to play with...

My80sH1

My80sH1 is an 80's computer styled h1 element that takes a single prop, which is the text to be displayed.

Props

Name Type Default Description
text String An empty string The text to be displayed by the h1 element

My80sH1 Component

My80sPText

My80sPText is an 80's computer styled paragraph element that takes a single prop, which is the text to be displayed.

Props

Name Type Default Description
text String An empty string The text to be displayed by the paragraph text element

My80sPText Component

My80sAccCreateModal

My80sAccCreateModal is an 80's computer styled account creation modal that is comprised of 3 inputs (username, email, password), and a button. This component takes 2 props, one is the title text to be displayed at the top of the form, and the second is a callback function that will send the current controlled state of the form inputs back to a parent component for use.

Props

Name Type Default Description
text String An empty string The text to be displayed by the h1 element
onSubmit Function Console logs the current component's controlled state A callback function that will send the current controlled state of the form inputs back to a parent component for use

My80sAccCreateModal Component

My80sAccLoginModal

My80sAccLoginModal takes the same props as My80sAccCreateModal. The only difference is that instead of 3 form input fields, it only has 2: 'username', and 'password'; but doesn't include the email field.

Props

Name Type Default Description
text String An empty string The text to be displayed by the h1 element
onSubmit Function Console logs the current component's controlled state A callback function that will send the current controlled state of the form inputs back to a parent component for use

My80sAccLoginModal Component

NPM JavaScript Style Guide

Install

npm install --save my-eighties-computer

Usage

import React, { Component } from 'react'

import My80sAccCreateModal from 'my-eighties-computer'

class Example extends Component {
  render () {
    return (
      <My80sAccCreateModal 
        text='This is your badass 80s account creation modal' 
        onSubmit={content => yourCallbackFunction(content) 
      />
    )
  }
}

License

MIT © baldm0mma