====== Change history for Themes in Version 2.1 ======
This page lists all changes in the Theme folder inside the Version 2.1. If you update to a new version, so you have to commit all your changes from your previous version to your new version Admidio , otherwise display problems may occur.
The changes shown here always refer to both of our standard themes. Did you make changes here, so you have to take in account these adjustments if necessary. This can, for example, be the case with colors.

===== Version 2.1.0 =====
When updating from version 2.0.9 the following files need to be adjusted in the Theme folder. Changes to version 2.0.9, check out [[aenderungshistorie_fuer_themes|Change History 2.0]]\\ 
(if you did not changes everywhere, you can also just replace the entire folders and e.g only adjust the CSS folder manually)

  * The following files must be //replaced// in the appropriate folders:
**overall_header.php**\\ 
**css/photos.css**\\ 
**icons/smilies**\\ 
**icons/arrow_turn_left.png**\\ 
**icons/arrow_turn_right.png**\\ 
**icons/door_in.png**\\ 
**icons/webclipicon.png**\\ 
**ecard_templates/brief_grosses_foto.tpl**\\ 
**ecard_templates/brief_standard.tpl**\\ 
**ecard_templates/grusskarte.tpl**\\ 

  * The following files must be //deleted// in the appropriate folders:
**images/prevlabel.gif**\\ 
**images/nextlabel.gif**\\ 
**images/admidio_logo_50.png**\\ 
**images/admidio_logo_75.png**\\ 
**images/admidio_logo_100.png**\\ 
**icons/arrow_out.png**\\ 

  * The following files must be //added// in the appropriate folders:
**images/loading_animation.gif**\\ 
**css/thickbox.css**\\ 
**icons/arrow_up.png**\\ 
**icons/arrow_down.png**\\ 
**icons/backup.png**\\ 
**icons/backup_big.png**\\ 
**icons/calendar_time.png**\\ 
**icons/close.png**\\ 
**icons/database_save.png**\\ 
**icons/disk_copy.png**\\ 
**icons/email_role.png**\\ 
**icons/info.png**\\ 
**icons/list_global.png**\\ 
**icons/page_white_film.png**\\ 
**icons/page_white_music.png**\\ 
**icons/page_white_openoffice.png**\\ 
**icons/star.png**\\ 
**icons/system_mail.png**\\ 
**icons/update_link.png**\\ 


== The block in css/system.css ==
<code css>img {
    border:       0px;
}</code>
replace with <code css>img {
    border-width:       0px;
}</code>

== The block in css/system.css ==
<code css>.readonly {
    color:              #666666;
}

/* Elements that can be touched for a drag and drop */
.dragable {
    cursor:             move;
    border-width:       0px;
}</code>
replace with <code css>*[readonly] {
    background-color:   #e5e5e5;
    border-width:       thin;
}</code>

== The block in css/system.css ==
<code css>button img {
     vertical-align:    middle;
     border-width:      none;
}</code>
replace with
<code css>button img {
     vertical-align:    middle;
     border-width:      0px;
}</code>

== The block in css/system.css ==
<code css>.boxHeadLeft img {
    margin-right:       5px;
    vertical-align:     bottom;
    border-width:       none;
}</code>
replace with
<code css>.boxHeadLeft img {
    margin-right:       5px;
    vertical-align:     bottom;
    border-width:       0px;
}</code>

== The block in css/system.css ==
<code css>#ajax_tooltipObj h3 {
    color:              #333333;
    padding-top:        0px;
}</code>
replace with
<code css>#ajax_tooltipObj h3 {
    color:              #333333;
    padding-top:        10px;
}</code>

== The block in css/system.css ==
<code css>#profile_former_roles_box ul li dl dd {
    margin-left:        55%;
    text-align:         right;
}</code>
replace with
<code css>#profile_former_roles_box ul li dl dd {
    margin-left:        50%;
    text-align:         right;
}</code>

== The block in css/system.css ==
<code css>#infoboxListsBox {
    width:              400px; 
}</code>
replace with
<code css>#infoboxListsBox {
    width:              500px;
    margin-top:         25px;
}</code>

== Add to block in css/system.css ==
<code css>h3 {
    font-size:          12pt;
    color:              #333333;
    padding:            15px 0px 7px 0px;
}

p {
    padding-bottom:     10px;
    padding-top:        10px;
    margin:             0px;
}

.imageFrame {
	border: 			1px solid #dddddd; 
	padding: 			3px;
}

#textTooltip{
	position:           absolute;
    border:             1px solid #333333;
    text-align:         left;
    color:              #333333;
    width:              auto;
    min-width:          10px;
    max-width:          450px;
    height:             auto;
    min-height:         15px;
    background-color:   #fdf594;
    padding:            5px;
    z-index:            1000001;
	display:            none;
}

