Ausrichtung Hintergrundbild für die viewtopic-Ansicht

Alles zu Styles, Templates, Icons und Smilies für phpBB 3.0.x, sowie allgemeine Designfragen zur Integration von phpBB in bestehende Websites.
phpBB Styles Demo
Forumsregeln
Bei Style spezifischen Fragen ist der Stylename und die Downloadquelle des Styles erforderlich, besser noch die URL vom betroffenen Forum.
Antworten
DocSommer
Mitglied
Beiträge: 203
Registriert: 18.02.2009 18:47
Kontaktdaten:

Ausrichtung Hintergrundbild für die viewtopic-Ansicht

Beitrag von DocSommer »

Hi Leute,

ich nutze ein Style auf prosilver-Basis und möchte in den Beiträgen ein dezentes Hintergrundbild einbetten, wofür ich die colours.css wie folgt bearbeitet habe:

Code: Alles auswählen

.bg1        { background-color: #F1F2F2; 
background-image: url("{T_THEME_PATH}/images/test.jpg");
background-repeat: no-repeat;
background-position: right center;
}
.bg2        { background-color: #E8E9EB; 
background-image: url("{T_THEME_PATH}/images/test.jpg");
background-repeat: no-repeat;
background-position: right center;
}
Prinzipiell funktiert das, jedoch verändert sich damit auch die Position des Online-Logo, siehe:

[ externes Bild ]

(Klicken zum Vergrößern)

Ich bin leider nicht sehr versiert und kann nicht sagen, ob das zwangsläufig nicht so funktionieren kann, oder ob das mit den Codeänderungen zusammen hängt, die ich gemacht habe, um die Userspalte nach links zu verlagern :oops:

Meine viewtopic_body gestaltet sich wie folgt:

Code: Alles auswählen

/*     
--------------------------------------------------------------
Colours and backgrounds for common.css
-------------------------------------------------------------- */

html, body {
        color: #48494D;
        background-color: #B2B2B2;
}

h1 {
   color: #FFFFFF;
}

h2 {
        color: #323335;
}

h3 {
   border-bottom-color: #CCCCCC;
        color: #4C525D;
}

hr {
   border-color: #FFFFFF;
   border-top-color: #CCCCCC;
}

hr.dashed {
   border-top-color: #CCCCCC;
}

/* Search box
--------------------------------------------- */

#search-box {
   color: #FFFFFF;
}

#search-box #keywords {
   background-color: #FFF;
}

#search-box input {
        border-color: #4D5963;
}

/* Round cornered boxes and backgrounds
---------------------------------------- */
.headerbar {
        background-color: #393939;
      background-image: url("{T_THEME_PATH}/images/bannerheader.jpg");
        color: #A5A5A5;
}

.navbar {
        background-color: #E8E8E8;
        opacity: 0.8;
}

.forabg {
        background-color: #5D5F62;
   background-image: url("{T_THEME_PATH}/images/bg_list.gif");
}

.forumbg {
        background-color: #5D5F62;
   background-image: url("{T_THEME_PATH}/images/bg_header.gif");
}

.panel {
        background-color: #EFF0F0;
        color: #323335;
}

.post:target .content {
   color: #000000;
}

.post:target h3 a {
   color: #000000;
}

