Hugging Face's logo

Spaces:
drguilhermeapolinario
/
Flamengo
Running

App Files Community
drguilhermeapolinario commited on
Commit
970c567
路
verified 路
1 Parent(s): 550a9d2

Update static/style.css

Browse files
Files changed (1) hide show
  1. static/style.css +103 -131
static/style.css CHANGED
@@ -1,131 +1,103 @@
1
- /* Estilos gerais */
2
- :root {
3
- --background: 0 0% 80%;
4
- --foreground: 240 10% 3.9%;
5
- --card: 0 0% 100%;
6
- --card-foreground: 240 10% 3.9%;
7
- --popover: 0 0% 100%;
8
- --popover-foreground: 240 10% 3.9%;
9
- --primary: 240 5.9% 10%;
10
- --primary-foreground: 0 0% 98%;
11
- --secondary: 240 4.8% 95.9%;
12
- --secondary-foreground: 240 5.9% 10%;
13
- --muted: 240 4.8% 95.9%;
14
- --muted-foreground: 240 3.8% 46.1%;
15
- --accent: 240 4.8% 95.9%;
16
- --accent-foreground: 240 5.9% 10%;
17
- --destructive: 0 84.2% 60.2%;
18
- --destructive-foreground: 0 0% 98%;
19
- --border: 240 5.9% 90%;
20
- --input: 240 5.9% 90%;
21
- --ring: 240 10% 3.9%;
22
- --chart-1: 173 58% 39%;
23
- --chart-2: 12 76% 61%;
24
- --chart-3: 197 37% 24%;
25
- --chart-4: 43 74% 66%;
26
- --chart-5: 27 87% 67%;
27
- }
28
- .dark {
29
- --background: 240 10% 3.9%;
30
- --foreground: 0 0% 98%;
31
- --card: 240 10% 3.9%;
32
- --card-foreground: 0 0% 98%;
33
- --popover: 240 10% 3.9%;
34
- --popover-foreground: 0 0% 98%;
35
- --primary: 0 0% 98%;
36
- --primary-foreground: 240 5.9% 10%;
37
- --secondary: 240 3.7% 15.9%;
38
- --secondary-foreground: 0 0% 98%;
39
- --muted: 240 3.7% 15.9%;
40
- --muted-foreground: 240 5% 64.9%;
41
- --accent: 240 3.7% 15.9%;
42
- --accent-foreground: 0 0% 98%;
43
- --destructive: 0 62.8% 30.6%;
44
- --destructive-foreground: 0 0% 98%;
45
- --border: 240 3.7% 15.9%;
46
- --input: 240 3.7% 15.9%;
47
- --ring: 240 4.9% 83.9%;
48
- --chart-1: 220 70% 50%;
49
- --chart-5: 160 60% 45%;
50
- --chart-3: 30 80% 55%;
51
- --chart-4: 280 65% 60%;
52
- --chart-2: 340 75% 55%;
53
- }
54
-
55
- /* Estilos gerais */
56
- body {
57
- font-family: 'Roboto', sans-serif;
58
- background-color: hsl(var(--background));
59
- color: hsl(var(--foreground));
60
- }
61
-
62
- .stApp {
63
- padding: 4rem;
64
- }
65
-
66
- /* Estilo Neurom贸rfico para as m茅tricas */
67
- div[data-testid="stMetric"] {
68
- background: hsl(var(--card));
69
- border-radius: 15px;
70
- padding: 2em 1em; /* Aumenta o padding para sobressair */
71
- box-shadow: 8px 8px 15px hsl(var(--muted)), -8px -8px 15px hsl(var(--background));
72
- transition: all 0.3s ease;
73
- }
74
-
75
- div[data-testid="stMetric"]:hover {
76
- transform: translateY(-5px);
77
- box-shadow: 12px 12px 20px hsl(var(--muted)), -12px -12px 20px hsl(var(--background));
78
- }
79
-
80
- div[data-testid="stMetricLabel"] p {
81
- font-family: 'Quattrocento-Regular';
82
- color: hsl(var(--primary));
83
- font-size: 1.3em;
84
- }
85
-
86
- div[data-testid="stMetricValue"] {
87
- font-size: 1.3em;
88
- font-weight: 400;
89
- color: hsl(var(--primary-foreground));
90
- }
91
-
92
- /* Outros elementos neurom贸rficos */
93
- .stButton button,
94
- .stTextInput input,
95
- .stSelectbox select {
96
- border-radius: 25px;
97
- padding: 1em 2em;
98
- background: hsl(var(--card));
99
- box-shadow: 8px 8px 15px hsl(var(--muted)), -8px -8px 15px hsl(var(--background));
100
- transition: all 0.3s ease;
101
- border: none;
102
- color: hsl(var(--foreground));
103
- }
104
-
105
- .stButton button:hover,
106
- .stTextInput input:focus,
107
- .stSelectbox select:focus {
108
- box-shadow: 12px 12px 20px hsl(var(--muted)), -12px -12px 20px hsl(var(--background));
109
- }
110
-
111
- .stButton button:active,
112
- .stTextInput input:active,
113
- .stSelectbox select:active {
114
- box-shadow: inset 5px 5px 10px hsl(var(--muted)), inset -5px -5px 10px hsl(var(--background));
115
- }
116
-
117
- /* Ajustes para t铆tulos e subt铆tulos */
118
- .title {
119
- font-family: 'Quattrocento-Bold';
120
- color: hsl(var(--primary));
121
- font-size: 4em;
122
- text-shadow: 2px 2px 4px hsl(var(--border));
123
- }
124
-
125
- h3 span {
126
- font-family: 'PoiretOne-Regular';
127
- font-size: 1.1em;
128
- font-weight: 600;
129
- margin-top: 1em;
130
- color: hsl(var(--foreground));
131
- }
 
