[libhandy/wip/haecker-felix/flap-widget: 2/2] Add a HdyFlap demo




commit ecf4dc4f419741943f1d88a91cb5642c24c47626
Author: Alexander Mikhaylenko <alexm gnome org>
Date:   Wed Nov 25 15:28:33 2020 +0500

    Add a HdyFlap demo

 examples/handy-demo.gresources.xml                 |   6 +
 examples/hdy-demo-window.c                         |  12 ++
 examples/hdy-demo-window.ui                        | 106 ++++++++++
 examples/hdy-flap-demo-window.c                    | 115 +++++++++++
 examples/hdy-flap-demo-window.h                    |  13 ++
 examples/hdy-flap-demo-window.ui                   | 229 +++++++++++++++++++++
 examples/icons/view-sidebar-end-symbolic-rtl.svg   |  68 ++++++
 examples/icons/view-sidebar-end-symbolic.svg       |  68 ++++++
 examples/icons/view-sidebar-start-symbolic-rtl.svg |  44 ++++
 examples/icons/view-sidebar-start-symbolic.svg     |  44 ++++
 examples/icons/widget-flap-symbolic.svg            |   1 +
 examples/meson.build                               |   1 +
 examples/style.css                                 |   4 +
 13 files changed, 711 insertions(+)
---
diff --git a/examples/handy-demo.gresources.xml b/examples/handy-demo.gresources.xml
index e0825c1d..52e20e49 100644
--- a/examples/handy-demo.gresources.xml
+++ b/examples/handy-demo.gresources.xml
@@ -8,9 +8,14 @@
     <file preprocess="xml-stripblanks">icons/gesture-touchpad-swipe-back-symbolic.svg</file>
     <file preprocess="xml-stripblanks">icons/gnome-smartphone-symbolic.svg</file>
     <file preprocess="xml-stripblanks">icons/light-mode-symbolic.svg</file>
+    <file preprocess="xml-stripblanks">icons/view-sidebar-start-symbolic.svg</file>
+    <file preprocess="xml-stripblanks">icons/view-sidebar-start-symbolic-rtl.svg</file>
+    <file preprocess="xml-stripblanks">icons/view-sidebar-end-symbolic.svg</file>
+    <file preprocess="xml-stripblanks">icons/view-sidebar-end-symbolic-rtl.svg</file>
     <file preprocess="xml-stripblanks">icons/widget-carousel-symbolic.svg</file>
     <file preprocess="xml-stripblanks">icons/widget-clamp-symbolic.svg</file>
     <file preprocess="xml-stripblanks">icons/widget-deck-symbolic.svg</file>
+    <file preprocess="xml-stripblanks">icons/widget-flap-symbolic.svg</file>
     <file preprocess="xml-stripblanks">icons/widget-keypad-symbolic.svg</file>
     <file preprocess="xml-stripblanks">icons/widget-leaflet-symbolic.svg</file>
     <file preprocess="xml-stripblanks">icons/widget-list-symbolic.svg</file>
@@ -21,6 +26,7 @@
   <gresource prefix="/sm/puri/Handy/Demo/ui">
     <file preprocess="xml-stripblanks">hdy-demo-preferences-window.ui</file>
     <file preprocess="xml-stripblanks">hdy-demo-window.ui</file>
+    <file preprocess="xml-stripblanks">hdy-flap-demo-window.ui</file>
     <file preprocess="xml-stripblanks">hdy-view-switcher-demo-window.ui</file>
     <file compressed="true">style.css</file>
   </gresource>
diff --git a/examples/hdy-demo-window.c b/examples/hdy-demo-window.c
index ffcab9a1..729048be 100644
--- a/examples/hdy-demo-window.c
+++ b/examples/hdy-demo-window.c
@@ -1,6 +1,7 @@
 #include "hdy-demo-window.h"
 
 #include <glib/gi18n.h>
+#include "hdy-flap-demo-window.h"
 #include "hdy-view-switcher-demo-window.h"
 
 struct _HdyDemoWindow
@@ -425,6 +426,16 @@ avatar_update_contacts (HdyDemoWindow *self)
   }
 }
 
