@penn-libraries/web
TypeScript icon, indicating that this package has built-in type declarations

0.1.2 • Public • Published

@penn-libraries/web

Reusable web designs for University of Pennsylvania Libraries websites. This repo contains our code for shared Web Components and Cascading Style Sheets (CSS).

Get started

You can start using the components immediately by adding these tags to the <head>:

<link href="https://cdn.jsdelivr.net/npm/@penn-libraries/web/dist/web/web.css" rel="stylesheet"/>
<script type="module" src="https://cdn.jsdelivr.net/npm/@penn-libraries/web/dist/web/web.esm.js"></script>

Once included, components can be used in your markup like any other regular HTML elements:

HTML

<pennlibs-header service-name="<service name>" service-lede="<service lede>">
  <a href="/#">About</a>
  <a href="/help">Help</a>
</pennlibs-header>

What's a web component?

Web components are evolving web platform technologies. They allow us to create custom reusable HTML elements that use standard web technologies (HTML, CSS, and JavaScript). We use the term “web component” for both the platform and the custom element we’ve created. The end result is a custom element that you can drop into your websites and applications with no additional coding or styling required.

Development

To start building a new web component using Stencil, clone this repo to a new directory and run:

npm install

To start the local development server

npm start

What's Stencil?

Stencil is a compiler for building fast web apps using Web Components. Stencil components are just Web Components, so they work in any major framework or with no framework at all.

Readme

Keywords

none

Package Sidebar

Install

npm i @penn-libraries/web

Weekly Downloads

133

Version

0.1.2

License

MIT

Unpacked Size

2.14 MB

Total Files

88

Last publish

Collaborators

  • librarylts