Browse Source

Add old web design archives

pull/2/head
Noah Petherbridge 6 years ago
parent
commit
946552ed5a
100 changed files with 4424 additions and 0 deletions
  1. BIN
      www/designs/cosmos/body-shadow.jpg
  2. BIN
      www/designs/cosmos/body-topleft.jpg
  3. BIN
      www/designs/cosmos/border-east.jpg
  4. BIN
      www/designs/cosmos/border-east.png
  5. BIN
      www/designs/cosmos/border-ne.jpg
  6. BIN
      www/designs/cosmos/border-ne.png
  7. BIN
      www/designs/cosmos/border-north.jpg
  8. BIN
      www/designs/cosmos/border-north.png
  9. BIN
      www/designs/cosmos/border-se.jpg
  10. BIN
      www/designs/cosmos/border-se.png
  11. BIN
      www/designs/cosmos/border-south.jpg
  12. BIN
      www/designs/cosmos/border-south.png
  13. BIN
      www/designs/cosmos/border-sw.jpg
  14. BIN
      www/designs/cosmos/border-sw.png
  15. BIN
      www/designs/cosmos/border-west.jpg
  16. BIN
      www/designs/cosmos/border-west.png
  17. +149
    -0
      www/designs/cosmos/index.html
  18. BIN
      www/designs/cosmos/logo.jpg
  19. BIN
      www/designs/cosmos/navbody.jpg
  20. BIN
      www/designs/cosmos/navfoot.jpg
  21. BIN
      www/designs/cosmos/navtop.jpg
  22. +268
    -0
      www/designs/cosmos/print.css
  23. +344
    -0
      www/designs/cosmos/screen.css
  24. BIN
      www/designs/cosmos/starburst.jpg
  25. BIN
      www/designs/cosmos/starrysky.jpg
  26. +129
    -0
      www/designs/index.html
  27. BIN
      www/designs/lavender/css.png
  28. BIN
      www/designs/lavender/cuvou.gif
  29. BIN
      www/designs/lavender/cuvou.png
  30. BIN
      www/designs/lavender/fedora.png
  31. BIN
      www/designs/lavender/html.png
  32. +208
    -0
      www/designs/lavender/index.html
  33. BIN
      www/designs/lavender/navbg.png
  34. BIN
      www/designs/lavender/navi.png
  35. BIN
      www/designs/lavender/navi.psd
  36. BIN
      www/designs/lavender/perl.png
  37. +73
    -0
      www/designs/lavender/print.css
  38. +123
    -0
      www/designs/lavender/screen.css
  39. BIN
      www/designs/lavender/starburst.jpg
  40. BIN
      www/designs/lavender/starburst.psd
  41. BIN
      www/designs/screenshots/cosmos.png
  42. BIN
      www/designs/screenshots/cosmos.t.png
  43. BIN
      www/designs/screenshots/lavender.png
  44. BIN
      www/designs/screenshots/lavender.t.png
  45. BIN
      www/designs/screenshots/solar-bootstrap.png
  46. BIN
      www/designs/screenshots/solar-bootstrap.t.png
  47. BIN
      www/designs/screenshots/solar-html5.png
  48. BIN
      www/designs/screenshots/solar-html5.t.png
  49. BIN
      www/designs/screenshots/solar.png
  50. BIN
      www/designs/screenshots/solar.t.png
  51. BIN
      www/designs/screenshots/starburst.png
  52. BIN
      www/designs/screenshots/starburst.t.png
  53. BIN
      www/designs/screenshots/storm.png
  54. BIN
      www/designs/screenshots/storm.t.png
  55. +5
    -0
      www/designs/solar-bootstrap/bootstrap-theme.min.css
  56. +5
    -0
      www/designs/solar-bootstrap/bootstrap.min.css
  57. +6
    -0
      www/designs/solar-bootstrap/bootstrap.min.js
  58. +82
    -0
      www/designs/solar-bootstrap/codehilite.css
  59. BIN
      www/designs/solar-bootstrap/css3.png
  60. BIN
      www/designs/solar-bootstrap/digital-ocean.png
  61. BIN
      www/designs/solar-bootstrap/html5.png
  62. +266
    -0
      www/designs/solar-bootstrap/index.html
  63. +4
    -0
      www/designs/solar-bootstrap/jquery-2.1.0.min.js
  64. BIN
      www/designs/solar-bootstrap/kirsle.png
  65. +52
    -0
      www/designs/solar-bootstrap/monokai.css
  66. +20
    -0
      www/designs/solar-bootstrap/offsite.js
  67. BIN
      www/designs/solar-bootstrap/panelbg.png
  68. +246
    -0
      www/designs/solar-bootstrap/print.css
  69. BIN
      www/designs/solar-bootstrap/python.png
  70. +494
    -0
      www/designs/solar-bootstrap/screen.css
  71. BIN
      www/designs/solar-bootstrap/space.png
  72. BIN
      www/designs/solar-bootstrap/supernova.jpg
  73. +531
    -0
      www/designs/solar-bootstrap/ui.css
  74. +29
    -0
      www/designs/solar-bootstrap/vim-syntax.css
  75. +82
    -0
      www/designs/solar-html5/codehilite.css
  76. BIN
      www/designs/solar-html5/css3.png
  77. BIN
      www/designs/solar-html5/digital-ocean.png
  78. BIN
      www/designs/solar-html5/html5.png
  79. +196
    -0
      www/designs/solar-html5/index.html
  80. +4
    -0
      www/designs/solar-html5/jquery-2.1.0.min.js
  81. BIN
      www/designs/solar-html5/kirsle.png
  82. +52
    -0
      www/designs/solar-html5/monokai.css
  83. +20
    -0
      www/designs/solar-html5/offsite.js
  84. BIN
      www/designs/solar-html5/panelbg.png
  85. +235
    -0
      www/designs/solar-html5/print.css
  86. BIN
      www/designs/solar-html5/python.png
  87. +508
    -0
      www/designs/solar-html5/screen.css
  88. BIN
      www/designs/solar-html5/space.png
  89. BIN
      www/designs/solar-html5/supernova.jpg
  90. +29
    -0
      www/designs/solar-html5/vim-syntax.css
  91. BIN
      www/designs/solar/css.png
  92. BIN
      www/designs/solar/e.png
  93. BIN
      www/designs/solar/html.png
  94. +264
    -0
      www/designs/solar/index.html
  95. BIN
      www/designs/solar/kirsle.jpg
  96. BIN
      www/designs/solar/n.png
  97. BIN
      www/designs/solar/navbody.png
  98. BIN
      www/designs/solar/navfoot.png
  99. BIN
      www/designs/solar/navtop.png
  100. BIN
      www/designs/solar/ne.png

BIN
www/designs/cosmos/body-shadow.jpg View File

Before After
Width: 754  |  Height: 251  |  Size: 22 KiB

BIN
www/designs/cosmos/body-topleft.jpg View File

Before After
Width: 526  |  Height: 403  |  Size: 55 KiB

BIN
www/designs/cosmos/border-east.jpg View File

Before After
Width: 2  |  Height: 8  |  Size: 309 B

BIN
www/designs/cosmos/border-east.png View File

Before After
Width: 2  |  Height: 8  |  Size: 134 B

BIN
www/designs/cosmos/border-ne.jpg View File

Before After
Width: 11  |  Height: 12  |  Size: 615 B

BIN
www/designs/cosmos/border-ne.png View File

Before After
Width: 11  |  Height: 12  |  Size: 381 B

BIN
www/designs/cosmos/border-north.jpg View File

Before After
Width: 8  |  Height: 2  |  Size: 309 B

BIN
www/designs/cosmos/border-north.png View File

Before After
Width: 8  |  Height: 2  |  Size: 131 B

BIN
www/designs/cosmos/border-se.jpg View File

Before After
Width: 10  |  Height: 10  |  Size: 581 B

BIN
www/designs/cosmos/border-se.png View File

Before After
Width: 10  |  Height: 10  |  Size: 377 B

BIN
www/designs/cosmos/border-south.jpg View File

Before After
Width: 8  |  Height: 2  |  Size: 309 B

BIN
www/designs/cosmos/border-south.png View File

Before After
Width: 8  |  Height: 2  |  Size: 131 B

BIN
www/designs/cosmos/border-sw.jpg View File

Before After
Width: 11  |  Height: 10  |  Size: 619 B

BIN
www/designs/cosmos/border-sw.png View File

Before After
Width: 11  |  Height: 10  |  Size: 348 B

BIN
www/designs/cosmos/border-west.jpg View File

Before After
Width: 2  |  Height: 8  |  Size: 309 B

BIN
www/designs/cosmos/border-west.png View File

Before After
Width: 2  |  Height: 8  |  Size: 134 B

+ 149
- 0
www/designs/cosmos/index.html View File

@@ -0,0 +1,149 @@
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Cuvou.com</title>
<link rel="StyleSheet" type="text/css" media="screen" href="/designs/cosmos/screen.css">
</head>
<body>

<div class="cv-content-wrapper">
<div class="cv-content-eyecandy">
<div class="cv-content-topedge">
<div class="cv-content-brdrne"></div>
</div>
<div class="cv-content-left">
<div class="cv-content-right">
<div class="cv-content-botedge">
<div class="cv-content-brdrsw">
<div class="cv-content-brdrse">
<div class="cv-content-body">
<h1 class="top">Cuvou.com Cosmos</h1>

This was the final web design for Cuvou.com, after
<a href="/designs/storm">Storm</a> and before
<a href="/designs/solar">Kirsle.net Solar</a> (the first iteration, anyway).
<p>

