Update app.py

app.py

@@ -26,10 +26,9 @@ pdf_file_path = "Private_Book/KOMBI_all2.pdf"  # Replace with your PDF file path
 def cloud_button(label, key=None, color=None):
     button_id = f"cloud-button-{key or label}"
     color_class = f"color-{color}" if color else ""
-    num_circles = max(3, min(12, len(label) // 4))  # Adjust the number of circles based on text length
+    num_circles = max(3, min(12, len(label) // 4))
     circle_size = 60
     
-    # Generate circles
     circles_html = ''.join([
         f'<div class="circle {color_class}"></div>' for _ in range(num_circles)
     ])
@@ -50,8 +49,8 @@ def cloud_button(label, key=None, color=None):
         .wrapper {{
             display: flex;
             align-items: center;
-            background-color: #9BBEFF;
-            border-radius: 30px;  # Adjust as needed
+            background-color: transparent;
+            border-radius: 30px;
             padding: 10px 20px;
         }}
         .text {{
@@ -60,11 +59,11 @@ def cloud_button(label, key=None, color=None):
             z-index: 2;
         }}
         .circle {{
-            background-color: #9BBEFF;
+            background-color: transparent;
             border-radius: 50%;
             width: {circle_size}px;
             height: {circle_size}px;
-            margin: 0 -{circle_size // 4}px;  # Adjust negative margin for overlap
+            margin: 0 -{circle_size // 4}px;
             z-index: 1;
         }}
         .color-1 .wrapper, .color-1 .circle {{ background-color: #FFA07A; }}
@@ -79,6 +78,7 @@ def cloud_button(label, key=None, color=None):
     """
     st.markdown(cloud_button_html, unsafe_allow_html=True)
 
+
 cloud_button("Short Text", color="1")
 cloud_button("This is a longer piece of text", color="2")
 cloud_button("This is an even longer piece of text to test the cloud button", color="3")