deblan-mirror/papercss
1
0
Fork 0
mirror of https://github.com/papercss/papercss synced 2024-06-28 02:10:02 +02:00
Code Issues Projects Releases Wiki Activity

Merge

Browse source
This commit is contained in:
Fraham 2017-11-23 20:08:47 +00:00
parent e98f8deaab 873f939bcc
commit 25345929fc
3 changed files with 29 additions and 23 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
README.md
View file

@ -21,7 +21,7 @@ Don't want to download it? That's cool. You can just link to PaperCSS via unpkg'
- https://unpkg.com/papercss@1.1.0/dist/paper.min.css - https://unpkg.com/papercss@1.1.0/dist/paper.min.css
## Quick Start ## Quick Start
``` ```html
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<head> <head>
@ -64,6 +64,8 @@ Here's the full workflow for customization:
- Once `npm start` or `npm run build` has been run then it will create the new css so that the new color can be used as a text, border or background - Once `npm start` or `npm run build` has been run then it will create the new css so that the new color can be used as a text, border or background
## Contributing ## Contributing
Check out what's been added but not yet releases at [develop.getpapercss.com](https://develop.getpapercss.com)
This project is open source and contributions are very welcomed. It is also as beginner friendly as possible, so don't be afraid to jump in if you've never contributed to any Git project before! Feel free to reach out if you are new and need help with the process. This project is open source and contributions are very welcomed. It is also as beginner friendly as possible, so don't be afraid to jump in if you've never contributed to any Git project before! Feel free to reach out if you are new and need help with the process.
Similar to customizing, make sure you have Git, Node, and NPM on your system. Similar to customizing, make sure you have Git, Node, and NPM on your system.

46
index.html
View file

