Skip to content

Commit

Permalink
Fixed proper names to use CamelCase
Browse files Browse the repository at this point in the history
  • Loading branch information
@FND
FND committed Jun 27, 2016
1 parent 6fc02af commit f43137f
Show file tree
Hide file tree
Showing 9 changed files with 13 additions and 13 deletions.
2 changes: 1 addition & 1 deletion CONTRIBUTING.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@ Other files in the root are:
- CONTRIBUTING.md: this file
- LICENSE: MIT license in here
- Profcile: Heroku uses this to load the website
- README.md: the file that shows some information for Github
- README.md: the file that shows some information for GitHub
- app.js: the website main file
- bower.json: the package for using with bower
- documentation.md: developer documentation
Expand Down
8 changes: 4 additions & 4 deletions documentation.html
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
<!DOCTYPE html><html><head><title>Plugins - Picnic CSS</title><meta charset="utf-8"><meta name="viewport" content="width=device-width, initial-scale=1"><meta name="keywords" content="css, library, css library, picnic, picnicss, html, html5, light, plugin"><meta name="description" content="A lighweight CSS library with nice defaults and many plugins to kickstart your projects"><meta property="og:image" content="http://picnicss.com/web/preview.png?1"><meta property="og:url" content="http://picnicss.com/"><meta property="og:title" content="Picnic CSS - A beautiful CSS library to kickstart your projects"><meta property="og:description" content="Includes buttons, cards, flexbox-based grid, responsive builder with a lot of options"><link rel="stylesheet" href="web/style/style.min.css"><link rel="icon" href="web/img/picnic_test.png" type="image/png"></head><body><nav class="loading"><a href="/" class="brand"><span>Picnic CSS</span></a><!-- responsiveness--><input id="bmenu" type="checkbox" class="show"><label for="bmenu" class="burger toggle pseudo button">menu</label><div class="menu"><a href="/tests" class="pseudo button icon-help-circled">Test</a><a href="https://github.com/picnicss/picnic" target="_blank" class="pseudo button icon-g">Github</a><a href="/documentation" class="button icon-file-code">Documentation</a></div></nav><main class="documentation"><section class="flex five"><aside class="none fifth-1000"><h2>Contents</h2></aside><article class="full four-fifth-1000"><h1 id="picnic-css">Picnic CSS</h1>
<!DOCTYPE html><html><head><title>Plugins - Picnic CSS</title><meta charset="utf-8"><meta name="viewport" content="width=device-width, initial-scale=1"><meta name="keywords" content="css, library, css library, picnic, picnicss, html, html5, light, plugin"><meta name="description" content="A lighweight CSS library with nice defaults and many plugins to kickstart your projects"><meta property="og:image" content="http://picnicss.com/web/preview.png?1"><meta property="og:url" content="http://picnicss.com/"><meta property="og:title" content="Picnic CSS - A beautiful CSS library to kickstart your projects"><meta property="og:description" content="Includes buttons, cards, flexbox-based grid, responsive builder with a lot of options"><link rel="stylesheet" href="web/style/style.min.css"><link rel="icon" href="web/img/picnic_test.png" type="image/png"></head><body><nav class="loading"><a href="/" class="brand"><span>Picnic CSS</span></a><!-- responsiveness--><input id="bmenu" type="checkbox" class="show"><label for="bmenu" class="burger toggle pseudo button">menu</label><div class="menu"><a href="/tests" class="pseudo button icon-help-circled">Test</a><a href="https://github.com/picnicss/picnic" target="_blank" class="pseudo button icon-g">GitHub</a><a href="/documentation" class="button icon-file-code">Documentation</a></div></nav><main class="documentation"><section class="flex five"><aside class="none fifth-1000"><h2>Contents</h2></aside><article class="full four-fifth-1000"><h1 id="picnic-css">Picnic CSS</h1>
<p>Picnic CSS is a lightweight and beautiful CSS library</p>
<h2 id="buttons">Buttons</h2>
<p>They can be of different colors and types:</p>
Expand Down Expand Up @@ -123,7 +123,7 @@ <h3 id="usage">Usage</h3>
<pre><code class="lang-html">&lt;input id=&quot;checkboxdemo&quot; type=&quot;checkbox&quot;&gt;
&lt;label for=&quot;checkboxdemo&quot; class=&quot;checkable&quot;&gt;Checkbox text&lt;/label&gt;
</code></pre>
<h3 id="javascript">Javascript</h3>
<h3 id="javascript">JavaScript</h3>
<p>You do not need javascript since we are using the native elements and not setting <code>display: none</code> purposefully. However, you can still use javascript as normal to retrieve the checked elements.</p>
<p><form>
<label>
Expand Down Expand Up @@ -159,7 +159,7 @@ <h2 id="drop-image">Drop image</h2>
&lt;input title=&quot;Drop image or click me&quot; type=&quot;file&quot;&gt;
&lt;/label&gt;
</code></pre>
<h3 id="javascript">Javascript</h3>
<h3 id="javascript">JavaScript</h3>
<p>This is the javascript you need for multiple elements:</p>
<pre><code class="lang-js">document.addEventListener(&quot;DOMContentLoaded&quot;, function() {
[].forEach.call(document.querySelectorAll(&#39;.dropimage&#39;), function(img){
Expand Down Expand Up @@ -441,7 +441,7 @@ <h2 id="modal">Modal</h2>
&lt;/article&gt;
&lt;/div&gt;
</code></pre>
<h3 id="javascript">Javascript</h3>
<h3 id="javascript">JavaScript</h3>
<p>As always, there is <strong>no javascript</strong>. However, a little bit of javascript could enhance the experience allowing to close the modal by pressing <code>ESC</code>.</p>
<script>
document.onkeydown = function(e){
Expand Down
2 changes: 1 addition & 1 deletion index.html
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
<!DOCTYPE html><html><head><title>Picnic CSS</title><meta charset="utf-8"><meta name="viewport" content="width=device-width, initial-scale=1"><meta name="keywords" content="css, library, css library, picnic, picnicss, html, html5, light, plugin"><meta name="description" content="A lighweight CSS library with nice defaults and many plugins to kickstart your projects"><meta property="og:image" content="http://picnicss.com/web/preview.png?1"><meta property="og:url" content="http://picnicss.com/"><meta property="og:title" content="Picnic CSS - A beautiful CSS library to kickstart your projects"><meta property="og:description" content="Includes buttons, cards, flexbox-based grid, responsive builder with a lot of options"><link rel="stylesheet" href="web/style/style.min.css"><link rel="icon" href="web/img/picnic_test.png" type="image/png"></head><body><nav class="loading"><a href="/" class="brand"><span>Picnic CSS</span></a><!-- responsiveness--><input id="bmenu" type="checkbox" class="show"><label for="bmenu" class="burger toggle pseudo button">menu</label><div class="menu"><a href="/tests" class="pseudo button icon-help-circled">Test</a><a href="https://github.com/picnicss/picnic" target="_blank" class="pseudo button icon-g">Github</a><a href="/documentation" class="button icon-file-code">Documentation</a></div></nav><main><header class="hero"><div class="content"><h1>Picnic CSS</h1><p class="slogan">Lightweight and beautiful library</p><pre class="bower">bower install picnic</pre><p class="links"><a href="http://www.jsdelivr.com/#!picnicss" target="_blank" class="cdn">CDN</a><span> | </span><a href="https://raw.githubusercontent.com/picnicss/picnic/master/picnic.min.css" target="_blank" class="github">Download</a><span> | </span><a href="https://github.com/picnicss/picnic" target="_blank" class="github">Github</a></p></div><a href="#content" class="keepgoing">▼</a></header><div id="content" class="visual flex one two-800"><div class="content"><h2>Default html beauty</h2><p>The native html elements get a boost so you don't need to write presentation classes mixed with your html.</p><p>Picnic is completely modular so you can easily modify and test each part:</p><a href="/documentation" class="button icon-file-code">Documentation</a></div><div class="card"><section><button>Normal</button> <button class="success">Success</button> <button class="warning">Warning</button> <button class="error">Error</button></section><section><input type="email" placeholder="Email"></section><section><div class="flex three gallery"><div><article data-tooltip="Click me to upload a new image" class="tooltip-bottom"><label class="dropimage"><input type="file"></label></article></div><div><article data-tooltip="Click me to upload a new image" class="tooltip-bottom"><label style="background-image: url(web/img/demo.min.svg)" class="dropimage"><input type="file"></label></article></div><div><article data-tooltip="Click me to upload a new image" class="tooltip-bottom"><label style="background-image: url(web/img/demo.min.svg)" class="dropimage"><input type="file"></label></article></div></div></section></div></div><div class="visual flex one two-800"><div class="content"><h2>Made for the hackers</h2><p>Install it with bower and you will be able to integrate Picnic in any project and make it work for you.</p><p>Picnic is written in SCSS with <a href="/documentation#variables">many variables</a> and <a href="/documentation#placeholders"><em>classes</em> (placeholders)</a> to make it easy to extend.</p><a href="https://github.com/picnicss/picnic" target="_blank" class="button icon-g">Github</a></div><pre><code class="lang-css">$picnic-primary: #faa;
<!DOCTYPE html><html><head><title>Picnic CSS</title><meta charset="utf-8"><meta name="viewport" content="width=device-width, initial-scale=1"><meta name="keywords" content="css, library, css library, picnic, picnicss, html, html5, light, plugin"><meta name="description" content="A lighweight CSS library with nice defaults and many plugins to kickstart your projects"><meta property="og:image" content="http://picnicss.com/web/preview.png?1"><meta property="og:url" content="http://picnicss.com/"><meta property="og:title" content="Picnic CSS - A beautiful CSS library to kickstart your projects"><meta property="og:description" content="Includes buttons, cards, flexbox-based grid, responsive builder with a lot of options"><link rel="stylesheet" href="web/style/style.min.css"><link rel="icon" href="web/img/picnic_test.png" type="image/png"></head><body><nav class="loading"><a href="/" class="brand"><span>Picnic CSS</span></a><!-- responsiveness--><input id="bmenu" type="checkbox" class="show"><label for="bmenu" class="burger toggle pseudo button">menu</label><div class="menu"><a href="/tests" class="pseudo button icon-help-circled">Test</a><a href="https://github.com/picnicss/picnic" target="_blank" class="pseudo button icon-g">GitHub</a><a href="/documentation" class="button icon-file-code">Documentation</a></div></nav><main><header class="hero"><div class="content"><h1>Picnic CSS</h1><p class="slogan">Lightweight and beautiful library</p><pre class="bower">bower install picnic</pre><p class="links"><a href="http://www.jsdelivr.com/#!picnicss" target="_blank" class="cdn">CDN</a><span> | </span><a href="https://raw.githubusercontent.com/picnicss/picnic/master/picnic.min.css" target="_blank" class="github">Download</a><span> | </span><a href="https://github.com/picnicss/picnic" target="_blank" class="github">Github</a></p></div><a href="#content" class="keepgoing">▼</a></header><div id="content" class="visual flex one two-800"><div class="content"><h2>Default html beauty</h2><p>The native html elements get a boost so you don't need to write presentation classes mixed with your html.</p><p>Picnic is completely modular so you can easily modify and test each part:</p><a href="/documentation" class="button icon-file-code">Documentation</a></div><div class="card"><section><button>Normal</button> <button class="success">Success</button> <button class="warning">Warning</button> <button class="error">Error</button></section><section><input type="email" placeholder="Email"></section><section><div class="flex three gallery"><div><article data-tooltip="Click me to upload a new image" class="tooltip-bottom"><label class="dropimage"><input type="file"></label></article></div><div><article data-tooltip="Click me to upload a new image" class="tooltip-bottom"><label style="background-image: url(web/img/demo.min.svg)" class="dropimage"><input type="file"></label></article></div><div><article data-tooltip="Click me to upload a new image" class="tooltip-bottom"><label style="background-image: url(web/img/demo.min.svg)" class="dropimage"><input type="file"></label></article></div></div></section></div></div><div class="visual flex one two-800"><div class="content"><h2>Made for the hackers</h2><p>Install it with bower and you will be able to integrate Picnic in any project and make it work for you.</p><p>Picnic is written in SCSS with <a href="/documentation#variables">many variables</a> and <a href="/documentation#placeholders"><em>classes</em> (placeholders)</a> to make it easy to extend.</p><a href="https://github.com/picnicss/picnic" target="_blank" class="button icon-g">Github</a></div><pre><code class="lang-css">$picnic-primary: #faa;

@import &#39;bower/picnic/src/picnic&#39;;

Expand Down
2 changes: 1 addition & 1 deletion src/plugins/checkbox/readme.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -38,7 +38,7 @@ But you can also use a label and reference the original input:



### Javascript
### JavaScript

You do not need javascript since we are using the native elements and not setting `display: none` purposefully. However, you can still use javascript as normal to retrieve the checked elements.

Expand Down
2 changes: 1 addition & 1 deletion src/plugins/dropimage/readme.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@ Allows you to add a file input element that can receive an image drop and clicks
```


### Javascript
### JavaScript

This is the javascript you need for multiple elements:

Expand Down
2 changes: 1 addition & 1 deletion src/plugins/modal/readme.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -28,7 +28,7 @@ The modal is pure CSS, which makes the html quite ugly actually. However it does



### Javascript
### JavaScript

As always, there is **no javascript**. However, a little bit of javascript could enhance the experience allowing to close the modal by pressing `ESC`.

Expand Down
2 changes: 1 addition & 1 deletion tests.html
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
<!DOCTYPE html><html><head><title>Picnic CSS Testing</title><meta charset="utf-8"><meta name="viewport" content="width=device-width, initial-scale=1"><meta name="keywords" content="css, library, css library, picnic, picnicss, html, html5, light, plugin"><meta name="description" content="A lighweight CSS library with nice defaults and many plugins to kickstart your projects"><meta property="og:image" content="http://picnicss.com/web/preview.png?1"><meta property="og:url" content="http://picnicss.com/"><meta property="og:title" content="Picnic CSS - A beautiful CSS library to kickstart your projects"><meta property="og:description" content="Includes buttons, cards, flexbox-based grid, responsive builder with a lot of options"><link rel="stylesheet" href="web/style/style.min.css"><link rel="icon" href="web/img/picnic_test.png" type="image/png"></head><body><nav class="loading"><a href="/" class="brand"><span>Picnic CSS</span></a><!-- responsiveness--><input id="bmenu" type="checkbox" class="show"><label for="bmenu" class="burger toggle pseudo button">menu</label><div class="menu"><a href="/tests" class="pseudo button icon-help-circled">Test</a><a href="https://github.com/picnicss/picnic" target="_blank" class="pseudo button icon-g">Github</a><a href="/documentation" class="button icon-file-code">Documentation</a></div></nav><main class="intro test"><h1>Testing Picnic CSS</h1><p>A small testing page to see how elements behave across devices</p><!-- Testing the module -->
<!DOCTYPE html><html><head><title>Picnic CSS Testing</title><meta charset="utf-8"><meta name="viewport" content="width=device-width, initial-scale=1"><meta name="keywords" content="css, library, css library, picnic, picnicss, html, html5, light, plugin"><meta name="description" content="A lighweight CSS library with nice defaults and many plugins to kickstart your projects"><meta property="og:image" content="http://picnicss.com/web/preview.png?1"><meta property="og:url" content="http://picnicss.com/"><meta property="og:title" content="Picnic CSS - A beautiful CSS library to kickstart your projects"><meta property="og:description" content="Includes buttons, cards, flexbox-based grid, responsive builder with a lot of options"><link rel="stylesheet" href="web/style/style.min.css"><link rel="icon" href="web/img/picnic_test.png" type="image/png"></head><body><nav class="loading"><a href="/" class="brand"><span>Picnic CSS</span></a><!-- responsiveness--><input id="bmenu" type="checkbox" class="show"><label for="bmenu" class="burger toggle pseudo button">menu</label><div class="menu"><a href="/tests" class="pseudo button icon-help-circled">Test</a><a href="https://github.com/picnicss/picnic" target="_blank" class="pseudo button icon-g">GitHub</a><a href="/documentation" class="button icon-file-code">Documentation</a></div></nav><main class="intro test"><h1>Testing Picnic CSS</h1><p>A small testing page to see how elements behave across devices</p><!-- Testing the module -->
<h2 id="button">Button types and colors</h2>

<div>
Expand Down
4 changes: 2 additions & 2 deletions web/index.html.jade
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@ block content
span |
a.github(href="https://raw.githubusercontent.com/picnicss/picnic/master/picnic.min.css" target="_blank") Download
span |
a.github(href="https://github.com/picnicss/picnic" target="_blank") Github
a.github(href="https://github.com/picnicss/picnic" target="_blank") GitHub

a.keepgoing(href="#content") ▼

Expand Down Expand Up @@ -57,7 +57,7 @@ block content
h2 Made for the hackers
p Install it with bower and you will be able to integrate Picnic in any project and make it work for you.
p Picnic is written in SCSS with <a href="/documentation#variables">many variables</a> and <a href="/documentation#placeholders"><em>classes</em> (placeholders)</a> to make it easy to extend.
a.button.icon-g(href="https://github.com/picnicss/picnic" target="_blank") Github
a.button.icon-g(href="https://github.com/picnicss/picnic" target="_blank") GitHub

:markdown
```css
Expand Down
2 changes: 1 addition & 1 deletion web/layout.jade
View file
Original file line number Diff line number Diff line change
Expand Up @@ -26,7 +26,7 @@ html

div.menu
a.pseudo.button.icon-help-circled(href="/tests") Test
a.pseudo.button.icon-g(href="https://github.com/picnicss/picnic" target="_blank") Github
a.pseudo.button.icon-g(href="https://github.com/picnicss/picnic" target="_blank") GitHub
a.button.icon-file-code(href="/documentation") Documentation

block content
Expand Down

0 comments on commit f43137f

Please sign in to comment.