<h2>Heading Level 2</h2>

Lorem ipsum dolor sit amet, <a href="#">consectetuer adipiscing</a> elit. Duis pede purus, ornare interdum, consequat in, dignissim vitae, nisi.
Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Praesent ornare. Phasellus interdum,
sem vulputate commodo congue, augue nisl aliquet velit, eu volutpat justo ante vitae lacus. Donec pulvinar scelerisque nisl.
Donec viverra sem eu augue. Phasellus faucibus nulla nec lacus aliquam dapibus. Aliquam nibh ipsum, blandit sit amet, consequat
in, blandit et, massa. Quisque nec urna. Aliquam nec elit ut erat consectetuer feugiat. Suspendisse tincidunt purus vel diam
blandit sagittis. Sed vestibulum, dolor nec vehicula accumsan, purus leo congue risus, at dapibus massa lorem sit amet purus.<p>

Nullam et nulla. <a href="#">Fusce consectetuer</a>, ante et auctor egestas, mi mi eleifend lorem, quis pulvinar tellus est at ligula. Donec
pulvinar, nisl vitae tempor fermentum, massa nulla placerat neque, ac posuere enim enim facilisis velit. Phasellus et augue
et nisi placerat eleifend. Mauris quam lectus, consequat ut, rutrum vitae, elementum a, sem. Nam aliquam, metus et tincidunt
cursus, felis risus faucibus dolor, quis ultricies tellus justo sed ligula. Integer orci magna, cursus sed, eleifend a,
imperdiet vitae, nibh. Aenean mattis nisl at tortor. Integer diam elit, adipiscing vitae, mollis ac, aliquam et, elit. Etiam
hendrerit, diam non ultrices pellentesque, leo augue egestas mauris, at dictum nisl augue nec odio. Praesent condimentum.
Morbi semper tellus eget ipsum porta pellentesque.

<pre>Preformatted
T e x t . i</pre>

<h3>Heading Level 3</h3>

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Duis pede purus, ornare interdum, consequat in, dignissim vitae, nisi.
Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Praesent ornare. Phasellus interdum,
sem vulputate commodo congue, augue nisl aliquet velit, eu volutpat justo ante vitae lacus. Donec pulvinar scelerisque nisl.
Donec viverra sem eu augue. Phasellus faucibus nulla nec lacus aliquam dapibus. Aliquam nibh ipsum, blandit sit amet, consequat
in, blandit et, massa. Quisque nec urna. Aliquam nec elit ut erat consectetuer feugiat. Suspendisse tincidunt purus vel diam
blandit sagittis. Sed vestibulum, dolor nec vehicula accumsan, purus leo congue risus, at dapibus massa lorem sit amet purus.<p>

Nullam et nulla. Fusce consectetuer, ante et auctor egestas, mi mi eleifend lorem, quis pulvinar tellus est at ligula. Donec
pulvinar, nisl vitae tempor fermentum, massa nulla placerat neque, ac posuere enim enim facilisis velit. Phasellus et augue
et nisi placerat eleifend. Mauris quam lectus, consequat ut, rutrum vitae, elementum a, sem. Nam aliquam, metus et tincidunt
cursus, felis risus faucibus dolor, quis ultricies tellus justo sed ligula. Integer orci magna, cursus sed, eleifend a,
imperdiet vitae, nibh. Aenean mattis nisl at tortor. Integer diam elit, adipiscing vitae, mollis ac, aliquam et, elit. Etiam
hendrerit, diam non ultrices pellentesque, leo augue egestas mauris, at dictum nisl augue nec odio. Praesent condimentum.
Morbi semper tellus eget ipsum porta pellentesque.

<h4>Heading Level 4</h4>

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Duis pede purus, ornare interdum, consequat in, dignissim vitae, nisi.
Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Praesent ornare. Phasellus interdum,
sem vulputate commodo congue, augue nisl aliquet velit, eu volutpat justo ante vitae lacus. Donec pulvinar scelerisque nisl.
Donec viverra sem eu augue. Phasellus faucibus nulla nec lacus aliquam dapibus. Aliquam nibh ipsum, blandit sit amet, consequat
in, blandit et, massa. Quisque nec urna. Aliquam nec elit ut erat consectetuer feugiat. Suspendisse tincidunt purus vel diam
blandit sagittis. Sed vestibulum, dolor nec vehicula accumsan, purus leo congue risus, at dapibus massa lorem sit amet purus.<p>

Nullam et nulla. Fusce consectetuer, ante et auctor egestas, mi mi eleifend lorem, quis pulvinar tellus est at ligula. Donec
pulvinar, nisl vitae tempor fermentum, massa nulla placerat neque, ac posuere enim enim facilisis velit. Phasellus et augue
et nisi placerat eleifend. Mauris quam lectus, consequat ut, rutrum vitae, elementum a, sem. Nam aliquam, metus et tincidunt
cursus, felis risus faucibus dolor, quis ultricies tellus justo sed ligula. Integer orci magna, cursus sed, eleifend a,
imperdiet vitae, nibh. Aenean mattis nisl at tortor. Integer diam elit, adipiscing vitae, mollis ac, aliquam et, elit. Etiam
hendrerit, diam non ultrices pellentesque, leo augue egestas mauris, at dictum nisl augue nec odio. Praesent condimentum.
Morbi semper tellus eget ipsum porta pellentesque.
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>

<div class="cv-starburst">
<div class="cv-logo">
<a href="#"><img src="/designs/cosmos/logo.jpg" width="403" height="145"></a>
</div>
</div>

<div class="cv-leftnav-wrapper">
<div class="cv-leftnav-panel">
<div class="cv-leftnav-body">
<div class="cv-nav-section">Cuvou.com</div>
&#0187; <a href="#">Homepage</a><br>
&#0187; <a href="#">About Me</a>

<div class="cv-nav-section">Nav Section</div>
&#0187; <a href="#">Links</a><br>
&#0187; <a href="#">Links</a><br>
&#0187; <a href="#">Links</a><br>
&#0187; <a href="#">Links</a><br>
&#0187; <a href="#">Links</a>

<div class="cv-nav-section">Nav Section</div>
&#0187; <a href="#">Links</a><br>
&#0187; <a href="#">Links</a><br>
&#0187; <a href="#">Links</a><br>
&#0187; <a href="#">Links</a><br>
&#0187; <a href="#">Links</a>

<div class="cv-nav-section">Nav Section</div>
&#0187; <a href="#">Links</a><br>
&#0187; <a href="#">Links</a><br>
&#0187; <a href="#">Links</a><br>
&#0187; <a href="#">Links</a><br>
&#0187; <a href="#">Links</a>

<div class="cv-nav-section">Nav Section</div>
&#0187; <a href="#">Links</a><br>
&#0187; <a href="#">Links</a><br>
&#0187; <a href="#">Links</a><br>
&#0187; <a href="#">Links</a><br>
&#0187; <a href="#">Links</a>

<div class="cv-nav-section">Nav Section</div>
&#0187; <a href="#">Links</a><br>
&#0187; <a href="#">Links</a><br>
&#0187; <a href="#">Links</a><br>
&#0187; <a href="#">Links</a><br>
&#0187; <a href="#">Links</a>

<div class="cv-nav-section">Nav Section</div>
&#0187; <a href="#">Links</a><br>
&#0187; <a href="#">Links</a><br>
&#0187; <a href="#">Links</a><br>
&#0187; <a href="#">Links</a><br>
&#0187; <a href="#">Links</a>
</div>
</div>
<div class="cv-leftnav-foot"></div>
</div>

</body>
</html>

BIN
www/designs/cosmos/logo.jpg View File

Before After
Width: 403  |  Height: 145  |  Size: 48 KiB

BIN
www/designs/cosmos/navbody.jpg View File

Before After
Width: 174  |  Height: 260  |  Size: 6.0 KiB

BIN
www/designs/cosmos/navfoot.jpg View File

Before After
Width: 174  |  Height: 11  |  Size: 1.4 KiB

BIN
www/designs/cosmos/navtop.jpg View File

Before After
Width: 174  |  Height: 411  |  Size: 21 KiB

+ 268
- 0
www/designs/cosmos/print.css View File

@@ -0,0 +1,268 @@
body {
background-color: #FFFFFF;
font-family: Verdana,Arial,Helvetica,sans-serif;
font-size: small;
color: #000000;
}
a:link, a:visited {
color: #0000FF;
text-decoration: underline;
}
a:hover, a:active {
color: #FF0000
}
.cv-leftnav-body a:link, .cv-leftnav-body a:visited {
display: none
}
a img {
border: 0px
}
h1,h2,h3,h4 {
font-family: "Trebuchet MS",Arial,Helvetica,sans-serif;
font-weight: bold;
color: #FFFFFF
}
h1.top, h2.top, h3.top, h4.top {
margin-top: 0px;
}
h1 {
margin-top: 0px;
font-size: 24pt
}
h2 {
font-size: 18pt
}
h3 {
font-size: 18pt;
font-style: italic
}
h4 {
font-size: 16pt;
font-style: italic
}
pre {
display: inline;
font-family: "Lucida Console","DejaVu LGC Sans Mono","DejaVu Sans Mono","Bistream Vera Sans Mono",monospace;
font-size: 10pt;
color: #006666
}
pre.notes {
/* No special styles needed */
}
code {
display: inline;
font-family: "Lucida Console","DejaVu LGC Sans Mono","DejaVu Sans Mono","Bistream Vera Sans Mono",monospace;
font-size: 9pt;
color: #006666
}

