Pare problemów w edycji stylu.

Dyskusje na temat modyfikowania i tworzenia stylów do phpBB 3.0.x oraz spraw związanych z szablonami, motywami i zestawami obrazków.
Kokos
Posty: 149
Rejestracja: 20 grudnia 2008, 09:28

Pare problemów w edycji stylu.

Post autor: Kokos » 26 kwietnia 2010, 18:58

UWAGA TEN TEMAT MIAŁ SŁUŻYĆ POMOCY, A NIE GOTOWEGO SPOSOBY BY STYL WASZ SIĘ ZMIENIŁ!!! POMYSŁ BYŁ MÓJ I PROSZĘ TO USZANOWAĆ I GO NIE KOPIOWAĆ!!! JEŚLI JAKIEŚ FORUM BĘDZIE ZBYT PRZYPOMINAŁO MOJĄ EDYCJE ZROBI SIĘ BARDZO NIEMIŁO!!!

Witam, projektuje nowy styl forum, bo wkrótce przenoszę moje forum właśnie na phpbb3 (z przema)

Oto link do trwających prac: http://graforum.pl/phpBB3/index.php
Tu jest wstępny lay jak ma wyglądać forum: Obrazek

Oto lista rzeczy z którymi mam problem:
1. Chciałbym usunąć niebieską ramkę wokół listy for tak jak to jest na layu.(dotyczy to zarówno forum jak i kategorii)

Tu znalazłem info, ale efekt nie jest taki jak chce: viewtopic.php?f=55&t=11781

2.Przesunąć napis twoja pierwsza kategoria (niby bardzo proste, ale jakoś mi nie idzie - może nie ten padding próbuje zmieniać)

Na razie tyle ;)
Ostatnio zmieniony 09 maja 2010, 12:24 przez Kokos, łącznie zmieniany 1 raz.

pit
Posty: 1580
Rejestracja: 25 lutego 2009, 18:15

Re: Pare problemów w edycji stylu.

Post autor: pit » 26 kwietnia 2010, 21:42

W "common.css" poszukaj ".forabg" i ".forumbg"
zmień

Kod: Zaznacz cały

padding: 0 5px;
na

Kod: Zaznacz cały

padding: 0;
W "content.css" poszukaj

Kod: Zaznacz cały

li.header dt {
	font-weight: bold;
}
zmień na

Kod: Zaznacz cały

li.header dt {
	text-align: center;
	font-weight: bold;
}

Kokos
Posty: 149
Rejestracja: 20 grudnia 2008, 09:28

Re: Pare problemów w edycji stylu.

Post autor: Kokos » 27 kwietnia 2010, 09:51

Dzięki działa świetnie :) JUż drugi raz mi pomagasz :)

Kokos
Posty: 149
Rejestracja: 20 grudnia 2008, 09:28

Re: Pare problemów w edycji stylu.

Post autor: Kokos » 27 kwietnia 2010, 12:32

Mógłbyś mi pomóc wypozycjonować element logo? Jakoś też mi nie idzie :/

tu elementy te z css

Kod: Zaznacz cały

div.header2 {
	width: 85%;
	min-width: 1000px;
	max-width: 1200px;
	margin:0px auto;
	padding:10px;
	padding-top:0px;
}

div.logo {
	margin:0 15px 0 auto;
	
}

