use a simple template system to allow theming (fixes #32)
commit 502c8903b4c7eb09d36c4fedb86deec8689fe7c6 Author: Jan Dittberner <jan@dittberner.info> Date: Sat Jul 11 00:20:03 2009 +0200 * extract html part of index.php into the first default theme commit cddcc777bba2efecdcad0f3b130e7e5e6b1e2a73 Author: Jan Dittberner <jan@dittberner.info> Date: Fri Jul 10 23:38:32 2009 +0200 * add a template class
This commit is contained in:
parent
0cdd30bb05
commit
0ed421b1ce
5 changed files with 155 additions and 72 deletions
102
themes/default_horizontal/css/format.css
Normal file
102
themes/default_horizontal/css/format.css
Normal file
|
|
@ -0,0 +1,102 @@
|
|||
/*
|
||||
* Copyright (c) 2008 Jan Dittberner <jan@dittberner.info>
|
||||
* Jan Dittberner IT-Consulting & -Solutions
|
||||
* Cottbuser Str. 1, D-01129 Dresden
|
||||
*
|
||||
* Copyright (c) 2008 Jeremias Arnstadt <douth024@googlemail.com>
|
||||
*
|
||||
* This file is part of the ScrollingJQueryGallery component of the
|
||||
* gnuviech-server.de Websitetools
|
||||
*
|
||||
* ScrollingJQueryGallery is free software: you can redistribute it
|
||||
* and/or modify it under the terms of the GNU General Public License as
|
||||
* published by the Free Software Foundation, either version 3 of the
|
||||
* License, or (at your option) any later version.
|
||||
*
|
||||
* ScrollingJQueryGallery is distributed in the hope that it will be
|
||||
* useful, but WITHOUT ANY WARRANTY; without even the implied warranty of
|
||||
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU
|
||||
* General Public License for more details.
|
||||
*
|
||||
* You should have received a copy of the GNU General Public License
|
||||
* along with ScrollingJQueryGallery. If not, see
|
||||
* <http://www.gnu.org/licenses/>.
|
||||
*
|
||||
* Version: $Id$
|
||||
*/
|
||||
#arrleft {
|
||||
position:absolute;
|
||||
top:0px;
|
||||
left:0px;
|
||||
}
|
||||
#arrright {
|
||||
position:absolute;
|
||||
top:0px;
|
||||
left:464px;
|
||||
}
|
||||
#imgscroller {
|
||||
position:absolute;
|
||||
top:0px;
|
||||
left:10px;
|
||||
width:464px;
|
||||
height:65px;
|
||||
overflow:hidden;
|
||||
}
|
||||
#scrollable {
|
||||
position:absolute;
|
||||
top:0px;
|
||||
left:0px;
|
||||
height:65px;
|
||||
}
|
||||
div.thumbnail {
|
||||
margin-left:3px;
|
||||
float:left;
|
||||
}
|
||||
|
||||
a.lightbox img {
|
||||
border:0;
|
||||
}
|
||||
|
||||
.bildposition {
|
||||
margin: middle;
|
||||
position:relative;
|
||||
top:3px;
|
||||
bottom:auto;
|
||||
|
||||
}
|
||||
#imagedescription {
|
||||
position:relative;
|
||||
weight: 330px;
|
||||
height: 25px;
|
||||
top: 300px;
|
||||
left: 0px;
|
||||
color: #ffffff;
|
||||
font-size:10px;
|
||||
font-style:normal;
|
||||
font-weight:normal;
|
||||
text-align:center;
|
||||
vertical-align:center;
|
||||
|
||||
}
|
||||
.imgdescription {
|
||||
color: #ffffff;
|
||||
position: absolute;
|
||||
font-size:10px;
|
||||
font-style:normal;
|
||||
font-weight:normal;
|
||||
text-align:center;
|
||||
}
|
||||
.sub_menu {
|
||||
color:#FFFFFF;
|
||||
font-size:10px;
|
||||
font-weight:normal;
|
||||
margin-left:2px;
|
||||
margin-bottom:2px;
|
||||
}
|
||||
.sub_menu_colored {
|
||||
color:#FF6600;
|
||||
font-size:10px;
|
||||
font-weight:normal;
|
||||
margin-left:2px;
|
||||
margin-bottom:2px;
|
||||
}
|
||||
297
themes/default_horizontal/css/main.css
Normal file
297
themes/default_horizontal/css/main.css
Normal file
|
|
@ -0,0 +1,297 @@
|
|||
/*
|
||||
* Copyright (c) 2008 Jan Dittberner <jan@dittberner.info>
|
||||
* Jan Dittberner IT-Consulting & -Solutions
|
||||
* Cottbuser Str. 1, D-01129 Dresden
|
||||
*
|
||||
* Copyright (c) 2008 Jeremias Arnstadt <douth024@googlemail.com>
|
||||
*
|
||||
* This file is part of the ScrollingJQueryGallery component of the
|
||||
* gnuviech-server.de Websitetools
|
||||
*
|
||||
* ScrollingJQueryGallery is free software: you can redistribute it
|
||||
* and/or modify it under the terms of the GNU General Public License as
|
||||
* published by the Free Software Foundation, either version 3 of the
|
||||
* License, or (at your option) any later version.
|
||||
*
|
||||
* ScrollingJQueryGallery is distributed in the hope that it will be
|
||||
* useful, but WITHOUT ANY WARRANTY; without even the implied warranty of
|
||||
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU
|
||||
* General Public License for more details.
|
||||
*
|
||||
* You should have received a copy of the GNU General Public License
|
||||
* along with ScrollingJQueryGallery. If not, see
|
||||
* <http://www.gnu.org/licenses/>.
|
||||
*
|
||||
* Version: $Id$
|
||||
*/
|
||||
@charset "UTF-8";
|
||||
|
||||
body {
|
||||
font-family:Verdana;
|
||||
font-size:12px;
|
||||
font-weight:bold;
|
||||
text-decoration:none;
|
||||
background-color:#660000;
|
||||
color:#000000;
|
||||
line-height:1,5;
|
||||
margin:0px;
|
||||
padding:0px;
|
||||
onload:initScrollLayer();
|
||||
margin-bottom: auto;
|
||||
margin-top: auto;
|
||||
}
|
||||
|
||||
td {
|
||||
font-family:Verdana,Arial,Helvetica;
|
||||
font-size:12px;
|
||||
font-weight:bold;
|
||||
color:#000000;
|
||||
}
|
||||
|
||||
a:link {
|
||||
font-family:Verdana,Arial,Helvetica;
|
||||
font-size:10px;
|
||||
font-weight:normal;
|
||||
text-decoration:none;
|
||||
color:#FFFFFF;
|
||||
margin-left: 1px;
|
||||
}
|
||||
a:visited {
|
||||
font-family:Verdana,Arial,Helvetica;
|
||||
font-size:10px;
|
||||
font-weight:normal;
|
||||
text-decoration:none;
|
||||
color:#FFFFFF;
|
||||
margin-left: 1px;
|
||||
}
|
||||
a:active {
|
||||
font-family:Verdana,Arial,Helvetica;
|
||||
font-size:10px;
|
||||
font-weight:normal;
|
||||
text-decoration:none;
|
||||
color:#FF6600;
|
||||
margin-left: 1px;
|
||||
}
|
||||
#left {
|
||||
position:absolute;
|
||||
width:202px;
|
||||
height:100%;
|
||||
background-color:#333333;
|
||||
left: 0px;
|
||||
top: 0px;
|
||||
}
|
||||
|
||||
#right {
|
||||
position:absolute;
|
||||
width:202px;
|
||||
height:100%;
|
||||
background-color:#333333;
|
||||
left: 808px;
|
||||
top: 0px;
|
||||
}
|
||||
|
||||
#content {
|
||||
position:absolute;
|
||||
width:616px;
|
||||
height:100%;
|
||||
background-color:#660000;
|
||||
top: 0px;
|
||||
left: 50%;
|
||||
margin-top: 0px;
|
||||
margin-left: -308px;
|
||||
border-left: 3px #454648 solid;
|
||||
border-right: 3px #454648 solid;
|
||||
}
|
||||
|
||||
#content_container {
|
||||
position:absolute;
|
||||
width:490px;
|
||||
height:492px;
|
||||
background-color:#3D0000;
|
||||
border:3px;
|
||||
border-style:solid;
|
||||
border-color:#454648;
|
||||
left: 63px;
|
||||
top: 57px;
|
||||
}
|
||||
|
||||
#invisible {
|
||||
position:absolute;
|
||||
width:490px;
|
||||
height:492px;
|
||||
left: 0px;
|
||||
top: 0px;
|
||||
z-index:1;
|
||||
}
|
||||
|
||||
|
||||
#content_container_s {
|
||||
position:absolute;
|
||||
width:490px;
|
||||
height:492px;
|
||||
border:0px;
|
||||
border-style:solid;
|
||||
border-color:#454648;
|
||||
left: 63px;
|
||||
top: 57px;
|
||||
}
|
||||
|
||||
#menu {
|
||||
list-style:none;
|
||||
display:inline;
|
||||
position:absolute;
|
||||
width:330px;
|
||||
height:14px;
|
||||
left: 143.5px;
|
||||
top: 553px;
|
||||
margin-top:2px;
|
||||
z-index:10;
|
||||
padding:0;
|
||||
}
|
||||
|
||||
#sub_menu {
|
||||
position:absolute;
|
||||
width:490px;
|
||||
height:14px;
|
||||
left: 0px;
|
||||
top: 450px;
|
||||
margin-top:2px;
|
||||
text-align:center;
|
||||
z-index:1;
|
||||
font-family:Verdana;
|
||||
font-size:12px;
|
||||
font-weight:normal;
|
||||
text-decoration:none;
|
||||
}
|
||||
|
||||
#sub_menu_produkte {
|
||||
position:absolute;
|
||||
width:490px;
|
||||
height:19px;
|
||||
background-color:#000000;
|
||||
font-family:Verdana;
|
||||
font-size:12px;
|
||||
font-weight:normal;
|
||||
text-decoration:none;
|
||||
color:#FFFFFF;
|
||||
left:0px;
|
||||
top:425px;
|
||||
margin-top:2px;
|
||||
text-align:center;
|
||||
z-index:2;
|
||||
}
|
||||
|
||||
#slider {
|
||||
position:absolute;
|
||||
width:474px;
|
||||
height:65px;
|
||||
background-color:#333333;
|
||||
left: 8px;
|
||||
top: 8px;
|
||||
padding:0px;
|
||||
}
|
||||
|
||||
#slider_2 {
|
||||
position:absolute;
|
||||
width:474px;
|
||||
height:67px;
|
||||
left: 0px;
|
||||
top: 0px;
|
||||
}
|
||||
|
||||
|
||||
#content_sub {
|
||||
position:absolute;
|
||||
width:330px;
|
||||
height:330px;
|
||||
left: 143px;
|
||||
top: 149px;
|
||||
}
|
||||
|
||||
#content_nav {
|
||||
position:absolute;
|
||||
width:20px;
|
||||
height:10px;
|
||||
left: 298px;
|
||||
top: 305.5px;
|
||||
z-index:1;
|
||||
}
|
||||
|
||||
#content_main {
|
||||
position:absolute;
|
||||
width:311px;
|
||||
height:311px;
|
||||
top: 9.5px;
|
||||
left: 9.5px;
|
||||
text-align:center;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
#content_main_s {
|
||||
position:absolute;
|
||||
width:311px;
|
||||
height:311px;
|
||||
top: 9.5px;
|
||||
left: 9.5px;
|
||||
text-align:center;
|
||||
background-image: url(../content/portraet/bilder/port_back.jpg);
|
||||
}
|
||||
|
||||
#content_main_in {
|
||||
border:0px;
|
||||
margin-left:3px;
|
||||
margin-top:3px;
|
||||
}
|
||||
|
||||
|
||||
|
||||
//////////////Menu///////////////////
|
||||
|
||||
|
||||
a.menu {
|
||||
display:block;
|
||||
text-align:center;
|
||||
width:16ex;
|
||||
padding:2px;
|
||||
text-decoration:none;
|
||||
}
|
||||
|
||||
a.menu:link {
|
||||
color:#ffffff;
|
||||
background-color:#3d0000;
|
||||
padding-left:4px;
|
||||
padding-right:4px;
|
||||
padding-top:2px;
|
||||
padding-bottom:2px;
|
||||
}
|
||||
|
||||
a.menu:visited {
|
||||
color:#ffffff;
|
||||
background-color:#3d0000;
|
||||
padding-left:4px;
|
||||
padding-right:4px;
|
||||
padding-top:2px;
|
||||
padding-bottom:2px;
|
||||
}
|
||||
|
||||
a.menu:hover {
|
||||
color:#ffffff;
|
||||
background-color:#454648;
|
||||
padding-left:4px;
|
||||
padding-right:4px;
|
||||
padding-top:2px;
|
||||
padding-bottom:2px;
|
||||
}
|
||||
|
||||
a.menu:active {
|
||||
color:#ffffff;
|
||||
background-color:#454648;
|
||||
padding-left:4px;
|
||||
padding-right:4px;
|
||||
padding-top:2px;
|
||||
padding-bottom:2px;
|
||||
}
|
||||
////////////////////////////////////
|
||||
|
||||
|
||||
|
||||
60
themes/default_horizontal/theme.php
Normal file
60
themes/default_horizontal/theme.php
Normal file
|
|
@ -0,0 +1,60 @@
|
|||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
|
||||
"http://www.w3.org/TR/xhtml1/strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="<?php echo $content['lang'] ; ?>">
|
||||
<head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
|
||||
<title><?php echo $content['title']; ?></title>
|
||||
<style type="text/css">
|
||||
<?php print($content['inlinestyle']); ?>
|
||||
</style>
|
||||
<?php foreach ($content['styles'] as $style) { ?>
|
||||
<link rel="stylesheet" type="text/css" href="<?php echo $style; ?>" />
|
||||
<?php } ?>
|
||||
<link rel="stylesheet" type="text/css" href="<?php echo $content['themepath']; ?>/css/main.css" />
|
||||
<link rel="stylesheet" type="text/css" href="<?php echo $content['themepath']; ?>/css/format.css" />
|
||||
<?php foreach ($content['scripts'] as $script) { ?>
|
||||
<script type="text/javascript" src="<?php echo $script; ?>"></script>
|
||||
<?php } ?>
|
||||
</head>
|
||||
<body>
|
||||
<div id="container">
|
||||
<div id="content">
|
||||
<ul id="menu"><?php
|
||||
foreach ($content['gallerylinks'] as $data) {
|
||||
printf('<li class="menu%s"><a class="menu" href="%s">%s </a></li>',
|
||||
($data['gallery'] == $gallery) ? ' active' : '',
|
||||
$data['url'], $data['label']);
|
||||
} ?></ul>
|
||||
<div id="content_container">
|
||||
<div id="slider">
|
||||
<div id="arrleft"><img src="css/grafiken/aro-lft.png" alt="nach links" width="10" height="65" /></div>
|
||||
<div id="imgscroller"><div id="scrollable"><?php
|
||||
// show Thumnails an
|
||||
foreach ($content['thumbnails'] as $thumbdata) {
|
||||
?><div class="thumbnail"><img src="<?php echo $thumbdata['src']; ?>" alt="<?php echo $thumbdata['alt']; ?>" <?php echo $thumbdata['sizes']; ?> /></div><?php
|
||||
} ?></div></div>
|
||||
<div id="arrright"><img src="css/grafiken/aro-rt.png" alt="nach rechts" width="10" height="65" /></div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="content_sub">
|
||||
<div id="content_main">
|
||||
<div class="bildposition"><?php
|
||||
// bindet die Bilder in den Hauptbereich ein
|
||||
$data = $content['firstpreview'];
|
||||
printf('<a class="lightbox" title="%s" href="%s" rel="lightbox">' .
|
||||
'<img id="contentimg" src="%s" alt="%s" %s /></a>',
|
||||
$data['title'], $data['full'], $data['src'], $data['alt'],
|
||||
$data['sizes']);
|
||||
?></div>
|
||||
</div>
|
||||
<div id="content_nav">
|
||||
<img id="backbtn" src="css/grafiken/back.png" alt="back" class="back" width="10" height="10" /><img id="fwdbtn" src="css/grafiken/next.png" alt="next" class="next" width="10" height="10" />
|
||||
</div>
|
||||
<div class="imgdescription" id="imagedescription"><?php
|
||||
echo $content['firstdescription'];
|
||||
?></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
Reference in a new issue