Rimuovere le CSD delle applicazioni GKT3 su KDE

Agosto 6, 2019 Marco Giannini

L’integrazione delle applicazioni GTK su KDE è sempre stato un problema, specie a seguito dell’introduzione del Client-Side Decoration (CSD) sulle GTK3.

A causa del CSD, alcune applicazioni GNOME su KDE risultano non uniformi con KDE. Volete un esempio? Date uno sguardo a come appare Simple Scan su KDE (nella fattispecie KDE neon)

Simple Scan prima

I pulsanti di chiusura, minimizzazione e massimizzazione finestre, insieme a quelli di gestione del programma, vanno tutti assieme sulla stessa barra.

Premessa

Prima di procedere con la guida è bene precisare una cosa. La modifica che andremo ad apportare al sistema andrà ad influire anche su applicazioni sulla barra del titolo di Firefox.

Installiamo gtk3-nocsd

Fortunatamente un modo per migliorare l’aspetto delle applicazioni GKT3 che utilizzano i CDS su KDE esiste.

Il trucco consiste nell’utilizzare gtk3-nocsd, un pacchetto che va disabilitare le decorazioni lato client delle GTK3.

Se siete su KDE neon o Kubuntu il pacchetto gtk3-nocsd è già presente nei repository delle distro e vi basterà installarlo dando da terminale

sudo apt install gtk3-nocsd

Impostiamo il tema Breeze e impostiamo lo stile GTK

Assicuratevi ora di aver impostato il tema Breeze nello stile delle applicazioni GNOME/GTK (se non avete cambiato tema su KDE neon è già così).

Rechiamoci ora nella cartella ~/.config/gtk-3.0

Qui creiamo un nuovo file chiamato gtk.css e incolliamo dentro quanto segue

headerbar {
  border-radius: 0;
  color: #232627;
  background-color: #eff0f1;}

  headerbar .path-bar button {
    color: #232627;}

  headerbar button {
    color: #232627;}

    headerbar button:disabled {
      color: rgba(35, 38, 39, 0.35);}

    headerbar button:backdrop {
      color: #bdc3c7;}

    headerbar button.flat {
      color: #232627;}

      headerbar button.flat:disabled {
        color: rgba(35, 38, 39, 0.35);}

      headerbar button.flat:backdrop {
        color: #bdc3c7;}

    headerbar button:hover {
      color: #232627;}

      headerbar button:hover:backdrop {
        color: #bdc3c7;}

  headerbar .title {
    color: transparent;
    font-size: 0pt;}

Potete farlo con il vostro editor di testo preferito. Una volta fatto salvate il file.

Adesso non ci resta che riavviare la sessione. Una volta fatto ecco come apparirà il tutto