• Stars
    star
    889
  • Rank 51,338 (Top 2 %)
  • Language
    CSS
  • License
    Other
  • Created over 11 years ago
  • Updated about 2 years ago

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

Clank: open source prototyping framework for mobile apps

Clank README

What is Clank?

Clank is an open source HTML/CSS prototyping framework for tablet and smartphone apps. Think of it as Twitter Bootstrap but for prototyping native apps.

Demos

View the demos

How to use

Depending on your HTML/CSS skill level you can choose to use the Clank CSS files as "standalone" assets and build your prototype with HTML only. Refer to getclank.com for documentation on which markup and CSS classes to use.

This repository provides a sample config.rb to work with Compass - you can run compass watch and the SCSS will compile to CSS.

If you want to take things a bit further (SCSS generation + icon font generation) do the following:

  • Make sure you have bower and grunt set up.
  • Run npm install and bower install to install the necessary dependencies.
  • Run grunt watch to watch for SCSS changes and to generate the icon fonts.

For a full workflow for making a prototype and documenting it you can use the Clank-Jekyll project.

Acknowledgements

Clank was inspired and uses parts of Ratchet.

Contributing

Open a Github issue if you have any feedback or ideas.

More Repositories

1

sveltekit-jui

Sveltekit-JUI is a kit of UI components to be used in conjunction with Svelte and Svelte Kit
Svelte
44
star
2

cactus-jekyll-theme

A free responsive Jekyll theme
HTML
41
star
3

best-of-2019-svelte-fontless

Fontless version of Best of 2019 - for learning purposes
HTML
23
star
4

winston

Winston is a user interface library consisting of common elements in websites and web applications. These elements work together in an ecosystem of conventions, guidelines and best practices. The goal of this library is to provide designers and developers with a solid base to build user interfaces. Think of it as Rails for designers.
PHP
20
star
5

keynote-extractor-native

Native version of Keynote Extractor (Swift)
Swift
14
star
6

css-encapsulation-today

Documenting how to encapsulate CSS today
12
star
7

layercake-sveltekit-template

Svelte
8
star
8

sveltekit-trello-app

A demo app that uses a Trello board as its backend, using Sveltekit
Svelte
7
star
9

jekyll_file_exists

Check for existence of a file with this Jekyll plugin
Ruby
6
star
10

jquery.extendedinput

jquery.extendedinput plugin
JavaScript
5
star
11

intro-to-jekyll

Presentation for Jekyll camp in Ghent, Belgium: intro to Jekyll
5
star
12

jquery.bootstrap.simple.lightbox

Very simple jQuery lightbox
JavaScript
5
star
13

jquery.jekyll.globalnav

This repo shows an example setup to make HTML prototypes with page states and a global menu to navigate between pages.
JavaScript
4
star
14

jquery.multiadder

jquery.multiadder plugin
JavaScript
4
star
15

jekyll-camp

A barcamp style afternoon about Jekyll
3
star
16

hn-clone-svelte-be

Hacker news clone for Svelte Society Belgium code-along event
HTML
2
star
17

figma-dev-examples

Several figma plugin dev examples
HTML
1
star
18

clank-jekyll

Clank starter project (depending on Jekyll)
JavaScript
1
star
19

routify-slide-transition-demo

Routify slide transitions (WIP)
CSS
1
star
20

sass-color-guide

Given a bunch of Sass colors, generates a visual representation.
1
star
21

textcutter

TextCutter is a plugin for Figma to cut multiline text into separate layers.
TypeScript
1
star
22

svelte-slides

A basic setup for starting a presentation with Svelte based templates
CSS
1
star
23

jekyll-data

Examples looping through data with Jekyll's _data
1
star
24

keynote-extractor-site

Website for Keynote Extractor.
HTML
1
star
25

svelte-summit-org

Texts for organizing Svelte Summit
1
star