Hugging Face's logo

Spaces:
Anshini
/
DataSciene_ChatBot
Running

App Files Community
Anshini commited on
Commit
db5ec60
·
verified ·
1 Parent(s): 0afb4fe

Update pages/machine_learning.py

Browse files
Files changed (1) hide show
  1. pages/machine_learning.py +37 -17
pages/machine_learning.py CHANGED
@@ -56,40 +56,60 @@ st.set_page_config(page_title="Machine Learning Mentor", layout="wide")
56
  # }
57
  # </style>
58
  # """, unsafe_allow_html=True)
 
59
  st.markdown("""
60
  <style>
61
  .main {
62
- background: linear-gradient(135deg, #430089 0%, #82ffa1 100%);
63
  padding: 2rem;
64
  font-family: 'Segoe UI', sans-serif;
65
  }
66
  .stButton>button {
67
- background: #ffffff10;
68
- border: 2px solid #ffffff50;
69
  color: white;
70
- font-size: 18px;
71
  font-weight: 600;
72
- padding: 0.8em 1.2em;
73
- border-radius: 12px;
74
- width: 100%;
75
- transition: 0.3s ease;
76
- box-shadow: 0 4px 10px rgba(0, 0, 0, 0.15);
77
  }
78
  .stButton>button:hover {
79
- background: #ffffff30;
 
80
  border-color: #fff;
81
- color: #ffffff;
82
  }
83
  h1, h3, p, label {
84
- color: #ffffff;
85
  text-align: center;
86
  }
87
- hr {
88
- border: 1px solid #ffffff50;
89
- margin: 2em 0;
 
 
 
 
 
 
 
 
90
  }
91
- .css-1aumxhk {
92
- color: white;
 
 
 
 
 
 
 
 
 
 
 
 
 
 
93
  }
94
  </style>
95
  """, unsafe_allow_html=True)
 
56
  # }
57
  # </style>
58
  # """, unsafe_allow_html=True)
59
+ # Improved custom CSS
60
  st.markdown("""
61
  <style>
62
  .main {
63
+ background: linear-gradient(to right, #1f4037, #99f2c8);
64
  padding: 2rem;
65
  font-family: 'Segoe UI', sans-serif;
66
  }
67
  .stButton>button {
68
+ background-color: #ffffff10;
 
69
  color: white;
 
70
  font-weight: 600;
71
+ border-radius: 10px;
72
+ padding: 0.6rem 1rem;
73
+ transition: all 0.3s ease;
74
+ border: 1px solid white;
 
75
  }
76
  .stButton>button:hover {
77
+ background-color: #ffffff30;
78
+ color: white;
79
  border-color: #fff;
 
80
  }
81
  h1, h3, p, label {
82
+ color: white;
83
  text-align: center;
84
  }
85
+ .chat-bubble-user {
86
+ background-color: #ffffff25;
87
+ padding: 0.75rem 1rem;
88
+ border-radius: 1rem;
89
+ margin-bottom: 0.5rem;
90
+ color: #fff;
91
+ font-weight: 500;
92
+ text-align: left;
93
+ width: fit-content;
94
+ max-width: 90%;
95
+ align-self: flex-end;
96
  }
97
+ .chat-bubble-bot {
98
+ background-color: #ffffff15;
99
+ padding: 0.75rem 1rem;
100
+ border-radius: 1rem;
101
+ margin-bottom: 0.5rem;
102
+ color: #fff;
103
+ text-align: left;
104
+ width: fit-content;
105
+ max-width: 90%;
106
+ align-self: flex-start;
107
+ }
108
+ .chat-container {
109
+ display: flex;
110
+ flex-direction: column;
111
+ gap: 0.5rem;
112
+ margin-top: 2rem;
113
  }
114
  </style>
115
  """, unsafe_allow_html=True)