Hugging Face's logo

Spaces:
Tri4
/
semabox-mms
Sleeping

App Files Community
Tri4 commited on
Commit
79b4c63
·
verified ·
1 Parent(s): 4564cfc

Update static/css/style.css

Browse files
Files changed (1) hide show
  1. static/css/style.css +37 -35
static/css/style.css CHANGED
@@ -20,20 +20,8 @@ body {
20
  height: 100vh;
21
  }
22
 
23
- #output {
24
- margin-top: 20px;
25
- border: 1px solid #ccc;
26
- padding: 10px;
27
- width: 80%;
28
- margin-left: auto;
29
- margin-right: auto;
30
- min-height: 100px;
31
- box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
32
-
33
- }
34
-
35
  .container {
36
- background-color: rgba(255, 255, 255, 0.5);
37
  text-align: center;
38
  padding: 20px;
39
  box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
@@ -48,44 +36,58 @@ body {
48
  flex-direction: column;
49
  }
50
 
51
- #startButton {
52
  margin-top: 20px;
53
  padding: 20px;
54
- width: 100px;
55
- height: 100px;
56
  border-radius: 50%;
57
  cursor: pointer;
58
- background-color: rgb(159, 159, 252);
 
 
 
59
  }
60
 
61
- #startButton:hover {
62
- background-color: rgb(50, 50, 200);
63
  }
64
 
65
- #copyButton {
66
- margin-top: 10px;
67
- padding: 5px 10px;
 
 
 
 
68
  cursor: pointer;
69
- background-color: #4CAF50;
70
  color: white;
71
  border: none;
72
  border-radius: 4px;
 
73
  }
74
 
75
- #copyButton:hover {
76
- background-color: #45a049;
 
 
 
 
 
 
 
 
 
 
 
77
  }
78
 
79
- #clearButton {
80
  margin-top: 10px;
81
- padding: 5px 10px;
82
- cursor: pointer;
83
- background-color: #af4c4c;
84
- color: white;
85
- border: none;
86
- border-radius: 4px;
87
  }
88
 
89
- #clearButton:hover {
90
- background-color: #ac3434;
91
- }
 
20
  height: 100vh;
21
  }
22
 
 
 
 
 
 
 
 
 
 
 
 
 
23
  .container {
24
+ background-color: rgba(255, 255, 255, 0.8);
25
  text-align: center;
26
  padding: 20px;
27
  box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
 
36
  flex-direction: column;
37
  }
38
 
39
+ #recordButton {
40
  margin-top: 20px;
41
  padding: 20px;
42
+ width: 120px;
43
+ height: 120px;
44
  border-radius: 50%;
45
  cursor: pointer;
46
+ background-color: #4CAF50; /* Green for Start */
47
+ color: white;
48
+ border: none;
49
+ font-size: 16px;
50
  }
51
 
52
+ #recordButton.recording {
53
+ background-color: #f44336; /* Red for Stop */
54
  }
55
 
56
+ #recordButton:hover {
57
+ background-color: #45a049;
58
+ }
59
+
60
+ #transcribeButton {
61
+ margin-top: 20px;
62
+ padding: 10px 20px;
63
  cursor: pointer;
64
+ background-color: #008CBA; /* Blue for Transcribe */
65
  color: white;
66
  border: none;
67
  border-radius: 4px;
68
+ font-size: 16px;
69
  }
70
 
71
+ #transcribeButton:hover {
72
+ background-color: #005f6b;
73
+ }
74
+
75
+ #output {
76
+ margin-top: 20px;
77
+ border: 1px solid #ccc;
78
+ padding: 10px;
79
+ width: 80%;
80
+ margin-left: auto;
81
+ margin-right: auto;
82
+ min-height: 100px;
83
+ box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
84
  }
85
 
86
+ #recordStatus {
87
  margin-top: 10px;
88
+ font-size: 14px;
 
 
 
 
 
89
  }
90
 
91
+ #transcribeContainer {
92
+ margin-top: 20px;
93
+ }