Skip to content

Commit 47cda32

Browse files
simonjonsson87simonjonsson87
committed
css edits
1 parent e8acd6b commit 47cda32

File tree

4 files changed

+32
-64
lines changed

4 files changed

+32
-64
lines changed

‎chat-ui-quince/index.html‎

Lines changed: 10 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -38,39 +38,35 @@ <h2 class="sidebar-title">Investment Stats</h2>
3838
<tbody>
3939
<tr class="stats-row stats-flr">
4040
<td class="stats-token"><img src="https://cryptologos.cc/logos/flare-flr-logo.png" alt="FLR" class="token-icon"> FLR</td>
41-
<td class="stats-value" id="value-flr">100.5</td>
41+
<td class="stats-value" id="value-flr"></td>
4242
</tr>
4343
<tr class="stats-row stats-sflr">
4444
<td class="stats-token"><img src="https://cryptologos.cc/logos/flare-spark-flr-logo.png" alt="sFLR" class="token-icon"> sFLR</td>
45-
<td class="stats-value" id="value-sflr">200.3</td>
45+
<td class="stats-value" id="value-sflr"></td>
4646
</tr>
4747
<tr class="stats-row stats-wflr">
4848
<td class="stats-token"><img src="https://cryptologos.cc/logos/flare-flr-logo.png" alt="wFLR" class="token-icon"> wFLR</td>
49-
<td class="stats-value" id="value-wflr">50.0</td>
49+
<td class="stats-value" id="value-wflr"></td>
5050
</tr>
5151
<tr class="stats-row stats-skflr">
5252
<td class="stats-token"><img src="https://cryptologos.cc/logos/flare-flr-logo.png" alt="skFLR" class="token-icon"> skFLR</td>
53-
<td class="stats-value" id="value-skflr">120.1</td>
53+
<td class="stats-value" id="value-skflr"></td>
5454
</tr>
5555
<tr class="stats-row stats-weth">
5656
<td class="stats-token"><img src="https://cryptologos.cc/logos/ethereum-eth-logo.png" alt="wETH" class="token-icon"> wETH</td>
57-
<td class="stats-value" id="value-weth">1.2</td>
57+
<td class="stats-value" id="value-weth"></td>
5858
</tr>
5959
<tr class="stats-row stats-joule">
6060
<td class="stats-token"><img src="https://cryptologos.cc/logos/joule-joule-logo.png" alt="JOULE" class="token-icon"> JOULE</td>
61-
<td class="stats-value" id="value-joule">500.0</td>
61+
<td class="stats-value" id="value-joule"></td>
6262
</tr>
6363
<tr class="stats-row stats-usdc">
6464
<td class="stats-token"><img src="https://cryptologos.cc/logos/us-dollar-coin-usdc-logo.png" alt="USDC" class="token-icon"> USDC</td>
65-
<td class="stats-value" id="value-usdc">1000.0</td>
65+
<td class="stats-value" id="value-usdc"></td>
6666
</tr>
6767
<tr class="stats-row stats-usdt">
6868
<td class="stats-token"><img src="https://cryptologos.cc/logos/tether-usdt-logo.png" alt="USDT" class="token-icon"> USDT</td>
69-
<td class="stats-value" id="value-usdt">750.0</td>
70-
</tr>
71-
<tr class="stats-row stats-yield">
72-
<td class="stats-token"><strong>Yield</strong></td>
73-
<td class="stats-value" id="value-yield"><strong>3.2%</strong></td>
69+
<td class="stats-value" id="value-usdt"></td>
7470
</tr>
7571
</tbody>
7672
</table>
@@ -85,8 +81,9 @@ <h2 class="sidebar-title">Investment Stats</h2>
8581
<!-- <button id="voice-btn-old" type="button"> 🎤</button> -->
8682
<button id="voice-btn">
8783
<svg fill="#000000" width="32px" height="32px" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path d="M12,15a4,4,0,0,0,4-4V5A4,4,0,0,0,8,5v6A4,4,0,0,0,12,15ZM10,5a2,2,0,0,1,4,0v6a2,2,0,0,1-4,0Zm10,6a1,1,0,0,0-2,0A6,6,0,0,1,6,11a1,1,0,0,0-2,0,8,8,0,0,0,7,7.93V21H9a1,1,0,0,0,0,2h6a1,1,0,0,0,0-2H13V18.93A8,8,0,0,0,20,11Z"/></svg>
84+
<div id="voice-btn-text"></div>
8885
</button>
89-
86+
9087
<button id="read-out-loud-btn"><img src="speaker-disabled.png" alt="Read Out Loud" id="speaker-icon"></button>
9188

9289
<div id="send-btn" type="button">