/* A logo for the printed page */
.logo-printed {
display: block;
text-align: center;
font-family: "Trebuchet MS","Verdana","Arial",sans-serif;
font-size: 36pt;
font-weight: bold;
border-bottom: 2px solid #000000;
margin-bottom: 24px
}
.logo-printed small {
font-size: 12pt
}

/* Copyright block */
.copyright {
text-align: center;
font-size: x-small;
font-weight: bold;
color: #000000;
margin-top: 50px
}

/******************************************************************************
* Software Design Styles *
******************************************************************************/

.distro {
border: 1px solid #CCCCCC
}
.distro th {
width: 150px;
text-align: center;
vertical-align: top
}
.distro td {
width: 150px;
text-align: center;
vertical-align: top;
border: 1px solid #808080
}
.distro td img {
float: left
}

.sw-tab-wrapper {
display: block
}
.sw-tab-top {
padding-left: 16px;
}
.sw-tab-frame {
border-top: 1px solid #999999;
border-left: 1px solid #999999;
border-right: 1px solid #999999;
border-bottom: 1px solid #999999
}
.sw-tab-content {
padding: 5px
}
.sw-tab-active {
border-top: 1px solid #FFFFFF;
border-left: 1px solid #FFFFFF;
border-right: 1px solid #FFFFFF;
margin-right: 10px
}
.sw-tab-normal {
border-top: 1px solid #666666;
border-left: 1px solid #666666;
border-right: 1px solid #666666;
margin-right: 10px
}
.sw-tab-active span, .sw-tab-normal span {
padding-left: 4px;
padding-right: 4px
}
.sw-tab-active a:link, .sw-tab-active a:visited,
.sw-tab-normal a:link, .sw-tab-normal a:visited {
font-family: Verdana,Arial,Helvetica,sans-serif;
font-size: small;
font-weight: normal;
text-decoration: none;
}


/******************************************************************************
* Starburst CMS Mandated Style Classes for the Web Blog *
******************************************************************************/

.sblog-title {
display: block;
margin-bottom: 0px;
margin-top: 15px;
font-size: 24pt;
font-weight: bold
}
.sblog-title a:link, .sblog-title a:visited {
color: #000000;
text-decoration: none
}
.sblog-title a:hover, .sblog-title a:active {
color: #000000;
text-decoration: underline
}

/******************************************************************************
* Cuvou.com Web Design Styles *
******************************************************************************/

/*-------------------------------------*
* Background and Logo Styles *
*-------------------------------------*/

/* The main starburst BG image */
.cv-starburst {
display: none
}

/* The container for the logo */
.cv-logo {
display: none
}

/*-------------------------------------*
* Left Navigation Bar *
*-------------------------------------*/

/* The wrapper that holds the left navigation panel */
.cv-leftnav-wrapper {
display: none
}

/* This has the BG image for the top part of the nav bar */
.cv-leftnav-panel {
display: none
}

/* This div holds the actual text of the navigation bar */
.cv-leftnav-body {
display: none
}

/* This is the footer of the nav bar */
.cv-leftnav-foot {
display: none
}

/* Header sections on the navigation bar */
.cv-nav-section {
display: none
}

.subsection {
display: none
}


/*-------------------------------------*
* Main Content Panel *
*-------------------------------------*/

/* The overall wrapper for the content panel */
.cv-content-wrapper {
display: inline
}

/* Provide the eye candy background image */
.cv-content-eyecandy {
display: inline
}

/* Top edge of the window */
.cv-content-topedge {
display: inline
}

/* Abs positioned top right border corner */
.cv-content-brdrne {
display: inline
}

/* Provides the left border to the content area */
.cv-content-left {
display: inline
}

/* Adds the right border to the content area */
.cv-content-right {
display: inline
}

/* The wrapper for the actual body area */
.cv-content-body {
display: inline
}

/* Bottom edge of the window */
.cv-content-botedge {
display: inline
}

/* Abs position the bottom left border corner */
.cv-content-brdrsw {
display: inline
}

/* Abs position the bottom right border corner */
.cv-content-brdrse {
display: inline
}

+ 344
- 0
www/designs/cosmos/screen.css View File

@@ -0,0 +1,344 @@
body {
background-color: #000000;
background-image: url("starrysky.jpg");
background-repeat: repeat;
background-position: top left;
font-family: Verdana,Arial,Helvetica,sans-serif;
font-size: small;
color: #CCCCCC;
margin: 0px;
margin-bottom: 20px
}
a:link, a:visited {
color: #99CCFF;
text-decoration: underline;
}
a:hover, a:active {
color: #FFCCFF
}
.cv-leftnav-body a:link, .cv-leftnav-body a:visited {
font-weight: bold;
font-size: x-small
}
a img {
border: 0px
}
h1,h2,h3,h4 {
font-family: "Trebuchet MS",Arial,Helvetica,sans-serif;
font-weight: bold;
color: #FFFFFF
}
h1.top, h2.top, h3.top, h4.top {
margin-top: 0px;
}
h1 {
margin-top: 0px;
font-size: 24pt;
font-weight: bold
}
h2 {
font-size: 18pt
}
h3 {
font-size: 18pt;
font-style: italic
}
h4 {
font-size: 16pt;
font-style: italic
}
pre {
display: block;
border: 1px dashed #CCCCCC;
padding: 5px;
font-family: "Lucida Console","DejaVu LGC Sans Mono","DejaVu Sans Mono","Bistream Vera Sans Mono",monospace;
font-size: 10pt;
color: #00CCCC
}
pre.notes {
height: 300px;
overflow: auto
}
code {
display: inline;
font-family: "Lucida Console","DejaVu LGC Sans Mono","DejaVu Sans Mono","Bistream Vera Sans Mono",monospace;
font-size: 9pt;
color: #00CCCC
}

/* A logo for the printed page */
.logo-printed {
display: none
}

/* Copyright block */
.copyright {
text-align: center;
font-size: x-small;
font-weight: bold;
color: #999999;
margin-top: 50px
}

/******************************************************************************
* Software Design Styles *
******************************************************************************/

.distro {
border: 1px solid #CCCCCC
}
.distro th {
width: 150px;
text-align: center;
vertical-align: top
}
.distro td {
width: 150px;
text-align: center;
vertical-align: top;
border: 1px solid #808080
}
.distro td img {
float: left
}

.sw-tab-wrapper {
display: block
}
.sw-tab-top {
padding-left: 16px;
}
.sw-tab-frame {
border-top: 1px solid #999999;
border-left: 1px solid #999999;
border-right: 1px solid #999999;
border-bottom: 1px solid #999999
}
.sw-tab-content {
padding: 5px
}
.sw-tab-active {
border-top: 1px solid #FFFFFF;
border-left: 1px solid #FFFFFF;
border-right: 1px solid #FFFFFF;
margin-right: 10px
}
.sw-tab-normal {
border-top: 1px solid #666666;
border-left: 1px solid #666666;
border-right: 1px solid #666666;
margin-right: 10px
}
.sw-tab-active span, .sw-tab-normal span {
padding-left: 4px;
padding-right: 4px
}
.sw-tab-active a:link, .sw-tab-active a:visited,
.sw-tab-normal a:link, .sw-tab-normal a:visited {
font-family: Verdana,Arial,Helvetica,sans-serif;
font-size: small;
font-weight: normal;
text-decoration: none;
}


/******************************************************************************
* Starburst CMS Mandated Style Classes for the Web Blog *
******************************************************************************/

.sblog-title {
display: block;
margin-bottom: 0px;
margin-top: 15px;
font-family: "Trebuchet MS",Verdana,Arial,Helvetica,sans-serif;
font-size: 24pt;
font-weight: bold
}
.sblog-title a:link, .sblog-title a:visited {
color: #FFFFFF;
text-decoration: none
}
.sblog-title a:hover, .sblog-title a:active {
color: #FFFFFF;
text-decoration: underline
}

/******************************************************************************
* Cuvou.com Web Design Styles *
******************************************************************************/

/*-------------------------------------*
* Background and Logo Styles *
*-------------------------------------*/

/* The main starburst BG image */
.cv-starburst {
z-index: 100;
position: absolute;
top: 0px;
left: 0px;
width: 750px;
height: 579px;
background-image: url("starburst.jpg");
background-repeat: no-repeat;
background-position: top left
}

/* The container for the logo */
.cv-logo {
z-index: 150;
position: absolute;
top: 0px;
left: 236px;
width: 403px;
height: 145px;
padding: 0px
}

/*-------------------------------------*
* Left Navigation Bar *
*-------------------------------------*/

/* The wrapper that holds the left navigation panel */
.cv-leftnav-wrapper {
z-index: 200;
position: absolute;
top: 159px;
left: 25px;
width: 174px
}

/* This has the BG image for the top part of the nav bar */
.cv-leftnav-panel {
width: 174px;
background-image: url("navbody.jpg");
background-repeat: repeat-y;
background-position: top left;
/* margin-bottom: 20px */
/* Adds some padding to the end of the bar */
}

/* This div holds the actual text of the navigation bar */
.cv-leftnav-body {
background-image: url("navtop.jpg");
background-repeat: no-repeat;
background-position: top left;
padding: 4px
}

/* This is the footer of the nav bar */
.cv-leftnav-foot {
background-image: url("navfoot.jpg");
background-repeat: no-repeat;
background-position: top left;
width: 174px;
height: 11px
}

/* Header sections on the navigation bar */
.cv-nav-section {
display: block;
text-align: center;
font-family: "Trebuchet MS",Arial,Helvetica,sans-serif;
font-size: 14pt;
color: #FFFFFF;
font-weight: bold;
border-bottom: 1px solid #FFFFFF
}