.bg1        { background-color: #F1F2F2; }
.bg2        { background-color: #E8E9EB; }
.bg3        { background-color: #D9DADC; }

/* -------------------------
   calendar mod additions... 
   ------------------------- */
   
/* uses border-top-color = .bg3 background-color
(the line between events in the month display) */
hr.hrCal { 
   border-top-color: #cadceb;
}

/* uses color from h1
   (calendar header previous and next links) */
.calH1 {
   color: #FFFFFF;
   font-weight: bold;
   font-size:200%
}

/* The from and to times take up a lot of 
  space in the calendar display.
  Use this to shrink them */
.smCalText{font-size:85%}

/* bg4 is just slightly darker then bg3 
  (used in calendar headers) */
.bg4   { 
   background-color: #300000;
   font-weight: bold;
}

/* uses background-color of .bg3
    (used to display the numbers and icons for 
    each day in the month and week view displays ) */
table tbody td.bg3_calMonH{ 
   background-color: #CCCCCC;
   font-weight: bold;
   font-size:85%
}

/* uses background-color of .bg4
    (used to display the numbers and icons for 
    each day in the month and week view displays ) */
table tbody td.bg4_calMonH{ 
   background-color: #BB7777;
   font-weight: bold;
   font-size:85%
}

/* uses background-color of .bg1
   (used to display days in calendar month/week view) */ 
table.table1 tbody td.bg1_calMon {
   background-color: #ECECEC;
   color: #333333;
   padding-top: 2px;
   padding-bottom: 5px;
   padding-left: 4px;
   padding-right: 4px;
}
/* uses background-color of .bg2
   (used to display days in calendar month/week view) */ 
table.table1 tbody td.bg2_calMon {
   background-color: #DDDDDD;
   padding-top: 2px;
   padding-bottom: 5px;
   padding-left: 4px;
   padding-right: 4px;
}
/* uses background-color of .bg3
   (used to display days in calendar month/week view) */ 
table.table1 tbody td.bg3_calMon {
   background-color: #222222;
   padding-top: 2px;
   padding-bottom: 5px;
   padding-left: 4px;
   padding-right: 4px;
}


/* uses background-color of .bg1
   uses border-top-color = .forumbg background-color
   (used to display events in calendar day view) */ 
table.table1 tbody td.bg1_calDay {
   background-color: #ECF3F7;
   border-top-color: #12A3EB;
   padding-top: 10px;
   padding-bottom: 10px;
   padding-left: 3px;
   padding-right: 3px;
}

/* uses background-color of .bg3
   uses border-top-color = .forumbg background-color
   (used to display negative space in calendar day view) */ 
table.table1 tbody td.bg3_calDay {
   background-color: #cadceb;
   border-top-color: #12A3EB;
}

/* -------------------------
   calendar mod end
   ------------------------- */



.ucprowbg {
        background-color: #DFDFDF;
}

.fieldsbg {
        background-color: #E8E8E9;
}

span.corners-top {
   background-image: url("{T_THEME_PATH}/images/corners_left.png");
}

span.corners-top span {
   background-image: url("{T_THEME_PATH}/images/corners_right.png");
}

span.corners-bottom {
   background-image: url("{T_THEME_PATH}/images/corners_left.png");
}

span.corners-bottom span {
   background-image: url("{T_THEME_PATH}/images/corners_right.png");
}

/* Horizontal lists
----------------------------------------*/

ul.navlinks {
   border-bottom-color: #FFFFFF;
}

/* Table styles
----------------------------------------*/
table.table1 thead th {
   color: #FFFFFF;
}

table.table1 tbody tr {
        border-color: #C3C3CB;
}

table.table1 tbody tr:hover, table.table1 tbody tr.hover {
        background-color: #E0E2E5;
   color: #000;
}

table.table1 td {
        color: #68696D;
}

table.table1 tbody td {
   border-top-color: #FAFAFA;
}

table.table1 tbody th {
   border-bottom-color: #000000;
   color: #333333;
   background-color: #FFFFFF;
}

table.info tbody th {
   color: #000000;
}

/* Misc layout styles
---------------------------------------- */
dl.details dt {
   color: #000000;
}

dl.details dd {
        color: #68696D;
}

.sep {
        color: #697681;
}

/* Pagination
---------------------------------------- */

.pagination span strong {
   color: #FFFFFF;
        background-color: #7B828A;
        border-color: #7B828A;
}

.pagination span a, .pagination span a:link, .pagination span a:visited, .pagination span a:active {
        color: #717377;
        background-color: #EDEDED;
        border-color: #B9BABB;
}

.pagination span a:hover {
        border-color: #7B828D;
        background-color: #7B828D;
   color: #FFF;
}

/* Pagination in viewforum for multipage topics */
.row .pagination {
   background-image: url("{T_THEME_PATH}/images/icon_pages.gif");
}

.row .pagination span a, li.pagination span a {
   background-color: #FFFFFF;
}

.row .pagination span a:hover, li.pagination span a:hover {
        background-color: #7B828D;
}

/* Miscellaneous styles
---------------------------------------- */

.copyright {
   color: #555555;
}

.error {
   color: #BC2A4D;
}

.reported {
   background-color: #F7ECEF;
}

li.reported:hover {
   background-color: #ECD5D8 !important;
}
.sticky, .announce {
   /* you can add a background for stickies and announcements*/
}

div.rules {
   background-color: #ECD5D8;
   color: #BC2A4D;
}

p.rules {
   background-color: #ECD5D8;
   background-image: none;
}

/*     
--------------------------------------------------------------
Colours and backgrounds for links.css
-------------------------------------------------------------- */

a:link        { color: #454B54; }
a:visited        { color: #454B54; }
a:hover        { color: #D31141; }
a:active        { color: #7B828D; }

/* Links on gradient backgrounds */
#search-box a:link, .navbg a:link, .forumbg .header a:link, .forabg .header a:link, th a:link {
   color: #FFFFFF;
}

#search-box a:visited, .navbg a:visited, .forumbg .header a:visited, .forabg .header a:visited, th a:visited {
   color: #FFFFFF;
}

#search-box a:hover, .navbg a:hover, .forumbg .header a:hover, .forabg .header a:hover, th a:hover {
        color: #CED3D9;
}

#search-box a:active, .navbg a:active, .forumbg .header a:active, .forabg .header a:active, th a:active {
        color: #E0E3E7;
}

/* Links for forum/topic lists */
a.forumtitle {
        color: #333333;
}

/* a.forumtitle:visited { color: #454B54; } */

a.forumtitle:hover {
   color: #BC2A4D;
}

a.forumtitle:active {
        color: #454B54;
}

a.topictitle {
        color: #333333;
}

/* a.topictitle:visited { color: #7B828D; } */

a.topictitle:hover {
   color: #BC2A4D;
}

a.topictitle:active {
        color: #454B54;
}

/* Post body links */
.postlink {
        color: #7B828D;
        border-bottom-color: #7B828D;
}

.postlink:visited {
        color: #878C93;
   border-bottom-color: #666666;
}

.postlink:active {
        color: #7B828D;
}

.postlink:hover {
        background-color: #E1E3E5;
        color: #3A3F46;
}

.signature a, .signature a:visited, .signature a:active, .signature a:hover {
   background-color: transparent;
}

/* Profile links */
.postprofile a:link, .postprofile a:active, .postprofile a:visited, .postprofile dt.author a {
        color: #454B54;
}

.postprofile a:hover, .postprofile dt.author a:hover {
   color: #D31141;
}

/* Profile searchresults */   
.search .postprofile a {
        color: #454B54;
}

.search .postprofile a:hover {
   color: #D31141;
}

/* Back to top of page */
a.top {
   background-image: url("{IMG_ICON_BACK_TOP_SRC}");
}

a.top2 {
   background-image: url("{IMG_ICON_BACK_TOP_SRC}");
}

/* Arrow links  */
a.up                { background-image: url("{T_THEME_PATH}/images/arrow_up.gif") }
a.down                { background-image: url("{T_THEME_PATH}/images/arrow_down.gif") }
a.left                { background-image: url("{T_THEME_PATH}/images/arrow_left.gif") }
a.right                { background-image: url("{T_THEME_PATH}/images/arrow_right.gif") }

a.up:hover {
   background-color: transparent;
}

a.left:hover {
        color: #7B828D;
}

a.right:hover {
        color: #7B828D;
}


/*     
--------------------------------------------------------------
Colours and backgrounds for content.css
-------------------------------------------------------------- */

ul.forums {
        background-color: #E3E4E4;
}

ul.topiclist li {
        color: #4F4044;
}

ul.topiclist dd {
   border-left-color: #FFFFFF;
}

.rtl ul.topiclist dd {
   border-right-color: #fff;
   border-left-color: transparent;
}

ul.topiclist li.row dt a.subforum.read {
   background-image: url("{IMG_SUBFORUM_READ_SRC}");
}

ul.topiclist li.row dt a.subforum.unread {
   background-image: url("{IMG_SUBFORUM_UNREAD_SRC}");
}

li.row {
   border-top-color:  #BBBBBB;
        border-bottom-color: #4F5860;
}

li.row strong {
   color: #000000;
}

li.row:hover {
        background-color: #EBECEC;
}

li.row:hover dd {
   border-left-color: #CCCCCC;
}

.rtl li.row:hover dd {
   border-right-color: #CCCCCC;
   border-left-color: transparent;
}

li.header dt, li.header dd {
   color: #BBBBBB;
}

/* Forum list column styles */
ul.topiclist dd.searchextra {
   color: #333333;
}

/* Post body styles
----------------------------------------*/
.postbody {
   color: #333333;
}

/* Content container styles
----------------------------------------*/
.content {
   color: #333333;
}

.content h2, .panel h2 {
        color: #4C525D;
   border-bottom-color:  #CCCCCC;
}

dl.faq dt {
   color: #333333;
}

.posthilit {
   background-color: #F3BFCC;
   color: #BC2A4D;
}

/* Post signature */
.signature {
   border-top-color: #CCCCCC;
}

/* Post noticies */
.notice {
   border-top-color:  #CCCCCC;
}

/* BB Code styles
----------------------------------------*/
/* Quote block */
blockquote {
   background-color: #EBEADD;
   background-image: url("{T_THEME_PATH}/images/quote.gif");
   border-color:#DBDBCE;
}

.rtl blockquote {
   background-image: url("{T_THEME_PATH}/images/quote_rtl.gif");
}

blockquote blockquote {
   /* Nested quotes */
   background-color:#EFEED9;
}

blockquote blockquote blockquote {
   /* Nested quotes */
   background-color: #EBEADD;
}

/* Code block */
dl.codebox {
   background-color: #FFFFFF;
        border-color: #D0D0D1;
}

dl.codebox dt {
   border-bottom-color:  #CCCCCC;
}

dl.codebox code {
   color: #2E8B57;
}

.syntaxbg                { color: #FFFFFF; }
.syntaxcomment        { color: #FF8000; }
.syntaxdefault        { color: #0000BB; }
.syntaxhtml                { color: #000000; }
.syntaxkeyword        { color: #007700; }
.syntaxstring        { color: #DD0000; }

/* Attachments
----------------------------------------*/
.attachbox {
   background-color: #FFFFFF;
        border-color:  #D0D0D1;
}

.pm-message .attachbox {
   background-color: #F2F3F3;
}

.attachbox dd {
        border-top-color: #D0D0D1;
}

.attachbox p {
   color: #666666;
}

.attachbox p.stats {
   color: #666666;
}

.attach-image img {
   border-color: #999999;
}

/* Inline image thumbnails */

dl.file dd {
   color: #666666;
}

dl.thumbnail img {
   border-color: #666666;
   background-color: #FFFFFF;
}

dl.thumbnail dd {
   color: #666666;
}

dl.thumbnail dt a:hover {
   background-color: #EEEEEE;
}

dl.thumbnail dt a:hover img {
        border-color: #7B828D;
}

/* Post poll styles
----------------------------------------*/

fieldset.polls dl {
        border-top-color: #DFDFDF;
   color: #666666;
}

fieldset.polls dl.voted {
   color: #000000;
}

fieldset.polls dd div {
   color: #FFFFFF;
}

.rtl .pollbar1, .rtl .pollbar2, .rtl .pollbar3, .rtl .pollbar4, .rtl .pollbar5 {
   border-right-color: transparent;
}

.pollbar1 {
   background-color: #AA2346;
   border-bottom-color: #74162C;
   border-right-color: #74162C;
}

.rtl .pollbar1 {
   border-left-color: #74162C;
}

.pollbar2 {
   background-color: #BE1E4A;
   border-bottom-color: #8C1C38;
   border-right-color: #8C1C38;
}

.rtl .pollbar2 {
   border-left-color: #8C1C38;
}

.pollbar3 {
   background-color: #D11A4E;
   border-bottom-color: #AA2346;
   border-right-color: #AA2346;
}

.rtl .pollbar3 {
   border-left-color: #AA2346;
}

.pollbar4 {
   background-color: #E41653;
   border-bottom-color: #BE1E4A;
   border-right-color: #BE1E4A;
}

.rtl .pollbar4 {
   border-left-color: #BE1E4A;
}

.pollbar5 {
   background-color: #F81157;
   border-bottom-color: #D11A4E;
   border-right-color: #D11A4E;
}

.rtl .pollbar5 {
   border-left-color: #D11A4E;
}

/* Poster profile block
----------------------------------------*/
.postprofile {
   color: #666666;
   border-left-color: #FFFFFF;
}

.rtl .postprofile {
   border-right-color: #FFFFFF;
   border-left-color: transparent;
}

.pm .postprofile {
   border-left-color: #DDDDDD;
}

.rtl .pm .postprofile {
   border-right-color: #DDDDDD;
   border-left-color: transparent;
}

.postprofile strong {
   color: #000000;
}

.online {
   background-image: url("{T_IMAGESET_LANG_PATH}/icon_user_online.gif");
}

.online dt {
   margin-top: 5px;
}

/*     
--------------------------------------------------------------
Colours and backgrounds for buttons.css
-------------------------------------------------------------- */

/* Big button images */
.reply-icon span        { background-image: url("{IMG_BUTTON_TOPIC_REPLY_SRC}"); }
.post-icon span                { background-image: url("{IMG_BUTTON_TOPIC_NEW_SRC}"); }
.locked-icon span        { background-image: url("{IMG_BUTTON_TOPIC_LOCKED_SRC}"); }
.pmreply-icon span        { background-image: url("{IMG_BUTTON_PM_REPLY_SRC}") ;}
.newpm-icon span         { background-image: url("{IMG_BUTTON_PM_NEW_SRC}") ;}
.forwardpm-icon span        { background-image: url("{IMG_BUTTON_PM_FORWARD_SRC}") ;}

a.facebook {
   background-image: url("{T_THEME_PATH}/images/icon_facebook.gif");
}

a.twitter {
   background-image: url("{T_THEME_PATH}/images/icon_twitter.gif");
}

a.delicious {
   background-image: url("{T_THEME_PATH}/images/icon_delicious.gif");
}

/* The following are part of the calendar mod.
   They follow the same format as the reply-icon, post-icon, locked-icon, pmreply-icon, newpm-icon, and forwardpm-icon.
   If you are trying to implement a style other then prosilver, look at how your existing style defines
   those icons, and do the same for the new calendar icons.
*/
.calendar-new-icon span    { background-image: url("{IMG_BUTTON_CALENDAR_NEW_SRC}") ;}
.calendar-day-icon span     { background-image: url("{IMG_BUTTON_CALENDAR_DAY_SRC}") ;}
.calendar-week-icon span    { background-image: url("{IMG_BUTTON_CALENDAR_WEEK_SRC}") ;}
.calendar-month-icon span   { background-image: url("{IMG_BUTTON_CALENDAR_MONTH_SRC}") ;}

a.print {
   background-image: url("{T_THEME_PATH}/images/icon_print.gif");
}

a.sendemail {
   background-image: url("{T_THEME_PATH}/images/icon_sendemail.gif");
}

a.fontsize {
   background-image: url("{T_THEME_PATH}/images/icon_fontsize.gif");
}

/* Icon images
---------------------------------------- */
.sitehome                                                { background-image: url("{T_THEME_PATH}/images/icon_home.gif"); }
.icon-faq                                                { background-image: url("{T_THEME_PATH}/images/icon_faq.gif"); }
.icon-geomap               { background-image: url("{T_THEME_PATH}/images/icon_geomap.gif"); }
.icon-members                                        { background-image: url("{T_THEME_PATH}/images/icon_members.gif"); }
.icon-home                                                { background-image: url("{T_THEME_PATH}/images/icon_home.gif"); }
.icon-ucp                                                { background-image: url("{T_THEME_PATH}/images/icon_ucp.gif"); }
.icon-register                                        { background-image: url("{T_THEME_PATH}/images/icon_register.gif"); }
.icon-logout                                        { background-image: url("{T_THEME_PATH}/images/icon_logout.gif"); }
.icon-bookmark                                        { background-image: url("{T_THEME_PATH}/images/icon_bookmark.gif"); }
.icon-bump                                                { background-image: url("{T_THEME_PATH}/images/icon_bump.gif"); }
.icon-subscribe                                        { background-image: url("{T_THEME_PATH}/images/icon_subscribe.gif"); }
.icon-unsubscribe                                { background-image: url("{T_THEME_PATH}/images/icon_unsubscribe.gif"); }
.icon-pages                                                { background-image: url("{T_THEME_PATH}/images/icon_pages.gif"); }
.icon-search                                        { background-image: url("{T_THEME_PATH}/images/icon_search.gif"); }

/* Profile & navigation icons */
.email-icon, .email-icon a                { background-image: url("{IMG_ICON_CONTACT_EMAIL_SRC}"); }
.aim-icon, .aim-icon a                        { background-image: url("{IMG_ICON_CONTACT_AIM_SRC}"); }
.yahoo-icon, .yahoo-icon a                { background-image: url("{IMG_ICON_CONTACT_YAHOO_SRC}"); }
.web-icon, .web-icon a                        { background-image: url("{IMG_ICON_CONTACT_WWW_SRC}"); }
.msnm-icon, .msnm-icon a                        { background-image: url("{IMG_ICON_CONTACT_MSNM_SRC}"); }
.icq-icon, .icq-icon a                        { background-image: url("{IMG_ICON_CONTACT_ICQ_SRC}"); }
.jabber-icon, .jabber-icon a                { background-image: url("{IMG_ICON_CONTACT_JABBER_SRC}"); }
.bebo-icon, .bebo-icon a         { background-image: url("{IMG_ICON_CONTACT_BEBO_SRC}"); }
.blogger-icon, .blogger-icon a         { background-image: url("{IMG_ICON_CONTACT_BLOGGER_SRC}"); }
.facebook-icon, .facebook-icon a         { background-image: url("{IMG_ICON_CONTACT_FB_SRC}"); }
.goodreads-icon, .goodreads-icon a         { background-image: url("{IMG_ICON_CONTACT_GR_SRC}"); }
.linkedin-icon, .linkedin-icon a         { background-image: url("{IMG_ICON_CONTACT_LI_SRC}"); }
.myspace-icon, .myspace-icon a         { background-image: url("{IMG_ICON_CONTACT_MS_SRC}"); }
.netlog-icon, .netlog-icon a            { background-image: url("{IMG_ICON_CONTACT_NETLOG_SRC}"); }
.twitter-icon, .twitter-icon a         { background-image: url("{IMG_ICON_CONTACT_TWIT_SRC}"); }
.pm-icon, .pm-icon a                                { background-image: url("{IMG_ICON_CONTACT_PM_SRC}"); }
.quote-icon, .quote-icon a                { background-image: url("{IMG_ICON_POST_QUOTE_SRC}"); }
.geomap-icon, .geomap-icon a      { background-image: url("{T_IMAGESET_PATH}/icon_contact_geomap.gif"); }

/* Moderator icons */
.report-icon, .report-icon a                { background-image: url("{IMG_ICON_POST_REPORT_SRC}"); }
.edit-icon, .edit-icon a                        { background-image: url("{IMG_ICON_POST_EDIT_SRC}"); }
.edit-all-icon, .edit-all-icon a         { background-image: url("{IMG_ICON_CALENDAR_EDIT_ALL_SRC}"); }
.delete-all-icon, .delete-all-icon a         { background-image: url("{IMG_ICON_CALENDAR_DELETE_ALL_SRC}"); }
.delete-icon, .delete-icon a                { background-image: url("{IMG_ICON_POST_DELETE_SRC}"); }
.info-icon, .info-icon a                        { background-image: url("{IMG_ICON_POST_INFO_SRC}"); }
.warn-icon, .warn-icon a                        { background-image: url("{IMG_ICON_USER_WARN_SRC}"); } /* Need updated warn icon */

/*     
--------------------------------------------------------------
Colours and backgrounds for cp.css
-------------------------------------------------------------- */

/* Main CP box
----------------------------------------*/

#cp-main h3, #cp-main hr, #cp-menu hr {
        border-color: #B0B1B3;
}

#cp-main .panel li.row {
        border-bottom-color: #BFC0C1;
   border-top-color: #F9F9F9;
}

ul.cplist {
        border-top-color: #BFC0C1;
}

#cp-main .panel li.header dd, #cp-main .panel li.header dt {
   color: #000000;
}

#cp-main table.table1 thead th {
   color: #333333;
   border-bottom-color: #333333;
}

#cp-main .pm-message {
        border-color: #DEDEDF;
   background-color: #FFFFFF;
}

/* CP tabbed menu
----------------------------------------*/
#tabs a {
   background-image: url("{T_THEME_PATH}/images/bg_tabs1.gif");
}

#tabs a span {
   background-image: url("{T_THEME_PATH}/images/bg_tabs2.gif");
        color: #CCCCCC;
}

#tabs a:hover span {
   color: #BC2A4D;
}

#tabs .activetab a {
        border-bottom-color: #D9DADC;
}

