MyBB Çözümleri & İpuçları ve Modifikasyonları

[Modifikasyon] Mybb Css Rank Yapımı

WZ ᴮᴼᵀ² tarafından yazıldı, , Konu ID:366

http://warezzers.net/uploads/avatars/avatar_58.gif?dateline=1632245624
WareZZersBot
Seviye:
3
Gönderileri:
143
Beğenileri:
20
Rep Puanı:
15
Kredi:
559
10.07.2021, 21:52
Son Düzenleme: 29.08.2021, 01:17, Düzenleyen: Scorpion.
#1
Ön izleme:
[Resim: cjtopsv.png]

Şablon Kodu:
Kod:
<div class="admin" title="Kurucu">Administrator</div>
<div class="yonetici" title="Yönetici">Yönetici</div>
<div class="smod" title="Süper Mod">Süper Moderatör</div>
<div class="grafiker" title="Tasarımcı">Grafiker</div>
<div class="mod" title="Moderatör">Moderatör</div>
<div class="dmod" title="Deneme Mod.">Deneme Mod.</div>
<div class="vip" title="Vip Üye">Destekçi Üye</div>
<div class="uye" title="Forum Üyesi">Forum Üyesi</div>


CSS:
Alıntı:body{
    background: #1b1f27;
    font-family: 'Open Sans', sans-serif;
}

h1{
  color:#fff;
  text-align: center;
  padding: 20px;
}

.admin {
    background: linear-gradient(to right, rgba(176,53,56,1) 0%,rgba(220,89,89,1) 50%,rgba(176,53,56,1) 100%);
    margin-top: 10px !important;
      width: 189px;
    padding: 6px 0px;
    margin: auto;
    border-radius: 4px;
    font-size: 11px;
    font-family: 'Trebuchet MS';
    text-shadow: 1px 1px 1px #333;
    color: #fff;
    text-align: center;
    letter-spacing: 2px;
    text-transform: uppercase;
    border-bottom: 2.5px solid #b03839;
      opacity: 0.5;
      transition: all 800ms cubic-bezier(0.390, 0.500, 0.150, 1.360);
}

.admin:hover {
    margin-top: 10px !important;
    width: 189px;
    padding: 6px 0px;
    margin: auto;
    border-radius: 4px;
    font-size: 11px;
    font-family: 'Trebuchet MS';
    text-shadow: 1px 1px 1px #333;
    color: #fff;
    text-align: center;
    letter-spacing: 2px;
    text-transform: uppercase;
    border-bottom: 2.5px solid #b03839;
      opacity: 1;
      transition: all 800ms cubic-bezier(0.390, 0.500, 0.150, 1.360);
}


.vip {
    background: linear-gradient(to right, rgba(211,183,31,1) 0%,rgba(217,196,85,1) 50%,rgba(211,183,31,1) 100%);
    margin-top: 10px !important;
      width: 189px;
    padding: 6px 0px;
    margin: auto;
    border-radius: 4px;
    font-size: 11px;
    font-family: 'Trebuchet MS';
    text-shadow: 1px 1px 1px #333;
    color: #fff;
    text-align: center;
    letter-spacing: 2px;
    text-transform: uppercase;
    border-bottom: 2.5px solid #aa9317;
      opacity: 0.5;
      transition: all 800ms cubic-bezier(0.390, 0.500, 0.150, 1.360);
}

.vip:hover {
      background: linear-gradient(to right, rgba(211,183,31,1) 0%,rgba(217,196,85,1) 50%,rgba(211,183,31,1) 100%);
    margin-top: 10px !important;
      width: 189px;
    padding: 6px 0px;
    margin: auto;
    border-radius: 4px;
    font-size: 11px;
    font-family: 'Trebuchet MS';
    text-shadow: 1px 1px 1px #333;
    color: #fff;
    text-align: center;
    letter-spacing: 2px;
    text-transform: uppercase;
    border-bottom: 2.5px solid #aa9317;
      opacity: 1;
      transition: all 800ms cubic-bezier(0.390, 0.500, 0.150, 1.360);
}