1
+ @import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap');
2
+
3
+ :root {
4
+ --background: #CCCCCC;
5
+ --foreground: #0A0A0C;
6
+ --card: #FFFFFF;
7
+ --card-foreground: #0A0A0C;
8
+ --popover: #FFFFFF;
9
+ --popover-foreground: #0A0A0C;
10
+ --primary: #191919;
11
+ --primary-foreground: #FAFAFA;
12
+ --secondary: #F4F4F5;
13
+ --secondary-foreground: #191919;
14
+ --muted: #F4F4F5;
15
+ --muted-foreground: #737373;
16
+ --accent: #F4F4F5;
17
+ --accent-foreground: #191919;
18
+ --destructive: #E11D48;
19
+ --destructive-foreground: #FAFAFA;
20
+ --border: #E5E5E6;
21
+ --input: #E5E5E6;
22
+ --ring: #0A0A0C;
23
+ --chart-1: #1F9D85;
24
+ --chart-2: #E85D3F;
25
+ --chart-3: #1E4E5F;
26
+ --chart-4: #E5B22D;
27
+ --chart-5: #F2701D;
28
+ }
29
+
30
+ /* Estilos gerais */
31
+ body {
32
+ font-family: 'Roboto', sans-serif;
33
+ background-color: hsl(var(--background));
34
+ color: hsl(var(--foreground));
35
+ }
36
+
37
+ .stApp {
38
+ padding: 20px;
39
+ }
40
+
41
+ /* Estilo Neurom贸rfico para as m茅tricas */
42
+ div[data-testid="stMetric"] {
43
+ background: hsl(var(--card));
44
+ border-radius: 15px;
45
+ padding: 2em 1em; /* Aumenta o padding para sobressair */
46
+ box-shadow: 8px 8px 15px hsl(var(--muted)), -8px -8px 15px hsl(var(--background));
47
+ transition: all 0.3s ease;
48
+ }
49
+
50
+ div[data-testid="stMetric"]:hover {
51
+ transform: translateY(-5px);
52
+ box-shadow: 12px 12px 20px hsl(var(--muted)), -12px -12px 20px hsl(var(--background));
53
+ }
54
+
55
+ div[data-testid="stMetricLabel"] p {
56
+ color: hsl(var(--primary));
57
+ font-size: 1.3em;
58
+ }
59
+
60
+ div[data-testid="stMetricValue"] {
61
+ font-size: 1.3em;
62
+ font-weight: 400;
63
+ color: hsl(var(--primary-foreground));
64
+ }
65
+
66
+ /* Outros elementos neurom贸rficos */
67
+ .stButton button,
68
+ .stTextInput input,
69
+ .stSelectbox select {
70
+ border-radius: 25px;
71
+ padding: 1em 2em;
72
+ background: hsl(var(--card));
73
+ box-shadow: 5px 5px 10px hsl(var(--muted)), -5px -5px 10px hsl(var(--background));
74
+ transition: all 0.3s ease;
75
+ border: none;
76
+ color: hsl(var(--foreground));
77
+ }
78
+
79
+ .stButton button:hover,
80
+ .stTextInput input:focus,
81
+ .stSelectbox select:focus {
82
+ box-shadow: 8px 8px 15px hsl(var(--muted)), -8px -8px 15px hsl(var(--background));
83
+ }
84
+
85
+ .stButton button:active,
86
+ .stTextInput input:active,
87
+ .stSelectbox select:active {
88
+ box-shadow: inset 3px 3px 7px hsl(var(--muted)), inset -3px -3px 7px hsl(var(--background));
89
+ }
90
+
91
+ /* Ajustes para t铆tulos e subt铆tulos */
92
+ .title {
93
+ color: hsl(var(--primary));
94
+ font-size: 4em;
95
+ text-shadow: 2px 2px 4px hsl(var(--border));
96
+ }
97
+
98
+ h3 span {
99
+ font-size: 1.1em;
100
+ font-weight: 600;
101
+ margin-top: 1em;
102
+ color: hsl(var(--foreground));
103
+ }