/*Special adjustment for Thickbox help*/
#message_window .formBody ul {
    padding-left:       20px;
}

/* Definition list of system information file*/

.systeminfoGood{
    color: #06a600;
}
.systeminfoBad{
    color: #e5000d;
}</code>
\\ 
== Adjustments for the Modern Theme ==
The following adjustments you just have to perform if you use a theme based on the Modern Theme:
== The block in css/modern.css ==
<code css>
#page_header {
    text-align: left;
    margin: 0 auto;
    width: 955px;
}
</code>
replace with
<code css>
#page_header {
    background-image: url(../images/title.png);
    text-align: left;
    margin: 0 auto;
    width: 960px;
    height: 180px;
}

#page_header h1 {
    color: #dbebee;
    top: 112px;
    position: absolute;
    margin-left: 372px;
    padding: 0px;
    font-size: 24pt;
    font-weight: bold;
}
</code>

== The block in css/modern.css ==
<code css>/* special hack, so that the block is in IE6 positioned right next to the other */
html.* #right_block div { 
    margin-left: 622px;
    width: 268px;
}</code>
replace with
<code css>/* special hack, so that the block is in IE6 positioned right next to the other */
html.* #right_block{ 
    width: 300px;
}</code>

== The block in css/modern.css ==
<code css>#content, #content_left {
    padding-left: 13px;
    padding-right: 12px;
    min-height: 450px;
    min-width: 574px;
}</code>
replace with
<code css>#content, #content_left {
    padding-left: 13px;
    padding-right: 12px;
    min-height: 450px;
    width: 574px;
}</code>

== Delete block in css/modern.css ==
<code css>#orga_name {
    color: #dbebee;
    top: 108px;
    position: absolute;
    margin-left: 372px;
    padding: 0px;
    font-size: 24pt;
    font-weight: bold;
}</code>

== Delete block in css/modern.css ==
<code css>p {
    padding-bottom: 10px;
    padding-top: 10px;
    margin: 0px;
}</code>

== Add block in css/modern.css ==
<code css>
#top_border_img_big{
    background-image: url(../images/border_top_big.png);
    height: 26px;
    width: 601px;
}

#bottom_border_img_big{
    background-image: url(../images/border_bottom_big.png);
    height: 26px;
    width: 601px;
}

#top_border_img_small{
    background-image: url(../images/border_top_small.png);
    height: 26px;
    width: 300px;
}

#bottom_border_img_small{
    background-image: url(../images/border_bottom_small.png);
    height: 26px;
    width: 300px;
}</code>

== The block in my_body_top.php ==
<code php>	<img src="<?php echo THEME_PATH; ?>/images/title.png" alt="Admidio - The Online-Membership Management" />
	<div id ="orga_name"><?php echo $g_current_organization->getValue("org_longname"); ?></div></code>
replace with
<code php>	<h1><?php echo $g_current_organization->getValue("org_longname"); ?></h1></code>

== The block in my_body_top.php ==
<code php>    <div><img class="img_border" src="<?php echo THEME_PATH; ?>/images/border_top_big.png" alt="border" /></div>
</code>
replace with
<code php>    <div id="top_border_img_big"></div></code>

== The block in my_body_bottom.php ==
<code php>        <div><img class="img_border" src="<?php echo THEME_PATH; ?>/images/border_bottom_big.png" alt="border" /></div>
</code>
replace with
<code php>        <div id="bottom_border_img_big"></div></code>

== The block in my_body_bottom.php ==
<code php>        <div><img class="img_border" src="<?php echo THEME_PATH; ?>/images/border_top_small.png" alt="border" /></div>
</code>
replace with
<code php>        <div id="top_border_img_small"></div></code>

== The block in my_body_bottom.php ==
<code php>                if($g_current_user->assignRoles())
                {
                    echo '<span class="menu"><a href="'. $g_root_path. '/adm_program/administration/roles/roles.php"><img
                    style="vertical-align: middle;" src="'. THEME_PATH. '/icons/roles.png" alt="Role Management" title="Role Management" /></a>
                    <a href="'. $g_root_path. '/adm_program/administration/roles/roles.php">Role Management</a></span>';
                }</code>
replace with
<code php>                if($g_current_user->assignRoles())
                {
                    echo '<span class="menu"><a href="'. $g_root_path. '/adm_program/administration/roles/roles.php"><img
                    style="vertical-align: middle;" src="'. THEME_PATH. '/icons/roles.png" alt="Role Management" title="Role Management" /></a>
                    <a href="'. $g_root_path. '/adm_program/administration/roles/roles.php">Role Management</a></span>';
                }
				if($g_current_user->isWebmaster())
                {
                    echo '<span class="menu"><a href="'. $g_root_path. '/adm_program/administration/backup/backup.php"><img
                    style="vertical-align: middle;" src="'. THEME_PATH. '/icons/backup.png" alt="Database Backup" title="Database Backup" /></a>
                    <a href="'. $g_root_path. '/adm_program/administration/backup/backup.php">Database Backup</a></span>';
                }</code>

