diff --git a/components/Left/Left.php b/components/Left/Left.php
index 4713d1e418..67816aeebe 100644
--- a/components/Left/Left.php
+++ b/components/Left/Left.php
@@ -33,7 +33,7 @@ class Left extends Component
      */
     public function onEndShowStyles(array &$styles): bool
     {
-        $styles[] = 'components/Left/assets/css/left.css';
+        $styles[] = 'components/Left/assets/css/view.css';
         return Event::next;
     }
 }
diff --git a/components/Right/Right.php b/components/Right/Right.php
index 284e8c5823..063aedf5a5 100644
--- a/components/Right/Right.php
+++ b/components/Right/Right.php
@@ -33,7 +33,7 @@ class Right extends Component
      */
     public function onEndShowStyles(array &$styles): bool
     {
-        $styles[] = 'components/Right/assets/css/right.css';
+        $styles[] = 'components/Right/assets/css/view.css';
         return Event::next;
     }
 }
diff --git a/components/Search/Controller/Search.php b/components/Search/Controller/Search.php
index 92797aa3ab..3ef8574736 100644
--- a/components/Search/Controller/Search.php
+++ b/components/Search/Controller/Search.php
@@ -42,7 +42,7 @@ class Search extends Controller
         $results = $query->execute();
 
         return [
-            '_template' => 'search_results.html.twig',
+            '_template' => 'search/show.html.twig',
             'results'   => $results,
         ];
     }
diff --git a/components/Search/Search.php b/components/Search/Search.php
index 9fbe81f0ed..f0020b49f6 100644
--- a/components/Search/Search.php
+++ b/components/Search/Search.php
@@ -28,6 +28,7 @@ use App\Util\Exception\RedirectException;
 use Symfony\Component\Form\Extension\Core\Type\SubmitType;
 use Symfony\Component\Form\Extension\Core\Type\TextType;
 use Symfony\Component\HttpFoundation\Request;
