From de33547e831c304021d1475ca5fa346b33595695 Mon Sep 17 00:00:00 2001
From: "Elf M. Sternberg"
Date: Sat, 14 Jul 2012 18:03:03 -0700
Subject: [PATCH] Starting the styling.
---
bin/gruntc | 3 +++
src/index.haml | 25 +++++-----------------
src/style.less | 56 ++++++++++++++++++++++++++++++++++++++++++++++++++
3 files changed, 64 insertions(+), 20 deletions(-)
create mode 100755 bin/gruntc
diff --git a/bin/gruntc b/bin/gruntc
new file mode 100755
index 0000000..339f0c3
--- /dev/null
+++ b/bin/gruntc
@@ -0,0 +1,3 @@
+#!/bin/sh
+grunt gruntjs
+grunt $*
diff --git a/src/index.haml b/src/index.haml
index fd64b31..3cdb1e6 100644
--- a/src/index.haml
+++ b/src/index.haml
@@ -4,6 +4,7 @@
%meta{:content => "text/html; charset=utf-8", "http-equiv" => "Content-Type"}/
%meta{:name => "keywords", :content => ""}/
%meta{:name => "description", :content => ""}/
+ %link{:rel => "stylesheet", :href => "http://fonts.googleapis.com/css?family=Montserrat", :type => "text/css"}/
%link{:rel => "stylesheet", :href => "style.css", :type => "text/css"}/
%link{:rel => "shortcut icon", :type => "image/x-icon", :href => "images/favicon.ico"}/
%link{:rel => "shortcut icon", :type => "image/png", :href => "images/favicon.png"}/
@@ -12,29 +13,13 @@
%body
#content
- #leftbrain
- %h1#prioritize Today I Will Pay Attention To:
+ #leftbrain.column
+ %h1.prioritize Today I Will Pay Attention To:
#priorities
- #rightbrain
- %h1#prioritize Today I Will Ignore:
+ #rightbrain.column
+ %h1.prioritize Today I Will Ignore:
#ignorities
- #braindiv
- #img
- #msg
- Right now, it’s .
- %p Is this
- %p what you want
- %p to be doing
- %p right now?
- .clearoncolumn
- #rightnow
- #newcat
- %h1 Wouldn't you rather be:
-
- .div(style="clear:both")
- #todos
-
#message(style="display:none")
%h2 How to Use
%p
diff --git a/src/style.less b/src/style.less
index fe3d6a8..6fe0f28 100644
--- a/src/style.less
+++ b/src/style.less
@@ -1,11 +1,67 @@
/* -*- mode:css -*- */
+html {
+ font-size: 100%;
+ -webkit-text-size-adjust: 100%;
+ -ms-text-size-adjust: 100%;
+}
+
+a:hover,
+a:active {
+ outline: 0;
+}
+
+img {
+ max-width: 100%; // Make images inherently responsive
+ vertical-align: middle;
+ border: 0;
+ -ms-interpolation-mode: bicubic;
+}
+
+button,
+input,
+select,
+textarea {
+ margin: 0;
+ font-size: 100%;
+ vertical-align: middle;
+}
+button,
+input {
+ *overflow: visible; // Inner spacing ie IE6/7
+ line-height: normal; // FF3/4 have !important on line-height in UA stylesheet
+}
+button::-moz-focus-inner,
+input::-moz-focus-inner { // Inner padding and border oddities in FF3/4
+ padding: 0;
+ border: 0;
+}
+button,
+input[type="button"],
+input[type="reset"],
+input[type="submit"] {
+ cursor: pointer; // Cursors on all buttons applied consistently
+ -webkit-appearance: button; // Style clickable inputs in iOS
+}
+input[type="search"] { // Appearance in Safari/Chrome
+ -webkit-box-sizing: content-box;
+ -moz-box-sizing: content-box;
+ box-sizing: content-box;
+ -webkit-appearance: textfield;
+}
+input[type="search"]::-webkit-search-decoration,
+input[type="search"]::-webkit-search-cancel-button {
+ -webkit-appearance: none; // Inner-padding issues in Chrome OSX, Safari 5
+}
+
+
* {
border: 0;
margin: 0;
padding: 0;
}
+
body {
font: 13pt/190% Calibri,Georgia,"Lucida Bright",Lucidabright,"Bitstream Vera Serif",serif;
background-color: #fff;