div.headerlogin{
	
	text-align: center;
	background-image:url("{T_THEME_PATH}/images/login.gif");
	margin-right: 0px;
	width: 352px;
	height: 98px;
	margin:0 0 15px auto;
	padding:10px;
i z html:

Kod: Zaznacz cały

</div>
			<div class="header2">
			<div class="logo">
			<a href="index.php"><img 
				src="{T_THEME_PATH}/images/logo.png" 
				onmouseover="this.src='{T_THEME_PATH}/images/logo.png'" 
				onmouseout="this.src='{T_THEME_PATH}/images/logo.png'"
				border="0"></a>
				</div>
			<div class="headerlogin">
			<!-- IF not S_USER_LOGGED_IN and S_REGISTER_ENABLED and not (S_SHOW_COPPA or S_REGISTRATION) -->
			<a href="ucp.php?mode=login"><img 
			src="{T_THEME_PATH}/images/login.png" 
			onmouseover="this.src='{T_THEME_PATH}/images/loginb.png'" 
			onmouseout="this.src='{T_THEME_PATH}/images/login.png'"
			border="0"></a>
			
			<a href="ucp.php?mode=register"><img 
				src="{T_THEME_PATH}/images/register.png" 
				onmouseover="this.src='{T_THEME_PATH}/images/registerb.png'" 
				onmouseout="this.src='{T_THEME_PATH}/images/register.png'"
				border="0"></a>
			<!-- ENDIF -->
			<ul>	
            
                               
                    
				
				<!-- IF not S_IS_BOT and S_USER_LOGGED_IN -->
					<li><a href="{U_PROFILE}" title="{L_PROFILE}" accesskey="e">{L_PROFILE}</a></li>
					
					<!-- IF S_DISPLAY_PM -->
						<li><a href="{U_PRIVATEMSGS}">{PRIVATE_MESSAGE_INFO}</a></li>
					<!-- ENDIF -->
					
					<li><a href="{U_SEARCH_SELF}">{L_SEARCH_SELF}</a></li>
					
					<!-- IF U_RESTORE_PERMISSIONS -->
						<li><a href="{U_RESTORE_PERMISSIONS}">{L_RESTORE_PERMISSIONS}</a></li>
					<!-- ENDIF -->
				
				<!-- ENDIF -->
				
				
				
				
				
				<!-- IF not S_IS_BOT -->
					<!-- IF S_DISPLAY_MEMBERLIST -->
						<li><a href="{U_MEMBERLIST}" title="{L_MEMBERLIST_EXPLAIN}">{L_MEMBERLIST}</a></li>
						<li><a href="{U_LOGIN_LOGOUT}">{L_LOGIN_LOGOUT}</a></li>
					<!-- ENDIF -->
				
					
			
					
				<!-- ENDIF -->
				
			</ul>
			
		</div>
		
		</div>
Na razie trochę śmietnik mam ;/ ale potem pozmieniam nazwy na jakieś normalne.

pit
Posty: 1580
Rejestracja: 25 lutego 2009, 18:15

Re: Pare problemów w edycji stylu.

Post autor: pit » 27 kwietnia 2010, 21:22

Podmień "simplecorp.css" na ten

Kod: Zaznacz cały

/* static template styles
----------------------------------------*/
* {
	margin:0;
	padding:0;
}
body {
	background-color:#181b1c;
	font-size:13px;
	padding:0;
	font-family:Arial, Helvetica, sans-serif;
	color:#333333;
	height: 100%;
	max-width: 1200px;
}


/* wrapper */
div.wrapper {
	padding:10px;
	padding-top:0px;
	border-right:4px solid #2e3233;
	border-bottom:4px solid #2e3233;
	border-left:4px solid #2e3233;
	background-color:#ffffff;
}

/* wrapper-menu */
div.wrapper-menu {
	padding:10px;
	padding-bottom:5px;
	border-right:4px solid #2e3233;
	border-top:4px solid #2e3233;
	border-left:4px solid #2e3233;
	background-color:#ffffff;
}


div.header2 {
	margin:0px auto;
}

div.logo {
	padding: 2% 5% ;
	
}

div.headerlogin{
	text-align: center;
	background-image:url("{T_THEME_PATH}/images/login.gif");
	width: 352px;
	height: 98px;
	margin:4% 5%;
	padding:10px;
	float: right;
}

div.headerlogin ul li a{
	color:#c8e5ef;
	display:block;
	float:left;
	font-family:"Trebuchet MS", Verdana, Arial;
	text-decoration:none;
	font-size:11px;
	margin-left:120px;
	padding-left:10px;
}


div.page-content {
	padding:5px 0;
	border-top:4px solid #E6E6E6;
}

div.menu {
	background-image:url("{T_THEME_PATH}/images/bg_list.gif") ;
	padding-left: 50px;
	margin-bottom: 5px;
}

div.menu ul {
	list-style:none;
}

div.menu ul li a {
	color:#eaeaea;
	font-family:"Trebuchet MS", Verdana, Arial;
	font-weight:bold;
	padding:19px 20px 20px;
	text-transform:uppercase;
	text-decoration:none;
	font-size:10px;
	text-shadow: 0px 1px 0px #000000;
}
div.menu ul li a:hover {
	text-decoration:none;
	background-color:#2B2B2B;
}

/* headers */
h1 {
	font-size:3.2em;
	letter-spacing:-2px;
	text-align:left;
	line-height:1.0em;
	font-weight:normal;
	font-family:Georgia, "Times New Roman", Times, serif;
	padding-bottom:10px;
	margin:0;
}
h1 a, h1 a:link, h1 a:visited, h1 a:hover, h1 a:visited {
	text-decoration:none;
	color:#FFFFFF;
	font-weight:normal;
	padding-left:10px;
}
h2 {
	color:#1D3D4E;
	font-size:1.7em;
	font-weight:normal;
	padding:0 0 10px;
	text-align:left;
	text-transform:none;
	font-family:Arial, Helvetica, sans-serif;
}
h3 {
	color:#444;
	font-size:1.0em;
	font-weight:bold;
	padding-bottom:10px;
}
h4 {
	font-family:Arial, Helvetica, sans-serif;
	font-size:0.95em;
	font-weight:bold;
	padding-bottom:10px;
	color:#32698B;
	text-transform:uppercase;
}
h5 {
	padding-bottom:10px;
}

/* element defaults */
p {
	margin-bottom:20px;
	line-height:1.9em;
	font-size:0.75em;
}
ul, ol {
	font-size:0.75em;
	padding:0;
	margin:0;
	list-style:none;
}
ol { 
	list-style:decimal;
}
code {
	background-color:#666666;
	display:block;
	color:#ffffff;
	padding:10px;
	margin:10px 0;
}

/* default forms */
fieldset { 
	border:none;
}
fieldset legend {
	font-size:0.8em;
	color:#666;
	font-weight:bold;
	padding:3px;
}
form { font-size:0.8em; }
form input, form textarea, form select {
	color:#444;
	font-family:Arial, Helvetica, sans-serif;
	font-size:1.0em;
}
form input.formbutton {
	background:#4086AA none repeat-x scroll bottom left;
	border:1px solid #2B5B78;
	color:#ffffff;
	font-size:0.9em;
	padding:6px 14px;
	font-weight:bold;
	font-family:Verdana, Arial, Helvetica, sans-serif;
}

/* default tables */ 
table {
	width:100%;
	margin-bottom:10px;
}
table tr th, table tr td {
	padding:5px 10px; 
}
table tr th {
	background:#4086AA none repeat-x scroll bottom left;
	color:#ffffff;
	border-top:3px solid #2B5B78;
}
table tr td {
	border-bottom:1px solid #dddddd;
}


/* default links */
a, a:visited { 
	color:#4086AA;
} 
a:hover { 
	color:#2B5B78; 
}



/* content */
div.page-wrap {
	padding:20px;
	clear:both;
}
div.navbar {
	background-color:#e0e0e0;
}
div.navbar div.inner {
	padding:5px 0;
}
div.navbar div.inner a,
div.navbar div.inner a:visited,  
div.navbar div.inner a:hover { 
	color:#555;
}
ul.navlinks {
	border:none;
	padding:0;
	margin:0;
}
ul.forums {
	background:#FFFFFF none;
}
li.row {
	border-bottom:1px solid #ddd;
}
li.row:hover {
	background:#fff none;
}
ul.cplist {
	font-size:0.9em;
}
div#cp-menu {
	font-size:1.1em;
}
div#cp-main .pm {
	font-size:1.1em;
}
ul.memberlistpages {
	font-size:1.1em;
}
div.forumbg {
	background-color:#23658E;
	background-image:url("{T_THEME_PATH}/images/bg_list.gif");
}
ul.topiclist li.row {
	background-color:#fff;
}
ul.topiclist li.row:hover dd {
	border-left-color:#fff;
} 
div#faqwrapper {
	font-size:0.8em;
}
div.post {
	font-size:0.9em;
}
div.postbody {
	font-size:0.85em;
}
div.forumbg-table {
	background:#fff none;
}
table#memberlist tr th, table#viewonlinelist tr th {
	padding:5px 10px;
}
table#viewonlinelist, table.smallertable {
	font-size:0.8em;
}
#cp-main table.table1 thead th {
	color:#fff;
}
div#tabs ul li a span { 
	font-weight:bold;
	font-size:1.1em;
}
/* footer */
p.footer {
	text-align:center;
	color:#fff;
	background-image:url("{T_THEME_PATH}/images/bg-footer.png");
	max-height: 70px;
	font-size:0.85em;
	padding:15px 10px;
	margin-top: 30px;
	margin-bottom:0;

	
}
p.footer a {
	color:#fff;
	border-bottom:none;
	text-decoration:underline;
}

