Minor style tweeks for 4k browsers

This commit is contained in:
rhyneav 2018-01-02 09:48:06 -05:00
parent 766dcdbb53
commit 4f72b27977
5 changed files with 19 additions and 18 deletions

4
.gitignore vendored
View file

@ -1,6 +1,5 @@
/node_modules
npm-debug.log
/dist
/tests/node_modules
.DS_Store
/public
@ -8,4 +7,5 @@ npm-debug.log
# Ignore compiled CSS
/docs/static/assets/paper.css
/docs/static/assets/paper.min.css
/docs/static/assets/paper.min.css
/dist

View file

@ -6,19 +6,18 @@ weight: -270
#### Download
`Download` the latest version (1.1.0) using either of the links below. Or
Download the latest version (1.4.0) using either of the links below. Or
download an older release via Github.
<div class="row flex-spaces text-center">
<a class="paper-btn margin" href="https://github.com/rhyneav/papercss/releases/download/v1.1.0/paper.css">CSS File</a>
<a class="paper-btn margin" href="https://github.com/rhyneav/papercss/releases/download/v1.1.0/paper.min.css">Minified CSS File</a>
<a class="paper-btn margin" href="https://github.com/rhyneav/papercss/releases/download/v1.4.0/paper.css">CSS File</a>
<a class="paper-btn margin" href="https://github.com/rhyneav/papercss/releases/download/v1.4.0/paper.min.css">Minified CSS File</a>
<a class="paper-btn margin" href="https://github.com/rhyneav/papercss/releases">Github Releases</a>
</div>
#### NPM
PaperCSS is now available on NPM as of version 1.1.0. Install with <code>npm
install papercss --save</code> and find the CSS in:
PaperCSS is available on NPM as of version 1.4.0. Install with <code>npm install papercss --save</code> and find the CSS in:
* node_modules/papercss/dist/paper.css
* node_modules/papercss/dist/paper.min.css
@ -28,8 +27,8 @@ install papercss --save</code> and find the CSS in:
Don't want to download it? That's cool. You can just link to PaperCSS via
[unpkg's CDN](https://unpkg.com/#/). You can use either:
* [https://unpkg.com/papercss@1.1.0/dist/paper.css](https://unpkg.com/papercss@1.1.0/dist/paper.css)
* [https://unpkg.com/papercss@1.1.0/dist/paper.min.css](https://unpkg.com/papercss@1.1.0/dist/paper.min.css)
* [https://unpkg.com/papercss@1.4.0/dist/paper.css](https://unpkg.com/papercss@1.4.0/dist/paper.css)
* [https://unpkg.com/papercss@1.4.0/dist/paper.min.css](https://unpkg.com/papercss@1.4.0/dist/paper.min.css)
Here's a quck snippet to get started with PaperCSS:
@ -40,7 +39,7 @@ Here's a quck snippet to get started with PaperCSS:
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<link rel="stylesheet" href="https://unpkg.com/papercss@1.1.0/dist/paper.min.css">
<link rel="stylesheet" href="https://unpkg.com/papercss@1.4.0/dist/paper.min.css">
<title>Document</title>
</head>
<body>
@ -54,16 +53,15 @@ Here's a quck snippet to get started with PaperCSS:
#### Build it Yourself
If you'd rather customize things, you can build the CSS yourself via the git
repo
If you'd rather customize things, you can build the CSS yourself via the git repo
```sh
git clone [repo url]
git clone https://github.com/papercss/papercss.git
cd papercss
npm install
npm run build
```
Grab the CSS out of the /dist folder created
You can also go into src/colors.less before building to change around the colors
of your new CSS.
You can also go into src/core/_config.scss before building to change around the global styles of your new CSS.

View file

@ -1,5 +1,5 @@
---
title: Docs
title: Documentation
menu: main
weight: -240
---

View file

@ -2,7 +2,7 @@
{{ range .Site.Sections }}
<div class='paper'>
<h3 class='sidebar-title' style='text-align:center'>
<a href='/docs'>PaperCSS Documentation</a>
<a href='/docs'>Documentation</a>
</h3>
<div class='row'>
{{ range .Sections }}
@ -24,7 +24,7 @@
</div>
{{ end }}
<div class='paper'>
<div class="row flex-right">
<div class="row flex-center">
<p>Made with 💛 by <a href="https://vlaservi.ch" target="_blank">Rhyne</a> and some <a href="https://github.com/rhyneav/papercss/graphs/contributors">fantastic contributors</a>!</p>
</div>
</div>

View file

@ -1,6 +1,9 @@
body {
background-image: url("/img/geometry2.png")
}
#top {
max-width: 1440px;
}
.demo .row .col {
background-color: #eee;
}