#tabs .activetab a span {
   color: #333333;
}

#tabs .activetab a:hover span {
   color: #000000;
}

/* Mini tabbed menu used in MCP
----------------------------------------*/
#minitabs li {
        background-color: #E8E9EB;
}

#minitabs li.activetab {
   background-color: #F9F9F9;
}

#minitabs li.activetab a, #minitabs li.activetab a:hover {
   color: #333333;
}

/* UCP navigation menu
----------------------------------------*/

/* Link styles for the sub-section links */
#navigation a {
   color: #333;
        background-color: #BFC0C2;
   background-image: url("{T_THEME_PATH}/images/bg_menu.gif");
}

.rtl #navigation a {
   background-image: url("{T_THEME_PATH}/images/bg_menu_rtl.gif");
   background-position: 0 100%;
}

#navigation a:hover {
        background-color: #B6B8BA;
   color: #BC2A4D;
}

#navigation #active-subsection a {
   color: #D31141;
   background-color: #F9F9F9;
   background-image: none;
}

#navigation #active-subsection a:hover {
   color: #D31141;
}

/* Preferences pane layout
----------------------------------------*/
#cp-main h2 {
   color: #333333;
}

#cp-main .panel {
   background-color: #F9F9F9;
}

#cp-main .pm {
   background-color: #FFFFFF;
}

