/WWW-AdventCalendar

Permalink
Browse files

palette for (almost?) all colors

  • Loading branch information...
@rjbs
rjbs committed Oct 18, 2011
1 parent cfaaf29 commit 86bf8ff8d7809a7cc7502e4061cebcf1d5a9c2b8
Unified Split
Showing with 123 additions and 57 deletions.
  1. +62 −2 bin/advcal
  2. +1 −1 share/templates/page.mhtml
  3. +60 −54 share/templates/style.css
View file
64 bin/advcal
@@ -36,8 +36,68 @@ my ($opt, $usage) = describe_options(

my $arg = {};
my $colors = {
body_fg => '#000',
body_bg => '#977',
genericBlack => '#000',
genericWhite => '#fff',
generic00 => '#977',
generic01 => '#d9d9d9',
generic02 => '#b00',
generic03 => '#c0c0c0',
generic04 => '#797',

bodyBG => 'generic00',
bodyFG => 'genericBlack',

blotterBG => 'generic01',
blotterBorder => '#aaa',

contentBG => 'genericWhite',
contentBorder => '#aaa',

feedLinkFG => '#ff0',

headerFG => 'generic02',

linkFG => 'generic02',

linkDisabledFG => 'generic03',

linkHoverFG => '#d00',
linkHoverBG => '#ffc',

quoteBorder => 'generic04',

sectionBorder => 'generic03',

subtitleBG => 'generic04',
subtitleFG => 'genericWhite',
subtitleBorder => '#575',

calendarHeaderCellBorder => '#ddd',
calendarHeaderCellBG => '#f0f0f0',

calendarIgnoredDayBG => '#ccc',

calendarPastDayBG => '#aea',
calendarPastDayFG => 'genericBlack',

calendarPastDayHoverBG => '#f0f0f0',
calendarPastDayHoverFG => 'genericBlack',

calendarTodayBG => 'generic04',
calendarTodayFG => 'genericWhite',

calendarTodayHoverBG => '#bdb',
calendarTodayHoverFG => 'genericBlack',

calendarFutureDayBG => '#eaa',
calendarFutureDayFG => 'genericBlack',

codeBG => '#222',
codeFG => '#ddd',

codeNumbersBG => 'generic04',
codeNumbersFG => 'genericWhite',
codeNumbersBorder => 'generic02',
};

if (my $file = $opt->config) {
View file
2 share/templates/page.mhtml
@@ -14,7 +14,7 @@
<h1><a href="index.html"><% $calendar->title |h %></a></h1>
</div>

<p id="note"><% $calendar->subtitle // '' |h %>
<p id="subtitle"><% $calendar->subtitle // '' |h %>
<a class='feed' href="atom.xml">Feed</a>
</p>

View file
114 share/templates/style.css
@@ -3,8 +3,8 @@
%color
</%args>
body {
color: <% $color{body_fg} %>;
background: <% $color{body_bg} %>;
color: <% $color{bodyFG} %>;
background: <% $color{bodyBG} %>;
font-family: verdana, tahoma, sans-serif;
}

@@ -15,8 +15,8 @@ body {
margin-right: auto;
margin-top: 10px auto;
margin-bottom: 10px;
background: #d9d9d9;
border: 1px solid #aaa;
background: <% $color{blotterBG} %>;
border: 1px solid <% $color{blotterBorder} %>;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
}
@@ -27,29 +27,36 @@ h1 {
font-weight: bold;
font-size: 1.6em;
text-align: center;
color: <% $color{headerFG} %>;
}

h1.title {
text-align: left;
margin-bottom: 0;
color: #b00;
}

h2 {
text-align: center;
color: #b00;
color: <% $color{headerFG} %>;
}

.subtitle {
text-align: right;
border-top: 1px black solid;
}

.feed {
float: right;
color: <% $color{feedLinkFG} %>;
padding-right: 1em;
vertical-align: middle;
}

dt {
margin: 0.5em 0 0.5em 0;
}

#content, #note {
#content, #subtitle {
font-size: 0.9em;
padding: 8px 20px;
margin: 10px;
@@ -58,23 +65,23 @@ dt {
}

#content {
border: 1px solid #aaa;
background: #fff;
border: 1px solid <% $color{contentBorder} %>;
background: <% $color{contentBG} %>;
}

#note {
background: #797;
border: 1px solid #575;
color: #fff;
#subtitle {
background: <% $color{subtitleBG} %>;
border: 1px solid <% $color{subtitleBorder} %>;
color: <% $color{subtitleFG} %>;
}

