From 00b170ec801f749bd76124402e5bdf7ecb361b10 Mon Sep 17 00:00:00 2001
From: Paul Nation <nonhermitian@gmail.com>
Date: Mon, 9 Nov 2020 03:00:11 -0500
Subject: [PATCH] Add panels examples to docs (#7)

* Sphinx panels examples to docs

* Add panels examples
---
 docs/conf.py    |  1 +
 docs/index.rst  |  1 +
 docs/panels.rst | 81 +++++++++++++++++++++++++++++++++++++++++++++++++
 3 files changed, 83 insertions(+)
 create mode 100644 docs/panels.rst

diff --git a/docs/conf.py b/docs/conf.py
index 2060a551..39cc8944 100644
--- a/docs/conf.py
+++ b/docs/conf.py
@@ -61,6 +61,7 @@
     'sphinx.ext.viewcode',
     'sphinx.ext.extlinks',
     'jupyter_sphinx',
+    'sphinx_panels',
     'sphinx_autodoc_typehints',
 ]
 
diff --git a/docs/index.rst b/docs/index.rst
index 26417691..fa9e76a6 100644
--- a/docs/index.rst
+++ b/docs/index.rst
@@ -14,6 +14,7 @@ Qiskit sphinx theme |version| documentation
    Functions <functions>
    Classes <classes>
    Jupyter <jupyter>
+   Panels <panels>
 
 
 .. Hiding - Indices and tables
diff --git a/docs/panels.rst b/docs/panels.rst
new file mode 100644
index 00000000..e4acfd9d
--- /dev/null
+++ b/docs/panels.rst
@@ -0,0 +1,81 @@
+======
+Panels
+======
+
+Basic panels
+============
+
+.. panels::
+    :container: container-lg pb-3
+    :column: col-lg-4 col-md-4 col-sm-6 col-xs-12 p-2
+
+    panel1
+    ---
+    panel2
+    ---
+    panel3
+    ---
+    :column: col-lg-12 p-2
+    panel4
+
+Dropdowns
+=========
+
+.. dropdown:: Hey, I am a dropdown
+
+    Lots of cool stuff can be done with dropdowns!
+
+
+.. dropdown:: My content will fade in
+    :animate: fade-in
+
+    Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
+    Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
+    Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
+    Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
+
+
+Tabs
+====
+
+.. tabbed:: Tab 1
+
+    Tab 1 content
+
+.. tabbed:: Tab 2
+    :class-content: pl-1 bg-primary
+
+    Tab 2 content
+
+
+Cards
+=====
+
+
+.. panels::
+    :container: container-lg
+    :column: col-lg-6 p-2
+    :img-top-cls: pl-2 pr-2
+
+    ---
+    :img-top: images/yi_jing_01_chien.jpg
+
+
+    This is an example card.
+
+    More content here.
+
+    ++++++
+    :badge:`Example,badge-primary badge-pill`
+
+
+    ---
+    :img-top: images/yi_jing_01_chien.jpg
+
+    This is an example card.
+
+    :math:`\sin^{2}(x)+\cos^{2}(x) = 1`
+
+    ++++++
+    :badge:`Example,badge-primary badge-pill`
+    :badge:`Tutorial,badge-success badge-pill`
\ No newline at end of file