+static void
+flap_demo_clicked_cb (GtkButton     *btn,
+                      HdyDemoWindow *self)
+{
+  HdyFlapDemoWindow *window = hdy_flap_demo_window_new ();
+
+  gtk_window_set_transient_for (GTK_WINDOW (window), GTK_WINDOW (self));
+  gtk_widget_show (GTK_WIDGET (window));
+}
+
 static void
 hdy_demo_window_constructed (GObject *object)
 {
@@ -487,6 +498,7 @@ hdy_demo_window_class_init (HdyDemoWindowClass *klass)
   gtk_widget_class_bind_template_callback_full (widget_class, "carousel_return_clicked_cb", 
G_CALLBACK(carousel_return_clicked_cb));
   gtk_widget_class_bind_template_callback_full (widget_class, "avatar_file_remove_cb", 
G_CALLBACK(avatar_file_remove_cb));
   gtk_widget_class_bind_template_callback_full (widget_class, "avatar_file_set_cb", 
G_CALLBACK(avatar_file_set_cb));
+  gtk_widget_class_bind_template_callback_full (widget_class, "flap_demo_clicked_cb", 
G_CALLBACK(flap_demo_clicked_cb));
 }
 
 static void
diff --git a/examples/hdy-demo-window.ui b/examples/hdy-demo-window.ui
index 9d00588f..de613382 100644
--- a/examples/hdy-demo-window.ui
+++ b/examples/hdy-demo-window.ui
@@ -2277,6 +2277,112 @@
                         <property name="title">Window</property>
                       </packing>
                     </child>
+                    <child>
+                      <object class="GtkBox">
+                        <property name="visible">True</property>
+                        <property name="orientation">vertical</property>
+                        <property name="can_focus">False</property>
+                        <property name="valign">center</property>
+                        <property name="expand">True</property>
+                        <child>
+                          <object class="GtkBox">
+                            <property name="visible">True</property>
+                            <property name="orientation">vertical</property>
+                            <property name="can_focus">False</property>
+                            <property name="halign">center</property>
+                            <property name="valign">center</property>
+                            <property name="margin-bottom">32</property>
+                            <child>
+                              <object class="GtkImage">
+                                <property name="visible">True</property>
+                                <property name="can_focus">False</property>
+                                <property name="valign">center</property>
+                                <property name="pixel_size">128</property>
+                                <property name="icon_name">widget-flap-symbolic</property>
+                                <property name="icon-size">0</property>
+                                <property name="margin-bottom">18</property>
+                                <style>
+                                  <class name="dim-label"/>
+                                </style>
+                              </object>
+                              <packing>
+                                <property name="expand">False</property>
+                                <property name="fill">True</property>
+                              </packing>
+                            </child>
+                            <child>
+                              <object class="GtkBox">
+                                <property name="visible">True</property>
+                                <property name="orientation">vertical</property>
+                                <child>
+                                  <object class="GtkLabel">
+                                    <property name="visible">True</property>
+                                    <property name="opacity">0.5</property>
+                                    <property name="can_focus">False</property>
+                                    <property name="label" translatable="yes">Flap</property>
+                                    <property name="halign">center</property>
+                                    <property name="xalign">0</property>
+                                    <property name="margin-bottom">12</property>
+                                    <attributes>
+                                      <attribute name="weight" value="bold"/>
+                                      <attribute name="scale" value="2"/>
+                                    </attributes>
+                                  </object>
+                                  <packing>
+                                    <property name="expand">False</property>
+                                    <property name="fill">True</property>
+                                  </packing>
+                                </child>
+                                <child>
+                                  <object class="GtkLabel">
+                                    <property name="visible">True</property>
+                                    <property name="opacity">0.5</property>
+                                    <property name="can_focus">False</property>
+                                    <property name="label" translatable="yes">A widgets showing a flap next 
to or above the content.</property>
+                                    <property name="justify">center</property>
+                                    <property name="use_markup">true</property>
+                                    <property name="wrap">True</property>
+                                  </object>
+                                  <packing>
+                                    <property name="expand">False</property>
+                                    <property name="fill">True</property>
+                                  </packing>
+                                </child>
+                              </object>
+                              <packing>
+                                <property name="expand">False</property>
+                                <property name="fill">True</property>
+                              </packing>
+                            </child>
+                          </object>
+                        </child>
+                        <child>
+                          <object class="GtkBox">
+                            <property name="visible">True</property>
+                            <property name="orientation">vertical</property>
+                            <property name="can_focus">False</property>
+                            <property name="halign">center</property>
+                            <property name="spacing">12</property>
+                            <child>
+                              <object class="GtkButton">
+                                <property name="visible">True</property>
+                                <property name="label" translatable="yes">Run the demo</property>
+                                <signal name="clicked" handler="flap_demo_clicked_cb" swapped="no"/>
+                              </object>
+                              <packing>
+                                <property name="expand">False</property>
+                                <property name="fill">True</property>
+                                <property name="position">1</property>
+                              </packing>
+                            </child>
+                          </object>
+                        </child>
+                      </object>
+                      <packing>
+                        <property name="name">flap</property>
+                        <property name="title">Flap</property>
+                      </packing>
+                    </child>
                   </object>
                 </child>
               </object>
