Update app.py

app.py

@@ -772,11 +772,81 @@ def side():
 
 
         # Show Trust Builders Section
-        trust_buckets = ["Stability", "Development", "Relationship", "Benefit", "Vision", "Competence"]
+        trust_buckets = [
+            {"label": "Stability", "icon": "Bucket_STABILITY.png"},
+            {"label": "Development", "icon": "Bucket_DEVELOPMENT.png"},
+            {"label": "Relationship", "icon": "Bucket_RELATIONSHIP.png"},
+            {"label": "Benefit", "icon": "Bucket_BENEFIT.png"},
+            {"label": "Vision", "icon": "Bucket_VISION.png"},
+            {"label": "Competence", "icon": "Bucket_COMPETENCE.png"}
+        ]
+        def get_base64(file_path):
+            with open(file_path, "rb") as f:
+                return base64.b64encode(f.read()).decode()
+
+
+
+
+        dropdown_html = """
+        <style>
+            .custom-dropdown {
+                width: 100%;
+                max-width: 400px;
+                margin: 10px auto;
+                font-family: Arial, sans-serif;
+            }
+            .custom-dropdown select {
+                width: 100%;
+                padding: 10px;
+                font-size: 16px;
+                border: 1px solid #ccc;
+                border-radius: 5px;
+                background-color: white;
+                appearance: none;
+                -webkit-appearance: none;
+                -moz-appearance: none;
+                cursor: pointer;
+            }
+            .custom-dropdown option {
+                display: flex;
+                align-items: center;
+                padding: 10px;
+                background-color: #f9f9f9;
+            }
+        </style>
+        <div class="custom-dropdown">
+            <select>
+        """
+        for bucket in trust_buckets:
+            icon_path = os.path.join(".", bucket["icon"])  # Adjust the path if your icons are in a subdirectory
+            encoded_img = get_base64(icon_path)
+            dropdown_html += f"""
+                <option style="background-image: url('data:image/png;base64,{encoded_img}');
+                                background-repeat: no-repeat;
+                                background-position: left center;
+                                padding-left: 40px;">
+                    {bucket['label']}
+                </option>
+            """
+        
+        dropdown_html += """
+            </select>
+        </div>
+        """
+
 
         st.subheader("Show My TrustBuilders®")
         search_query = st.text_input("Search by keyword", key="search_query")
-        selected_bucket = st.selectbox("Select Trust Bucket", ["All"] + trust_buckets, key="selected_bucket")
+        st.markdown(dropdown_html, unsafe_allow_html=True)
+
+
+
+
+
+
+
+
+        
         
         if st.button("Show TrustBuilders", key="show_trustbuilders"):
             trustbuilders = fetch_trustbuilders(st.session_state.get("wix_user_id"))