Welcome!

By registering with us, you'll be able to discuss, share and private message with other members of our community.

SignUp Now!

Префиксы для тем

Лучше плохо начать, чем хорошо бездействовать
Ноя
2,879
3,492
Редактор
CSS:
.green,.red,.solved,.important,.pending,.moscow,.donate,.promo,.info,.dev,.secret,.reviewed,.closed {
    margin: 3px 5px;
    border-radius: 6px;
    font-size: 82%;
    color: #ffffff !important;
    padding: 3px 8px;
    font-weight: 700;
    border: 1px solid rgba(255,255,255,0.25);
    display: inline-block;
    text-shadow: 0 1px 2px rgba(0,0,0,0.3);
    transition: transform .2s ease-in-out,filter .2s ease-in-out;
    background-size: 200% 200%;
    animation: prefixShimmer 4s ease infinite
}

@keyframes prefixShimmer {
    0% {
        background-position: 0% 50%
    }

    50% {
        background-position: 100% 50%
    }

    100% {
        background-position: 0% 50%
    }
}

.green:hover,.red:hover,.solved:hover,.important:hover,.pending:hover,.moscow:hover,.donate:hover,.promo:hover,.info:hover,.dev:hover,.secret:hover,.reviewed:hover,.closed:hover {
    transform: translateY(-1px);
    filter: brightness(1.15)
}

.green {
    background: linear-gradient(135deg, #2ecc71, #27ae60, #2ecc71);
    box-shadow: 0 2px 6px rgba(46,204,113,0.4)
}

.green::before {
    content: "✔ "
}

.red {
    background: linear-gradient(135deg, #e74c3c, #c0392b, #e74c3c);
    box-shadow: 0 2px 6px rgba(231,76,60,0.4)
}

.red::before {
    content: "✖ "
}

.solved {
    background: linear-gradient(135deg, #1abc9c, #16a085, #1abc9c);
    box-shadow: 0 2px 6px rgba(26,188,156,0.4)
}

.solved::before {
    content: "💡 "
}

.important {
    background: linear-gradient(135deg, #e67e22, #d35400, #e67e22);
    box-shadow: 0 2px 6px rgba(230,126,34,0.4)
}

.important::before {
    content: "🔥 "
}

.pending {
    background: linear-gradient(135deg, #f39c12, #d68910, #f39c12);
    box-shadow: 0 2px 6px rgba(243,156,18,0.4)
}

.pending::before {
    content: "⏳ "
}

.moscow {
    background: linear-gradient(135deg, #3498db, #2980b9, #3498db);
    box-shadow: 0 2px 6px rgba(52,152,219,0.4)
}

.moscow::before {
    content: "📍 "
}

.donate {
    background: linear-gradient(135deg, #f1c40f, #f39c12, #f1c40f);
    box-shadow: 0 2px 6px rgba(241,196,15,0.5)
}

.donate::before {
    content: "💎 "
}

.promo {
    background: linear-gradient(135deg, #9b59b6, #8e44ad, #9b59b6);
    box-shadow: 0 2px 6px rgba(155,89,182,0.4)
}

.promo::before {
    content: "🎁 "
}

.info {
    background: linear-gradient(135deg, #00bcd4, #0097a7, #00bcd4);
    box-shadow: 0 2px 6px rgba(0,188,212,0.4)
}

.info::before {
    content: "📌 "
}

.dev {
    background: linear-gradient(135deg, #7f8c8d, #95a5a6, #7f8c8d);
    box-shadow: 0 2px 6px rgba(127,140,141,0.4)
}

.dev::before {
    content: "⚙️ "
}

.secret {
    background: linear-gradient(135deg, #2c3e50, #1a252f, #2c3e50);
    box-shadow: 0 2px 6px rgba(44,62,80,0.5)
}

.secret::before {
    content: "🔒 "
}

.reviewed {
    background: linear-gradient(135deg, #3f51b5, #303f9f, #3f51b5);
    box-shadow: 0 2px 6px rgba(63,81,181,0.4)
}

.reviewed::before {
    content: "📋 "
}

.closed {
    background: linear-gradient(135deg, #636e72, #2d3436, #636e72);
    box-shadow: 0 2px 6px rgba(99,110,114,0.4)
}

.closed::before {
    content: "⛔ "
}
 
Сверху