Commit 6741421b authored by Fabian Riethmayer's avatar Fabian Riethmayer

Merge branch 'drawer' into 'master'

Added new images to global and context drawer

See merge request websites/hig-kde-org!6
parents 912fb2e1 2580e265
Context drawer
==============
.. container:: intend
|desktopicon| |mobileicon|
.. container:: available plasma qwidgets
|nbsp|
.. figure:: /img/Contextdrawer1.png
:figclass: border
:scale: 50 %
......
Global drawer
=============
.. figure:: /img/Menu_Drawer.png
:alt: Examples of different global drawers
.. container:: intend
Examples of different global drawers
|desktopicon| |mobileicon|
.. container:: available plasma qwidgets
|nbsp|
.. figure:: /img/Globaldrawer1.png
:alt: Global drawer on mobile
:figclass: border
:scale: 40 %
Global drawer on mobile
Purpose
-------
......@@ -17,6 +28,13 @@ current context either.
Is this the right control?
--------------------------
.. figure:: /img/Globaldrawer3.png
:figclass: border
:alt: Global drawer on desktop
:scale: 40 %
Global drawer on desktop
Use a Global Drawer whenever your application has any functions which
are not central enough to the application's main purpose to put them in
the main user interface, and which are not dependent on the current
......@@ -26,9 +44,17 @@ item), use the :doc:`Context Drawer <contextdrawer>`
Guidelines
----------
The Global Drawer is opened by swiping in from the left or right edge of
the screen (depending on a system-wide setting) and closed by swiping in
the other direction or tapping outside of it.
.. figure:: /img/Globaldrawer2.png
:alt: Global drawer on desktop
:scale: 40 %
:figclass: border
Hamburger button on the toolbar on desktop.
The Global Drawer is either opened by clicking on the hamburger button on the
toolbar or by swiping from the left edge of the screen. It can be closed by
swiping in the other direction, clicking the close button or tapping outside of
it.
A Global Drawer may contain the following controls:
......@@ -68,6 +94,13 @@ Kirigami
Kirigami.ApplicationWindow {
...
globalDrawer: Kirigami.GlobalDrawer {
title: "..."
titleIcon: "..."
topContent: [
...
]
actions: [
Kirigami.Action {
iconName: "list-import-user"
......
......@@ -8,9 +8,12 @@ part of an application's main tasks.
Global drawer
-------------
.. image:: /img/Menu_drawer_single.jpg
.. figure:: /img/Globaldrawer1.png
:alt: Global drawer
:scale: 40 %
:figclass: border
Global drawer on mobile
The global drawer is used for global, context-independent controls.
......@@ -23,9 +26,12 @@ The global drawer is used for global, context-independent controls.
Context drawer
--------------
.. image:: /img/Context_drawer.jpg
.. figure:: /img/Contextdrawer1.png
:alt: Context drawer
:scale: 40 %
:figclass: border
Context drawer on mobile
The context drawer (the side is system-defined) is used for
context-specific controls that affect only the currently selected object
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment