56 lines
1.5 KiB
TypeScript
56 lines
1.5 KiB
TypeScript
import React from "react";
|
|
import { FiGitBranch, FiCheckCircle } from "react-icons/fi";
|
|
|
|
export const TitleBar: React.FC = () => {
|
|
return (
|
|
<div
|
|
style={{
|
|
height: "32px",
|
|
backgroundColor: "#2d2d30",
|
|
display: "flex",
|
|
alignItems: "center",
|
|
justifyContent: "space-between",
|
|
padding: "0 12px",
|
|
borderBottom: "1px solid #3e3e42",
|
|
}}
|
|
>
|
|
<div style={{ display: "flex", alignItems: "center", gap: "12px" }}>
|
|
<div style={{ display: "flex", gap: "8px" }}>
|
|
<div
|
|
style={{
|
|
width: "12px",
|
|
height: "12px",
|
|
borderRadius: "50%",
|
|
backgroundColor: "#ed6a5e",
|
|
}}
|
|
/>
|
|
<div
|
|
style={{
|
|
width: "12px",
|
|
height: "12px",
|
|
borderRadius: "50%",
|
|
backgroundColor: "#f5bd4f",
|
|
}}
|
|
/>
|
|
<div
|
|
style={{
|
|
width: "12px",
|
|
height: "12px",
|
|
borderRadius: "50%",
|
|
backgroundColor: "#61c454",
|
|
}}
|
|
/>
|
|
</div>
|
|
<span style={{ color: "#cccccc", fontSize: "12px", fontWeight: 500 }}>
|
|
Web VS Code
|
|
</span>
|
|
</div>
|
|
<div style={{ display: "flex", alignItems: "center", gap: "8px" }}>
|
|
<FiGitBranch size={12} color="#858585" />
|
|
<span style={{ color: "#858585", fontSize: "11px" }}>main</span>
|
|
<FiCheckCircle size={12} color="#61c454" />
|
|
</div>
|
|
</div>
|
|
);
|
|
};
|