+- CemesiK (https://cemesik.7m.pl)
+-- Dział: Jak stworzyć własny Portal Społecznościowy (https://cemesik.7m.pl/forumdisplay.php?fid=15)
+--- Dział: Pliki i katalogi systemu zarządzania społecznością (https://cemesik.7m.pl/forumdisplay.php?fid=26)
+---- Dział: Temat systemu (https://cemesik.7m.pl/forumdisplay.php?fid=60)
+----- Dział: Główny arkusz stylów (https://cemesik.7m.pl/forumdisplay.php?fid=63)
+----- Wątek: Główny arkusz stylów (/showthread.php?tid=38)
Główny arkusz stylów - Admin - 05-08-2025
Ciało całej strony bez marginesów i wcięć oraz ustawienie czcionki .
Kod PHP:
body {
background-color: #ffffff;
padding: 0px;
margin: 0px;
font-size: 12px;
font-family: 'Trebuchet MS';
color: #1d2a5b;
}
Wszystkie tabelki będą wyrównane do lewej strony .
Kod PHP:
table {
text-align: left;
}
Każda komórka będzie posiadała tekst wyrównany do góry .
Kod PHP:
td {
vertical-align: top;
}
Nagłówki stopnia pierwszego i drugiego .
Kod PHP:
h1 {
font-size: 16px;
color: #1c2a47;
padding: 0px;
margin: 0px;
padding-top: 5px;
padding-left: 5px;
}
h2 {
font-size: 14px;
background-color: #2C3852;
color: #ffffff;
padding: 5px;
}
Formatowanie hiperłączy , które znajdują się w nagłówkach .
Kod PHP:
h2 a {
font-size: 14px;
background-color: #2C3852;
color: #ffffff;
padding: 5px;
text-decoration: none;
}
h2 a:hover {
font-size: 14px;
background-color: #2C3852;
color: #ffffff;
padding: 5px;
text-decoration: none;
}
h2.special_header_ogloszenie {
font-size: 14px;
background-color: #ffffff;
color: #2C3852;
padding: 5px;
padding-bottom: 0px;
border-bottom: solid 1px #2C3852;
}
h2.special_header_ogloszenie a {
font-size: 14px;
background-color: #ffffff;
color: #2C3852;
padding: 5px;
padding-bottom: 0px;
}
Komórka tabelki będąca jej nagłówkiem .
Kod PHP:
td.header {
background-color: #336699;
color: #ffffff;
padding: 5px;
font-size: 12px;
white-space: nowrap;
}
Cztery komórki z różnymi kolorami tła , aby lepiej wyróżnić poszczególne rekordy .
Kod PHP:
td.cell_1 {
background-color: #C9D0D6;
padding: 5px;
font-size: 12px;
vertical-align: middle;
}
td.cell_2 {
background-color: #F7F8FA;
padding: 5px;
font-size: 12px;
vertical-align: middle;
}
td.td_row1 {
background-color: #C9D0D6;
padding: 5px;
font-size: 12px;
vertical-align: middle;
}
td.td_row2 {
background-color: #F7F8FA;
padding: 5px;
font-size: 12px;
vertical-align: middle;
}
Nagłówki zawarte w specjalnych komórkach .
Kod PHP:
td.td_row1_head {
background-color: #efefef;
}
td.td_row1_head h3 {
padding: 2px;
margin: 0px;
}
td.td_row1_body {
border-bottom: solid 1px #EB5126;
padding-top: 2px;
padding-bottom: 2px;
}
Komórka z pogrubionym tekstem .
Kod PHP:
td.bold_row {
font-weight: bold;
color: #EB5126;
}
Warstwy przedstawiające informacje otrzymane przez użytkownikaod systemu .
Kod PHP:
div.success {
padding: 2px;
text-align: center;
background-color: #C8CFD5;
font-size: 12px;
color: #3b5998;
padding: 5px;
margin: 5px;
}
div.warning {
padding: 2px;
text-align: center;
border: solid 1px #EB5126;
background-color: #ffffff;
font-size: 12px;
color: #EB5126;
padding: 5px;
margin: 5px;
}
div.important {
padding: 2px;
text-align: center;
background-color: #C8CFD5;
font-size: 12px;
color: #3b5998;
padding: 5px;
margin: 5px;
}
div.city_box {
padding: 2px;
margin-left: 15px;
margin-right: 15px;
margin-bottom: 30px;
}
Domyślne formatowanie wszystkich hiperłączy na stronie .
Kod PHP:
a {
font-size: 12px;
color: #3b5998;
text-decoration: none;
}
a:hover {
font-size: 12px;
color: #3b5998;
text-decoration: underline;
}
Linki znajdujące się w górnej części strony (menu) .
Kod PHP:
a.up_menu {
font-size: 12px;
color: #92AABC;
text-decoration: none;
}
a.up_menu:hover {
font-size: 12px;
color: #3b5998;
text-decoration: underline;
}
Domyślne formatowanie dla obrazu .
Kod PHP:
img {
border: 0px;
}
Informacje o logowaniu i jego rezultacie .
Kod PHP:
div.list_pages {
border: solid 1px #EB5126;
padding-bottom: 2px;
padding-top: 2px;
margin-left: 20px;
margin-right: 20px;
}
span.promo_bar {
padding: 5px;
border: solid 1px #600000;
}
span.span_bad_login {
background-color: #ffffff;
color: #000000;
padding: 2px;
}
Formatowanie pól formularza .
Kod PHP:
input {
border-width: 1px;
border-style: solid;
border-color: #1d2a5b;
padding: 2px;
}
input.file_upload {
border-width: 1px;
border-style: solid;
border-color: #1d2a5b;
padding: 2px;
}
Przycisk Zatwierdź .
Kod PHP:
input.submit_button {
border-width: 1px;
border-style: solid;
border-top-color: #29447e;
border-bottom-color: #29447e;
border-left-color: #29447e;
border-right-color: #29447e;
padding-left: 5px;
padding-right: 5px;
background-color: #637bad;
font-weight: bold;
color: #ffffff;
font-size: 12px;
padding-top: 1px;
padding-bottom: 3px;
}
table.table_body input, textarea, select {
border-width: 1px;
border-style: solid;
border-color: #96a6c5;
padding: 2px;
}
Przycisk służący do rejestracji na naszej stronie .
Kod PHP:
input.input_register {
border-width: 1px;
border-style: solid;
border-color: #96a6c5;
padding: 5px;
}
Domyślny przycisk służący do wykonywania akcji .
Kod PHP:
input.input_button_submit {
border-width: 1px;
border-style: solid;
border-color: #3b6e22;
padding-left: 5px;
padding-right: 5px;
background-color: #74ad5a;
font-weight: bold;
color: #ffffff;
font-size: 12px;
}
Przycisk służący przechodzeniu do określonej części aplikacji .
Kod PHP:
input.button_goto {
border-width: 1px;
border-style: solid;
border-color: #3b6e22;
padding-left: 5px;
padding-right: 5px;
background-color: #74ad5a;
font-weight: bold;
color: #ffffff;
font-size: 12px;
padding-top: 5px;
padding-bottom: 5px;
}
Zatwierdzanie wysyłania wiadomości do serwera .
Kod PHP:
button.button_goto_send {
border-width: 1px;
border-style: solid;
border-color: #3b6e22;
padding-left: 5px;
padding-right: 5px;
background-color: #74ad5a;
font-weight: bold;
color: #ffffff;
font-size: 12px;
}
Nagłówek oraz komórki tabeli znajdujące się w menu .
Kod PHP:
div.heading_row {
width: 100%;
height: 23px;
background-image: url('fb_images/row.png');
}
td.fb_header {
background-color: #3b5998;
padding: 5px;
color: #ffffff;
font-weight: bold;
}
td.fb_row_1 {
padding: 5px;
background-color: #ffffff;
}
td.fb_row_2 {
padding: 5px;
background-color: #eceef4;
}
td.fb_row_underline {
padding: 5px;
background-color: #ffffff;
border-bottom: solid 1px #eceef4;
}
Nagłówki będące w komórkach tabel .
Kod PHP:
td.fb_header_info {
background-color: #3b5998;
padding: 5px;
color: #ffffff;
font-weight: bold;
}
td.fb_header_info h2 {
color: #ffffff;
padding: 0px;
margin: 0px;
background-color: #3b5998;
}
Informacje formatujące pozycję menu bocznego .
Kod PHP:
div.menu_option {
background-color: #eceef4;
padding: 5px;
margin-top: 2px;
margin-bottom: 2px;
border-left: solid 3px #B5B5B5;
}
div.menu_option_selected {
background-color: #2F4F4F;
padding: 5px;
margin-top: 2px;
margin-bottom: 2px;
border-left: solid 3px #919191;
}
div.menu_option_selected a {
color: #ffffff;
}
div.menu_option_br {
height: 10px;
}
Komórki tabel do formatowania opcji publikacji treści .
Kod PHP:
td.publish_item {
background-color: #3B5998;
color: #ffffff;
text-align: center;
}
a.publish_item_link {
background-color: #ffffff;
padding-left: 15px;
padding-right: 15px;
}
a.publish_item_link_select {
background-color: #3B5998;
color: #ffffff;
padding-left: 15px;
padding-right: 15px;
padding-top: 2px;
padding-bottom: 2px;
}
Informacje o publikacji informacji na stronie głównej .
Kod PHP:
span.status_is_published {
padding: 2px;
margin: 3px;
border: solid 1px #FBC834;
}
span.published_date {
color: #404040;
}
Sformatowanie komentarzy wystawianych przez użytkowników .
Kod PHP:
td.comm_title {
background-color: #B5B5B5;
color: #335599;
padding: 2px;
font-size: 10px;
}
td.comm_title a {
color: #335599;
font-size: 10px;
}
td.comm_body {
padding: 2px;
}
td.comm_foot {
font-size: 10px;
color: #336699;
text-align: right;
background-color: #C9C9C9;
padding: 2px;
}
td.comm_post {
background-color: #EBEBEB;
padding: 3px;
}
Menu wraz z linkami znajdującymi się w komórkach tabel .
Kod PHP:
td.top_menu_td a {
color: #ffffff;
font-weight: bold;
text-decoration: none;
}
td.top_menu_link {
color: #ffffff;
font-weight: bold;
text-decoration: none;
}
td.top_menu_link:hover {
color: #ffffff;
font-weight: bold;
text-decoration: underline;
}