12-06-2021, 03:32 AM
İzmox Theme
HTML Kod
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 Kod
Kod:
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);
}
Bu Konudaki Yorumlar |
MyBB Kullanıcı Rank - Yazar: ErenESER - 12-06-2021, 03:32 AM
Cvp: MyBB Kullanıcı Rank - Yazar: Mike - 12-06-2021, 09:51 PM
Cvp: MyBB Kullanıcı Rank - Yazar: CaspiaN - 12-06-2021, 10:03 PM
|
Görüntüleyenler: 1 Ziyaretçi