Hugging Face's logo

Spaces:
ShayanRl
/
testformula
Running

App Files Community
ShayanRl commited on
Commit
c65a1a8
·
verified ·
1 Parent(s): a63e263

Update style.css

Browse files
Files changed (1) hide show
  1. style.css +88 -27
style.css CHANGED
@@ -1,28 +1,89 @@
1
  body {
2
- padding: 2rem;
3
- font-family: -apple-system, BlinkMacSystemFont, "Arial", sans-serif;
4
- }
5
-
6
- h1 {
7
- font-size: 16px;
8
- margin-top: 0;
9
- }
10
-
11
- p {
12
- color: rgb(107, 114, 128);
13
- font-size: 15px;
14
- margin-bottom: 10px;
15
- margin-top: 5px;
16
- }
17
-
18
- .card {
19
- max-width: 620px;
20
- margin: 0 auto;
21
- padding: 16px;
22
- border: 1px solid lightgray;
23
- border-radius: 16px;
24
- }
25
-
26
- .card p:last-child {
27
- margin-bottom: 0;
28
- }
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
  body {
2
+ font-family: sans-serif;
3
+ margin: 0;
4
+ padding: 20px;
5
+ }
6
+
7
+ h1 {
8
+ text-align: center;
9
+ color: #333;
10
+ }
11
+
12
+ .playground {
13
+ display: flex;
14
+ flex-direction: column;
15
+ gap: 20px;
16
+ max-width: 800px;
17
+ margin: 0 auto;
18
+ background-color: #f7f7f7;
19
+ padding: 20px;
20
+ border-radius: 8px;
21
+ box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
22
+ }
23
+
24
+ @media (min-width: 768px) {
25
+ .playground {
26
+ flex-direction: row;
27
+ }
28
+
29
+ .input-section, .result-section {
30
+ flex: 1;
31
+ }
32
+ }
33
+
34
+ .input-section, .result-section {
35
+ padding: 15px;
36
+ background-color: white;
37
+ border-radius: 8px;
38
+ box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
39
+ }
40
+
41
+ select, input, button {
42
+ width: 100%;
43
+ padding: 8px;
44
+ margin-bottom: 10px;
45
+ border: 1px solid #ddd;
46
+ border-radius: 4px;
47
+ }
48
+
49
+ button {
50
+ background-color: #4CAF50;
51
+ color: white;
52
+ border: none;
53
+ cursor: pointer;
54
+ font-weight: bold;
55
+ transition: background-color 0.3s;
56
+ }
57
+
58
+ button:hover {
59
+ background-color: #45a049;
60
+ }
61
+
62
+ #result {
63
+ font-size: 24px;
64
+ font-weight: bold;
65
+ color: #333;
66
+ margin: 20px 0;
67
+ padding: 10px;
68
+ background-color: #f0f0f0;
69
+ border-radius: 4px;
70
+ text-align: center;
71
+ }
72
+
73
+ #formula-code {
74
+ font-family: monospace;
75
+ background-color: #f5f5f5;
76
+ padding: 10px;
77
+ border-radius: 4px;
78
+ overflow-x: auto;
79
+ }
80
+
81
+ .param-container {
82
+ margin-bottom: 10px;
83
+ }
84
+
85
+ .param-label {
86
+ display: block;
87
+ margin-bottom: 5px;
88
+ font-weight: bold;
89
+ }