Add CSS to button

Cool borders for listbox
This commit is contained in:
takotori 2023-11-02 14:14:07 +01:00
parent 6636643f8c
commit 3316a838b1
10 changed files with 87 additions and 13 deletions

View file

@ -9,4 +9,9 @@ fn main() {
"src/resources/icons/resources.gresource.xml",
"src.icons.gresource",
);
glib_build_tools::compile_resources(
&["src/resources/style"],
"src/resources/style/resources.gresource.xml",
"src.style.gresource",
);
}

View file

@ -1,10 +1,13 @@
#![allow(non_snake_case)]
use gtk::{Application, CssProvider, gio};
use gtk::gdk::Display;
use gtk::prelude::*;
use crate::components::window::window::Window;
mod components;
use gtk::prelude::*;
use gtk::{gio, Application};
use crate::components::window::window::Window;
const APP_ID: &str = "org.Xetibo.ReSet";
fn main() {
@ -12,17 +15,32 @@ fn main() {
.expect("Failed to register resources.");
gio::resources_register_include!("src.icons.gresource")
.expect("Failed to register resources.");
gio::resources_register_include!("src.style.gresource")
.expect("Failed to register resources.");
let app = Application::builder().application_id(APP_ID).build();
app.connect_startup(move |_| {
adw::init().unwrap();
loadCss();
});
app.connect_activate(buildUI);
app.run();
}
fn loadCss() {
let provider = CssProvider::new();
provider.load_from_resource("/org/Xetibo/ReSet/style/style.css");
gtk::style_context_add_provider_for_display(
&Display::default().expect("Could not connect to a display."),
&provider,
gtk::STYLE_PROVIDER_PRIORITY_APPLICATION,
);
}
#[allow(non_snake_case)]
fn buildUI(app: &Application) {
let window = Window::new(app);

View file

@ -4,13 +4,14 @@
<requires lib="gtk" version="4.12"/>
<template class="resetBluetooth" parent="GtkBox">
<property name="halign">start</property>
<property name="margin-start">5</property>
<property name="orientation">vertical</property>
<property name="valign">start</property>
<property name="width-request">400</property>
<child>
<object class="GtkListBox" id="resetBluetoothDetails">
<property name="css-classes">boxed-list</property>
<property name="margin-bottom">10</property>
<property name="margin-start">5</property>
<property name="show-separators">True</property>
<property name="valign">start</property>
<child>
@ -48,6 +49,7 @@
<property name="halign">start</property>
<property name="justify">right</property>
<property name="label">Available device</property>
<property name="margin-start">5</property>
</object>
</child>
<child>
@ -57,6 +59,10 @@
<object class="GtkViewport">
<child>
<object class="GtkListBox" id="resetBluetoothAvailableDevices">
<property name="css-classes">boxed-list
</property>
<property name="margin-end">5</property>
<property name="margin-start">5</property>
<property name="show-separators">True</property>
<property name="valign">start</property>
</object>
@ -76,6 +82,7 @@
<property name="halign">start</property>
<property name="justify">right</property>
<property name="label">Connected devices</property>
<property name="margin-start">5</property>
</object>
</child>
<child>
@ -85,6 +92,10 @@
<object class="GtkViewport">
<child>
<object class="GtkListBox" id="resetBluetoothConnectedDevices">
<property name="css-classes">boxed-list
</property>
<property name="margin-end">5</property>
<property name="margin-start">5</property>
<property name="show-separators">True</property>
<property name="valign">start</property>
</object>

View file

@ -6,6 +6,7 @@
<property name="selectable">False</property>
<child>
<object class="GtkBox">
<property name="margin-start">5</property>
<child>
<object class="GtkImage" id="resetBluetoothDeviceType">
<property name="icon-name">input-mouse-symbolic</property>

View file

@ -86,6 +86,7 @@
</child>
<child>
<object class="GtkButton" id="resetClose">
<property name="css-classes">resetClose</property>
<property name="halign">start</property>
<property name="icon-name">window-close-symbolic</property>
<property name="margin-start">5</property>

View file

@ -53,7 +53,7 @@
(4,64,"GtkLabel",None,63,None,None,None,None,None),
(4,65,"GtkScrolledWindow",None,63,None,None,None,1,None),
(4,66,"GtkViewport",None,65,None,None,None,None,None),
(4,68,"GtkListBox","resetWifiList",66,None,None,None,1,None),
(4,69,"GtkListBox","resetWifiList",66,None,None,None,1,None),
(5,1,"GtkListBoxRow","resetWifiEntry",None,None,None,None,None,None),
(5,2,"GtkBox",None,1,None,None,None,None,None),
(5,4,"GtkLabel","resetWifiLabel",2,None,None,None,1,None),
@ -158,6 +158,7 @@
(3,28,"GtkButton","icon-name","go-previous-symbolic-rtl",None,None,None,None,None,None,None,None,None),
(3,28,"GtkWidget","valign","start",None,None,None,None,None,None,None,None,None),
(3,31,"GtkButton","icon-name","window-close-symbolic",None,None,None,None,None,None,None,None,None),
(3,31,"GtkWidget","css-classes","resetClose",None,None,None,None,None,None,None,None,None),
(3,31,"GtkWidget","halign","start",None,None,None,None,None,None,None,None,None),
(3,31,"GtkWidget","margin-start","5",None,None,None,None,None,None,None,None,None),
(3,32,"GtkFlowBox","column-spacing","25",None,None,None,None,None,None,None,None,None),
@ -187,15 +188,17 @@
(3,39,"GtkButton","label","About",None,None,None,None,None,None,None,None,None),
(4,7,"GtkOrientable","orientation","vertical",None,None,None,None,None,None,None,None,None),
(4,7,"GtkWidget","halign","start",None,None,None,None,None,None,None,None,None),
(4,7,"GtkWidget","margin-start","5",None,None,None,None,None,None,None,None,None),
(4,7,"GtkWidget","valign","start",None,None,None,None,None,None,None,None,None),
(4,7,"GtkWidget","width-request","400",None,None,None,None,None,None,None,None,None),
(4,42,"GtkButton","label","Advanced",None,None,None,None,None,None,None,None,None),
(4,42,"GtkWidget","halign","start",None,None,None,None,None,None,None,None,None),
(4,42,"GtkWidget","margin-start","5",None,None,None,None,None,None,None,None,None),
(4,42,"GtkWidget","margin-top","5",None,None,None,None,None,None,None,None,None),
(4,42,"GtkWidget","valign","start",None,None,None,None,None,None,None,None,None),
(4,54,"GtkListBox","show-separators","True",None,None,None,None,None,None,None,None,None),
(4,54,"GtkWidget","css-classes","boxed-list",None,None,None,None,None,None,None,None,None),
(4,54,"GtkWidget","margin-bottom","10",None,None,None,None,None,None,None,None,None),
(4,54,"GtkWidget","margin-start","5",None,None,None,None,None,None,None,None,None),
(4,54,"GtkWidget","valign","start",None,None,None,None,None,None,None,None,None),
(4,55,"GtkListBoxRow","selectable","False",None,None,None,None,None,None,None,None,None),
(4,56,"GtkListBoxRow","selectable","False",None,None,None,None,None,None,None,None,None),
@ -218,10 +221,17 @@
(4,64,"GtkLabel","justify","right",None,None,None,None,None,None,None,None,None),
(4,64,"GtkLabel","label","Available networks",None,None,None,None,None,None,None,None,None),
(4,64,"GtkWidget","halign","start",None,None,None,None,None,None,None,None,None),
(4,64,"GtkWidget","margin-start","5",None,None,None,None,None,None,None,None,None),
(4,65,"GtkScrolledWindow","propagate-natural-height","True",None,None,None,None,None,None,None,None,None),
(4,68,"GtkListBox","show-separators","True",None,None,None,None,None,None,None,None,None),
(4,68,"GtkWidget","valign","start",None,None,None,None,None,None,None,None,None),
(4,69,"GtkListBox","show-separators","True",None,None,None,None,None,None,None,None,None),
(4,69,"GtkWidget","css-classes","boxed-list",None,None,None,None,None,None,None,None,None),
(4,69,"GtkWidget","margin-bottom","10",None,None,None,None,None,None,None,None,None),
(4,69,"GtkWidget","margin-end","5",None,None,None,None,None,None,None,None,None),
(4,69,"GtkWidget","margin-start","5",None,None,None,None,None,None,None,None,None),
(4,69,"GtkWidget","valign","start",None,None,None,None,None,None,None,None,None),
(5,1,"GtkListBoxRow","selectable","False",None,None,None,None,None,None,None,None,None),
(5,1,"GtkWidget","height-request","40",None,None,None,None,None,None,None,None,None),
(5,2,"GtkWidget","margin-start","5",None,None,None,None,None,None,None,None,None),
(5,4,"GtkLabel","ellipsize","end",None,None,None,None,None,None,None,None,None),
(5,4,"GtkLabel","label","LoremIpsumInternet",None,None,None,None,None,None,None,None,None),
(5,4,"GtkLabel","single-line-mode","True",None,None,None,None,None,None,None,None,None),
@ -230,7 +240,7 @@
(5,4,"GtkWidget","margin-end","10",None,None,None,None,None,None,None,None,None),
(5,4,"GtkWidget","width-request","200",None,None,None,None,None,None,None,None,None),
(5,5,"GtkButton","has-frame","False",None,None,None,None,None,None,None,None,None),
(5,5,"GtkButton","icon-name","text-x-generic-symbolic",None,None,None,None,None,None,None,None,None),
(5,5,"GtkButton","icon-name","info-symbolic",None,None,None,None,None,None,None,None,None),
(5,5,"GtkWidget","halign","start",None,None,None,None,None,None,None,None,None),
(5,5,"GtkWidget","valign","center",None,None,None,None,None,None,None,None,None),
(5,6,"GtkBox","spacing","-1",None,None,None,None,None,None,None,None,None),
@ -288,7 +298,6 @@
(8,23,"GtkLabel","label","Show Applications",None,None,None,None,None,None,None,None,None),
(10,1,"GtkOrientable","orientation","vertical",None,None,None,None,None,None,None,None,None),
(10,1,"GtkWidget","halign","start",None,None,None,None,None,None,None,None,None),
(10,1,"GtkWidget","margin-start","5",None,None,None,None,None,None,None,None,None),
(10,1,"GtkWidget","valign","start",None,None,None,None,None,None,None,None,None),
(10,1,"GtkWidget","width-request","400",None,None,None,None,None,None,None,None,None),
(10,18,"GtkButton","label","Advanced",None,None,None,None,None,None,None,None,None),
@ -303,15 +312,25 @@
(10,44,"GtkLabel","justify","right",None,None,None,None,None,None,None,None,None),
(10,44,"GtkLabel","label","Connected devices",None,None,None,None,None,None,None,None,None),
(10,44,"GtkWidget","halign","start",None,None,None,None,None,None,None,None,None),
(10,44,"GtkWidget","margin-start","5",None,None,None,None,None,None,None,None,None),
(10,45,"GtkListBox","show-separators","True",None,None,None,None,None,None,None,None,None),
(10,45,"GtkWidget","css-classes","boxed-list\n",None,None,None,None,None,None,None,None,None),
(10,45,"GtkWidget","margin-end","5",None,None,None,None,None,None,None,None,None),
(10,45,"GtkWidget","margin-start","5",None,None,None,None,None,None,None,None,None),
(10,45,"GtkWidget","valign","start",None,None,None,None,None,None,None,None,None),
(10,46,"GtkLabel","justify","right",None,None,None,None,None,None,None,None,None),
(10,46,"GtkLabel","label","Available device",None,None,None,None,None,None,None,None,None),
(10,46,"GtkLabel","label","Available devices",None,None,None,None,None,None,None,None,None),
(10,46,"GtkWidget","halign","start",None,None,None,None,None,None,None,None,None),
(10,46,"GtkWidget","margin-start","5",None,None,None,None,None,None,None,None,None),
(10,47,"GtkListBox","show-separators","True",None,None,None,None,None,None,None,None,None),
(10,47,"GtkWidget","css-classes","boxed-list\n",None,None,None,None,None,None,None,None,None),
(10,47,"GtkWidget","margin-end","5",None,None,None,None,None,None,None,None,None),
(10,47,"GtkWidget","margin-start","5",None,None,None,None,None,None,None,None,None),
(10,47,"GtkWidget","valign","start",None,None,None,None,None,None,None,None,None),
(10,48,"GtkListBox","show-separators","True",None,None,None,None,None,None,None,None,None),
(10,48,"GtkWidget","css-classes","boxed-list",None,None,None,None,None,None,None,None,None),
(10,48,"GtkWidget","margin-bottom","10",None,None,None,None,None,None,None,None,None),
(10,48,"GtkWidget","margin-start","5",None,None,None,None,None,None,None,None,None),
(10,48,"GtkWidget","valign","start",None,None,None,None,None,None,None,None,None),
(10,49,"GtkListBoxRow","selectable","False",None,None,None,None,None,None,None,None,None),
(10,50,"GtkWidget","height-request","40",None,None,None,None,None,None,None,None,None),
@ -323,6 +342,7 @@
(10,52,"GtkWidget","margin-end","5",None,None,None,None,None,None,None,None,None),
(10,52,"GtkWidget","valign","center",None,None,None,None,None,None,None,None,None),
(11,1,"GtkListBoxRow","selectable","False",None,None,None,None,None,None,None,None,None),
(11,2,"GtkWidget","margin-start","5",None,None,None,None,None,None,None,None,None),
(11,3,"GtkImage","icon-name","input-mouse-symbolic",None,None,None,None,None,None,None,None,None),
(11,3,"GtkWidget","margin-end","15",None,None,None,None,None,None,None,None,None),
(11,4,"GtkLabel","ellipsize","end",None,None,None,None,None,None,None,None,None),

View file

@ -4,13 +4,14 @@
<requires lib="gtk" version="4.12"/>
<template class="resetWifi" parent="GtkBox">
<property name="halign">start</property>
<property name="margin-start">5</property>
<property name="orientation">vertical</property>
<property name="valign">start</property>
<property name="width-request">400</property>
<child>
<object class="GtkListBox" id="resetWifiDetails">
<property name="css-classes">boxed-list</property>
<property name="margin-bottom">10</property>
<property name="margin-start">5</property>
<property name="show-separators">True</property>
<property name="valign">start</property>
<child>
@ -72,6 +73,7 @@
<property name="halign">start</property>
<property name="justify">right</property>
<property name="label">Available networks</property>
<property name="margin-start">5</property>
</object>
</child>
<child>
@ -81,6 +83,10 @@
<object class="GtkViewport">
<child>
<object class="GtkListBox" id="resetWifiList">
<property name="css-classes">boxed-list</property>
<property name="margin-bottom">10</property>
<property name="margin-end">5</property>
<property name="margin-start">5</property>
<property name="show-separators">True</property>
<property name="valign">start</property>
</object>
@ -95,6 +101,7 @@
<object class="GtkButton">
<property name="halign">start</property>
<property name="label">Advanced</property>
<property name="margin-start">5</property>
<property name="margin-top">5</property>
<property name="valign">start</property>
</object>

View file

@ -3,9 +3,11 @@
<interface>
<requires lib="gtk" version="4.12"/>
<template class="resetWifiEntry" parent="GtkListBoxRow">
<property name="height-request">40</property>
<property name="selectable">False</property>
<child>
<object class="GtkBox">
<property name="margin-start">5</property>
<child>
<object class="GtkBox">
<property name="spacing">-1</property>

View file

@ -0,0 +1,6 @@
<?xml version="1.0" encoding="UTF-8"?>
<gresources>
<gresource prefix="/org/Xetibo/ReSet/style">
<file compressed="true">style.css</file>
</gresource>
</gresources>

View file

@ -0,0 +1,3 @@
button.resetClose {
border-radius: 25px;
}