/* search form */
form.searchform {
}


/* misc classes */
*:focus {
	outline:none;
}
.clear {
	clear:both;
}
i w "overall_header.html" znajdź i wytnij

Kod: Zaznacz cały

<div class="clear"></div>
wklej tutaj

Kod: Zaznacz cały

					<a href="kontakt"><img src="{T_THEME_PATH}/images/menu/1.png"
					onmouseover="this.src='{T_THEME_PATH}/images/menu/1a.png'" 
					onmouseout="this.src='{T_THEME_PATH}/images/menu/1.png'"
					border="0"></a>
			</ul>
		</div>
		<div class="clear"></div>
		</div>
	</div>
	<div class="wrapper">

Kokos
Posty: 149
Rejestracja: 20 grudnia 2008, 09:28

Re: Pare problemów w edycji stylu.

Post autor: Kokos » 27 kwietnia 2010, 22:35

Ok tylko ja już napisałem że to mam, ale widocznie ktoś to usunął z forum (może dlatego że post pod postem ;/


Ale dzięki :) Jak byś mi mógł pokazać za to jak usunąć tą niebieską ramkę z dołu każdego forum, bo jednak usunięcie samych boków kiepsko wygląda ;/ ?


I od razu możesz podać linka do swojego portfolio czy swojej strony? Chciałbym w ramach wdzięczności i poświęconego czasu wkleić link na forum :)

