diff --git a/microphone/index.html b/microphone/index.html
index d0b7087..da40fcc 100644
--- a/microphone/index.html
+++ b/microphone/index.html
@@ -9,7 +9,7 @@
+
diff --git a/microphone/index.js b/microphone/index.js
index ae2a931..1f9ad4e 100644
--- a/microphone/index.js
+++ b/microphone/index.js
@@ -35,11 +35,11 @@ function draw() {
analyser.getByteTimeDomainData(dataArray);
- ctx.fillStyle = '#fff';
+ ctx.fillStyle = '#313244';
ctx.fillRect(0, 0, canvas.width, canvas.height);
ctx.lineWidth = 2;
- ctx.strokeStyle = '#000';
+ ctx.strokeStyle = '#fff';
ctx.beginPath();
const sliceWidth = canvas.width / dataArray.length;
diff --git a/microphone/style.css b/microphone/style.css
index 744e837..6e1b78a 100644
--- a/microphone/style.css
+++ b/microphone/style.css
@@ -2,24 +2,23 @@
canvas {
width: 100%;
- background-color: #fff;
+ background-color: var(--surface0);
border-radius: 10px;
pointer-events: none;
}
button {
cursor: pointer;
- background-color: #2a2a2a;
+ background-color: var(--surface0);
padding: 7px;
- color: #c0c0c0;
- border: #2c2c2c solid 2px;
+ color: var(--text);
+ border: var(--surface2) solid 2px;
border-radius: 4px;
margin-top: 10px;
font-size: 16px;
}
button:hover {
- background-color: #2c2c2c;
- color: #d0d0d0;
- border: #2e2e2e solid 2px;
+ background-color: var(--surface1);
+ border: var(--surface2) solid 2px;
}
\ No newline at end of file