Spaces:
Sleeping
Sleeping
File size: 4,042 Bytes
336df8f a921068 336df8f 29f8d6b a921068 336df8f a921068 aa5a8b3 a921068 9071042 a921068 1834e5e 30bc6a9 29a4aff 5fe089b 3917e99 a921068 29a4aff 9071042 a921068 29a4aff a921068 29a4aff a921068 29a4aff a921068 9071042 a921068 29a4aff a921068 9071042 a921068 aa5a8b3 5256aee 0799a5f 4dc8eec 0799a5f aa5a8b3 29f8d6b 326524a aa5a8b3 0799a5f 3917e99 52c8830 | 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 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 | import streamlit as st
# Установка конфигурации страницы
st.set_page_config(
page_title="laocta signlanguage",
page_icon=":sparkles:",
layout="wide",
initial_sidebar_state="expanded",
)
# Добавление стилей
st.markdown("""
<style>
/* Основной фон */
.main {
background: linear-gradient(135deg, #e0f7fa, #ffccbc);
}
/* Стиль боковой панели */
.sidebar .sidebar-content {
background: linear-gradient(135deg, #ffccbc, #ffc107);
padding: 1rem;
border-radius: 10px;
color: #4CAF50;
box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.1);
}
/* Обертка для блока контента */
.reportview-container .main .block-container {
padding-top: 2rem;
padding-bottom: 2rem;
padding-left: 2rem;
padding-right: 2rem;
border-radius: 10px;
background-color: white;
box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.1);
}
/* Стиль заголовка */
.css-1h3lh1b {
font-size: 2.5rem;
color: #ff7043;
}
/* Стиль подзаголовка */
.css-1siy2j7 {
font-size: 1.5rem;
color: #8d6e63;
}
/* Стиль кнопок */
.stButton>button {
background-color: #ff7043;
color: white;
border-radius: 5px;
border: none;
padding: 10px 20px;
font-size: 16px;
cursor: pointer;
transition: background-color 0.3s ease;
margin: 10px;
}
.stButton>button:hover {
background-color: #f4511e;
}
/* Карточки */
.card {
background-color: #ffffff;
padding: 20px;
margin: 10px;
border-radius: 10px;
box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.1);
}
/* Разделитель */
.divider {
height: 2px;
background-color: #ff7043;
margin: 20px 0;
}
/* Анимация */
.fade-in {
animation: fadeIn 2s;
}
@keyframes fadeIn {
from { opacity: 0; }
to { opacity: 1; }
}
</style>
""", unsafe_allow_html=True)
# Установка параметров URL
# Установка параметров запроса
st.experimental_set_query_params(page="main")
# Используйте переменную page после определения
# Основной контент страницы
st.title("Laocta Sgnlqnguage")
st.subheader("Kenyan Sign Language Recognition")
st.markdown("""
<div class="card fade-in">
<p>This application is designed to recognize sign language using a webcam feed. The model has been trained to recognize various sign language gestures and display the corresponding text in real-time.</p>
</div>
<div class="divider"></div>
<div class="card fade-in">
<h3>Features:</h3>
<ul>
<li>Real-time sign language recognition</li>
<li>Supports multiple gestures</li>
<li>Easy to use interface</li>
</ul>
</div>
<div class="divider"></div>
<div class="card fade-in">
<h3>How it works:</h3>
<ol>
<li>Upload a video or use the camera for live recognition.</li>
<li>The model processes the video and identifies the gestures.</li>
<li>The recognized gestures are displayed as text.</li>
</ol>
</div>
<div class="divider"></div>
<div class="card fade-in">
<h3>Why use this app:</h3>
<ul>
<li>Helps bridge the communication gap between sign language users and others.</li>
<li>Useful for educational purposes and learning sign language.</li>
<li>Enhances accessibility for people with hearing impairments.</li>
</ul>
</div>
""", unsafe_allow_html=True)
st.image("image.webp", caption="Sign Language Recognition", use_column_width=True)
|