.subsection {
text-align: center;
font-family: "Trebuchet MS",Arial,Helvetica,sans-serif;
font-size: 10pt;
font-weight: bold;
border-bottom: 1px dashed #999999;
color: #CCCCCC
}


/*-------------------------------------*
* Main Content Panel *
*-------------------------------------*/

/* The overall wrapper for the content panel */
.cv-content-wrapper {
z-index: 300;
position: absolute;
top: 159px;
left: 224px;
right: 20px;
background-image: url("body-shadow.jpg");
background-repeat: repeat;
background-position: top left
}

/* Provide the eye candy background image */
.cv-content-eyecandy {
background-image: url("body-topleft.jpg");
background-repeat: no-repeat;
background-position: top left
}

/* Top edge of the window */
.cv-content-topedge {
height: 12px;
margin-left: 11px;
background-image: url("border-north.png");
background-repeat: repeat-x;
background-position: top left
}

/* Abs positioned top right border corner */
.cv-content-brdrne {
position: absolute;
top: 0px;
right: 0px;
width: 11px;
height: 12px;
background-image: url("border-ne.png");
background-repeat: no-repeat;
background-position: top left
}

/* Provides the left border to the content area */
.cv-content-left {
background-image: url("border-west.png");
background-repeat: repeat-y;
background-position: top left;
}

/* Adds the right border to the content area */
.cv-content-right {
background-image: url("border-east.png");
background-repeat: repeat-y;
background-position: top right;
}

/* The wrapper for the actual body area */
.cv-content-body {
padding-top: 0px;
padding-left: 8px;
padding-right: 8px;
padding-bottom: 8px;
}

/* Bottom edge of the window */
.cv-content-botedge {
background-image: url("border-south.png");
background-repeat: repeat-x;
background-position: bottom left
}

/* Abs position the bottom left border corner */
.cv-content-brdrsw {
background-image: url("border-sw.png");
background-repeat: no-repeat;
background-position: bottom left
}

/* Abs position the bottom right border corner */
.cv-content-brdrse {
background-image: url("border-se.png");
background-repeat: no-repeat;
background-position: bottom right
}

BIN
www/designs/cosmos/starburst.jpg View File

Before After
Width: 750  |  Height: 579  |  Size: 112 KiB

BIN
www/designs/cosmos/starrysky.jpg View File

Before After
Width: 210  |  Height: 244  |  Size: 5.8 KiB

+ 129
- 0
www/designs/index.html View File

@@ -0,0 +1,129 @@
{% extends "layout.html" %}
{% block title %}Error Message Generator{% endblock %}
{% block content %}

<h1>Web Design</h1>

Here you can find an archive of some past web designs used for my personal
website, in chronological order.<p>

<div class="row">
<div class="col-md-4 center">
<a href="/designs/lavender" target="_blank">
<img src="/designs/screenshots/lavender.t.png" alt="Lavender" class="portrait">
</a>
</div>
<div class="col-md-8">
<a href="/designs/lavender" target="_blank">Cuvou.com Lavender</a><p>

This was the first web design for Cuvou.com, which was the domain I was
using for my personal website somewhere around the year 2006.
</div>
</div>
<br>

<div class="row">
<div class="col-md-4 center">
<a href="/designs/starburst" target="_blank">
<img src="/designs/screenshots/starburst.t.png" alt="Starburst" class="portrait">
</a>
</div>
<div class="col-md-8">
<a href="/designs/starburst" target="_blank">Cuvou.com Starburst</a><p>

This was the second redesign for Cuvou.com. It featured lighter shades
of blue to improve the readability of the pages. I named it Starburst
both for the visual look of the theme, and because it was the name of
the Perl CMS I was programming to run Cuvou.com.
</div>
</div>
<br>

<div class="row">
<div class="col-md-4 center">
<a href="/designs/storm" target="_blank">
<img src="/designs/screenshots/storm.t.png" alt="Storm" class="portrait">
</a>
</div>
<div class="col-md-8">
<a href="/designs/storm" target="_blank">Cuvou.com Storm</a><p>

This was the third design. I didn't end up liking it very much and
quickly replaced it.
</div>
</div>
<br>

<div class="row">
<div class="col-md-4 center">
<a href="/designs/cosmos" target="_blank">
<img src="/designs/screenshots/cosmos.t.png" alt="Cosmos" class="portrait">
</a>
</div>
<div class="col-md-8">
<a href="/designs/cosmos" target="_blank">Cuvou.com Cosmos</a><p>

This was the final redesign for Cuvou.com and features an outer space
style theme, while still keeping the blue and pink color scheme.
</div>
</div>
<br>

<div class="row">
<div class="col-md-4 center">
<a href="/designs/solar" target="_blank">
<img src="/designs/screenshots/solar.t.png" alt="Solar" class="portrait">
</a>
</div>
<div class="col-md-8">
<a href="/designs/solar" target="_blank">Kirsle.net Solar</a><p>

This was the original "Solar" theme for Kirsle.net, which was the next
logical upgrade from the Cosmos theme. This first iteration used static,
flat images for every part of the design: though the design looks like
it has transparent backgrounds, they were actually pre-rendered, because
I wanted to support Internet Explorer 6 and it couldn't handle alpha
channels in PNG images.<p>

I actually lost my copy of this template and had to dig it up on
<a href="http://www.archive.org/">The Internet Archive</a> and piece it
back together.
</div>
</div>
<br>

<div class="row">
<div class="col-md-4 center">
<a href="/designs/solar-html5" target="_blank">
<img src="/designs/screenshots/solar-html5.t.png" alt="Solar HTML5" class="portrait">
</a>
</div>
<div class="col-md-8">
<a href="/designs/solar-html5" target="_blank">Kirsle.net Solar (HTML5)</a><p>

An HTML5/CSS3 refresh of the Kirsle.net Solar theme. I started using
CSS3 for the rounded panel borders and transparent PNGs for the panel
background colors, breaking compatibility with MSIE 6.0.<p>

This design went live on Kirsle.net on May 12, 2010.
<a href="/blog/entry/design-refresh">Relevant blog post</a>.
</div>
</div>
<br>

<div class="row">
<div class="col-md-4 center">
<a href="/designs/solar-bootstrap" target="_blank">
<img src="/designs/screenshots/solar-bootstrap.t.png" alt="Solar Bootstrap" class="portrait">
</a>
</div>
<div class="col-md-8">
<a href="/designs/solar-bootstrap" target="_blank">Kirsle.net Solar (Bootstrap)</a><p>

Another design refresh that uses Twitter Bootstrap as the layout engine,
improving compatibility with mobile browsers. This design went live on
October 15, 2014.
</div>
</div>

{% endblock %}

BIN
www/designs/lavender/css.png View File

Before After
Width: 88  |  Height: 31  |  Size: 1.4 KiB

BIN
www/designs/lavender/cuvou.gif View File

Before After
Width: 322  |  Height: 85  |  Size: 13 KiB

BIN
www/designs/lavender/cuvou.png View File

Before After
Width: 322  |  Height: 85  |  Size: 12 KiB

BIN
www/designs/lavender/fedora.png View File

Before After
Width: 88  |  Height: 31  |  Size: 1.9 KiB

BIN
www/designs/lavender/html.png View File

Before After
Width: 88  |  Height: 31  |  Size: 1.6 KiB

+ 208
- 0
www/designs/lavender/index.html View File

@@ -0,0 +1,208 @@
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Cuvou.com</title>
<link rel="StyleSheet" type="text/css" media="screen" href="/designs/lavender/screen.css">
<link rel="StyleSheet" type="text/css" media="print" href="/designs/lavender/print.css">
</head>
<body>

<div style="display: none">
<a href="aelita/"><small>Don't Click Here</small></a>
<a href="aelita/guestbook/"><small>.</small></a>
<a href="aelita/guestbook/post/"><small>.</small></a>
<a href="aelita/guestbook/contact/"><small>.</small></a>
<a href="aelita/guestbook/email/"><small>.</small></a>
<a href="aelita/guestbook/message/"><small>.</small></a>
</div>

<div class="leader">
<img src="/designs/lavender/cuvou.gif" alt="Cuvou">
</div>

<div class="navstrip">
<div class="navi">
<div class="navhead">Cuvou</div>
&#0187; <a href="#link?module=index">Homepage</a><br>
&#0187; <a href="#link?module=guestbook">Guestbook</a><br>
&#0187; <a href="#link?module=map">Site Map</a><br>
&#0187; <a href="#http://www.project-fearless.com/">Project Fearless</a>

<div class="navhead">Author</div>
&#0187; <a href="#link?module=cuvou">Biography</a><br>
&#0187; <a href="#link?module=pics">Pictures</a><br>
&#0187; <a href="#link?module=contact">Contact</a>

<div class="navhead">Creativity</div>
&#0187; <a href="#link?module=render">3D Rendered</a><br>
&#0187; <a href="#link?module=flash">Flash Animation</a><br>
&#0187; <a href="#link?module=fonts">TrueType Fonts</a><br>
&#0187; <a href="#link?module=philosophy">Philosophy</a>

<div class="navhead">Software</div>
&#0187; <a href="#link?module=distro">[Distro Help]</a><br>
&#0187; <a href="#link?module=pccc">CyanChat Client</a><br>
&#0187; <a href="#link?module=azulenc">Azulian Encoder</a><br>
&#0187; <a href="#link?module=errorgen">Error Generator</a><br>
&#0187; <a href="#link?module=tkcalc">Tk Calculator</a><br>
&#0187; <a href="#link?module=terminal">Terminal Apps</a><br>
&#0187; <a href="#link?module=metacity">Metacity</a><br>
&#0187; <a href="#link?module=apps">Misc. Apps</a>

