XenForo Hack Statüs Nasıl Yapılır? [Animasyonlu]

[XFB] Konu Bilgileri

Konu Hakkında Merhaba, tarihinde Xenforo kategorisinde root tarafından oluşturulan XenForo Hack Statüs Nasıl Yapılır? [Animasyonlu] başlıklı konuyu okuyorsunuz. Bu konu şimdiye dek 15 kez görüntülenmiş, 0 yorum ve 0 tepki puanı almıştır...
Kategori Adı Xenforo
Konu Başlığı XenForo Hack Statüs Nasıl Yapılır? [Animasyonlu]
Konbuyu başlatan root
Başlangıç tarihi
Cevaplar
Görüntüleme
İlk mesaj tepki puanı
Son Mesaj Yazan root
Kayıtlı
1 Yıl 4 Ay 16 Gün
Katılım
6 Şub 2024
Konular
35
Mesajlar
306
Rep
0
Tepkime puanı
1
Yaş
25
Konum
Kredi
bayram.moon
XenForo Hack Statüs Nasıl Yapılır? [Animasyonlu]
Demo
statüsalbat.gif
Widget/HTML: HTML tabanlı bir widget oluşturup şablon kısmına yapıştırın.
HTML:
<button class="hackstatus hackstatus-loader hackstatus-loader_xr icon-loader">Lorem Ipsum</button>
<button class="hackstatus hackstatus-undetected hackstatus-undetected_xr icon-undetected">Lorem Ipsum</button>
<button class="hackstatus hackstatus-detected hackstatus-detected_xr icon-detected">Lorem Ipsum</button>
<button class="hackstatus hackstatus-updating hackstatus-updating_xr icon-updating">Lorem Ipsum</button>
<button class="hackstatus hackstatus-public_beta hackstatus-public_beta_xr icon-public_beta">Lorem Ipsum</button>
<button class="hackstatus hackstatus-priv_beta hackstatus-priv_beta_xr icon-priv_beta">Lorem Ipsum</button>

Css: Extra.less şablonuna yapıştırın.
Kod:
CSS:
.hackstatus {
    border: none;
    font-family: inherit;
    font-size: inherit;
    color: inherit;
    background: none;
    cursor: pointer;
    padding: 25px 80px;
    display: inline-block;
    text-transform: uppercase;
    letter-spacing: 1px;
    font-weight: 700;
    outline: none;
    position: relative;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    transition: all 0.3s;
    margin: 2px;
}

.hackstatus:after {
    content: '';
    position: absolute;
    z-index: -1;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    transition: all 0.3s;
}

.hackstatus:before,
.icon-heart:after,
.icon-star:after,
.icon-plus:after,
.icon-file:before {
    font-family: 'icomoon';
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    position: relative;
    -webkit-font-smoothing: antialiased;
}

.icon-loader:before {
    font-family: 'Font Awesome 5 Pro';
    content: "\f019";
}

.icon-undetected:before {
    font-family: 'Font Awesome 5 Pro';
    content: "\f560";
}

.icon-detected:before {
    font-family: 'Font Awesome 5 Pro';
    content: "\f00d";
}

.icon-updating:before {
    font-family: 'Font Awesome 5 Pro';
    content: "\f361";
}

.icon-public_beta:before {
    font-family: 'Font Awesome 5 Pro';
    content: "\f3c2";
}

.icon-priv_beta:before {
    font-family: 'Font Awesome 5 Pro';
    content: "\f30d";
}
//--------------------------------------------------------------------------------------------
.hackstatus-undetected {
    background: #24522a;
    color: #fff;
    max-width: 100%;
    max-height: 40px;
    min-width: 100%;
    min-height: 40px;
    white-space: nowrap;
}

.hackstatus-undetected:hover {
    background: #24522ad9;
}

.hackstatus-undetected:active {
    background: #222627;
    top: 2px;
}

