DEPRECATED d1

DEPRECATED

This is no longer supported.
Please consider using d1-web instead.

d1 is a lightweight yet functional responsive CSS microframework with optional JavaScript enhancements.
It aims to implement most widely used interface components with less code.

Features

• lightweight (minified and gzipped: CSS <4 KB, optional JS <4 KB)
• non-bloated class names
• functional
• modern
• responsive (flexbox, mobile first)
• performant
• semantic (uses native elements)
• valid
• cross-browser
• JavaScript not required
• enhanced with JavaScript
• neutral style
• customizable style with css vars
• no floats
• no hacks
• accessibility is not much covered

Add-ons

• d1calendar replaces standard HTML date and datetime-local inputs with custom dropdown calendar
• d1dialog replaces standard Javascript dialogs: alert, confirm, prompt
• d1edit turns textarea into lightweight WYSIWYG editor
• d1gallery makes lighweight image gallery
• d1lookup autocompletes lookups with data from XHTTP request
• d1tablex makes HTML table searchable and sortable
• d1valid sets custom form validation.

Getting Started

Use from CDN

jsDelivr

<link href="https://cdn.jsdelivr.net/npm/d1css@1/dist/d1.min.css" rel="stylesheet">
<!-- optional -->
<script src="https://cdn.jsdelivr.net/npm/d1css@1/dist/d1.min.js"></script>
<script>
  d1.load();
</script>

GitCDN

<link href="https://gitcdn.link/repo/vvvkor/d1/master/dist/d1.min.css" rel="stylesheet">
<!-- optional -->
<script src="https://gitcdn.link/repo/vvvkor/d1/master/dist/d1.min.js"></script>
<script>
  d1.load();
</script>

Install with NPM

Install to your repository:

npm install d1css

Then use in your CSS file:

@import "../node_modules/d1css/dist/d1.min.css";

And optionally bundle into your JavaScript file:

var d1 = require("d1css");
d1.load();

Install manually

Download minified d1 files.

<link href="d1.min.css" rel="stylesheet">
<!-- optional -->
<script src="d1.min.js"></script>
<script>
  d1.load();
</script>

Browser Support

• IE 9 (mobile style only, no js enhancements)
• IE 10+, Edge (except details/summary component)
• Latest Stable: Chrome, Firefox, Opera, Safari
• iOS 6-8
• Android 4.x

Docs

Docs and demo

Thanks

• List of CSS frameworks
• Small CSS Frameworks

License

MIT