font size and color

Counselllor · May 30, 2024 · 76eb38f · 76eb38f
1 parent 55f290a
commit 76eb38f
Show file tree

Hide file tree

Showing 2 changed files with 31 additions and 24 deletions.
diff --git a/src/components/CollegePage/CollegePage.css b/src/components/CollegePage/CollegePage.css
@@ -25,9 +25,16 @@
 
 }
 
+  .abeezee-regular {
+    font-family: "ABeeZee", sans-serif;
+    font-weight: 400;
+    font-style: normal;
+  }
+
+
 .college-name {
   font-weight: bolder;
-  font-size: 40px;
+  font-size: 30px;
   width: 90%;
   margin-top: 0px;
   margin-bottom: 0px;
@@ -196,17 +203,17 @@ margin-bottom: 0px;
   display: -webkit-box;
   -webkit-box-orient: vertical;
   overflow: hidden;
-  -webkit-line-clamp: 4;
+  -webkit-line-clamp: 5;
   line-clamp: 5;
-  height: calc(1.2em * 4); /* 1.2em is an approximate line height, adjust as necessary */
+  height: calc(1.2em * 5); /* 1.2em is an approximate line height, adjust as necessary */
 }
 .clipped-text1{
   display: -webkit-box;
   -webkit-box-orient: vertical;
   overflow: hidden;
-  -webkit-line-clamp: 2;
-  line-clamp: 2;
-  height: calc(1.2em * 2);
+  -webkit-line-clamp: 3;
+  line-clamp: 3;
+  height: calc(1.2em * 3);
 }
 .student {
   background-color: rgb(229, 234, 234);
@@ -250,17 +257,17 @@ margin-bottom: 0px;
     display: -webkit-box;
     -webkit-box-orient: vertical;
     overflow: hidden;
-    -webkit-line-clamp: 3;
-    line-clamp: 3;
-    height: calc(1.2em * 3); /* 1.2em is an approximate line height, adjust as necessary */
+    -webkit-line-clamp: 4;
+    line-clamp: 4;
+    height: calc(1.2em * 4); /* 1.2em is an approximate line height, adjust as necessary */
   }
   .clipped-text1{
     display: -webkit-box;
     -webkit-box-orient: vertical;
     overflow: hidden;
-    -webkit-line-clamp: 1;
-    line-clamp: 1;
-    height: calc(1.2em * 1);
+    -webkit-line-clamp: 3;
+    line-clamp: 3;
+    height: calc(1.2em * 3);
   }
 }
 @media only screen and (max-width:385px){

diff --git a/src/components/CollegePage/CollegePage.jsx b/src/components/CollegePage/CollegePage.jsx
@@ -78,18 +78,18 @@ const CollegePage = () => {
           <div className="content">
             <div style={{height:"auto",width:"100%",paddingTop:"20px"}}>
 
-            <h1 className="college-name">{college.name}</h1>
+            <h1 className="college-name abeezee-regular">{college.name}</h1>
             <div className="description-card">
-              <p className="description clipped-text">{college.description}</p>
+              <p className="description clipped-text abeezee-regular">{college.description}</p>
             </div>
             <div className="group" >
               <div className="location">
                 <div className='icon'>
                   <Icon icon="ion:location-outline" style={{ fontSize: '24px'}} />
                 </div>
                 <div className="location-depth">
-                  <p className="location-heading">Location</p>
-                <p className="location-text clipped-text1">{college['exact-location']}</p>
+                  <p className="location-heading abeezee-regular">Location</p>
+                <p className="location-text clipped-text1 abeezee-regular">{college['exact-location']}</p>
                 </div>
                 </div>
               <div className="rating">
@@ -98,15 +98,15 @@ const CollegePage = () => {
                 </div>
                 <div className='rate'>
 
-                <p className="rating-heading">Rating</p>
-                <p className="rating-text">{college.rating}/10</p>
+                <p className="rating-heading abeezee-regular">Rating</p>
+                <p className="rating-text abeezee-regular" >{college.rating}/10</p>
                 </div>
               </div>
             </div>
             </div>
             <img className="image" src={college.imageURL} />
           </div>
-          <button className="search-button"><a href={college.website} target="_blank" rel="noreferrer">Search</a></button>
+          <button className="search-button "><a href={college.website} target="_blank" rel="noreferrer">Search</a></button>
         </div>
         <div className="right">
           <div className="searchCourses" style={{marginTop:"20px"}}>
@@ -126,13 +126,13 @@ const CollegePage = () => {
               <div key={student.id} className="student-card">
                 <div style={{width:"20%",display: "flex", paddingLeft:"20px", alignitems: "center"}}><img src={`${imgArray[index]}`} style={{height:"80%",minHeight:"66px",maxWidth:"80%"}}></img></div>
                 <div className='st'>
-                <p style={{textAlign:"left",width:"50%",fontSize:"15px",marginBottom:"0px",marginTop:"10px",paddingLeft:"8px",backgroundColor:"rgba(255,255,255,0.3)",borderRadius:"15px"}}>{student.name}</p>
+                <p className='abeezee-regular' style={{textAlign:"left",width:"50%",fontSize:"15px",marginBottom:"0px",marginTop:"10px",paddingLeft:"8px",backgroundColor:"rgba(255,255,255,0.3)",borderRadius:"15px"}}>{student.name}</p>
                 <div className="student-description">
-                  <p style={{marginBottom:"0px",marginTop:"18px",fontSize:"25px",fontWeight:"600"}}>{student.course}</p>
-                  <p style={{marginBottom:"0px",marginTop:"18px",fontSize:"25px",fontWeight:"600"}}>{student.branch}</p>
-                  <p style={{marginBottom:"0px",marginTop:"18px",fontSize:"25px",fontWeight:"600"}}>{student.year}</p>
+                  <p className='abeezee-regular' style={{marginBottom:"0px",marginTop:"18px",fontSize:"20px",fontWeight:"600"}}>{student.course}</p>
+                  <p className='abeezee-regular' style={{marginBottom:"0px",marginTop:"18px",fontSize:"20px",fontWeight:"600"}}>{student.branch}</p>
+                  <p className='abeezee-regular' style={{marginBottom:"0px",marginTop:"18px",fontSize:"20px",fontWeight:"600"}}>{student.year}</p>
                 </div>
-                <p className="position">{student.position}</p>
+                <p className="position abeezee-regular">{student.position}</p>
                 </div>
               </div>
             ))}