diff --git a/Makefile b/Makefile
new file mode 100644
index 0000000..89bcd59
--- /dev/null
+++ b/Makefile
@@ -0,0 +1,14 @@
+
+all : local
+
+install :
+ cd less/; $(MAKE) install $(MFLAGS)
+
+clean :
+ cd less/; $(MAKE) install $(MFLAGS)
+
+local : force_look
+ cd less/; $(MAKE) $(MFLAGS)
+
+force_look :
+ true
diff --git a/less/Makefile b/less/Makefile
new file mode 100644
index 0000000..a2e8b63
--- /dev/null
+++ b/less/Makefile
@@ -0,0 +1,22 @@
+ifeq ($(shell which lessc),/usr/bin/lessc)
+ LESSC=/usr/bin/lessc
+else
+ LESSC=node_modules/.bin/lessc
+endif
+export LESSC
+
+CSSDIR=../static/css/
+
+all :
+ $(LESSC) app.less --clean-css="--s1 --advanced" $(CSSDIR)write.css
+ $(LESSC) fonts.less --clean-css="--s1 --advanced" $(CSSDIR)fonts.css
+ $(LESSC) icons.less --clean-css="--s1 --advanced" $(CSSDIR)icons.css
+
+install :
+ ./install-less.sh
+ $(MAKE) all
+
+clean :
+ rm -f write.css
+ rm -f fonts.css
+ rm -f icons.css
diff --git a/less/app.less b/less/app.less
new file mode 100644
index 0000000..7f32c1c
--- /dev/null
+++ b/less/app.less
@@ -0,0 +1,9 @@
+@import "new-core";
+@import "core";
+@import "pad";
+@import "pad-theme";
+@import "post-temp";
+@import "effects";
+@import "pages/error";
+@import "lib/elements";
+@import "lib/material";
diff --git a/less/core.less b/less/core.less
new file mode 100644
index 0000000..80b2b22
--- /dev/null
+++ b/less/core.less
@@ -0,0 +1,1458 @@
+@primary: rgb(114, 120, 191);
+@secondary: rgb(114, 191, 133);
+@subheaders: #444;
+@headerTextColor: black;
+@sansFont: 'Open Sans', 'Segoe UI', Tahoma, Arial, sans-serif;
+@serifFont: Lora, 'Palatino Linotype', 'Book Antiqua', 'New York', 'DejaVu serif', serif;
+@monoFont: Hack, consolas, Menlo-Regular, Menlo, Monaco, 'ubuntu mono', monospace, monospace;
+@dangerCol: #e21d27;
+@errUrgentCol: #ecc63c;
+@proSelectedCol: #71D571;
+@textLinkColor: rgb(0, 0, 238);
+
+body {
+ font-family: @serifFont;
+ font-size-adjust: 0.5;
+ -webkit-font-smoothing: antialiased;
+ -moz-osx-font-smoothing: grayscale;
+ color: #111;
+
+ h1 {
+ a {
+ color: @headerTextColor;
+ .transition-duration(0.2s);
+ &:hover {
+ color: #303030;
+ text-decoration: none;
+ }
+ }
+ }
+ h1, h2, h3 {
+ line-height: 1.2;
+ }
+
+ post article, collection article p, subpage article p {
+ display: block;
+ unicode-bidi: embed;
+ white-space: pre;
+ }
+
+ post {
+ #wrapper, pre {
+ max-width: 40em;
+ margin: 0 auto;
+ a:hover {
+ text-decoration: underline;
+ }
+ }
+
+ article {
+ margin-bottom: 2em !important;
+
+ h1, h2, h3, h4, h5, h6, p, ul, ol, code {
+ display: inline;
+ margin: 0;
+ }
+ hr + p, ol, ul {
+ display: block;
+ margin-top: -1em;
+ margin-bottom: -1em;
+ }
+ ol, ul {
+ margin: 0.75em 0 -1em;
+ }
+ ul {
+ padding: 0 0 0 2em;
+ }
+ li {
+ margin-top: -0.5em;
+ margin-bottom: -0.5em;
+ }
+ h2#title {
+ .article-title;
+ }
+ h1 {
+ font-size: 1.5em;
+ }
+ h2 {
+ font-size: 1.17em;
+ }
+ }
+
+ header {
+ nav {
+ span, a {
+ &.pinned {
+ &.selected {
+ font-weight: bold;
+ }
+ &+.views {
+ margin-left: 2em;
+ }
+ }
+ }
+ }
+ }
+ .owner-visible {
+ display: none;
+ }
+ }
+
+ post, collection, subpage {
+ code {
+ .article-code;
+ }
+ img, video {
+ max-width: 100%;
+ }
+ pre {
+ .code-block;
+
+ code {
+ background: transparent;
+ border: 0;
+ padding: 0;
+ font-size: 1em;
+ white-space: pre-wrap; /* CSS 3 */
+ white-space: -moz-pre-wrap; /* Mozilla, since 1999 */
+ white-space: -pre-wrap; /* Opera 4-6 */
+ white-space: -o-pre-wrap; /* Opera 7 */
+ word-wrap: break-word; /* Internet Explorer 5.5+ */
+ }
+ }
+ blockquote {
+ .article-blockquote;
+ }
+ article {
+ hr {
+ margin-top: 0;
+ margin-bottom: 0;
+ }
+ p.badge {
+ background-color: #aaa;
+ display: inline-block;
+ padding: 0.25em 0.5em;
+ margin: 0;
+ float: right;
+ color: white;
+ .rounded(.25em);
+ }
+ }
+ header {
+ nav {
+ span, a {
+ &.pinned {
+ &+.pinned {
+ margin-left: 1.5em;
+ }
+ }
+ }
+ }
+ }
+ footer {
+ nav {
+ a {
+ margin-top: 0;
+ }
+ }
+ }
+ }
+ collection {
+ #welcome, .access {
+ margin: 0 auto;
+ max-width: 35em;
+ h2 {
+ font-weight: normal;
+ margin-bottom: 1em;
+ }
+ p {
+ font-size: 1.2em;
+ line-height: 1.6;
+ }
+ }
+ .access {
+ margin: 8em auto;
+ text-align: center;
+ h2, ul.errors {
+ font-size: 1.2em;
+ margin-bottom: 1.5em !important;
+ }
+ }
+ header {
+ padding: 0 1em;
+ text-align: center;
+ max-width: 50em;
+ margin: 3em auto 4em;
+
+ .writeas-prefix {
+ a {
+ color: #aaa;
+ }
+ display: block;
+ margin-bottom: 0.5em;
+ }
+ nav {
+ display: block;
+ margin: 1em 0;
+ a:first-child {
+ margin: 0;
+ }
+ }
+ }
+ nav#manage {
+ position: absolute;
+ top: 1em;
+ left: 1.5em;
+ li a.write {
+ font-family: @serifFont;
+ padding-top: 0.2em;
+ padding-bottom: 0.2em;
+ }
+ }
+ pre {
+ line-height: 1.5;
+ }
+ }
+ subpage {
+ #wrapper {
+ h1 {
+ font-size: 2.5em;
+ letter-spacing: -2px;
+ padding: 0 2rem 2rem;
+ }
+ }
+ }
+ post {
+ pre {
+ font-size: 0.75em;
+ }
+ }
+
+ collection, subpage {
+ #wrapper {
+ margin-left: auto;
+ margin-right: auto;
+
+ article {
+ margin-bottom: 4em;
+
+ &:hover {
+ .hidden {
+ .opacity(1);
+ }
+ }
+ }
+ h2 {
+ margin-top: 0em;
+ margin-bottom: 0.25em;
+ &+time {
+ display: block;
+ }
+ }
+ time {
+ font-size: 1.1em;
+
+ &+p {
+ margin-top: 0.25em;
+ }
+ }
+ footer {
+ text-align: left;
+ padding: 0;
+ }
+ }
+ #paging {
+ overflow: visible;
+ padding: 1em 6em 0;
+ }
+ a.read-more {
+ color: #666;
+ }
+ }
+
+ me #official-writing {
+ h2 {
+ font-weight: normal;
+ a {
+ font-size: 0.6em;
+ margin-left: 1em;
+ }
+ a[name] {
+ margin-left: 0;
+ }
+ a:link, a:visited {
+ color: @textLinkColor;
+ }
+ a:hover {
+ text-decoration: underline;
+ }
+ }
+ }
+ promo {
+ div.heading {
+ margin: 8em 0;
+ }
+ div.heading, div.attention-form {
+ h1 {
+ font-size: 3.5em;
+ }
+ input {
+ padding-left: 0.75em;
+ padding-right: 0.75em;
+ &[type=email] {
+ max-width: 16em;
+ }
+ &[type=submit] {
+ padding-left: 1.5em;
+ padding-right: 1.5em;
+ }
+ }
+ }
+ h2 {
+ margin-bottom: 0;
+ font-size: 1.8em;
+ font-weight: normal;
+ span.write-as {
+ color: black;
+ }
+ &.soon {
+ color: lighten(@subheaders, 50%);
+ span {
+ &.write-as {
+ color: lighten(#000, 50%);
+ }
+ &.note {
+ color: lighten(#333, 50%);
+ font-variant: small-caps;
+ margin-left: 0.5em;
+ }
+ }
+ }
+ }
+ .half-col a {
+ margin-left: 1em;
+ margin-right: 1em;
+ }
+ }
+ nav#top-nav {
+ display: inline;
+ position: absolute;
+ top: 1.5em;
+ right: 1.5em;
+ font-size: 0.95rem;
+ font-family: @sansFont;
+ text-transform: uppercase;
+ a {
+ color: #777;
+ }
+ a + a {
+ margin-left: 1em;
+ }
+ }
+
+ footer {
+ nav, ul {
+ a {
+ display: inline-block;
+ margin-top: 0.8em;
+ .transition-duration(0.1s);
+ text-decoration: none;
+ + a {
+ margin-left: 0.8em;
+ }
+ &:link, &:visited {
+ color: #999;
+ }
+ &:hover {
+ color: #666;
+ text-decoration: none;
+ }
+ }
+ }
+ a.home {
+ &:link, &:visited {
+ color: #333;
+ }
+ font-weight: bold;
+ text-decoration: none;
+ &:hover {
+ color: #000;
+ }
+ }
+ ul {
+ list-style: none;
+ text-align: left;
+ padding-left: 0 !important;
+ margin-left: 0 !important;
+ .icons img {
+ height: 16px;
+ width: 16px;
+ fill: #999;
+ }
+ }
+ }
+}
+
+.post-title {
+ a {
+ &:link {
+ color: #333;
+ }
+ &:visited {
+ color: #444;
+ }
+ }
+ time, time a:link, time a:visited, &+.time {
+ color: #999;
+ }
+}
+
+.hidden {
+ -moz-transition-property: opacity;
+ -webkit-transition-property: opacity;
+ -o-transition-property: opacity;
+ transition-property: opacity;
+ .transition-duration(0.4s);
+ .opacity(0);
+}
+
+a {
+ text-decoration: none;
+ &:hover {
+ text-decoration: underline;
+ }
+ &.subdued {
+ color: #999;
+ &:hover {
+ border-bottom: 1px solid #999;
+ text-decoration: none;
+ }
+ }
+ &.danger {
+ color: @dangerCol;
+ font-size: 0.86em;
+ }
+ &.simple-cta {
+ text-decoration: none;
+ border-bottom: 1px solid #ccc;
+ color: #333;
+ padding-bottom: 2px;
+ &:hover {
+ text-decoration: none;
+ }
+ }
+ &.action-btn {
+ font-family: @sansFont;
+ text-transform: uppercase;
+ .rounded(.25em);
+ background-color: red;
+ color: white;
+ font-weight: bold;
+ padding: 0.5em 0.75em;
+ &:hover {
+ background-color: lighten(#f00, 5%);
+ text-decoration: none;
+ }
+ }
+ &.hashtag:hover {
+ text-decoration: none;
+ span + span {
+ text-decoration: underline;
+ }
+ }
+ &.hashtag {
+ span:first-child {
+ color: #999;
+ margin-right: 0.1em;
+ font-size: 0.86em;
+ text-decoration: none;
+ }
+ }
+}
+
+abbr {
+ border-bottom: 1px dotted #999;
+ text-decoration: none;
+ cursor: help;
+}
+
+body#collection article p, body#subpage article p {
+ .article-p;
+}
+pre, body#post article, body#collection article, body#subpage article, body#subpage #wrapper h1 {
+ max-width: 40rem;
+ margin: 0 auto;
+}
+textarea, pre, body#post article, body#collection article p {
+ &.norm, &.sans, &.wrap {
+ line-height: 1.4em;
+ white-space: pre-wrap; /* CSS 3 */
+ white-space: -moz-pre-wrap; /* Mozilla, since 1999 */
+ white-space: -pre-wrap; /* Opera 4-6 */
+ white-space: -o-pre-wrap; /* Opera 7 */
+ word-wrap: break-word; /* Internet Explorer 5.5+ */
+ }
+}
+textarea, pre, body#post article, body#collection article, body#subpage article, span, .font {
+ &.norm {
+ font-family: @serifFont;
+ }
+ &.sans {
+ font-family: @sansFont;
+ }
+ &.mono, &.wrap, &.code {
+ font-family: @monoFont;
+ }
+ &.mono, &.code {
+ max-width: none !important;
+ }
+}
+textarea {
+ &.section {
+ border: 1px solid #ccc;
+ padding: 0.65em 0.75em;
+ .rounded(.25em);
+ &.codable {
+ height: 12em;
+ resize: vertical;
+ }
+ }
+}
+.ace_editor {
+ height: 12em;
+ border: 1px solid #333;
+ max-width: initial;
+ width: 100%;
+ font-size: 0.86em !important;
+ border: 1px solid #ccc;
+ padding: 0.65em 0.75em;
+ margin: 0;
+ .rounded(.25em);
+}
+
+p {
+ -webkit-font-smoothing: antialiased;
+ -moz-osx-font-smoothing: grayscale;
+ &.intro {
+ font-size: 1.25em;
+ text-align: center;
+ }
+ &.upgrade-prompt {
+ font-size: 0.9em;
+ color: #444;
+ }
+ &.text-cta {
+ font-size: 1.2em;
+ text-align: center;
+ margin-bottom: 0.5em;
+ &+ p {
+ text-align: center;
+ font-size: 0.7em;
+ margin-top: 0;
+ color: #666;
+ }
+ }
+ &.error {
+ font-style: italic;
+ color: @errUrgentCol;
+ }
+ &.headeresque {
+ font-size: 2em;
+ }
+}
+
+table.classy {
+ width: 95%;
+ border-collapse: collapse;
+ margin-bottom: 2em;
+
+ tr + tr {
+ border-top: 1px solid #ccc;
+ }
+ th {
+ text-transform: uppercase;
+ font-weight: normal;
+ font-size: 95%;
+ font-family: @sansFont;
+ padding: 1rem 0.75rem;
+ text-align: center;
+ }
+ td {
+ height: 3.5rem;
+ }
+ p {
+ margin-top: 0 !important;
+ margin-bottom: 0 !important;
+ }
+
+ &.export {
+ .disabled {
+ color: #999;
+ }
+ .disabled, a {
+ text-transform: lowercase;
+ }
+ }
+}
+
+body#collection article, body#subpage article {
+ padding-top: 0;
+ padding-bottom: 0;
+ .book {
+ a.hidden.action {
+ color: #666;
+ float: right;
+ font-size: 1em;
+ margin-left: 1em;
+ margin-bottom: 1em;
+ }
+ }
+}
+body#post article {
+ p.badge {
+ font-size: 0.9em;
+ }
+}
+
+article {
+ h2.post-title a[rel=nofollow]::after {
+ content: '\a0 \2934';
+ }
+}
+
+
+table.downloads {
+ width: 100%;
+ td {
+ text-align: center;
+ }
+ img.os {
+ width: 48px;
+ vertical-align: middle;
+ margin-bottom: 6px;
+ }
+}
+
+select.inputform, textarea.inputform {
+ border: 1px solid #999;
+}
+
+input, button, select.inputform, textarea.inputform {
+ padding: 0.5em;
+ font-family: @serifFont;
+ font-size: 100%;
+ .rounded(.25em);
+ &[type=submit], &.submit {
+ border: 1px solid @primary;
+ background: @primary;
+ color: white;
+ .transition(0.2s);
+ &:hover {
+ background-color: lighten(@primary, 3%);
+ }
+ &:disabled {
+ cursor: default;
+ background-color: desaturate(@primary, 100%) !important;
+ border-color: desaturate(@primary, 100%) !important;
+ }
+ }
+ &.error[type=text], textarea.error {
+ -webkit-transition: all 0.30s ease-in-out;
+ -moz-transition: all 0.30s ease-in-out;
+ -ms-transition: all 0.30s ease-in-out;
+ -o-transition: all 0.30s ease-in-out;
+ outline: none;
+ }
+ &.danger {
+ border: 1px solid @dangerCol;
+ background: @dangerCol;
+ color: white;
+ &:hover {
+ background-color: lighten(@dangerCol, 3%);
+ }
+ }
+
+ &.error[type=text]:focus, textarea.error:focus {
+ box-shadow: 0 0 5px @errUrgentCol;
+ border: 1px solid @errUrgentCol;
+ }
+}
+
+div.flat-select {
+ display: inline-block;
+ position: relative;
+ select {
+ border: 0;
+ background: 0;
+ -webkit-appearance: none;
+ -moz-appearance: none;
+ appearance: none;
+ position: absolute;
+ top: 0;
+ left: 0;
+ right: 0;
+ bottom: 0;
+ width: 100%;
+ height: 100%;
+ opacity: 0;
+ }
+
+ &.action {
+ &:hover {
+ label {
+ text-decoration: underline;
+ }
+ }
+ label, select {
+ cursor: pointer;
+ }
+ }
+}
+
+input {
+ &.underline{
+ border: none;
+ border-bottom: 1px solid #ccc;
+ padding: 0 .2em .2em;
+ font-size: 0.9em;
+ color: #333;
+ }
+ &.inline {
+ padding: 0.2rem 0.2rem;
+ margin-left: 0;
+ font-size: 1em;
+ border: 0 !important;
+ border-bottom: 1px solid #999 !important;
+ width: 7em;
+ .rounded(0);
+ }
+
+ &[type=tel], &[type=text], &[type=email], &[type=password] {
+ border: 1px solid #999;
+ }
+ &.boxy {
+ border: 1px solid #999 !important;
+ }
+}
+
+#beta, .content-container {
+ max-width: 50em;
+ margin: 0 auto 3em;
+ font-size: 1.2em;
+
+ &.tight {
+ max-width: 30em;
+ }
+ &.snug {
+ max-width: 40em;
+ }
+ &.regular {
+ font-size: 1em;
+ }
+ .app {
+ + .app {
+ margin-top: 1.5em;
+ }
+ h2 {
+ margin-bottom: 0.25em;
+ }
+ p {
+ margin-top: 0.25em;
+ }
+ }
+
+ h2.intro {
+ font-weight: normal;
+ }
+ p {
+ line-height: 1.4;
+ }
+ li {
+ margin: 0.3em 0;
+ }
+ h2 {
+ &.light {
+ font-weight: normal;
+ }
+ a {
+ .transition-duration(0.2s);
+ -moz-transition-property: color;
+ -webkit-transition-property: color;
+ -o-transition-property: color;
+ transition-property: color;
+
+ &:link, &:visited, &:hover {
+ color: @subheaders;
+ }
+ &:hover {
+ color: lighten(@subheaders, 10%);
+ text-decoration: none;
+ }
+ }
+ }
+}
+.content-container {
+ pricing {
+ button {
+ cursor: pointer;
+ color: white;
+ margin-top: 1em;
+ margin-bottom: 1em;
+ padding-left: 1.5em;
+ padding-right: 1.5em;
+ border: 0;
+ background: @primary;
+ .rounded(.25em);
+ .transition(0.2s);
+
+ &:hover {
+ background-color: lighten(@primary, 5%);
+ }
+ &.unselected {
+ cursor: pointer;
+ }
+ }
+ h2 span {
+ font-weight: normal;
+ }
+ .half {
+ margin: 0 0 1em 0;
+ text-align: center;
+ }
+ }
+ div.features {
+ margin-top: 1.5em;
+ text-align: center;
+ font-size: 0.86em;
+ ul {
+ text-align: left;
+ max-width: 26em;
+ margin-left: auto !important;
+ margin-right: auto !important;
+ li.soon, span.soon {
+ color: lighten(#111, 40%);
+ }
+ }
+ }
+ div.blurbs {
+ >h2 {
+ text-align: center;
+ color: #333;
+ font-weight: normal;
+ }
+ p.price {
+ font-size: 1.2em;
+ margin-bottom: 0;
+ color: #333;
+ margin-top: 0.5em;
+ &+p {
+ margin-top: 0;
+ font-size: 0.8em;
+ }
+ }
+ p.text-cta {
+ font-size: 1em;
+ }
+ }
+}
+footer div.blurbs {
+ display: flex;
+ flex-flow: row;
+ flex-wrap: wrap;
+}
+div.blurbs {
+ .half, .third, .fourth {
+ font-size: 0.86em;
+ h3 {
+ font-weight: normal;
+ }
+ p, ul {
+ color: #595959;
+ }
+ hr {
+ margin: 1em 0;
+ }
+ }
+ .half {
+ padding: 0 1em 0 0;
+ width: ~"calc(50% - 1em)";
+ &+.half {
+ padding: 0 0 0 1em;
+ }
+ }
+ .third {
+ padding: 0;
+ width: ~"calc(33% - 1em)";
+ &+.third {
+ padding: 0 0 0 1em;
+ }
+ }
+ .fourth {
+ flex: 1 1 25%;
+ -webkit-flex: 1 1 25%;
+ h3 {
+ margin-bottom: 0.5em;
+ }
+ ul {
+ margin-top: 0.5em;
+ }
+ }
+}
+.contain-me {
+ text-align: left;
+ margin: 0 auto 4em;
+ max-width: 50em;
+ h2 + p, h2 + p + p, p.describe-me {
+ margin-left: 1.5em;
+ margin-right: 1.5em;
+ color: #333;
+ }
+}
+footer.contain-me {
+ font-size: 1.1em;
+}
+#official-writing, #wrapper {
+ h2, h3, h4 {
+ color: @subheaders;
+ }
+ ul {
+ &.collections {
+ margin-left: 0;
+ li {
+ &.collection {
+ a.title {
+ &:link, &:visited {
+ color: @headerTextColor;
+ }
+ }
+ }
+ a.create {
+ color: #444;
+ }
+ }
+ & + p {
+ margin-top: 2em;
+ margin-left: 1em;
+ }
+ }
+ }
+}
+
+#official-writing, #wrapper {
+ h2 {
+ &.major {
+ color: #222;
+ }
+ &.bugfix {
+ color: #666;
+ }
+
+ +.android-version {
+ a {
+ color: #999;
+ &:hover {
+ text-decoration: underline;
+ }
+ }
+ }
+ }
+}
+
+li {
+ line-height: 1.4;
+
+ .item-desc, .prog-lang {
+ font-size: 0.6em;
+ font-family: 'Open Sans', sans-serif;
+ font-weight: bold;
+ margin-left: 0.5em;
+ margin-right: 0.5em;
+ text-transform: uppercase;
+ color: #999;
+ }
+}
+
+.success {
+ color: darken(@proSelectedCol, 20%);
+}
+
+.alert {
+ padding: 1em;
+ margin-bottom: 1.25em;
+ border: 1px solid transparent;
+ .rounded(.25em);
+ &.info {
+ color: #31708f;
+ background-color: #d9edf7;
+ border-color: #bce8f1;
+ }
+ &.success {
+ color: #3c763d;
+ background-color: #dff0d8;
+ border-color: #d6e9c6;
+ }
+
+ p {
+ margin: 0;
+ &+p {
+ margin-top: 0.5em;
+ }
+ }
+ p.dismiss {
+ font-family: @sansFont;
+ text-align: right;
+ font-size: 0.86em;
+ text-transform: uppercase;
+ }
+}
+
+ul.errors {
+ padding: 0;
+ text-indent: 0;
+ li.urgent {
+ list-style: none;
+ font-style: italic;
+ text-align: center;
+ color: @errUrgentCol;
+ a:link, a:visited {
+ color: purple;
+ }
+ }
+ li.info {
+ list-style: none;
+ font-size: 1.1em;
+ text-align: center;
+ }
+}
+
+body#pad #target a.upgrade-prompt {
+ padding-left: 1em;
+ padding-right: 1em;
+ text-align: center;
+ font-style: italic;
+ color: @primary;
+}
+
+body#pad-sub #posts, .atoms {
+ margin-top: 1.5em;
+
+ h3 {
+ margin-bottom: 0.25em;
+ &+ h4 {
+ margin-top: 0.25em;
+ margin-bottom: 0.5em;
+ &+ p {
+ margin-top: 0.5em;
+ }
+ }
+ .electron {
+ font-weight: normal;
+ margin-left: 0.5em;
+ }
+ }
+ h3, h4 {
+ a {
+ .transition-duration(0.2s);
+ -moz-transition-property: color;
+ -webkit-transition-property: color;
+ -o-transition-property: color;
+ transition-property: color;
+ }
+ }
+ h4 {
+ font-size: 0.9em;
+ font-weight: normal;
+ }
+ date, .electron {
+ margin-right: 0.5em;
+ }
+ .action {
+ font-size: 1em;
+ }
+ #more-posts p {
+ text-align: center;
+ font-size: 1.1em;
+ }
+ p {
+ font-size: 0.86em;
+ }
+ .error {
+ display: inline-block;
+ font-size: 0.8em;
+ font-style: italic;
+ color: @errUrgentCol;
+
+ strong {
+ font-style: normal;
+ }
+ }
+ .error + nav {
+ display: inline-block;
+ font-size: 0.8em;
+ margin-left: 1em;
+
+ a + a {
+ margin-left: 0.75em;
+ }
+ }
+}
+
+h2 {
+ a, time {
+ &+.action {
+ margin-left: 0.5em;
+ }
+ }
+}
+.action {
+ font-size: 0.7em;
+ font-weight: normal;
+ font-family: @serifFont;
+
+ &+ .action {
+ margin-left: 0.5em;
+ }
+ &.new-post {
+ font-weight: bold;
+ }
+}
+article.moved {
+ p {
+ font-size: 1.2em;
+ color: #999;
+ }
+}
+span.as {
+ .opacity(0.2);
+ font-weight: normal;
+}
+span.ras {
+ .opacity(0.6);
+ font-weight: normal;
+}
+
+header {
+ nav {
+ .username {
+ font-size: 2em;
+ font-weight: normal;
+ color: #555;
+ }
+ user-nav {
+ margin-left: 0;
+ & > a, .tabs > a {
+ &.selected {
+ cursor: default;
+ font-weight: bold;
+ &:hover {
+ text-decoration: none;
+ }
+ }
+ & + a {
+ margin-left: 2em;
+ }
+ }
+ a {
+ font-size: 1.2em;
+ font-family: @sansFont;
+ span {
+ font-size: 0.7em;
+ color: #999;
+ text-transform: uppercase;
+ margin-left: 0.5em;
+ margin-right: 0.5em;
+ &.pro {
+ color: @proSelectedCol;
+ }
+ }
+ }
+ nav > ul > li:first-child {
+ &> a {
+ display: inline-block;
+ }
+ img {
+ position: relative;
+ top: -0.5em;
+ right: 0.3em;
+ }
+ }
+ ul ul {
+ font-size: 0.8em;
+ a {
+ padding-top: 0.25em;
+ padding-bottom: 0.25em;
+ }
+ }
+ li {
+ line-height: 1.5;
+ }
+ }
+ &.tabs {
+ margin: 0;
+ }
+ }
+ .dash-nav {
+ font-weight: bold;
+ }
+}
+
+li#create-collection {
+ display: none;
+ h4 {
+ margin-top: 0px;
+ margin-bottom: 0px;
+ }
+ input[type=submit] {
+ margin-left: 0.5em;
+ }
+}
+
+#collection-options {
+ .option {
+ textarea {
+ font-size: 0.86em;
+ font-family: @monoFont;
+ }
+ .section > p.explain {
+ font-size: 0.8em;
+ }
+ }
+}
+
+.img-placeholder {
+ text-align: center;
+ img {
+ max-width: 100%;
+ }
+}
+
+dl {
+ &.admin-dl-horizontal {
+ dt {
+ font-weight: bolder;
+ width: 360px;
+ }
+ dd {
+ line-height: 1.5;
+ }
+ }
+}
+dt {
+ float: left;
+ clear: left;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ white-space: nowrap;
+}
+form {
+ dt, dd {
+ padding: 0.5rem 0;
+ }
+ dt {
+ line-height: 1.8;
+ }
+ dd {
+ font-size: 0.86em;
+ line-height: 2;
+ }
+}
+div.row {
+ display: flex;
+ align-items: center;
+ > div {
+ flex: 1;
+ }
+}
+
+@media all and (max-width: 450px) {
+ body#post {
+ header {
+ nav {
+ .xtra-feature {
+ display: none;
+ }
+ }
+ }
+ }
+}
+@media all and (min-width: 1280px) {
+ body#promo {
+ div.heading {
+ margin: 10em 0;
+ }
+ }
+}
+
+@media all and (min-width: 1600px) {
+ body#promo {
+ div.heading {
+ margin: 14em 0;
+ }
+ }
+}
+
+@media all and (max-width: 900px) {
+ .half.big {
+ padding: 0 !important;
+ width: 100% !important;
+ }
+ .third {
+ padding: 0 !important;
+ float: none;
+ width: 100% !important;
+ p.introduction {
+ font-size: 0.86em;
+ }
+ }
+ div.blurbs {
+ .fourth {
+ flex: 1 1 15em;
+ -webkit-flex: 1 1 15em;
+ }
+ }
+ .blurbs .third, .blurbs .half {
+ p, ul {
+ text-align: left;
+ }
+ }
+ .half-col, .big {
+ float: none;
+ text-align: center;
+
+ &+.half-col, &+.big {
+ margin-top: 4em !important;
+ margin-left: 0;
+ }
+ }
+ #beta, .content-container {
+ font-size: 1.15em;
+ }
+}
+
+@media all and (max-width: 600px) {
+ div.row {
+ flex-direction: column;
+ }
+ .half {
+ padding: 0 !important;
+ width: 100% !important;
+ }
+ .third {
+ width: 100% !important;
+ float: none;
+ }
+ body#promo {
+ div.heading {
+ margin: 6em 0;
+ }
+ h2 {
+ font-size: 1.6em;
+ }
+ .half-col a + a {
+ margin-left: 1em;
+ }
+ .half-col a.channel {
+ margin-left: auto !important;
+ margin-right: auto !important;
+ }
+ }
+ ul.add-integrations {
+ li {
+ display: list-item;
+ &+ li {
+ margin-left: 0;
+ }
+ }
+ }
+}
+
+@media all and (max-height: 500px) {
+ body#promo {
+ div.heading {
+ margin: 5em 0;
+ }
+ }
+}
+
+@media all and (max-height: 400px) {
+ body#promo {
+ div.heading {
+ margin: 0em 0;
+ }
+ }
+}
+
+/* Smartphones (portrait and landscape) ----------- */
+@media only screen and (min-device-width : 320px) and (max-device-width : 480px) {
+ header {
+ .opacity(1);
+ }
+}
+
+/* Smartphones (portrait) ----------- */
+@media only screen and (max-width : 320px) {
+ .content-container#pricing {
+ .half {
+ float: none;
+ width: 100%;
+ }
+ }
+ header {
+ .opacity(1);
+ }
+}
+
+/* iPads (portrait and landscape) ----------- */
+@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) {
+ header {
+ .opacity(1);
+ }
+}
+
+@media (pointer: coarse) {
+ body footer nav a:not(.pubd) {
+ padding: 0.8em 1em;
+ margin-left: 0;
+ margin-top: 0;
+ }
+}
+
+@media print {
+ h1 {
+ page-break-before: always;
+ }
+
+ h1, h2, h3, h4, h5, h6 {
+ page-break-after: avoid;
+ }
+
+ table, figure {
+ page-break-inside: avoid;
+ }
+
+ header, footer {
+ display: none;
+ }
+ article#post-body {
+ margin-top: 2em;
+ margin-left: 0;
+ margin-right: 0;
+ }
+ hr {
+ border: 1px solid #ccc;
+ }
+}
+
+.code-block {
+ padding: 0;
+ max-width: 100%;
+ margin: 0;
+ background: #f8f8f8;
+ border: 1px solid #ccc;
+ padding: 0.375em 0.625em;
+ font-size: 0.86em;
+ .rounded(.25em);
+}
+pre.code-block {
+ overflow-x: auto;
+}
diff --git a/less/effects.less b/less/effects.less
new file mode 100644
index 0000000..102e997
--- /dev/null
+++ b/less/effects.less
@@ -0,0 +1,39 @@
+.effect {
+ -moz-animation-name: fadeIn;
+ -webkit-animation-name: fadeIn;
+ -ms-animation-name: fadeIn;
+ animation-name: fadeIn;
+ -moz-animation-duration: .4s;
+ -webkit-animation-duration: .4s;
+ -ms-animation-duration: .4s;
+ animation-duration: .4s;
+ -moz-animation-timing-function: ease-in-out;
+ -webkit-animation-timing-function: ease-in-out;
+ -ms-animation-timing-function: ease-in-out;
+ animation-timing-function: ease-in-out;
+ -moz-animation-fill-mode: forwards;
+ -webkit-animation-fill-mode: forwards;
+ -ms-animation-fill-mode: forwards;
+ animation-fill-mode: forwards;
+}
+
+.effect.fade-out {
+ -moz-animation-name: fadeOut;
+ -webkit-animation-name: fadeOut;
+ -ms-animation-name: fadeOut;
+ animation-name: fadeOut;
+}
+.del-undo {
+ display: none;
+}
+
+
+@-moz-keyframes fadeIn { 0% { opacity: 0; position: static; } 100% { opacity: 1; }}
+@-webkit-keyframes fadeIn { 0% { opacity: 0; position: static; } 100% { opacity: 1; }}
+@-ms-keyframes fadeIn { 0% { opacity: 0; position: static; } 100% { opacity: 1; }}
+@-keyframes fadeIn { 0% { opacity: 0; position: static; } 100% { opacity: 1; }}
+
+@-moz-keyframes fadeOut { 0% { opacity: 1; } 100% { opacity: 0; position: absolute; top: -1000px; left: -1000px; }}
+@-webkit-keyframes fadeOut { 0% { opacity: 1; } 100% { opacity: 0; position: absolute; top: -1000px; left: -1000px; }}
+@-ms-keyframes fadeOut { 0% { opacity: 1; } 100% { opacity: 0; position: absolute; top: -1000px; left: -1000px; }}
+@-keyframes fadeOut { 0% { opacity: 1; } 100% { opacity: 0; position: absolute; top: -1000px; left: -1000px; }}
diff --git a/less/fonts.less b/less/fonts.less
new file mode 100644
index 0000000..7ccc71c
--- /dev/null
+++ b/less/fonts.less
@@ -0,0 +1,64 @@
+/* open-sans-regular - latin */
+@font-face {
+ font-family: 'Open Sans';
+ font-style: normal;
+ font-weight: 400;
+ src: url('/fonts/open-sans-v13-latin-regular.eot'); /* IE9 Compat Modes */
+ src: local('Open Sans'), local('OpenSans'),
+ url('/fonts/open-sans-v13-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
+ url('/fonts/open-sans-v13-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
+ url('/fonts/open-sans-v13-latin-regular.woff') format('woff'), /* Modern Browsers */
+ url('/fonts/open-sans-v13-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
+ url('/fonts/open-sans-v13-latin-regular.svg#OpenSans') format('svg'); /* Legacy iOS */
+}
+/* open-sans-700 - latin */
+@font-face {
+ font-family: 'Open Sans';
+ font-style: normal;
+ font-weight: 700;
+ src: url('/fonts/open-sans-v13-latin-700.eot'); /* IE9 Compat Modes */
+ src: local('Open Sans Bold'), local('OpenSans-Bold'),
+ url('/fonts/open-sans-v13-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
+ url('/fonts/open-sans-v13-latin-700.woff2') format('woff2'), /* Super Modern Browsers */
+ url('/fonts/open-sans-v13-latin-700.woff') format('woff'), /* Modern Browsers */
+ url('/fonts/open-sans-v13-latin-700.ttf') format('truetype'), /* Safari, Android, iOS */
+ url('/fonts/open-sans-v13-latin-700.svg#OpenSans') format('svg'); /* Legacy iOS */
+}
+/* lora-regular - latin */
+@font-face {
+ font-family: 'Lora';
+ font-style: normal;
+ font-weight: 400;
+ src: url('/fonts/lora-v9-latin-regular.eot'); /* IE9 Compat Modes */
+ src: local('Lora'), local('Lora-Regular'),
+ url('/fonts/lora-v9-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
+ url('/fonts/lora-v9-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
+ url('/fonts/lora-v9-latin-regular.woff') format('woff'), /* Modern Browsers */
+ url('/fonts/lora-v9-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
+ url('/fonts/lora-v9-latin-regular.svg#Lora') format('svg'); /* Legacy iOS */
+}
+/* lora-700 - latin */
+@font-face {
+ font-family: 'Lora';
+ font-style: normal;
+ font-weight: 700;
+ src: url('/fonts/lora-v9-latin-700.eot'); /* IE9 Compat Modes */
+ src: local('Lora Bold'), local('Lora-Bold'),
+ url('/fonts/lora-v9-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
+ url('/fonts/lora-v9-latin-700.woff2') format('woff2'), /* Super Modern Browsers */
+ url('/fonts/lora-v9-latin-700.woff') format('woff'), /* Modern Browsers */
+ url('/fonts/lora-v9-latin-700.ttf') format('truetype'), /* Safari, Android, iOS */
+ url('/fonts/lora-v9-latin-700.svg#Lora') format('svg'); /* Legacy iOS */
+}
+@font-face {
+ font-family: 'Lora';
+ font-style: italic;
+ font-weight: 400;
+ src: url('/fonts/lora-v10-latin_latin-ext-italic.eot'); /* IE9 Compat Modes */
+ src: local('Lora Italic'), local('Lora-Italic'),
+ url('/fonts/lora-v10-latin-italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
+ url('/fonts/lora-v10-latin-italic.woff2') format('woff2'), /* Super Modern Browsers */
+ url('/fonts/lora-v10-latin-italic.woff') format('woff'), /* Modern Browsers */
+ url('/fonts/lora-v10-latin-italic.ttf') format('truetype'), /* Safari, Android, iOS */
+ url('/fonts/lora-v10-latin-italic.svg#Lora') format('svg'); /* Legacy iOS */
+}
diff --git a/less/icons.less b/less/icons.less
new file mode 100644
index 0000000..2be5064
--- /dev/null
+++ b/less/icons.less
@@ -0,0 +1,38 @@
+@font-face {
+ font-family: 'Material Icons';
+ font-style: normal;
+ font-weight: 400;
+ src: url(MaterialIcons-Regular.eot); /* For IE6-8 */
+ src: local('Material Icons'),
+ local('MaterialIcons-Regular'),
+ url(/fonts/MaterialIcons-Regular.woff2) format('woff2'),
+ url(/fonts/MaterialIcons-Regular.woff) format('woff'),
+ url(/fonts/MaterialIcons-Regular.ttf) format('truetype');
+}
+
+.material-icons {
+ font-family: 'Material Icons';
+ font-weight: normal;
+ font-style: normal;
+ font-size: 24px; /* Preferred icon size */
+ display: inline-block;
+ width: 1em;
+ height: 1em;
+ line-height: 1;
+ text-transform: none;
+ letter-spacing: normal;
+ word-wrap: normal;
+ white-space: nowrap;
+ direction: ltr;
+
+ /* Support for all WebKit browsers. */
+ -webkit-font-smoothing: antialiased;
+ /* Support for Safari and Chrome. */
+ text-rendering: optimizeLegibility;
+
+ /* Support for Firefox. */
+ -moz-osx-font-smoothing: grayscale;
+
+ /* Support for IE. */
+ font-feature-settings: 'liga';
+}
diff --git a/less/install-less.sh b/less/install-less.sh
new file mode 100755
index 0000000..fc86ad2
--- /dev/null
+++ b/less/install-less.sh
@@ -0,0 +1,9 @@
+#!/bin/sh
+
+# Install Less via npm
+if [ ! -e "$(which lessc)" ]; then
+ sudo npm install -g less
+ sudo npm install -g less-plugin-clean-css
+else
+ echo LESS $(npm view less version 2>&1 | grep -v WARN) is installed
+fi
diff --git a/less/lib/elements.less b/less/lib/elements.less
new file mode 100644
index 0000000..9e45973
--- /dev/null
+++ b/less/lib/elements.less
@@ -0,0 +1,156 @@
+/*---------------------------------------------------
+ LESS Elements 0.9
+ ---------------------------------------------------
+ A set of useful LESS mixins
+ More info at: http://lesselements.com
+ ---------------------------------------------------*/
+
+.gradient(@color: #F5F5F5, @start: #EEE, @stop: #FFF) {
+ background: @color;
+ background: -webkit-gradient(linear,
+ left bottom,
+ left top,
+ color-stop(0, @start),
+ color-stop(1, @stop));
+ background: -ms-linear-gradient(bottom,
+ @start,
+ @stop);
+ background: -moz-linear-gradient(center bottom,
+ @start 0%,
+ @stop 100%);
+ background: -o-linear-gradient(@stop,
+ @start);
+ filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)",@stop,@start));
+}
+.bw-gradient(@color: #F5F5F5, @start: 0, @stop: 255) {
+ background: @color;
+ background: -webkit-gradient(linear,
+ left bottom,
+ left top,
+ color-stop(0, rgb(@start,@start,@start)),
+ color-stop(1, rgb(@stop,@stop,@stop)));
+ background: -ms-linear-gradient(bottom,
+ rgb(@start,@start,@start) 0%,
+ rgb(@stop,@stop,@stop) 100%);
+ background: -moz-linear-gradient(center bottom,
+ rgb(@start,@start,@start) 0%,
+ rgb(@stop,@stop,@stop) 100%);
+ background: -o-linear-gradient(rgb(@stop,@stop,@stop),
+ rgb(@start,@start,@start));
+ filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)",rgb(@stop,@stop,@stop),rgb(@start,@start,@start)));
+}
+.bordered(@top-color: #EEE, @right-color: #EEE, @bottom-color: #EEE, @left-color: #EEE) {
+ border-top: solid 1px @top-color;
+ border-left: solid 1px @left-color;
+ border-right: solid 1px @right-color;
+ border-bottom: solid 1px @bottom-color;
+}
+.drop-shadow(@x-axis: 0, @y-axis: 1px, @blur: 2px, @alpha: 0.1) {
+ -webkit-box-shadow: @x-axis @y-axis @blur rgba(0, 0, 0, @alpha);
+ -moz-box-shadow: @x-axis @y-axis @blur rgba(0, 0, 0, @alpha);
+ box-shadow: @x-axis @y-axis @blur rgba(0, 0, 0, @alpha);
+}
+.rounded(@radius: 2px) {
+ -webkit-border-radius: @radius;
+ -moz-border-radius: @radius;
+ border-radius: @radius;
+}
+.border-radius(@topright: 0, @bottomright: 0, @bottomleft: 0, @topleft: 0) {
+ -webkit-border-top-right-radius: @topright;
+ -webkit-border-bottom-right-radius: @bottomright;
+ -webkit-border-bottom-left-radius: @bottomleft;
+ -webkit-border-top-left-radius: @topleft;
+ -moz-border-radius-topright: @topright;
+ -moz-border-radius-bottomright: @bottomright;
+ -moz-border-radius-bottomleft: @bottomleft;
+ -moz-border-radius-topleft: @topleft;
+ border-top-right-radius: @topright;
+ border-bottom-right-radius: @bottomright;
+ border-bottom-left-radius: @bottomleft;
+ border-top-left-radius: @topleft;
+ .background-clip(padding-box);
+}
+.opacity(@opacity: 0.5) {
+ -moz-opacity: @opacity;
+ -khtml-opacity: @opacity;
+ -webkit-opacity: @opacity;
+ opacity: @opacity;
+ @opperc: @opacity * 100;
+ -ms-filter: ~"progid:DXImageTransform.Microsoft.Alpha(opacity=@{opperc})";
+ filter: ~"alpha(opacity=@{opperc})";
+}
+.transition-duration(@duration: 0.2s) {
+ -moz-transition-duration: @duration;
+ -webkit-transition-duration: @duration;
+ -o-transition-duration: @duration;
+ transition-duration: @duration;
+}
+.transform(...) {
+ -webkit-transform: @arguments;
+ -moz-transform: @arguments;
+ -o-transform: @arguments;
+ -ms-transform: @arguments;
+ transform: @arguments;
+}
+.rotation(@deg:5deg){
+ .transform(rotate(@deg));
+}
+.scale(@ratio:1.5){
+ .transform(scale(@ratio));
+}
+.transition(@duration:0.2s, @ease:ease-out) {
+ -webkit-transition: all @duration @ease;
+ -moz-transition: all @duration @ease;
+ -o-transition: all @duration @ease;
+ transition: all @duration @ease;
+}
+.inner-shadow(@horizontal:0, @vertical:1px, @blur:2px, @alpha: 0.4) {
+ -webkit-box-shadow: inset @horizontal @vertical @blur rgba(0, 0, 0, @alpha);
+ -moz-box-shadow: inset @horizontal @vertical @blur rgba(0, 0, 0, @alpha);
+ box-shadow: inset @horizontal @vertical @blur rgba(0, 0, 0, @alpha);
+}
+.box-shadow(@arguments) {
+ -webkit-box-shadow: @arguments;
+ -moz-box-shadow: @arguments;
+ box-shadow: @arguments;
+}
+.box-sizing(@sizing: border-box) {
+ -ms-box-sizing: @sizing;
+ -moz-box-sizing: @sizing;
+ -webkit-box-sizing: @sizing;
+ box-sizing: @sizing;
+}
+.user-select(@argument: none) {
+ -webkit-user-select: @argument;
+ -moz-user-select: @argument;
+ -ms-user-select: @argument;
+ user-select: @argument;
+}
+.columns(@colwidth: 250px, @colcount: 0, @colgap: 50px, @columnRuleColor: #EEE, @columnRuleStyle: solid, @columnRuleWidth: 1px) {
+ -moz-column-width: @colwidth;
+ -moz-column-count: @colcount;
+ -moz-column-gap: @colgap;
+ -moz-column-rule-color: @columnRuleColor;
+ -moz-column-rule-style: @columnRuleStyle;
+ -moz-column-rule-width: @columnRuleWidth;
+ -webkit-column-width: @colwidth;
+ -webkit-column-count: @colcount;
+ -webkit-column-gap: @colgap;
+ -webkit-column-rule-color: @columnRuleColor;
+ -webkit-column-rule-style: @columnRuleStyle;
+ -webkit-column-rule-width: @columnRuleWidth;
+ column-width: @colwidth;
+ column-count: @colcount;
+ column-gap: @colgap;
+ column-rule-color: @columnRuleColor;
+ column-rule-style: @columnRuleStyle;
+ column-rule-width: @columnRuleWidth;
+}
+.translate(@x:0, @y:0) {
+ .transform(translate(@x, @y));
+}
+.background-clip(@argument: padding-box) {
+ -moz-background-clip: @argument;
+ -webkit-background-clip: @argument;
+ background-clip: @argument;
+}
\ No newline at end of file
diff --git a/less/lib/material.less b/less/lib/material.less
new file mode 100644
index 0000000..2442d39
--- /dev/null
+++ b/less/lib/material.less
@@ -0,0 +1,19 @@
+/* Rules for sizing the icon. */
+.material-icons {
+ &.md-18 { font-size: 18px; }
+ &.md-24 { font-size: 24px; }
+ &.md-36 { font-size: 36px; }
+ &.md-48 { font-size: 48px; }
+
+ /* Rules for using icons as black on a light background. */
+ &.md-dark {
+ color: rgba(0, 0, 0, 0.54);
+ &.md-inactive { color: rgba(0, 0, 0, 0.26); }
+ }
+
+ /* Rules for using icons as white on a dark background. */
+ &.md-light {
+ color: rgba(255, 255, 255, 1);
+ &.md-inactive { color: rgba(255, 255, 255, 0.3); }
+ }
+}
diff --git a/less/new-core.less b/less/new-core.less
new file mode 100644
index 0000000..7c46203
--- /dev/null
+++ b/less/new-core.less
@@ -0,0 +1,258 @@
+@actionNavColor: #999;
+
+body {
+ margin: 0;
+ padding: 0;
+ font-size: 100%;
+
+ footer {
+ text-align: center;
+ padding: 0 2em;
+
+ nav {
+ margin: 3em 0 4em;
+ color: #444;
+
+ a {
+ text-decoration: none;
+ + a {
+ margin-left: 0.8em;
+ }
+ &:link, &:visited {
+ color: #999;
+ }
+ &:hover {
+ color: #666;
+ }
+ &.home {
+ color: #333;
+ font-weight: bold;
+ &:hover {
+ color: #000;
+ }
+ }
+ }
+ }
+ }
+}
+
+header {
+ margin: 1em;
+
+ h1 {
+ display: inline;
+ }
+ nav {
+ display: inline;
+ margin: 0 1em;
+ line-height: 2.4em;
+ span, a {
+ margin: 0 0 0 1em;
+ }
+ a {
+ color: @actionNavColor;
+ &:hover {
+ text-decoration: underline;
+ }
+ }
+ }
+ p {
+ &.description {
+ color: #666;
+ font-size: 1.1em;
+ margin-top: 0.5em;
+ line-height: 1.5;
+ }
+ &.meta-note {
+ color: #333;
+ font-style: italic;
+ margin-top: 2em;
+ span {
+ text-transform: uppercase;
+ font-variant: small-caps;
+ font-size: 0.9em;
+ color: #666;
+ font-style: normal;
+ }
+ }
+ }
+}
+
+hr {
+ border: 0;
+ height: 1px;
+ background: #ccc;
+ max-width: 40em;
+ margin: 4em auto;
+ text-align: center;
+}
+textarea, textarea:focus {
+ border: 0;
+}
+textarea, textarea:focus, input {
+ outline: 0;
+}
+textarea {
+ width: 100%;
+ resize: none;
+ editor {
+ position: fixed;
+ top: 3em;
+ right: 0;
+ bottom: 2em;
+ left: 0;
+ padding: 2em 2em 0 2em;
+ font-size: 2em;
+ box-sizing: border-box;
+ }
+}
+
+#official-writing, #wrapper {
+ margin: 1em 2em;
+
+ ul {
+ margin: 0;
+ padding: 0 0 0 1em;
+ line-height: 1.4;
+
+ &.collections, &.posts, &.integrations {
+ list-style: none;
+ margin-left: 1em;
+ li + li {
+ margin-top: 0.4em;
+ }
+ }
+
+ &.collections li {
+ &.collection {
+ a.title {
+ font-size: 1.3em;
+ font-weight: bold;
+ }
+ }
+ }
+ }
+}
+
+.clearfix {
+ overflow: auto;
+}
+.half-col, .half, .third {
+ float: left;
+ + .half-col {
+ margin-left: 4em;
+ }
+}
+.half {
+ width: 50%;
+}
+.third {
+ width: 33%;
+}
+
+code, textarea#embed {
+ font-family: monospace, monospace;
+ font-size: 1em;
+}
+
+#wrapper {
+ max-width: 50em;
+}
+#official-writing, #wrapper {
+ h2 {
+ &.minor {
+ font-size: 1.3em;
+ }
+ &.bugfix {
+ font-size: 1.15em;
+ }
+
+ +.android-version {
+ margin-top: 0;
+ font-size: 1.1em;
+ a {
+ &:hover {
+ text-decoration: underline;
+ }
+ }
+ }
+ }
+}
+
+#beta, .content-container {
+ max-width: 50em;
+ margin: 0 auto 3em;
+ font-size: 1.2em;
+
+ &.tight {
+ max-width: 30em;
+ }
+ &.snug {
+ max-width: 40em;
+ }
+ .app {
+ + .app {
+ margin-top: 1.5em;
+ }
+ h2 {
+ margin-bottom: 0.25em;
+ }
+ p {
+ margin-top: 0.25em;
+ }
+ }
+
+ h2.intro {
+ font-weight: normal;
+ }
+ p {
+ line-height: 1.4;
+ }
+ li {
+ margin: 0.3em 0;
+ }
+ h2 {
+ &.light {
+ font-weight: normal;
+ }
+ }
+}
+
+#collection-options {
+ #title, #description {
+ width: 100%;
+ box-sizing: border-box;
+ }
+ .option {
+ h2 {
+ margin-top: 2em;
+ margin-bottom: 0.5em;
+ }
+ label {
+ &.option-text.disabled {
+ color: #999;
+
+ #domain-alias {
+ border-color: #ccc;
+ }
+ &+p {
+ color: #555;
+ }
+ }
+ }
+ label+p, p.describe {
+ font-size: 0.8em;
+ margin-top: 0.4em;
+ margin-left: 1.8em;
+ }
+ input.low-profile {
+ padding: 0.25rem 0.5rem;
+ margin-left: 0.25rem;
+ font-size: 0.8em;
+ }
+ .fedi-handle {
+ margin-left: 0.5em;
+ .transition-duration(0.25s);
+ }
+ }
+}
diff --git a/less/pad-theme.less b/less/pad-theme.less
new file mode 100644
index 0000000..af1f95c
--- /dev/null
+++ b/less/pad-theme.less
@@ -0,0 +1,217 @@
+@lightBG: #ffffff;
+@lightTextColor: #000;
+@lightLinkColor: #444;
+@lightNavBG: #fff;
+@lightNavHoverBG: #f6f6f6;
+@lightNavBorder: #ccc;
+
+@darkBG: #222222;
+@darkTextColor: #ffffff;
+@darkLinkColor: #ccc;
+@darkNavBG: #393939;
+@darkNavHoverBG: #555;
+@darkNavBorder: #333;
+
+.pad-theme-transition {
+ -moz-transition-property: background-color, color;
+ -webkit-transition-property: background-color, color;
+ -o-transition-property: background-color, color;
+ transition-property: background-color, color;
+ .transition-duration(0.25s);
+}
+
+body#pad-sub #posts, .atoms {
+ h3 {
+ a {
+ color: @lightTextColor;
+ &:hover {
+ color: darken(@lightTextColor, 10%);
+ }
+ }
+ }
+ h3, h4 {
+ a {
+ color: @lightTextColor;
+ &:hover {
+ color: darken(@lightTextColor, 10%);
+ }
+ }
+ }
+ date, .electron {
+ color: #999;
+ }
+ a.action, a {
+ color: @lightLinkColor;
+ &:hover {
+ color: darken(@lightLinkColor, 10%);
+ }
+ }
+}
+
+body#pad, body#pad-sub {
+ .pad-theme-transition;
+
+ &.light {
+ background-color: @lightBG;
+ color: @lightTextColor;
+ #tools {
+ .pad-theme-transition;
+ background-color: transparent;
+ h1 {
+ a {
+ color: @headerTextColor;
+ }
+ }
+ #belt {
+ a {
+ color: #000;
+ }
+ }
+ .tool {
+ status {
+ color: #999;
+ }
+ }
+ .hidden {
+ wc {
+ color: #777;
+ }
+ }
+ a:hover, a:active {
+ background-color: transparent;
+ color: @lightLinkColor;
+ }
+ }
+ .modal {
+ border-color: @lightNavBorder;
+ background: @lightNavBG;
+ }
+ }
+
+ &.dark {
+ background-color: @darkBG;
+ color: @darkTextColor;
+ #tools {
+ .pad-theme-transition;
+ background-color: #262626;
+ h1 {
+ a {
+ color: @darkTextColor;
+ }
+ }
+ #belt {
+ a {
+ color: white;
+ }
+ }
+ .tool {
+ status {
+ color: #666;
+ }
+ }
+ .hidden {
+ wc {
+ color: #ececec;
+ }
+ }
+ a:hover, a:active {
+ background-color: transparent;
+ color: @darkLinkColor;
+ }
+ nav {
+ &> ul > li a {
+ color: @darkTextColor;
+ }
+ ul {
+ ul {
+ background: @darkNavBG;
+ border-color: @darkNavBorder;
+ }
+ li {
+ &.current-user {
+ color: #fff;
+ }
+ &.selected {
+ a {
+ color: #777;
+ }
+ }
+ }
+ li:hover {
+ background: @darkNavHoverBG;
+ }
+ }
+ }
+ }
+ #posts {
+ h3 {
+ a {
+ color: @darkTextColor;
+ &:hover {
+ color: darken(@darkTextColor, 10%);
+ }
+ }
+ }
+ h3, h4 {
+ a {
+ color: @darkTextColor;
+ &:hover {
+ color: darken(@darkTextColor, 10%);
+ }
+ }
+ }
+ a.action, a {
+ color: @darkLinkColor;
+ &:hover {
+ color: darken(@darkLinkColor, 10%);
+ }
+ }
+ }
+ .modal {
+ border-color: @darkNavBorder;
+ background: @darkNavBG;
+ input {
+ color: #fff;
+ }
+
+ .form-hint {
+ color: #ccc;
+ }
+
+ a:link, a:visited {
+ color: lighten(@primary, 8%);
+ }
+ }
+ }
+}
+
+body#pad {
+ .pad-theme-transition;
+
+ textarea {
+ .pad-theme-transition;
+ }
+
+ &.dark {
+ textarea {
+ background-color: @darkBG;
+ color: @darkTextColor;
+ }
+ }
+ &.light {
+ textarea {
+ background-color: @lightBG;
+ color: @lightTextColor;
+ }
+ }
+}
+
+body {
+ &.dark {
+ nav#top-nav {
+ a {
+ color: @darkLinkColor;
+ }
+ }
+ }
+}
diff --git a/less/pad.less b/less/pad.less
new file mode 100644
index 0000000..d37c6bc
--- /dev/null
+++ b/less/pad.less
@@ -0,0 +1,464 @@
+.dropdown-nav {
+ font-family: @sansFont;
+ line-height: 2em;
+ span {
+ margin: 0;
+ }
+ .material-icons {
+ vertical-align: sub;
+ }
+ >ul>li {
+ line-height: 1.8;
+ bottom: -0.35em;
+ }
+ ul {
+ display: inline;
+ list-style:none;
+ position:relative;
+ margin:0;
+ padding:0;
+
+ ul {
+ display:none;
+ position:absolute;
+ top:100%;
+ left:0;
+ background:#fff;
+ padding:0;
+ max-height: 30em;
+ overflow-y: auto;
+ overflow-x: hidden;
+ border: 1px solid @lightNavBorder;
+ .rounded(.25em);
+ li {
+ line-height: 1.8;
+ display: block;
+ min-width: 9em;
+ max-width: 16em;
+ }
+ }
+ a {
+ display: block;
+ color:#333;
+ text-decoration:none;
+ padding: 0 0.5em;
+ margin: 0;
+ overflow: hidden;
+ white-space: -moz-nowrap; /* Mozilla, since 1999 */
+ white-space: -nowrap; /* Opera 4-6 */
+ white-space: -o-nowrap; /* Opera 7 */
+ white-space: nowrap;
+ &:hover {
+ text-decoration: none;
+ }
+ }
+ li {
+ display: inline-block;
+ position: relative;
+ margin: 0;
+ padding: 0;
+ &:hover {
+ background: @lightNavHoverBG;
+ }
+ &:hover > ul {
+ display: block;
+ }
+ &.selected {
+ a, a:hover {
+ color: #888;
+ }
+ }
+ &.current-user, &.menu-heading {
+ font-weight: bold;
+ padding: 0 .5em;
+ color: #000;
+ &:hover {
+ background-color: transparent !important;
+ }
+ }
+ &.menu-heading {
+ color: #666;
+ font-weight: normal;
+ font-size: 0.8em;
+ padding: 0.2em 0.8em;
+ cursor: default;
+ text-align: left;
+ }
+ hr {
+ margin: 0.5em 0.75em;
+ }
+ }
+ }
+}
+nav#manage {
+ .dropdown-nav;
+ ul ul li {
+ min-width: 11em;
+ img.ic-18dp {
+ margin-top: -2px;
+ }
+ }
+}
+
+img.ic-18dp {
+ width: 18px;
+ height: 18px;
+ vertical-align: middle;
+}
+
+img.ic-24dp {
+ width: 24px;
+ height: 24px;
+ vertical-align: middle;
+}
+
+body#pad, body#pad-sub {
+ margin: 0;
+ padding: 0;
+ font-size: 100%;
+ font-family: Lora, serif;
+
+ header {
+ height: 1.6em;
+ }
+
+ #tools {
+ margin: 0 0 1em;
+ padding: 1em 2em;
+ -moz-transition-property: opacity;
+ -webkit-transition-property: opacity;
+ -o-transition-property: opacity;
+ transition-property: opacity;
+ .transition-duration(0.4s);
+
+ &:hover {
+ .opacity(1);
+
+ .hidden {
+ .opacity(1);
+ }
+ }
+
+ .hidden {
+ wc {
+ position: relative;
+ top: -0.15em;
+ font-size: 0.9em;
+ margin-left: 0.75em;
+ }
+ }
+
+ h1 {
+ display: inline-block;
+ font-family: Lora, serif;
+ margin: 0;
+ font-size: 1.5em;
+
+ a {
+ color: white;
+ }
+ }
+
+ nav {
+ .dropdown-nav;
+ }
+
+ #clip {
+ display: inline-block;
+ margin-top: -0.35em;
+ }
+
+ #belt {
+ float: right;
+
+ a {
+ padding: 1em 1.2em;
+ vertical-align: middle;
+ .opacity(.75);
+ .transition-duration(0.2s);
+ -moz-transition-property: opacity;
+ -webkit-transition-property: opacity;
+ -o-transition-property: opacity;
+ transition-property: opacity;
+
+ &:hover {
+ .opacity(1);
+ }
+
+ &.disabled, &.disabled:hover {
+ .opacity(.3);
+ }
+
+ img.ic-24dp {
+ vertical-align: bottom;
+ }
+
+ .material-icons {
+ vertical-align: middle;
+ max-width: 24px;
+ overflow: hidden;
+ display: inline-block;
+ }
+
+ .material-icons, img.ic-24dp {
+ &+ span {
+ margin-left: .4em;
+ height: 24px;
+ vertical-align: bottom;
+ }
+ }
+ }
+ .tool:last-child a {
+ padding-right: 0;
+ }
+ }
+
+ .tool {
+ display: inline-block;
+ margin: 0;
+
+ status {
+ &.doing {
+ font-style: italic;
+ }
+ }
+ }
+ }
+}
+
+body#pad-sub {
+ .content-container {
+ p {
+ a:hover {
+ text-decoration: underline;
+ }
+ &.status {
+ text-align: center;
+ font-size: 1.1em;
+ &:first-child {
+ margin-top: 1.5em;
+ }
+ }
+ }
+ }
+}
+
+body#pad {
+ textarea,
+ textarea:focus {
+ border: 0;
+ outline: 0;
+ }
+ textarea {
+ position: fixed !important;
+ top: 3em;
+ right: 0;
+ bottom: 0;
+ left: 0;
+ width: 100%;
+ height: auto;
+ height: calc(~"100% - 3em - 1px");
+ padding: 1em 2em 2em;
+ font-size: 1.2em;
+ letter-spacing: 0.6px;
+ box-sizing: border-box;
+ resize: none;
+
+ &.classy {
+ font-family: Lora, serif;
+ letter-spacing: 0.7px;
+ }
+ &.mono, &.code {
+ padding-left: 1em;
+ padding-right: 1em;
+ white-space: -moz-pre; /* Mozilla, since 1999 */
+ white-space: -pre; /* Opera 4-6 */
+ white-space: -o-pre; /* Opera 7 */
+ white-space: pre;
+ word-wrap: normal;
+ }
+ &.norm, &.sans, &.wrap {
+ line-height: 1.4;
+ }
+ }
+
+ #tools {
+ position: fixed;
+ top: 0;
+ left: 0;
+ right: 0;
+ margin: 0;
+ .opacity(.2);
+
+ .mode-wp {
+ font-family: serif;
+ }
+ .mode-typewriter {
+ font-family: "Courier New", monospace;
+ font-size: 1em;
+ }
+ }
+}
+
+.modal {
+ display: none;
+ position: absolute;
+ z-index: 11;
+ top: 3em;
+ left: 50%;
+ width: 30em;
+ margin-left: -15em;
+ padding: 1.5em 2em;
+ .rounded(.25em);
+ background: @lightNavBG;
+ border: 1px solid @lightNavBorder;
+
+ h2 {
+ margin-top: 0;
+ }
+
+ input[type=text], input[type=email], input[type=password] {
+ background: transparent;
+ border: 0;
+ border-bottom: 1px solid #ccc;
+ -moz-transition-property: opacity;
+ -webkit-transition-property: opacity;
+ -o-transition-property: opacity;
+ transition-property: opacity;
+ .transition-duration(0.2s);
+ .opacity(1);
+
+ &:disabled {
+ .opacity(.4);
+ }
+ }
+
+ .short {
+ text-align: center;
+ }
+
+ .form-hint {
+ font-size: 0.78em;
+ color: #888;
+ }
+}
+
+#overlay {
+ display: none;
+ position: fixed;
+ top: 0;
+ right: 0;
+ bottom: 0;
+ left: 0;
+ background: rgba(0, 0, 0, 0.4);
+ z-index: 10;
+}
+
+@media all and (max-height: 500px) {
+ body#pad {
+ textarea {
+ top: 2.25em;
+ padding-top: 0.25em;
+ }
+ #tools {
+ padding-top: 0.5em;
+ padding-bottom: 0.5em;
+ }
+ }
+}
+
+@media all and (min-width: 360px) {
+ body#pad #tools .if-room.room-1, body#pad-sub #tools .tool.if-room.room-1, .if-room.room-1 {
+ display: inline-block;
+ }
+}
+
+@media all and (min-width: 425px) {
+ body#pad #tools .if-room.room-2, body#pad-sub #tools .tool.if-room.room-2, .if-room.room-2 {
+ display: inline-block;
+ }
+}
+
+@media all and (min-width: 510px) {
+ body#pad #tools .if-room.room-3, body#pad-sub #tools .tool.if-room.room-3, .if-room.room-3 {
+ display: inline-block;
+ }
+}
+
+@media all and (max-width: 650px) {
+ body#pad #tools .tool.if-room, body#pad-sub #tools .tool.if-room, .if-room {
+ display: none;
+ }
+}
+
+@media all and (max-width: 600px) {
+ .modal {
+ margin-left: 0;
+ width: auto;
+ left: 0;
+ right: 0;
+ }
+ #user-nav .tabs {
+ display: block;
+ text-align: center;
+ margin: 0.5em 0 -2em;
+ a:first-child {
+ margin-left: 0;
+ }
+ }
+ #target-name {
+ max-width: 98px;
+ display: inline-block;
+ }
+}
+
+@media all and (min-width: 50em) {
+ body#pad {
+ textarea {
+ padding-left: 10%;
+ padding-right: 10%;
+ }
+ }
+}
+@media all and (min-width: 60em) {
+ body#pad {
+ textarea {
+ padding-left: 15%;
+ padding-right: 15%;
+ }
+ }
+}
+@media all and (min-width: 70em) {
+ body#pad {
+ textarea {
+ padding-left: 20%;
+ padding-right: 20%;
+ }
+ }
+}
+@media all and (min-width: 85em) {
+ body#pad {
+ textarea {
+ padding-left: 25%;
+ padding-right: 25%;
+ }
+ }
+}
+@media all and (min-width: 105em) {
+ body#pad {
+ textarea {
+ padding-left: 30%;
+ padding-right: 30%;
+ }
+ }
+}
+@media (pointer: coarse) {
+ body#pad, body#pad-sub {
+ #tools {
+ .opacity(.8);
+ .hidden {
+ .opacity(.8);
+ }
+ }
+ }
+}
diff --git a/less/pages/error.less b/less/pages/error.less
new file mode 100644
index 0000000..8c6552a
--- /dev/null
+++ b/less/pages/error.less
@@ -0,0 +1,21 @@
+.error-page {
+ text-align: center;
+ max-width: 40em;
+ margin: 0 auto;
+ a:link, a:visited {
+ text-decoration: none;
+ }
+ a:hover {
+ text-decoration: underline;
+ }
+
+ p {
+ line-height: 1.5;
+ &.msg {
+ font-size: 1.8em;
+ }
+ &.commentary {
+ font-size: 1.2em;
+ }
+ }
+}
diff --git a/less/post-temp.less b/less/post-temp.less
new file mode 100644
index 0000000..3ec682d
--- /dev/null
+++ b/less/post-temp.less
@@ -0,0 +1,68 @@
+body {
+ post, subpage {
+ header {
+ margin: 0 auto;
+ padding: 1em 2rem;
+ .opacity(0.4);
+ -moz-transition-property: opacity;
+ -webkit-transition-property: opacity;
+ -o-transition-property: opacity;
+ transition-property: opacity;
+ .transition-duration(.4s);
+ &:hover {
+ .opacity(1);
+ }
+
+ h1 {
+ font-size: 1.6em;
+ }
+ }
+ }
+}
+
+article, pre, .hljs {
+ padding: 0.5em 2rem 1.5em;
+}
+body#post article, pre, .hljs {
+ font-size: 1.2em;
+}
+
+/* Post mixins */
+.article-code() {
+ background-color: #f8f8f8;
+ border: 1px solid #ccc;
+ padding: 0.2em 0.4em;
+ font-size: 0.86em;
+ .rounded(.25em);
+}
+.article-blockquote() {
+ border-left: 4px solid #ddd;
+ padding: 0 1em;
+ margin: 0.5em;
+ color: #777;
+ display: inline-block;
+
+ p {
+ display: block;
+ margin: 0.5em 0;
+ }
+}
+.article-p() {
+ line-height: 1.4em;
+ white-space: pre-wrap; /* CSS 3 */
+ white-space: -moz-pre-wrap; /* Mozilla, since 1999 */
+ white-space: -pre-wrap; /* Opera 4-6 */
+ white-space: -o-pre-wrap; /* Opera 7 */
+ word-wrap: break-word; /* Internet Explorer 5.5+ */
+}
+.article-title() {
+ font-size: 1.5em;
+ display: block;
+ margin-top: 0;
+ margin-bottom: 1em;
+}
+
+.hljs {
+ overflow-x: inherit;
+ background: transparent;
+}
diff --git a/static/css/.gitignore b/static/css/.gitignore
new file mode 100644
index 0000000..b3a5267
--- /dev/null
+++ b/static/css/.gitignore
@@ -0,0 +1 @@
+*.css
diff --git a/static/fonts/MaterialIcons-Regular.eot b/static/fonts/MaterialIcons-Regular.eot
new file mode 100644
index 0000000..70508eb
Binary files /dev/null and b/static/fonts/MaterialIcons-Regular.eot differ
diff --git a/static/fonts/MaterialIcons-Regular.svg b/static/fonts/MaterialIcons-Regular.svg
new file mode 100644
index 0000000..a449327
--- /dev/null
+++ b/static/fonts/MaterialIcons-Regular.svg
@@ -0,0 +1,2373 @@
+
+
+
+
diff --git a/static/fonts/MaterialIcons-Regular.ttf b/static/fonts/MaterialIcons-Regular.ttf
new file mode 100644
index 0000000..7015564
Binary files /dev/null and b/static/fonts/MaterialIcons-Regular.ttf differ
diff --git a/static/fonts/MaterialIcons-Regular.woff b/static/fonts/MaterialIcons-Regular.woff
new file mode 100644
index 0000000..a0bfd17
Binary files /dev/null and b/static/fonts/MaterialIcons-Regular.woff differ
diff --git a/static/fonts/MaterialIcons-Regular.woff2 b/static/fonts/MaterialIcons-Regular.woff2
new file mode 100644
index 0000000..20f1f67
Binary files /dev/null and b/static/fonts/MaterialIcons-Regular.woff2 differ
diff --git a/static/fonts/lora-v10-latin-italic.eot b/static/fonts/lora-v10-latin-italic.eot
new file mode 100644
index 0000000..4aac1ce
Binary files /dev/null and b/static/fonts/lora-v10-latin-italic.eot differ
diff --git a/static/fonts/lora-v10-latin-italic.svg b/static/fonts/lora-v10-latin-italic.svg
new file mode 100644
index 0000000..81e08dc
--- /dev/null
+++ b/static/fonts/lora-v10-latin-italic.svg
@@ -0,0 +1,449 @@
+
+
+
diff --git a/static/fonts/lora-v10-latin-italic.ttf b/static/fonts/lora-v10-latin-italic.ttf
new file mode 100644
index 0000000..b8a2077
Binary files /dev/null and b/static/fonts/lora-v10-latin-italic.ttf differ
diff --git a/static/fonts/lora-v10-latin-italic.woff b/static/fonts/lora-v10-latin-italic.woff
new file mode 100644
index 0000000..735af88
Binary files /dev/null and b/static/fonts/lora-v10-latin-italic.woff differ
diff --git a/static/fonts/lora-v10-latin-italic.woff2 b/static/fonts/lora-v10-latin-italic.woff2
new file mode 100644
index 0000000..d761c18
Binary files /dev/null and b/static/fonts/lora-v10-latin-italic.woff2 differ
diff --git a/static/fonts/lora-v9-latin-700.eot b/static/fonts/lora-v9-latin-700.eot
new file mode 100644
index 0000000..9085eba
Binary files /dev/null and b/static/fonts/lora-v9-latin-700.eot differ
diff --git a/static/fonts/lora-v9-latin-700.svg b/static/fonts/lora-v9-latin-700.svg
new file mode 100644
index 0000000..c3f6276
--- /dev/null
+++ b/static/fonts/lora-v9-latin-700.svg
@@ -0,0 +1,10264 @@
+
+
+
diff --git a/static/fonts/lora-v9-latin-700.ttf b/static/fonts/lora-v9-latin-700.ttf
new file mode 100644
index 0000000..5782ec7
Binary files /dev/null and b/static/fonts/lora-v9-latin-700.ttf differ
diff --git a/static/fonts/lora-v9-latin-700.woff b/static/fonts/lora-v9-latin-700.woff
new file mode 100644
index 0000000..36903c9
Binary files /dev/null and b/static/fonts/lora-v9-latin-700.woff differ
diff --git a/static/fonts/lora-v9-latin-700.woff2 b/static/fonts/lora-v9-latin-700.woff2
new file mode 100644
index 0000000..2eacde2
Binary files /dev/null and b/static/fonts/lora-v9-latin-700.woff2 differ
diff --git a/static/fonts/lora-v9-latin-regular.eot b/static/fonts/lora-v9-latin-regular.eot
new file mode 100644
index 0000000..c209f9a
Binary files /dev/null and b/static/fonts/lora-v9-latin-regular.eot differ
diff --git a/static/fonts/lora-v9-latin-regular.svg b/static/fonts/lora-v9-latin-regular.svg
new file mode 100644
index 0000000..c3c9968
--- /dev/null
+++ b/static/fonts/lora-v9-latin-regular.svg
@@ -0,0 +1,9002 @@
+
+
+
diff --git a/static/fonts/lora-v9-latin-regular.ttf b/static/fonts/lora-v9-latin-regular.ttf
new file mode 100644
index 0000000..8705329
Binary files /dev/null and b/static/fonts/lora-v9-latin-regular.ttf differ
diff --git a/static/fonts/lora-v9-latin-regular.woff b/static/fonts/lora-v9-latin-regular.woff
new file mode 100644
index 0000000..9bcd77e
Binary files /dev/null and b/static/fonts/lora-v9-latin-regular.woff differ
diff --git a/static/fonts/lora-v9-latin-regular.woff2 b/static/fonts/lora-v9-latin-regular.woff2
new file mode 100644
index 0000000..a3ef64d
Binary files /dev/null and b/static/fonts/lora-v9-latin-regular.woff2 differ
diff --git a/static/fonts/open-sans-v13-latin-700.eot b/static/fonts/open-sans-v13-latin-700.eot
new file mode 100644
index 0000000..a78a2a9
Binary files /dev/null and b/static/fonts/open-sans-v13-latin-700.eot differ
diff --git a/static/fonts/open-sans-v13-latin-700.svg b/static/fonts/open-sans-v13-latin-700.svg
new file mode 100644
index 0000000..a294c81
--- /dev/null
+++ b/static/fonts/open-sans-v13-latin-700.svg
@@ -0,0 +1,1635 @@
+
+
+
diff --git a/static/fonts/open-sans-v13-latin-700.ttf b/static/fonts/open-sans-v13-latin-700.ttf
new file mode 100644
index 0000000..974a7c5
Binary files /dev/null and b/static/fonts/open-sans-v13-latin-700.ttf differ
diff --git a/static/fonts/open-sans-v13-latin-700.woff b/static/fonts/open-sans-v13-latin-700.woff
new file mode 100644
index 0000000..18e610d
Binary files /dev/null and b/static/fonts/open-sans-v13-latin-700.woff differ
diff --git a/static/fonts/open-sans-v13-latin-700.woff2 b/static/fonts/open-sans-v13-latin-700.woff2
new file mode 100644
index 0000000..be4c25b
Binary files /dev/null and b/static/fonts/open-sans-v13-latin-700.woff2 differ
diff --git a/static/fonts/open-sans-v13-latin-regular.eot b/static/fonts/open-sans-v13-latin-regular.eot
new file mode 100644
index 0000000..1d98e6e
Binary files /dev/null and b/static/fonts/open-sans-v13-latin-regular.eot differ
diff --git a/static/fonts/open-sans-v13-latin-regular.svg b/static/fonts/open-sans-v13-latin-regular.svg
new file mode 100644
index 0000000..052c59f
--- /dev/null
+++ b/static/fonts/open-sans-v13-latin-regular.svg
@@ -0,0 +1,1637 @@
+
+
+
diff --git a/static/fonts/open-sans-v13-latin-regular.ttf b/static/fonts/open-sans-v13-latin-regular.ttf
new file mode 100644
index 0000000..0dae9c3
Binary files /dev/null and b/static/fonts/open-sans-v13-latin-regular.ttf differ
diff --git a/static/fonts/open-sans-v13-latin-regular.woff b/static/fonts/open-sans-v13-latin-regular.woff
new file mode 100644
index 0000000..e096d04
Binary files /dev/null and b/static/fonts/open-sans-v13-latin-regular.woff differ
diff --git a/static/fonts/open-sans-v13-latin-regular.woff2 b/static/fonts/open-sans-v13-latin-regular.woff2
new file mode 100644
index 0000000..5287058
Binary files /dev/null and b/static/fonts/open-sans-v13-latin-regular.woff2 differ