Webboard

wersja skryptu MyBB: 1.6.9
adres forum: FerryCraft!
na czym polega problem (screen, opis, komunikaty, nazwa stylu/theme/szablonu): Witam. Nie będę owijał w bawełnę i przechodzę do sedna. Jak zrobić taki status online jak na szablonach pixelmonkey? Mam dostęp do jednego (DEMO) i po kopiowałem rzeczy lecz nic nie wyszło.
A wygląda to tak:

Klasy CSS:

Kod:
.online {

color: 

white;

background: 

#A2CE46;

padding: 1px 2px;

text-shadow: 1px 1px 1px 

#A5B492;

border-radius: 3px;

font-size: 11px;

}

.statusinfo {background: #D9E697;

border: 1px solid #B8C77B;

padding: 2px;

font-size: 11px;

border-radius: 3px;

margin-left: 4px;

color: #6C772F;}

Szablon member_profile_online:

Kod:
<a href="online.php"><span class="online userprofile_status" style="font-weight: bold;">{$lang->postbit_status_online}</span></a><span class="statusinfo"> ({$location} @ {$location_time})</span>

Headerinclude:

Kod:
<link rel="alternate" type="application/rss+xml" title="{$lang->latest_threads} (RSS 2.0)" href="{$mybb->settings['bburl']}/syndication.php" />

<link rel="alternate" type="application/atom+xml" title="{$lang->latest_threads} (Atom 1.0)" href="{$mybb->settings['bburl']}/syndication.php?type=atom1.0" />

<meta http-equiv="Content-Type" content="text/html; charset={$charset}" />

<meta http-equiv="Content-Script-Type" content="text/javascript" />

<script type="text/javascript" src="{$mybb->settings['bburl']}/jscripts/prototype.js?ver=1603"></script>

<script type="text/javascript" src="{$mybb->settings['bburl']}/jscripts/general.js?ver=1603"></script>

<script type="text/javascript" src="{$mybb->settings['bburl']}/jscripts/popup_menu.js?ver=1600"></script>

<script type="text/javascript" src="{$mybb->settings['bburl']}/jscripts/searchmenu.js?ver=1600"></script>

<script type="text/javascript" src="{$mybb->settings['bburl']}/jscripts/pixelmon.js"></script> 

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>

<script type="text/javascript">jQuery.noConflict();</script>

{$stylesheets}

<script type="text/javascript">

<!--

    var cookieDomain = "{$mybb->settings['cookiedomain']}";

    var cookiePath = "{$mybb->settings['cookiepath']}";

    var cookiePrefix = "{$mybb->settings['cookieprefix']}";

    var deleteevent_confirm = "{$lang->deleteevent_confirm}";

    var removeattach_confirm = "{$lang->removeattach_confirm}";

    var loading_text = '{$lang->ajax_loading}';

    var saving_changes = '{$lang->saving_changes}';

    var use_xmlhttprequest = "{$mybb->settings['use_xmlhttprequest']}";

    var my_post_key = "{$mybb->post_code}";

    var imagepath = "{$theme['imgdir']}";

// -->

</script>

{$newpmmsg}

<script type="text/javascript" src="{$mybb->settings['bburl']}/jscripts/usertabs.js">

/***********************************************

* Tab Content script v2.2- © Dynamic Drive DHTML code library (www.dynamicdrive.com)

* This notice MUST stay intact for legal use

* Visit Dynamic Drive at http://www.dynamicdrive.com/ for full source code

***********************************************/

</script>

Rozwiązałem! Użyłem do tego tylko i wyłącznie CSS!

O to rozwiązanie:

CSS:

Kod:
.statusinfo {

    font-size:11px;

    background:white;

    border-radius:3px;

    padding: 2px 4px;

    color:#222;

    opacity:0;

    -webkit-transition:0.3s;

    transition:0.3s;

    -o-transition:0.3s;

    -ms-transition:0.3s;

    -moz-transition:0.3s;

    box-shadow: 1px 1px 1px #333;

    margin-left: 10px;

}

.online2 {

color: #FFFFFF;

}

.online2:hover .statusinfo {

    opacity:1;

}

Szablon member_profile_online:

Kod:
<span class="online2">

<a href="online.php"><span class="online userprofile_status" style="font-weight: bold;">{$lang->postbit_status_online}</span></a><span class="statusinfo"> ({$location} @ {$location_time}

</span></span>

GiboneKPL