#cp-main span.corners-top, #cp-menu span.corners-top {
   background-image: url("{T_THEME_PATH}/images/corners_left2.gif");
}

#cp-main span.corners-top span, #cp-menu span.corners-top span {
   background-image: url("{T_THEME_PATH}/images/corners_right2.gif");
}

#cp-main span.corners-bottom, #cp-menu span.corners-bottom {
   background-image: url("{T_THEME_PATH}/images/corners_left2.gif");
}

#cp-main span.corners-bottom span, #cp-menu span.corners-bottom span {
   background-image: url("{T_THEME_PATH}/images/corners_right2.gif");
}

/* Topicreview */
#cp-main .panel #topicreview span.corners-top, #cp-menu .panel #topicreview span.corners-top {
   background-image: url("{T_THEME_PATH}/images/corners_left.gif");
}

#cp-main .panel #topicreview span.corners-top span, #cp-menu .panel #topicreview span.corners-top span {
   background-image: url("{T_THEME_PATH}/images/corners_right.gif");
}

#cp-main .panel #topicreview span.corners-bottom, #cp-menu .panel #topicreview span.corners-bottom {
   background-image: url("{T_THEME_PATH}/images/corners_left.gif");
}

#cp-main .panel #topicreview span.corners-bottom span, #cp-menu .panel #topicreview span.corners-bottom span {
   background-image: url("{T_THEME_PATH}/images/corners_right.gif");
}

