Spaces:
Sleeping
Sleeping
| import streamlit as st | |
| # ----------------------------- | |
| # PAGE CONFIG | |
| # ----------------------------- | |
| st.set_page_config( | |
| page_title="Temperature Converter", | |
| page_icon="🌡️", | |
| layout="centered" | |
| ) | |
| # ----------------------------- | |
| # NEON + ANIMATED UI (ONLY ADDITION) | |
| # ----------------------------- | |
| st.markdown(""" | |
| <style> | |
| /* ---------------- BACKGROUND ---------------- */ | |
| .stApp { | |
| background: linear-gradient(-45deg, #0f172a, #1e293b, #0b1220, #1e3a8a); | |
| background-size: 400% 400%; | |
| animation: gradientMove 10s ease infinite; | |
| color: white; | |
| text-align: center; /* ✅ CENTER EVERYTHING */ | |
| } | |
| @keyframes gradientMove { | |
| 0% {background-position: 0% 50%;} | |
| 50% {background-position: 100% 50%;} | |
| 100% {background-position: 0% 50%;} | |
| } | |
| /* ---------------- TITLE ---------------- */ | |
| h1 { | |
| text-align: center; | |
| color: white; | |
| text-shadow: | |
| 0 0 10px #38bdf8, | |
| 0 0 20px #0ea5e9, | |
| 0 0 40px #3b82f6; | |
| } | |
| /* ---------------- INPUT BOXES ---------------- */ | |
| div[data-testid="stNumberInput"], | |
| div[data-testid="stRadio"] { | |
| background: rgba(255,255,255,0.06); | |
| padding: 15px; | |
| border-radius: 15px; | |
| margin-bottom: 15px; | |
| backdrop-filter: blur(10px); | |
| box-shadow: 0 0 15px rgba(59,130,246,0.25); | |
| } | |
| /* ---------------- BUTTON ---------------- */ | |
| .stButton>button { | |
| width: 100%; | |
| background: linear-gradient(90deg, #06b6d4, #3b82f6); | |
| color: white; | |
| border-radius: 12px; | |
| height: 3em; | |
| font-size: 16px; | |
| border: none; | |
| box-shadow: 0 0 15px rgba(59,130,246,0.6); | |
| transition: 0.3s; | |
| } | |
| .stButton>button:hover { | |
| transform: scale(1.03); | |
| box-shadow: 0 0 25px rgba(59,130,246,0.9); | |
| } | |
| /* ---------------- SUCCESS / OUTPUT BOX ---------------- */ | |
| div[data-testid="stSuccess"] { | |
| background: rgba(0, 255, 120, 0.08); /* light green glow */ | |
| border: 2px solid white; /* white border */ | |
| border-radius: 15px; | |
| padding: 20px; | |
| color: #00ff99 !important; /* GREEN TEXT */ | |
| font-size: 20px; | |
| font-weight: bold; | |
| box-shadow: 0 0 20px rgba(255,255,255,0.6); | |
| text-align: center; | |
| } | |
| /* Make success text green */ | |
| div[data-testid="stSuccess"] * { | |
| color: #00ff99 !important; | |
| } | |
| </style> | |
| """, unsafe_allow_html=True) | |
| # ----------------------------- | |
| # YOUR ORIGINAL CODE (UNCHANGED) | |
| # ----------------------------- | |
| # Title and Description | |
| st.title("Temperature Conversion App") | |
| st.markdown("Convert temperatures between Celsius, Fahrenheit, and Kelvin.") | |
| # Input Temperature | |
| temp_input = st.number_input("Enter the temperature to convert:", format="%.2f") | |
| # Conversion Option | |
| conversion_type = st.radio( | |
| "Select conversion type:", | |
| ( | |
| "Celsius to Fahrenheit", | |
| "Fahrenheit to Celsius", | |
| "Celsius to Kelvin", | |
| "Kelvin to Celsius", | |
| "Fahrenheit to Kelvin", | |
| "Kelvin to Fahrenheit", | |
| ), | |
| ) | |
| # Conversion Logic | |
| if conversion_type == "Celsius to Fahrenheit": | |
| converted_temp = (temp_input * 9/5) + 32 | |
| st.write(f"{temp_input:.2f}°C is equal to {converted_temp:.2f}°F.") | |
| elif conversion_type == "Fahrenheit to Celsius": | |
| converted_temp = (temp_input - 32) * 5/9 | |
| st.write(f"{temp_input:.2f}°F is equal to {converted_temp:.2f}°C.") | |
| elif conversion_type == "Celsius to Kelvin": | |
| converted_temp = temp_input + 273.15 | |
| st.write(f"{temp_input:.2f}°C is equal to {converted_temp:.2f} K.") | |
| elif conversion_type == "Kelvin to Celsius": | |
| converted_temp = temp_input - 273.15 | |
| st.write(f"{temp_input:.2f} K is equal to {converted_temp:.2f}°C.") | |
| elif conversion_type == "Fahrenheit to Kelvin": | |
| converted_temp = (temp_input - 32) * 5/9 + 273.15 | |
| st.write(f"{temp_input:.2f}°F is equal to {converted_temp:.2f} K.") | |
| elif conversion_type == "Kelvin to Fahrenheit": | |
| converted_temp = (temp_input - 273.15) * 9/5 + 32 | |
| st.write(f"{temp_input:.2f} K is equal to {converted_temp:.2f}°F.") |