Witam,

Przybierałem się ostatnio do ujednolicenia wykonywanych projektów od strony panelu ale przybranie się było ciężkie. Od wczoraj siedzę przeziębiony w domu więc postanowiłem jakoś ten czas wykorzystać.

I zmusiłem się wreszcie do stworzenia panelu administracyjnego, który obsługiwałby wszystkie funkcje zarządzania. Staram się więc stworzyć obsługę wszystkich elementów żeby w przyszłości już nic nie dorabiać.
Zastanawiam się nad zwijaniem i rozwijaniem poszczególnych bloków w lewej kolumnie, ale czy jest sense ukrywania pozostałych elementów przy jednym aktywnym?

Więc proszę o ogólne oceny, porady, jak również informacje o tym, co jeszcze powinienem dodać żeby za jakiś czasu nie było niespodzianki

http://kilab.pl/tmp/panel/

PS. Zamierzam udostępnić layout za darmo, jak tylko go skończę, więc jeśli ktoś byłby chętny, za kilka dni będzie można pobrać

Szczerze mi sie nawet podoba ale musialbym go poddac delikatnemu tuningowi :-)
A co do rozwijanych belek po lewej to jak najbardziej poniewaz jak bedzie wiecej modulow to delikanty syf i chaos sie zrobi
Hmm komunikaty error,success i warning chyba z Magento zaporzyczyles ?

Jezeli wydasz wersje finalna to z checia zaimplementuje w moim przyszlym Panelu ktory z biegiem wolnego czasu powoli buduje :-)

Z tabelkami masz rację, na razie nie przewiduję więcej opcji, ale jednak z czasem może się nazbierać. Do zrobienia

Z Magento nigdy styczności nie miałem, ale taki styl jak ja zrobiłem jest dość popularny, szczególnie ikony FamFam ;P

W kazdym badz razie czekam na finala Fajnie ze udostepniasz ...

Możesz dać paczkę tych ikon? Czy to są z
http://www.famfamfam.com/lab/icons/

Tylko przerobione na 1 kolor?

Początkowo były FamFam (zostały przy ostrzeżeniach), ale wgrałem nowe z http://pc.de/icons/

Przy okazji, bloki w lewej kolumnie schowane

http://screenup.pl/?l=6LG4TMW

Pomarańczowe cyfry do wymiany lub do zrobienia czegoś z nimi, są nie czytelne i krzywo "poupychane", popraw bo szkoda. Ogólnie w dobrą stronę, ale za mało pokazujesz - przemyśl co jeszcze by się przydało, jakiś edytor wizualny skrojony do potrzeb, może jakieś "wielo-ikonowe" pole, tabele itd. Dodatkowo popracował bym z formami tab by jakoś je zmienić, pola do jednokrotnego wyboru mogły by być jednym blokiem tak jak na tel z andkiem lub jabłkiem takie połączone tak i nie i suwak jako całość który się przesuwa i pod zaznacza wybraną opcję. Ogólnie to co masz to początek i to dobry! :-)

O właśnie, tabeli brakuje! Dodane do kolejki, formularze też przerobię bo coś mi nie gra w nich, elementy stronicowania

Edytor odpuszczę sobie bo nie chcę nikomu narzucać żadnego konkretnego jeśli skorzysta z szablonu. Poprawię tylko te formy.

ShadowD, możesz wyjaśnić co miałem na myśli z:

Trochę otępiony jestem I przy okazji z jakiej przeglądarki korzystasz bo zauważyłem na screenie, że napis na nagłówku boxa nie jest na środku

Jestem też ciekaw jak to wygląda pod Windowsem, IE to pewnie wcale zabił układ Nie mam niestety i na razie jeszcze nie sprawdzałem

Ale to wieczorem, dzisiaj pokorzystam trochę z pogody

Ff.11 pod win

Dzięki

Tabele zrobione, formularz poprawiony, strona logowania: http://kilab.pl/tmp/panel/login.html

Wciąż czekam na kolejne sugestie