pit
Posty: 1580
Rejestracja: 25 lutego 2009, 18:15

Re: Pare problemów w edycji stylu.

Post autor: pit » 28 kwietnia 2010, 13:17

W "colours.css" ".forabg" ".forumbg"

Kod: Zaznacz cały

background-color:
zmień na "#fff".

Linka nie dam bo nie ma do czego, ale dzięki za chęci.

Kokos
Posty: 149
Rejestracja: 20 grudnia 2008, 09:28

Re: Pare problemów w edycji stylu.

Post autor: Kokos » 28 kwietnia 2010, 13:46

Noi o to chodziło :)


Mam jeszcze problem z:
footer jest zawsze 30 px od górnego bloku, a chce żeby był na samym dole. Mam margin-bottom:0 i jak ustawiam margin-top na auto to i tak jest źle.

Kod: Zaznacz cały

p.footer {
	text-align:center;
	color:#fff;
	background-image:url("{T_THEME_PATH}/images/bg-footer.png");
	max-height: 70px;
	font-size:0.85em;
	padding:15px 10px;
	margin-top: 30px;
	margin-bottom:0;

2. Gdy próbuje ukryć całego diva "userpanel" (taki div tła pod tekstem) to nie wiem czemu, ale niby diva nie widać, ale coś się psuje z logiem ;/

4. I mam pytanie jaki jest link do avatara usera? Chodzi mi o ten kod co jest też w każdym poście :)

pit
Posty: 1580
Rejestracja: 25 lutego 2009, 18:15