<div class="navhead">Articles</div>
&#0187; <a href="#link?module=ubuntu">To Ubuntu</a><br>
&#0187; <a href="#link?module=acer">Aspire 5050</a>

<div class="navhead">Projects</div>
&#0187; <a href="#link?module=tkhtml">Tk HTML</a><br>
&#0187; <a href="#perlaim/dev.html">PerlAIM</a>

<div class="navhead">Web Tools</div>
&#0187; <a href="/wizards/translator.html">Azulian Web Enc.</a>

<div class="navhead">E-Mail</div>
&#0187; <a href="#http://mail.live.com">Check E-Mail</a><br>
&#0187; <a href="#https://domains.live.com/members/signup.aspx?domain=cuvou.net">Sign Up</a><p>

&#0187; <a href="#link?module=referer">HTTP Referrers</a><br>
&#0187; <a href="#link?module=agents">User Agents</a><br>
&#0187; <a href="#link?module=stats">File Popularity</a>

<div style="text-align: center">
<a href="http://validator.w3.org/check?uri=referer">
<img src="/designs/lavender/html.png" width="88" height="31" alt="HTML 4.01 Strict">
</a><br>

<a href="http://jigsaw.w3.org/css-validator/">
<img src="/designs/lavender/css.png" width="88" height="31" alt="Valid CSS">
</a><br>

<a href="http://www.perl.com/">
<img src="/designs/lavender/perl.png" width="88" height="31" alt="Powered by Perl">
</a><br>

<a href="http://www.fedoraproject.org/">
<img src="/designs/lavender/fedora.png" width="88" height="31" alt="Powered by Fedora">
</a>
</div>
</div>
</div>

<div class="wrapper">
<h1>Cuvou.com Lavender</h1>

This is the original web design for Cuvou.com, codenamed Lavender. This
design was later replaced with <a href="/designs/starburst">Starburst</a>.

<h1>Heading Level 1</h1>

And some text.

<h2>Heading Level 2</h2>

And more text.

<h3>Heading Level 3</h3>

And some more text.

<h4>Heading Level 4</h4>

And even more text.<p>

<pre>And
preformatted
text!</pre>
</div>

<p>&nbsp;

<div class="copyright">
All content on this website is original and is copyright &#0169; 2007 Casey Kirsle.<br>
Use content only with permission.
<p>&nbsp;
</div>

<script type="text/javascript">
/*
##########################################################
# Hyperlink Editor Script || Copyright 2007 Casey Kirsle #
#--------------------------------------------------------#
# This script makes all offsite links open in a new #
# window, and turns all e-mail links in the format of #
# "name-at-domain.com" into "name\@domain.com" #
#--------------------------------------------------------#
# Use content only with permission. Get permission from #
# casey "at" cuvou.org #
##########################################################
*/
// var localAddr = new Array();
// localAddr[0] = "cuvou.com";
// localAddr[1] = "www.cuvou.com";
// localAddr[2] = "cuvou.net";
// localAddr[3] = "www.cuvou.net";
// localAddr[4] = "cuvou.org";
// localAddr[5] = "www.cuvou.org";
// localAddr[6] = "upsilon.cuvou.com";

// if (document.getElementsByTagName) {
// var links = document.getElementsByTagName("a");

// for (var i = 0; i < links.length; i++) {
// var loc = links[i].href;

// var parts = loc.split ("/"); // http, null, domain name, request
// var prot = parts[0].split(":");
// var protocol = prot[0];
// protocol.toLowerCase;
// if (protocol == "http" || protocol == "https") {
// // This is an absolute URL.
// var isLocal = 0;

// for (var j = 0; j < localAddr.length; j++) {
// if (parts[2] == localAddr[j]) {
// isLocal = 1;
// }
// }

// if (isLocal == 1) {
// // Local links don't need to be modified.
// }
// else {
// // Remote links need to open in a new window.
// links[i].target = "_blank";
// }
// }
// else if (protocol == "mailto") {
// // MailTo link. See if this isn't a normal link.
// if (loc.indexOf("-at-") > -1) {
// var newhref = loc.split("-at-").join("@");
// links[i].href = newhref;

// // Convert it in the text too.
// if (links[i].innerHTML.indexOf("-at-") > -1) {
// var mailLabel = links[i].innerHTML.split("-at-");
// var newLabel = mailLabel.join ("@");
// links[i].innerHTML = newLabel;
// }
// }
// }
// else if (protocol == "msnim") {
// if (loc.indexOf("-at-") > -1) {
// var newhref = loc.split("-at-").join("@");
// links[i].href = newhref;

// // Convert it in the text too.
// if (links[i].innerHTML.indexOf("-at-") > -1) {
// var mailLabel = links[i].innerHTML.split("-at-");
// var newLabel = mailLabel.join ("@");
// links[i].innerHTML = newLabel;
// }
// }
// }
// }
// }
</script>

</body>
</html>

BIN
www/designs/lavender/navbg.png View File

Before After
Width: 150  |  Height: 5  |  Size: 179 B

BIN
www/designs/lavender/navi.png View File

Before After
Width: 150  |  Height: 299  |  Size: 16 KiB

BIN
www/designs/lavender/navi.psd View File


BIN
www/designs/lavender/perl.png View File

Before After
Width: 88  |  Height: 31  |  Size: 1.8 KiB

+ 73
- 0
www/designs/lavender/print.css View File

@@ -0,0 +1,73 @@
body {
background-color: #FFFFFF;
font-family: Verdana,Arial,Helvetica,sans-serif;
font-size: small;
color: #000000;
margin-left: 100px;
margin-top: 130px;
margin-right: 100px;
margin-bottom: 0px
}
a:link, a:visited, a:hover, a:active {
font-weight: bold;
color: #502000;
text-decoration: underline
}
a:link:after, a:visited:after, a:hover:after, a:active:after {
content: " (" attr(href) ") ";
font-size: smaller
}
h1 {
font-family: Arial,Helvetica,sans-serif;
font-size: 36pt;
font-weight: bold;
font-style: italic;
margin-bottom: 20px;
margin-top: 20px
}
h2 {
font-family: Arial,Helvetica,sans-serif;
font-size: 18pt;
font-weight: bold;
font-style: italic;
margin-bottom: 20px;
margin-top: 20px
}
pre {
font-family: "Courier New",Courier,monospace;
font-size: small;
color: #000000;
background-color: #FFFFFF;
border: 1px solid #000000;
display: block;
padding: 2px
}
.leader {
display: none
}
.printleader {
position: absolute;
left: 100px;
right: 100px;
top: 30px;
text-align: center;
border-bottom: 2px solid #000000
}
.navstrip {
display: none
}
.navi {
display: none
}
.navhead {
display: none
}
.copyright {
text-align: center;
font-family: Verdana,Arial,Helvetica,sans-serif;
font-size: smaller;
font-weight: bold
}
.wrapper {
display: inline
}

+ 123
- 0
www/designs/lavender/screen.css View File

@@ -0,0 +1,123 @@
body {
background-image: url(starburst.jpg);
background-repeat: no-repeat;
background-color: #0099FF;
font-family: Verdana,Arial,Helvetica,sans-serif;
font-size: small;
color: #000000;
margin-left: 220px;
margin-top: 130px;
margin-right: 25px;
margin-bottom: 0px
}
a:link, a:visited {
font-weight: bold;
color: #FFFFFF;
text-decoration: none
}
a:hover, a:active {
font-weight: bold;
color: #FFFFFF;
text-decoration: underline
}
a:link img, a:visited img, a:hover img, a:active img {
border: 0px
}
img.left {
float: left
}
img.right {
float: right
}
.center {
text-align: center
}
h1 {
font-family: Arial,Helvetica,sans-serif;
font-size: 36pt;
font-weight: bold;
font-style: italic;
margin-bottom: 20px;
margin-top: 20px
}
h2 {
font-family: Arial,Helvetica,sans-serif;
font-size: 24pt;
font-weight: bold;
font-style: italic;
margin-bottom: 20px;
margin-top: 20px
}
h3 {
font-family: Arial,Helvetica,sans-serif;
font-size: 14pt;
font-weight: bold;
margin-bottom: 20px;
margin-top: 20px
}
pre {
font-family: "Courier New",Courier,monospace;
font-size: small;
color: #000000;
background-color: #EEEEFF;
border: 1px solid #000000;
display: block;
padding: 2px
}
pre.notes {
height: 300px;
overflow: auto
}
.leader {
position: absolute;
left: 300px;
top: 30px;
}
.printleader {
display: none
}
.navstrip {
position: absolute;
left: 31px;
top: 129px;
width: 150px;
background-image: url(navbg.png);
background-repeat: repeat-y;
border-bottom: 3px solid #036BB2
}
.navi {
background-image: url(navi.png);
background-repeat: repeat-x;
color: #FFFFFF;
padding: 5px
}
.navhead {
font-family: Arial,Helvetica,sans-serif;
text-align: center;
font-weight: bold;
font-size: large;
color: #00FFFF;
border-bottom: 1px solid #00FFFF;
margin-left: 20px;
margin-right: 20px
}
.copyright {
text-align: center;
font-family: Verdana,Arial,Helvetica,sans-serif;
font-size: smaller;
font-weight: bold
}
.wrapper {
display: inline
}
.dltab {
width: 700px;
border: 1px solid #000000
}
.dltab th {
width: 25%
}
.dltab td {
border: 1px solid #000000;
width: 25%
}

BIN
www/designs/lavender/starburst.jpg View File

