added a nav bar but I don't like it...takes away from the flow

nirvana-ios/Views/FooterControlsView/FooterControlsView.swift

@@ -37,9 +37,6 @@ struct FooterControlsView: View {
     }
         
     var body: some View {
-        HStack(alignment: .center) {
-            Spacer()
-            
         ZStack {
             Button(action: {
             }, label: {
@@ -52,7 +49,7 @@ struct FooterControlsView: View {
                     .scaleEffect(self.isHolding ? 1.2: 1,
                                  anchor: .center)
                     .simultaneousGesture(dragGesture)
-    //                    .animation(.default, value: self.isHolding)
+//                    .animation(.default, value: self.isHolding)
             })
                 .zIndex(10)
                         
@@ -86,13 +83,8 @@ struct FooterControlsView: View {
                 .foregroundColor(NirvanaColor.teal)
                 .opacity(0.9)
                 .animation(Animation.easeInOut(duration: 1).repeat(while: self.isHolding, autoreverses: true))
-                
-                    
-                    
         }
     }
-        .padding()
-    }
 }
 
 struct FooterControlsView_Previews: PreviewProvider {

nirvana-ios/Views/HomeView/InnerCircle/InnerCircleView.swift

@@ -99,7 +99,7 @@ struct InnerCircleView: View {
                 //TODO: find a better solution than hacking it like this
                 Color.clear
                 
-                FooterControlsView()
+                footer
             }
            
         }
@@ -108,6 +108,41 @@ struct InnerCircleView: View {
         }
     }
     
+    var footer : some View {
+        ZStack {
+            HStack {
+                Image(systemName: "house.fill")
+                    .frame(maxWidth: .infinity)
+                    .frame(width: 40, height: 40)
+                    .foregroundColor(NirvanaColor.white)
+                    .padding(5)
+                    .background(NirvanaColor.teal.opacity(0.1))
+                    .clipShape(Circle())
+                Spacer()
+                Image(systemName: "rectangle.3.group.fill")
+                    .frame(maxWidth: .infinity)
+                    .frame(width: 40, height: 40)
+                    .foregroundColor(NirvanaColor.teal)
+                Spacer()
+                Image(systemName: "suitcase.fill")
+                    .frame(maxWidth: .infinity)
+                    .frame(width: 40, height: 40)
+                    .foregroundColor(NirvanaColor.teal)
+            }
+            .frame(maxWidth: .infinity, maxHeight: 50)
+            .background(Color.white.opacity(0.5))
+            .clipShape(RoundedRectangle(cornerRadius: 30, style: .continuous))
+            .shadow(color: Color.black.opacity(0.25), radius: 30, x: 0, y: 20)
+            .padding()
+            
+            
+            FooterControlsView()
+                .offset(x: 0, y: -25)
+        }
+        
+        
+    }
+    
     // magic variables for grid
     // TODO: change the number of columns based on the number of items
     private static var numberOfItems: Int = 20