refactor(theming): orange-* → warning-* for promo/highlight semantics

Sweep orange across SubscriptionPurchase/GiftSubscription/PromoOffersSection/
AdminTrafficUsage/AnalyticsTab/withdrawalUtils to warning-* tokens. Stars brand
yellow→orange gradient kept in TopUpAmount.
This commit is contained in:
c0mrade
2026-05-26 11:22:19 +03:00
parent d7cbbe077a
commit 3df2134cba
6 changed files with 27 additions and 26 deletions

View File

@@ -265,10 +265,10 @@ export default function PromoOffersSection({ className = '' }: PromoOffersSectio
{availableOffers.map((offer) => (
<div
key={offer.id}
className="card border-orange-500/30 bg-gradient-to-br from-orange-500/5 to-transparent transition-colors hover:border-orange-500/50"
className="card border-warning-500/30 bg-gradient-to-br from-warning-500/5 to-transparent transition-colors hover:border-warning-500/50"
>
<div className="flex items-start gap-4">
<div className="flex h-12 w-12 flex-shrink-0 items-center justify-center rounded-xl bg-gradient-to-br from-orange-500/30 to-warning-500/20">
<div className="flex h-12 w-12 flex-shrink-0 items-center justify-center rounded-xl bg-gradient-to-br from-warning-500/30 to-warning-500/20">
{getOfferIcon(offer.effect_type, offer.discount_percent)}
</div>
<div className="min-w-0 flex-1">
@@ -291,7 +291,7 @@ export default function PromoOffersSection({ className = '' }: PromoOffersSectio
<button
onClick={() => handleClaim(offer.id)}
disabled={claimingId === offer.id}
className="group relative flex w-full items-center justify-center gap-2 overflow-hidden rounded-lg bg-gradient-to-r from-orange-500 to-warning-500 px-5 py-2.5 text-sm font-semibold text-white shadow-lg shadow-orange-500/25 transition-all hover:scale-105 hover:shadow-xl hover:shadow-orange-500/30 active:scale-100 disabled:cursor-not-allowed disabled:opacity-50 disabled:hover:scale-100 sm:w-auto"
className="group relative flex w-full items-center justify-center gap-2 overflow-hidden rounded-lg bg-gradient-to-r from-warning-500 to-warning-500 px-5 py-2.5 text-sm font-semibold text-white shadow-lg shadow-warning-500/25 transition-all hover:scale-105 hover:shadow-xl hover:shadow-warning-500/30 active:scale-100 disabled:cursor-not-allowed disabled:opacity-50 disabled:hover:scale-100 sm:w-auto"
>
{/* Shimmer effect */}
<span className="absolute inset-0 -translate-x-full bg-gradient-to-r from-transparent via-white/20 to-transparent transition-transform duration-1000 group-hover:translate-x-full" />

View File

@@ -167,7 +167,7 @@ export function AnalyticsTab() {
<div className="my-5 border-t border-dark-700/30" />
<div className="mb-4 flex items-center justify-between">
<div className="flex items-center gap-2">
<svg className="h-4 w-4 text-orange-400" viewBox="0 0 24 24" fill="currentColor">
<svg className="h-4 w-4 text-warning-400" viewBox="0 0 24 24" fill="currentColor">
<path d="M16 6l2.29 2.29-4.88 4.88-4-4L2 16.59 3.41 18l6-6 4 4 6.3-6.29L22 12V6z" />
</svg>
<span className="text-sm font-medium text-dark-200">

View File

@@ -153,10 +153,10 @@ const RISK_STYLES: Record<RiskLevel, { dot: string; text: string; bar: string; b
bg: 'bg-warning-400/10',
},
high: {
dot: 'bg-orange-400',
text: 'text-orange-400',
bar: 'bg-orange-400',
bg: 'bg-orange-400/10',
dot: 'bg-warning-400',
text: 'text-warning-400',
bar: 'bg-warning-400',
bg: 'bg-warning-400/10',
},
critical: {
dot: 'bg-error-400 animate-pulse',

View File

@@ -711,10 +711,10 @@ function BuyTabContent({
{/* Active discount banner */}
{config.active_discount_percent != null && config.active_discount_percent > 0 && (
<div className="flex items-center gap-3 rounded-xl border border-orange-500/30 bg-orange-500/10 p-3">
<div className="flex h-8 w-8 shrink-0 items-center justify-center rounded-full bg-orange-500/20">
<div className="flex items-center gap-3 rounded-xl border border-warning-500/30 bg-warning-500/10 p-3">
<div className="flex h-8 w-8 shrink-0 items-center justify-center rounded-full bg-warning-500/20">
<svg
className="h-4 w-4 text-orange-400"
className="h-4 w-4 text-warning-400"
fill="none"
viewBox="0 0 24 24"
stroke="currentColor"
@@ -725,7 +725,7 @@ function BuyTabContent({
<path d="M9.813 15.904L9 18.75l-.813-2.846a4.5 4.5 0 00-3.09-3.09L2.25 12l2.846-.813a4.5 4.5 0 003.09-3.09L9 5.25l.813 2.846a4.5 4.5 0 003.09 3.09L15.75 12l-2.846.813a4.5 4.5 0 00-3.09 3.09z" />
</svg>
</div>
<div className="text-sm font-medium text-orange-400">
<div className="text-sm font-medium text-warning-400">
{t('promo.discountApplied')} -{config.active_discount_percent}%
</div>
</div>

View File

@@ -906,7 +906,7 @@ export default function SubscriptionPurchase() {
className={`rounded px-1.5 py-0.5 text-xs ${
promoDaily.isPromoGroup
? 'bg-success-500/20 text-success-400'
: 'bg-orange-500/20 text-orange-400'
: 'bg-warning-500/20 text-warning-400'
}`}
>
-{promoDaily.percent}%
@@ -938,7 +938,7 @@ export default function SubscriptionPurchase() {
className={`rounded px-1.5 py-0.5 text-xs ${
promoPeriod.isPromoGroup
? 'bg-success-500/20 text-success-400'
: 'bg-orange-500/20 text-orange-400'
: 'bg-warning-500/20 text-warning-400'
}`}
>
-{promoPeriod.percent}%
@@ -1172,7 +1172,7 @@ export default function SubscriptionPurchase() {
{displayDiscount && displayDiscount > 0 && (
<div
className={`absolute -right-2 -top-2 rounded-full px-2 py-0.5 text-xs font-medium text-white ${
promoPeriod.isPromoGroup ? 'bg-success-500' : 'bg-orange-500'
promoPeriod.isPromoGroup ? 'bg-success-500' : 'bg-warning-500'
}`}
>
-{displayDiscount}%
@@ -1317,7 +1317,7 @@ export default function SubscriptionPurchase() {
className={`rounded px-1.5 py-0.5 text-xs ${
promoCustom.isPromoGroup
? 'bg-success-500/20 text-success-400'
: 'bg-orange-500/20 text-orange-400'
: 'bg-warning-500/20 text-warning-400'
}`}
>
-{promoCustom.percent}%
@@ -1538,8 +1538,8 @@ export default function SubscriptionPurchase() {
</div>
{promoPeriod.percent && (
<div className="mb-4 flex items-center justify-center gap-2 rounded-lg border border-orange-500/30 bg-orange-500/10 p-2">
<span className="text-sm font-medium text-orange-400">
<div className="mb-4 flex items-center justify-center gap-2 rounded-lg border border-warning-500/30 bg-warning-500/10 p-2">
<span className="text-sm font-medium text-warning-400">
{t('promo.discountApplied')} -{promoPeriod.percent}%
</span>
</div>
@@ -1695,7 +1695,7 @@ export default function SubscriptionPurchase() {
{promoPeriod.percent && promoPeriod.percent > 0 && (
<div
className={`absolute right-2 top-2 z-10 rounded-full px-2 py-0.5 text-xs font-medium text-white shadow-sm ${
promoPeriod.isPromoGroup ? 'bg-success-500' : 'bg-orange-500'
promoPeriod.isPromoGroup ? 'bg-success-500' : 'bg-warning-500'
}`}
>
-{promoPeriod.percent}%
@@ -1741,7 +1741,7 @@ export default function SubscriptionPurchase() {
{promoTraffic.percent && promoTraffic.percent > 0 && (
<div
className={`absolute right-2 top-2 z-10 rounded-full px-2 py-0.5 text-xs font-medium text-white shadow-sm ${
promoTraffic.isPromoGroup ? 'bg-success-500' : 'bg-orange-500'
promoTraffic.isPromoGroup ? 'bg-success-500' : 'bg-warning-500'
}`}
>
-{promoTraffic.percent}%
@@ -1795,7 +1795,7 @@ export default function SubscriptionPurchase() {
{promoServer.percent && promoServer.percent > 0 ? (
<div
className={`absolute right-2 top-2 z-10 rounded-full px-2 py-0.5 text-xs font-medium text-white shadow-sm ${
promoServer.isPromoGroup ? 'bg-success-500' : 'bg-orange-500'
promoServer.isPromoGroup ? 'bg-success-500' : 'bg-warning-500'
}`}
>
-{promoServer.percent}%
@@ -1894,9 +1894,9 @@ export default function SubscriptionPurchase() {
) : preview ? (
<div className="space-y-4 rounded-xl bg-dark-800/50 p-5">
{activeDiscount?.is_active && activeDiscount.discount_percent && (
<div className="flex items-center justify-center gap-2 rounded-lg border border-orange-500/30 bg-orange-500/10 p-3">
<div className="flex items-center justify-center gap-2 rounded-lg border border-warning-500/30 bg-warning-500/10 p-3">
<svg
className="h-4 w-4 text-orange-400"
className="h-4 w-4 text-warning-400"
fill="none"
viewBox="0 0 24 24"
stroke="currentColor"
@@ -1908,7 +1908,7 @@ export default function SubscriptionPurchase() {
d="M9.813 15.904L9 18.75l-.813-2.846a4.5 4.5 0 00-3.09-3.09L2.25 12l2.846-.813a4.5 4.5 0 003.09-3.09L9 5.25l.813 2.846a4.5 4.5 0 003.09 3.09L15.75 12l-2.846.813a4.5 4.5 0 00-3.09 3.09z"
/>
</svg>
<span className="text-sm font-medium text-orange-400">
<span className="text-sm font-medium text-warning-400">
{t('promo.discountApplied')} -{activeDiscount.discount_percent}%
</span>
</div>

View File

@@ -64,7 +64,8 @@ export function getRiskColor(score: number): { text: string; bg: string; bar: st
return { text: 'text-success-400', bg: 'bg-success-500/20', bar: 'bg-success-500' };
if (score < 50)
return { text: 'text-warning-400', bg: 'bg-warning-500/20', bar: 'bg-warning-500' };
if (score < 70) return { text: 'text-orange-400', bg: 'bg-orange-500/20', bar: 'bg-orange-500' };
if (score < 70)
return { text: 'text-warning-400', bg: 'bg-warning-500/20', bar: 'bg-warning-500' };
return { text: 'text-error-400', bg: 'bg-error-500/20', bar: 'bg-error-500' };
}
@@ -75,7 +76,7 @@ export function getRiskLevelColor(level: string): { text: string; bg: string } {
case 'medium':
return { text: 'text-warning-400', bg: 'bg-warning-500/20' };
case 'high':
return { text: 'text-orange-400', bg: 'bg-orange-500/20' };
return { text: 'text-warning-400', bg: 'bg-warning-500/20' };
case 'critical':
return { text: 'text-error-400', bg: 'bg-error-500/20' };
default: