tahirsher commited on
Commit
1af4b74
·
verified ·
1 Parent(s): 5e0383e

Update app.py

Browse files
Files changed (1) hide show
  1. app.py +9 -37
app.py CHANGED
@@ -1,6 +1,6 @@
1
  import streamlit as st
2
 
3
- # Inject custom CSS for a centered flower with your background and gradient
4
  st.markdown(
5
  """
6
  <style>
@@ -19,57 +19,29 @@ st.markdown(
19
  font-family: 'Arial', sans-serif;
20
  position: relative;
21
  }
22
- /* Flower in the center */
23
  .flower {
24
  position: absolute;
25
- top: 50%;
26
- left: 50%;
27
  transform: translate(-50%, -50%);
28
- width: 200px;
29
- height: 200px;
30
  background-image: url("https://upload.wikimedia.org/wikipedia/commons/thumb/3/30/Red_flower.svg/1200px-Red_flower.svg.png");
31
  background-size: contain;
32
  background-repeat: no-repeat;
33
  }
34
- /* Animating the flower */
35
- @keyframes rotate-flower {
36
- 0% { transform: translate(-50%, -50%) rotate(0deg); }
37
- 100% { transform: translate(-50%, -50%) rotate(360deg); }
38
- }
39
- .flower:hover {
40
- animation: rotate-flower 4s linear infinite;
41
- }
42
- /* Header slide-right animation */
43
- @keyframes slide-right {
44
- 0% {
45
- transform: translateX(-100%);
46
- }
47
- 100% {
48
- transform: translateX(0);
49
- }
50
- }
51
- .header-slide-right {
52
- display: inline-block;
53
- animation: slide-right 2s ease-out;
54
- }
55
  </style>
56
  """,
57
  unsafe_allow_html=True
58
  )
59
 
60
- # Add flower in the center
61
  st.markdown('<div class="flower"></div>', unsafe_allow_html=True)
62
 
63
  # Streamlit UI elements
64
- st.title("Word Cloud Application", anchor=None)
65
- st.markdown(
66
- '<div class="header-slide-right">Welcome to the Word Cloud Application</div>',
67
- unsafe_allow_html=True,
68
- )
69
- st.markdown(
70
- '<div class="header_description">This app provides a beautiful interface to display word clouds.</div>',
71
- unsafe_allow_html=True,
72
- )
73
 
74
  # Add some interactivity
75
  if st.button("Click Me"):
 
1
  import streamlit as st
2
 
3
+ # Inject custom CSS for a centered flower with background gradient
4
  st.markdown(
5
  """
6
  <style>
 
19
  font-family: 'Arial', sans-serif;
20
  position: relative;
21
  }
22
+ /* Centered flower */
23
  .flower {
24
  position: absolute;
25
+ top: 50%;
26
+ left: 50%;
27
  transform: translate(-50%, -50%);
28
+ width: 150px;
29
+ height: 150px;
30
  background-image: url("https://upload.wikimedia.org/wikipedia/commons/thumb/3/30/Red_flower.svg/1200px-Red_flower.svg.png");
31
  background-size: contain;
32
  background-repeat: no-repeat;
33
  }
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
34
  </style>
35
  """,
36
  unsafe_allow_html=True
37
  )
38
 
39
+ # Add the flower element to the center of the app
40
  st.markdown('<div class="flower"></div>', unsafe_allow_html=True)
41
 
42
  # Streamlit UI elements
43
+ st.title("Word Cloud Application")
44
+ st.markdown("Welcome to the Word Cloud Application with a beautiful flower in the background!")
 
 
 
 
 
 
 
45
 
46
  # Add some interactivity
47
  if st.button("Click Me"):