GitPlanet

Cheap and reliable Node.js hosting starts at $3/month, and $1/month static HTML hosting

Created with love in Canada, visit hostnodejs.com today

Feel like to post an Ad? Learn Details
All Projects → argyleink → Ragrid

argyleink / Ragrid

Licence: mit
Intrinsic first auto-layout flexbox grid

Labels

cssflexboxautolayoutmasonrygrid-system

Projects that are alternatives of or similar to Ragrid

Flexlib
FlexLib是一个基于flexbox模型，使用xml文件进行界面布局的框架，融合了web快速布局的能力，让iOS界面开发像写网页一样简单快速
Stars: ✭ 1,569 (+530.12%)
Mutual labels:  autolayout, masonry, flexbox
flexboxes
CSS flexbox framework with pure flexbox grid ability
Stars: ✭ 27 (-89.16%)
Mutual labels:  flexbox, grid-system
Uitableviewdynamiclayoutcacheheight
🖖高性能的自动计算采用 Autolayout 布局的 UITableViewCell 和 UITableViewHeaderFooterView 的高度，内部自动管理高度缓存。
Stars: ✭ 360 (+44.58%)
Mutual labels:  autolayout, masonry
Pintsize
Customisable 💪 Flexbox grid system
Stars: ✭ 330 (+32.53%)
Mutual labels:  grid-system, flexbox
React Flex Ready
A Flexbox grid ready, easy to implement and customize
Stars: ✭ 23 (-90.76%)
Mutual labels:  grid-system, flexbox
Core Layout
Flexbox & CSS-style Layout in Swift.
Stars: ✭ 215 (-13.65%)
Mutual labels:  autolayout, flexbox
gutter-grid
A Sass flexbox based grid system that is able to replicate CSS grid-gap in IE11
Stars: ✭ 18 (-92.77%)
Mutual labels:  flexbox, grid-system
Screenadaptationkit
🎨iOS rapidScreen Compatible AdapterKit(Deprecate)
Stars: ✭ 70 (-71.89%)
Mutual labels:  autolayout, masonry
Griz
Grid library for React; Rescue the cat
Stars: ✭ 99 (-60.24%)
Mutual labels:  grid-system, flexbox
Griddd
A dead simple, customisable, flexbox-based griddd
Stars: ✭ 108 (-56.63%)
Mutual labels:  grid-system, flexbox
Bedrock
Foundational Layout Primitives for your React App
Stars: ✭ 173 (-30.52%)
Mutual labels:  grid-system
Shuffle
Categorize, sort, and filter a responsive grid of items
Stars: ✭ 2,170 (+771.49%)
Mutual labels:  masonry
Quicklayout
Written in pure Swift, QuickLayout offers a simple and easy way to manage Auto Layout in code.
Stars: ✭ 213 (-14.46%)
Mutual labels:  autolayout
Fluid For Sketch
[Sketch Plugin] Sketch-flavored Auto Layout-like Constraints
Stars: ✭ 2,408 (+867.07%)
Mutual labels:  autolayout
Notautolayout
Layout your views without Auto Layout constraints, in a much more swifty way.
Stars: ✭ 171 (-31.33%)
Mutual labels:  autolayout
Masonic
🧱 High-performance masonry layouts for React
Stars: ✭ 209 (-16.06%)
Mutual labels:  masonry
Flexulator
A visual flexbox space distribution calculator
Stars: ✭ 171 (-31.33%)
Mutual labels:  flexbox
Devicelayout
📱AutoLayout can be set differently for each device
Stars: ✭ 170 (-31.73%)
Mutual labels:  autolayout
Guides
An organized list of guides and tutorials for design, development, and system administration.
Stars: ✭ 166 (-33.33%)
Mutual labels:  flexbox
Automatic Height Tagcells
This is a sample project to implement features with dynamic height of UITableViewCell based on autolayout, tags aligned automatically and clickable tags.
Stars: ✭ 229 (-8.03%)
Mutual labels:  autolayout
View All Similar Projects ➔

demo & docs

Downloading

npm i ragrid
bower i ragrid

or cheat and let github host it by pointing to https://rawgit.com/argyleink/ragrid/master/ragrid.min.css

Using

@import 'ragrid'                              // postCSS
@import url('path_to/ragrid.min.css')         // css
@require 'path_to/ragrid'                     // stylus
let ragrid = require('path_to/ragrid.styl')   // ES6

Building

Feel free to clone and build this project yourself:

npm run ragrid # convert the stylus to css
npm run crunch # minify css file

Contributing

PR? =)

Release History

  • 2017-4-23 v1.0.5 Shortened columns syntax
  • 2017-4-15 v1.0.4 Added vertical masonry
  • 2017-4-11 v1.0.3 SCSS support, better docs
  • 2017-4-09 v1.0.0 Make it easy to use

License

Copyright (c) 2017 Adam Argyle. Licensed under the MIT license.

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].