Webboard

Webboard > Wsparcie MyBB > Style, szablony i grafika > Zmiana koloru tła forum i koloru tła posta.
Pełna wersja: Zmiana koloru tła forum i koloru tła posta.
Aktualnie przeglądasz uproszczoną wersję forum. Kliknij tutaj, by zobaczyć wersję z pełnym formatowaniem.

-Ricki-

06.05.2013, 20:02
wersja skryptu MyBB: 1.6.10
adres forum: http://amd-org.tk
na czym polega problem (screen, opis, komunikaty, nazwa stylu/theme/szablonu): Kolor tła forum, ukazany na pierwszym screenie, jest biały chciałbym go zmienić na inny kolor, niestety nie bardzo wiem jak to zrobić, przepatrzyłem plik global.css i szczerze powiedziawszy nie wiem którą wartość zmienić, forum jest, przydała by mi się także informacja w którym miejscu mógłbym zmienić kolor tabelek na stronie głównej forum i ostatnią rzeczą jest sprawa ze screena numer dwa - Kolor tła posta również chciałbym się dowiedzieć co odpowiada za jego kolor, a na samym końcu kolor tabel w widoku for po bezpośrednim wejściu do danego działu. Styl którego używam to "Apart Flame". Byłbym wdzięczny za wszelaką pomoc i udzielone tutaj wskazówki.

Screen. #1
http://i.imgur.com/2OI4GcE.jpg

Screen. #2
http://i.imgur.com/acLoP94.jpg

GiboneKPL

06.05.2013, 20:07
#1 Klasa body w global.css (pewnie gdzieś na początku, a jak nie no to F3 i wpisujesz body"

#2 Bodajże klasa .tborder też w global.css Przepraszam źle przeczytałem. Musiałbyś zrobić nową klasę (coś ala trow1 i trow2. Następnie w szablonach (postbit i postbit_classic) zamienić <div class="trow1/trow2"></div> na swoją klasę: <div class="twoja klasa"></div>

-Ricki-

06.05.2013, 20:22
Nie działa coś, w przypadku strony głównej forum tło ciągle jest białe, w przypadku postów jasno siwe. Jak by co daję swojego "global.css"

Kod:
body {
background: #222 url(images/flame/bg.png);
color: #000;
text-align: center;
line-height: 1.4;
margin: 0;

font-family: Tahoma, Verdana, Arial, Sans-Serif;
font-size: 13px;
}

a:link {
color: #555;
text-decoration: none;
}

a:visited {
color: #444;
text-decoration: none;
}

a:hover, a:active {
color: #000;
text-decoration: underline;
}

#container {
color: #000;
text-align: left;
line-height: 1.4;
margin: 0;
font-family: Tahoma, Verdana, Arial, Sans-Serif;
font-size: 13px;
}

.wrapper {
width: 85%;
min-width: 970px;
max-width: 1500px;
margin: auto auto;
}

#logo {
background: #dedede;
border-bottom: 1px solid #550000;
text-align: center;
}

#content {
background: #fff;
width: auto !important;
padding: 20px 10px;
overflow: hidden;
border-bottom: 1px solid #000;
}

#panel ul.menu {
margin: 0;
padding: 0;
list-style: none;
}

#panel ul.menu li {
margin: 0 5px;
display: inline;
}

#panel ul.menu li a {
padding-left: 20px;
background-repeat: no-repeat;
background-position: left center;
}

#panel .upper ul.top_links {
float: right;
font-weight: bold;
}

#panel .upper ul.top_links a.search {
background-image: url(images/flame/icons/search.gif);
}

#panel .upper ul.top_links a.memberlist {
background-image: url(images/flame/icons/memberlist.gif);
}

#panel .upper ul.top_links a.calendar {
background-image: url(images/flame/icons/calendar.gif);
}

#panel .upper ul.top_links a.help {
background-image: url(images/flame/icons/help.gif);
}

#panel .upper a.logout {
font-weight: bold;
background: url(images/flame/icons/logout.gif) right no-repeat;
padding-right: 20px;
margin-left: 10px;
}

#panel .upper a.login,
#panel .upper a.lost_password {
background: url(images/flame/icons/login.gif) no-repeat;
padding-left: 20px;
margin-left: 10px;
font-weight: bold;
}

