Wesley Smits WesleySmits

## accessible-accordion-accordion.js
import { getAbsoluteHeight } from './utils.js';

class Curtain extends HTMLDetailsElement {
    #summary = this.querySelector('summary');

    #content = this.querySelector('.curtain__content');

    #animation = null;

    connectedCallback() {

## web-component-polyfill.html
<script src="//unpkg.com/@ungap/custom-elements/es.js"></script>

## accessible-accordion-basic-accordion-styling.css
details {
	--curtain-border-color: #334455;
	--curtain-background-color: #223344;
	--curtain-color: #ffffff;

	max-width: 30rem;
	border: 1px solid var(--curtain-border-color);
	color: var(--curtain-color);
  	overflow: hidden;
}

## accessible-accordion-basic-styles.css
body {
    background: #001122;
}

p {
    margin: 1rem 0;
}

p:first-child {
    margin-top: 0;

## run-np.bash
np

## install-np.bash
npm install np -g

## npm-publish.bash
npm publish

## create-readme.bash
touch readme.md

## index.js
function sum(num1, num2) {
    return num1 + num2;
}
module.exports = sum;

## clone-project.bash
cd projects
git clone git@github.com:YourUserName/ws-my-first-package.git
cd ws-my-first-package
npm init
	import { getAbsoluteHeight } from './utils.js';

	class Curtain extends HTMLDetailsElement {
	#summary = this.querySelector('summary');

	#content = this.querySelector('.curtain__content');

	#animation = null;

	connectedCallback() {
	details {
	--curtain-border-color: #334455;
	--curtain-background-color: #223344;
	--curtain-color: #ffffff;

	max-width: 30rem;
	border: 1px solid var(--curtain-border-color);
	color: var(--curtain-color);
	overflow: hidden;
	}
	body {
	background: #001122;
	}

	p {
	margin: 1rem 0;
	}

	p:first-child {
	margin-top: 0;
	function sum(num1, num2) {
	return num1 + num2;
	}
	module.exports = sum;
	cd projects
	git clone git@github.com:YourUserName/ws-my-first-package.git
	cd ws-my-first-package
	npm init