124 lines
3.1 KiB
CSS
124 lines
3.1 KiB
CSS
/* macOS-style window buttons for GNOME Shell
|
||
* This extension replaces the default window buttons with macOS-style traffic lights
|
||
* Works with any GTK theme - overlay CSS on top of existing theme
|
||
*/
|
||
|
||
/* Override title button colors to match macOS traffic lights */
|
||
#panel .close-button,
|
||
#panel .maximize-button,
|
||
#panel .minimize-button {
|
||
-gtk-icon-source: none !important;
|
||
border-radius: 50% !important;
|
||
min-width: 12px !important;
|
||
min-height: 12px !important;
|
||
padding: 0 !important;
|
||
margin: 0 3px !important;
|
||
}
|
||
|
||
/* Close button - red */
|
||
#panel .close-button,
|
||
.window-close-button,
|
||
.titlebar .close-button {
|
||
background-color: #ff5f57 !important;
|
||
border: 1px solid #e0443e !important;
|
||
}
|
||
#panel .close-button:hover,
|
||
.window-close-button:hover,
|
||
.titlebar .close-button:hover {
|
||
background-color: #ff3b30 !important;
|
||
border-color: #e0443e !important;
|
||
}
|
||
#panel .close-button:active,
|
||
.window-close-button:active,
|
||
.titlebar .close-button:active {
|
||
background-color: #e0443e !important;
|
||
}
|
||
|
||
/* Minimize button - yellow */
|
||
#panel .minimize-button {
|
||
background-color: #febc2e !important;
|
||
border: 1px solid #d4a017 !important;
|
||
}
|
||
#panel .minimize-button:hover {
|
||
background-color: #f5a623 !important;
|
||
border-color: #d4a017 !important;
|
||
}
|
||
#panel .minimize-button:active {
|
||
background-color: #d4a017 !important;
|
||
}
|
||
|
||
/* Maximize button - green */
|
||
#panel .maximize-button {
|
||
background-color: #28c840 !important;
|
||
border: 1px solid #1aab29 !important;
|
||
}
|
||
#panel .maximize-button:hover {
|
||
background-color: #1aab29 !important;
|
||
border-color: #1aab29 !important;
|
||
}
|
||
#panel .maximize-button:active {
|
||
background-color: #1aab29 !important;
|
||
}
|
||
|
||
/* macOS-style symbols inside buttons (using text) */
|
||
#panel .close-button::after {
|
||
content: "✕" !important;
|
||
color: #8b0000 !important;
|
||
font-size: 8px !important;
|
||
font-weight: bold !important;
|
||
line-height: 1 !important;
|
||
}
|
||
#panel .minimize-button::after {
|
||
content: "−" !important;
|
||
color: #8b6914 !important;
|
||
font-size: 12px !important;
|
||
font-weight: bold !important;
|
||
line-height: 1 !important;
|
||
}
|
||
#panel .maximize-button::after {
|
||
content: "+" !important;
|
||
color: #005a00 !important;
|
||
font-size: 10px !important;
|
||
font-weight: bold !important;
|
||
line-height: 1 !important;
|
||
}
|
||
|
||
/* Hide default icons */
|
||
#panel .close-button > *,
|
||
#panel .minimize-button > *,
|
||
#panel .maximize-button > * {
|
||
opacity: 0 !important;
|
||
}
|
||
|
||
/* Ensure buttons are in the right order (close, minimize, maximize - macOS order) */
|
||
#panel .close-button {
|
||
order: -1 !important;
|
||
}
|
||
#panel .minimize-button {
|
||
order: 0 !important;
|
||
}
|
||
#panel .maximize-button {
|
||
order: 1 !important;
|
||
}
|
||
|
||
/* Title bar styling for GTK applications with CSD */
|
||
.titlebar {
|
||
border-radius: 8px 8px 0 0 !important;
|
||
padding: 4px !important;
|
||
}
|
||
.titlebar.default-decoration {
|
||
border: none !important;
|
||
box-shadow: none !important;
|
||
}
|
||
|
||
/* Headerbar styling */
|
||
headerbar {
|
||
border-radius: 8px 8px 0 0 !important;
|
||
padding: 4px !important;
|
||
}
|
||
headerbar.selection-mode,
|
||
.titlebar.selection-mode {
|
||
background-color: #007aff !important;
|
||
border-color: #007aff !important;
|
||
}
|