/* Friends list */
.cp-mini {
        background-color: #F3F4F4;
}

dl.mini dt {
        color: #525357;
}

/* PM Styles
----------------------------------------*/
/* PM Message history */
.current {
   color: #000000 !important;
}

/* PM panel adjustments */
.pm-panel-header,
#cp-main .pm-message-nav {
   border-bottom-color: #A4B3BF;
}

/* PM marking colours */
.pmlist li.pm_message_reported_colour, .pm_message_reported_colour {
   border-left-color: #BC2A4D;
   border-right-color: #BC2A4D;
}

.pmlist li.pm_marked_colour, .pm_marked_colour {
   border-color: #FF6600;
}

.pmlist li.pm_replied_colour, .pm_replied_colour {
        border-color: #B4B5B7;
}

.pmlist li.pm_friend_colour, .pm_friend_colour {
        border-color: #878C93;
}

.pmlist li.pm_foe_colour, .pm_foe_colour {
   border-color: #000000;
}

/* Avatar gallery */
#gallery label {
   background-color: #FFFFFF;
   border-color: #CCC;
}

#gallery label:hover {
   background-color: #EEE;
}

/*     
--------------------------------------------------------------
Colours and backgrounds for forms.css
-------------------------------------------------------------- */

/* General form styles
----------------------------------------*/
select {
   border-color: #666666;
   background-color: #FAFAFA;
   color: #000;
}

