Victory.css is a simply and lightweight front-end framework/toolkit (call it what you want) for developing fast.

Download

Use CDN:

<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, shrink-to-fit=no">
<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/victory.min.css">
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/victory.min.js"></script>

Or download from:

• https://raw.githubusercontent.com/brcontainer/victory.css/0.6.1/dist/victory.min.css
• https://raw.githubusercontent.com/brcontainer/victory.css/0.6.1/dist/victory.min.js

then use in your project put like this:

<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, shrink-to-fit=no">
<link rel="stylesheet" type="text/css" href="victory.min.css">
<script src="victory.min.js"></script>

Browser Support

Chrome | Firefox | Safari | Opera | Edge | EdgeHTML | IE9+ | IE8 --- | --- | --- | --- | --- | --- | --- | --- | | | | | | | ✔ | ✔ | ✔ 8+ | ✔ | ✔ | ✔ | ✔ | (partial)

Note: Victory.css has some fallbacks for old browsers without media-queries support, such as Internet Explorer 8, preventing your site from breaking

Basic vs Standard

Basic contains only basic resources, victory-basic.min.js contains only polyfills, about differences see:

Resource | Standard | Basic | About --- | --- | --- | --- border.scss | ✔ | ✔ | Utility for arround any element clear-both.scss | ✔ | ✔ | Clear both "global" colors.scss | ✔ | ✔ | Background and border color classes commons.scss | ✔ | ✔ | Various classes of common use container.scss | ✔ | ✔ | container (adpatative width @media-query) and container-fluid grid.scss | ✔ | ✔ | Grid system normalize.scss | ✔ | ✔ | Basic normalize and fallback for html5 tags for old browsers text-align.scss | ✔ | ✔ | text-align basead in view-port size visibility.scss | ✔ | ✔ | visibility: and display: basead in view-port size arrow.scss | ✔ | - | Various arrow "icons" badge.scss | ✔ | - | Badges system button.scss | ✔ | - | Styled buttons code.scss | ✔ | - | Pre defined style for <code> tags divider.scss | ✔ | - | Style horizontal lines (like <hr>) fix-render.scss | ✔ | - | fix-render (fix bug in elements with position:fixed on enter Chromium/Chrome DevTools) input.scss | ✔ | - | Styled inputs kbd.scss | ✔ | - | Pre defined style for <kbd> tags nav.scss | ✔ | - | Navbar system resize.scss | ✔ | - | Resize elements (only Desktop) slide.scss | ✔ | - | Slide system table.scss | ✔ | - | Styled tables underline.scss | ✔ | - | Underline text animated Minified size | 42kB | 16kB | - Gziped size | 7.5kB | 2.7kB | -

Development

To contribute or modify download using git (require npm):

git clone https://github.com/inphinit/Victory.css.git [project_name]
cd [project_name]
npm install

After changes files in ./src folder execute this command for deploy:

npm run build

Or see another commands

Commands

Command | Description ---|--- npm run readme | Generate README.html from README.md npm run examples | Generate examples/index.html for link all examples npm run mergecss | For create only victory.css without create prefixes and without min version npm run prefix | For put prefix properties in victory.css npm run mincss | For create min version from victory.css npm run mergejs | For create only victory.js without min version npm run minjs | For create min version from victory.js npm run standard | Deploy without create slim and minimal versions, auto-execute follow commands mergecss, prefix, mincss, mergejs, minjs npm run build | Full deploy, auto-execute follow commands mergecss, prefix, mincss, mergejs, minjs, basic:mergecss, basic:mincss, basic:mergejs, basic:minjs, minimal:mergecss, minimal:mincss in sequence

Basic commands

Command | Description ---|--- npm run basic:mergecss | For create only victory-basic.css without min version npm run basic:mincss | For create min version from victory-basic.css npm run basic:mergejs | For create only victory-basic.js without min version npm run basic:minjs | For create min version from victory-basic.js npm run basic | Minimal deploy, auto-execute follow commands basic:mergecss, basic:mincss, basic:mergejs and basic:minjs in sequence