Skip to content

Commit

Permalink
Change the design
Browse files Browse the repository at this point in the history
  • Loading branch information
VishwaAmarasinghe committed Jun 26, 2024
1 parent b51f77c commit 676b246
Show file tree
Hide file tree
Showing 7 changed files with 94 additions and 83 deletions.
Binary file modified assets/img/bg.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added assets/img/splendour-assets/splendour.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added assets/img/splendour-logo.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added assets/img/splendour.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
6 changes: 3 additions & 3 deletions assets/placeholders/footer.html
Original file line number Diff line number Diff line change
Expand Up @@ -2,13 +2,13 @@
<hr><br>
<div class="row footer-row">
<div class="col-9 col-md-6">
<span class="footer-head">
<div class="footer-head">
<img src="./assets/img/acf.png" alt="" srcset="" class="footer-acf">
<div class="footer-name">
<h2>Splendour</h2> Organized by ACF
</div>

</span>
</div>
</div>
<div class="col-9 col-md-6 link-col">
<h4>Links</h4>
Expand All @@ -30,7 +30,7 @@ <h4>Links</h4>
</div>
<br>
<center>
<h5>All rights reserved by ©️ 2024 Antonian Computer Fraternity</h5>
<h5 class="rights">All rights reserved by ©️ 2024 Antonian Computer Fraternity</h5>
</center>
</div>
</footer>
110 changes: 69 additions & 41 deletions assets/style/style.css
Original file line number Diff line number Diff line change
Expand Up @@ -27,7 +27,7 @@ html{

#home{
height: 700px;
background: url("../img/bg-1-1.jpg")no-repeat;
background: url("../img/bg.png")no-repeat;
background-position: center center;
background-size:cover;
}
Expand Down Expand Up @@ -58,7 +58,7 @@ background-size:cover;
}
.navbar-nav li a , .navbar-brand{
color: #ffffff !important ;
font-weight: 600;
font-weight: 700;
font-size: 20px;
animation: li-load 5s ;
}
Expand All @@ -81,14 +81,10 @@ background-size:cover;
}
.header{
position: relative;
color: white;
top:200px;

}
.header h1{
font-size: 120px;
font-style: normal;
font-weight: 700;
}

.buttons-header{
margin-top: 30px;
display: flex;
Expand Down Expand Up @@ -151,12 +147,9 @@ background-size:cover;
position: relative;
overflow: hidden;
}
.acf-img{
width: 200px;
padding-bottom: 20px;
}

