dracula / dracula/gtk

[FEATURE] Customizing GTK Window Borders with CSS for Enhanced Window Decorations

Open
#296 2 comments 1 reaction 0 assignees View on GitHub
enhancement
Dominant language
CSS
Stars
1.1k
Forks
85
PR merge metrics
No merged PRs in 30d

Description

I made a modification to the GTK window decorations by adding borders and customizing their appearance using CSS. The main changes include defining custom properties for the border width, color, and radius, which are applied to various types of windows. Here's a breakdown of the modifications:

```css
/*********************
* Window Decorations *
*********************/
window {
--wm-border-width: 3px;
--wm-border-color: #6272a4;
--wm-border-radius: 12px;
}
window.maximized {
border: var(--wm-border-width) solid var(--wm-border-color);
border-radius: var(--wm-border-radius);
}
window:not(.maximized) {
border: none;
}
window.csd {
margin: 0px;
border-radius: var(--wm-border-radius);
border: var(--wm-border-width) solid var(--wm-border-color);
}
window.csd.popup,
window.csd.dialog.message {
border-radius: 12px;
border: 4px solid var(--wm-border-color);
}
window.solid-csd {
margin: 0;
padding: 4px;
border-radius: var(--wm-border-radius);
border: 4px solid var(--wm-border-color);
}
window.popup,
window.ssd {
border-radius: 12px;
border: 4px solid var(--wm-border-color);
}
```
![WhatsApp Image 2024-11-26 at 00 48 44](https://github.com/user-attachments/assets/a1b4cced-7f61-40c1-94ba-b41717d91983)

![image](https://github.com/user-attachments/assets/8c9d10bf-e957-4ba4-a5b9-136622a9ac09)

Contributor guide

No contributing guide indexed for this repository

Research direction

Start by locating the GTK theme CSS entry point where window decoration selectors are defined, then compare it with the selectors and custom properties shown in the issue. The work is done when the requested border widths, colors, radii, and window-state behavior are applied consistently and the affected windows match the attached examples.

Written by the indexing model from the issue text.

Assessment

Tech stack
css
Domain
design
Issue type
Feature
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.