user dropdown, dropdown fixes

tabler · Nov 3, 2020 · 018fcc7 · 018fcc7
1 parent 11ccc0e
commit 018fcc7
Show file tree

Hide file tree

Showing 3 changed files with 26 additions and 6 deletions.
diff --git a/src/pages/_includes/layout/navbar-side.html b/src/pages/_includes/layout/navbar-side.html
@@ -22,6 +22,6 @@
 			</div>
 			{% endunless %}
 		</a>
-		{% include ui/dropdown-menu.html right=true icons=true separated=true %}
+		{% include ui/dropdown-menu.html arrow=true right=true separated=true menu="Set status,Profile & account,Feedback,|,Settings,Logout" %}
 	</div>
 </div>
diff --git a/src/pages/_includes/ui/dropdown-menu.html b/src/pages/_includes/ui/dropdown-menu.html
@@ -1,5 +1,25 @@
 <div class="dropdown-menu{% if include.right %} dropdown-menu-right{% endif %}{% if include.show %} dropdown-menu-demo{% endif %}{% if include.arrow %} dropdown-menu-arrow{% endif %}{% if include.dark %} bg-dark text-white{% endif %}{% if include.class %} {{ include.class }}{% endif %}">
-	{% if include.check or include.radio %}
+	{% if include.menu %}
+
+		{% assign menu = include.menu | split: ',' %}
+
+		{% for item in menu %}
+			{% if item == '|' %}
+				<div class="dropdown-divider"></div>
+			{% elsif item contains 'h:' %}
+				<h3 class="dropdown-header">{{ item | replace: 'h:', '' }}</h3>
+			{% elsif item contains 'a:' %}
+				<a href="#" class="dropdown-item active">{{ item | replace: 'a:', '' }}</a>
+			{% elsif item contains 'd:' %}
+				<a href="#" class="dropdown-item text-danger">{{ item | replace: 'd:', '' }}</a>
+			{% else %}
+				<a href="#" class="dropdown-item">{{ item }}</a>
+			{% endif %}
+		{% endfor %}
+
+
+
+	{% elsif include.check or include.radio %}
 		{% for i in (1..3) %}
 		<label class="dropdown-item"><input class="form-check-input m-0 mr-2" type="{% if include.radio %}radio{% else %}checkbox{% endif %}"> Option {{ i }}</label>
 		{% endfor %}

diff --git a/src/scss/ui/_dropdowns.scss b/src/scss/ui/_dropdowns.scss
@@ -60,13 +60,13 @@
 }
 
 .dropdown-menu-arrow {
-  margin-top: .5rem;
+  //margin-top: .25rem;
 
   &:before {
     content: "";
     position: absolute;
-    top: -4px;
-    left: 12px;
+    top: -.25rem;
+    left: .75rem;
     display: block;
     background: inherit;
     width: 14px;
@@ -81,7 +81,7 @@
 
   &.dropdown-menu-right {
     &:before {
-      right: 12px;
+      right: .75rem;
       left: auto;
     }
   }