mirror of
https://github.com/seigler/dash-docs
synced 2025-07-26 01:06:13 +00:00
initial commit
This commit is contained in:
Nils Schneider
commit
cb7f7afb93
27 changed files with 2606 additions and 0 deletions
1
.gitignore
vendored
Normal file
1
.gitignore
vendored
Normal file
|
|
@ -0,0 +1 @@
|
|||
_site/
|
||||
10
README.md
Normal file
10
README.md
Normal file
|
|
@ -0,0 +1,10 @@
|
|||
# Requirements
|
||||
|
||||
Requires [Jekyll](https://github.com/mojombo/jekyll)
|
||||
|
||||
# Usage
|
||||
|
||||
* update DOWNLOAD\_VERSION in index.html
|
||||
* run jekyll
|
||||
* output will be in \_site/
|
||||
|
||||
BIN
bitcoin.pdf
Normal file
BIN
bitcoin.pdf
Normal file
Binary file not shown.
BIN
favicon.ico
Normal file
BIN
favicon.ico
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 2.5 KiB |
30
gavinandresen.txt
Normal file
30
gavinandresen.txt
Normal file
|
|
@ -0,0 +1,30 @@
|
|||
-----BEGIN PGP PUBLIC KEY BLOCK-----
|
||||
Version: GnuPG v1.4.9 (Darwin)
|
||||
|
||||
mQGiBEy8srURBADlAamWM3TkgAKyVBVftUsg5aZ3zOA5UAlg+yI/6bzfTkYLtspA
|
||||
LQ6typamac9re+lqnWdDMa4qVwSmaOMxLOlGhCWWfmA38QprU+ZfuesnxWrVAMG8
|
||||
TDHLT2vBCa+9iC50soo/imsDqqe6ujm7a+Pd1KSNvFR5KXgEgeEHSiyEqwCg3iAa
|
||||
DH3lNWzNOgJgi8PUiszqbcsD/2mfNBYJsazYabXcbNdh8VheNnyK2KLUE8Lg1WzU
|
||||
ld/Sd1gu67oPSFfTiFZ5OBjdHI/XmlFAT4r4eNy1IIf0nELJWWQ6hlzm0a0/DO4b
|
||||
BUoapjUjAYWDyeeeALDHK7EQboqtwWBlRONyY/+yB9usgbvAK2khRlzBhQonGJEs
|
||||
FpdQA/9bQzVgpEE1q/ZSnvLp0nOFA3E51SS9uvGGnAdQMjwDp7iGBzh7gRz4ko1k
|
||||
LG3Sa5fNe21VvlKFcMTaZN9Pd5fDd7gEoDkjUDlf9lRX+YT5zf+SSoeCIGuNMVzs
|
||||
f8Z2H414dYDOJPBkhYWcqFhGhz11QtWgug5n8GaewC2YOiPU8LQoR2F2aW4gQW5k
|
||||
cmVzZW4gPGdhdmluYW5kcmVzZW5AZ21haWwuY29tPohmBBMRAgAmBQJMvLK1AhsD
|
||||
BQku/geABgsJCAcDAgQVAggDBBYCAwECHgECF4AACgkQdYgkL74406h8rwCgyMwS
|
||||
bwfJ+t3B2IRbhnDIsLo4UtAAnRqMmznLBNLe97fbWYjkcgiAkr2UuQINBEy8srUQ
|
||||
CADLdLYPEFwz9DEMHoQID/USG6QBP8LXVWCy+84aWsR/SMP2k7BmqtiBEOAZvq9j
|
||||
Tf4/6WoYkU++vDUiq2QefmCnUSfNiD7TcVAQOm631Kg7TkCQU3TZY5rzJ8DAoh2D
|
||||
vMuYhWVr0grvlJcF6x0A2/YopfR1BO7SNq87LoG/ZqdbFgijNNePBXEfDGG0T0dg
|
||||
XkZAKsf6v/rgQYWjSgOx1jn/cH7opoum4xyGLVDE+sU3aKBUwaWOV1hLUHWVwgC7
|
||||
FwXs+nxWPVitR4Ri6aYGlFTrql9DbrQipaybFTRsbdlCrSEpwz5sKK/FE3aRSo5+
|
||||
+X6fj590uOEPHtu9RDtBcCePAAMFB/9/hCzl8OVZER2fayOTwCauYbt/21D+RvQJ
|
||||
67bFMMiPxEgWcyueZmpF2Z5KXc61z8mMa831wUNdkkcr2BSr2FEIArlpoynwYHPe
|
||||
Kyzy1hhhXxdy7uOObicgPMnOx94ZRuvc/xD8LMDLbQ2tpAZn+TCXvwE7fvIxOCnr
|
||||
6JKUmd2GpQKVnFSbfS9to3pImnZe8OLwoFoBXQ3CBViJo5vYLUHHH+OgIs28PV+8
|
||||
fcQVJTUQpkDOjNg3fPFd8/YGzaE55+MTqacr5VoSR6aUweMpRCFHNb5PEv/HsY6m
|
||||
4Q5ypXJBMwWZZlDtiPJnnTaWPwCZLFoj3zEE2VgVGSuoxUMDisPRiE8EGBECAA8F
|
||||
Aky8srUCGwwFCS7+B4AACgkQdYgkL74406gxCQCfa3UFF31O14UKmnyuJFUTiik+
|
||||
YBsAoLiC5B6DhN25fJRKWhdvih2hQWrX
|
||||
=oDeQ
|
||||
-----END PGP PUBLIC KEY BLOCK-----
|
||||
30
genjix.gpg
Normal file
30
genjix.gpg
Normal file
|
|
@ -0,0 +1,30 @@
|
|||
-----BEGIN PGP PUBLIC KEY BLOCK-----
|
||||
Version: GnuPG v1.4.10 (GNU/Linux)
|
||||
|
||||
mQENBEzUY50BCAC3xuhgc+KGRWmF3ilxtvHbZHErCwcJD8kmrSe31FL9IVGo3Afx
|
||||
j5CmjO4YDdHIh7+toc/+NGWoGPIq8ZVGQj7upkECp3wJn1GSHSM7d/8mDNvA8GvM
|
||||
b3ub4BIrs8aJbuDjpLiINEz4P4qMpo/fDOdfIjuqg+2sr9zzqSW5KjEmNfOyAUSM
|
||||
ilHhFlTFaO3v+QS1eK27rmn5ER3HABnMnPRHQKeBwjxFvF58a9sEEsu1UOkoJKe7
|
||||
oIPs1nqza3Wwyox+N68BL82gAcnDQKf8PqirKeuz3GWuDTB9BOse7ZzZyhbb/dmQ
|
||||
yhZoIAJAXmSHzzU+43s0lg0vvrUgR37xBtF1ABEBAAG0GmdlbmppeCA8Z2Vuaml4
|
||||
QHJpc2V1cC5uZXQ+iQE4BBMBAgAiBQJM1GOdAhsDBgsJCAcDAgYVCAIJCgsEFgID
|
||||
AQIeAQIXgAAKCRB/J72cY0/sZ0kmCACDE+dZyx2PnQDgEwmtVLw25HhY/1/k1YLn
|
||||
E/ghLYq6dJ1majbFf0ZhA6ilPxVwDmY/lAZSfpDKHT62L1SnreytRlwXPljmVVU5
|
||||
9Fl20alBmndReegVHZZ4C/fG6vKjdIISG/78+7POQuj6cI5EDSIf3vBurX74L55m
|
||||
ECZEUJSwsTNHTmFm9baq3ZWS3gLsEN2ebHWjFluXe3k5lLUqQCSCDTy3OrxA8iMs
|
||||
cysKyuvU600+gmbZzTPIUHotXvnZ7Yqok3hRoKOdNKfyjl0O/gyQxLXKbunfu1zQ
|
||||
qvwZ2xG6EIB030Iuf4W+vkwA7sT4KspjjPDs0+5ZvYDIt8pbLQ83uQENBEzUY50B
|
||||
CADUoYzqB/9POict+V5W7EX+lgRccyMwoW8/rKs3NgJAfAJKdMabItg1dyt3Sfjm
|
||||
xazGkqy/fnL91nkVUFI+/BJ3+UTtxrmr3bHOuQt6Jwg1xYp1F7YJImbXqHY9quUJ
|
||||
o2oiSpe2+Pijh3LeZok38WOOylzd225sOhiPQQP4VE83rMEfrPwpKOZOzwov9spZ
|
||||
/0UqkmzD4Y+sw59DFc6g3f+VLHfSB/UEaV83Hara4dkQnCo5atTnzJKywX92G9u7
|
||||
cLV/i7rRv1J6CuRoH3VbHvHjC+cQ2I5dAVJcCsLw9IeeRxlXnlIye8UyCHxsxCuI
|
||||
xZYpRySRpcNHms+tLdcigNvhABEBAAGJAR8EGAECAAkFAkzUY50CGwwACgkQfye9
|
||||
nGNP7GdmmAf/eEaTc7rMztuk8+HHis0+Ik98o5UjzZDADeS38HZQc4th4Wg9kz8V
|
||||
IQhEdPb0SgLX15HI521nYkaixvt66jIHqJmRIThMy5KyyXmojEe3yO5xNqC2UTG4
|
||||
SLT7f4Pl94O/r9s+QnKxPk1xy4R/MswtgIweQeKCztmA3EBpiTjmQ4SYClKL6tmb
|
||||
S+7NsH7RYyn0nRi/Id8e6Dc9/3L3QrAdIQ7bgEtfs9NZsjfFJ+TIzVBvj9Wu8K8R
|
||||
jrlMqGwck/OCfwkEiuygrmt6mPGAfczW+KwtaxXfjhioTCcIsQMVXJcZfMUji+F1
|
||||
xkC+6EY7tE9A1Topar+QTGBvDr8Tqp6N0Q==
|
||||
=Fmpn
|
||||
-----END PGP PUBLIC KEY BLOCK-----
|
||||
BIN
img/blockchain.png
Normal file
BIN
img/blockchain.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 21 KiB |
BIN
img/gavin.png
Normal file
BIN
img/gavin.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 855 B |
BIN
img/genjix.png
Normal file
BIN
img/genjix.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 742 B |
BIN
img/ico-osx-uni.png
Normal file
BIN
img/ico-osx-uni.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.2 KiB |
BIN
img/ico-tux.png
Normal file
BIN
img/ico-tux.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 495 B |
BIN
img/ico-win.png
Normal file
BIN
img/ico-win.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 738 B |
BIN
img/logo_small.png
Normal file
BIN
img/logo_small.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.5 KiB |
233
index.html
Normal file
233
index.html
Normal file
|
|
@ -0,0 +1,233 @@
|
|||
---
|
||||
DOWNLOAD_VERSION: 0.3.24
|
||||
---
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>Bitcoin - P2P digital currency</title>
|
||||
<meta name="description" content="">
|
||||
<meta name="author" content="">
|
||||
|
||||
<!-- Le HTML5 shim, for IE6-8 support of HTML elements -->
|
||||
<!--[if lt IE 9]>
|
||||
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
|
||||
<![endif]-->
|
||||
|
||||
<!-- scripting -->
|
||||
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
|
||||
<script src="lib/app.js"></script>
|
||||
|
||||
|
||||
<!-- stylesheet -->
|
||||
<link rel="stylesheet/less" href="lib/bootstrap.less">
|
||||
<script src="lib/less.js"></script>
|
||||
|
||||
<!-- fav and touch icons -->
|
||||
<link rel="shortcut icon" href="favicon.ico">
|
||||
<!--
|
||||
<link rel="apple-touch-icon" href="images/apple-touch-icon.png">
|
||||
<link rel="apple-touch-icon" sizes="72x72" href="images/apple-touch-icon-72x72.png">
|
||||
<link rel="apple-touch-icon" sizes="114x114" href="images/apple-touch-icon-114x114.png">
|
||||
-->
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<div class="topbar">
|
||||
<div class="fill">
|
||||
<div class="container">
|
||||
<h3><a href="#"><img src="img/logo_small.png" id="thelogo"/>Bitcoin</a></h3>
|
||||
<ul>
|
||||
<li class="active"><a href="#masthead">Home</a></li>
|
||||
<li><a href="#about">About</a></li>
|
||||
<li><a href="#features">Features</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="masthead">
|
||||
<div class="inner">
|
||||
<div class="container">
|
||||
|
||||
<div class="row">
|
||||
<div class="span11 primarybox">
|
||||
<h1>Bitcoin <small>P2P Digital Currency</small></h1>
|
||||
<p>
|
||||
Bitcoin is a peer-to-peer digital currency <a href="bitcoin.pdf">created in 2009 by Satoshi Nakamoto</a>.
|
||||
Peer-to-peer means that no central authority issues new money or manages transactions—these tasks are carried out collectively by the network.
|
||||
It is also the name of the open source software designed in order to use this currency.
|
||||
</p>
|
||||
<p>The <a href="https://en.bitcoin.it/wiki/Original_Bitcoin_client">software</a> is a community-driven open source project, released under the <a href="http://creativecommons.org/licenses/MIT/">MIT license</a>.</p>
|
||||
<p>
|
||||
<a class="btn primary large" href="http://www.weusecoins.com/">Learn how to use Bitcoin »</a>
|
||||
|
||||
<a class="btn primary large" href="#about">Learn about Bitcoin's technology »</a>
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="span5">
|
||||
<section id="download">
|
||||
<h2>Download</h2>
|
||||
|
||||
<p>
|
||||
<strong>Latest version:</strong> {{ page.DOWNLOAD_VERSION }}
|
||||
</p>
|
||||
|
||||
<ul class="unstyled">
|
||||
<li><a href="http://sourceforge.net/projects/bitcoin/files/Bitcoin/bitcoin-{{ page.DOWNLOAD_VERSION }}/bitcoin-{{ page.DOWNLOAD_VERSION }}-win32.zip/download">
|
||||
<img src="img/ico-win.png" class="icon"/>Windows (zip)</a> <small>5.8MB</small>
|
||||
</li>
|
||||
<li><a href="http://sourceforge.net/projects/bitcoin/files/Bitcoin/bitcoin-{{ page.DOWNLOAD_VERSION }}/bitcoin-{{ page.DOWNLOAD_VERSION }}-win32-setup.exe/download">
|
||||
<img src="img/ico-win.png" class="icon"/>Windows (exe)</a> <small>5.8MB</small>
|
||||
</li>
|
||||
<li><a href="http://sourceforge.net/projects/bitcoin/files/Bitcoin/bitcoin-{{ page.DOWNLOAD_VERSION }}/bitcoin-{{ page.DOWNLOAD_VERSION }}-linux.tar.gz/download">
|
||||
<img src="img/ico-tux.png" class="icon"/>Linux</a> <small>9.8MB</small>
|
||||
</li>
|
||||
<li><a href="http://sourceforge.net/projects/bitcoin/files/Bitcoin/bitcoin-{{ page.DOWNLOAD_VERSION }}/bitcoin-{{ page.DOWNLOAD_VERSION }}-macosx.zip/download">
|
||||
<img src="img/ico-osx-uni.png" class="icon">Mac OS X</a> <small>7.7MB</small>
|
||||
</li>
|
||||
<li>or get the <a href="https://github.com/bitcoin/bitcoin">source code</a> (GitHub)</li>
|
||||
</ul>
|
||||
</section>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="overview">
|
||||
<div class="container main">
|
||||
<div class="row">
|
||||
<div class="span4">
|
||||
<h2>Resources</h2>
|
||||
|
||||
<ul>
|
||||
<li><a href="http://www.weusecoins.com">We Use Coins. Start here!</a></li>
|
||||
<li><a href="https://bitcoin.it/wiki/FAQ">FAQ</a></li>
|
||||
<li><a href="https://bitcoin.it/">Wiki / Help</a></li>
|
||||
<li><a href="http://www.google.com/?q=bitcoin+forums#sclient=psy&hl=en&site=&source=hp&q=bitcoin+forums&btnK=Google+Search&aq=f&aqi=&aql=&oq=bitcoin+forums">Forums</a></li>
|
||||
<li><a href="https://bitcoin.it/wiki/Trade">Sites That Accept Bitcoin</a></li>
|
||||
<li><a href="https://en.bitcoin.it/wiki/Merchant_Howto">Merchant Howto</a></li>
|
||||
<li><a href="http://bitcoincharts.com/">Bitcoin Charts / Markets</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="span6">
|
||||
<h2>Developers</h2>
|
||||
|
||||
<ul>
|
||||
<li>Satoshi Nakamoto</li>
|
||||
<li>Gavin Andresen - <img class="email" src="img/gavin.png"/> (<a href="/gavinandresen.txt">PGP</a>)</li>
|
||||
<li>Amir Taaki - <img class="email" src="img/genjix.png"/> (<a href="/genjix.gpg">PGP</a>)</li>
|
||||
<li>Pieter Wuille</li>
|
||||
<li>Nils Schneider - <a href="mailto:nils.schneider@gmail.com">nils.schneider@gmail.com</a></li>
|
||||
<li>Jeff Garzik - <a href="mailto:jgarzik@exmulti.com">jgarzik@exmulti.com</a> (<a href="jgarzik-exmulti.asc">PGP</a>)</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="span6">
|
||||
<h2>Community</h2>
|
||||
<ul>
|
||||
<li>Visit the unofficial <a
|
||||
href="http://www.google.com/?q=bitcoin+forums#sclient=psy&hl=en&site=&source=hp&q=bitcoin+forums&btnK=Google+Search&aq=f&aqi=&aql=&oq=bitcoin+forums">Bitcoin Forums</a></li>
|
||||
<li>Join the project's lively IRC channels on the <a href="http://freenode.net/">FreeNode</a> network or use the <a href="http://webchat.freenode.net/?channels=bitcoin&uio=d4">FreeNode Web IRC</a>.
|
||||
<ul>
|
||||
<li><strong>#bitcoin</strong> (General Bitcoin-related)</li>
|
||||
<li><strong>#bitcoin-dev</strong> (Development and technical)</li>
|
||||
<li><strong>#bitcoin-otc-foyer</strong> (Over The Counter exchange)</li>
|
||||
<li><strong>#bitcoin-market</strong> (Live quotes from markets)</li>
|
||||
<li><strong>#bitcoin-mining</strong> (GPU mining related)</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><a href="http://twitter.com/#!/search/bitcoin">Twitter Search</a></li>
|
||||
<li><a href="https://www.facebook.com/pages/Bitcoin-P2P-Cryptocurrency/134466763256650">Facebook Page</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div> <!-- /container -->
|
||||
|
||||
</div> <!-- /overview -->
|
||||
|
||||
<div class="container">
|
||||
<section id="about">
|
||||
<h1>About Bitcoin</h1>
|
||||
<div class="row">
|
||||
<div class="span10">
|
||||
<h2>Introduction</h2>
|
||||
|
||||
<p>Bitcoin is one of the first implementations of a concept called crypto-currency, which was first described in 1998 by Wei Dai on the cypherpunks mailing list. Building upon the notion that money is any object, or any sort of record, accepted as payment for goods and services and repayment of debts in a given country or socio-economic context, Bitcoin is designed around the idea of using cryptography to control the creation and transfer of money, rather than relying on central authorities.</p>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="span6">
|
||||
<h2>Technology</h2>
|
||||
|
||||
<p>If you are interested to learn more about the technical details of Bitcoin it is recommended to start with these documents:</p>
|
||||
|
||||
<ul>
|
||||
<li><a href="bitcoin.pdf">Bitcoin: A Peer-to-Peer Electronic Cash System</a></li>
|
||||
<li><a href="https://en.bitcoin.it/wiki/Protocol_rules">Protocol rules</a></li>
|
||||
<li><a href="https://en.bitcoin.it/wiki/Category:Technical">Bitcoin wiki</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section id="features">
|
||||
<h1>Features</h1>
|
||||
|
||||
<div class="row">
|
||||
<div class="span12">
|
||||
|
||||
<p>These are the basic features of any Bitcoin-like network.</p>
|
||||
|
||||
<ul>
|
||||
<li>Bitcoins can be transferred between arbitary nodes on the network.</li>
|
||||
<li>Transactions are irreversible.</li>
|
||||
<li>Double spending is prevented by using a <a href="https://en.bitcoin.it/wiki/Block_chain">block chain</a>.</li>
|
||||
<li>Transactions are broadcasted within seconds and <a href="https://en.bitcoin.it/wiki/FAQ#Why_do_I_have_to_wait_10_minutes_before_I_can_spend_money_I_received.3F">verified within 10 to 60 minutes</a>.</li>
|
||||
<li>Transactions are received while the computer is turned off.</li>
|
||||
</ul>
|
||||
|
||||
<h2>Economic rules</h2>
|
||||
|
||||
<p>These rules are enforced collectively by the network. While they will not change for Bitcoin, other digital currencies using Bitcoin's technology may change them to suit their needs.</p>
|
||||
|
||||
<ul>
|
||||
<li>Hard limit of 20999999.97690000 Bitcoins.</li>
|
||||
<li>Bitcoins are divisible to 8 decimal places yielding a total of approx. 21×10<sup>14</sup> currency units.</li>
|
||||
<li>Transactions are cheap, and mostly free (<a href="https://en.bitcoin.it/wiki/Transaction_fees">Transaction fees</a>).</li>
|
||||
</ul>
|
||||
|
||||
<h2>Features of the Bitcoin network</h2>
|
||||
|
||||
<p>The network is running for more than 32 months yielding to some impressive security features.</p>
|
||||
|
||||
<ul>
|
||||
<li>Long block chain (more than 140.000 blocks) with lots of processing power securing transactions.</li>
|
||||
<li>Only one major <a href="https://en.bitcoin.it/wiki/Incidents#Value_overflow">incident</a> (fixed in August 2010).</li>
|
||||
</ul>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="span4">
|
||||
</div>
|
||||
|
||||
</section>
|
||||
</div>
|
||||
|
||||
<div class="container">
|
||||
<footer>
|
||||
<div class="inner">
|
||||
<p>
|
||||
© Bitcoin Project 2009–2011<br/>
|
||||
Released under the <a href="http://creativecommons.org/licenses/MIT/">MIT license</a>
|
||||
</p>
|
||||
</div>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
52
jgarzik-exmulti.asc
Normal file
52
jgarzik-exmulti.asc
Normal file
|
|
@ -0,0 +1,52 @@
|
|||
-----BEGIN PGP PUBLIC KEY BLOCK-----
|
||||
Version: GnuPG v1.4.11 (GNU/Linux)
|
||||
|
||||
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
|
||||
NLjdrUdMDpqp0wYi
|
||||
=/xuc
|
||||
-----END PGP PUBLIC KEY BLOCK-----
|
||||
41
lib/app.js
Normal file
41
lib/app.js
Normal file
|
|
@ -0,0 +1,41 @@
|
|||
$(document).ready(function(){
|
||||
|
||||
// scroll spy logic
|
||||
// ================
|
||||
|
||||
var activeTarget,
|
||||
position = {},
|
||||
$window = $(window),
|
||||
nav = $('body > .topbar li a'),
|
||||
targets = nav.map(function () {
|
||||
return $(this).attr('href');
|
||||
}),
|
||||
offsets = $.map(targets, function (id) {
|
||||
return $(id).offset().top;
|
||||
});
|
||||
|
||||
|
||||
function setButton(id) {
|
||||
nav.parent("li").removeClass('active');
|
||||
$(nav[$.inArray(id, targets)]).parent("li").addClass('active');
|
||||
}
|
||||
|
||||
function processScroll(e) {
|
||||
var scrollTop = $window.scrollTop() + 10, i;
|
||||
for (i = offsets.length; i--;) {
|
||||
if (activeTarget != targets[i] && scrollTop >= offsets[i] && (!offsets[i + 1] || scrollTop <= offsets[i + 1])) {
|
||||
activeTarget = targets[i];
|
||||
setButton(activeTarget);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
nav.click(function () {
|
||||
processScroll();
|
||||
});
|
||||
|
||||
processScroll();
|
||||
|
||||
$window.scroll(processScroll);
|
||||
|
||||
});
|
||||
92
lib/bitcoin.less
Normal file
92
lib/bitcoin.less
Normal file
|
|
@ -0,0 +1,92 @@
|
|||
/* bitcoin.less
|
||||
* site specific styles
|
||||
* ---------------------------------------------------------------------------------------- */
|
||||
|
||||
img.icon {
|
||||
margin-right: 8px;
|
||||
vertical-align: bottom;
|
||||
}
|
||||
|
||||
/* body, html, footer {
|
||||
background: @bgColor;
|
||||
color: #fff;
|
||||
}*/
|
||||
|
||||
.overview {
|
||||
background: #f5f5f5;
|
||||
padding-top: 2em;
|
||||
border-bottom: 1px solid #eee;
|
||||
}
|
||||
|
||||
#download {
|
||||
background: #fafafa;
|
||||
color: #333;
|
||||
.well;
|
||||
}
|
||||
|
||||
#masthead {
|
||||
#gradient > .vertical(#004D9F, #049CD9);
|
||||
|
||||
.inner {
|
||||
box-shadow: inset 0 10px 30px rgba(0, 0, 0, 0.1);
|
||||
background-image: url(innerbg.png);
|
||||
}
|
||||
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
#masthead {
|
||||
.inner {
|
||||
padding-top: 60px;
|
||||
}
|
||||
|
||||
.primarybox {
|
||||
p {
|
||||
line-height: 2em;
|
||||
}
|
||||
|
||||
p, h1, h2, h3, h4 {
|
||||
color: #fff;
|
||||
text-shadow: 0 1px 2px rgba(0, 0, 0, .5);
|
||||
|
||||
small {
|
||||
color: #eee;
|
||||
}
|
||||
}
|
||||
|
||||
a {
|
||||
font-weight: bold;
|
||||
color: #fff;
|
||||
|
||||
&:hover {
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
footer {
|
||||
padding-bottom: 6em;
|
||||
|
||||
background: transparent url(../img/blockchain.png) right 10px no-repeat;
|
||||
}
|
||||
|
||||
img.logo {
|
||||
vertical-align: middle;
|
||||
position: absolute;
|
||||
left: -80px;
|
||||
z-index: 100;
|
||||
}
|
||||
|
||||
section {
|
||||
padding-top: 60px;
|
||||
}
|
||||
|
||||
.right {
|
||||
float: right;
|
||||
}
|
||||
|
||||
#thelogo {
|
||||
vertical-align: top;
|
||||
margin-right: 4px;
|
||||
}
|
||||
24
lib/bootstrap.less
vendored
Normal file
24
lib/bootstrap.less
vendored
Normal file
|
|
@ -0,0 +1,24 @@
|
|||
/*!
|
||||
* Bootstrap v1.1.1
|
||||
*
|
||||
* Copyright 2011 Twitter, Inc
|
||||
* Licensed under the Apache License v2.0
|
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
*
|
||||
* Designed and built with all the love in the world @twitter by @mdo and @fat.
|
||||
* Date: @DATE
|
||||
*/
|
||||
|
||||
// CSS Reset
|
||||
@import "reset.less";
|
||||
|
||||
// Core
|
||||
@import "preboot.less";
|
||||
@import "scaffolding.less";
|
||||
|
||||
// Styled patterns and elements
|
||||
@import "type.less";
|
||||
@import "forms.less";
|
||||
@import "tables.less";
|
||||
@import "patterns.less";
|
||||
@import "bitcoin.less";
|
||||
369
lib/forms.less
Normal file
369
lib/forms.less
Normal file
|
|
@ -0,0 +1,369 @@
|
|||
/* Forms.less
|
||||
* Base styles for various input types, form layouts, and states
|
||||
* ------------------------------------------------------------- */
|
||||
|
||||
|
||||
// FORM STYLES
|
||||
// -----------
|
||||
|
||||
form {
|
||||
margin-bottom: @baseline;
|
||||
}
|
||||
|
||||
// Groups of fields with labels on top (legends)
|
||||
fieldset {
|
||||
margin-bottom: @baseline;
|
||||
padding-top: @baseline;
|
||||
legend {
|
||||
display: block;
|
||||
margin-left: 150px;
|
||||
font-size: 20px;
|
||||
line-height: 1;
|
||||
*margin: 0 0 5px 145px; /* IE6-7 */
|
||||
*line-height: 1.5; /* IE6-7 */
|
||||
color: @grayDark;
|
||||
}
|
||||
}
|
||||
|
||||
// Parent element that clears floats and wraps labels and fields together
|
||||
.clearfix {
|
||||
margin-bottom: @baseline;
|
||||
}
|
||||
|
||||
// Set font for forms
|
||||
label,
|
||||
input,
|
||||
select,
|
||||
textarea {
|
||||
#font > .sans-serif(normal,13px,normal);
|
||||
}
|
||||
|
||||
// Float labels left
|
||||
label {
|
||||
padding-top: 6px;
|
||||
font-size: 13px;
|
||||
line-height: 18px;
|
||||
float: left;
|
||||
width: 130px;
|
||||
text-align: right;
|
||||
color: @grayDark;
|
||||
}
|
||||
|
||||
// Shift over the inside div to align all label's relevant content
|
||||
div.input {
|
||||
margin-left: 150px;
|
||||
}
|
||||
|
||||
// Checkboxs and radio buttons
|
||||
input[type=checkbox],
|
||||
input[type=radio] {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
// Inputs, Textareas, Selects
|
||||
input[type=text],
|
||||
input[type=password],
|
||||
textarea,
|
||||
select,
|
||||
.uneditable-input {
|
||||
display: inline-block;
|
||||
width: 210px;
|
||||
padding: 4px;
|
||||
font-size: 13px;
|
||||
line-height: @baseline;
|
||||
height: @baseline;
|
||||
color: @gray;
|
||||
border: 1px solid #ccc;
|
||||
.border-radius(3px);
|
||||
}
|
||||
select,
|
||||
input[type=file] {
|
||||
height: @baseline * 1.5;
|
||||
line-height: @baseline * 1.5;
|
||||
}
|
||||
textarea {
|
||||
height: auto;
|
||||
}
|
||||
.uneditable-input {
|
||||
background-color: #eee;
|
||||
display: block;
|
||||
border-color: #ccc;
|
||||
.box-shadow(inset 0 1px 2px rgba(0,0,0,.075));
|
||||
}
|
||||
|
||||
// Placeholder text gets special styles; can't be bundled together though for some reason
|
||||
:-moz-placeholder {
|
||||
color: @grayLight;
|
||||
}
|
||||
::-webkit-input-placeholder {
|
||||
color: @grayLight;
|
||||
}
|
||||
|
||||
// Focus states
|
||||
input[type=text],
|
||||
input[type=password],
|
||||
select, textarea {
|
||||
@transition: border linear .2s, box-shadow linear .2s;
|
||||
.transition(@transition);
|
||||
.box-shadow(inset 0 1px 3px rgba(0,0,0,.1));
|
||||
}
|
||||
input[type=text]:focus,
|
||||
input[type=password]:focus,
|
||||
textarea:focus {
|
||||
outline: none;
|
||||
border-color: rgba(82,168,236,.8);
|
||||
@shadow: inset 0 1px 3px rgba(0,0,0,.1), 0 0 8px rgba(82,168,236,.6);
|
||||
.box-shadow(@shadow);
|
||||
}
|
||||
|
||||
// Error styles
|
||||
form div.error {
|
||||
background: lighten(@red, 57%);
|
||||
padding: 10px 0;
|
||||
margin: -10px 0 10px;
|
||||
.border-radius(4px);
|
||||
@error-text: desaturate(lighten(@red, 25%), 25%);
|
||||
> label,
|
||||
span.help-inline,
|
||||
span.help-block {
|
||||
color: @red;
|
||||
}
|
||||
input[type=text],
|
||||
input[type=password],
|
||||
textarea {
|
||||
border-color: @error-text;
|
||||
.box-shadow(0 0 3px rgba(171,41,32,.25));
|
||||
&:focus {
|
||||
border-color: darken(@error-text, 10%);
|
||||
.box-shadow(0 0 6px rgba(171,41,32,.5));
|
||||
}
|
||||
}
|
||||
.input-prepend,
|
||||
.input-append {
|
||||
span.add-on {
|
||||
background: lighten(@red, 50%);
|
||||
border-color: @error-text;
|
||||
color: darken(@error-text, 10%);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Form element sizes
|
||||
.input-mini, input.mini, textarea.mini, select.mini {
|
||||
width: 60px;
|
||||
}
|
||||
.input-small, input.small, textarea.small, select.small {
|
||||
width: 90px;
|
||||
}
|
||||
.input-medium, input.medium, textarea.medium, select.medium {
|
||||
width: 150px;
|
||||
}
|
||||
.input-large, input.large, textarea.large, select.large {
|
||||
width: 210px;
|
||||
}
|
||||
.input-xlarge, input.xlarge, textarea.xlarge, select.xlarge {
|
||||
width: 270px;
|
||||
}
|
||||
.input-xxlarge, input.xxlarge, textarea.xxlarge, select.xxlarge {
|
||||
width: 530px;
|
||||
}
|
||||
textarea.xxlarge {
|
||||
overflow-y: scroll;
|
||||
}
|
||||
|
||||
// Turn off focus for disabled (read-only) form elements
|
||||
input[readonly]:focus,
|
||||
textarea[readonly]:focus,
|
||||
input.disabled {
|
||||
background: #f5f5f5;
|
||||
border-color: #ddd;
|
||||
.box-shadow(none);
|
||||
}
|
||||
|
||||
// Actions (the buttons)
|
||||
.actions {
|
||||
background: #f5f5f5;
|
||||
margin-top: @baseline;
|
||||
margin-bottom: @baseline;
|
||||
padding: (@baseline - 1) 20px @baseline 150px;
|
||||
border-top: 1px solid #ddd;
|
||||
.border-radius(0 0 3px 3px);
|
||||
.secondary-action {
|
||||
float: right;
|
||||
a {
|
||||
line-height: 30px;
|
||||
&:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Help Text
|
||||
.help-inline,
|
||||
.help-block {
|
||||
font-size: 12px;
|
||||
line-height: @baseline;
|
||||
color: @grayLight;
|
||||
}
|
||||
.help-inline {
|
||||
padding-left: 5px;
|
||||
*position: relative; /* IE6-7 */
|
||||
*top: -5px; /* IE6-7 */
|
||||
}
|
||||
|
||||
// Big blocks of help text
|
||||
.help-block {
|
||||
display: block;
|
||||
max-width: 600px;
|
||||
}
|
||||
|
||||
// Inline Fields (input fields that appear as inline objects
|
||||
.inline-inputs {
|
||||
color: @gray;
|
||||
span, input[type=text] {
|
||||
display: inline-block;
|
||||
}
|
||||
input.mini {
|
||||
width: 60px;
|
||||
}
|
||||
input.small {
|
||||
width: 90px;
|
||||
}
|
||||
span {
|
||||
padding: 0 2px 0 1px;
|
||||
}
|
||||
}
|
||||
|
||||
// Allow us to put symbols and text within the input field for a cleaner look
|
||||
.input-prepend,
|
||||
.input-append {
|
||||
input[type=text],
|
||||
input[type=password] {
|
||||
.border-radius(0 3px 3px 0);
|
||||
}
|
||||
.add-on {
|
||||
background: #f5f5f5;
|
||||
float: left;
|
||||
display: block;
|
||||
width: auto;
|
||||
min-width: 16px;
|
||||
padding: 4px 4px 4px 5px;
|
||||
color: @grayLight;
|
||||
font-weight: normal;
|
||||
line-height: 18px;
|
||||
height: 18px;
|
||||
text-align: center;
|
||||
text-shadow: 0 1px 0 #fff;
|
||||
border: 1px solid #ccc;
|
||||
border-right-width: 0;
|
||||
.border-radius(3px 0 0 3px);
|
||||
}
|
||||
.active {
|
||||
background: lighten(@green, 30);
|
||||
border-color: @green;
|
||||
}
|
||||
}
|
||||
.input-prepend {
|
||||
.add-on {
|
||||
*margin-top: 1px; /* IE6-7 */
|
||||
}
|
||||
}
|
||||
.input-append {
|
||||
input[type=text],
|
||||
input[type=password] {
|
||||
float: left;
|
||||
.border-radius(3px 0 0 3px);
|
||||
}
|
||||
.add-on {
|
||||
.border-radius(0 3px 3px 0);
|
||||
border-right-width: 1px;
|
||||
border-left-width: 0;
|
||||
}
|
||||
}
|
||||
|
||||
// Stacked options for forms (radio buttons or checkboxes)
|
||||
.inputs-list {
|
||||
margin: 0 0 5px;
|
||||
width: 100%;
|
||||
li {
|
||||
display: block;
|
||||
padding: 0;
|
||||
width: 100%;
|
||||
label {
|
||||
display: block;
|
||||
float: none;
|
||||
width: auto;
|
||||
padding: 0;
|
||||
line-height: @baseline;
|
||||
text-align: left;
|
||||
white-space: normal;
|
||||
strong {
|
||||
color: @gray;
|
||||
}
|
||||
small {
|
||||
font-size: 12px;
|
||||
font-weight: normal;
|
||||
}
|
||||
}
|
||||
ul.inputs-list {
|
||||
margin-left: 25px;
|
||||
margin-bottom: 10px;
|
||||
padding-top: 0;
|
||||
}
|
||||
&:first-child {
|
||||
padding-top: 5px;
|
||||
}
|
||||
}
|
||||
input[type=radio],
|
||||
input[type=checkbox] {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
|
||||
// Stacked forms
|
||||
.form-stacked {
|
||||
padding-left: 20px;
|
||||
fieldset {
|
||||
padding-top: @baseline / 2;
|
||||
}
|
||||
legend {
|
||||
margin-left: 0;
|
||||
}
|
||||
label {
|
||||
display: block;
|
||||
float: none;
|
||||
width: auto;
|
||||
font-weight: bold;
|
||||
text-align: left;
|
||||
line-height: 20px;
|
||||
padding-top: 0;
|
||||
}
|
||||
.clearfix {
|
||||
margin-bottom: @baseline / 2;
|
||||
div.input {
|
||||
margin-left: 0;
|
||||
}
|
||||
}
|
||||
.inputs-list {
|
||||
margin-bottom: 0;
|
||||
li {
|
||||
padding-top: 0;
|
||||
label {
|
||||
font-weight: normal;
|
||||
padding-top: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
div.error {
|
||||
padding-top: 10px;
|
||||
padding-bottom: 10px;
|
||||
padding-left: 10px;
|
||||
margin-top: 0;
|
||||
margin-left: -10px;
|
||||
}
|
||||
.actions {
|
||||
margin-left: -20px;
|
||||
padding-left: 20px;
|
||||
}
|
||||
}
|
||||
BIN
lib/innerbg.png
Normal file
BIN
lib/innerbg.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 145 B |
16
lib/less.js
Normal file
16
lib/less.js
Normal file
File diff suppressed because one or more lines are too long
751
lib/patterns.less
Normal file
751
lib/patterns.less
Normal file
|
|
@ -0,0 +1,751 @@
|
|||
/* Patterns.less
|
||||
* Repeatable UI elements outside the base styles provided from the scaffolding
|
||||
* ---------------------------------------------------------------------------- */
|
||||
|
||||
|
||||
// TOPBAR
|
||||
// ------
|
||||
|
||||
// Topbar for Branding and Nav
|
||||
.topbar {
|
||||
height: 40px;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
z-index: 10000;
|
||||
overflow: visible;
|
||||
|
||||
// gradient is applied to it's own element because overflow visible is not honored by ie when filter is present
|
||||
.fill {
|
||||
background:#222;
|
||||
#gradient > .vertical(#333, #222);
|
||||
@shadow: 0 1px 3px rgba(0,0,0,.25), inset 0 -1px 0 rgba(0,0,0,.1);
|
||||
.box-shadow(@shadow);
|
||||
}
|
||||
|
||||
// Links get text shadow
|
||||
a {
|
||||
color: @grayLight;
|
||||
text-shadow: 0 -1px 0 rgba(0,0,0,.25);
|
||||
}
|
||||
|
||||
// Hover and active states
|
||||
a:hover,
|
||||
ul li.active a {
|
||||
background-color: #333;
|
||||
background-color: rgba(255,255,255,.05);
|
||||
color: @white;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
// Website name
|
||||
h3 {
|
||||
position:relative;
|
||||
a {
|
||||
float: left;
|
||||
display: block;
|
||||
padding: 8px 20px 12px;
|
||||
margin-left: -20px; // negative indent to left-align the text down the page
|
||||
color: @white;
|
||||
font-size: 20px;
|
||||
font-weight: 200;
|
||||
line-height: 1;
|
||||
}
|
||||
}
|
||||
|
||||
// Search Form
|
||||
form {
|
||||
float: left;
|
||||
margin: 5px 0 0 0;
|
||||
position: relative;
|
||||
.opacity(100);
|
||||
input {
|
||||
background-color: #444;
|
||||
background-color: rgba(255,255,255,.3);
|
||||
#font > .sans-serif(13px, normal, 1);
|
||||
width: 220px;
|
||||
padding: 4px 9px;
|
||||
color: #fff;
|
||||
color: rgba(255,255,255,.75);
|
||||
border: 1px solid #111;
|
||||
.border-radius(4px);
|
||||
@shadow: inset 0 1px 2px rgba(0,0,0,.1), 0 1px 0px rgba(255,255,255,.25);
|
||||
.box-shadow(@shadow);
|
||||
.transition(none);
|
||||
|
||||
// Placeholder text gets special styles; can't be bundled together though for some reason
|
||||
&:-moz-placeholder {
|
||||
color: @grayLighter;
|
||||
}
|
||||
&::-webkit-input-placeholder {
|
||||
color: @grayLighter;
|
||||
}
|
||||
// Hover states
|
||||
&:hover {
|
||||
background-color: @grayLight;
|
||||
background-color: rgba(255,255,255,.5);
|
||||
color: #fff;
|
||||
}
|
||||
// Focus states (we use .focused since IE8 and down doesn't support :focus)
|
||||
&:focus,
|
||||
&.focused {
|
||||
outline: none;
|
||||
background-color: #fff;
|
||||
color: @grayDark;
|
||||
text-shadow: 0 1px 0 #fff;
|
||||
border: 0;
|
||||
padding: 5px 10px;
|
||||
.box-shadow(0 0 3px rgba(0,0,0,.15));
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Navigation
|
||||
ul {
|
||||
display: block;
|
||||
float: left;
|
||||
margin: 0 10px 0 0;
|
||||
position: relative;
|
||||
&.secondary-nav {
|
||||
float: right;
|
||||
margin-left: 10px;
|
||||
margin-right: 0;
|
||||
}
|
||||
li {
|
||||
display: block;
|
||||
float: left;
|
||||
font-size: 13px;
|
||||
a {
|
||||
display: block;
|
||||
float: none;
|
||||
padding: 10px 10px 11px;
|
||||
line-height: 19px;
|
||||
text-decoration: none;
|
||||
&:hover {
|
||||
color: #fff;
|
||||
text-decoration: none;
|
||||
}
|
||||
}
|
||||
&.active a {
|
||||
background-color: #222;
|
||||
background-color: rgba(0,0,0,.5);
|
||||
}
|
||||
}
|
||||
|
||||
// Dropdowns
|
||||
&.primary-nav li ul {
|
||||
left: 0;
|
||||
}
|
||||
&.secondary-nav li ul {
|
||||
right: 0;
|
||||
}
|
||||
li.menu {
|
||||
position: relative;
|
||||
a.menu {
|
||||
&:after {
|
||||
width: 0px;
|
||||
height: 0px;
|
||||
display: inline-block;
|
||||
content: "↓";
|
||||
text-indent: -99999px;
|
||||
vertical-align: top;
|
||||
margin-top: 8px;
|
||||
margin-left: 4px;
|
||||
border-left: 4px solid transparent;
|
||||
border-right: 4px solid transparent;
|
||||
border-top: 4px solid #fff;
|
||||
.opacity(50);
|
||||
}
|
||||
}
|
||||
&.open {
|
||||
a.menu,
|
||||
a:hover {
|
||||
background-color: #444;
|
||||
background-color: rgba(255,255,255,.1);
|
||||
*background-color: #444; /* IE6-7 */
|
||||
color: #fff;
|
||||
}
|
||||
ul {
|
||||
display: block;
|
||||
li {
|
||||
a {
|
||||
background-color: transparent;
|
||||
font-weight: normal;
|
||||
&:hover {
|
||||
background-color: rgba(255,255,255,.1);
|
||||
*background-color: #444; /* IE6-7 */
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
&.active a {
|
||||
background-color: rgba(255,255,255,.1);
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
li ul {
|
||||
background-color: #333;
|
||||
float: left;
|
||||
display: none;
|
||||
position: absolute;
|
||||
top: 40px;
|
||||
min-width: 160px;
|
||||
max-width: 220px;
|
||||
_width: 160px;
|
||||
margin-left: 0;
|
||||
margin-right: 0;
|
||||
padding: 0;
|
||||
text-align: left;
|
||||
border: 0;
|
||||
zoom: 1;
|
||||
.border-radius(0 0 5px 5px);
|
||||
.box-shadow(0 1px 2px rgba(0,0,0,0.6));
|
||||
li {
|
||||
float: none;
|
||||
clear: both;
|
||||
display: block;
|
||||
background: none;
|
||||
font-size: 12px;
|
||||
a {
|
||||
display: block;
|
||||
padding: 6px 15px;
|
||||
clear: both;
|
||||
font-weight: normal;
|
||||
line-height: 19px;
|
||||
color: #bbb;
|
||||
&:hover {
|
||||
background-color: #333;
|
||||
background-color: rgba(255,255,255,.25);
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
|
||||
// Dividers (basically an hr)
|
||||
&.divider {
|
||||
height: 1px;
|
||||
overflow: hidden;
|
||||
background: #222;
|
||||
background: rgba(0,0,0,.2);
|
||||
border-bottom: 1px solid rgba(255,255,255,.1);
|
||||
margin: 5px 0;
|
||||
}
|
||||
|
||||
// Section separaters
|
||||
span {
|
||||
clear: both;
|
||||
display: block;
|
||||
background: rgba(0,0,0,.2);
|
||||
padding: 6px 15px;
|
||||
cursor: default;
|
||||
color: @gray;
|
||||
border-top: 1px solid rgba(0,0,0,.2);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// PAGE HEADERS
|
||||
// ------------
|
||||
|
||||
.hero-unit {
|
||||
background-color: #f5f5f5;
|
||||
margin-top: 60px;
|
||||
margin-bottom: 30px;
|
||||
padding: 60px;
|
||||
.border-radius(6px);
|
||||
h1 {
|
||||
margin-bottom: 0;
|
||||
font-size: 60px;
|
||||
line-height: 1;
|
||||
letter-spacing: -1px;
|
||||
}
|
||||
p {
|
||||
font-size: 18px;
|
||||
font-weight: 200;
|
||||
line-height: @baseline * 1.5;
|
||||
}
|
||||
}
|
||||
footer {
|
||||
margin-top: @baseline - 1;
|
||||
padding-top: @baseline - 1;
|
||||
border-top: 1px solid #eee;
|
||||
}
|
||||
|
||||
// PAGE HEADERS
|
||||
// ------------
|
||||
|
||||
.page-header {
|
||||
margin-bottom: @baseline - 1;
|
||||
border-bottom: 1px solid #ddd;
|
||||
.box-shadow(0 1px 0 rgba(255,255,255,.5));
|
||||
h1 {
|
||||
margin-bottom: (@baseline / 2) - 1px;
|
||||
}
|
||||
}
|
||||
|
||||
// BUTTON STYLES
|
||||
// -------------
|
||||
|
||||
|
||||
// Base .btn styles
|
||||
.btn {
|
||||
// Button Base
|
||||
cursor: pointer;
|
||||
display: inline-block;
|
||||
#gradient > .vertical-three-colors(#fff, #fff, 0.25, darken(#fff, 10%));
|
||||
padding: 5px 14px 6px;
|
||||
text-shadow: 0 1px 1px rgba(255,255,255,.75);
|
||||
color: #333;
|
||||
font-size: 13px;
|
||||
line-height: normal;
|
||||
border: 1px solid #ccc;
|
||||
border-bottom-color: #bbb;
|
||||
.border-radius(4px);
|
||||
@shadow: inset 0 1px 0 rgba(255,255,255,.2), 0 1px 2px rgba(0,0,0,.05);
|
||||
.box-shadow(@shadow);
|
||||
|
||||
&:hover {
|
||||
background-position: 0 -15px;
|
||||
color: #333;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
// Primary Button Type
|
||||
&.primary {
|
||||
color:#fff;
|
||||
.gradientBar(@blue, @blueDark)
|
||||
}
|
||||
|
||||
// Transitions
|
||||
.transition(.1s linear all);
|
||||
|
||||
// Active and Disabled states
|
||||
&.disabled {
|
||||
cursor: default;
|
||||
background-image: none;
|
||||
.opacity(65);
|
||||
}
|
||||
|
||||
&:disabled {
|
||||
// disabled pseudo can't be included with .disabled
|
||||
// def because IE8 and below will drop it ;_;
|
||||
cursor: default;
|
||||
background-image: none;
|
||||
.opacity(65);
|
||||
}
|
||||
|
||||
&:active {
|
||||
@shadow: inset 0 3px 7px rgba(0,0,0,.1), 0 1px 2px rgba(0,0,0,.05);
|
||||
.box-shadow(@shadow);
|
||||
}
|
||||
|
||||
// Button Sizes
|
||||
&.large {
|
||||
font-size: 16px;
|
||||
line-height: normal;
|
||||
padding: 9px 14px 9px;
|
||||
.border-radius(6px);
|
||||
}
|
||||
|
||||
&.small {
|
||||
padding: 7px 9px 7px;
|
||||
font-size: 11px;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
// Help Firefox not be a jerk about adding extra padding to buttons
|
||||
button.btn,
|
||||
input[type=submit].btn {
|
||||
&::-moz-focus-inner {
|
||||
padding: 0;
|
||||
border: 0;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
// ERROR STYLES
|
||||
// ------------
|
||||
|
||||
// Base alert styles
|
||||
.alert-message {
|
||||
.gradientBar(#fceec1, #eedc94); // warning by default
|
||||
margin-bottom: @baseline;
|
||||
padding: 7px 14px;
|
||||
color: @grayDark;
|
||||
text-shadow: 0 1px 0 rgba(255,255,255,.5);
|
||||
border-width: 1px;
|
||||
border-style: solid;
|
||||
.border-radius(4px);
|
||||
.box-shadow(inset 0 1px 0 rgba(255,255,255,.25));
|
||||
|
||||
// Remove extra margin from content
|
||||
h5 {
|
||||
line-height: @baseline;
|
||||
}
|
||||
p {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
div {
|
||||
margin-top: 5px;
|
||||
margin-bottom: 2px;
|
||||
line-height: 28px;
|
||||
}
|
||||
.btn {
|
||||
// Provide actions with buttons
|
||||
.box-shadow(0 1px 0 rgba(255,255,255,.25));
|
||||
}
|
||||
.close {
|
||||
float: right;
|
||||
margin-top: -2px;
|
||||
color: @black;
|
||||
font-size: 20px;
|
||||
font-weight: bold;
|
||||
text-shadow: 0 1px 0 rgba(255,255,255,1);
|
||||
.opacity(20);
|
||||
&:hover {
|
||||
color: @black;
|
||||
text-decoration: none;
|
||||
.opacity(40);
|
||||
}
|
||||
}
|
||||
|
||||
&.block-message {
|
||||
background-image: none;
|
||||
background-color: lighten(#fceec1, 5%);
|
||||
padding: 14px;
|
||||
border-color: #fceec1;
|
||||
.box-shadow(none);
|
||||
|
||||
p {
|
||||
margin-right: 30px;
|
||||
}
|
||||
.alert-actions {
|
||||
margin-top: 5px;
|
||||
}
|
||||
&.error,
|
||||
&.success,
|
||||
&.info {
|
||||
color: @grayDark;
|
||||
text-shadow: 0 1px 0 rgba(255,255,255,.5);
|
||||
}
|
||||
&.error {
|
||||
background-color: lighten(#f56a66, 25%);
|
||||
border-color: lighten(#f56a66, 20%);
|
||||
}
|
||||
&.success {
|
||||
background-color: lighten(#62c462, 30%);
|
||||
border-color: lighten(#62c462, 25%);
|
||||
}
|
||||
&.info {
|
||||
background-color: lighten(#6bd0ee, 25%);
|
||||
border-color: lighten(#6bd0ee, 20%);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// NAVIGATION
|
||||
// ----------
|
||||
|
||||
// Common tab and pill styles
|
||||
.tabs,
|
||||
.pills {
|
||||
margin: 0 0 20px;
|
||||
padding: 0;
|
||||
.clearfix();
|
||||
li {
|
||||
display: inline;
|
||||
a {
|
||||
float: left;
|
||||
width: auto;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Basic Tabs
|
||||
.tabs {
|
||||
width: 100%;
|
||||
border-bottom: 1px solid @grayLight;
|
||||
li {
|
||||
a {
|
||||
margin-bottom: -1px;
|
||||
margin-right: 2px;
|
||||
padding: 0 15px;
|
||||
line-height: (@baseline * 2) - 1;
|
||||
.border-radius(3px 3px 0 0);
|
||||
&:hover {
|
||||
background-color: @grayLighter;
|
||||
border-bottom: 1px solid @grayLight;
|
||||
}
|
||||
}
|
||||
&.active a {
|
||||
background-color: #fff;
|
||||
padding: 0 14px;
|
||||
border: 1px solid #ccc;
|
||||
border-bottom: 0;
|
||||
color: @gray;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Basic pill nav
|
||||
.pills {
|
||||
li {
|
||||
a {
|
||||
margin: 5px 3px 5px 0;
|
||||
padding: 0 15px;
|
||||
text-shadow: 0 1px 1px #fff;
|
||||
line-height: 30px;
|
||||
.border-radius(15px);
|
||||
&:hover {
|
||||
background: @linkColorHover;
|
||||
color: #fff;
|
||||
text-decoration: none;
|
||||
text-shadow: 0 1px 1px rgba(0,0,0,.25);
|
||||
}
|
||||
}
|
||||
&.active a {
|
||||
background: @linkColor;
|
||||
color: #fff;
|
||||
text-shadow: 0 1px 1px rgba(0,0,0,.25);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// PAGINATION
|
||||
// ----------
|
||||
|
||||
.pagination {
|
||||
height: @baseline * 2;
|
||||
margin: @baseline 0;
|
||||
ul {
|
||||
float: left;
|
||||
margin: 0;
|
||||
border: 1px solid #ddd;
|
||||
border: 1px solid rgba(0,0,0,.15);
|
||||
.border-radius(3px);
|
||||
.box-shadow(0 1px 2px rgba(0,0,0,.05));
|
||||
li {
|
||||
display: inline;
|
||||
a {
|
||||
float: left;
|
||||
padding: 0 14px;
|
||||
line-height: (@baseline * 2) - 2;
|
||||
border-right: 1px solid;
|
||||
border-right-color: #ddd;
|
||||
border-right-color: rgba(0,0,0,.15);
|
||||
*border-right-color: #ddd; /* IE6-7 */
|
||||
text-decoration: none;
|
||||
}
|
||||
a:hover,
|
||||
&.active a {
|
||||
background-color: lighten(@blue, 45%);
|
||||
}
|
||||
&.disabled a,
|
||||
&.disabled a:hover {
|
||||
background-color: transparent;
|
||||
color: @grayLight;
|
||||
}
|
||||
&.next a {
|
||||
border: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// WELLS
|
||||
// -----
|
||||
|
||||
.well {
|
||||
background-color: #f5f5f5;
|
||||
margin-bottom: 20px;
|
||||
padding: 19px;
|
||||
min-height: 20px;
|
||||
border: 1px solid #eee;
|
||||
border: 1px solid rgba(0,0,0,.05);
|
||||
.border-radius(4px);
|
||||
.box-shadow(inset 0 1px 1px rgba(0,0,0,.05));
|
||||
}
|
||||
|
||||
|
||||
// MODALS
|
||||
// ------
|
||||
|
||||
.modal-backdrop {
|
||||
background-color: rgba(0,0,0,.5);
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
z-index: 1000;
|
||||
}
|
||||
.modal {
|
||||
position: fixed;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
z-index: 2000;
|
||||
width: 560px;
|
||||
margin: -280px 0 0 -250px;
|
||||
background-color: @white;
|
||||
border: 1px solid #999;
|
||||
border: 1px solid rgba(0,0,0,.3);
|
||||
*border: 1px solid #999; /* IE6-7 */
|
||||
.border-radius(6px);
|
||||
.box-shadow(0 3px 7px rgba(0,0,0,0.3));
|
||||
.background-clip(padding-box);
|
||||
.modal-header {
|
||||
border-bottom: 1px solid #eee;
|
||||
padding: 5px 20px;
|
||||
.close {
|
||||
position: absolute;
|
||||
right: 10px;
|
||||
top: 10px;
|
||||
color: #999;
|
||||
line-height:10px;
|
||||
font-size: 18px;
|
||||
}
|
||||
}
|
||||
.modal-body {
|
||||
padding: 20px;
|
||||
}
|
||||
.modal-footer {
|
||||
background-color: #f5f5f5;
|
||||
padding: 14px 20px 15px;
|
||||
border-top: 1px solid #ddd;
|
||||
.border-radius(0 0 6px 6px);
|
||||
.box-shadow(inset 0 1px 0 #fff);
|
||||
.clearfix();
|
||||
margin-bottom: 0;
|
||||
.btn {
|
||||
float: right;
|
||||
margin-left: 10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// POPOVER ARROWS
|
||||
// --------------
|
||||
|
||||
#popoverArrow {
|
||||
.above(@arrowWidth: 5px) {
|
||||
bottom: 0;
|
||||
left: 50%;
|
||||
margin-left: -@arrowWidth;
|
||||
border-left: @arrowWidth solid transparent;
|
||||
border-right: @arrowWidth solid transparent;
|
||||
border-top: @arrowWidth solid #000;
|
||||
}
|
||||
.left(@arrowWidth: 5px) {
|
||||
top: 50%;
|
||||
right: 0;
|
||||
margin-top: -@arrowWidth;
|
||||
border-top: @arrowWidth solid transparent;
|
||||
border-bottom: @arrowWidth solid transparent;
|
||||
border-left: @arrowWidth solid #000;
|
||||
}
|
||||
.below(@arrowWidth: 5px) {
|
||||
top: 0;
|
||||
left: 50%;
|
||||
margin-left: -@arrowWidth;
|
||||
border-left: @arrowWidth solid transparent;
|
||||
border-right: @arrowWidth solid transparent;
|
||||
border-bottom: @arrowWidth solid #000;
|
||||
}
|
||||
.right(@arrowWidth: 5px) {
|
||||
top: 50%;
|
||||
left: 0;
|
||||
margin-top: -@arrowWidth;
|
||||
border-top: @arrowWidth solid transparent;
|
||||
border-bottom: @arrowWidth solid transparent;
|
||||
border-right: @arrowWidth solid #000;
|
||||
}
|
||||
}
|
||||
|
||||
// TWIPSY
|
||||
// ------
|
||||
|
||||
.twipsy {
|
||||
display: block;
|
||||
position: absolute;
|
||||
visibility: visible;
|
||||
padding: 5px;
|
||||
font-size: 11px;
|
||||
z-index: 1000;
|
||||
.opacity(80);
|
||||
&.above .twipsy-arrow { #popoverArrow > .above(); }
|
||||
&.left .twipsy-arrow { #popoverArrow > .left(); }
|
||||
&.below .twipsy-arrow { #popoverArrow > .below(); }
|
||||
&.right .twipsy-arrow { #popoverArrow > .right(); }
|
||||
.twipsy-inner {
|
||||
padding: 3px 8px;
|
||||
background-color: #000;
|
||||
color: white;
|
||||
text-align: center;
|
||||
max-width: 200px;
|
||||
text-decoration: none;
|
||||
.border-radius(4px);
|
||||
}
|
||||
.twipsy-arrow {
|
||||
position: absolute;
|
||||
width: 0;
|
||||
height: 0;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// POPOVERS
|
||||
// --------
|
||||
|
||||
.popover {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: 1000;
|
||||
padding: 5px;
|
||||
display: none;
|
||||
&.above .arrow { #popoverArrow > .above(); }
|
||||
&.right .arrow { #popoverArrow > .right(); }
|
||||
&.below .arrow { #popoverArrow > .below(); }
|
||||
&.left .arrow { #popoverArrow > .left(); }
|
||||
.arrow {
|
||||
position: absolute;
|
||||
width: 0;
|
||||
height: 0;
|
||||
}
|
||||
.inner {
|
||||
background-color: #333;
|
||||
background-color: rgba(0,0,0,.8);
|
||||
*background-color: #333; /* IE 6-7 */
|
||||
padding: 3px;
|
||||
overflow: hidden;
|
||||
width: 280px;
|
||||
.border-radius(6px);
|
||||
.box-shadow(0 3px 7px rgba(0,0,0,0.3));
|
||||
}
|
||||
.title {
|
||||
background-color: #f5f5f5;
|
||||
padding: 9px 15px;
|
||||
line-height: 1;
|
||||
.border-radius(3px 3px 0 0);
|
||||
border-bottom:1px solid #eee;
|
||||
}
|
||||
.content {
|
||||
background-color: @white;
|
||||
padding: 14px;
|
||||
.border-radius(0 0 3px 3px);
|
||||
.background-clip(padding-box);
|
||||
p, ul, ol {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
271
lib/preboot.less
Normal file
271
lib/preboot.less
Normal file
|
|
@ -0,0 +1,271 @@
|
|||
/* Preboot.less
|
||||
* Variables and mixins to pre-ignite any new web development project
|
||||
* ------------------------------------------------------------------ */
|
||||
|
||||
|
||||
// VARIABLES
|
||||
// ---------
|
||||
|
||||
// Links
|
||||
@linkColor: #0069d6;
|
||||
@linkColorHover: darken(@linkColor, 10);
|
||||
|
||||
// Grays
|
||||
@black: #000;
|
||||
@grayDark: lighten(@black, 25%);
|
||||
@gray: lighten(@black, 50%);
|
||||
@grayLight: lighten(@black, 75%);
|
||||
@grayLighter: lighten(@black, 90%);
|
||||
@white: #fff;
|
||||
|
||||
// Accent Colors
|
||||
@blue: #049CDB;
|
||||
@blueDark: #0064CD;
|
||||
@green: #46a546;
|
||||
@red: #9d261d;
|
||||
@yellow: #ffc40d;
|
||||
@orange: #f89406;
|
||||
@pink: #c3325f;
|
||||
@purple: #7a43b6;
|
||||
|
||||
// Baseline grid
|
||||
@basefont: 13px;
|
||||
@baseline: 18px;
|
||||
|
||||
// Griditude
|
||||
@gridColumns: 16;
|
||||
@gridColumnWidth: 40px;
|
||||
@gridGutterWidth: 20px;
|
||||
@extraSpace: 40px;
|
||||
@siteWidth: (@gridColumns * @gridColumnWidth) + (@gridGutterWidth * (@gridColumns - 1));
|
||||
|
||||
// Color Scheme
|
||||
@baseColor: @blue; // Set a base color
|
||||
@complement: spin(@baseColor, 180); // Determine a complementary color
|
||||
@split1: spin(@baseColor, 158); // Split complements
|
||||
@split2: spin(@baseColor, -158);
|
||||
@triad1: spin(@baseColor, 135); // Triads colors
|
||||
@triad2: spin(@baseColor, -135);
|
||||
@tetra1: spin(@baseColor, 90); // Tetra colors
|
||||
@tetra2: spin(@baseColor, -90);
|
||||
@analog1: spin(@baseColor, 22); // Analogs colors
|
||||
@analog2: spin(@baseColor, -22);
|
||||
|
||||
|
||||
// MIXINS
|
||||
// ------
|
||||
|
||||
// Clearfix for clearing floats like a boss h5bp.com/q
|
||||
.clearfix {
|
||||
zoom: 1;
|
||||
&:before, &:after {
|
||||
display: table;
|
||||
content: "";
|
||||
}
|
||||
&:after {
|
||||
clear: both;
|
||||
}
|
||||
}
|
||||
|
||||
// Center-align a block level element
|
||||
.center-block {
|
||||
display: block;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
// Sizing shortcuts
|
||||
.size(@height: 5px, @width: 5px) {
|
||||
height: @height;
|
||||
width: @width;
|
||||
}
|
||||
.square(@size: 5px) {
|
||||
.size(@size, @size);
|
||||
}
|
||||
|
||||
// Input placeholder text
|
||||
.placeholder(@color: @grayLight) {
|
||||
:-moz-placeholder {
|
||||
color: @color;
|
||||
}
|
||||
::-webkit-input-placeholder {
|
||||
color: @color;
|
||||
}
|
||||
}
|
||||
|
||||
// Font Stacks
|
||||
#font {
|
||||
.shorthand(@weight: normal, @size: 14px, @lineHeight: 20px) {
|
||||
font-size: @size;
|
||||
font-weight: @weight;
|
||||
line-height: @lineHeight;
|
||||
}
|
||||
.sans-serif(@weight: normal, @size: 14px, @lineHeight: 20px) {
|
||||
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
|
||||
font-size: @size;
|
||||
font-weight: @weight;
|
||||
line-height: @lineHeight;
|
||||
}
|
||||
.serif(@weight: normal, @size: 14px, @lineHeight: 20px) {
|
||||
font-family: "Georgia", Times New Roman, Times, serif;
|
||||
font-size: @size;
|
||||
font-weight: @weight;
|
||||
line-height: @lineHeight;
|
||||
}
|
||||
.monospace(@weight: normal, @size: 12px, @lineHeight: 20px) {
|
||||
font-family: "Monaco", Courier New, monospace;
|
||||
font-size: @size;
|
||||
font-weight: @weight;
|
||||
line-height: @lineHeight;
|
||||
}
|
||||
}
|
||||
|
||||
// Grid System
|
||||
.container {
|
||||
width: @siteWidth;
|
||||
margin: 0 auto;
|
||||
.clearfix();
|
||||
}
|
||||
.columns(@columnSpan: 1) {
|
||||
width: (@gridColumnWidth * @columnSpan) + (@gridGutterWidth * (@columnSpan - 1));
|
||||
}
|
||||
.offset(@columnOffset: 1) {
|
||||
margin-left: (@gridColumnWidth * @columnOffset) + (@gridGutterWidth * (@columnOffset - 1)) + @extraSpace;
|
||||
}
|
||||
|
||||
// Border Radius
|
||||
.border-radius(@radius: 5px) {
|
||||
-webkit-border-radius: @radius;
|
||||
-moz-border-radius: @radius;
|
||||
border-radius: @radius;
|
||||
}
|
||||
|
||||
// Drop shadows
|
||||
.box-shadow(@shadow: 0 1px 3px rgba(0,0,0,.25)) {
|
||||
-webkit-box-shadow: @shadow;
|
||||
-moz-box-shadow: @shadow;
|
||||
box-shadow: @shadow;
|
||||
}
|
||||
|
||||
// Transitions
|
||||
.transition(@transition) {
|
||||
-webkit-transition: @transition;
|
||||
-moz-transition: @transition;
|
||||
transition: @transition;
|
||||
}
|
||||
|
||||
// Background clipping
|
||||
.background-clip(@clip) {
|
||||
-webkit-background-clip: @clip;
|
||||
-moz-background-clip: @clip;
|
||||
background-clip: @clip;
|
||||
}
|
||||
|
||||
// CSS3 Content Columns
|
||||
.content-columns(@columnCount, @columnGap: 20px) {
|
||||
-webkit-column-count: @columnCount;
|
||||
-moz-column-count: @columnCount;
|
||||
column-count: @columnCount;
|
||||
-webkit-column-gap: @columnGap;
|
||||
-moz-column-gap: @columnGap;
|
||||
column-gap: @columnGap;
|
||||
}
|
||||
|
||||
// Add an alphatransparency value to any background or border color (via Elyse Holladay)
|
||||
#translucent {
|
||||
.background(@color: @white, @alpha: 1) {
|
||||
background-color: hsla(hue(@color), saturation(@color), lightness(@color), @alpha);
|
||||
}
|
||||
.border(@color: @white, @alpha: 1) {
|
||||
border-color: hsla(hue(@color), saturation(@color), lightness(@color), @alpha);
|
||||
background-clip: padding-box;
|
||||
}
|
||||
}
|
||||
|
||||
// Gradient Bar Colors for buttons and allerts
|
||||
.gradientBar(@primaryColor, @secondaryColor) {
|
||||
#gradient > .vertical(@primaryColor, @secondaryColor);
|
||||
text-shadow: 0 -1px 0 rgba(0,0,0,.25);
|
||||
border-color: @secondaryColor @secondaryColor darken(@secondaryColor, 15%);
|
||||
border-color: rgba(0,0,0,.1) rgba(0,0,0,.1) fadein(rgba(0,0,0,.1), 15%);
|
||||
}
|
||||
// Shared colors for buttons and alerts
|
||||
.btn,
|
||||
.alert-message {
|
||||
// Set text color
|
||||
&.danger,
|
||||
&.danger:hover,
|
||||
&.error,
|
||||
&.error:hover,
|
||||
&.success,
|
||||
&.success:hover,
|
||||
&.info,
|
||||
&.info:hover {
|
||||
color: @white
|
||||
}
|
||||
// Danger and error appear as red
|
||||
&.danger,
|
||||
&.error {
|
||||
.gradientBar(#ee5f5b, #c43c35);
|
||||
}
|
||||
// Success appears as green
|
||||
&.success {
|
||||
.gradientBar(#62c462, #57a957);
|
||||
}
|
||||
// Info appears as a neutral blue
|
||||
&.info {
|
||||
.gradientBar(#5bc0de, #339bb9);
|
||||
}
|
||||
}
|
||||
|
||||
// Gradients
|
||||
#gradient {
|
||||
.horizontal (@startColor: #555, @endColor: #333) {
|
||||
background-color: @endColor;
|
||||
background-repeat: repeat-x;
|
||||
background-image: -khtml-gradient(linear, left top, right top, from(@startColor), to(@endColor)); // Konqueror
|
||||
background-image: -moz-linear-gradient(left, @startColor, @endColor); // FF 3.6+
|
||||
background-image: -ms-linear-gradient(left, @startColor, @endColor); // IE10
|
||||
background-image: -webkit-gradient(linear, left top, right top, color-stop(0%, @startColor), color-stop(100%, @endColor)); // Safari 4+, Chrome 2+
|
||||
background-image: -webkit-linear-gradient(left, @startColor, @endColor); // Safari 5.1+, Chrome 10+
|
||||
background-image: -o-linear-gradient(left, @startColor, @endColor); // Opera 11.10
|
||||
background-image: linear-gradient(left, @startColor, @endColor); // Le standard
|
||||
}
|
||||
.vertical (@startColor: #555, @endColor: #333) {
|
||||
background-color: @endColor;
|
||||
background-repeat: repeat-x;
|
||||
background-image: -khtml-gradient(linear, left top, left bottom, from(@startColor), to(@endColor)); // Konqueror
|
||||
background-image: -moz-linear-gradient(top, @startColor, @endColor); // FF 3.6+
|
||||
background-image: -ms-linear-gradient(top, @startColor, @endColor); // IE10
|
||||
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, @startColor), color-stop(100%, @endColor)); // Safari 4+, Chrome 2+
|
||||
background-image: -webkit-linear-gradient(top, @startColor, @endColor); // Safari 5.1+, Chrome 10+
|
||||
background-image: -o-linear-gradient(top, @startColor, @endColor); // Opera 11.10
|
||||
background-image: linear-gradient(top, @startColor, @endColor); // The standard
|
||||
}
|
||||
.directional (@startColor: #555, @endColor: #333, @deg: 45deg) {
|
||||
background-color: @endColor;
|
||||
background-repeat: repeat-x;
|
||||
background-image: -moz-linear-gradient(@deg, @startColor, @endColor); // FF 3.6+
|
||||
background-image: -ms-linear-gradient(@deg, @startColor, @endColor); // IE10
|
||||
background-image: -webkit-linear-gradient(@deg, @startColor, @endColor); // Safari 5.1+, Chrome 10+
|
||||
background-image: -o-linear-gradient(@deg, @startColor, @endColor); // Opera 11.10
|
||||
background-image: linear-gradient(@deg, @startColor, @endColor); // The standard
|
||||
}
|
||||
.vertical-three-colors(@startColor: #00b3ee, @midColor: #7a43b6, @colorStop: 50%, @endColor: #c3325f) {
|
||||
background-color: @endColor;
|
||||
background-repeat: no-repeat;
|
||||
background-image: -webkit-gradient(linear, 0 0, 0 100%, from(@startColor), color-stop(@colorStop, @midColor), to(@endColor));
|
||||
background-image: -webkit-linear-gradient(@startColor, @midColor @colorStop, @endColor);
|
||||
background-image: -moz-linear-gradient(@startColor, @midColor @colorStop, @endColor);
|
||||
background-image: -ms-linear-gradient(@startColor, @midColor @colorStop, @endColor);
|
||||
background-image: -o-linear-gradient(@startColor, @midColor @colorStop, @endColor);
|
||||
background-image: linear-gradient(@startColor, @midColor @colorStop, @endColor);
|
||||
}
|
||||
}
|
||||
|
||||
// Opacity
|
||||
.opacity(@opacity: 100) {
|
||||
filter: e(%("alpha(opacity=%d)", @opacity));
|
||||
-khtml-opacity: @opacity / 100;
|
||||
-moz-opacity: @opacity / 100;
|
||||
opacity: @opacity / 100;
|
||||
}
|
||||
146
lib/reset.less
Normal file
146
lib/reset.less
Normal file
|
|
@ -0,0 +1,146 @@
|
|||
/* Reset.less
|
||||
* Props to Eric Meyer (meyerweb.com) for his CSS reset file. We're using an adapted version here that cuts out some of the reset HTML elements we will never need here (i.e., dfn, samp, etc).
|
||||
* ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
|
||||
|
||||
|
||||
// ERIC MEYER RESET
|
||||
// --------------------------------------------------
|
||||
|
||||
html, body { margin: 0; padding: 0; }
|
||||
h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, cite, code, del, dfn, em, img, q, s, samp, small, strike, strong, sub, sup, tt, var, dd, dl, dt, li, ol, ul, fieldset, form, label, legend, button, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; font-weight: normal; font-style: normal; font-size: 100%; line-height: 1; font-family: inherit; }
|
||||
table { border-collapse: collapse; border-spacing: 0; }
|
||||
ol, ul { list-style: none; }
|
||||
q:before, q:after, blockquote:before, blockquote:after { content: ""; }
|
||||
|
||||
|
||||
// Normalize.css
|
||||
// Pulling in select resets form the normalize.css project
|
||||
// --------------------------------------------------
|
||||
|
||||
// Display in IE6-9 and FF3
|
||||
// -------------------------
|
||||
// Source: http://github.com/necolas/normalize.css
|
||||
html {
|
||||
overflow-y: scroll;
|
||||
font-size: 100%;
|
||||
-webkit-text-size-adjust: 100%;
|
||||
-ms-text-size-adjust: 100%;
|
||||
}
|
||||
// Focus states
|
||||
a:focus {
|
||||
outline: thin dotted;
|
||||
}
|
||||
|
||||
// Display in IE6-9 and FF3
|
||||
// -------------------------
|
||||
// Source: http://github.com/necolas/normalize.css
|
||||
article,
|
||||
aside,
|
||||
details,
|
||||
figcaption,
|
||||
figure,
|
||||
footer,
|
||||
header,
|
||||
hgroup,
|
||||
nav,
|
||||
section {
|
||||
display: block;
|
||||
}
|
||||
|
||||
// Display block in IE6-9 and FF3
|
||||
// -------------------------
|
||||
// Source: http://github.com/necolas/normalize.css
|
||||
audio,
|
||||
canvas,
|
||||
video {
|
||||
display: inline-block;
|
||||
*display: inline;
|
||||
*zoom: 1;
|
||||
}
|
||||
|
||||
// Prevents modern browsers from displaying 'audio' without controls
|
||||
// -------------------------
|
||||
// Source: http://github.com/necolas/normalize.css
|
||||
audio:not([controls]) {
|
||||
display: none;
|
||||
}
|
||||
|
||||
// Prevents sub and sup affecting line-height in all browsers
|
||||
// -------------------------
|
||||
// Source: http://github.com/necolas/normalize.css
|
||||
sub,
|
||||
sup {
|
||||
font-size: 75%;
|
||||
line-height: 0;
|
||||
position: relative;
|
||||
vertical-align: baseline;
|
||||
}
|
||||
sup {
|
||||
top: -0.5em;
|
||||
}
|
||||
sub {
|
||||
bottom: -0.25em;
|
||||
}
|
||||
|
||||
// Img border in a's and image quality
|
||||
// -------------------------
|
||||
// Source: http://github.com/necolas/normalize.css
|
||||
img {
|
||||
border: 0;
|
||||
-ms-interpolation-mode: bicubic;
|
||||
}
|
||||
|
||||
// Forms
|
||||
// -------------------------
|
||||
// Source: http://github.com/necolas/normalize.css
|
||||
|
||||
// Font size in all browsers, margin changes, misc consistency
|
||||
button,
|
||||
input,
|
||||
select,
|
||||
textarea {
|
||||
font-size: 100%;
|
||||
margin: 0;
|
||||
vertical-align: baseline;
|
||||
*vertical-align: middle;
|
||||
}
|
||||
button,
|
||||
input {
|
||||
line-height: normal; // FF3/4 have !important on line-height in UA stylesheet
|
||||
*overflow: visible; // Inner spacing ie IE6/7
|
||||
}
|
||||
button::-moz-focus-inner,
|
||||
input::-moz-focus-inner { // Inner padding and border oddities in FF3/4
|
||||
border: 0;
|
||||
padding: 0;
|
||||
}
|
||||
button,
|
||||
input[type="button"],
|
||||
input[type="reset"],
|
||||
input[type="submit"] {
|
||||
cursor: pointer; // Cursors on all buttons applied consistently
|
||||
-webkit-appearance: button; // Style clicable inputs in iOS
|
||||
}
|
||||
input[type="search"] { // Appearance in Safari/Chrome
|
||||
-webkit-appearance: textfield;
|
||||
-webkit-box-sizing: content-box;
|
||||
-moz-box-sizing: content-box;
|
||||
box-sizing: content-box;
|
||||
}
|
||||
input[type="search"]::-webkit-search-decoration {
|
||||
-webkit-appearance: none; // Inner-padding issues in Chrome OSX, Safari 5
|
||||
}
|
||||
textarea {
|
||||
overflow: auto; // Remove vertical scrollbar in IE6-9
|
||||
vertical-align: top; // Readability and alignment cross-browser
|
||||
}
|
||||
|
||||
// Tables
|
||||
// -------------------------
|
||||
// Source: http://github.com/necolas/normalize.css
|
||||
|
||||
// Remove spacing between table cells
|
||||
table {
|
||||
border-collapse: collapse;
|
||||
border-spacing: 0;
|
||||
}
|
||||
204
lib/scaffolding.less
Normal file
204
lib/scaffolding.less
Normal file
|
|
@ -0,0 +1,204 @@
|
|||
/*
|
||||
* Scaffolding
|
||||
* Basic and global styles for generating a grid system, structural layout, and page templates
|
||||
* ------------------------------------------------------------------------------------------- */
|
||||
|
||||
|
||||
// GRID SYSTEM
|
||||
// -----------
|
||||
|
||||
.row {
|
||||
.clearfix();
|
||||
margin-left: -20px;
|
||||
|
||||
// Default columns
|
||||
.span1,
|
||||
.span2,
|
||||
.span3,
|
||||
.span4,
|
||||
.span5,
|
||||
.span6,
|
||||
.span7,
|
||||
.span8,
|
||||
.span9,
|
||||
.span10,
|
||||
.span11,
|
||||
.span12,
|
||||
.span13,
|
||||
.span14,
|
||||
.span15,
|
||||
.span16 {
|
||||
display: inline;
|
||||
float: left;
|
||||
margin-left: 20px;
|
||||
}
|
||||
|
||||
// Default columns
|
||||
.span1 { .columns(1); }
|
||||
.span2 { .columns(2); }
|
||||
.span3 { .columns(3); }
|
||||
.span4 { .columns(4); }
|
||||
.span5 { .columns(5); }
|
||||
.span6 { .columns(6); }
|
||||
.span7 { .columns(7); }
|
||||
.span8 { .columns(8); }
|
||||
.span9 { .columns(9); }
|
||||
.span10 { .columns(10); }
|
||||
.span11 { .columns(11); }
|
||||
.span12 { .columns(12); }
|
||||
.span13 { .columns(13); }
|
||||
.span14 { .columns(14); }
|
||||
.span15 { .columns(15); }
|
||||
.span16 { .columns(16); }
|
||||
|
||||
// Offset column options
|
||||
.offset1 { .offset(1); }
|
||||
.offset2 { .offset(2); }
|
||||
.offset3 { .offset(3); }
|
||||
.offset4 { .offset(4); }
|
||||
.offset5 { .offset(5); }
|
||||
.offset6 { .offset(6); }
|
||||
.offset7 { .offset(7); }
|
||||
.offset8 { .offset(8); }
|
||||
.offset9 { .offset(9); }
|
||||
.offset10 { .offset(10); }
|
||||
.offset11 { .offset(11); }
|
||||
.offset12 { .offset(12); }
|
||||
}
|
||||
|
||||
|
||||
// STRUCTURAL LAYOUT
|
||||
// -----------------
|
||||
|
||||
html, body {
|
||||
background-color: #fff;
|
||||
}
|
||||
body {
|
||||
margin: 0;
|
||||
#font > .sans-serif(normal,@basefont,@baseline);
|
||||
color: @gray;
|
||||
text-rendering: optimizeLegibility;
|
||||
}
|
||||
|
||||
// Container (centered, fixed-width layouts)
|
||||
.container {
|
||||
width: 940px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
// Fluid layouts (left aligned, with sidebar, min- & max-width content)
|
||||
.container-fluid {
|
||||
padding: 0 20px;
|
||||
.clearfix();
|
||||
.sidebar {
|
||||
float: left;
|
||||
width: 220px;
|
||||
}
|
||||
.content {
|
||||
min-width: 700px;
|
||||
max-width: 1180px;
|
||||
margin-left: 240px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// BASE STYLES
|
||||
// -----------
|
||||
|
||||
// Links
|
||||
a {
|
||||
color: @linkColor;
|
||||
text-decoration: none;
|
||||
line-height: inherit;
|
||||
font-weight: inherit;
|
||||
&:hover {
|
||||
color: @linkColorHover;
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
|
||||
// Buttons
|
||||
.btn {
|
||||
display: inline-block;
|
||||
#gradient > .vertical-three-colors(#fff, #fff, 0.25, darken(#fff, 10%));
|
||||
padding: 4px 14px;
|
||||
text-shadow: 0 1px 1px rgba(255,255,255,.75);
|
||||
color: #333;
|
||||
font-size: 13px;
|
||||
line-height: @baseline;
|
||||
border: 1px solid #ccc;
|
||||
border-bottom-color: #bbb;
|
||||
.border-radius(4px);
|
||||
@shadow: inset 0 1px 0 rgba(255,255,255,.2), 0 1px 2px rgba(0,0,0,.05);
|
||||
.box-shadow(@shadow);
|
||||
&:hover {
|
||||
background-position: 0 -15px;
|
||||
color: #333;
|
||||
text-decoration: none;
|
||||
}
|
||||
}
|
||||
.primary {
|
||||
#gradient > .vertical(#049CDB, #0064CD);
|
||||
color: #fff;
|
||||
text-shadow: 0 -1px 0 rgba(0,0,0,.25);
|
||||
border: 1px solid darken(#0064CD, 10%);
|
||||
border-bottom-color: darken(#0064CD, 15%);
|
||||
&:hover {
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
|
||||
.btn {
|
||||
//.button(#1174C6);
|
||||
.transition(.1s linear all);
|
||||
&.primary {
|
||||
//#gradient > .vertical(@blue, @blueDark);
|
||||
color: #fff;
|
||||
text-shadow: 0 -1px 0 rgba(0,0,0,.25);
|
||||
border-color: @blueDark @blueDark darken(@blueDark, 15%);
|
||||
border-color: rgba(0,0,0,.1) rgba(0,0,0,.1) fadein(rgba(0,0,0,.1), 15%);
|
||||
&:hover {
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
&.large {
|
||||
font-size: 16px;
|
||||
line-height: 28px;
|
||||
.border-radius(6px);
|
||||
}
|
||||
&.small {
|
||||
padding-right: 9px;
|
||||
padding-left: 9px;
|
||||
font-size: 11px;
|
||||
}
|
||||
&.disabled {
|
||||
background-image: none;
|
||||
.opacity(65);
|
||||
cursor: default;
|
||||
.box-shadow(none);
|
||||
}
|
||||
|
||||
// this can't be included with the .disabled def because IE8 and below will drop it ;_;
|
||||
&:disabled {
|
||||
background-image: none;
|
||||
.opacity(65);
|
||||
cursor: default;
|
||||
.box-shadow(none);
|
||||
&.primary {
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
&:active {
|
||||
@shadow: inset 0 3px 7px rgba(0,0,0,.15), 0 1px 2px rgba(0,0,0,.05);
|
||||
.box-shadow(@shadow);
|
||||
}
|
||||
}
|
||||
|
||||
// Help Firefox not be a jerk about adding extra padding to buttons
|
||||
button.btn,
|
||||
input[type=submit].btn {
|
||||
&::-moz-focus-inner {
|
||||
padding: 0;
|
||||
border: 0;
|
||||
}
|
||||
}
|
||||
148
lib/tables.less
Normal file
148
lib/tables.less
Normal file
|
|
@ -0,0 +1,148 @@
|
|||
/*
|
||||
* Tables.less
|
||||
* Tables for, you guessed it, tabular data
|
||||
* ---------------------------------------- */
|
||||
|
||||
|
||||
// BASELINE STYLES
|
||||
// ---------------
|
||||
|
||||
table {
|
||||
width: 100%;
|
||||
margin-bottom: @baseline;
|
||||
padding: 0;
|
||||
border-collapse: separate;
|
||||
font-size: 13px;
|
||||
th, td {
|
||||
padding: 10px 10px 9px;
|
||||
line-height: @baseline * .75;
|
||||
text-align: left;
|
||||
vertical-align: middle;
|
||||
border-bottom: 1px solid #ddd;
|
||||
}
|
||||
th {
|
||||
padding-top: 9px;
|
||||
font-weight: bold;
|
||||
border-bottom-width: 2px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// ZEBRA-STRIPING
|
||||
// --------------
|
||||
|
||||
// Default zebra-stripe styles (alternating gray and transparent backgrounds)
|
||||
.zebra-striped {
|
||||
tbody {
|
||||
tr:nth-child(odd) td {
|
||||
background-color: #f9f9f9;
|
||||
}
|
||||
tr:hover td {
|
||||
background-color: #f5f5f5;
|
||||
}
|
||||
}
|
||||
|
||||
// Tablesorting styles w/ jQuery plugin
|
||||
.header {
|
||||
cursor: pointer;
|
||||
&:after {
|
||||
content: "";
|
||||
float: right;
|
||||
margin-top: 7px;
|
||||
border-width: 0 4px 4px;
|
||||
border-style: solid;
|
||||
border-color: #000 transparent;
|
||||
visibility: hidden;
|
||||
}
|
||||
}
|
||||
// Style the sorted column headers (THs)
|
||||
.headerSortUp,
|
||||
.headerSortDown {
|
||||
background-color: rgba(141,192,219,.25);
|
||||
text-shadow: 0 1px 1px rgba(255,255,255,.75);
|
||||
.border-radius(3px 3px 0 0);
|
||||
}
|
||||
// Style the ascending (reverse alphabetical) column header
|
||||
.header:hover {
|
||||
&:after {
|
||||
visibility:visible;
|
||||
}
|
||||
}
|
||||
// Style the descending (alphabetical) column header
|
||||
.headerSortDown,
|
||||
.headerSortDown:hover {
|
||||
&:after {
|
||||
visibility:visible;
|
||||
.opacity(60);
|
||||
}
|
||||
}
|
||||
// Style the ascending (reverse alphabetical) column header
|
||||
.headerSortUp {
|
||||
&:after {
|
||||
border-bottom: none;
|
||||
border-left: 4px solid transparent;
|
||||
border-right: 4px solid transparent;
|
||||
border-top: 4px solid #000;
|
||||
visibility:visible;
|
||||
.box-shadow(none); //can't add boxshadow to downward facing arrow :(
|
||||
.opacity(60);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
table {
|
||||
// Blue Table Headings
|
||||
.blue {
|
||||
color: @blue;
|
||||
border-bottom-color: @blue;
|
||||
}
|
||||
.headerSortUp.blue,
|
||||
.headerSortDown.blue {
|
||||
background-color: lighten(@blue, 40%);
|
||||
}
|
||||
// Green Table Headings
|
||||
.green {
|
||||
color: @green;
|
||||
border-bottom-color: @green;
|
||||
}
|
||||
.headerSortUp.green,
|
||||
.headerSortDown.green {
|
||||
background-color: lighten(@green, 40%);
|
||||
}
|
||||
// Red Table Headings
|
||||
.red {
|
||||
color: @red;
|
||||
border-bottom-color: @red;
|
||||
}
|
||||
.headerSortUp.red,
|
||||
.headerSortDown.red {
|
||||
background-color: lighten(@red, 50%);
|
||||
}
|
||||
// Yellow Table Headings
|
||||
.yellow {
|
||||
color: @yellow;
|
||||
border-bottom-color: @yellow;
|
||||
}
|
||||
.headerSortUp.yellow,
|
||||
.headerSortDown.yellow {
|
||||
background-color: lighten(@yellow, 40%);
|
||||
}
|
||||
// Orange Table Headings
|
||||
.orange {
|
||||
color: @orange;
|
||||
border-bottom-color: @orange;
|
||||
}
|
||||
.headerSortUp.orange,
|
||||
.headerSortDown.orange {
|
||||
background-color: lighten(@orange, 40%);
|
||||
}
|
||||
// Purple Table Headings
|
||||
.purple {
|
||||
color: @purple;
|
||||
border-bottom-color: @purple;
|
||||
}
|
||||
.headerSortUp.purple,
|
||||
.headerSortDown.purple {
|
||||
background-color: lighten(@purple, 40%);
|
||||
}
|
||||
}
|
||||
188
lib/type.less
Normal file
188
lib/type.less
Normal file
|
|
@ -0,0 +1,188 @@
|
|||
/* Typography.less
|
||||
* Headings, body text, lists, code, and more for a versatile and durable typography system
|
||||
* ---------------------------------------------------------------------------------------- */
|
||||
|
||||
|
||||
// BODY TEXT
|
||||
// ---------
|
||||
|
||||
p {
|
||||
#font > .shorthand(normal,@basefont,@baseline);
|
||||
margin-bottom: @baseline / 2;
|
||||
small {
|
||||
font-size: @basefont - 2;
|
||||
color: @grayLight;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// HEADINGS
|
||||
// --------
|
||||
|
||||
h1, h2, h3, h4, h5, h6 {
|
||||
font-weight: bold;
|
||||
color: @grayDark;
|
||||
small {
|
||||
color: @grayLight;
|
||||
}
|
||||
}
|
||||
h1 {
|
||||
margin-bottom: @baseline;
|
||||
font-size: 30px;
|
||||
line-height: @baseline * 2;
|
||||
small {
|
||||
font-size: 18px;
|
||||
}
|
||||
}
|
||||
h2 {
|
||||
font-size: 24px;
|
||||
line-height: @baseline * 2;
|
||||
small {
|
||||
font-size: 14px;
|
||||
}
|
||||
}
|
||||
h3, h4, h5, h6 {
|
||||
line-height: @baseline * 2;
|
||||
}
|
||||
h3 {
|
||||
font-size: 18px;
|
||||
small {
|
||||
font-size: 14px;
|
||||
}
|
||||
}
|
||||
h4 {
|
||||
font-size: 16px;
|
||||
small {
|
||||
font-size: 12px;
|
||||
}
|
||||
}
|
||||
h5 {
|
||||
font-size: 14px;
|
||||
}
|
||||
h6 {
|
||||
font-size: 13px;
|
||||
color: @grayLight;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
|
||||
// COLORS
|
||||
// ------
|
||||
|
||||
// Unordered and Ordered lists
|
||||
ul, ol {
|
||||
margin: 0 0 @baseline 25px;
|
||||
}
|
||||
ul ul,
|
||||
ul ol,
|
||||
ol ol,
|
||||
ol ul {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
ul {
|
||||
list-style: disc;
|
||||
}
|
||||
ol {
|
||||
list-style: decimal;
|
||||
}
|
||||
li {
|
||||
line-height: @baseline;
|
||||
color: @gray;
|
||||
}
|
||||
ul.unstyled {
|
||||
list-style: none;
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
// Description Lists
|
||||
dl {
|
||||
margin-bottom: @baseline;
|
||||
dt, dd {
|
||||
line-height: @baseline;
|
||||
}
|
||||
dt {
|
||||
font-weight: bold;
|
||||
}
|
||||
dd {
|
||||
margin-left: @baseline / 2;
|
||||
}
|
||||
}
|
||||
|
||||
// MISC
|
||||
// ----
|
||||
|
||||
// Horizontal rules
|
||||
hr {
|
||||
margin: 0 0 19px;
|
||||
border: 0;
|
||||
border-bottom: 1px solid #eee;
|
||||
}
|
||||
|
||||
// Emphasis
|
||||
strong {
|
||||
font-style: inherit;
|
||||
font-weight: bold;
|
||||
line-height: inherit;
|
||||
}
|
||||
em {
|
||||
font-style: italic;
|
||||
font-weight: inherit;
|
||||
line-height: inherit;
|
||||
}
|
||||
.muted {
|
||||
color: @grayLight;
|
||||
}
|
||||
|
||||
// Blockquotes
|
||||
blockquote {
|
||||
margin-bottom: @baseline;
|
||||
border-left: 5px solid #eee;
|
||||
padding-left: 15px;
|
||||
p {
|
||||
#font > .shorthand(300,14px,@baseline);
|
||||
margin-bottom: 0;
|
||||
}
|
||||
small {
|
||||
display: block;
|
||||
#font > .shorthand(300,12px,@baseline);
|
||||
color: @grayLight;
|
||||
&:before {
|
||||
content: '\2014 \00A0';
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Addresses
|
||||
address {
|
||||
display: block;
|
||||
line-height: @baseline;
|
||||
margin-bottom: @baseline;
|
||||
}
|
||||
|
||||
// Inline and block code styles
|
||||
code, pre {
|
||||
padding: 0 3px 2px;
|
||||
font-family: Monaco, Andale Mono, Courier New, monospace;
|
||||
font-size: 12px;
|
||||
.border-radius(3px);
|
||||
}
|
||||
code {
|
||||
background-color: lighten(@orange, 40%);
|
||||
color: rgba(0,0,0,.75);
|
||||
padding: 1px 3px;
|
||||
}
|
||||
pre {
|
||||
background-color: #f5f5f5;
|
||||
display: block;
|
||||
padding: @baseline - 1;
|
||||
margin: 0 0 @baseline;
|
||||
line-height: @baseline;
|
||||
font-size: 12px;
|
||||
border: 1px solid #ccc;
|
||||
border: 1px solid rgba(0,0,0,.15);
|
||||
.border-radius(3px);
|
||||
white-space: pre;
|
||||
white-space: pre-wrap;
|
||||
word-wrap: break-word;
|
||||
|
||||
}
|
||||
Loading…
Add table
Add a link
Reference in a new issue