npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

@universityofwarwick/id7

v2.9.11

Published

![Build status](https://github.com/UniversityofWarwick/id7/workflows/Node%20CI/badge.svg)

Downloads

226

Vulnerabilities

Powered byPowered by Snyk
  • 0High
  • 0Medium
  • 0Low

Links

Git

Maintainers

flamingelkflamingelklk9100lk9100nickhowesnickhoweswarwick-glasseswarwick-glasseswarwick-goateewarwick-goatee

Keywords

Readme

ID7

Build status

ID7 is the 7th iteration of the University of Warwick corporate identity. This library provides CSS, JavaScript and sample HTML in order to use the corporate identity on your site.

ID7 is available under an OSS license so that the open-source community can benefit from the various UI components and JavaScript functionality we have implemented.

Table of contents

Quick start

Three quick start options are available:

Read the Getting started page for information on the framework contents, templates and examples, and more.

What's included

Within the download you'll find the following directories and files, logically grouping common assets and providing both compiled and minified variations. You'll see something like this:

id7/
├── css/
│   ├── id7.css
│   ├── id7-default-theme.css
│   └── id7-wide.css
├── js/
│   ├── id7-bundle.js
│   └── id7-bundle.js.map
├── images/
│   ├── logo.png
│   ├── masthead-logo-bleed-sm.svg
│   ├── masthead-logo-bleed-sm.png
│   ├── masthead-logo-bleed-xs.svg
│   ├── masthead-logo-bleed-xs.png
│   └── (and others)
├── fonts/
│   └── (font files)
└── templates/
    └── base.html

As of v2.0.0, we only provide compiled and minified CSS and JS. See upgrading from 1.x to 2.x for more information.

JS source maps (id7*.map) are available for use with certain browsers' developer tools. The FontAwesome 5 free icon font is included, as is an optional ID7 theme.

The id7-bundle.js file includes dependencies such as jQuery and Bootstrap. These dependencies are:

Icons

Icons are provided by the Font Awesome 5 library. Because our license prevents distribution, this project by default includes Font Awesome 5 Free, which has a good selection of icons built in. If you are a Creator with a license and want to build ID7 with Font Awesome 5 Pro, first set up NPM with the token, then install the @fortawesome/fontawesome-pro package, and then instead of importing id7, import id7-no-fa and font-awesome-pro under the same path.

We don't include the FA4 compatibility layer by default. It can be imported within LESS with:

@import '@fortawesome/fontawesome-free/less/v4-shims';

Replacing fontawesome-free with fontawesome-pro if necessary.

Bugs and feature requests

Have a bug or a feature request? Contact [email protected].

Contributing

See CONTRIBUTING.md.

Documentation / Demo

Documentation, included in this repo in the root directory, is built with Jekyll and publicly hosted by Netlify at http://id7.warwick.ac.uk. The docs may also be run locally.

Running sample site locally

  1. Install Ruby and run gem install bundler.
  2. Install node.js.
  3. In the root /id7 directory:
    1. Run bundle install to install dependent gems.
    2. Run npm ci to install webpack and other node.js dependencies.
    3. Run npm run dev (or npm run watch) to build a copy of static assets.
    4. Run npm run start in the command line.
  4. Open http://localhost:8080 in your browser, et voilà.

Learn more about using Jekyll by reading its documentation.

Upgrading from 1.x to 2.x

From version 2.0.0, ID7 is built with webpack and a slightly different set of resources are delivered with the bundles. In your application you will need to do the following:

  • Replace references to id7.min.css with id7.css
  • Replace references to id7-default-theme.min.css with id7-default-theme.css
  • Replace references to id7-bundle.min.js with id7-bundle.js
  • id7-standalone.js was removed from the distribution; you should build your own bundle if you are using this

Using ID7.1

From version 2.9.7 onwards, you can apply the new "ID7.1" styling to the site masthead in your app. To do so:

  • Add the id7-point-1 class to the <body> element in your templates
  • Replace the logo image logo.png with logo.svg in your templates
  • Update anything app-specific that needs updating - the whole masthead region should have a white background

Breaking changes

  • 1.2.0 - Now uses a custom Modernizr build (see What's included above) with a minimal range of tests. If your application relies on other tests or shims which were included in previous versions, they will likely fail.
  • 1.4.0 - Support for Internet Explorer 8 was removed, and a reduced range of Modernizr tests is used as a result.
  • 1.6.0 - Font Awesome v5 is now used by default instead of v4. Icon identifier references may need to be updated, or the shim included.
  • 2.0.0 - Now built with Webpack instead of Grunt. Removed non-minified resources from packages. Moved from typeahead.js to bootstrap-3-typeahead.
  • 2.3.0:
    • Modernizr was removed and replaced with a shim just containing the tests used in ID7.
    • lodash is no longer exposed as _ in order to reduce the bundle size
  • 2.6.0:
    • Internet Explorer 11 is no longer fully supported
    • Headroom.js was updated to 0.10.3 which no longer supports IE11 without a polyfill for Object.assign. To enable this in IE11, include an Object.assign polyfill and then add data-fixed-header="true" data-fixed-nav="true" to the .id7-navigation element.
  • 2.8.0:
    • Bootstrap typeahead now adds aria- attributes to parent elements. If you use typeahead directly, ensure your input field is inside a reasonable container element (a Bootstrap column or .form-group is fine)
  • 2.9.0:
    • The id7-site-footer and id7-app-footer elements now require a nested content element, id7-site-footer-content and id7-app-footer-content respectively. The template has been updated to reflect this.
  • 2.9.10:
    • Using the 7.1 design requires the id7-point-1 class to be on the <body> element.
    • If building your own CSS, LESS must be at least version 3.5.

Copyright and license

Bootstrap is licensed under the MIT license.

ID7 is licensed under the ISC license.

Note that Access to the University web-site is subject to the separate, published copyright notice.