.hackstatus-undetected:before {
    position: absolute;
    height: 100%;
    left: 0;
    top: 0;
    line-height: 2;
    font-size: 140%;
    width: 60px;
}

.hackstatus-undetected_xr {
    padding: 10px 55px 8px 85px;
    border-radius: 10px;
}

.hackstatus-undetected_xr:before {
    background: #416145;
    color: #ffffff;
    z-index: 2;
    border-radius: 10px 0 0 10px;
}

.hackstatus-undetected_xr:after {
    width: 20px;
    height: 20px;
    background: #416145;
    z-index: 1;
    left: 55px;
    top: 50%;
    margin: -10px 0 0 -10px;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}

.hackstatus-undetected_xr:active:before {
    color: #CECED5;
}

.hackstatus-undetected_xr:active {
    top: 0;
}

.hackstatus-undetected_xr:active:after {
    left: 60px;
}
//--------------------------------------------------------------------------------------------
.hackstatus-detected {
    background: #9f0404;
    color: #fff;
    max-width: 100%;
    max-height: 40px;
    min-width: 100%;
    min-height: 40px;
    white-space: nowrap;
}

.hackstatus-detected:hover {
    background: #9f0404ad;
}

.hackstatus-detected:active {
    background: #222627;
    top: 2px;
}

.hackstatus-detected:before {
    position: absolute;
    height: 100%;
    left: 0;
    top: 0;
    line-height: 2;
    font-size: 140%;
    width: 60px;
}

.hackstatus-detected_xr {
    padding: 10px 55px 8px 85px;
    border-radius: 10px;
}

.hackstatus-detected_xr:before {
    background: #dc0d0d;
    color: #ffffff;
    z-index: 2;
    border-radius: 10px 0 0 10px;
}

.hackstatus-detected_xr:after {
    width: 20px;
    height: 20px;
    background: #dc0d0d;
    z-index: 1;
    left: 55px;
    top: 50%;
    margin: -10px 0 0 -10px;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}

.hackstatus-detected_xr:active:before {
    color: #CECED5;
}

.hackstatus-detected_xr:active {
    top: 0;
}

.hackstatus-detected_xr:active:after {
    left: 60px;
}
//--------------------------------------------------------------------------------------------
.hackstatus-updating {
    background: #ed900e;
    color: #fff;
    max-width: 100%;
    max-height: 40px;
    min-width: 100%;
    min-height: 40px;
    white-space: nowrap;
}

.hackstatus-updating:hover {
    background: #ed900eb8;
}

.hackstatus-updating:active {
    background: #222627;
    top: 2px;
}

.hackstatus-updating:before {
    position: absolute;
    height: 100%;
    left: 0;
    top: 0;
    line-height: 2;
    font-size: 140%;
    width: 60px;
}

.hackstatus-updating_xr {
    padding: 10px 55px 8px 85px;
    border-radius: 10px;
}

.hackstatus-updating_xr:before {
    background: #ff9c12;
    color: #ffffff;
    z-index: 2;
    border-radius: 10px 0 0 10px;
}

.hackstatus-updating_xr:after {
    width: 20px;
    height: 20px;
    background: #ff9c12;
    z-index: 1;
    left: 55px;
    top: 50%;
    margin: -10px 0 0 -10px;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}

.hackstatus-updating_xr:active:before {
    color: #CECED5;
}

.hackstatus-updating_xr:active {
    top: 0;
}

.hackstatus-updating_xr:active:after {
    left: 60px;
}
//--------------------------------------------------------------------------------------------
.hackstatus-public_beta {
    background: #1c3e5c;
    color: #fff;
    max-width: 100%;
    max-height: 40px;
    min-width: 100%;
    min-height: 40px;
    white-space: nowrap;
}

.hackstatus-public_beta:hover {
    background: #1c3e5cd1;
}

.hackstatus-public_beta:active {
    background: #222627;
    top: 2px;
}