Dla niektórych buttonów masz podkreślenie na hover, a na innych nie - popraw, mi leży lepiej brak podkreślenia.

Inny kolor podświetlenie wiersza w tabeli (hover) lub dla 2n daj mniej szary, osobiści zastosował bym oba - zmniejszył odcień szarości (powinno tylko lekko się wyróżniać) a podświetlenie może lekki żółty?

Dodatkowo może czas na logo?

Podkreślenie buttonów mi umknęło, raz jeszcze dzięki

Poprawiłem też te tła dla komórek, faktycznie za duży kontrast był. A z tym logo to, że wstawić czy jak?

Kilab, wykonujesz kawał dobrej roboty jest po prostu hipnotajzing. Czekam na download.

Właściwie to już można pobrać tutaj, jak coś dorobię to poinformuję

No mi się podoba pięknie pobrałem własnie. Mógłbyś podpowiedzieć jaką funkcje użyłeś aby zrobić to pokaż/ukryj w menu?

A dziękuję

Do ukrycia wszystkich boksów funkcja hide, do pokazania boksu aktywnej strony analogicznie funkcja show
A po kliknięciu to już tylko slideToggle

Pobrane i użyte w projekcie

Bardzo fajne i przejrzyste.
Moja propozycja to zapamiętywanie rozwiniętej sekcji z lewej strony.
Można to zrobić spokojnie w samym jQuery i dodać jako integralną część szablonu.
W tym momencie rozwijanie zawsze pierwszej sekcji jest po kilku minutach troszkę denerwujące.

Jak nie będziesz miał na to czasu to na pewno sam takową funkcje dopiszę.

@markonix, rozwijanie boksa zrobiłem w php, rozwija się sekcja dla danej strony, inaczej się nad tym nie zastanawiałem. Dla mnie o coś takiego chodziło i tak zrobiłem

Wydaje mi się, że elastyczniejsze jest zrobiebienie tego po stronie frontendu.
Poza tym ublubiona zakładka zawsze będzie rozwinięta nawet po kilku dniach oraz od razu funkcjonalność będzie wbudowana w szablon.

Można też połączyć obie metody ale to już by była przesada.
Jedyny minus jaki mi przychodzi do głowy na rzecz PHP to wejście na konkretną podstronę prosto z historii - choć to też można by obsłużyć

Możesz pokazać kod PHP, którym "otwierasz" zakładki?

[PHP] pobierz, plaintext 
<script type="text/javascript">
$(function(){
 
	$(".box .h_title").not(this).next("ul").hide("normal");
 
	var cookie = $.cookie('menu_array');
	if (cookie != null) {
		$('.box ul').each(function(index) {
			if (cookie.match('-' + index + '-')) {
	    	$(this).show('normal');
	    }
		});		
	} else {
		$(".box .h_title").not(this).next("#home").show("normal");
	}
 
	$(".box").children(".h_title").click( function() { 
		$(this).next("ul").slideToggle(function() {		
			var cookie = '';
			$('.box ul').each(function(index) {
		    if ($(this).is(':visible'))
		    	cookie = cookie + '-' + index + '-' ;
			});			
			$.cookie('menu_array', cookie, { expires: 31 });				
		});
	});
 
});
</script>
[PHP] pobierz, plaintext 

Plugin do ciasteczek:
https://github.com/carhartl/jquery-cookie/b...query.cookie.js

Każda lista (ul) w bloku ma id. Pobieram id strony z adresu i switchem sprawdzam aktualną sekcję.

[PHP] pobierz, plaintext 
<script type="text/javascript">
$(function(){
	$(".box .h_title").not(this).next("ul").hide("normal");
	<?php
	switch($modul){
		case 'informacje' : $modul_a = $modul; break;
		case 'ogloszenia' : $modul_a = $modul; break;
		case '...' : $modul_a = $modul; break;
		case '...' : $modul_a = $modul; break;
		default : $modul_a = 'home'; break;
	}
	?>
	$(".box .h_title").not(this).next("#<?=$modul_a ?>").show("normal");
	$(".box").children(".h_title").click( function() { $(this).next("ul").slideToggle(); });
});
</script>
[PHP] pobierz, plaintext 