diff --git a/examples/hdy-flap-demo-window.c b/examples/hdy-flap-demo-window.c
new file mode 100644
index 00000000..9c8075d5
--- /dev/null
+++ b/examples/hdy-flap-demo-window.c
@@ -0,0 +1,115 @@
+#include "hdy-flap-demo-window.h"
+
+#include <glib/gi18n.h>
+
+struct _HdyFlapDemoWindow
+{
+  HdyWindow parent_instance;
+
+  HdyFlap *flap;
+  GtkWidget *reveal_btn_start;
+  GtkWidget *reveal_btn_end;
+  HdyComboRow *fold_policy_row;
+  HdyComboRow *transition_type_row;
+};
+
+G_DEFINE_TYPE (HdyFlapDemoWindow, hdy_flap_demo_window, HDY_TYPE_WINDOW)
+
+static gchar *
+fold_policy_name (HdyEnumValueObject *value,
+                  gpointer            user_data)
+{
+  g_return_val_if_fail (HDY_IS_ENUM_VALUE_OBJECT (value), NULL);
+
+  switch (hdy_enum_value_object_get_value (value)) {
+  case HDY_FLAP_FOLD_POLICY_NEVER:
+    return g_strdup (_("Never"));
+  case HDY_FLAP_FOLD_POLICY_ALWAYS:
+    return g_strdup (_("Always"));
+  case HDY_FLAP_FOLD_POLICY_AUTO:
+    return g_strdup (_("Auto"));
+  default:
+    return NULL;
+  }
+}
+
+static gchar *
+transition_type_name (HdyEnumValueObject *value,
+                      gpointer            user_data)
+{
+  g_return_val_if_fail (HDY_IS_ENUM_VALUE_OBJECT (value), NULL);
+
+  switch (hdy_enum_value_object_get_value (value)) {
+  case HDY_FLAP_TRANSITION_TYPE_OVER:
+    return g_strdup (_("Over"));
+  case HDY_FLAP_TRANSITION_TYPE_UNDER:
+    return g_strdup (_("Under"));
+  case HDY_FLAP_TRANSITION_TYPE_SLIDE:
+    return g_strdup (_("Slide"));
+  case HDY_FLAP_TRANSITION_TYPE_OVER_TRANSPARENT:
+    return g_strdup (_("Over (transparent)"));
+  default:
+    return NULL;
+  }
+}
+
+static void
+start_toggle_button_toggled_cb (GtkToggleButton    *button,
+                                HdyFlapDemoWindow *self)
+{
+  if (gtk_toggle_button_get_active (button)) {
+    hdy_flap_set_flap_position (self->flap, GTK_PACK_START);
+    gtk_widget_hide (self->reveal_btn_end);
+    gtk_widget_show (self->reveal_btn_start);
+  } else {
+    hdy_flap_set_flap_position (self->flap, GTK_PACK_END);
+    gtk_widget_hide (self->reveal_btn_start);
+    gtk_widget_show (self->reveal_btn_end);
+  }
+}
+
+static void
+stack_notify_visible_child_cb (HdyFlapDemoWindow *self)
+{
+  if (hdy_flap_get_folded (self->flap) && !hdy_flap_get_locked (self->flap))
+    hdy_flap_set_reveal_flap (self->flap, FALSE);
+}
+
+static void
+hdy_flap_demo_window_class_init (HdyFlapDemoWindowClass *klass)
+{
+  GtkWidgetClass *widget_class = GTK_WIDGET_CLASS (klass);
+
+  gtk_widget_class_set_template_from_resource (widget_class, 
"/sm/puri/Handy/Demo/ui/hdy-flap-demo-window.ui");
+  gtk_widget_class_bind_template_child (widget_class, HdyFlapDemoWindow, flap);
+  gtk_widget_class_bind_template_child (widget_class, HdyFlapDemoWindow, reveal_btn_start);
+  gtk_widget_class_bind_template_child (widget_class, HdyFlapDemoWindow, reveal_btn_end);
+  gtk_widget_class_bind_template_child (widget_class, HdyFlapDemoWindow, fold_policy_row);
+  gtk_widget_class_bind_template_child (widget_class, HdyFlapDemoWindow, transition_type_row);
+  gtk_widget_class_bind_template_callback (widget_class, start_toggle_button_toggled_cb);
+  gtk_widget_class_bind_template_callback (widget_class, stack_notify_visible_child_cb);
+}
+
+static void
+hdy_flap_demo_window_init (HdyFlapDemoWindow *self)
+{
+  gtk_widget_init_template (GTK_WIDGET (self));
+
+  hdy_combo_row_set_for_enum (self->fold_policy_row,
+                              HDY_TYPE_FLAP_FOLD_POLICY,
+                              fold_policy_name, NULL, NULL);
+  hdy_combo_row_set_selected_index (self->fold_policy_row,
+                                    HDY_FLAP_FOLD_POLICY_AUTO);
+
+  hdy_combo_row_set_for_enum (self->transition_type_row,
+                              HDY_TYPE_FLAP_TRANSITION_TYPE,
+                              transition_type_name, NULL, NULL);
+  hdy_combo_row_set_selected_index (self->transition_type_row,
+                                    HDY_FLAP_TRANSITION_TYPE_OVER);
+}
+
+HdyFlapDemoWindow *
+hdy_flap_demo_window_new (void)
+{
+  return g_object_new (HDY_TYPE_FLAP_DEMO_WINDOW, NULL);
+}
diff --git a/examples/hdy-flap-demo-window.h b/examples/hdy-flap-demo-window.h
new file mode 100644
index 00000000..9f74ac5c
--- /dev/null
+++ b/examples/hdy-flap-demo-window.h
@@ -0,0 +1,13 @@
+#pragma once
+
+#include <handy.h>
+
+G_BEGIN_DECLS
+
+#define HDY_TYPE_FLAP_DEMO_WINDOW (hdy_flap_demo_window_get_type())
+
+G_DECLARE_FINAL_TYPE (HdyFlapDemoWindow, hdy_flap_demo_window, HDY, FLAP_DEMO_WINDOW, HdyWindow)
+
+HdyFlapDemoWindow *hdy_flap_demo_window_new (void);
+
+G_END_DECLS
diff --git a/examples/hdy-flap-demo-window.ui b/examples/hdy-flap-demo-window.ui
new file mode 100644
index 00000000..1995beef
--- /dev/null
+++ b/examples/hdy-flap-demo-window.ui
@@ -0,0 +1,229 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<interface>
+  <requires lib="gtk+" version="3.20"/>
+  <requires lib="libhandy" version="0.0"/>
+  <template class="HdyFlapDemoWindow" parent="HdyWindow">
+    <property name="modal">True</property>
+    <property name="window_position">center-on-parent</property>
+    <property name="default-width">640</property>
+    <property name="default-height">480</property>
+    <child>
+      <object class="GtkBox">
+        <property name="visible">True</property>
+        <property name="orientation">vertical</property>
+        <child>
+          <object class="HdyHeaderBar">
+            <property name="visible">True</property>
+            <property name="show_close_button">True</property>
+            <property name="title">HdyFlap Demo</property>
+            <child>
+              <object class="GtkToggleButton" id="reveal_btn_start">
+                <property name="visible">True</property>
+                <property name="active" bind-source="flap" bind-property="reveal-flap" 
bind-flags="sync-create|bidirectional"/>
+                <child>
+                  <object class="GtkImage">
+                    <property name="visible">True</property>
+                    <property name="icon-name">view-sidebar-start-symbolic</property>
+                  </object>
+                </child>
+              </object>
+            </child>
+            <child>
+              <object class="GtkToggleButton" id="reveal_btn_end">
+                <property name="visible">False</property>
+                <property name="active" bind-source="flap" bind-property="reveal-flap" 
bind-flags="sync-create|bidirectional"/>
+                <child>
+                  <object class="GtkImage">
+                    <property name="visible">True</property>
+                    <property name="icon-name">view-sidebar-end-symbolic</property>
+                  </object>
+                </child>
+              </object>
+              <packing>
+                <property name="pack-type">end</property>
+              </packing>
+            </child>
+          </object>
+        </child>
+        <child>
+          <object class="HdyFlap" id="flap">
+            <property name="visible">True</property>
+            <property name="locked" bind-source="locked_switch" bind-property="active" 
bind-flags="sync-create"/>
+            <property name="fold-policy" bind-source="fold_policy_row" bind-property="selected-index"/>
+            <property name="transition-type" bind-source="transition_type_row" 
bind-property="selected-index"/>
+            <property name="modal" bind-source="modal_switch" bind-property="active" 
bind-flags="sync-create"/>
+            <property name="swipe-to-open" bind-source="swipe_to_open_switch" bind-property="active" 
bind-flags="sync-create"/>
+            <property name="swipe-to-close" bind-source="swipe_to_close_switch" bind-property="active" 
bind-flags="sync-create"/>
+            <child type="flap">
+              <object class="GtkStackSidebar">
+                <property name="visible">True</property>
+                <property name="stack">stack</property>
+                <property name="width-request">200</property>
+                <style>
+                  <class name="transparent"/>
+                </style>
+              </object>
+            </child>
+            <child type="separator">
+              <object class="GtkSeparator">
+                <property name="visible">True</property>
+                <style>
+                  <class name="sidebar"/>
+                </style>
+              </object>
+            </child>
+            <child>
+              <object class="GtkStack" id="stack">
+                <property name="visible">True</property>
+                <property name="vexpand">True</property>
+                <property name="width-request">360</property>
+                <signal name="notify::visible-child" handler="stack_notify_visible_child_cb" swapped="true"/>
+                <child>
+                  <object class="HdyPreferencesPage">
+                    <property name="visible">True</property>
+                    <child>
+                      <object class="HdyPreferencesGroup">
+                        <property name="visible">True</property>
+                        <child>
+                          <object class="HdyComboRow" id="fold_policy_row">
+                            <property name="visible">True</property>
+                            <property name="title" translatable="yes">Fold policy</property>
+                          </object>
+                        </child>
+                        <child>
+                          <object class="HdyActionRow">
+                            <property name="visible">True</property>
+                            <property name="title" translatable="yes">Locked</property>
+                            <property name="subtitle" translatable="yes">Sidebar visibility doesn't change 
when fold state changes</property>
+                            <property name="activatable_widget">locked_switch</property>
+                            <child>
+                              <object class="GtkSwitch" id="locked_switch">
+                                <property name="visible">True</property>
+                                <property name="valign">center</property>
+                              </object>
+                            </child>
+                          </object>
+                        </child>
+                      </object>
+                    </child>
+                  </object>
+                  <packing>
+                    <property name="title" translatable="yes">Folding</property>
+                  </packing>
+                </child>
+                <child>
+                  <object class="HdyPreferencesPage">
+                    <property name="visible">True</property>
+                    <child>
+                      <object class="HdyPreferencesGroup">
+                        <property name="visible">True</property>
+                        <child>
+                          <object class="HdyActionRow">
+                            <property name="visible">True</property>
+                            <property name="title" translatable="yes">Flap position</property>
+                            <child>
+                              <object class="GtkBox">
+                                <property name="visible">True</property>
+                                <property name="valign">center</property>
+                                <style>
+                                  <class name="linked"/>
+                                </style>
+                                <child>
+                                  <object class="GtkRadioButton" id="start_toggle_button">
+                                    <property name="label" translatable="yes">Start</property>
+                                    <property name="visible">True</property>
+                                    <property name="draw-indicator">False</property>
+                                    <property name="active">True</property>
+                                    <signal name="toggled" handler="start_toggle_button_toggled_cb"/>
+                                  </object>
+                                </child>
+                                <child>
+                                  <object class="GtkRadioButton" id="end_toggle_button">
+                                    <property name="label" translatable="yes">End</property>
+                                    <property name="visible">True</property>
+                                    <property name="draw-indicator">False</property>
+                                    <property name="group">start_toggle_button</property>
+                                  </object>
+                                </child>
+                              </object>
+                            </child>
+                          </object>
+                        </child>
+                        <child>
+                          <object class="HdyComboRow" id="transition_type_row">
+                            <property name="visible">True</property>
+                            <property name="title" translatable="yes">Transition type</property>
+                          </object>
+                        </child>
+                      </object>
+                    </child>
+                  </object>
+                  <packing>
+                    <property name="title" translatable="yes">Layout</property>
+                  </packing>
+                </child>
+                <child>
+                  <object class="HdyPreferencesPage">
+                    <property name="visible">True</property>
+                    <child>
+                      <object class="HdyPreferencesGroup">
+                        <property name="visible">True</property>
+                        <child>
+                          <object class="HdyActionRow">
+                            <property name="visible">True</property>
+                            <property name="title" translatable="yes">Modal</property>
+                            <property name="subtitle" translatable="yes">Clicking outside the sidebar or 
pressing Esc will close it when folded</property>
+                            <property name="subtitle-lines">2</property>
+                            <property name="activatable_widget">modal_switch</property>
+                            <child>
+                              <object class="GtkSwitch" id="modal_switch">
+                                <property name="visible">True</property>
+                                <property name="valign">center</property>
+                                <property name="active">True</property>
+                              </object>
+                            </child>
+                          </object>
+                        </child>
+                        <child>
+                          <object class="HdyActionRow">
+                            <property name="visible">True</property>
+                            <property name="title" translatable="yes">Swipe to Open</property>
+                            <property name="activatable_widget">swipe_to_open_switch</property>
+                            <child>
+                              <object class="GtkSwitch" id="swipe_to_open_switch">
+                                <property name="visible">True</property>
+                                <property name="valign">center</property>
+                                <property name="active">True</property>
+                              </object>
+                            </child>
+                          </object>
+                        </child>
+                        <child>
+                          <object class="HdyActionRow">
+                            <property name="visible">True</property>
+                            <property name="title" translatable="yes">Swipe to Close</property>
+                            <property name="activatable_widget">swipe_to_close_switch</property>
+                            <child>
+                              <object class="GtkSwitch" id="swipe_to_close_switch">
+                                <property name="visible">True</property>
+                                <property name="valign">center</property>
+                                <property name="active">True</property>
+                              </object>
+                            </child>
+                          </object>
+                        </child>
+                      </object>
+                    </child>
+                  </object>
+                  <packing>
+                    <property name="title" translatable="yes">Interaction</property>
+                  </packing>
+                </child>
+              </object>
+            </child>
+          </object>
+        </child>
+      </object>
+    </child>
+  </template>
+</interface>
diff --git a/examples/icons/view-sidebar-end-symbolic-rtl.svg 
b/examples/icons/view-sidebar-end-symbolic-rtl.svg
new file mode 100644
index 00000000..a64dd061
--- /dev/null
+++ b/examples/icons/view-sidebar-end-symbolic-rtl.svg
@@ -0,0 +1,68 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/";
+   xmlns:cc="http://creativecommons.org/ns#";
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#";
+   xmlns:svg="http://www.w3.org/2000/svg";
+   xmlns="http://www.w3.org/2000/svg";
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd";
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape";
+   width="4.2333331mm"
+   height="4.2333331mm"
+   viewBox="0 0 4.2333331 4.2333331"
+   version="1.1"
+   id="svg10539"
+   sodipodi:docname="view-sidebar-end-symbolic.svg"
+   inkscape:version="1.0.1 (3bc2e813f5, 2020-09-07)">
+  <sodipodi:namedview
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1"
+     objecttolerance="10"
+     gridtolerance="10"
+     guidetolerance="10"
+     inkscape:pageopacity="0"
+     inkscape:pageshadow="2"
+     inkscape:window-width="1920"
+     inkscape:window-height="1016"
+     id="namedview8"
+     showgrid="false"
+     inkscape:zoom="51.04843"
+     inkscape:cx="7.9999996"
+     inkscape:cy="7.9999996"
+     inkscape:window-x="0"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="svg10539" />
+  <defs
+     id="defs10533" />
+  <metadata
+     id="metadata10536">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage"; />
+        <dc:title />
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <g
+     id="layer1"
+     transform="matrix(-1,0,0,1,-40.972619,-342.50834)">
+    <path
+       id="rect10509"
+       
style="color:#bebebe;display:inline;overflow:visible;visibility:visible;opacity:1;fill:#241f31;fill-opacity:1;stroke:none;stroke-width:1;marker:none"
+       d="M 3,2 C 1.9093002,2 1,2.9093039 1,4 v 8 c 0,1.090696 0.9093002,2 2,2 h 10 c 1.090704,0 2,-0.909304 
2,-2 V 4 C 15,2.9093039 14.090704,2 13,2 Z m 0,2 h 3 v 8 H 3 Z m 4,0 h 6 v 8 H 7 Z"
+       transform="matrix(0.26458333,0,0,0.26458333,-45.205952,342.50834)" />
+    <rect
+       transform="matrix(0,-1,-1,0,0,0)"
+       
style="color:#bebebe;display:inline;overflow:visible;visibility:visible;opacity:0.35;fill:#241f31;fill-opacity:1;stroke:none;stroke-width:0.264583;marker:none"
+       id="rect10511"
+       width="2.1166327"
+       height="0.79374611"
+       x="-345.68332"
+       y="43.618412" />
+  </g>
+</svg>
diff --git a/examples/icons/view-sidebar-end-symbolic.svg b/examples/icons/view-sidebar-end-symbolic.svg
new file mode 100644
index 00000000..a64dd061
--- /dev/null
+++ b/examples/icons/view-sidebar-end-symbolic.svg
@@ -0,0 +1,68 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/";
+   xmlns:cc="http://creativecommons.org/ns#";
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#";
+   xmlns:svg="http://www.w3.org/2000/svg";
+   xmlns="http://www.w3.org/2000/svg";
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd";
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape";
+   width="4.2333331mm"
+   height="4.2333331mm"
+   viewBox="0 0 4.2333331 4.2333331"
+   version="1.1"
+   id="svg10539"
+   sodipodi:docname="view-sidebar-end-symbolic.svg"
+   inkscape:version="1.0.1 (3bc2e813f5, 2020-09-07)">
+  <sodipodi:namedview
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1"
+     objecttolerance="10"
+     gridtolerance="10"
+     guidetolerance="10"
+     inkscape:pageopacity="0"
+     inkscape:pageshadow="2"
+     inkscape:window-width="1920"
+     inkscape:window-height="1016"
+     id="namedview8"
+     showgrid="false"
+     inkscape:zoom="51.04843"
+     inkscape:cx="7.9999996"
+     inkscape:cy="7.9999996"
+     inkscape:window-x="0"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="svg10539" />
+  <defs
+     id="defs10533" />
+  <metadata
+     id="metadata10536">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage"; />
+        <dc:title />
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <g
+     id="layer1"
+     transform="matrix(-1,0,0,1,-40.972619,-342.50834)">
+    <path
+       id="rect10509"
+       
style="color:#bebebe;display:inline;overflow:visible;visibility:visible;opacity:1;fill:#241f31;fill-opacity:1;stroke:none;stroke-width:1;marker:none"
+       d="M 3,2 C 1.9093002,2 1,2.9093039 1,4 v 8 c 0,1.090696 0.9093002,2 2,2 h 10 c 1.090704,0 2,-0.909304 
2,-2 V 4 C 15,2.9093039 14.090704,2 13,2 Z m 0,2 h 3 v 8 H 3 Z m 4,0 h 6 v 8 H 7 Z"
+       transform="matrix(0.26458333,0,0,0.26458333,-45.205952,342.50834)" />
+    <rect
+       transform="matrix(0,-1,-1,0,0,0)"
+       
style="color:#bebebe;display:inline;overflow:visible;visibility:visible;opacity:0.35;fill:#241f31;fill-opacity:1;stroke:none;stroke-width:0.264583;marker:none"
+       id="rect10511"
+       width="2.1166327"
+       height="0.79374611"
+       x="-345.68332"
+       y="43.618412" />
+  </g>
+</svg>
diff --git a/examples/icons/view-sidebar-start-symbolic-rtl.svg 
b/examples/icons/view-sidebar-start-symbolic-rtl.svg
new file mode 100644
index 00000000..780e286c
--- /dev/null
+++ b/examples/icons/view-sidebar-start-symbolic-rtl.svg
@@ -0,0 +1,44 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/";
+   xmlns:cc="http://creativecommons.org/ns#";
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#";
+   xmlns:svg="http://www.w3.org/2000/svg";
+   xmlns="http://www.w3.org/2000/svg";
+   width="4.2333331mm"
+   height="4.2333331mm"
+   viewBox="0 0 4.2333331 4.2333331"
+   version="1.1"
+   id="svg10539">
+  <defs
+     id="defs10533" />
+  <metadata
+     id="metadata10536">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage"; />
+        <dc:title></dc:title>
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <g
+     id="layer1"
+     transform="translate(45.205952,-342.50834)">
+    <path
+       id="rect10509"
+       
style="color:#bebebe;display:inline;overflow:visible;visibility:visible;opacity:1;fill:#241f31;fill-opacity:1;stroke:none;stroke-width:0.99999994;marker:none"
+       d="M 3 2 C 1.9093002 2 1 2.9093039 1 4 L 1 12 C 1 13.090696 1.9093002 14 3 14 L 13 14 C 14.090704 14 
15 13.090696 15 12 L 15 4 C 15 2.9093039 14.090704 2 13 2 L 3 2 z M 3 4 L 6 4 L 6 12 L 3 12 L 3 4 z M 7 4 L 
13 4 L 13 12 L 7 12 L 7 4 z "
+       transform="matrix(0.26458333,0,0,0.26458333,-45.205952,342.50834)" />
+    <rect
+       transform="matrix(0,-1,-1,0,0,0)"
+       
style="color:#bebebe;display:inline;overflow:visible;visibility:visible;opacity:0.35;fill:#241f31;fill-opacity:1;stroke:none;stroke-width:0.26458332;marker:none"
+       id="rect10511"
+       width="2.1166327"
+       height="0.79374611"
+       x="-345.68332"
+       y="43.618412" />
+  </g>
+</svg>
diff --git a/examples/icons/view-sidebar-start-symbolic.svg b/examples/icons/view-sidebar-start-symbolic.svg
new file mode 100644
index 00000000..780e286c
--- /dev/null
+++ b/examples/icons/view-sidebar-start-symbolic.svg
@@ -0,0 +1,44 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/";
+   xmlns:cc="http://creativecommons.org/ns#";
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#";
+   xmlns:svg="http://www.w3.org/2000/svg";
+   xmlns="http://www.w3.org/2000/svg";
+   width="4.2333331mm"
+   height="4.2333331mm"
+   viewBox="0 0 4.2333331 4.2333331"
+   version="1.1"
+   id="svg10539">
+  <defs
+     id="defs10533" />
+  <metadata
+     id="metadata10536">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage"; />
+        <dc:title></dc:title>
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <g
+     id="layer1"
+     transform="translate(45.205952,-342.50834)">
+    <path
+       id="rect10509"
+       
style="color:#bebebe;display:inline;overflow:visible;visibility:visible;opacity:1;fill:#241f31;fill-opacity:1;stroke:none;stroke-width:0.99999994;marker:none"
+       d="M 3 2 C 1.9093002 2 1 2.9093039 1 4 L 1 12 C 1 13.090696 1.9093002 14 3 14 L 13 14 C 14.090704 14 
15 13.090696 15 12 L 15 4 C 15 2.9093039 14.090704 2 13 2 L 3 2 z M 3 4 L 6 4 L 6 12 L 3 12 L 3 4 z M 7 4 L 
13 4 L 13 12 L 7 12 L 7 4 z "
+       transform="matrix(0.26458333,0,0,0.26458333,-45.205952,342.50834)" />
+    <rect
+       transform="matrix(0,-1,-1,0,0,0)"
+       
style="color:#bebebe;display:inline;overflow:visible;visibility:visible;opacity:0.35;fill:#241f31;fill-opacity:1;stroke:none;stroke-width:0.26458332;marker:none"
+       id="rect10511"
+       width="2.1166327"
+       height="0.79374611"
+       x="-345.68332"
+       y="43.618412" />
+  </g>
+</svg>
diff --git a/examples/icons/widget-flap-symbolic.svg b/examples/icons/widget-flap-symbolic.svg
new file mode 100644
index 00000000..372cdba9
--- /dev/null
+++ b/examples/icons/widget-flap-symbolic.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg"; width="16" height="16"><g color="#000" font-weight="400" 
font-family="sans-serif" fill="#2e3436"><path d="M3.994 5h1c.31 0 .552.09.75.281L8.4 8l-2.656 
2.719c-.198.19-.44.281-.75.281h-1v-1c0-.257.13-.528.312-.719L5.588 8 4.306 
6.719c-.182-.19-.312-.462-.312-.719z" 
style="line-height:normal;text-indent:0;text-align:start;text-decoration-line:none;text-decoration-style:solid;text-decoration-color:#000;text-transform:none;white-space:normal;isolation:auto;mix-blend-mode:normal;solid-color:#000;solid-opacity:1;marker:none"
 overflow="visible"/><path d="M2.994 1v2h7v10h-7v2h7s.459.014.947-.23c.489-.245 1.053-.937 
