ShanmugaKrishnanSM/RIT-nexus
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

ui: implement verified-card focus state style on Q&A inputs

Browse Source
This commit is contained in:
Devesh S
2026-07-23 21:52:57 +05:30
parent e37d935324
commit fc94b5081f
2 changed files with 16 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
src/index.css
View File

@@ -294,3 +294,17 @@ h1, h2, h3, h4, h5, h6 {
align-self: flex-start; align-self: flex-start;
border: 1px solid #E5E7EB; border: 1px solid #E5E7EB;
} }
/* Verified card style input focus state */
.verified-focus-input {
transition: border-color 0.2s ease, background 0.2s ease, box-shadow 0.2s ease;
background-color: #FFFFFF;
border: 1.5px solid #E5E7EB !important;
}
.verified-focus-input:focus {
outline: none !important;
border-color: #F97316 !important;
background-image: linear-gradient(to bottom, #FFFFFF 0%, #FFF7ED 100%) !important;
box-shadow: none !important;
}

4
src/pages/Community/Community.tsx
View File

@@ -297,7 +297,7 @@ export default function Community() {
onChange={(e) => setQuestionText(e.target.value)} onChange={(e) => setQuestionText(e.target.value)}
placeholder="What's on your mind? Ask your seniors anything about RIT..." placeholder="What's on your mind? Ask your seniors anything about RIT..."
rows={3} rows={3}
className="w-full border border-[#E5E7EB] rounded-2xl p-3.5 text-[13px] text-slate-800 placeholder-slate-400 focus:outline-none focus:border-[#F97316] focus:ring-4 focus:ring-orange-500/[0.12] focus:bg-orange-500/[0.02] bg-slate-50/30 resize-none transition-all duration-250 ease-in-out mb-3.5" className="w-full verified-focus-input rounded-2xl p-3.5 text-[13px] text-slate-800 placeholder-slate-400 resize-none mb-3.5"
style={{ fontFamily: 'Inter, sans-serif' }} style={{ fontFamily: 'Inter, sans-serif' }}
/> />
<input <input
@@ -305,7 +305,7 @@ export default function Community() {
value={authorName} value={authorName}
onChange={(e) => setAuthorName(e.target.value)} onChange={(e) => setAuthorName(e.target.value)}
placeholder="Your Name (optional)" placeholder="Your Name (optional)"
className="w-full md:w-64 border border-[#E5E7EB] rounded-2xl px-4 py-2.5 text-[13px] text-slate-800 placeholder-slate-400 focus:outline-none focus:border-[#F97316] focus:ring-4 focus:ring-orange-500/[0.12] focus:bg-orange-500/[0.02] bg-slate-50/30 transition-all duration-250 ease-in-out mb-4" className="w-full md:w-64 verified-focus-input rounded-2xl px-4 py-2.5 text-[13px] text-slate-800 placeholder-slate-400 mb-4"
style={{ fontFamily: 'Inter, sans-serif' }} style={{ fontFamily: 'Inter, sans-serif' }}
/> />
<div className="flex items-center justify-between"> <div className="flex items-center justify-between">