+use function App\Core\I18n\_m;
 
 class Search extends Component
 {
@@ -39,11 +40,21 @@ class Search extends Component
     /**
      * Add the search form to the site header
      */
-    public function onAddHeaderElements(Request $request, array &$elements)
+    public function onAddExtraHeaderForms(Request $request, array &$elements)
     {
         $form = Form::create([
-            ['query', TextType::class, []],
-            [$form_name = 'submit_search', SubmitType::class, []],
+            ['query', TextType::class, [
+                'attr' => ['placeholder' => _m('Search tags...')]
+            ]],
+            [$form_name = 'submit_search', SubmitType::class,
+                [
+                    'label' => _m('Submit'),
+                    'attr'  => [
+                        //'class' => 'button-container search-button-container',
+                        'title' => _m('Query notes for specific tags.'),
+                    ],
+                ],
+            ],
         ]);
 
         if ('POST' === $request->getMethod() && $request->request->has($form_name)) {
@@ -57,4 +68,17 @@ class Search extends Component
         $elements[] = $form->createView();
         return Event::next;
     }
+
+    /**
+     * Output our dedicated stylesheet
+     *
+     * @param array $styles stylesheets path
+     *
+     * @return bool hook value; true means continue processing, false means stop.
+     */
+    public function onEndShowStyles(array &$styles): bool
+    {
+        $styles[] = 'components/Search/assets/css/view.css';
+        return Event::next;
+    }
 }
diff --git a/components/Search/templates/search_results.html.twig b/components/Search/templates/search/show.html.twig
similarity index 67%
rename from components/Search/templates/search_results.html.twig
rename to components/Search/templates/search/show.html.twig
index e888104b13..a62a260fa5 100644
--- a/components/Search/templates/search_results.html.twig
+++ b/components/Search/templates/search/show.html.twig
@@ -1,6 +1,6 @@
 {% for res in results %}
   {% if res is instanceof('App\\Entity\\Note') %}
-    {% include 'note/view.html.twig' with {'note': res} %}
+    {% include '/cards/note/view.html.twig' with {'note': res} %}
   {% else %}
     {{ dump(res) }}
   {% endif %}
diff --git a/plugins/AttachmentShowRelated/templates/attachmentShowRelated/attachmentRelatedNotes.html.twig b/plugins/AttachmentShowRelated/templates/attachmentShowRelated/attachmentRelatedNotes.html.twig
index 5eda018f2b..0789bddb01 100644
--- a/plugins/AttachmentShowRelated/templates/attachmentShowRelated/attachmentRelatedNotes.html.twig
+++ b/plugins/AttachmentShowRelated/templates/attachmentShowRelated/attachmentRelatedNotes.html.twig
@@ -4,6 +4,6 @@
     </div>
 
     {% for note in related_notes %}
-        {% include '/note/view.html.twig' with {'note' : note, 'hide_attachments': true, 'have_user': have_user} only %}
+        {% include '/cards/note/view.html.twig' with {'note' : note, 'hide_attachments': true, 'have_user': have_user} only %}
     {% endfor %}
 </section>
\ No newline at end of file
diff --git a/plugins/ProfileColor/ProfileColor.php b/plugins/ProfileColor/ProfileColor.php
index 54e4ba4cb8..ab1375c3ea 100644
--- a/plugins/ProfileColor/ProfileColor.php
+++ b/plugins/ProfileColor/ProfileColor.php
@@ -38,6 +38,7 @@ use Symfony\Component\HttpFoundation\Request;
  * @category ProfileColor
  *
  * @author    Daniel Brandao <up201705812@fe.up.pt>
+ * @author    Eliseu Amaro  <mail@eliseuama.ro>
  * @copyright 2020 Free Software Foundation, Inc http://www.fsf.org
  * @license   https://www.gnu.org/licenses/agpl.html GNU AGPL v3 or later
  */
diff --git a/public/assets/default_theme/css/base.css b/public/assets/default_theme/css/base.css
index ea08d94a03..67eb62f1f9 100644
--- a/public/assets/default_theme/css/base.css
+++ b/public/assets/default_theme/css/base.css
@@ -1,7 +1,7 @@
 @import url("widgets/buttons.css");
 @import url("widgets/sections.css");
-@import url("widgets/feeds.css");
-@import url("widgets/settings.css");
+@import url("pages/feeds.css");
+@import url("pages/settings.css");
 
 @import url("../fonts/poppins/poppins.css");
 @import url("../fonts/opensans/opensans.css");
@@ -155,6 +155,7 @@ header {
 
     height: 3rem;
     display: flex;
+    justify-content: center;
     position: fixed;
     top: 0;
     background-color: var(--bg1);
@@ -169,15 +170,33 @@ header {
 .header-instance {
     display: flex;
     align-items: center;
-
+    align-self: center;
     margin-left: auto;
-    margin-right: auto;
 }
 
 .header-instance > * {
     margin: unset;
 }
 
+.header-extra-forms {
+    justify-self: flex-end;
+    margin-left: auto;
+}
+
+.header-extra-forms[open] > *:not(summary) {
+    z-index: 2;
+    width: 19vw;
+    background-color: var(--bg1);
+    padding: var(--unit-size);
+    border-radius: 0 0 var(--unit-size) var(--unit-size);
+    box-shadow: var(--shadow);
+
+    font-size: var(--small-size);
+    position: absolute;
+    top: 100%;
+    right: 0;
+}
+
 /* CONTAINS ALL ELEMENTS BESIDES HEADER */
 .content-wrapper {
     position: relative;
@@ -303,6 +322,10 @@ and (max-width: 1280px) {
         max-width: 100%;
     }
 
+    .header-extra-forms[open] > *:not(summary) {
+        width: 100%;
+    }
+
     #panel-left-toggle:not(:checked) ~ .panel-content,
     #panel-right-toggle:not(:checked) ~ .panel-content {
         display: none;
diff --git a/public/assets/default_theme/css/widgets/feeds.css b/public/assets/default_theme/css/pages/feeds.css
similarity index 100%
rename from public/assets/default_theme/css/widgets/feeds.css
rename to public/assets/default_theme/css/pages/feeds.css
diff --git a/public/assets/default_theme/css/widgets/settings.css b/public/assets/default_theme/css/pages/settings.css
similarity index 100%
rename from public/assets/default_theme/css/widgets/settings.css
rename to public/assets/default_theme/css/pages/settings.css
diff --git a/public/assets/icons/checkmark.svg.twig b/public/assets/icons/checkmark.svg.twig
index 75cf0a4b65..00321c1eba 100644
--- a/public/assets/icons/checkmark.svg.twig
+++ b/public/assets/icons/checkmark.svg.twig
@@ -1,4 +1,8 @@
 <?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- https://github.com/primer/octicons -->
+
+<!-- MIT License -->
+
 <svg
    class="{{ iconClass|default('') }}"
    xmlns:dc="http://purl.org/dc/elements/1.1/"
diff --git a/public/assets/icons/kebab.svg.twig b/public/assets/icons/kebab.svg.twig
new file mode 100644
index 0000000000..91c2f3d9c3
--- /dev/null
+++ b/public/assets/icons/kebab.svg.twig
@@ -0,0 +1,21 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- https://github.com/primer/octicons -->
+
+<!-- MIT License -->
+
+<svg
+    class="{{ iconClass|default('') }}"
+    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"
+    version="1.1"
+    viewBox="0 0 16 16"
+    width="16"
+    height="16">
+    <title>Expand for more options</title>
+    <path d="M8 9a1.5 1.5 0 100-3 1.5 1.5 0 000 3zM1.5 9a1.5 1.5 0 100-3 1.5 1.5 0 000 3zm13 0a1.5 1.5 0 100-3 1.5 1.5 0 000 3z"></path>
+</svg>
\ No newline at end of file
diff --git a/public/components/Left/assets/css/left.css b/public/components/Left/assets/css/view.css
similarity index 100%
rename from public/components/Left/assets/css/left.css
rename to public/components/Left/assets/css/view.css
diff --git a/public/components/Right/assets/css/right.css b/public/components/Right/assets/css/view.css
similarity index 92%
rename from public/components/Right/assets/css/right.css
rename to public/components/Right/assets/css/view.css
index a47bf25965..a459f5fac2 100644
--- a/public/components/Right/assets/css/right.css
+++ b/public/components/Right/assets/css/view.css
@@ -12,6 +12,7 @@
     border: 2px solid var(--white);
 }
 #panel-right-icon {
+    margin-left: var(--unit-size);
     cursor: pointer !important;
     border: 2px solid transparent;
 }
diff --git a/public/components/Search/assets/css/view.css b/public/components/Search/assets/css/view.css
new file mode 100644
index 0000000000..e69de29bb2
diff --git a/src/Controller/Attachment.php b/src/Controller/Attachment.php
index fd43ff3255..253d3c4ff0 100644
--- a/src/Controller/Attachment.php
+++ b/src/Controller/Attachment.php
@@ -85,7 +85,7 @@ class Attachment extends Controller
             $attachment = DB::findOneBy('attachment', ['id' => $id]);
             return $this->attachment($id, function ($res) use ($id, $attachment) {
                 return [
-                    '_template'        => 'attachments/show.html.twig',
+                    '_template'        => '/cards/attachments/show.html.twig',
                     'download'         => Router::url('attachment_download', ['id' => $id]),
                     'attachment'       => $attachment,
                     'right_panel_vars' => ['attachment_id' => $id],
diff --git a/src/Controller/Note.php b/src/Controller/Note.php
index a6be37bf21..2bc92574c7 100644
--- a/src/Controller/Note.php
+++ b/src/Controller/Note.php
@@ -47,6 +47,6 @@ class Note extends Controller
      */
     public function NoteShow(Request $request, int $id)
     {
-        return $this->note($id, fn ($note) => ['_template' => 'note/view.html.twig', 'note' => $note]);
+        return $this->note($id, fn ($note) => ['_template' => '/cards/note/view.html.twig', 'note' => $note]);
     }
 }
diff --git a/templates/base.html.twig b/templates/base.html.twig
index dfc30e45ba..fa1b8056fe 100644
--- a/templates/base.html.twig
+++ b/templates/base.html.twig
@@ -67,6 +67,8 @@
 </aside>
 
 {% block header %}
+    {% set extra_header_forms = handle_event('AddExtraHeaderForms', request) %}
+
     <header>
         {{ block("leftpanel", "stdgrid.html.twig") }}
 
@@ -75,12 +77,14 @@
             <h1>{{ icon('logo', 'icon icon-logo') | raw }}{{ config('site', 'name') }} </h1>
         </a>
 
-        <span>
-          {% set extra = handle_event('AddHeaderElements', request) %}
-          {% for el in extra %}
-            {{ form(el) }}
-          {% endfor %}
-        </span>
+        <details class="header-extra-forms">
+            <summary>
+              {{ icon('kebab', 'icon icon-details-open') | raw }}
+            </summary>
+            {% for extra_form in extra_header_forms %}
+                {{ form(extra_form) }}
+            {% endfor %}
+        </details>
 
         {% if app.user %}
             {{ block("rightpanel", "stdgrid.html.twig") }}
diff --git a/templates/attachments/show.html.twig b/templates/cards/attachments/show.html.twig
similarity index 68%
rename from templates/attachments/show.html.twig
rename to templates/cards/attachments/show.html.twig
index 29f285fab9..a802f0bc34 100644
--- a/templates/attachments/show.html.twig
+++ b/templates/cards/attachments/show.html.twig
@@ -4,7 +4,7 @@
     <div class="content">
         <section class="section-widget section-widget-padded">
 
-            {% include '/attachments/view.html.twig' with {'attachment': attachment, 'note': null} only %}
+            {% include '/cards/attachments/view.html.twig' with {'attachment': attachment, 'note': null} only %}
 
             <a class="section-widget-button-like" href="{{ download }}"> {{ 'Download link' | trans }}</a>
         </section>
diff --git a/templates/attachments/view.html.twig b/templates/cards/attachments/view.html.twig
similarity index 100%
rename from templates/attachments/view.html.twig
rename to templates/cards/attachments/view.html.twig
diff --git a/templates/note/view.html.twig b/templates/cards/note/view.html.twig
similarity index 95%
rename from templates/note/view.html.twig
rename to templates/cards/note/view.html.twig
index f34d6b8e13..4348b21ecc 100644
--- a/templates/note/view.html.twig
+++ b/templates/cards/note/view.html.twig
@@ -38,7 +38,7 @@
                 {% if note.getAttachments() is not empty %}
                     <section class="section-attachments" tabindex="0" title="{{ 'Note attachments.' | trans }}">
                         {% for attachment in note.getAttachments() %}
-                            {% include '/attachments/view.html.twig' with {'attachment': attachment, 'note': note} only%}
+                            {% include '/cards/attachments/view.html.twig' with {'attachment': attachment, 'note': note} only%}
                         {% endfor %}
                     </section>
                 {% endif %}
diff --git a/templates/network/feed.html.twig b/templates/network/feed.html.twig
index 793a76fe71..2b61e16c82 100644
--- a/templates/network/feed.html.twig
+++ b/templates/network/feed.html.twig
@@ -8,7 +8,7 @@
         <div class="h-feed hfeed notes">
             {% if notes is defined and notes is not empty %}
                 {% for conversation in notes %}
-                    {% include '/note/view.html.twig' with {'note': conversation['note'], 'replies': conversation['replies']} only %}
+                    {% include '/cards/note/view.html.twig' with {'note': conversation['note'], 'replies': conversation['replies']} only %}
                     <hr tabindex="0" title="{{ 'End of note and replies.' | trans }}">
                 {% endfor %}
             {% else %}
diff --git a/templates/note/reply.html.twig b/templates/note/reply.html.twig
index f101d2d4e4..6e6474d960 100644
--- a/templates/note/reply.html.twig
+++ b/templates/note/reply.html.twig
@@ -4,18 +4,7 @@
     {{ parent() }}
 {% endblock %}
 
-{% block title %}Welcome!{% endblock %}
-
-{% block stylesheets %}
-    {{ parent() }}
-    <link rel='stylesheet' type='text/css' href="{{ asset('assets/css/replies/replies.css') }}">
-    <link rel='stylesheet' type='text/css' href="{{ asset('assets/css/network/public.css') }}"
-          media="screen and (min-width: 1300px)">
-    <link rel='stylesheet' type='text/css' href="{{ asset('assets/css/network/public_mid.css') }}"
-          media="screen and (max-width: 1300px)">
-    <link rel='stylesheet' type='text/css' href="{{ asset('assets/css/network/public_small.css') }}"
-          media="screen and (max-width: 750px)">
-{% endblock %}
+{% block title %}{{ 'Reply to ' | trans }}{{ note.getActorNickname() }}{{ '\'s note.' | trans }}{% endblock %}
 
 {% block header %}
     {{ parent() }}
@@ -29,7 +18,7 @@
     {{ parent() }}
     <div class="content">
         <div class="main">
-            {% include '/note/view.html.twig' with {'note': note, 'have_user': have_user} only %}
+            {% include '/cards/note/view.html.twig' with {'note': note} only %}
             {{ form(reply) }}
         </div>
     </div>