.hackstatus-public_beta:before {
    position: absolute;
    height: 100%;
    left: 0;
    top: 0;
    line-height: 2;
    font-size: 140%;
    width: 60px;
}

.hackstatus-public_beta_xr {
    padding: 10px 55px 8px 85px;
    border-radius: 10px;
}

.hackstatus-public_beta_xr:before {
    background: #275277;
    color: #ffffff;
    z-index: 2;
    border-radius: 10px 0 0 10px;
}

.hackstatus-public_beta_xr:after {
    width: 20px;
    height: 20px;
    background: #275277;
    z-index: 1;
    left: 55px;
    top: 50%;
    margin: -10px 0 0 -10px;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}

.hackstatus-public_beta_xr:active:before {
    color: #CECED5;
}

.hackstatus-public_beta_xr:active {
    top: 0;
}

.hackstatus-public_beta_xr:active:after {
    left: 60px;
}
//--------------------------------------------------------------------------------------------
.hackstatus-priv_beta {
    background: #5b2180;
    color: #fff;
    max-width: 100%;
    max-height: 40px;
    min-width: 100%;
    min-height: 40px;
    white-space: nowrap;
}

.hackstatus-priv_beta:hover {
    background: #5b2180c2;
}

.hackstatus-priv_beta:active {
    background: #222627;
    top: 2px;
}

.hackstatus-priv_beta:before {
    position: absolute;
    height: 100%;
    left: 0;
    top: 0;
    line-height: 2;
    font-size: 140%;
    width: 60px;
}

.hackstatus-priv_beta_xr {
    padding: 10px 55px 8px 85px;
    border-radius: 10px;
}

.hackstatus-priv_beta_xr:before {
    background: #7524a9;
    color: #ffffff;
    z-index: 2;
    border-radius: 10px 0 0 10px;
}

.hackstatus-priv_beta_xr:after {
    width: 20px;
    height: 20px;
    background: #7524a9;
    z-index: 1;
    left: 55px;
    top: 50%;
    margin: -10px 0 0 -10px;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}

.hackstatus-priv_beta_xr:active:before {
    color: #CECED5;
}

.hackstatus-priv_beta_xr:active {
    top: 0;
}

.hackstatus-priv_beta_xr:active:after {
    left: 60px;
}
//--------------------------------------------------------------------------------------------
.hackstatus-loader {
    background: #222627;
    color: #fff;
    max-width: 100%;
    max-height: 40px;
    min-width: 100%;
    min-height: 40px;
    white-space: nowrap;
}

.hackstatus-loader:hover {
    background: #222627;
}

.hackstatus-loader:active {
    background: #222627;
    top: 2px;
}

.hackstatus-loader:before {
    position: absolute;
    height: 100%;
    left: 0;
    top: 0;
    line-height: 2;
    font-size: 140%;
    width: 60px;
}

.hackstatus-loader_xr {
    padding: 10px 55px 8px 85px;
    border-radius: 10px;
}

.hackstatus-loader_xr:before {
    background: #2d3335;
    color: #ffffff;
    z-index: 2;
    border-radius: 10px 0 0 10px;
}

.hackstatus-loader_xr:after {
    width: 20px;
    height: 20px;
    background: #2d3335;
    z-index: 1;
    left: 55px;
    top: 50%;
    margin: -10px 0 0 -10px;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}

.hackstatus-loader_xr:active:before {
    color: #CECED5;
}

.hackstatus-loader_xr:active {
    top: 0;
}

.hackstatus-loader_xr:active:after {
    left: 60px;
}
 

Create an account or login to comment

You must be a member in order to leave a comment

Create account

Create an account on our community. It's easy!

Log in

Already have an account? Log in here.

Üst
AdBlock Detected

We get it, advertisements are annoying!

Sure, ad-blocking software does a great job at blocking ads, but it also blocks useful features of our website. For the best site experience please disable your AdBlocker.

I've Disabled AdBlock    No Thanks