From 944b1d0d7ffba97da70f02794c3da5d0d5c85645 Mon Sep 17 00:00:00 2001
From: cagataycivici <cagatay.civici@gmail.com>
Date: Sat, 4 Jul 2020 11:37:59 +0300
Subject: [PATCH] Update menubar demo to add branding

---
 src/assets/images/logo.svg         | 25 +++++++++++++++++++++++++
 src/components/menubar/Menubar.vue |  6 +++---
 src/views/menubar/MenubarDemo.vue  |  3 +++
 src/views/menubar/MenubarDoc.vue   |  3 +++
 4 files changed, 34 insertions(+), 3 deletions(-)
 create mode 100644 src/assets/images/logo.svg

diff --git a/src/assets/images/logo.svg b/src/assets/images/logo.svg
new file mode 100644
index 000000000..3e523905b
--- /dev/null
+++ b/src/assets/images/logo.svg
@@ -0,0 +1,25 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="139px" height="158px" viewBox="0 0 139 158" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 59.1 (86144) - https://sketch.com -->
+    <title>head</title>
+    <desc>Created with Sketch.</desc>
+    <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="Artboard" transform="translate(-3.000000, -7.000000)">
+            <g id="head" transform="translate(3.000000, 7.000000)">
+                <polygon id="chick-right" fill="#41B883" fill-rule="nonzero" points="102.295646 72.1832018 91.4643424 69.7770951 99.8886897 81.8076287 99.8886897 119.102283 128.772166 95.0412157 128.772166 54.1374014 115.533906 58.9496148"></polygon>
+                <polygon id="chick-left" fill="#41B883" fill-rule="nonzero" transform="translate(27.078259, 86.619842) scale(-1, 1) translate(-27.078259, -86.619842) " points="19.255651 72.1832018 8.42434732 69.7770951 16.8486946 81.8076287 16.8486946 119.102283 45.7321712 95.0412157 45.7321712 54.1374014 32.4939111 58.9496148"></polygon>
+                <polygon id="mask" fill="#41B883" points="40.9182584 84.2137354 50.5460839 69.7770951 56.5634749 73.3862552 80.6330387 73.3862552 86.6504296 69.7770951 96.2782551 84.2137354 96.2782551 138.351137 89.057386 149.178617 80.6330387 157.599991 56.5634749 157.599991 48.1391276 149.178617 40.9182584 138.351137"></polygon>
+                <polygon id="bottom-chick-right" fill="#41B883" fill-rule="nonzero" points="99.8886897 141.960297 115.533906 126.320603 115.533906 110.680909 99.8886897 123.914496"></polygon>
+                <polygon id="bottom-chick-left" fill="#41B883" fill-rule="nonzero" transform="translate(29.485216, 126.320603) scale(-1, 1) translate(-29.485216, -126.320603) " points="21.6626074 141.960297 37.3078239 126.320603 37.3078239 110.680909 21.6626074 123.914496"></polygon>
+                <path d="M89.4422148,12.342 L93.8712988,22.8580139 L79.4295605,68.5740417 L71.0052132,68.5740417 L71.0042148,56.994 L89.4422148,12.342 Z M48.1982148,11.287 L66.1912148,57.769 L66.1913004,68.5740417 L58.9704313,68.5740417 L43.3252148,22.8580139 L48.1982148,11.287 Z M66.1913004,0 L66.1912148,46.688 L59.3732148,29.074 L61.3773876,30.0763341 L61.3773876,0 L66.1913004,0 Z M75.8191259,1.91846539e-13 L75.8191259,30.0763341 L78.3042148,28.833 L71.0042148,46.513 L71.0052132,0 L75.8191259,1.91846539e-13 Z M84.2434732,0 L87.2562148,7.154 L80.6322148,23.196 L80.6330387,1.91846539e-13 L84.2434732,0 Z M56.5634749,0 L56.5632148,21.816 L50.4332148,5.981 L52.9530403,0 L56.5634749,0 Z" fill="#455C71"></path>
+                <path d="M138.399992,19.2488538 L131.179123,49.3251879 L79.4295605,68.5740417 L78.2260823,68.5740417 L92.6678206,22.8580139 L138.399992,19.2488538 Z M0,19.2488538 L44.528693,22.8580139 L60.1739095,68.5740417 L58.9704313,68.5740417 L7.22086913,49.3251879 L0,19.2488538 Z" id="head-right-2" fill="#41B883" fill-rule="nonzero"></path>
+                <polygon id="ear-right" fill="#455C71" fill-rule="nonzero" points="96.2782551 19.2488538 121.551297 16.8427471 104.702602 0 87.8539078 0"></polygon>
+                <polygon id="ear-left" fill="#455C71" fill-rule="nonzero" transform="translate(32.493911, 9.624427) scale(-1, 1) translate(-32.493911, -9.624427) " points="24.0695638 19.2488538 49.3426058 16.8427471 32.4939111 0 15.6452165 0"></polygon>
+                <polygon id="Path-2" fill="#455C71" fill-rule="nonzero" points="18.7999989 20.7999988 44.7999973 22.7999986 60.3999964 68.5999959 58.7999965 68.5999959 41.9999975 62.3999963"></polygon>
+                <polygon id="Path-3" fill="#455C71" fill-rule="nonzero" points="119.199993 20.7999988 92.3999945 22.7999986 77.5999954 68.5999959 79.5999953 68.5599959 95.1999943 62.7999963"></polygon>
+                <polygon id="Path-4" fill="#455C71" fill-rule="nonzero" points="48.3999971 72.7999957 50.399997 69.5999959 57.1999966 72.7999957 81.1999952 72.7999957 86.3999949 69.5999959 88.7999947 72.7999957 68.5999959 107.199994"></polygon>
+                <path d="M90.2104053,-1.0658141e-14 L68.485709,52.6144989 L48.1188062,-1.0658141e-14 L90.2104053,-1.0658141e-14 Z" id="Path-6" fill="#41B883" fill-rule="nonzero"></path>
+            </g>
+        </g>
+    </g>
+</svg>
\ No newline at end of file
diff --git a/src/components/menubar/Menubar.vue b/src/components/menubar/Menubar.vue
index e585c4e62..e37b3223e 100755
--- a/src/components/menubar/Menubar.vue
+++ b/src/components/menubar/Menubar.vue
@@ -1,11 +1,11 @@
 <template>
     <div :class="containerClass">
