Hugging Face's logo

Spaces:
privateuserh
/
dmimtrends
Running

App Files Community
dmimtrends
File size: 2,523 Bytes 
a985b50
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
 
/* styles.css */

::-webkit-scrollbar {
    width: 4px;
}
::-webkit-scrollbar-track {
    background: #f1f1f1;
}
::-webkit-scrollbar-thumb {
    background: #4a6fdc;
    border-radius: 3px;
}
::-webkit-scrollbar-thumb:hover {
    background: #3a5bc7;
}

.trend-card:hover {
    transform: translateY(-2px);
}

.dmim-bg { background-color: #4a6fdc; }

* {
    /* These user-select properties are generally not recommended for web apps
       as they hinder user interaction (e.g., copying text).
       Consider removing them unless you have a very specific reason.
    */
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

@keyframes fadeIn {
    from { opacity: 0; transform: translateY(10px); }
    to { opacity: 1; transform: translateY(0); }
}

.explainer-animate {
    animation: fadeIn 0.3s ease-out forwards;
}

.percentage-up {
    color: #10b981;
}

.percentage-down {
    color: #ef4444;
}

.percentage-neutral {
    color: #6b7280;
}

.sentiment-positive {
    background-color: rgba(16, 185, 129, 0.1);
    border-left: 3px solid #10b981;
}

.sentiment-negative {
    background-color: rgba(239, 68, 68, 0.1);
    border-left: 3px solid #ef4444;
}

.sentiment-neutral {
    background-color: rgba(156, 163, 175, 0.1);
    border-left: 3px solid #9ca3af;
}

.sentiment-slider::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    cursor: pointer;
}

.sentiment-slider.positive::-webkit-slider-thumb {
    background: #10b981;
}

.sentiment-slider.negative::-webkit-slider-thumb {
    background: #ef4444;
}

.sentiment-slider.neutral::-webkit-slider-thumb {
    background: #6b7280;
}

/* Floating button styles */
.floating-btn {
    position: fixed;
    bottom: 80px;
    right: 20px;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background-color: #4a6fdc;
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
    z-index: 40;
    cursor: pointer;
    transition: all 0.3s ease;
}

.floating-btn:hover {
    transform: scale(1.1);
    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.3);
}

/* Legend modal styles */
.legend-item {
    display: flex;
    align-items: center;
    margin-bottom: 12px;
}

.legend-icon {
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 12px;
    flex-shrink: 0;
}