‎chat-ui-quince/src/code.js‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -338,7 +338,7 @@ sendBtn.addEventListener('click', function () {
338338

339339

340340
document.addEventListener("DOMContentLoaded", () => {
341-
const voiceBtn = document.getElementById("voice-btn");
341+
const voiceBtn = document.getElementById("voice-btn-text");
342342
const messageInput = document.getElementById("message-input");
343343

344344
// Check if SpeechRecognition is available
@@ -357,22 +357,22 @@ document.addEventListener("DOMContentLoaded", () => {
357357

358358
voiceBtn.addEventListener("click", () => {
359359
recognition.start();
360-
voiceBtn.innerText = "🎙️ Listening...";
360+
voiceBtn.innerText = "Listening...";
361361
});
362362

363363
recognition.onresult = (event) => {
364364
const transcript = event.results[0][0].transcript;
365365
messageInput.value = transcript; // Insert the transcribed text
366366
handleSend()
367-
voiceBtn.innerText = "🎤"; // Reset button
367+
voiceBtn.innerText = ""; // Reset button
368368
};
369369

370370
recognition.onerror = (event) => {
371371
console.error("Speech Recognition Error:", event.error);
372-
voiceBtn.innerText = "🎤"; // Reset button
372+
voiceBtn.innerText = ""; // Reset button
373373
};
374374

375375
recognition.onend = () => {
376-
voiceBtn.innerText = "🎤"; // Reset button after stopping
376+
voiceBtn.innerText = ""; // Reset button after stopping
377377
};
378378
});

‎chat-ui-quince/src/style.css‎

Lines changed: 16 additions & 45 deletions
Original file line numberDiff line numberDiff line change
@@ -104,6 +104,8 @@ body {
104104
position: relative;
105105
padding: 10px 0;
106106
flex-shrink: 0;
107+
display: flex; /* Ensure flexbox layout */
108+
justify-content: space-between; /* Place items at opposite ends */
107109
}
108110

109111
.stroke-\[2\] {
@@ -125,66 +127,35 @@ body {
125127
box-sizing: border-box;
126128
}
127129

130+
#voice-btn, #read-out-loud-btn, #send-btn {
131+
width: 60px; /* Match width of send button */
132+
height: 60px; /* Match height of send button */
133+
display: flex; /* Use flex to center the icon inside */
134+
justify-content: center;
135+
align-items: center;
136+
background-color: #E8ECEF; /* Light gray background */
137+
border-radius: 50%; /* Round buttons */
138+
border: none;
139+
cursor: pointer;
140+
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
141+
padding: 12px; /* Some padding to make the button larger */
142+
}
143+
128144
#send-btn {
129145
position: absolute;
130146
right: 15px;
131147
bottom: 20px;
132-
width: 30px;
133-
height: 30px;
134-
background: #fff;
135-
border: none;
136148
border-radius: 50%;
137149
color: #000;
138150
font-size: 16px;
139-
cursor: pointer;
140-
display: flex;
141-
align-items: center;
142-
justify-content: center;
143151
}
144152

145153
#send-btn:hover {
146154
background: #e0e0e0;
147155
}
148156

149157

150-
/* Style for the voice button */
151-
#voice-btn {
152-
background-color: #E8ECEF; /* Light gray background */
153-
border-radius: 50%; /* Round button */
154-
border: none; /* No border */
155-
padding: 12px; /* Some padding to make the button larger */
156-
cursor: pointer; /* Pointer on hover */
157-
display: flex; /* Flexbox to center the icon */
158-
justify-content: center; /* Center horizontally */
159-
align-items: center; /* Center vertically */
160-
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
161-
}
162158

163-
/* Style for the read out loud button */
164-
#read-out-loud-btn {
165-
background-color: #E8ECEF; /* Same background */
166-
border: none; /* No border */
167-
padding: 10px; /* Padding */
168-
background: #fff;
169-
border-radius: 50%;
170-
cursor: pointer; /* Pointer on hover */
171-
display: flex;
172-
justify-content: center; /* Center the icon */
173-
align-items: center; /* Center the icon */
174-
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); /* Optional subtle shadow */
175-
}
176-
177-
/* Make the svg icon a smaller size */
178-
#voice-btn svg {
179-
width: 20px; /* Set icon size */
180-
height: 20px; /* Set icon size */
181-
}
182-
183-
/* Optional: Style for the speaker icon */
184-
#speaker-icon {
185-
width: 32px; /* Match the size of the other button */
186-
height: 32px; /* Keep the icon square */
187-
}
188159

189160

190161
.disclaimer {

‎nginx.conf‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -57,7 +57,7 @@ server {
5757
style-src 'self' https://accounts.google.com 'unsafe-inline';
5858
connect-src 'self' https://accounts.google.com ws://quincefinance.xyz wss://quincefinance.xyz;
5959
frame-src https://accounts.google.com;
60-
img-src 'self' data:;";
60+
img-src 'self' data: https://cryptologos.cc;";
6161

6262
#add_header Content-Security-Policy "default-src 'self'; script-src 'self' https://accounts.google.com https://apis.google.com https://www.gstatic.com 'unsafe-inline' 'unsafe-eval' blob: data:; style-src 'self' 'unsafe-inline'; connect-src 'self' https://accounts.google.com ws://quincefinance.xyz wss://quincefinance.xyz; frame-src https://accounts.google.com;";
6363
#add_header Content-Security-Policy "default-src 'self'; script-src 'self' https://apis.google.com https://www.gstatic.com 'unsafe-inline' 'unsafe-eval' blob: data:; style-src 'self' 'unsafe-inline'; connect-src 'self' https://accounts.google.com ws://quincefinance.xyz wss://quincefinance.xyz; frame-src https://accounts.google.com;";

0 commit comments

Comments
 (0)