Re: Pare problemów w edycji stylu.

Post autor: pit » 28 kwietnia 2010, 18:04

footer jest zawsze 30 px od górnego bloku
Pewnie dlatego że ma "margin-top: 30px;".
Gdy próbuje ukryć całego diva "userpanel
Jak go ukrywasz i po co?
jaki jest link do avatara usera?
Zależy gdzie jest avatar, w galerii, w "images/avatars/upload, na fotosiku albo innym "imageshack'u" czy chgw gdzie jeszcze.
Generalnie to jest "{postrow.POSTER_AVATAR}"

Kokos
Posty: 149
Rejestracja: 20 grudnia 2008, 09:28

Re: Pare problemów w edycji stylu.

Post autor: Kokos » 28 kwietnia 2010, 18:20

footer nie od tego tak jest ;/ Bo usuwałem to itd itp ;/ Ale nim się nie będę przejmował. Widać to tylko wtedy jak strona jest bdb krótka np. przy wylogowywaniu.


Chce go ukryć ponieważ ma być to tło dla panelu usera zalogowanego tego typu jak:

* Zarządzaj profilem
* nowe wiadomości: 0
* Zobacz swoje posty
* Użytkownicy
* Wyloguj [ nameuser ]

Co nie jest widoczne dla niezalogowanego więc niezalogowany również ma nie widzieć tła :)
Jak ustawiam by się krył to logo się przesuwa na maxa w lewo za tą główną białą ramkę ;/


Jak możesz to napisz do mnie na gg 4433172 to włączę na chwile forum, zarejestruje jakiegoś usera testa i zobaczysz to :)


Za avka dzięki o to chodziło ;) Zaraz się będę i z tym męczył ;)

Kokos
Posty: 149
Rejestracja: 20 grudnia 2008, 09:28

Re: Pare problemów w edycji stylu.

Post autor: Kokos » 29 kwietnia 2010, 12:03

Już sobie poradziłem :) zakończenie diva mi wystawało po za widoczność tylko dla zarejestrowanych :P

Kokos
Posty: 149
Rejestracja: 20 grudnia 2008, 09:28

Re: Pare problemów w edycji stylu.

Post autor: Kokos » 05 maja 2010, 19:14

Nie wiem czemu, ale w niektórych miejscach zrobiło mi się nieestetyczna belka. Np tutaj: http://graforum.pl/phpBB3/memberlist.ph ... group&g=25

Jak potrzeba rejestracja to
hasło i nick: tester

pit
Posty: 1580
Rejestracja: 25 lutego 2009, 18:15

Re: Pare problemów w edycji stylu.

Post autor: pit » 06 maja 2010, 20:00

W "memberlist_body.html" coś Ci się urodziło.

Kod: Zaznacz cały

<td class="posts">{memberrow.HELPS}</td>

Kokos
Posty: 149
Rejestracja: 20 grudnia 2008, 09:28

Re: Pare problemów w edycji stylu.

Post autor: Kokos » 07 maja 2010, 09:35

To był help mod już go usunąłem. Mi chodzi o to nie estetyczne menu. najpierw jest tło, a potem kolor chce tylko tło mieć w tym miejscu ;/ Wcześniej tak miałem ale coś się zrypało i nie wiem co ;/

pit
Posty: 1580
Rejestracja: 25 lutego 2009, 18:15

Re: Pare problemów w edycji stylu.

Post autor: pit » 07 maja 2010, 14:25

W "simplecorp.css" znajdź

Kod: Zaznacz cały

div.forumbg-table {
	background:#fff none;
}
zmień na

Kod: Zaznacz cały

div.forumbg-table {
	background:none;
}
znajdź

Kod: Zaznacz cały

table tr th {
	background:#4086AA none repeat-x scroll bottom left;
	color:#ffffff;
	border-top:3px solid #2B5B78;
}
zmień na

Kod: Zaznacz cały

table tr th {
	background:none;
	color:#ffffff;
	border-top:3px solid transparent;
}

Zablokowany

Wróć do „Pomoc”