Moje rozwiązanie opiera się na indeksach numerycznych i dzięki temu nie trzeba każdorazowo edytować pliku widoku przy zmianie adresu, a dodanie nowej sekcji też nie rodzi konieczności dodawania identyfikatora.

Poza tym jak się domyślam Twój sposób działa głównie na przyjaznej strukturze linków:

Użytkownik:
strona.pl/uzytkownik/dodaj
strona.pl/uzytkownik/usun

Ogłoszenie:
strona.pl/ogloszenie/dodaj
strona.pl/ogloszenie/usun

Przy strukturalnej stronie może być ciężko prawidłowo to obsłużyć.

Ps. Oczywiście, ten kod JS możesz dodać do Twojego projektu.

Projekt fajny ciekaw tylko jestem czy jak byś zamiast czarnego dał ciemniejszy szary od tego w tle to by wyglądało bardziej slitasnie
A no i jak zaczołeś szeroko tak może i skończ szeroko? Ot takie moje pytanie.

[HTML] pobierz, plaintext 
#content tr:nth-child(even), #content li:nth-child(even){
	background: #ffffff;
}
#content tr:nth-child(odd), #content li:nth-child(odd){
	background: #f7f7f7;
}
[HTML] pobierz, plaintext 

Proponuje promować nowe rozwiązania, a jakże elastyczne zwłaszcza gdy zaczniemy generować tabele dynamicznie
(niepotrzebna robota aby ostylować co drugi wiersz). Panel admina jest na tyle specyficzną stroną, że nie trzeba tam wspierać przestarzałych przeglądarek.
Przykładowo w PA WordPressa jeżeli masz starą przeglądarkę otrzymujesz komunikat o tym.

nth-child obsługują wszystkie nowe przeglądarki wraz z IE.

Sugestia aby uzupełnić index o przykład listy wypunktowanej i numerycznej.

Dzięki markonix za wskazówkę, nie znałem tego sposobu a fakt, lepszy od mojego, sięgającego czasy phpbb Oczywiście zmienione i podmieniona paczka na stronie

Listy w indexie i demie wstawione.

Lion_87 możesz inaczej napisać o tej szerokości bo nie zrozumiałem

Całkiem ładnie. Mi osobiście się podoba.

Temat spadł niżej, ale pamiętam o nim i pozwolę sobie wtrącić uwagę - lepiej byłoby gdybyś na elementy nakład klasy zamiast bezpośrednio definiować na nich style.
Na przykład w tej chwili używam tabeli do wyświetlania danych, ale potrzebuje wewnątrz tabeli stworzyć następną tabelę - i teraz przyjmuje mi wartości (margin, padding, background, itd) z głównej tabeli.

Od taka moja uwaga - jeśli coś takiego padło to sorry.
Wersja zademonstrowana w pierwszym poście to wersja finalna? czy będzie jakiś update?

@wujek2009, dzięki za uwagę.

Wersja z pierwszego posta to wersja na chwilę obecną finalna. Jeśli jednak znajdę czas i wykonam większe poprawki, zaktualizuję ją.

Możliwe, że podejście zaprezentowane przez Ciebie odnośnie styli jest lepsze. Ja nigdy z tym problemu nie miałem więc definiowałem styl dla elementów. W wolnej chwili postaram się to poprawić

Ja mam tylko dwie uwagi:
- dlaczego w formularzu po wpisaniu tekstu zostaje czerwona obwódka, a w select jej w ogóle nie ma?
- do menu po najechaniu (sama góra) - podziel je na "płytki", bo czasem trudno namierzyć czysty tekst

Dzięki HgReed za wskazówki. Obramowanie dla selecta poprawiłem, wkrótce też poprawię te menu

Jak tam, rozwijasz jeszcze jakoś ten szablon?

Niestety, umarł śmiercią naturalną i został porzucony na rzecz Bootstrapa.

Osobiście z niego korzystam Czasem fajnie oprzeć się o coś "niebootsrapowego"