#panel .upper a.register {
background: url(images/flame/icons/logout.gif) right no-repeat;
padding-right: 20px;
margin-left: 10px;
font-weight: bold;
}

#panel .lower ul.panel_links {
float: left;
}

#panel .lower ul.panel_links a.usercp {
background-image: url(images/flame/icons/usercp.gif);
}

#panel .lower ul.panel_links a.modcp {
background-image: url(images/flame/icons/modcp.gif);
}

#panel .lower ul.panel_links a.admincp {
background-image: url(images/flame/icons/admincp.gif);
}

#panel .lower ul.user_links {
float: right;
}

#panel .lower ul.user_links li a {
padding: 0;
}

#panel .upper {
background: #0f0f0f url(images/flame/tcat.png) repeat-x;
color: #fff;
border-top: 1px solid #444;
border-bottom: 1px solid #000;
padding: 7px;
}

#panel .upper a:link,
#panel .upper a:visited,
#panel .upper a:hover,
#panel .upper a:active {
color: #fff;
}

#panel .lower {
background: #efefef;
color: #999;
border-top: 1px solid #fff;
border-bottom: 1px solid #ccc;
overflow: hidden;
padding: 5px;
}

#panel .lower a:link,
#panel .lower a:visited {
color: #666;
}

#panel .lower a:hover,
#panel .lower a:active {
color: #333;
text-decoration: none;
}

#panel .remember_me input {
vertical-align: middle;
margin: -3px 0 0 5px;
}

#panel input {
margin: -3px 0;
}

#panel input.button {
padding: 0;
}

#footer ul.menu {
margin: 0;
padding: 0;
list-style: none;
}

#footer ul.menu li {
margin: 0 5px;
display: inline;
}

#footer .upper {
background: #0f0f0f url(images/flame/tcat.png) repeat-x;
padding: 6px;
overflow: hidden;

font-size: 12px;
}

#footer a:link,
#footer a:visited {
color: #aaa;
}

#footer a:hover,
#footer a:active {
color: #fff;
text-decoration: none;
}

#footer .upper .language {
float: right;
margin: -2px;
}

#footer .upper .language select {
border-color: #000;
}

#footer .upper ul.bottom_links {
float: left;
margin: 3px 0 0 -5px;
}

#footer .lower {
background: #750000 url(images/flame/thead.png) top left repeat-x;
color: #fff;
border-top: 1px solid #000;
border-bottom: 1px solid #550000;
overflow: hidden;
padding: 6px;

font-size: 11px;
}

#footer .lower a:link,
#footer .lower a:visited {
color: #fff;
font-weight: bold;
}

#footer .lower a:hover,
#footer .lower a:active {
color: #fff;
text-decoration: underline;
font-weight: bold;
}

#footer .lower #current_time {
float: right;
}

fieldset {
border: 1px solid #ddd;
}

table {
color: #000000;
font-size: 13px;
}

.tborder {
background: #fff;
width: 100%;
margin: auto auto;
border: 1px solid #ccc;
padding: 1px;
}

.thead {
background: #750000 url(images/flame/thead.png) top left repeat-x;
color: #ffffff;
border-bottom: 1px solid #550000;
padding: 8px;
}

.thead a:link {
color: #ffffff;
text-decoration: none;
}

.thead a:visited {
color: #ffffff;
text-decoration: none;
}

.thead a:hover, .thead a:active {
color: #ffffff;
text-decoration: underline;
}

.tcat {
background: #0f0f0f url(images/flame/tcat.png) repeat-x;
color: #fff;
border-top: 1px solid #444;
border-bottom: 1px solid #000;
padding: 6px;

font-size: 12px;
}

.tcat a:link {
color: #fff;
}

.tcat a:visited {
color: #fff;
}

.tcat a:hover, .tcat a:active {
color: #fff;
}

.trow1 {
background: #f5f5f5;
border: 1px solid;
border-color: #fff #ddd #ddd #fff;
}

.trow2 {
background: #efefef;
border: 1px solid;
border-color: #fff #ddd #ddd #fff;
}

.trow_shaded {
background: #ffdde0;
border: 1px solid;
border-color: #fff #ffb8be #ffb8be #fff;
}

.trow_selected td {
background: #FFFBD9;
color: #000;
border-right-color: #F7E86A;
border-bottom-color: #F7E86A;
}

