codey/codey.lol
1
0
Fork 0
Code Issues Pull Requests Activity

misc

Browse Source
This commit is contained in:
codey
2025-12-19 07:46:41 -05:00
parent 2327e330de
commit d5d2923dc5
6 changed files with 303 additions and 88 deletions
Download Patch File Download Diff File Expand all files Collapse all files

115
src/components/RandomMsg.jsx
View File

@@ -28,70 +28,63 @@ export default function RandomMsg() {
return (
<div className="random-msg-container">
<div className="random-msg" style={{ position: "relative", display: "inline-block" }}>
{randomMsg && (
<>
<small
style={{ cursor: responseTime !== null ? "pointer" : "default" }}
onClick={() => {
if (responseTime !== null) setShowResponseTime((v) => !v);
}}
tabIndex={0}
onBlur={() => setShowResponseTime(false)}
>
<i>{randomMsg}</i>
</small>
{showResponseTime && responseTime !== null && (
<div
style={{
position: "absolute",
left: "50%",
top: "100%",
transform: "translateX(-50%)",
marginTop: 4,
background: "#222",
color: "#fff",
fontSize: "0.75em",
padding: "2px 8px",
borderRadius: 6,
boxShadow: "0 2px 8px rgba(0,0,0,0.15)",
zIndex: 10,
whiteSpace: "nowrap"
}}
role="status"
aria-live="polite"
>
API response: {responseTime} ms
</div>
)}
</>
)}
</div>
{randomMsg && (
<button
aria-label="New footer message"
type="button"
className="flex items-center justify-center px-2 py-1 rounded-md hover:bg-neutral-200 dark:hover:bg-neutral-800 transition-opacity new-msg-button"
onClick={getRandomMsg}
>
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 24 24"
width="16"
height="16"
aria-hidden="true"
focusable="false"
className="inline-block"
<div className="random-msg" style={{ position: "relative", display: "inline" }}>
<small
style={{ cursor: responseTime !== null ? "pointer" : "default" }}
onClick={() => {
if (responseTime !== null) setShowResponseTime((v) => !v);
}}
tabIndex={0}
onBlur={() => setShowResponseTime(false)}
>
<path
d="M17.65 6.35a7.95 7.95 0 0 0-5.65-2.35 8 8 0 1 0 7.75 9.94h-2.08a6 6 0 1 1-5.67-7.94 5.94 5.94 0 0 1 4.22 1.78L13 11h7V4z"
fill="currentColor"
/>
</svg>
</button>
<i>{randomMsg}</i>
</small>
<button
aria-label="New footer message"
type="button"
className="random-msg-reload"
onClick={getRandomMsg}
>
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 24 24"
width="12"
height="12"
aria-hidden="true"
focusable="false"
>
<path
d="M17.65 6.35a7.95 7.95 0 0 0-5.65-2.35 8 8 0 1 0 7.75 9.94h-2.08a6 6 0 1 1-5.67-7.94 5.94 5.94 0 0 1 4.22 1.78L13 11h7V4z"
fill="currentColor"
/>
</svg>
</button>
{showResponseTime && responseTime !== null && (
<div
style={{
position: "absolute",
left: "50%",
top: "100%",
transform: "translateX(-50%)",
marginTop: 4,
background: "#222",
color: "#fff",
fontSize: "0.75em",
padding: "2px 8px",
borderRadius: 6,
boxShadow: "0 2px 8px rgba(0,0,0,0.15)",
zIndex: 10,
whiteSpace: "nowrap"
}}
role="status"
aria-live="polite"
>
API response: {responseTime} ms
</div>
)}
</div>
)}
</div>
);
}