1.053-1.77V3c0-.833-.564-1.525-1.053-1.77C10.453.986 9.994 1 9.994 1z" 
style="line-height:normal;font-variant-ligatures:normal;font-variant-position:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-alternates:normal;font-feature-settings:normal;text-indent:0;text-align:start;text-decoration-line:none;text-decoration-s
 
tyle:solid;text-decoration-color:#000;text-transform:none;text-orientation:mixed;white-space:normal;shape-padding:0;isolation:auto;mix-blend-mode:normal;solid-color:#000;solid-opacity:1"
 overflow="visible" fill-rule="evenodd"/></g></svg>
\ No newline at end of file
diff --git a/examples/meson.build b/examples/meson.build
index 883607e9..d95a89b8 100644
--- a/examples/meson.build
+++ b/examples/meson.build
@@ -12,6 +12,7 @@ handy_demo_sources = [
   'handy-demo.c',
   'hdy-demo-preferences-window.c',
   'hdy-demo-window.c',
+  'hdy-flap-demo-window.c',
   'hdy-view-switcher-demo-window.c',
   libhandy_generated_headers,
 ]
diff --git a/examples/style.css b/examples/style.css
index 71829367..40653606 100644
--- a/examples/style.css
+++ b/examples/style.css
@@ -3,6 +3,10 @@ stacksidebar list {
   border-right-width: 0px;
 }
 
+stacksidebar.transparent list {
+  background: alpha(@theme_base_color, .9);
+}
+
 carousel.vertical .carousel-icon {
   -gtk-icon-transform: rotate(90deg);
 }



[Date Prev][Date Next]   [Thread Prev][Thread Next]   [Thread Index] [Date Index] [Author Index]