.trow_selected td a:link,
.trow_selected td a:visited,
.trow_selected td a:hover,
.trow_selected td a:active {
color: #000;
}

.trow_sep {
background: #ddd;
color: #000;
border-bottom: 1px solid #c5c5c5;
padding: 6px;
font-size: 12px;
font-weight: bold;
}

.tfoot {
background: #750000 url(images/flame/thead.png) top left repeat-x;
color: #ffffff;
border-top: 1px solid #fff;
padding: 6px;
}

.tfoot a:link {
color: #ffffff;
text-decoration: none;
}

.tfoot a:visited {
color: #ffffff;
text-decoration: none;
}

.tfoot a:hover, .tfoot a:active {
color: #ffffff;
text-decoration: underline;
}

.thead input.textbox,
.thead select,
.tfoot input.textbox,
.tfoot select {
border: 1px solid #550000;
}

.bottommenu {
background: #efefef;
color: #000000;
border: 1px solid #4874a3;
padding: 10px;
}

.navigation {
color: #000000;
font-size: 12px;
}

.navigation a:link {
text-decoration: none;
}

.navigation a:visited {
text-decoration: none;
}

.navigation a:hover, .navigation a:active {
text-decoration: none;
}

.navigation .active {
color: #000000;
font-size: small;
font-weight: bold;
}

.smalltext {
font-size: 11px;
}

.largetext {
font-size: 16px;
font-weight: bold;
}

input.textbox {
background: #ffffff;
color: #000000;
border: 1px solid #ccc;
padding: 3px;

font-family: Tahoma, Verdana, Arial, Sans-Serif;
}

textarea {
background: #ffffff;
color: #000000;
border: 1px solid #ccc;
padding: 2px;
line-height: 1.4;

font-family: Tahoma, Verdana, Arial, Sans-Serif;
font-size: 13px;
}

select {
background: #ffffff;
padding: 3px;
border: 1px solid #ccc;

font-family: Tahoma, Verdana, Arial, Sans-Serif;
}

input.button {
padding: 2px;
cursor: pointer;
font-family: Tahoma, Verdana, Arial, Sans-Serif;
}

.editor {
background: #f1f1f1;
border: 1px solid #ccc;
}

.editor_control_bar {
background: #fff;
border: 1px solid #ccc;
}

.autocomplete {
background: #fff;
color: black;
border: 1px solid #ccc;
padding: 1px;
}

.autocomplete_selected {
background: #a20000;
color: #fff;
}

.popup_menu {
background: #fff;
border: 1px solid #ccc;
}

.popup_menu .popup_item {
background: #efefef;
color: #000;
}

.popup_menu .popup_item:hover {
background: #a20000;
color: #fff;
}

.trow_reputation_positive {
background: #ccffcc;
}

.trow_reputation_negative {
background: #ffcccc;
}

.reputation_positive {
color: green;
}

.reputation_neutral {
color: #444;
}

.reputation_negative {
color: red;
}

.invalid_field {
border: 1px solid #f30;
color: #f30;
}

.valid_field {
border: 1px solid #0c0;
}

.validation_error {
background: url(images/invalid.gif) no-repeat center left;
color: #f30;
margin: 5px 0;
padding: 5px;
font-weight: bold;
font-size: 11px;
padding-left: 22px;
}

.validation_success {
background: url(images/valid.gif) no-repeat center left;
color: #00b200;
margin: 5px 0;
padding: 5px;
font-weight: bold;
font-size: 11px;
padding-left: 22px;
}

.validation_loading {
background: url(images/spinner.gif) no-repeat center left;
color: #555;
margin: 5px 0;
padding: 5px;
font-weight: bold;
font-size: 11px;
padding-left: 22px;
}

/* Additional CSS (Master) */
img {
border: none;
}

.clear {
clear: both;
}

.hidden {
display: none;
float: none;
width: 1%;
}

.hiddenrow {
display: none;
}

.selectall {
background: #FFFBD9;
border-bottom: 1px solid #F7E86A;
color: #000;
text-align: center;
}

.float_left {
float: left;
}

.float_right {
float: right;
}

.expcolimage {
float: right;
width: auto;
vertical-align: middle;
margin-top: 3px;
}

img.attachment {
border: 1px solid #E9E5D7;
padding: 2px;
}

hr {
background-color: #000000;
color: #000000;
height: 1px;
border: 0px;
}