Before After
Width: 550  |  Height: 500  |  Size: 10 KiB

BIN
www/designs/lavender/starburst.psd View File


BIN
www/designs/screenshots/cosmos.png View File

Before After
Width: 1375  |  Height: 832  |  Size: 581 KiB

BIN
www/designs/screenshots/cosmos.t.png View File

Before After
Width: 250  |  Height: 151  |  Size: 47 KiB

BIN
www/designs/screenshots/lavender.png View File

Before After
Width: 1375  |  Height: 832  |  Size: 204 KiB

BIN
www/designs/screenshots/lavender.t.png View File

Before After
Width: 250  |  Height: 151  |  Size: 23 KiB

BIN
www/designs/screenshots/solar-bootstrap.png View File

Before After
Width: 1375  |  Height: 832  |  Size: 1.2 MiB

BIN
www/designs/screenshots/solar-bootstrap.t.png View File

Before After
Width: 250  |  Height: 151  |  Size: 56 KiB

BIN
www/designs/screenshots/solar-html5.png View File

Before After
Width: 1375  |  Height: 832  |  Size: 1.2 MiB

BIN
www/designs/screenshots/solar-html5.t.png View File

Before After
Width: 250  |  Height: 151  |  Size: 56 KiB

BIN
www/designs/screenshots/solar.png View File

Before After
Width: 1375  |  Height: 832  |  Size: 1.0 MiB

BIN
www/designs/screenshots/solar.t.png View File

Before After
Width: 250  |  Height: 151  |  Size: 54 KiB

BIN
www/designs/screenshots/starburst.png View File

Before After
Width: 1375  |  Height: 832  |  Size: 174 KiB

BIN
www/designs/screenshots/starburst.t.png View File

Before After
Width: 250  |  Height: 151  |  Size: 25 KiB

BIN
www/designs/screenshots/storm.png View File

Before After
Width: 1375  |  Height: 832  |  Size: 802 KiB

BIN
www/designs/screenshots/storm.t.png View File

Before After
Width: 250  |  Height: 151  |  Size: 52 KiB

+ 5
- 0
www/designs/solar-bootstrap/bootstrap-theme.min.css
File diff suppressed because it is too large
View File


+ 5
- 0
www/designs/solar-bootstrap/bootstrap.min.css
File diff suppressed because it is too large
View File


+ 6
- 0
www/designs/solar-bootstrap/bootstrap.min.js
File diff suppressed because it is too large
View File


+ 82
- 0
www/designs/solar-bootstrap/codehilite.css View File

@@ -0,0 +1,82 @@
/* Syntax highlighting classes for markdown codehilite plugin, which uses
Pygments. This file was generated by doing this in the Python shell:

>>> from pygments.formatters import HtmlFormatter
>>> fh = open("codehilite.css", "w")
>>> fh.write(HtmlFormatter().get_style_defs(".codehilite"))
>>> fh.close()
*/