== The block in my_body_bottom.php ==
<code php>        <div><img class="img_border" src="<?php echo THEME_PATH; ?>/images/border_bottom_small.png" alt="border" /></div>
</code>
replace with
<code php>        <div id="bottom_border_img_small"></div></code>

===== Version 2.1.2 =====

== Adjustment for Modern-Theme ==
The following adjustments you just have to perform if you use a theme based on the Modern Theme:
== The block (ca. line 106) in my_body_bottom.php ==
<code php>                if($g_current_user->approveUsers())</code>
replace with
<code php>                if($g_current_user->approveUsers() && $g_preferences['registration_mode'] > 0)</code>

== The block in css/modern.css ==
<code css>#sidebar hr {
    margin-top:     10px;
    color:          #d7d7d7;
    border-width:   1px;
    border-style:   dashed;
    text-align:     left;
}</code>
replace with
<code css>#sidebar hr {
    margin: 5px 0px 5px 0px;
    border: 1px dashed #d7d7d7;
    text-align: left;
}</code>

===== Version 2.1.4 =====

The adjustments for this version you only have to make when you update within the 2.1. Was your version before 2.1.4 have a 2.0.x, so you need not make these adjustments!

  * The following file must be //replaced// in the theme folders:
**overall_header.php**\\ 

== The block in css/modern.css ==
The following adjustments you just have to perform if you use a theme based on the Modern Theme.
<code css>/* special hack, so that the block is in IE6 positioned right next to the other */
html.* #right_block{ 
    width: 268px;
}</code>
replace with
<code css>/* special hack, so that the block is in IE6 positioned right next to the other */
html.* #right_block{ 
    width: 300px;
}</code>

===== Version 2.1.6 =====


The adjustments for this version you only have to make when you update within the 2.1. Was your version before 2.1.4 have a 2.0.x, so you need not make these adjustments!

  * Have you made any adjustments to the CSS file of the photo model, the following file in your theme folder can be easily replaced:
**css/photos.css**\\ 

Have you carried out adjustments in this file, so you need to adjust accordingly the following blocks in the file, if your theme is build on the **Modern**-Theme :

== The block in css/photos.css ==
<code css>/*Distance of Thumbnails with their Icons to other elements*/
.photoThumbnailElement{
    padding: 5px;
    margin-top: 5px;
    margin-bottom: 5px;
    margin-right: 0px;
    margin-left: 0px;
    width: 120px;
}</code>
replace with
<code css>/*Distance of Thumbnails with their Icons to other elements*/
.photoThumbnailElement{
    padding: 5px;
    margin-top: 5px;
    margin-bottom: 5px;
    margin-right: 0px;
    margin-left: 0px;
}</code>

== The block in css/photos.css ==
<code css>/*Other details are the definition*/
.photoAlbumList dd{
	margin-left: 170px;
	margin-bottom: 5px;
	height: 110px;
	padding: 0px;
}</code>
replace with
<code css>/*Other details are the definition*/
.photoAlbumList dd {
	margin-bottom: 5px;
	padding-left: 40px;
}</code>
\\ 
The following blocks you have to adjust if your theme is basedon the **Classic**-Theme:

== The block in css/photos.css ==
<code css>/*The photo albums are displayed in a definition list*/
.photoAlbumList {
	width: 570px;
    list-style-type: none;
}</code>
replace with
<code css>/*The photo albums are displayed in a definition list*/
.photoAlbumList {
	width: 570px;
    list-style-type: none;
    text-align: center;
}</code>

== The block in css/photos.css ==
<code css>/*thereby forming a thumbnail to Term*/
.photoAlbumList dt{
	width: 160px;
	text-align: right;
	margin-bottom: 5px;
	float: left;
	padding: 0px;
}</code>
replace with
<code css>/*thereby forming a thumbnail to Term*/
.photoAlbumList dt {
	text-align: right;
	margin-bottom: 5px;
	float: left;
	width: 50%;
	padding-right: 20px;
}</code>

== The block in css/photos.css ==
<code css>/*Other details are the definition*/
.photoAlbumList dd{
	margin-left: 170px;
	margin-bottom: 5px;
	height: 110px;
	padding: 0px;
	text-align: left;
}</code>
replace with
<code css>/*Other details are the definition*/
.photoAlbumList dd {
	margin-bottom: 5px;
	text-align: left;
}</code>