#debug {
float: right;
text-align: right;
margin-top: 20px;

font-size: 11px;
}

blockquote {
border: 1px solid #ccc;
margin: 0;
background: #fff;
padding: 4px;
}

blockquote cite {
font-weight: bold;
border-bottom: 1px solid #ccc;
font-style: normal;
display: block;
margin: 4px 0;
}

blockquote cite span {
float: right;
font-weight: normal;
}

blockquote cite span.highlight {
float: none;
font-weight: bold;
padding-bottom: 0;
}

.codeblock {
background: #fff;
border: 1px solid #ccc;
padding: 4px;
}

.codeblock .title {
border-bottom: 1px solid #ccc;
font-weight: bold;
margin: 4px 0;
}

.codeblock code {
overflow: auto;
height: auto;
max-height: 200px;
display: block;
font-family: Monaco, Consolas, Courier, monospace;
font-size: 13px;
}

.subforumicon {
border: 0;
vertical-align: middle;
}

.separator {
margin: 5px;
padding: 0;
height: 0px;
font-size: 1px;
list-style-type: none;
}

form {
margin: 0;
padding: 0;
}

.popup_menu .popup_item_container {
margin: 1px;
text-align: left;
}

.popup_menu .popup_item {
display: block;
padding: 4px;
white-space: nowrap;

text-decoration: none;
}

.popup_menu a.popup_item:hover {
text-decoration: none;
}

.autocomplete {
text-align: left;
}

.subject_new {
font-weight: bold;
}

.highlight {
background: #FFFFCC;
padding-top: 3px;
padding-bottom: 3px;
}

.pm_alert {
background: #FFF6BF;
border: 1px solid #FFD324;
text-align: center;
padding: 5px 20px;
margin-bottom: 15px;
font-size: 11px;
}

.red_alert {
background: #FBE3E4;
border: 1px solid #A5161A;
color: #A5161A;
text-align: center;
padding: 5px 20px;
margin-bottom: 15px;
font-size: 11px;
}

.high_warning {
color: #CC0000;
}

.moderate_warning {
color: #F3611B;
}

.low_warning {
color: #AE5700;
}

div.error {
padding: 5px 10px;
border-top: 2px solid #FFD324;
border-bottom: 2px solid #FFD324;
background: #FFF6BF;
font-size: 12px;
}

div.error p {
margin: 0;
color: #000;
font-weight: normal;
}

div.error p em {
font-style: normal;
font-weight: bold;
padding-left: 24px;
display: block;
color: #C00;
background: url(images/error.gif) no-repeat 0;
}

div.error.ul {
margin-left: 24px;
}

.online {
color: #15A018;
}

.offline {
color: #C7C7C7;
}

.pagination {
font-size: 11px;
padding-top: 10px;
margin-bottom: 5px;
}

.tfoot .pagination, .tcat .pagination {
padding-top: 0;
}

.pagination .pages {
font-weight: bold;
}

.pagination .pagination_current, .pagination a {
padding: 3px 6px;
margin-bottom: 3px;
}

.pagination a {
background: #f5f5f5;
border: 1px solid #ccc;
}

.pagination .pagination_current {
background: none;
color: #000;
border: none;

font-weight: bold;
}

.pagination a:hover {
background: #a20000;
color: #fff;
border-color: #750000;

text-decoration: none;
}

.thread_legend, .thread_legend dd {
margin: 0;
padding: 0;
}

.thread_legend dd {
padding-bottom: 4px;
margin-right: 15px;
}

.thread_legend img {
margin-right: 4px;
vertical-align: bottom;
}

.forum_legend, .forum_legend dt, .forum_legend dd {
margin: 0;
padding: 0;
}

.forum_legend dd {
float: left;
margin-right: 10px;
margin-top: 7px;
}

.forum_legend dt {
margin-right: 10px;
float: left;
}

.success_message {
color: #00b200;
font-weight: bold;
font-size: 10px;
margin-bottom: 10px;
}

.error_message {
color: #C00;
font-weight: bold;
font-size: 10px;
margin-bottom: 10px;
}

.post_body {
padding: 5px;
}

.post_buttons {
background: #f5f5f5;
padding: 3px 3px 0 3px;
border-bottom: 1px solid #ddd;
}

.post_content {
padding: 5px 10px;
}

