https://github.com/theyorkshiredev/calloutcss

A set of CSS styles which allows for adding callouts to your website.
https://github.com/theyorkshiredev/calloutcss

bower callout callouts css front-end npm npm-package web

Last synced: about 2 months ago
JSON representation

A set of CSS styles which allows for adding callouts to your website.

• Host: GitHub
• URL: https://github.com/theyorkshiredev/calloutcss
• Owner: TheYorkshireDev
• License: mit
• Created: 2018-10-13T19:35:10.000Z (about 6 years ago)
• Default Branch: master
• Last Pushed: 2018-10-14T14:09:40.000Z (about 6 years ago)
• Last Synced: 2024-11-17T21:49:06.645Z (about 2 months ago)
• Topics: bower, callout, callouts, css, front-end, npm, npm-package, web
• Language: JavaScript
• Homepage:
• Size: 107 KB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# CalloutCSS

A CDN, Bower and NPM component holding CSS definitions for callouts. No Javascript or dependencies, ideal

for use in any project which wants to add callout functionality.

## Usage:

CalloutCSS contains the definitions for three types of callouts; NOTE, WARNING and DANGER. Simply add the following snippets to produce callouts in your websites.

```html

    An example of a NOTE callout

```

![note callout](resources/note-callout.png)

```html

    An example of a WARNING callout

```

![warning callout](resources/warning-callout.png)

```html

    An example of a DANGER callout

```

![danger callout](resources/danger-callout.png)

Further customisations of the callouts can be found on the fully fleshed out examples documentation.

## Installation:

#### CDN

```html

```

#### Bower

```bash

$ bower install calloutcss

```

#### NPM

```bash

$ npm install calloutcss

```

## Development:

To pull and develop this package NPM and webpack is used to manage the development dependencies and

transpile the SCSS file into the final CSS distribution.

#### Setup Environment:

```bash

$ npm install

```

#### Build/Compile the SCSS:

```bash

$ npm run build

```

NOTE: `hack.js` is used as part of the build step generating `ignore.js`, however this is an

artefact of the build stage and is not packaged in releases. Unfortunately Webpack **MUST** have

a javascript entry point from which any (S)CSS is gathered and then output for distribution.

## Copyright and license

Code copyright 2018 TheYorkshireDev (Steven Cooney). Code released under

[the MIT license](https://github.com/TheYorkshireDev/CalloutCSS/blob/master/LICENSE).