Poradnik tworzenia kompozycji dla AQQ 2

Kontakt zwykły

Do góry |

Indeks |

Link

"../Standard/Contacts/Body.htm"

1. Tło:

.finito_out {

border-bottom: 1px solid #3b4458;
background-color: transparent;
height: auto;
table-layout: fixed;

}

2. Tło po najechaniu na kontakt kursorem myszy:

.finito_in {

border-bottom: 1px solid #3b4458;
background-color: #11131d;
height: auto;
table-layout: fixed;

}

3. Ikona stanu:

.showtype {

width: 19px;
padding: 2px 1px 1px 2px;

}

4. Nick:

.buddy {

cursor: default;
white-space: pre;
font-family: Tahoma;
font-weight: bold;
font-size: 11px;
color: white;
word-wrap: break-word;

}

5. Jabber ID:

.buddy_jid {

cursor: default;
width: 100%;
white-space: pre;
font-family: Tahoma;
font-weight: normal;
font-size: 9px;
color: #5b786e;
margin: 2px 0px;

}

6. Opis:

.status {

word-wrap: break-word;
cursor: default;
width: 100%;
font-family: Tahoma;
font-size: 9px;
color: whitesmoke;
font-weight: normal;

}

Zobacz też: Zawijanie opisów przy zainstalowanej przeglądarce Internet Explorer 8.

7. Ikony metakontaktów:

.showtypemeta {

white-space: pre;
float: right;
margin: 0px 0px 1px 0px;

}

.showtypemeta img {

margin-right: 2px;

}

Uwaga!

Selektor .showtypemeta img służy do określania parametrów pojedynczej ikony metakontaktu.

8. Awatar:

.avatar {

width: 32px;
text-align: right;
padding: 1px 0px 0px 2px;
margin: 0px;
cursor: hand;
float: right;

}

Uwaga!

Grafika odpowiedzialna za domyślny awatar znajduje się w folderze Graphics.

Zobacz też: Jak poprawić błąd z wyświetlaniem awatara?

Kontakt zwykły

Do góry |

Indeks |

Link

"../Standard/Contacts/Item.htm"

Uwaga!

Wygląd kontaktu na liście jest zrealizowany przy pomocy tabeli. Na powyższym obrazku widoczność tabeli została włączona.

<table class="finito_out"

cellpadding="0"
cellspacing="0"
onmousemove="window.status='CC_OVERITEM'"
onmouseover="this.className='finito_in'"
onmouseout="this.className='finito_out';
window.status='CC_NONE';"
ondblclick="window.status='CC_EXECUTE'"
onClick="window.status='CC_SELECTED'">

<tr class="item_row" align="left" valign="top">

<td rowspan="2" class="showtype">CC_SHOWTYPE</td>
<td valign="top">
<span class="showtypemeta">CC_META</span>
<span class="buddy">CC_NICKNAME</span>
</td>

</tr>
<tr>

<td class="status">CC_STATUS</td>

</tr>

</table>

CC_SHOWTYPE
CC_AVATAR
CC_META
CC_NICKNAME
CC_JID
CC_STATUS

ikona stanu.
awatar użytkownika.
ikony metakontaktów.
nick.
Jabber ID.
opis.

Zobacz też:

Jak wyłączyć wyświetlanie Jabber ID na liście?
Jak wyłączyć awatar na liście?

Kontakt zazanaczony

Do góry |

Indeks |

Link

"../Standard/Contacts/Body.htm"

1. Tło:

.selected {

border-bottom: 1px solid #3b4458;
background-color: #0e2d49;
height: auto;
table-layout: fixed;

}

Uwaga!

Pozostałe elementy konfiguruje się tak samo jak w przypadku kontaktu zwykłego.

Kontakt zazanaczony

Do góry |

Indeks |

Link

"../Standard/Contacts/Selected.htm"

<table class="selected"

cellpadding="0"
cellspacing="0"
onmousemove="window.status='CC_OVERITEM'";
window.status='CC_NONE';"
ondblclick="window.status='CC_EXECUTE'">

<tr class="item_row" align="left" valign="top">

<td rowspan="2" class="showtype">CC_SHOWTYPE</td>
<td valign="top">
<span class="showtypemeta">CC_META</span>
<span class="buddy">CC_NICKNAME</span>
</td>
<td rowspan="2" onclick="window.status='CC_EXECAVATAR'" class="avatar">CC_AVATAR</td>

</tr>
<tr>

<td class="status">CC_STATUS</td>

</tr>

</table>

CC_SHOWTYPE
CC_AVATAR
CC_META
CC_NICKNAME
CC_JID
CC_STATUS

ikona stanu.
awatar użytkownika.
ikony metakontaktów.
nick.
Jabber ID.
opis.

Kontakt po zmianie stanu

Do góry |

Indeks |

Link

"../Standard/Contacts/Body.htm"

1. Tło:

.light {

border-bottom: 1px solid #3b4458;
background-color: #0b3d32;
height: auto;
table-layout: fixed;

}

Uwaga!

Pozostałe elementy konfiguruje się tak samo jak w przypadku kontaktu zwykłego.

Kontakt po zmianie stanu

Do góry |

Indeks |

Link

"../Standard/Contacts/Light.htm"

<table class="light"

cellpadding="0"
cellspacing="0"
onmousemove="window.status='CC_OVERITEM'";
window.status='CC_NONE';"
ondblclick="window.status='CC_EXECUTE'"
onClick="window.status='CC_SELECTED'">

<tr class="item_row" align="left" valign="top">

<td rowspan="2" class="showtype">CC_SHOWTYPE</td>
<td valign="top">
<span class="showtypemeta">CC_META</span>
<span class="buddy">CC_NICKNAME</span>
</td>

<tr>

<td class="status">CC_STATUS</td>

</tr>

</table>

CC_SHOWTYPE
CC_AVATAR
CC_META
CC_NICKNAME
CC_JID
CC_STATUS

ikona stanu.
awatar użytkownika.
ikony metakontaktów.
nick.
Jabber ID.
opis.

Poprzednia strona

Następna strona