XF 2.0 - Farklı Önek Tasarımları | XenGenTr - Türkiye'nin XenForo Türkçe destek topluluğu

Uyumlu XF 2 Sürümleri

Resimde görmüş olduğunuz şekilde öneklerin tasarımını kullanmak isterseniz, temanızın extra.less şablonuna aşağıdaki kodları ekleyiniz.

Kod:

.greenprefix {
    display: inline-block;
    position:relative;
    padding: .7em;
    padding-left: 2em;
    margin: 0 .5em .5em 0;
    background: #8dc63f;
    color: rgba(255,255,255,.6) !important;
    text-decoration:none;
    font-weight: bold;
}
.greenprefix:hover {
    background:#B3CC73;
    color:white;
}
.greenprefix:before {
        content: '';
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index:1;
    background: -moz-radial-gradient(.6em .6em, circle, #FCFCFF .55em, rgba(255, 255, 255, 0) .6em) -.6em -.6em,
                -moz-radial-gradient(1em 50%, circle, #FCFCFF .35em, rgba(255,255,255,0) .4em),
                -moz-radial-gradient(1em 47%, circle, rgba(0,0,0,.4) .4em, transparent .43em) !important;
    background: -o-radial-gradient(.6em .6em, circle, #FCFCFF .55em, rgba(255,255,255,0) .6em) -.6em -.6em,
                -o-radial-gradient(1em 50%, circle, #FCFCFF .35em, rgba(255,255,255,0) .4em),
                -o-radial-gradient(1em 47%, circle, rgba(0,0,0,.4) .4em, transparent .43em) !important;
    background: -ms-radial-gradient(.6em .6em, circle, #FCFCFF .55em, rgba(255,255,255,0) .6em) -.6em -.6em,
                -ms-radial-gradient(1em 50%, circle, #FCFCFF .35em, rgba(255,255,255,0) .4em),
                -ms-radial-gradient(1em 47%, circle, rgba(0,0,0,.4) .4em, transparent .43em) !important;
    background: -webkit-radial-gradient(.6em .6em, circle, #FCFCFF .55em, rgba(255,255,255,0) .6em) -.6em -.6em,
                -webkit-radial-gradient(1em 50%, circle, #FCFCFF .35em, rgba(255,255,255,0) .4em),
                -webkit-radial-gradient(1em 47%, circle, rgba(0,0,0,.4) .4em, transparent .43em) !important;
}
.greenprefix:after {
    content: '';
    position:absolute;
    top:.25em;
    right:.25em;
    bottom:.25em;
    left:.25em;
    border: 1px rgba(0,0,0,.3) dashed;
    outline: 1px rgba(255,255,255,.5) dashed;
}
.redprefix {
    display: inline-block;
    position:relative;
    padding: .7em;
    padding-left: 2em;
    margin: 0 .5em .5em 0;
    background: #b30;
    color: rgba(255,255,255,.6) !important;
    text-decoration:none;
    font-weight: bold;
}
.redprefix:hover {
    background:#B3CC73;
    color:white;
}
.redprefix:before {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index:1;
    background: -moz-radial-gradient(.6em .6em, circle, #FCFCFF .55em, rgba(255, 255, 255, 0) .6em) -.6em -.6em,
                -moz-radial-gradient(1em 50%, circle, #FCFCFF .35em, rgba(255,255,255,0) .4em),
                -moz-radial-gradient(1em 47%, circle, rgba(0,0,0,.4) .4em, transparent .43em) !important;
    background: -o-radial-gradient(.6em .6em, circle, #FCFCFF .55em, rgba(255,255,255,0) .6em) -.6em -.6em,
                -o-radial-gradient(1em 50%, circle, #FCFCFF .35em, rgba(255,255,255,0) .4em),
                -o-radial-gradient(1em 47%, circle, rgba(0,0,0,.4) .4em, transparent .43em) !important;
    background: -ms-radial-gradient(.6em .6em, circle, #FCFCFF .55em, rgba(255,255,255,0) .6em) -.6em -.6em,
                -ms-radial-gradient(1em 50%, circle, #FCFCFF .35em, rgba(255,255,255,0) .4em),
                -ms-radial-gradient(1em 47%, circle, rgba(0,0,0,.4) .4em, transparent .43em) !important;
    background: -webkit-radial-gradient(.6em .6em, circle, #FCFCFF .55em, rgba(255,255,255,0) .6em) -.6em -.6em,
                -webkit-radial-gradient(1em 50%, circle, #FCFCFF .35em, rgba(255,255,255,0) .4em),
                -webkit-radial-gradient(1em 47%, circle, rgba(0,0,0,.4) .4em, transparent .43em) !important;
}
.redprefix:after {
    content: '';
    position:absolute;
    top:.25em;
    right:.25em;
    bottom:.25em;
    left:.25em;
    border: 1px rgba(0,0,0,.3) dashed;
    outline: 1px rgba(255,255,255,.5) dashed;
}
.brownprefix {
    display: inline-block;
    position:relative;
    padding: .7em;
    padding-left: 2em;
    margin: 0 .5em .5em 0;
    background: #564C41;
    color: rgba(255,255,255,.6) !important;
    text-decoration:none;
    font-weight: bold;
}
.brownprefix:hover {
    background: #B3CC73;
    color:white;
}
.brownprefix :before {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index:1;
    background: -moz-radial-gradient(.6em .6em, circle, #FCFCFF .55em, rgba(255, 255, 255, 0) .6em) -.6em -.6em,
                -moz-radial-gradient(1em 50%, circle, #FCFCFF .35em, rgba(255,255,255,0) .4em),
                -moz-radial-gradient(1em 47%, circle, rgba(0,0,0,.4) .4em, transparent .43em) !important;
    background: -o-radial-gradient(.6em .6em, circle, #FCFCFF .55em, rgba(255,255,255,0) .6em) -.6em -.6em,
                -o-radial-gradient(1em 50%, circle, #FCFCFF .35em, rgba(255,255,255,0) .4em),
                -o-radial-gradient(1em 47%, circle, rgba(0,0,0,.4) .4em, transparent .43em) !important;
    background: -ms-radial-gradient(.6em .6em, circle, #FCFCFF .55em, rgba(255,255,255,0) .6em) -.6em -.6em,
                -ms-radial-gradient(1em 50%, circle, #FCFCFF .35em, rgba(255,255,255,0) .4em),
                -ms-radial-gradient(1em 47%, circle, rgba(0,0,0,.4) .4em, transparent .43em) !important;
    background: -webkit-radial-gradient(.6em .6em, circle, #FCFCFF .55em, rgba(255,255,255,0) .6em) -.6em -.6em,
                -webkit-radial-gradient(1em 50%, circle, #FCFCFF .35em, rgba(255,255,255,0) .4em),
                -webkit-radial-gradient(1em 47%, circle, rgba(0,0,0,.4) .4em, transparent .43em) !important;
}
.brownprefix :after {
    content: '';
    position:absolute;
    top:.25em;
    right:.25em;
    bottom:.25em;
    left:.25em;
    border: 1px rgba(0,0,0,.3) dashed;
    outline: 1px rgba(255,255,255,.5) dashed;
}
.blueprefix {
    display: inline-block;
    position:relative;
    padding: .7em;
    padding-left: 2em;
    margin: 0 .5em .5em 0;
    background: #55758D;
    color: rgba(255,255,255,.6) !important;
    text-decoration:none;
    font-weight: bold;
}
.blueprefix:hover {
    background:#B3CC73;
    color:white;
}
.blueprefix:before {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index:1;
    background: -moz-radial-gradient(.6em .6em, circle, #FCFCFF .55em, rgba(255, 255, 255, 0) .6em) -.6em -.6em,
                -moz-radial-gradient(1em 50%, circle, #FCFCFF .35em, rgba(255,255,255,0) .4em),
                -moz-radial-gradient(1em 47%, circle, rgba(0,0,0,.4) .4em, transparent .43em) !important;
    background: -o-radial-gradient(.6em .6em, circle, #FCFCFF .55em, rgba(255,255,255,0) .6em) -.6em -.6em,
                -o-radial-gradient(1em 50%, circle, #FCFCFF .35em, rgba(255,255,255,0) .4em),
                -o-radial-gradient(1em 47%, circle, rgba(0,0,0,.4) .4em, transparent .43em) !important;
    background: -ms-radial-gradient(.6em .6em, circle, #FCFCFF .55em, rgba(255,255,255,0) .6em) -.6em -.6em,
                -ms-radial-gradient(1em 50%, circle, #FCFCFF .35em, rgba(255,255,255,0) .4em),
                -ms-radial-gradient(1em 47%, circle, rgba(0,0,0,.4) .4em, transparent .43em) !important;
    background: -webkit-radial-gradient(.6em .6em, circle, #FCFCFF .55em, rgba(255,255,255,0) .6em) -.6em -.6em,
                -webkit-radial-gradient(1em 50%, circle, #FCFCFF .35em, rgba(255,255,255,0) .4em),
                -webkit-radial-gradient(1em 47%, circle, rgba(0,0,0,.4) .4em, transparent .43em) !important;
}
.blueprefix:after {
    content: '';
    position:absolute;
    top:.25em;
    right:.25em;
    bottom:.25em;
    left:.25em;
    border: 1px rgba(0,0,0,.3) dashed;
    outline: 1px rgba(255,255,255,.5) dashed;
}

Kaydedip çıkın. Daha sonra kullanmak istediğiniz prefix için Konu önekleri ekleme kısmından dilediğiniz rengi ekleyin.