year-view: Port to GTK4

This commit is contained in:
Georges Basile Stavracas Neto
2022-02-12 13:08:50 -03:00
parent c31d2c5821
commit fd023e0a28
3 changed files with 373 additions and 2001 deletions
File diff suppressed because it is too large Load Diff
+43 -147
View File
@@ -1,172 +1,68 @@
<?xml version="1.0"?>
<interface>
<!-- interface-requires gtk+ 3.10 -->
<template class="GcalYearView" parent="GtkBox">
<property name="orientation">vertical</property>
<style>
<class name="year-view"/>
</style>
<child>
<object class="GtkScrolledWindow" id="scrolled_window">
<property name="visible">True</property>
<property name="shadow_type">none</property>
<object class="GtkLabel" id="year_label">
<property name="hexpand">true</property>
<property name="xalign">1.0</property>
<style>
<class name="secondary-label" />
</style>
</object>
</child>
<child>
<object class="GtkSeparator">
<property name="orientation">horizontal</property>
</object>
</child>
<child>
<object class="GtkScrolledWindow">
<property name="hexpand">True</property>
<property name="vexpand">True</property>
<signal name="edge-overshot" handler="navigator_edge_overshot_cb" object="GcalYearView" swapped="yes"/>
<signal name="scroll-event" handler="navigator_scroll_event_cb" object="GcalYearView" swapped="yes"/>
<style>
<class name="background" />
</style>
<child>
<object class="GtkViewport">
<property name="visible">True</property>
<property name="shadow_type">none</property>
<property name="vexpand">True</property>
<property name="scroll-to-focus">True</property>
<child>
<object class="GtkDrawingArea" id="navigator">
<property name="visible">True</property>
<property name="hexpand">True</property>
<property name="events">GDK_POINTER_MOTION_MASK|GDK_BUTTON_MOTION_MASK|GDK_BUTTON_PRESS_MASK|GDK_BUTTON_RELEASE_MASK|GDK_STRUCTURE_MASK</property>
<signal name="draw" handler="draw_navigator" object="GcalYearView" swapped="yes"/>
<signal name="button-press-event" handler="navigator_button_press_cb" object="GcalYearView" swapped="yes"/>
<signal name="button-release-event" handler="navigator_button_release_cb" object="GcalYearView" swapped="yes"/>
<signal name="motion-notify-event" handler="navigator_motion_notify_cb" object="GcalYearView" swapped="yes"/>
<signal name="drag-motion" handler="navigator_drag_motion_cb" object="GcalYearView" swapped="yes"/>
<signal name="drag-drop" handler="navigator_drag_drop_cb" object="GcalYearView" swapped="yes"/>
<signal name="drag-leave" handler="navigator_drag_leave_cb" object="GcalYearView" swapped="yes"/>
<style>
<class name="year-navigator"/>
</style>
</object>
</child>
</object>
</child>
</object>
<packing>
<property name="position">0</property>
<property name="pack_type">start</property>
</packing>
</child>
<child>
<object class="GtkBox" id="sidebar">
<property name="visible">True</property>
<property name="width_request">200</property>
<property name="orientation">vertical</property>
<child>
<object class="GtkStack" id="navigator_stack">
<property name="visible">True</property>
<child>
<object class="GtkScrolledWindow" id="navigator_sidebar">
<property name="visible">True</property>
<property name="shadow_type">none</property>
<property name="vexpand">True</property>
<object class="AdwClamp">
<property name="margin-top">24</property>
<property name="margin-bottom">24</property>
<property name="margin-start">24</property>
<property name="margin-end">24</property>
<property name="maximum-size">1600</property>
<property name="tightening-threshold">1200</property>
<child>
<object class="GtkListBox" id="events_sidebar">
<property name="visible">True</property>
<object class="GtkFlowBox" id="flowbox">
<property name="valign">center</property>
<property name="homogeneous">True</property>
<property name="selection-mode">none</property>
<property name="min-children-per-line">1</property>
<property name="max-children-per-line">4</property>
<property name="column-spacing">18</property>
<property name="row-spacing">18</property>
<signal name="child-activated" handler="on_flowbox_child_activated_cb" object="GcalYearView" swapped="no" />
<style>
<class name="sidebar"/>
<class name="year-navigator"/>
</style>
</object>
</child>
</object>
<packing>
<property name="name">events-list</property>
</packing>
</child>
<child>
<object class="GtkBox">
<property name="visible">True</property>
<property name="orientation">vertical</property>
<style>
<class name="sidebar"/>
</style>
<child>
<object class="GtkBox">
<property name="visible">True</property>
<property name="can_focus">False</property>
<property name="spacing">6</property>
<child>
<object class="GtkLabel" id="no_events_title">
<property name="visible">True</property>
<property name="halign">start</property>
<property name="label" translatable="yes">Today</property>
<style>
<class name="sidebar-header"/>
</style>
</object>
<packing>
<property name="expand">True</property>
<property name="fill">True</property>
<property name="position">0</property>
</packing>
</child>
<child>
<object class="GtkLabel" id="temp_label">
<property name="visible">True</property>
<property name="can_focus">False</property>
<property name="label">temp</property>
<property name="label">foo</property>
<style>
<class name="temp-label" />
</style>
</object>
<packing>
<property name="expand">False</property>
<property name="fill">True</property>
<property name="position">1</property>
</packing>
</child>
<child>
<object class="GtkImage" id="weather_icon">
<property name="visible">True</property>
<property name="can_focus">False</property>
</object>
<packing>
<property name="expand">False</property>
<property name="fill">True</property>
<property name="position">2</property>
</packing>
</child>
</object>
</child>
<child>
<object class="GtkLabel">
<property name="visible">True</property>
<property name="halign">start</property>
<property name="margin_start">6</property>
<property name="label" translatable="yes">No events</property>
<style>
<class name="dim-label"/>
<class name="italic-label"/>
</style>
</object>
<packing>
<property name="position">1</property>
</packing>
</child>
</object>
<packing>
<property name="position">1</property>
<property name="name">no-events</property>
</packing>
</child>
</object>
</child>
<child>
<object class="GtkButton">
<property name="visible">True</property>
<property name="valign">end</property>
<property name="label" translatable="yes">Add Event…</property>
<signal name="clicked" handler="add_event_clicked_cb" object="GcalYearView" swapped="yes"/>
</object>
<packing>
<property name="position">1</property>
</packing>
</child>
</object>
</child>
</template>
<object class="GtkPopover" id="popover">
<property name="relative_to">navigator</property>
<style>
<class name="events"/>
</style>
<signal name="closed" handler="popover_closed_cb" object="GcalYearView" swapped="yes"/>
</object>
</interface>
+24 -98
View File
@@ -37,130 +37,56 @@ calendar-view:selected {
}
/* Year View CSS */
.year-view {
padding: 0px;
.year-navigator grid.month {
padding: 12px;
}
/* Header the padding if for sizing, on drawing the spacing between cells,
* and the padding will be automatically calculated
* Because of year-view widget internals, the color property should be the same
* of .start-header selector */
.year-navigator {
padding: 12px;
color: @theme_selected_bg_color;
}
.year-navigator.header {
color: @theme_selected_bg_color;
font-weight: bold;
}
.year-navigator.lines {
color: alpha(@theme_fg_color, 0.4);
}
.year-navigator.days {
.year-navigator label.days {
padding: 5px;
color: @theme_fg_color;
font-size: 9pt;
min-width: 18px;
min-height: 18px;
}
.year-navigator.non-workday {
.year-navigator label.non-workday {
color: alpha(@theme_fg_color, 0.5);
}
.year-navigator.week-numbers {
font-size: 70%;
font-weight: bold;
border-radius: 2px;
.year-navigator label.week-number {
font-size: 0.5rem;
border-radius: 50%;
background-color: alpha(@theme_fg_color, 0.05);
color: alpha(@theme_fg_color, 0.4);
min-width: 18px;
min-height: 18px;
}
/* these two are supposed be changed in sync with .calendar-view */
.year-navigator.current {
background-color: black;
border-radius: 2px;
color: white;
font-weight: bold;
}
.year-navigator:selected {
color: @theme_selected_bg_color;
.year-navigator .current label {
color: @accent_fg_color;
background-color: @accent_bg_color;
border-radius: 50%;
font-weight: bold;
}
.year-navigator:hover {
background-color: alpha(@theme_fg_color, 0.1);
border-radius: 2px;
}
.year-navigator.dnd {
border: solid 1px #4e9a06;
box-shadow: inset 0 0 0 1px #4e9a06;
}
.year-navigator.with-events {
.year-navigator dot {
transform: translateX(-1px) translateY(-3px);
background-color: @theme_fg_color;
border-radius: 3px;
min-width: 3px;
min-height: 3px;
}
.year-navigator.with-events-selected {
background-color: @theme_selected_bg_color;
.year-navigator .current dot {
background-color: @accent_fg_color;
}
.year-navigator.with-events-non-workday {
.year-navigator .non-workday dot {
background-color: alpha(@theme_fg_color, 0.5);
}
.sidebar-header {
font-weight: bold;
font-size: 11pt;
}
.italic-label {
font-style: italic;
}
.year-view .sidebar {
padding: 4px;
border: 1px none @borders;
}
.year-view .sidebar:backdrop {
border-color: @unfocused_borders;
}
.year-view .sidebar:dir(ltr) {
border-left-style: solid;
}
.year-view .sidebar:dir(rtl) {
border-right-style: solid;
}
/* no events label */
.year-view box.sidebar label:nth-child(2) {
margin-top: 4px;
}
.year-view button {
border-radius: 0;
border-bottom-style: none;
}
.year-view button:dir(ltr) {
border-right-style: none;
}
.year-view button:dir(rtl) {
border-left-style: none;
}
.year-view scrolledwindow {
border-top-width: 0;
border-bottom-width: 0;
}
popover.events {
background-color: @theme_bg_color;
padding: 0;