.quick_jump {
background: url(images/jump.gif) no-repeat 0;
width: 13px;
height: 13px;
padding-left: 13px; /* amount of padding needed for image to fully show */
vertical-align: middle;
border: none;
}

.repbox {
font-size:16px;
font-weight: bold;
padding:5px 7px 5px 7px;
}

._neutral {
background-color:#FAFAFA;
color: #999999;
border:1px solid #CCCCCC;
}

._minus {
background-color: #FDD2D1;
color: #CB0200;
border:1px solid #980201;
}

._plus {
background-color:#E8FCDC;
color: #008800;
border:1px solid #008800;
}

.pagination_breadcrumb {
background-color: #efefef;
border: 1px solid #fff;
outline: 1px solid #ccc;
padding: 5px;
margin-top: 5px;

font-weight: normal;
}

.pagination_breadcrumb_link {
vertical-align: middle;
cursor: pointer;
}

form #message
{
width: 500px;
}

.user_details {
margin-top: -5px;
text-align: left;
background: #dedede;
border: 1 px solid white;
padding: 8px 5px 8px 5px;
border-radius: 5px;
}

.ver_sub li{
list-style: none;
margin-top: -0px;
margin-left: -45px;
margin: 0;
padding: 0;
}

.ver_sub {
list-style: none;
margin-top: -0px;
margin-left: -45px;
width: 100%;
float: left;
}

.pasek_nowosci {
background: #FF0033;
border-top: 2px solid #FF0066;
border-bottom: 2px solid #FF0066;
margin: 11px auto;
padding: 6px 20px;
text-align: center;
color: #fff;
}

.avatar {
margin-left: 1px;
margin-top: 1px;
margin-bottom: 1px;
float: left;
}

.nick {
margin-top: 6px;
float: left;
margin-left: 8px;
}

.posty {
background: #2e2e2e;
color: white;
border-radius: 4px;
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
padding: 4px;
margin-bottom: 1px;
margin-right: 1px;
float: right;
font-weight: bold;
font-size: small
}

.postersi {
margin-top: -13px;
margin-bottom: 1px;
}

GiboneKPL

06.05.2013, 20:28
Spróbuj tak:
Kod:
body {
background: #222 url(images/flame/bg.png) top left repeat;
color: #000;
text-align: center;
line-height: 1.4;
margin: 0;

font-family: Tahoma, Verdana, Arial, Sans-Serif;
font-size: 13px;
}

SLAVOO

06.05.2013, 20:32
No przecież to .trow1 i .trow2
A tło jest w #content

-Ricki-

06.05.2013, 21:05
No i ładnie udało mi się to dopasować, teraz mam jeszcze jedno pytanko związane z tym samym...
Mianowicie, w jaki sposób zmienić kolor ramek ze screenów poniżej.

Screen. #1
http://i.imgur.com/qOg6mNG.jpg

Screen. #2
http://i.imgur.com/VyMAs1W.jpg

GiboneKPL

06.05.2013, 21:07
Klasa .tborder

SLAVOO

06.05.2013, 21:17
Masz tu komplet:
https://webboard.pl/wiki.php?przewodnik-...-mybb.html

-Ricki-

06.05.2013, 21:42
No i ustawiłem prawie wszystko jak chciałem prócz jednych małych duperelków - .tborder, fakt odpowiada za kolor ramek, ale gdy ustawiłem kolor na czarny ramka zmieniła kolor tylko dookoła, w środku została biała, to samo przy postach, jak to teraz poprawnie ustawić ?

Screeny.
http://i.imgur.com/4PuS1yt.jpg
http://i.imgur.com/CAsxE1w.jpg

GiboneKPL

06.05.2013, 21:47
A ustawiałeś kolor bg czy bordera bo mi się wydaje że tylko bordera. Edit. Spróbuj też zmienić bg w klasie .table

-Ricki-

06.05.2013, 21:50
Ustawiłem kolory i bg i bordera. Tak wygląda moja klasa .tborder

Kod:
.tborder {
background: #6d6d6d;
width: 100%;
margin: auto auto;
border: 1px solid #c2c2c2;
padding: 1px;
}

Co zrobiłem nie tak, że ramki w środku nadal są białe ?
Webboard > Wsparcie MyBB > Style, szablony i grafika > Zmiana koloru tła forum i koloru tła posta.