.smod {
    background: linear-gradient(to right, rgba(129,0,203,1) 0%,rgba(159,58,216,1) 50%,rgba(129,0,203,1) 100%);
    margin-top: 10px !important;
      width: 189px;
    padding: 6px 0px;
    margin: auto;
    border-radius: 4px;
    font-size: 11px;
    font-family: 'Trebuchet MS';
    text-shadow: 1px 1px 1px #333;
    color: #fff;
    text-align: center;
    letter-spacing: 2px;
    text-transform: uppercase;
    border-bottom: 2.5px solid #7005ad;
      opacity: 0.5;
      transition: all 800ms cubic-bezier(0.390, 0.500, 0.150, 1.360);
}

.smod:hover {
      background: linear-gradient(to right, rgba(129,0,203,1) 0%,rgba(159,58,216,1) 50%,rgba(129,0,203,1) 100%);
    margin-top: 10px !important;
      width: 189px;
    padding: 6px 0px;
    margin: auto;
    border-radius: 4px;
    font-size: 11px;
    font-family: 'Trebuchet MS';
    text-shadow: 1px 1px 1px #333;
    color: #fff;
    text-align: center;
    letter-spacing: 2px;
    text-transform: uppercase;
    border-bottom: 2.5px solid #7005ad;
      opacity: 1;
      transition: all 800ms cubic-bezier(0.390, 0.500, 0.150, 1.360);
}

.uye {
    background: linear-gradient(to right, rgba(114,121,138,1) 0%,rgba(144,154,177,1) 50%,rgba(114,121,138,1) 100%);
    margin-top: 10px !important;
    width: 189px;
    padding: 6px 0px;
    margin: auto;
    border-radius: 4px;
    font-size: 11px;
    font-family: 'Trebuchet MS';
    text-shadow: 1px 1px 1px #333;
    color: #fff;
    text-align: center;
    letter-spacing: 2px;
    text-transform: uppercase;
    border-bottom: 2.5px solid #646d83;
    opacity: 0.5;
    transition: all 800ms cubic-bezier(0.390, 0.500, 0.150, 1.360);
}

.uye:hover {
    background: linear-gradient(to right, rgba(114,121,138,1) 0%,rgba(144,154,177,1) 50%,rgba(114,121,138,1) 100%);
    margin-top: 10px !important;
    width: 189px;
    padding: 6px 0px;
    margin: auto;
    border-radius: 4px;
    font-size: 11px;
    font-family: 'Trebuchet MS';
    text-shadow: 1px 1px 1px #333;
    color: #fff;
    text-align: center;
    letter-spacing: 2px;
    text-transform: uppercase;
    border-bottom: 2.5px solid #646d83;
    opacity: 1;
    transition: all 800ms cubic-bezier(0.390, 0.500, 0.150, 1.360);
}

.mod {
    background: linear-gradient(to right, rgba(0,131,222,1) 0%,rgba(69,162,227,1) 50%,rgba(0,131,222,1) 100%);
    margin-top: 10px !important;
    width: 189px;
    padding: 6px 0px;
    margin: auto;
    border-radius: 4px;
    font-size: 11px;
    font-family: 'Trebuchet MS';
    text-shadow: 1px 1px 1px #333;
    color: #fff;
    text-align: center;
    letter-spacing: 2px;
    text-transform: uppercase;
    border-bottom: 2.5px solid #0d74bb;
    opacity: 0.5;
    transition: all 800ms cubic-bezier(0.390, 0.500, 0.150, 1.360);
}

.mod:hover {
    background: linear-gradient(to right, rgba(0,131,222,1) 0%,rgba(69,162,227,1) 50%,rgba(0,131,222,1) 100%);
    margin-top: 10px !important;
    width: 189px;
    padding: 6px 0px;
    margin: auto;
    border-radius: 4px;
    font-size: 11px;
    font-family: 'Trebuchet MS';
    text-shadow: 1px 1px 1px #333;
    color: #fff;
    text-align: center;
    letter-spacing: 2px;
    text-transform: uppercase;
    border-bottom: 2.5px solid #0d74bb;
    opacity: 1;
    transition: all 800ms cubic-bezier(0.390, 0.500, 0.150, 1.360);
}