.pod h1, .pod h2 {
text-align: left;
color: #b00;
color: <% $color{headerFG} %>;
}

a {
color: #b00;
color: <% $color{linkFG} %>;
text-decoration: none;
}

@@ -88,8 +95,8 @@ a:not(.article) {
#header a:hover,
.pod a:hover
{
color: #d00;
background: #ffc;
color: <% $color{linkHoverFG} %>;
background: <% $color{linkHoverBG} %>;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
}
@@ -102,16 +109,6 @@ a:not(.article) {
display: inline;
}

pre {
padding-top: 1em;
padding-bottom: 1em;
background-color: #222;
color: #ddd;
font-size: 1em;
font-family: monospace;
width: 100%;
}

.calendar {
margin-left: auto;
margin-right: auto;
@@ -120,8 +117,8 @@ pre {

.calendar th {
padding: 5px;
border: 1px solid #ddd;
background: #f0f0f0;
border: 1px solid <% $color{calendarHeaderCellBorder} %>;
background-color: <% $color{calendarHeaderCellBG} %>;
}

.calendar td {
@@ -132,16 +129,16 @@ pre {
}

.calendar td.day {
background: #ccc;
background: <% $color{calendarIgnoredDayBG} %>;
}

.calendar td.day.advent {
background: #aea;
background: <% $color{calendarPastDayBG} %>;
}

.calendar td.day.advent a {
display: block;
color: #444;
color: <% $color{calendarPastDayFG} %>;
height: 5em;
padding: 0;
margin: 0;
@@ -150,42 +147,46 @@ pre {
}

.calendar td.day.advent a:hover {
background: #f0f0f0;
background: <% $color{calendarPastDayHoverBG} %>;
color: <% $color{calendarPastDayHoverFG} %>;
}

.calendar td.day.advent.today {
background: #797;
background: <% $color{calendarTodayBG} %>;
}

.calendar td.day.advent.today a { color: #fff; }
.calendar td.day.advent.today a {
color: <% $color{calendarTodayFG} %>;
}

.calendar td.day.advent.today a:hover {
background: #bdb;
color: #000;
background: <% $color{calendarTodayHoverBG} %>;
color: <% $color{calendarTodayFG} %>;
}

.calendar td.day.advent.future {
background: #eaa;
background: <% $color{calendarFutureDayBG} %>;
color: <% $color{calendarFutureDayFG} %>;
}

a img {
border: 0;
}

blockquote {
border-left: thick #797 solid;
border-left: thick <% $color{quoteBorder} %> solid;
padding-left: 1em;
margin-left: 1em;
margin-right: 1em;
}

h2#See-Also {
padding-top: .4em;
border-top: 1px solid #e0e0e0;
border-top: 1px solid <% $color{sectionBorder} %>;
}

#pager {
border-top: 1px solid #e0e0e0;
border-top: 1px solid <% $color{sectionBorder} %>;
list-style-type: none;
margin-left: 0;
padding: 0.4em;
@@ -194,7 +195,7 @@ h2#See-Also {
}

#pager li {
color: #c0c0c0;
color: <% $color{linkDisabledFG} %>;
}

#pager .next {
@@ -210,9 +211,21 @@ h2#See-Also {
width: 33%;
}

/* verbatim text and code listings */

pre {
padding-top: 1em;
padding-bottom: 1em;
background-color: <% $color{codeBG} %>;
color: <% $color{codeFG} %>;
font-size: 1em;
font-family: monospace;
width: 100%;
}

.code-listing {
background-color: #222;
color: #ddd;
background-color: <% $color{codeBG} %>;
color: <% $color{codeFG} %>;
font-size: 1em;
font-family: monospace;
white-space: pre;
@@ -226,9 +239,9 @@ h2#See-Also {
}

.code-listing .line-numbers {
background-color: #797;
color: #fff;
border-right: 2px #b00 solid;
background-color: <% $color{codeNumbersBG} %>;
color: <% $color{codeNumbersFG} %>;
border-right: 2px <% $color{codeNumbersBorder} %> solid;
width: 3.5em;
text-align: right;
}
@@ -237,13 +250,6 @@ h2#See-Also {
padding-left: 1em;
}

.feed {
float: right;
color: #ff0;
padding-right: 1em;
vertical-align: middle;
}

/* PPI HTML Style */

.code-listing .keyword { color: #89f; }

0 comments on commit 86bf8ff

Please sign in to comment.