Move the current design templates in the "classic" subdir

Let's call this design a "classic" one.

1 files changed, 467 insertions, 0 deletions

diff --git a/templates/classic/styles.css b/templates/classic/styles.css
new file mode 100644
index 0000000..ca7121d
--- /dev/null
+++ b/templates/classic/styles.css
@@ -0,0 +1,467 @@
+/******   GENERAL   ******/
+body {
+   margin: 0px;
+   font-family: "DejaVu Sans", "Bitstream Vera Sans", "Verdana", sans-serif;
+   font-size: 12px;
+   color: #EEEEEC;  
+   background: #43484A;
+}
+
+img {
+   border: 0px;
+}
+
+a:link {
+   color: #C9CED1;
+}
+
+a:visited {
+   color: #C9CED1;
+}
+
+a:hover {
+   color: #A3BED4;
+}
+
+div.master_content {
+   padding-top: 3.4em;
+   padding-bottom: 1.8em;
+}
+
+/******   NAVIGATION   ******/
+div.navigation {
+   position: fixed;
+   top: 0px;
+   overflow: hidden;
+   z-index: 1;
+   background-color: #606466;
+   width: 100%;
+   padding: 0.4em 0em 0.4em 0em;
+   font-size: 110%;
+   border-top: 0.8em solid #43484A;
+   border-bottom: 0.1em dotted #80878A;
+   height: 1.4em;
+   text-align: center;
+   display: block;
+   color: #EEEEEC;
+}
+
+div.navlinks {
+   padding-left: 1.2em;
+   float: left;
+}
+
+div.navexif {
+   color: #AAAAAA;
+}
+
+div.navposition {
+   padding-right: 1.2em;
+   float: right;
+}
+
+.navposnumber {
+   font-weight: bold;
+}
+
+.navposspacer {
+   padding: 1em;
+}
+
+
+/******   FOOTER   ******/
+div.footer {
+   position: fixed;
+   bottom: 0px;
+   overflow: hidden;
+   z-index: 1;
+   text-align: center;
+   background-color: #4F5659;
+   width: 100%;
+   padding: 0.2em;
+   font-size: 90%;
+   font-family: "Trebuchet MS", "DejaVu Sans", "Bitstream Vera Sans", sans-serif;
+   color: #9A9C97;
+   border-top: 0.1em dotted #7C8285;
+   height: 1.5em;
+   display: block;
+}
+
+div.footer a {
+   color: #B1B3AD;
+   text-decoration: none;
+}
+
+div.footer a:hover {
+   color: #C5C7C0;
+   text-decoration: underline;
+}
+
+
+/******   DESCRIPTION   ******/
+div.description {
+   margin: 1.5em 1.25em 3.2em 1.25em;
+   color: #D0D0D0;
+}
+
+div.desc_title {
+   font-size: 175%;
+   font-weight: bold;
+   color: #EEEEEC;
+}
+
+div.desc_text {
+   margin: 0.4em 3em 0em 0.8em;
+   line-height: 140%;
+}
+
+div.desc_go_up {
+   font-size: 80%;
+   margin-bottom: 3em;
+}
+
+div.desc_go_up a {
+   text-decoration: none;
+   border-bottom: 0.1em solid;
+}
+
+div.desc_go_up a:hover {
+   color: #C5C7C0;
+   border-bottom: 0.1em dotted;
+}
+
+
+/******   PREVIEW IMAGE (big)   ******/
+div.img_preview {
+   text-align: center;
+   padding-bottom: 0.75em;
+}
+div.img_preview_full {
+   padding-top: 0.75em;
+}
+
+
+/******   EXIF TABLE   ******/
+div.exif {
+   margin: 2.5em 0 0 1.25em;
+   color: #EEEEEC;
+}
+
+div.exif a {
+/*   color: #B1B3AD;  */
+   text-decoration: none;
+   font-weight: bold;
+   border-bottom: 0.1em solid;
+}
+
+div.exif a:hover {
+   color: #C5C7C0;
+   border-bottom: 0.1em dotted;
+}
+
+div.exif table {
+   padding: 1em 0 0 2.6em;
+   font-size: 80%;
+}
+
+div.exif tr td:first-child {
+   color: #BABDB6;
+   text-align: right;
+   font-weight: normal;
+}
+
+div.exif td {
+   padding-left: 0.2em;
+   font-weight: bold;
+}
+
+div.no_exif {
+   padding: 1em 0 0 2.6em;
+   font-size: 80%;
+}
+
+/******   GENERAL CLASSES   ******/
+div.position_marker {
+   position: relative;
+   top: -4.3em;
+}
+
+/******   ALBUM THUMBNAILS   ******/
+div.album_thumbs {
+   text-align: left;
+   padding: 0 1.7em 0 1.7em;
+   font-size: 90%;
+}
+
+div.album_item {
+   float: left;
+   width: 19.9em;
+   height: 21.4em;
+}
+
+div.album_item a {
+   position: relative;   /*  CSS positioning sucks  */
+   float: left;
+   width: 19em;
+   height: 20.5em;
+   text-align: center;
+   text-decoration: none;
+   border-radius: 0.5em;
+   -moz-border-radius: 0.5em;
+   -webkit-border-radius: 0.5em;
+   background-color: #232729;
+   margin: 1px;     /*  Needs to be changed below in a.album_item:hover */
+   border: 1px solid #6b6c69;  /*  Cannot use em units here otherwise the box will become jumpy  */
+}
+
+
+div.album_item a:hover {
+   background-color: #32332F;
+   margin: 0px;    /*  a.album_item->margin - 1px  */ 
+   border: 2px solid #A3BED4;
+}
+
+div.album_item img.landscape {
+   /* landscape */
+   padding-top: 2.25em;
+}
+
+div.album_item img.portrait {
+   /* portrait */
+   padding-top: 1em;
+}
+
+div.album_item img.squared {
+   /* squared */
+   padding-top: 1em;
+}
+
+.album_thumb_text {
+   /*  CSS positioning sucks^2  */ 
+   position: absolute;
+   bottom: 0.8em;
+   left: 5.7em;
+}
+
+
+/******   ALBUM/INDEX SEPARATORS   ******/
+div.separators {
+   float: left;
+   clear: both;
+   width: 100%;
+   text-align: left;
+   font-variant: small-caps;
+   font-family: "Trebuchet MS", "DejaVu Sans", "Bitstream Vera Sans", sans-serif;
+   color: #C0C0C0;
+}
+
+div.album_list_separator {
+   margin: 2.2em 0 0.65em 0;
+   font-size: 320%;
+   letter-spacing: 0.055em;
+   border-bottom: 0.04em solid #606060;
+}
+
+div.index_separator {
+   margin: 1.9em 0 0.6em 0;
+   font-size: 260%;
+   letter-spacing: 0.035em;
+   border-bottom: 0.05em solid #606060;
+}
+
+
+/******   ALBUM/INDEX INTERSPACES   ******/
+div.interspace {
+   float: left;
+   clear: both;
+   width: 100%;
+   text-align: left;
+   color: #D0D0D0;
+   margin: 0em 3em 0em 0.8em;
+}
+
+div.album_list_interspace {
+   margin: 0.65em 0 0.75em 0;
+   font-size: 125%;
+   line-height: 140%;
+}
+
+div.index_interspace {
+   margin: 0.6em 0 1.1em 0;
+   font-size: 110%;
+   line-height: 140%;
+}
+
+
+/******   FOOTNOTE   ******/
+div.footnote {
+   padding: 1em 1.25em 3.2em 1.25em;
+   color: #D0D0D0;
+   clear: both;
+}
+
+
+/******   INDEX THUMBNAILS   ******/
+div.index_thumbs {
+   text-align: left;
+   padding: 0 1.7em 0 1.7em;
+   font-size: 90%;
+}
+
+div.index_item {
+   float: left;
+   width: 53.5em;
+   height: 20em;
+   margin: 0.7em;
+}   
+
+div.index_item a {
+   position: relative;   /*  CSS positioning sucks  */
+   float: left;
+   width: 53em;
+   height: 19.5em;
+   text-align: left;
+   text-decoration: none;
+   border-radius: 0.5em;
+   -moz-border-radius: 0.5em;
+   -webkit-border-radius: 0.5em;
+   background-color: #232729;
+   margin: 1px;     /*  Needs to be changed below in a.index_item:hover */
+   border: 1px solid #6b6c69;  /*  Cannot use em units here otherwise the box will become jumpy  */
+   color: #BABDB6;
+}
+
+div.index_item a:hover {
+   background-color: #32332F;
+   margin: 0px;    /*  a.index_item->margin - 1px  */ 
+   border: 2px solid #A3BED4;
+   color: #A3BED4;
+}
+
+div.index_item img {
+   position: absolute;
+   left: 1.4em;
+   top: 1.4em;
+}
+
+.album_text_landscape {
+   font-size: 190%;
+   font-weight: bold;
+   position: relative;
+   left: 10.3em;
+/*   padding-right: 10.5em;  disabled --  word wrap  */
+   top: 0.65em;
+}
+
+.album_text_portrait {
+   font-size: 190%;
+   font-weight: bold;
+   position: relative;
+   left: 7.5em;
+/*   padding-right: 7.7em;  disabled --  word wrap  */
+   top: 0.65em;
+}
+
+.album_text_squared {
+   font-size: 190%;
+   font-weight: bold;
+   position: relative;
+   left: 10.3em;
+/*   padding-right: 10.5em;  disabled --  word wrap  */
+   top: 0.65em;
+}
+
+.album_subtext_landscape {
+   font-size: 150%;
+   position: relative;
+   left: 13.1em;
+/*   padding-right: 13.4em;  disabled --  word wrap  */
+   top: 2.5em;
+}
+
+.album_subtext_portrait {
+   font-size: 150%;
+   position: relative;
+   left: 9.5em;
+/*   padding-right: 9.8em;  disabled --  word wrap  */
+   top: 2.5em;
+}
+
+.album_subtext_squared {
+   font-size: 150%;
+   position: relative;
+   left: 13.1em;
+/*   padding-right: 13.4em;  disabled --  word wrap  */
+   top: 2.5em;
+}
+
+.album_note {
+   position: absolute;
+   right: 2.3em;
+   bottom: 1.9em;
+}
+
+.album_protected_note {
+   color: #c8bc00;
+   font-size: 65%;
+}
+
+/******   IMAGE BORDER STYLES   ******/
+img#border_single {
+   background-color: #6b6c69;
+   padding: 1px;
+}
+
+img#border_none {
+   padding: 0px;
+   margin: 0px;
+}
+
+img#frame_black {
+   background-color: #909090;
+   padding: 1px;
+   border: 20px solid black;
+}
+
+img#frame_white {
+   background-color: #444444;
+   padding: 1px;
+   border: 20px solid white;
+}
+
+img#frame_black_horiz {
+   background-color: #A0A0A0;
+   padding: 1px 0px 1px 0px;
+   border-top: 35px solid black;
+   border-bottom: 35px solid black;
+}
+
+img#frame_white_horiz {
+   background-color: #444444;
+   padding: 1px 0px 1px 0px;
+   border-top: 35px solid white;
+   border-bottom: 35px solid white;
+}
+
+img#frame_black_vert {
+   background-color: #A0A0A0;
+   padding: 0px 1px 0px 1px;
+   border-left: 40px solid black;
+   border-right: 40px solid black;
+}
+
+img#frame_white_vert {
+   background-color: #444444;
+   padding: 0px 1px 0px 1px;
+   border-left: 40px solid white;
+   border-right: 40px solid white;
+}
+
+img#border_black {
+   border: 15px solid black;
+}
+
+img#border_white {
+   border: 15px solid white;
+}
+