WES - Sample WYSIWYG RPG Card Maker

Introduction

This is a small sample project by Wesley B for a potential employer.

It is intentionally limited in complexity, but maintains clarity and accessibility.

The service Glitch is used for hosting.

Developer Rules

• Use PEP-0350 codetags to prefix applicable comments.
• Use ITCSS organization for styles.
• Use BEM naming format for classnames.

Files & Directories

README.md

That’s this file, where you can tell people what your cool website does and how you built it.

index.html

The website content is an introduction, a form, and reference to the Glitch service.

style.css

The styles have ITCSS organization and BEM classnames.

script.js

The following interactivity of the site is provided with JavaScript:

• automatically-updating output
• card preview toggle

assets

Glitch allows dragging into assets (CDN-managed library) any relevant images, music , etc.

Known Issues

• Not using <fieldset> & <legend> sometimes, because of a Chrome CSS bug.
• Not using var() nor calc() generously, so prototype complexity is reduced.
• The “Preview Card” toggle needs tabindex="-1", because parent is positioned.
• Overloading the JavaScript-managed CSS class name for disabling the form.
• JavaScript, and maybe CSS, will break in IE browser (even v11, I believe).
• This application has not been tested in Edge browser.