Dear mentor , I have issue related code output layout and structure
when I running my code and see output in desktop steamlit cloud plateform , table column structure is ok but when I am moving to mobile and see output it is different here , In the mobile view table column are not properly expanding and limited to input Field right and left border area , I will attach screenshot of both screen , you can see what the actual issue 'also I will share my code part which is responsible for taking user input and printing table column
here is two code snippet . 1st is for user input and second is for printing table column
user_input_option = st.selectbox("Select demand zone Scan Option", ["Enter custom stock symbols", "Select niftystocks"])
col1, col2 = st.columns(2)
with col1:
if user_input_option == "Enter custom stock symbols":
user_selected_companies = st.text_input("Symbol Names", help="Enter Indian stock symbol names separated by space. For example: 'TCS INFY HDFC'.")
max_base_candles = st.number_input("Maximum Base Candles", min_value=1, value=2, help="Enter the maximum number of base candles to consider. Default value is 2.")
if user_selected_companies:
companies_list = user_selected_companies.split()
companies_with_ns_suffix = add_ns_suffix(companies_list)
else:
companies_with_ns_suffix = []
elif user_input_option == "Select niftystocks":
selected_file = st.selectbox("Select niftystocks", ["nifty50stocks", "nifty100stocks", "nifty500stocks"])
max_base_candles = st.number_input("Maximum Base Candles", min_value=1, value=2, help="Enter the maximum number of base candles to consider. Default value is 2.")
if selected_file:
user_selected_companies = read_company_names_from_file(selected_file)
companies_with_ns_suffix = add_ns_suffix(user_selected_companies)
else:
companies_with_ns_suffix = []
else:
companies_with_ns_suffix = []
# Add the following line to track button click status
patterns_found_button_clicked = False
with col2:
if user_input_option in ["Enter custom stock symbols", "Select niftystocks"]:
time_frames_input = st.text_input("Time Frames", "1d", help="For single time frames, enter one time frame (e.g., '1d'). For multiple time frames, enter them separated by space (e.g., '1d 1wk 1mo').")
time_frames = [tf.strip() for tf in time_frames_input.split()]
displayed_patterns_number = st.number_input("Max Demand Zone", min_value=1, value=1, help="Enter the maximum number of demand zones to find in each stock. The default value is 1.")
find_patterns_button = None
if user_input_option in ["Enter custom stock symbols", "Select niftystocks"]:
find_patterns_button = st.button("Find Patterns")
# Update the condition to check if the button has been clicked
if find_patterns_button and companies_with_ns_suffix:
patterns_found_button_clicked = True
start_time = time.time()
patterns_found = []
for company in companies_with_ns_suffix:
patterns = find_demand_zone_legin_base_legout_pattern(company, "2020-01-01", datetime.datetime.now().strftime("%Y-%m-%d"), max_base_candles, time_frames)
if patterns:
patterns_found.extend(patterns)
2nd code snippet which print table column
# Add header names
col1 = st.empty()
col2 = st.empty()
col3 = st.empty()
col4 = st.empty()
col5 = st.empty()
col6 = st.empty()
col7 = st.empty()
col8 = st.empty()
col9 = st.empty()
col10 = st.empty()
col11 = st.empty()
col1, col2, col3, col4, col5, col6, col7, col8, col9, col10, col11 = st.columns([14,14,11,21,14,21,21,21,21,7,21])
# Display column names in bold
col1.markdown("**Symbol**")
col2.markdown("**Close**")
col3.markdown("**Zone**")
col4.markdown("**Leg-in Date**")
col5.markdown("""<span title="BC Stand for Base Count , This is number between legin candle and legout candle"> **BC** </span>""", unsafe_allow_html=True)
col6.markdown("**Leg-out Date**")
col7.markdown("**Legout Count**")
col8.markdown("**Proximal Line**")
col9.markdown("**Distal Line**")
col10.markdown("""<span title="TF Stand for Time Frame , This is Chart time for analysing stock to find zone"> **TF** </span>""", unsafe_allow_html=True)
col11.markdown("**Chart**")
with st.container():
for index, row in df.iterrows():
try:
legin_date = pd.to_datetime(row['Leg-in Date'])
legout_date = pd.to_datetime(row['Leg-out Date'])
start_date = (legin_date - pd.Timedelta(days=10)).strftime('%Y-%m-%d')
end_date = datetime.datetime.now().strftime("%Y-%m-%d")
with col1:
st.write(row['Symbol'])
with col2:
st.write(row['Close'])
with col3:
st.write(row['Pattern'])
with col4:
st.write(row['Leg-in Date'])
with col5:
st.write(row['Base Count'])
with col6:
st.write(row['Leg-out Date'])
with col7:
st.write(row['Legout Count'])
with col8:
st.write(row['Proximal Line'])
with col9:
st.write(row['Distal Line'])
with col10:
st.write(row['Time Frame'])
with col11:
with st.popover(f"📊"):
plot_candlestick(stock_data.loc[start_date:end_date], row['Symbol'], start_date, end_date, legin_date, legout_date)
except Exception as e:
st.error(f"Error occurred while processing {row['Symbol']}: {e}")
if __name__ == "__main__":
main()
Now here is screent shot of code output in laptop which is looking correct as per my requirement
Now here is screentshot of code output in Mobile screeen desktop mode which is not looking correct as per my requirement , because table columns are not expanded correctly
