summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorCarlos Soriano <csoriano@gnome.org>2015-09-24 11:04:39 +0200
committerCarlos Soriano <csoriano@gnome.org>2015-10-14 14:12:36 +0200
commit258d685afdf65891f2d667bb5237cfa4b9b88b0f (patch)
treebb831f675ecfb5e004dfc03a9cbdd5ecf9478f68
parent8a641f94c0917c66f49b145f9d7e8b626ed7abfb (diff)
downloadgtk+-258d685afdf65891f2d667bb5237cfa4b9b88b0f.tar.gz
gtkplacesview: rotate server list icon on toggled
Disclosure triangles are usually used pointing down, however in this case the popover spawns in the upper direction, which makes it odd looking. Instead of pointing always down or up, point down when not toggled and animate a rotation when toggled.
-rw-r--r--gtk/theme/Adwaita/_common.scss16
-rw-r--r--gtk/theme/Adwaita/gtk-contained-dark.css10
-rw-r--r--gtk/theme/Adwaita/gtk-contained.css10
-rw-r--r--gtk/ui/gtkplacesview.ui5
4 files changed, 40 insertions, 1 deletions
diff --git a/gtk/theme/Adwaita/_common.scss b/gtk/theme/Adwaita/_common.scss
index 43bc9c23cc..df50fb94da 100644
--- a/gtk/theme/Adwaita/_common.scss
+++ b/gtk/theme/Adwaita/_common.scss
@@ -2913,6 +2913,22 @@ GtkPlacesSidebar.sidebar {
}
}
+/****************
+ * File chooser *
+ ****************/
+
+GtkPlacesView {
+ .server-list-button > GtkImage {
+ transition: 200ms $ease-out-quad;
+ -gtk-icon-transform: rotate(0turn);
+ }
+
+ .server-list-button:checked > GtkImage {
+ transition: 200ms $ease-out-quad;
+ -gtk-icon-transform: rotate(-0.5turn);
+ }
+}
+
/*********
* Paned *
*********/
diff --git a/gtk/theme/Adwaita/gtk-contained-dark.css b/gtk/theme/Adwaita/gtk-contained-dark.css
index 1f195d9744..8d8deec5b9 100644
--- a/gtk/theme/Adwaita/gtk-contained-dark.css
+++ b/gtk/theme/Adwaita/gtk-contained-dark.css
@@ -3966,6 +3966,16 @@ GtkPlacesSidebar.sidebar .sidebar-new-bookmark-row {
.sidebar-item.needs-attention > .label {
background-size: 6px 6px, 0 0; }
+/****************
+ * File chooser *
+ ****************/
+GtkPlacesView .server-list-button > GtkImage {
+ transition: 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
+ -gtk-icon-transform: rotate(0turn); }
+GtkPlacesView .server-list-button:checked > GtkImage {
+ transition: 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
+ -gtk-icon-transform: rotate(-0.5turn); }
+
/*********
* Paned *
*********/
diff --git a/gtk/theme/Adwaita/gtk-contained.css b/gtk/theme/Adwaita/gtk-contained.css
index e3684a6f3f..0a5a44f87a 100644
--- a/gtk/theme/Adwaita/gtk-contained.css
+++ b/gtk/theme/Adwaita/gtk-contained.css
@@ -4138,6 +4138,16 @@ GtkPlacesSidebar.sidebar .sidebar-new-bookmark-row {
.sidebar-item.needs-attention > .label {
background-size: 6px 6px, 0 0; }
+/****************
+ * File chooser *
+ ****************/
+GtkPlacesView .server-list-button > GtkImage {
+ transition: 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
+ -gtk-icon-transform: rotate(0turn); }
+GtkPlacesView .server-list-button:checked > GtkImage {
+ transition: 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
+ -gtk-icon-transform: rotate(-0.5turn); }
+
/*********
* Paned *
*********/
diff --git a/gtk/ui/gtkplacesview.ui b/gtk/ui/gtkplacesview.ui
index d554c28d09..697825528e 100644
--- a/gtk/ui/gtkplacesview.ui
+++ b/gtk/ui/gtkplacesview.ui
@@ -256,10 +256,13 @@
<property name="receives_default">1</property>
<property name="direction">up</property>
<property name="popover">recent_servers_popover</property>
+ <style>
+ <class name="server-list-button"/>
+ </style>
<child>
<object class="GtkImage">
<property name="visible">1</property>
- <property name="icon_name">pan-up-symbolic</property>
+ <property name="icon_name">pan-down-symbolic</property>
</object>
</child>
</object>