prasadnu commited on
Commit
c55d364
·
1 Parent(s): 5395f8e
Files changed (1) hide show
  1. app.py +34 -8
app.py CHANGED
@@ -55,12 +55,41 @@ st.markdown("""
55
  justify-content: space-between;
56
  align-items: center;
57
  border: 1px solid #333333;
 
 
 
 
 
 
 
 
58
  }
59
 
60
  .demo-text {
61
- font-size: 24px;
62
  color: #c5c3c0;
63
  font-family: 'Amazon Ember Cd RC 250', sans-serif;
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
64
  }
65
 
66
  .demo-button {
@@ -71,12 +100,6 @@ st.markdown("""
71
  border-radius: 6px;
72
  font-size: 16px;
73
  }
74
-
75
- a .demo-card:hover {
76
- background-color: #e46e08 !important;
77
- color: black !important;
78
- transition: 0.3s;
79
- }
80
  </style>
81
  """, unsafe_allow_html=True)
82
 
@@ -98,7 +121,10 @@ def demo_link_block(icon, title, target_page):
98
  st.markdown(f"""
99
  <a href="/{target_page}" target="_self" style="text-decoration: none;">
100
  <div class="demo-card">
101
- <div class="demo-text">{icon} {title}</div>
 
 
 
102
  </div>
103
  </a>
104
  """, unsafe_allow_html=True)
 
55
  justify-content: space-between;
56
  align-items: center;
57
  border: 1px solid #333333;
58
+ transition: background-color 0.3s ease;
59
+ position: relative;
60
+ cursor: pointer;
61
+ }
62
+
63
+ .demo-card:hover {
64
+ background-color: #e46e08 !important;
65
+ color: #000 !important;
66
  }
67
 
68
  .demo-text {
69
+ font-size: 28px;
70
  color: #c5c3c0;
71
  font-family: 'Amazon Ember Cd RC 250', sans-serif;
72
+ display: flex;
73
+ align-items: center;
74
+ gap: 10px;
75
+ }
76
+
77
+ .demo-arrow {
78
+ font-size: 26px;
79
+ font-weight: bold;
80
+ color: #fff;
81
+ opacity: 0;
82
+ transform: scale(1);
83
+ transition: all 0.3s ease-in-out;
84
+ }
85
+
86
+ .demo-card:hover .demo-arrow {
87
+ opacity: 1;
88
+ color: #000;
89
+ }
90
+
91
+ .demo-card:active .demo-arrow {
92
+ transform: scale(1.3) rotate(45deg);
93
  }
94
 
95
  .demo-button {
 
100
  border-radius: 6px;
101
  font-size: 16px;
102
  }
 
 
 
 
 
 
103
  </style>
104
  """, unsafe_allow_html=True)
105
 
 
121
  st.markdown(f"""
122
  <a href="/{target_page}" target="_self" style="text-decoration: none;">
123
  <div class="demo-card">
124
+ <div class="demo-text">
125
+ <span>{icon} {title}</span>
126
+ <span class="demo-arrow">→</span>
127
+ </div>
128
  </div>
129
  </a>
130
  """, unsafe_allow_html=True)