.grafiker {
    background: linear-gradient(to right, rgba(225,72,141,1) 0%,rgba(243,115,173,1) 50%,rgba(225,72,141,1) 100%);
    margin-top: 10px !important;
    width: 189px;
    padding: 6px 0px;
    margin: auto;
    border-radius: 4px;
    font-size: 11px;
    font-family: 'Trebuchet MS';
    text-shadow: 1px 1px 1px #333;
    color: #fff;
    text-align: center;
    letter-spacing: 2px;
    text-transform: uppercase;
    border-bottom: 2.5px solid #cb407f;
    opacity: 0.5;
    transition: all 800ms cubic-bezier(0.390, 0.500, 0.150, 1.360);
}

.grafiker:hover {
    background: linear-gradient(to right, rgba(225,72,141,1) 0%,rgba(243,115,173,1) 50%,rgba(225,72,141,1) 100%);
    margin-top: 10px !important;
    width: 189px;
    padding: 6px 0px;
    margin: auto;
    border-radius: 4px;
    font-size: 11px;
    font-family: 'Trebuchet MS';
    text-shadow: 1px 1px 1px #333;
    color: #fff;
    text-align: center;
    letter-spacing: 2px;
    text-transform: uppercase;
    border-bottom: 2.5px solid #cb407f;
    opacity: 1;
    transition: all 800ms cubic-bezier(0.390, 0.500, 0.150, 1.360);
}

.dmod {
    background: linear-gradient(to right, rgba(53,98,58,1) 0%,rgba(72,130,79,1) 50%,rgba(53,98,58,1) 100%);
    margin-top: 10px !important;
    width: 189px;
    padding: 6px 0px;
    margin: auto;
    border-radius: 4px;
    font-size: 11px;
    font-family: 'Trebuchet MS';
    text-shadow: 1px 1px 1px #333;
    color: #fff;
    text-align: center;
    letter-spacing: 2px;
    text-transform: uppercase;
    border-bottom: 2.5px solid #35623a;
    opacity: 0.5;
    transition: all 800ms cubic-bezier(0.390, 0.500, 0.150, 1.360);
}

.dmod:hover {
    background: linear-gradient(to right, rgba(53,98,58,1) 0%,rgba(72,130,79,1) 50%,rgba(53,98,58,1) 100%);
    margin-top: 10px !important;
    width: 189px;
    padding: 6px 0px;
    margin: auto;
    border-radius: 4px;
    font-size: 11px;
    font-family: 'Trebuchet MS';
    text-shadow: 1px 1px 1px #333;
    color: #fff;
    text-align: center;
    letter-spacing: 2px;
    text-transform: uppercase;
    border-bottom: 2.5px solid #35623a;
    opacity: 1;
    transition: all 800ms cubic-bezier(0.390, 0.500, 0.150, 1.360);
}

.yonetici {
    background: linear-gradient(to right, rgba(242,95,56,1) 0%,rgba(249,126,93,1) 50%,rgba(242,95,56,1) 100%);
    margin-top: 10px !important;
    width: 189px;
    padding: 6px 0px;
    margin: auto;
    border-radius: 4px;
    font-size: 11px;
    font-family: 'Trebuchet MS';
    text-shadow: 1px 1px 1px #333;
    color: #fff;
    text-align: center;
    letter-spacing: 2px;
    text-transform: uppercase;
    border-bottom: 2.5px solid #c64d33;
    opacity: 0.5;
    transition: all 800ms cubic-bezier(0.390, 0.500, 0.150, 1.360);
}

.yonetici:hover {
    background: linear-gradient(to right, rgba(242,95,56,1) 0%,rgba(249,126,93,1) 50%,rgba(242,95,56,1) 100%);
    margin-top: 10px !important;
    width: 189px;
    padding: 6px 0px;
    margin: auto;
    border-radius: 4px;
    font-size: 11px;
    font-family: 'Trebuchet MS';
    text-shadow: 1px 1px 1px #333;
    color: #fff;
    text-align: center;
    letter-spacing: 2px;
    text-transform: uppercase;
    border-bottom: 2.5px solid #c64d33;
    opacity: 1;
    transition: all 800ms cubic-bezier(0.390, 0.500, 0.150, 1.360);
}
  
Çaylak Warezci
Seviye:
0
Gönderileri:
16
Beğenileri:
0
Rep Puanı:
0
Kredi:
18
11.07.2021, 17:17
#2
ellerine sağlık güzel olmuş
  

Konuyu Okuyanlar: 1 Ziyaretçi