.codehilite .hll { background-color: #ffffcc }
.codehilite { background: #f8f8f8; }
.codehilite .c { color: #408080; font-style: italic } /* Comment */
.codehilite .err { border: 1px solid #FF0000 } /* Error */
.codehilite .k { color: #008000; font-weight: bold } /* Keyword */
.codehilite .o { color: #666666 } /* Operator */
.codehilite .cm { color: #408080; font-style: italic } /* Comment.Multiline */
.codehilite .cp { color: #BC7A00 } /* Comment.Preproc */
.codehilite .c1 { color: #408080; font-style: italic } /* Comment.Single */
.codehilite .cs { color: #408080; font-style: italic } /* Comment.Special */
.codehilite .gd { color: #A00000 } /* Generic.Deleted */
.codehilite .ge { font-style: italic } /* Generic.Emph */
.codehilite .gr { color: #FF0000 } /* Generic.Error */
.codehilite .gh { color: #000080; font-weight: bold } /* Generic.Heading */
.codehilite .gi { color: #00A000 } /* Generic.Inserted */
.codehilite .go { color: #888888 } /* Generic.Output */
.codehilite .gp { color: #000080; font-weight: bold } /* Generic.Prompt */
.codehilite .gs { font-weight: bold } /* Generic.Strong */
.codehilite .gu { color: #800080; font-weight: bold } /* Generic.Subheading */
.codehilite .gt { color: #0044DD } /* Generic.Traceback */
.codehilite .kc { color: #008000; font-weight: bold } /* Keyword.Constant */
.codehilite .kd { color: #008000; font-weight: bold } /* Keyword.Declaration */
.codehilite .kn { color: #008000; font-weight: bold } /* Keyword.Namespace */
.codehilite .kp { color: #008000 } /* Keyword.Pseudo */
.codehilite .kr { color: #008000; font-weight: bold } /* Keyword.Reserved */
.codehilite .kt { color: #B00040 } /* Keyword.Type */
.codehilite .m { color: #666666 } /* Literal.Number */
.codehilite .s { color: #BA2121 } /* Literal.String */
.codehilite .na { color: #7D9029 } /* Name.Attribute */
.codehilite .nb { color: #008000 } /* Name.Builtin */
.codehilite .nc { color: #0000FF; font-weight: bold } /* Name.Class */
.codehilite .no { color: #880000 } /* Name.Constant */
.codehilite .nd { color: #AA22FF } /* Name.Decorator */
.codehilite .ni { color: #999999; font-weight: bold } /* Name.Entity */
.codehilite .ne { color: #D2413A; font-weight: bold } /* Name.Exception */
.codehilite .nf { color: #0000FF } /* Name.Function */
.codehilite .nl { color: #A0A000 } /* Name.Label */
.codehilite .nn { color: #0000FF; font-weight: bold } /* Name.Namespace */
.codehilite .nt { color: #008000; font-weight: bold } /* Name.Tag */
.codehilite .nv { color: #19177C } /* Name.Variable */
.codehilite .ow { color: #AA22FF; font-weight: bold } /* Operator.Word */
.codehilite .w { color: #bbbbbb } /* Text.Whitespace */
.codehilite .mf { color: #666666 } /* Literal.Number.Float */
.codehilite .mh { color: #666666 } /* Literal.Number.Hex */
.codehilite .mi { color: #666666 } /* Literal.Number.Integer */
.codehilite .mo { color: #666666 } /* Literal.Number.Oct */
.codehilite .sb { color: #BA2121 } /* Literal.String.Backtick */
.codehilite .sc { color: #BA2121 } /* Literal.String.Char */
.codehilite .sd { color: #BA2121; font-style: italic } /* Literal.String.Doc */
.codehilite .s2 { color: #BA2121 } /* Literal.String.Double */
.codehilite .se { color: #BB6622; font-weight: bold } /* Literal.String.Escape */
.codehilite .sh { color: #BA2121 } /* Literal.String.Heredoc */
.codehilite .si { color: #BB6688; font-weight: bold } /* Literal.String.Interpol */
.codehilite .sx { color: #008000 } /* Literal.String.Other */
.codehilite .sr { color: #BB6688 } /* Literal.String.Regex */
.codehilite .s1 { color: #BA2121 } /* Literal.String.Single */
.codehilite .ss { color: #19177C } /* Literal.String.Symbol */
.codehilite .bp { color: #008000 } /* Name.Builtin.Pseudo */
.codehilite .vc { color: #19177C } /* Name.Variable.Class */
.codehilite .vg { color: #19177C } /* Name.Variable.Global */
.codehilite .vi { color: #19177C } /* Name.Variable.Instance */
.codehilite .il { color: #666666 } /* Literal.Number.Integer.Long */

/* Dark theme overrides --Kirsle */
.codehilite { background-color: transparent }
.codehilite .nf { color: #0099FF }
.codehilite .sd { color: #FF99FF }
.codehilite .s { color: #FF4400 }
.codehilite .nv { color: #0099FF }
.codehilite .sx,
.codehilite .k,
.codehilite .nb { color: #00BB00 }
.codehilite .nn { color: #00CCCC }

BIN
www/designs/solar-bootstrap/css3.png View File

Before After
Width: 80  |  Height: 15  |  Size: 805 B

BIN
www/designs/solar-bootstrap/digital-ocean.png View File

Before After
Width: 140  |  Height: 39  |  Size: 5.1 KiB

BIN
www/designs/solar-bootstrap/html5.png View File

Before After
Width: 80  |  Height: 15  |  Size: 1005 B

+ 266
- 0
www/designs/solar-bootstrap/index.html View File

@@ -0,0 +1,266 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Solar Bootstrap - Kirsle.net</title>

<!-- Bootstrap -->
<link rel="stylesheet" type="text/css" href="/designs/solar-bootstrap/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="/designs/solar-bootstrap/bootstrap-theme.min.css">

<!-- Kirsle.net Solar -->
<link rel="stylesheet" type="text/css" media="screen" href="/designs/solar-bootstrap/ui.css">
<link rel="stylesheet" type="text/css" media="print" href="/designs/solar-bootstrap/print.css">
<link rel="stylesheet" type="text/css" href="/designs/solar-bootstrap/monokai.css">
<link rel="stylesheet" type="text/css" href="/designs/solar-bootstrap/vim-syntax.css">
<link rel="alternate" type="application/rss+xml" title="Kirsle's RSS Feed" href="/blog/rss">

<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body>

<div class="mobile-nav">
<a href="#navbar" class="btn btn-primary"><i class="glyphicon glyphicon-list"></i></a>
</div>

<div class="k-supernova"></div>

<div class="container-fluid">

<div class="row">
<div class="col-md-4 col-md-offset-3">
<div class="k-kirsle" onclick="self.location='/'"></div>
</div>
</div>

<div class="row">

<div class="col-sm-10 col-sm-push-2">
<div class="k-content-panel">
<h1>Kirsle.net Solar (Bootstrap)</h1>

This is another design refresh for Kirsle.net Solar that uses Twitter
Bootstrap as its layout engine, making it work better on mobile. Resize
the browser window and see how the site reacts.<p>

This design went live on Kirsle.net on October 15, 2014. It replaced
the previous version of the <a href="/designs/solar-html5">Solar</a> theme.

<h2>Heading Level 2</h2>

Lorem ipsum dolor sit amet, <a href="#">consectetuer adipiscing</a> elit. Duis pede purus, ornare interdum, consequat in, dignissim vitae, nisi.
Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Praesent ornare. Phasellus interdum,
sem vulputate commodo congue, augue nisl aliquet velit, eu volutpat justo ante vitae lacus. Donec pulvinar scelerisque nisl.
Donec viverra sem eu augue. Phasellus faucibus nulla nec lacus aliquam dapibus. Aliquam nibh ipsum, blandit sit amet, consequat
in, blandit et, massa. Quisque nec urna. Aliquam nec elit ut erat consectetuer feugiat. Suspendisse tincidunt purus vel diam
blandit sagittis. Sed vestibulum, dolor nec vehicula accumsan, purus leo congue risus, at dapibus massa lorem sit amet purus.<p>

Nullam et nulla. <a href="#">Fusce consectetuer</a>, ante et auctor egestas, mi mi eleifend lorem, quis pulvinar tellus est at ligula. Donec
pulvinar, nisl vitae tempor fermentum, massa nulla placerat neque, ac posuere enim enim facilisis velit. Phasellus et augue
et nisi placerat eleifend. Mauris quam lectus, consequat ut, rutrum vitae, elementum a, sem. Nam aliquam, metus et tincidunt
cursus, felis risus faucibus dolor, quis ultricies tellus justo sed ligula. Integer orci magna, cursus sed, eleifend a,
imperdiet vitae, nibh. Aenean mattis nisl at tortor. Integer diam elit, adipiscing vitae, mollis ac, aliquam et, elit. Etiam
hendrerit, diam non ultrices pellentesque, leo augue egestas mauris, at dictum nisl augue nec odio. Praesent condimentum.
Morbi semper tellus eget ipsum porta pellentesque.

<pre>Preformatted
T e x t . i</pre>

<h3>Heading Level 3</h3>

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Duis pede purus, ornare interdum, consequat in, dignissim vitae, nisi.
Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Praesent ornare. Phasellus interdum,
sem vulputate commodo congue, augue nisl aliquet velit, eu volutpat justo ante vitae lacus. Donec pulvinar scelerisque nisl.
Donec viverra sem eu augue. Phasellus faucibus nulla nec lacus aliquam dapibus. Aliquam nibh ipsum, blandit sit amet, consequat
in, blandit et, massa. Quisque nec urna. Aliquam nec elit ut erat consectetuer feugiat. Suspendisse tincidunt purus vel diam
blandit sagittis. Sed vestibulum, dolor nec vehicula accumsan, purus leo congue risus, at dapibus massa lorem sit amet purus.<p>

Nullam et nulla. Fusce consectetuer, ante et auctor egestas, mi mi eleifend lorem, quis pulvinar tellus est at ligula. Donec
pulvinar, nisl vitae tempor fermentum, massa nulla placerat neque, ac posuere enim enim facilisis velit. Phasellus et augue
et nisi placerat eleifend. Mauris quam lectus, consequat ut, rutrum vitae, elementum a, sem. Nam aliquam, metus et tincidunt
cursus, felis risus faucibus dolor, quis ultricies tellus justo sed ligula. Integer orci magna, cursus sed, eleifend a,
imperdiet vitae, nibh. Aenean mattis nisl at tortor. Integer diam elit, adipiscing vitae, mollis ac, aliquam et, elit. Etiam
hendrerit, diam non ultrices pellentesque, leo augue egestas mauris, at dictum nisl augue nec odio. Praesent condimentum.
Morbi semper tellus eget ipsum porta pellentesque.

<h4>Heading Level 4</h4>

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Duis pede purus, ornare interdum, consequat in, dignissim vitae, nisi.
Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Praesent ornare. Phasellus interdum,
sem vulputate commodo congue, augue nisl aliquet velit, eu volutpat justo ante vitae lacus. Donec pulvinar scelerisque nisl.
Donec viverra sem eu augue. Phasellus faucibus nulla nec lacus aliquam dapibus. Aliquam nibh ipsum, blandit sit amet, consequat
in, blandit et, massa. Quisque nec urna. Aliquam nec elit ut erat consectetuer feugiat. Suspendisse tincidunt purus vel diam
blandit sagittis. Sed vestibulum, dolor nec vehicula accumsan, purus leo congue risus, at dapibus massa lorem sit amet purus.<p>

Nullam et nulla. Fusce consectetuer, ante et auctor egestas, mi mi eleifend lorem, quis pulvinar tellus est at ligula. Donec
pulvinar, nisl vitae tempor fermentum, massa nulla placerat neque, ac posuere enim enim facilisis velit. Phasellus et augue
et nisi placerat eleifend. Mauris quam lectus, consequat ut, rutrum vitae, elementum a, sem. Nam aliquam, metus et tincidunt
cursus, felis risus faucibus dolor, quis ultricies tellus justo sed ligula. Integer orci magna, cursus sed, eleifend a,
imperdiet vitae, nibh. Aenean mattis nisl at tortor. Integer diam elit, adipiscing vitae, mollis ac, aliquam et, elit. Etiam
hendrerit, diam non ultrices pellentesque, leo augue egestas mauris, at dictum nisl augue nec odio. Praesent condimentum.
Morbi semper tellus eget ipsum porta pellentesque.

<div class="k-copyright">
Copyright &copy; 2014 Noah Petherbridge &mdash; All rights reserved<br>
Powered by <a href="http://rophako.kirsle.net/" target="_blank">Rophako</a> v0.01 -
Hosted by <a href="#">DigitalOcean</a><br>
Page generated in 0.001s.
</div>
</div>
</div>

<div class="col-sm-2 col-sm-pull-10">
<div class="k-navpanel">
<a name="navbar"></a>
<div class="k-section">Kirsle</div>
<ul>
<li>&#0187; <a href="#/">Homepage</a> (<a href="#">RSS</a>)</li>
<li>&#0187; <a href="#/about">About Me</a></li>
<li>&#0187; <a href="#/photos/albums">Photo Albums</a></li>
<li>&#0187; <a href="#/guestbook">Guestbook</a></li>
<li>&#0187; <a href="#/contact">Contact Me</a></li>
</ul>

<div class="k-section">Channels</div>
<ul>
<li>&#0187; <a href="#">Blog Archives</a></li>
</ul>

<div class="k-section">Creativity</div>
<ul>
<li>&#0187; <a href="#/rendering">3D Renderings</a></li>
<li>&#0187; <a href="#/flash">Flash Animation</a></li>
<li>&#0187; <a href="#/javascript">JavaScript</a></li>
<li>&#0187; <a href="#/fonts">Fonts</a></li>
<li>&#0187; <a href="#/metacity">Metacity</a></li>
<li>&#0187; <a href="#/doc/">Tutorials</a></li>
<li>&#0187; <a href="#/designs">Web Design</a></li>
</ul>

<div class="k-section">Software</div>
<ul>
<li>&#0187; <a href="#/rivescript">RiveScript</a></li>
<li>&#0187; <a href="#/errorgen">Error Generator</a></li>
<li>&#0187; <a href="#/tkcalc">Tk Calculator</a></li>
<li>&#0187; <a href="#http://sh.kirsle.net/" target="_blank">Terminal Apps</a></li>
<li>&#0187; <a href="#/pccc">CyanChat Client</a></li>
</ul>

<div class="k-section">Web Tools</div>
<ul>
<li>&#0187; <a href="#/wizards/ttf2eot.cgi">TTF to EOT</a></li>
<li>&#0187; <a href="#/wizards/ps1.html">Base $PS1 Prompt</a></li>
<li>&#0187; <a href="#/wizards/fader.cgi">Text Fader</a></li>
<li>&#0187; <a href="#/wizards/favicon.cgi">Favicons</a></li>
<li>&#0187; <a href="#/wizards/distance.cgi">Distance Calc</a></li>
<li>&#0187; <a href="#/wizards/translator.html">Azulian Translater</a></li>
<li>&#0187; <a href="#/wizards/xbmask.cgi">XBM Masks</a></li>
<li>&#0187; <a href="#/wizards/flask-session.py">Flask Session</a></li>
</ul>

<div class="k-section">Subdomains</div>
<ul>
<li>&#0187; <a href="#http://sh.kirsle.net/">Shell Scripts</a></li>
<li>&#0187; <a href="#http://rpm.kirsle.net/">Linux RPMs</a></li>
<li>&#0187; <a href="#http://rophako.kirsle.net/">Rophako CMS</a></li>
<li>&#0187; <a href="#http://nano.kirsle.net/">Kirsle::Nano</a></li>
<li>&#0187; <a href="#http://mc.kirsle.net/">Minecraft Server</a></li>
</ul>

<div class="k-section">Miscellany</div>
<ul>
<li>&#0187; <a href="#/firered">Pok&#0233;mon Fuchsia City</a></li>
<li>&#0187; <a href="#/msdos">DOS and Windows</a></li>
<li>&#0187; <a href="#/raspberrypi">Raspberry Pi</a></li>
</ul>

<div class="k-section">Links</div>
<ul>
<li>&#0187; <a href="#https://www.google.com/+NoahPetherbridge">Google+</a></li>
<li>&#0187; <a href="#https://twitter.com/kirsle">Twitter</a></li>
<li>&#0187; <a href="#https://myspace.com/kirsle">MySpace</a></li>
<li>&#0187; <a href="#https://github.com/kirsle">Github</a></li>
<li>&#0187; <a href="#http://search.cpan.org/~kirsle">CPAN</a></li>
<li>&#0187; <a href="#https://www.npmjs.org/~kirsle">npm</a></li>
</ul>

<div class="k-section">Fan Club</div>
<ul>
<li>&#0187; <a href="#" class="login-link">Log In</a></li>
</ul>

<div class="center">
<a href="https://www.python.org/" target="_blank">
<img src="/designs/solar-bootstrap/python.png" width="80" height="15" alt="Python powered">
</a><br>

<a href="http://validator.w3.org/check?uri=referer">
<img src="/designs/solar-bootstrap/html5.png" width="80" height="15" alt="W3C Valid HTML5">
</a><br>

<a href="http://jigsaw.w3.org/css-validator/validator?uri=http://www.kirsle.com/solar/screen.css">
<img src="/designs/solar-bootstrap/css3.png" width="80" height="15" alt="W3C Valid CSS3">
</a><p>

<a href="#" target="_blank">
<img src="/designs/solar-bootstrap/digital-ocean.png" width="140" height="39" alt="Proudly hosted by DigitalOcean">
</a>
</div>

</div>
</div>

</div>

</div>

<script type="text/javascript" src="/designs/solar-bootstrap/jquery-2.1.0.min.js"></script>
<script type="text/javascript" src="/designs/solar-bootstrap/offsite.js"></script>
<script type="text/javascript" src="/designs/solar-bootstrap/bootstrap.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$(".login-link").click(function() {
$("#login-link").hide();
$("#login-inline").show(500);
return false;
});
});
</script>
{% block scripts %}{% endblock %}

<!-- Google Analytics -->
<script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','//www.google-analytics.com/analytics.js','ga');

ga('create', 'UA-27498092-1', 'kirsle.net');
ga('require', 'displayfeatures');
ga('send', 'pageview');
</script>

<!-- Piwik -->
<script type="text/javascript">
var _paq = _paq || [];
_paq.push(['trackPageView']);
_paq.push(['enableLinkTracking']);
(function() {
var u=(("https:" == document.location.protocol) ? "https" : "http") + "://www.kirsle.net/piwik/";
_paq.push(['setTrackerUrl', u+'piwik.php']);
_paq.push(['setSiteId', 1]);
var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0]; g.type='text/javascript';
g.defer=true; g.async=true; g.src=u+'piwik.js'; s.parentNode.insertBefore(g,s);
})();
</script>
<noscript><p><img src="http://www.kirsle.net/piwik/piwik.php?idsite=1" style="border:0;" alt="" /></p></noscript>
<!-- End Piwik Code -->

</body>
</html>

+ 4
- 0
www/designs/solar-bootstrap/jquery-2.1.0.min.js
File diff suppressed because it is too large
View File


BIN
www/designs/solar-bootstrap/kirsle.png View File

Before After
Width: 313  |  Height: 177  |  Size: 70 KiB

+ 52
- 0
www/designs/solar-bootstrap/monokai.css View File

@@ -0,0 +1,52 @@
/* Monokai Bright highlight theme, converted from
* http://tmtheme-editor.herokuapp.com/#/theme/Monokai%20Bright
* Using: https://github.com/davinche/pygments-from-tmtheme
*/
.codehilite { background-color: #272822; color: #F8F8F2; }
.codehilite .ge { font-style: italic; }
.codehilite .gs { font-weight: bold; }
.codehilite .c { color: #75715E; }
.codehilite .cp { color: #75715E; }
.codehilite .c1 { color: #75715E; }
.codehilite .cs { color: #75715E; }
.codehilite .cm { color: #75715E; }
.codehilite .m { color: #AE81FF; }
.codehilite .mf { color: #AE81FF; }
.codehilite .mi { color: #AE81FF; }
.codehilite .mo { color: #AE81FF; }
.codehilite .se { color: #AE81FF; }
.codehilite .kc { color: #AE81FF; }
.codehilite .k { color: #66D9EF; font-style: italic; }
.codehilite .kd { color: #66D9EF; font-style: italic; }
.codehilite .kn { color: #F92672; }
.codehilite .kt { color: #66D9EF; font-style: italic; }
.codehilite .s { color: #E6DB74; }
.codehilite .sb { color: #E6DB74; }
.codehilite .sc { color: #E6DB74; }
.codehilite .sd { color: #E6DB74; }
.codehilite .s2 { color: #E6DB74; }
.codehilite .sh { color: #E6DB74; }
.codehilite .si { color: #E6DB74; }
.codehilite .sx { color: #E6DB74; }
.codehilite .sr { color: #E6DB74; }
.codehilite .s1 { color: #E6DB74; }
.codehilite .ss { color: #E6DB74; }
.codehilite .na { color: #A6E22E; }
.codehilite .nc { color: #A6E22E; font-style: italic; text-decoration: underline; }
.codehilite .no { color: #AE81FF; }
.codehilite .nd { color: #A6E22E; text-decoration: underline; }
.codehilite .ne { color: #A6E22E; text-decoration: underline; }
.codehilite .nf { color: #A6E22E; }
.codehilite .nt { color: #F92672; }
.codehilite .nv { color: #F8F8F2; }
.codehilite .ow { color: #F92672; }
.codehilite .o { color: #F92672; }
.codehilite .n { color: #F8F8F2; }
.codehilite .nl { color: #F8F8F2; }
.codehilite .nn { color: #F8F8F2; }
.codehilite .nx { color: #F8F8F2; }
.codehilite .bp { color: #F8F8F2; }
.codehilite .p { color: #F8F8F2; }

/* Kirsle.net overrides */
.codehilite { background-color: transparent }

+ 20
- 0
www/designs/solar-bootstrap/offsite.js View File

@@ -0,0 +1,20 @@
/*
* Hyperlink Editor Script || Copyright 2014 Kirsle
*
* This script makes all offsite links open in a new window.
*/

$(document).ready(function() {
$("a").each(function() {
var $a = $(this);
var href = $a.attr("href");
if (href === undefined) {
return;
}

// Detect offsite links.
if (href.indexOf("http:") == 0 || href.indexOf("https:") == 0) {
$a.attr("target", "_blank");
}
});
});

BIN
www/designs/solar-bootstrap/panelbg.png View File

Before After
Width: 282  |  Height: 282  |  Size: 3.5 KiB

+ 246
- 0
www/designs/solar-bootstrap/print.css View File

@@ -0,0 +1,246 @@
body {
background-color: #FFFFFF;
font-family: Verdana,Arial,Helvetica,sans-serif;
font-size: small;
color: #000000;
margin: 0px;
padding: 0px
}
a:link, a:visited {
color: #0000FF;
text-decoration: underline
}
a:hover, a:active {
color: #0000FF
}
a img {
border: 0px
}
h1,h2,h3,h4 {
font-family: "Trebuchet MS",Arial,Helvetica,sans-serif;
margin: 0px;
padding-top: 10px;
padding-bottom: 10px;
font-weight: bold
}
h1 {
font-size: 32pt;
padding-top: 15px;
padding-bottom: 15px;
}
h1:first-of-type {
padding-top: 0px;
}
h2 {
font-size: 24pt
}
h3 {
font-size: 18pt
}
h4 {
font-size: 16pt
}
pre,code {
font-family: "Lucida Console","DejaVu LGC Sans Mono","DejaVu Sans Mono","Bitstream Vera Sans Mono",monospace;
font-size: 9pt;
color: #000000
}
pre {
display: block;
border: 1px dashed #000000;
padding: 10px;
margin-left: 5px;
margin-right: 5px;
margin-top: 10px;
margin-bottom: 10px;
overflow-x: auto
}
code {
display: inline
}
label {
cursor: pointer
}
legend {
color: #000000;
font-weight: bold
}
table,th,td {
border-color: #999999
}
table.box {
border: 1px solid #999999
}

/* Bootstrap overrides */
.col-md-4.col-md-offset-3 {
/* Left nav, hide it */
display: none;
}
.col-sm-10.col-sm-push-2 {
/* Main body column */
left: 0;
width: 100%;
}

/*******************************************************************************
* General CSS Classes *
******************************************************************************/

.center {
margin: auto;
text-align: center
}
.right {
margin-left: auto;
margin-right: 0px;
text-align: right
}
.invisible {
display: none
}

/*******************************************************************************
* Styles Needed by Specific Pages in the CMS *
******************************************************************************/

/* Downloads */

.distro {
border: 1px solid #CCCCCC
}
.distro th {
width: 150px;
text-align: center;
vertical-align: top
}
.distro td {
width: 150px;
text-align: center;
vertical-align: top;
border: 1px solid #808080
}
.distro td img {
float: left
}

/********
* Blog *
*******/

/* Blog titles when shown on index view */
a.blog-title-index:link, a.blog-title-index:visited {
font-family: "Trebuchet MS",Verdana,Arial,sans-serif;
font-size: 32pt;
font-weight: bold;
color: #FFFFFF;
text-decoration: none
}
a.blog-title-index:hover, a.blog-title-index:active {
text-decoration: underline
}

/* Poster's avatar box */
.blog-author, .comment-author {
float: right;
background-color: #444444;
border: 1px solid #CCCCCC;
padding: 2px;
margin-left: 10px;
margin-bottom: 10px;