label {
   color: #425067;
}

option.disabled-option {
   color: graytext;
}

/* Definition list layout for forms
---------------------------------------- */
dd label {
   color: #333;
}

/* Hover effects */
fieldset dl:hover dt label {
   color: #000000;
}

fieldset.fields2 dl:hover dt label {
   color: inherit;
}

/* Quick-login on index page */
fieldset.quick-login input.inputbox {
   background-color: #F2F3F3;
}

/* Posting page styles
----------------------------------------*/

#message-box textarea {
   color: #333333;
}

/* Input field styles
---------------------------------------- */
.inputbox {
   background-color: #FFFFFF; 
        border-color: #B9BABB;
   color: #333333;
}

.inputbox:hover {
        border-color: #707F8B;
}

.inputbox:focus {
        border-color: #707F8B;
        color: #444952;
}

/* Form button styles
---------------------------------------- */

a.button1, input.button1, input.button3, a.button2, input.button2 {
   color: #000;
   background-color: #FAFAFA;
   background-image: url("{T_THEME_PATH}/images/bg_button.gif");
}

a.button1, input.button1 {
   border-color: #666666;
}

input.button3 {
   background-image: none;
}

/* Alternative button */
a.button2, input.button2, input.button3 {
   border-color: #666666;
}

/* <a> button in the style of the form buttons */
a.button1, a.button1:link, a.button1:visited, a.button1:active, a.button2, a.button2:link, a.button2:visited, a.button2:active {
   color: #000000;
}

/* Hover states */
a.button1:hover, input.button1:hover, a.button2:hover, input.button2:hover, input.button3:hover {
   border-color: #BC2A4D;
   color: #BC2A4D;
}

input.search {
   background-image: url("{T_THEME_PATH}/images/icon_textbox_search.gif");
}

input.disabled {
   color: #666666;
}
Bin über jeden Hinweis dankbar, da ich die Idee die mir im Kopf herumschwirrt gerne umsetzen würde^^

Link zum Forum:

http://www.poison.door.net/phpbb3
DocSommer
Mitglied
Beiträge: 203
Registriert: 18.02.2009 18:47
Kontaktdaten:

Re: Ausrichtung Hintergrundbild für die viewtopic-Ansicht

Beitrag von DocSommer »

Ich habe jetzt eine Lösung gefunden, siehe:

http://www.phpbb.com/community/viewtopi ... #p12891870
Antworten

Zurück zu „[3.0.x] Styles, Templates und Grafiken“