From 76bf1e7940756d3c73b8d45e695003da32b11890 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?John=20Molakvo=C3=A6=20=28skjnldsv=29?=
 <skjnldsv@protonmail.com>
Date: Wed, 11 Oct 2017 16:57:36 +0200
Subject: [PATCH] Navigation & popover cleanup
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Signed-off-by: John Molakvoæ (skjnldsv) <skjnldsv@protonmail.com>
---
 developer_manual/design/navigation.rst  | 17 ++++++-----------
 developer_manual/design/popovermenu.rst |  4 ++--
 2 files changed, 8 insertions(+), 13 deletions(-)

diff --git a/developer_manual/design/navigation.rst b/developer_manual/design/navigation.rst
index 10737cba0..fbd8ca261 100644
--- a/developer_manual/design/navigation.rst
+++ b/developer_manual/design/navigation.rst
@@ -24,10 +24,9 @@ We implemented various essential functions and provide easy way of using them.
 Basic layout
 =============
 
-.. rst-class:: figure-with-code
-
 .. figure:: ../images/navigation.png
    :alt: Navigation screenshot
+   :figclass: figure-with-code
 
 .. code:: html
 
@@ -77,10 +76,9 @@ The menu needs to be placed after the ``app-navigation-entry-utils``.
 
 For the global rules and/or layout, you can check the dedicated :ref:`popover menu section <popovermenu>`.
 
-.. rst-class:: figure-with-code
-
 .. figure:: ../images/navigation-menu.png
    :alt: Navigation menu
+   :figclass: figure-with-code
 
 .. code:: html
 
@@ -115,10 +113,9 @@ Counter
 If you need to add a counter to your menu entry, you can simply use this structure.
 Do not change the alignment of the text. If you're using
 
-.. rst-class:: figure-with-code
-
 .. figure:: ../images/navigation-counter.png
    :alt: Navigation entry with counter
+   :figclass: figure-with-code
 
 .. code:: html
 
@@ -134,10 +131,9 @@ The same way we display the menu three-dot-icon button, you're allowed to use up
 * The icon class goes directly on the ``button`` element.
 * If no class is set, the three-dot-icon will be used by default
 
-.. rst-class:: figure-with-code
-
 .. figure:: ../images/navigation-buttons.png
    :alt: Navigation entry with counter
+   :figclass: figure-with-code
 
 .. code:: html
 
@@ -191,10 +187,9 @@ The opening of the menu is activated and animated by the class ``open`` on the m
     * If your top-level link is only used as a header, the **entire** ``a`` needs to be used to toggle the ``open`` class.
     * If your top-level link is used to redirect the user or to trigger something else, you **need** to add the collapsible button and use it as the ``open`` class toggle trigger.
 
-.. rst-class:: figure-with-code
-
-.. figure:: ../images/navigation-collapsible.*
+.. figure:: ../images/navigation-collapsible.png
    :alt: Collapsible navigation entry
+   :figclass: figure-with-code
 
 .. code:: html
 
diff --git a/developer_manual/design/popovermenu.rst b/developer_manual/design/popovermenu.rst
index b058e1a02..de029154e 100644
--- a/developer_manual/design/popovermenu.rst
+++ b/developer_manual/design/popovermenu.rst
@@ -16,10 +16,10 @@ This is exactly the same as the :ref:`navigation menu <navigation_menu>`. The on
 Basic layout
 =============
 
-.. rst-class:: figure-with-code
-
 .. figure:: ../images/popovermenu.png
    :alt: Popover image example
+   :figclass: figure-with-code
+
 .. code:: html
 
     <div class="popovermenu">