-        <a ref="menubutton" tabindex="0" class="p-menubar-button" @click="toggle($event)">
-            <i class="pi pi-bars" />
-        </a>
         <div class="p-menubar-start" v-if="$slots.start">
             <slot name="start"></slot>
         </div>
+        <a ref="menubutton" tabindex="0" class="p-menubar-button" @click="toggle($event)">
+            <i class="pi pi-bars" />
+        </a>
         <MenubarSub ref="rootmenu" :model="model" :root="true" :mobileActive="mobileActive" @leaf-click="onLeafClick"/>
         <div class="p-menubar-end" v-if="$slots.end">
             <slot name="end"></slot>
diff --git a/src/views/menubar/MenubarDemo.vue b/src/views/menubar/MenubarDemo.vue
index 70b342238..f9d221389 100755
--- a/src/views/menubar/MenubarDemo.vue
+++ b/src/views/menubar/MenubarDemo.vue
@@ -10,6 +10,9 @@
         <div class="content-section implementation">
             <div class="card">
                 <Menubar :model="items">
+                    <template #start>
+                        <img alt="logo" src="../../assets/images/logo.svg" height="40" class="p-mr-2">
+                    </template>
                     <template #end>
                         <InputText placeholder="Search" type="text" />
                     </template>
diff --git a/src/views/menubar/MenubarDoc.vue b/src/views/menubar/MenubarDoc.vue
index eda077a99..41a2ad99b 100755
--- a/src/views/menubar/MenubarDoc.vue
+++ b/src/views/menubar/MenubarDoc.vue
@@ -245,6 +245,9 @@ export default {
 <CodeHighlight>
 <template v-pre>
 &lt;Menubar :model="items"&gt;
+    &lt;template #start&gt;
+        &lt;img alt="logo" src="../../assets/images/logo.svg" height="40" class="p-mr-2"&gt;
+    &lt;/template&gt;
     &lt;template #end&gt;
         &lt;InputText placeholder="Search" type="text" /&gt;
         &lt;Button label="Logout" icon="pi pi-power-off" :style="{'margin-left': '0 .5em'}"/&gt;