@ -166,7 +166,7 @@
&lt;/div&gt; &lt;/div&gt;
&lt;div class=&quot;row flex-center&quot;&gt; &lt;div class=&quot;row flex-center&quot;&gt;
&lt;div class=&quot;sm-4 col&quot;&gt;Aligned&lt;/div&gt; &lt;div class=&quot;sm-4 col&quot;&gt;Aligned&lt;/div&gt;
&lt;div class=&quot;sm-4 col&quot;&gt;Right (flex-right)&lt;/div&gt; &lt;div class=&quot;sm-4 col&quot;&gt;Center (flex-center)&lt;/div&gt;
&lt;/div&gt; &lt;/div&gt;
&lt;div class=&quot;row flex-edges&quot;&gt; &lt;div class=&quot;row flex-edges&quot;&gt;
&lt;div class=&quot;sm-4 col&quot;&gt;Aligned&lt;/div&gt; &lt;div class=&quot;sm-4 col&quot;&gt;Aligned&lt;/div&gt;
@ -278,30 +278,30 @@
<div id="forms" class="section"> <div id="forms" class="section">
<h2>Forms</h2> <h2>Forms</h2>
<div class="form-group"> <div class="form-group">
<label>Input</label> <label for="paperInputs1">Input</label>
<input type="text" placeholder="Nice input"> <input type="text" placeholder="Nice input" id="paperInputs1">
</div> </div>
<div class="row"> <div class="row">
<div class="col sm-4"> <div class="col sm-4">
<div class="form-group"> <div class="form-group">
<label>Block Level</label> <label for="paperInputs2">Block Level</label>
<input class="input-block" type="text"> <input class="input-block" type="text" id="paperInputs2">
</div> </div>
</div> </div>
<div class="col sm-8"> <div class="col sm-8">
<div class="form-group"> <div class="form-group">
<label>Block Level</label> <label for="paperInputs3">Block Level</label>
<input class="input-block" type="text"> <input class="input-block" type="text" id="paperInputs3">
</div> </div>
</div> </div>
</div> </div>
<div class="form-group"> <div class="form-group">
<label>Disabled</label> <label for="paperInputs4">Disabled</label>
<input type="text" placeholder="Disabled" disabled> <input type="text" placeholder="Disabled" id="paperInputs4" disabled>
</div> </div>
<div class="form-group"> <div class="form-group">
<label>Select</label> <label for="paperSelects1">Select</label>
<select> <select id="paperSelects1">
<option value="1">Option 1</option> <option value="1">Option 1</option>
<option value="2">Option 2</option> <option value="2">Option 2</option>
<option value="3">Option 3</option> <option value="3">Option 3</option>
@ -328,30 +328,30 @@
<div class="docs"> <div class="docs">
<pre> <pre>
&lt;div class="form-group"&gt; &lt;div class="form-group"&gt;
&lt;label&gt;Input&lt;/label&gt; &lt;label for="paperInputs1"&gt;Input&lt;/label&gt;
&lt;input type="text" placeholder="Nice input"&gt; &lt;input type="text" placeholder="Nice input" id="paperInputs1"&gt;
&lt;/div&gt; &lt;/div&gt;
&lt;div class="row"&gt; &lt;div class="row"&gt;
&lt;div class="col sm-4"&gt; &lt;div class="col sm-4"&gt;
&lt;div class="form-group"&gt; &lt;div class="form-group"&gt;
&lt;label&gt;Block Level&lt;/label&gt; &lt;label for="paperInputs2"&gt;Block Level&lt;/label&gt;
&lt;input class="input-block" type="text"&gt; &lt;input class="input-block" type="text" id="paperInputs2"&gt;
&lt;/div&gt; &lt;/div&gt;
&lt;/div&gt; &lt;/div&gt;
&lt;div class="col sm-8"&gt; &lt;div class="col sm-8"&gt;
&lt;div class="form-group"&gt; &lt;div class="form-group"&gt;
&lt;label&gt;Block Level&lt;/label&gt; &lt;label for="paperInputs3"&gt;Block Level&lt;/label&gt;
&lt;input class="input-block" type="text"&gt; &lt;input class="input-block" type="text" id="paperInputs3"&gt;
&lt;/div&gt; &lt;/div&gt;
&lt;/div&gt; &lt;/div&gt;
&lt;/div&gt; &lt;/div&gt;
&lt;div class="form-group"&gt; &lt;div class="form-group"&gt;
&lt;label&gt;Disabled&lt;/label&gt; &lt;label for="paperInputs4"&gt;Disabled&lt;/label&gt;
&lt;input type="text" placeholder="Disabled" disabled&gt; &lt;input type="text" placeholder="Disabled" id="paperInputs4" disabled&gt;
&lt;/div&gt; &lt;/div&gt;
&lt;div class="form-group"&gt; &lt;div class="form-group"&gt;
&lt;label&gt;Select&lt;/label&gt; &lt;label for="paperSelects1"&gt;Select&lt;/label&gt;
&lt;select&gt; &lt;select id="paperSelects1"&gt;
&lt;option value="1"&gt;Option 1&lt;/option&gt; &lt;option value="1"&gt;Option 1&lt;/option&gt;
&lt;option value="2"&gt;Option 2&lt;/option&gt; &lt;option value="2"&gt;Option 2&lt;/option&gt;
&lt;option value="3"&gt;Option 3&lt;/option&gt; &lt;option value="3"&gt;Option 3&lt;/option&gt;
@ -649,6 +649,10 @@ function add(x, y) {
&lt;button popover-top="Popover on top"&gt;Popover on top and on a button!&lt;/button&gt;</pre> &lt;button popover-top="Popover on top"&gt;Popover on top and on a button!&lt;/button&gt;</pre>
</div> </div>
</div> </div>
<<<<<<< HEAD
=======
>>>>>>> refs/remotes/rhyneav/master
<div id="cards" class="section"> <div id="cards" class="section">
<h2>Cards</h2> <h2>Cards</h2>
<h4>Full card example</h4> <h4>Full card example</h4>

2
src/forms.less
View file

@ -53,7 +53,7 @@ input, select {
input + span:before { input + span:before {
content: ''; content: '';
display: inline-block; display: inline-block;
position: -.25rem; position: relative;
width: 1rem; width: 1rem;
height: 1rem; height: 1rem;
border: 2px solid @primary; border: 2px solid @primary;