soft aesthetics in samples selection

src/pages/1-samples_selection.py

@@ -232,7 +232,7 @@ if labels:
             sam1.insert(loc=0, column='index', value=selected_samples_idx)
             sam1.insert(loc=1, column='cluster', value=np.array(labels)[selected_samples_idx])
         sam1.index = np.arange(len(selected_samples_idx))+1
-        st.write(f' - The total number of samples: {tcr.shape[0]}.\n- The number of selected samples for chemical analysis: {sam1.shape[0]}.')
+        st.write(f' - The total number of samples: {tcr.shape[0]}.\n- The number of selected samples for chemical analysis: {sam1.shape[0]} - {round(sam1.shape[0]/tcr.shape[0]*100, 1)}%.')
         sam = sam1
         if clus_method == cluster_methods[2]:
             unclus = st.checkbox("Include non clustered samples (for HDBSCAN clustering)", value=True)
@@ -251,7 +251,7 @@ if labels:
                     
                     sam = pd.concat([sam1, sam2], axis = 0)
                     sam.index = np.arange(sam.shape[0])+1
-                    st.write(f' The number of Non-clustered samples is {sam2.shape[0]} samples')
+                    st.write(f' The number of Non-clustered samples is {sam2.shape[0]} samples. Total selected samples: {sam1.shape[0] + sam2.shape[0]} - {round((sam1.shape[0] + sam2.shape[0]) / tcr.shape[0] * 100, 1)}%.')
         else:
             sam = sam1
         st.write(sam)

src/style/style_model.css

 /* CSS Snippet from W3schools: https://www.w3schools.com/howto/howto_css_contact_form.asp */
 div[data-testid="column"]:nth-of-type(1) {
-    border:2px solid black;border-radius: 20px;padding: 15px;
+    border:2px solid rgba(0,0,0, .4);border-radius: 20px;padding: 15px;
 }
 
 div[data-testid="column"]:nth-of-type(2) {
-    border:2px solid black;border-radius: 20px;padding: 15px;
+    border:2px solid rgba(0,0,0, .4);border-radius: 20px;padding: 15px;
     text-align: left;
 }
 
 div[data-testid="column"]:nth-of-type(3) {
-    border:2px solid black;border-radius: 20px;padding: 15px;
+    border:2px solid rgba(0,0,0, .4);border-radius: 20px;padding: 15px;
     text-align: left;
 }