Gnome Shell 样式表答案

【问题标题】：Gnome Shell StylesheetGnome Shell 样式表
【发布时间】：2021-03-30 19:25:20
【问题描述】：

所以我正在制作一个 gnome shell 扩展，但我不知道如何使我的扩展的一部分成为正常字体粗细。这是我的 extension.js 文件：

'use strict';

const { St, Clutter } = imports.gi;

const Main = imports.ui.main;

let _myText;

class Extension {

    enable() {
    _myText = new St.Label({ text: 'This should be normal font weight.', y_align: Clutter.ActorAlign.CENTER, style_class: 'panel-button', track_hover: false, reactive: false});
    Main.panel._leftBox.insert_child_at_index(_myText, 10)
    }

    disable() {
    _myText.destroy();
    }
}

function init() {
    return new Extension();
}

这是我的 stylesheet.css 文件：

StLabel._myText {
    font-weight: normal;
}

我做错了什么？

【问题讨论】：

标签： javascript css ubuntu gnome-shell gnome-shell-extensions

【解决方案1】：

您不能只在 CSS 中使用任意 JavaScript 变量；你需要告诉一个小部件它应该使用什么 CSS 名称和类：

.my-class {
    font-weight: normal;
}

const myLabel = new St.Label({
    text: 'My Label',
    style_class: 'panel-button my-class',
});

另见：

Anatomy of an Extension 在 gjs.guide
St Documentation gjs-docs.gnome.org

【讨论】：