File size: 1,802 Bytes
d9462b0 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 |
import streamlit as st
# Set page configuration
st.set_page_config(
page_title="Mobile Emulator",
page_icon="🌐",
layout="centered",
initial_sidebar_state="auto",
)
# CSS for mobile emulator
mobile_emulator_css = """
<style>
.mobile-emulator {
width: 360px;
height: 640px;
border: 16px black solid;
border-top-width: 60px;
border-bottom-width: 60px;
border-radius: 36px;
position: relative;
margin: auto;
overflow: hidden;
}
.mobile-emulator::before {
content: '';
display: block;
width: 60px;
height: 5px;
position: absolute;
top: -30px;
left: 50%;
transform: translate(-50%, -50%);
background: #333;
border-radius: 10px;
}
.mobile-emulator::after {
content: '';
display: block;
width: 35px;
height: 35px;
position: absolute;
left: 50%;
bottom: -65px;
transform: translate(-50%, -50%);
background: #333;
border-radius: 50%;
}
.mobile-emulator iframe {
width: 100%;
height: 100%;
border: 0;
}
</style>
"""
# HTML for mobile emulator
mobile_emulator_html = """
<div class="mobile-emulator">
<iframe src="https://www.google.com"></iframe>
</div>
"""
# JavaScript to open Chrome app
chrome_app_js = """
<script>
function openChromeApp() {
alert('Opening Chrome App...');
// You can replace the alert with actual logic to open a Chrome app
}
</script>
"""
# Streamlit App
st.title("Mobile Emulator")
# Display CSS
st.markdown(mobile_emulator_css, unsafe_allow_html=True)
# Display HTML
st.markdown(mobile_emulator_html, unsafe_allow_html=True)
# Button to open Chrome app
st.markdown(chrome_app_js, unsafe_allow_html=True)
st.button("Open Chrome App", on_click=openChromeApp)
# Run the Streamlit app
if __name__ == "__main__":
st.run() |