.about-header{
width: 50%;
width: 60%;
height: auto;
}
.about-text{
Expand All @@ -179,15 +172,23 @@ height: auto;
font-optical-sizing: auto;
font-style: normal;
}
.contact-cards{
margin-top: 50px;
.contact-detail{
padding-top: 70px;
padding-bottom: 70px;
}
.contact-card{
margin: 20px;
font-size: 20px;
font-optical-sizing: auto;
font-style: normal;
padding: 20px;
padding-bottom: 50px;
color: #ffffff;
}
.Contact-name{
font-size: 25px;
font-weight: 600;
}
.Contact-number a{
color: #ffffff;
text-decoration: none;
font-size: 25px;
font-weight: 600;
}
.card-heading{
font-weight: 600;
Expand Down Expand Up @@ -318,17 +319,7 @@ scale: 1.0;
margin-bottom: 50px;
font-size: 18px;
}
@media (max-width:800px){
.contact-card{
width: 100%;
}
.contact-card .row{
width: 100%;
margin: 0px !important;
padding: 0px !important;
}

}

@media (max-width:700px) {
#home , #about , #contact , #competitions , #Competition-sub{
padding: 10px;
Expand All @@ -349,24 +340,61 @@ scale: 1.0;
position: relative;
top: -30px;
}
.contact-card{
width: 100%;
.Contact-name{
font-size: 20px;
font-weight: 600;
}
.contact-card .row{
width: 100%;
margin: 0px !important;
padding: 0px !important;
.Contact-number a{
color: #ffffff;
text-decoration: none;
font-size: 20px;
font-weight: 600;
}

}
@media (max-width:500px){
.button-main{
font-size: 10px;
width: 100px;
}
.card-heading{
font-size:15px;
}
.card-details{
font-size: 10px;
}
.Contact-name{
font-size: 15px;
font-weight: 600;
}
.Contact-number a{
color: #ffffff;
text-decoration: none;
font-size: 15px;
font-weight: 600;
}
.about-header{
width: 90%;
}
.about-text{
font-size: 15px;
}
.buttons-header{
display:grid;
gap: 1rem;
}
.contact-heading{
font-size: 30px;
}
.contact-text{
font-size: 15px;
}
.social-media{
gap: 0rem;
}

}
@media (max-width:300px){
.footer-head{
display: grid;
}
.rights{
font-size: 15px;
}
}
61 changes: 22 additions & 39 deletions index.html
Original file line number Diff line number Diff line change
Expand Up @@ -24,7 +24,7 @@
<div class="header">
<center>

<img src="./assets/img/Untitled-2-copy.png" alt="" class="main-text"data-aos="zoom-in" data-aos-once="true">
<img src="./assets/img/splendour.png" alt="" class="main-text"data-aos="zoom-in" data-aos-once="true">

<div class="buttons-header" data-aos="zoom-in" data-aos-once="true">

Expand All @@ -48,12 +48,7 @@
<section id="about">
<div id="particles-js"></div>
<div class="content">
<div><center><img src="./assets/img/logo.png"class="about-header" alt="" data-aos="zoom-in" data-aos-once="true" ></center></div><br>
<center>
<div class="acf-img-div" data-aos="zoom-in" data-aos-once="true" >
<img src="assets/img/acf.png" alt="" srcset="" class="acf-img">
</div>
</center>
<div><center><img src="./assets/img/splendour-logo.png"class="about-header" alt="" data-aos="zoom-in" data-aos-once="true" ></center></div><br>
<div class="about-text" data-aos="zoom-in" data-aos-once="true" >St. Anthony's College Kandy's Computer Fraternity hosts Splendour annually,
celebrating ICT Day with a showcase of digital talent. This event features competitions
in web design, photo manipulation, poster design, 3D rendering, logo design, game development,
Expand Down Expand Up @@ -83,38 +78,26 @@ <h1 class="contact-heading" data-aos="zoom-in" data-aos-once="true">
Feel free to ask the questions and to aware about the event
</div>

<div class="contact-cards" data-aos="zoom-in" data-aos-once="true">
<div class="row justify-content-center">
<div class="col-9 col-lg-6">
<div class="contact-card card">
<div class="card-heading">Aquinas Silva(President)</div>
<div class="card-details">+94 77 112 8140</div>
</div>
</div>
<div class="col-9 col-lg-6">
<div class="contact-card card">
<div class="card-heading">Tharuka Wijekoon(Vice-President)</div>
<div class="card-details">+94 71 272 7445</div>
</div>
</div>
<div class="col-9 col-lg-6">
<div class="contact-card card">
<div class="card-heading">Maleesha Piyathissa(Vice-President)</div>
<div class="card-details">+94 70 184 5595</div>
</div>
</div>
<div class="col-9 col-lg-6">
<div class="contact-card card">
<div class="card-heading">Dan Dhanushyan(Secretary)</div>
<div class="card-details">+94 76 317 8056</div>
</div>
</div>
<div class="col-9 col-lg-6">
<div class="contact-card card">
<div class="card-heading">Sudas Nimnath(Vice-Secretary)</div>
<div class="card-details">+94 71 839 8089</div>
</div>
</div>
<div class="contact-detail">
<div class="col-9 contact-card"data-aos="zoom-in" data-aos-once="true">
<div class="Contact-name">Aquinas Silva(President)</div>
<div class="Contact-number"><a href="https://wa.me/+94771128140" class="link-contact">+94 77 112 8140</a> </div>
</div>
<div class="col-9 contact-card"data-aos="zoom-in" data-aos-once="true">
<div class="Contact-name">Dan Dhanushyan(Secretary)</div>
<div class="Contact-number"><a href="https://wa.me/+94763178056" class="link-contact">+94 76 317 8056</a> </div>
</div>
<div class="col-9 contact-card"data-aos="zoom-in" data-aos-once="true">
<div class="Contact-name">Tharuka Wijekoon(Vice-President)</div>
<div class="Contact-number"><a href="https://wa.me/+94712727445" class="link-contact">+94 71 272 7445</a> </div>
</div>
<div class="col-9 contact-card"data-aos="zoom-in" data-aos-once="true">
<div class="Contact-name">Maleesha Piyathissa(Vice-President)</div>
<div class="Contact-number"><a href="https://wa.me/+94701845595" class="link-contact">+94 70 184 5595</a> </div>
</div>
<div class="col-9 contact-card"data-aos="zoom-in" data-aos-once="true">
<div class="Contact-name">Sudas Nimnath(Vice-Secretary)</div>
<div class="Contact-number"><a href="https://wa.me/+94718398089" class="link-contact">+94 71 839 8089</a> </div>
</div>
</div>
<div class="social-media" data-aos="zoom-in" data-aos-once="true">
Expand Down

0 comments on commit 676b246

Please sign in to comment.