Skip to content

W
Website
Commit b833c773 authored by sachith.fernando's avatar sachith.fernando
Browse files
Options

nav bar changed

parent a97a0657
Show whitespace changes
Inline Side-by-side
Showing with 527 additions and 475 deletions
assets/css/style.css
View file @ b833c773
...@@ -1489,3 +1489,99 @@ lex-direction: column; ...@@ -1489,3 +1489,99 @@ lex-direction: column;
margin-top: auto; margin-top: auto;
} }
a:hover,a:focus{
outline: none;
text-decoration: none;
}
.tab-test .nav-tabs{
border-bottom: none;
position: relative;
}
.tab-test .nav-tabs li{
margin-right: 60px;
z-index: 1;
}
.tab-test .nav-tabs li:after{
content: "";
width: 100%;
border: 1px solid #04476f;
position: absolute;
top: 50%;
right: -60%;
z-index: -1;
}
.tab-test .nav-tabs li:last-child:after{
border: none;
}
.tab-test .nav-tabs li a{
display: block;
/*padding: 15px 20px;*/
background: #fff;
font-size: 15px;
font-weight: 600;
color: #04476f;
/*text-transform: uppercase;*/
border-radius: 0;
margin-right: -32px;
border: 2px solid #04476f;
position: relative;
overflow: hidden;
z-index: 1;
transition: all 0.3s ease 0s;
}
.tab-test .nav-tabs li.active a,
.tab-test .nav-tabs li a:hover{
color: #fff;
border: 2px solid #04476f;
}
.tab-test .nav-tabs li a:after{
content: "";
display: block;
width: 100%;
height: 0;
position: absolute;
top: 0;
left: 0;
z-index: -1;
color: #FFFFFF;
transition: all 0.3s ease 0s;
}
.tab-test .nav-tabs li.active a:after,
.tab-test .nav-tabs li a:hover:after{
height: 100%;
background: #04476f;
color: #FFFFFF;
}
.tab-test .tab-content{
padding: 20px 10px;
margin-top: 0;
font-size: 14px;
color: #2d2d2d;
line-height: 26px;
}
.tab-test .tab-content h3{
font-size: 24px;
margin-top: 0;
}
@media only screen and (max-width: 767px){
.tab-test .nav-tabs li{ margin: 0 25px 0 0; }
}
@media only screen and (max-width: 479px){
.tab-test .nav-tabs li{
width: 100%;
text-align: center;
color: #FFFFFF;
margin: 0 0 10px 0;
}
.tab-test .nav-tabs li:after{
width: 0;
height: 100%;
top: auto;
bottom: -60%;
color: #FFFFFF;
right: 50%;
}
}
index.html
View file @ b833c773
...@@ -123,41 +123,20 @@ ...@@ -123,41 +123,20 @@
<!-- <p data-aos="fade-in">Magnam dolores commodi suscipit. Necessitatibus eius consequatur ex aliquid fuga eum quidem. Sit sint consectetur velit. Quisquam quos quisquam cupiditate. Et nemo qui impedit suscipit alias ea. Quia fugiat sit in iste officiis commodi quidem hic quas.</p>--> <!-- <p data-aos="fade-in">Magnam dolores commodi suscipit. Necessitatibus eius consequatur ex aliquid fuga eum quidem. Sit sint consectetur velit. Quisquam quos quisquam cupiditate. Et nemo qui impedit suscipit alias ea. Quia fugiat sit in iste officiis commodi quidem hic quas.</p>-->
</div> </div>
<!--nav tabs--> <div class="tab-test" role="tabpanel">
<ul class="nav nav-tabs nav-fill" id="nav_bar" role="tablist"> <!-- Nav tabs -->
<li class="nav-item"> <ul class="nav nav-tabs" role="tablist">
<a aria-controls="lit_survey" aria-selected="false" class="nav-link active" data-toggle="tab" <li role="presentation" class="active"><a href="#lit-survey" aria-controls="home" role="tab" data-toggle="tab">Literature Survey</a></li>
href="#lit_survey" <li role="presentation"><a href="#r-gap" aria-controls="profile" role="tab" data-toggle="tab">Research Gap</a></li>
id="lit-survey-tab" role="tab">Literature Survey</a> <li role="presentation"><a href="#rp" aria-controls="messages" role="tab" data-toggle="tab">Research Problem</a></li>
</li> <li role="presentation"><a href="#ro" aria-controls="messages" role="tab" data-toggle="tab">Research Objectives</a></li>
<li class="nav-item"> <li role="presentation"><a href="#meth" aria-controls="messages" role="tab" data-toggle="tab">Methodology</a></li>
<a aria-controls="research_gap" aria-selected="false" class="nav-link" data-toggle="tab" <li role="presentation"><a href="#tu" aria-controls="messages" role="tab" data-toggle="tab">Technologies Used</a></li>
href="#research_gap" id="research-gap-tab" role="tab">Research Gap</a>
</li>
<li class="nav-item">
<a aria-controls="research_problem" aria-selected="false" class="nav-link" data-toggle="tab"
href="#research_problem" id="research-problem-tab" role="tab">Research Problem</a>
</li>
<li class="nav-item">
<a aria-controls="research_objectives" aria-selected="false" class="nav-link" data-toggle="tab"
href="#research_objectives" id="research-objectives-tab" role="tab">Research Objectives</a>
</li>
<li class="nav-item">
<a aria-controls="methodology" aria-selected="false" class="nav-link" data-toggle="tab"
href="#methodology" id="methodology-tab" role="tab">Methodology</a>
</li>
<li class="nav-item">
<a aria-controls="technologies_used" aria-selected="false" class="nav-link" data-toggle="tab"
href="#technologies_used" id="technologies-used-tab" role="tab">Technologies used</a>
</li>
</ul> </ul>
<!-- Tab panes -->
<div class="tab-content tabs">
<div role="tabpanel" class="tab-pane fade in active" id="lit-survey">
<!--tab content-->
<div class="tab-content" id="tabContentDetails">
<!--literature_survey-->
<div class="tab-pane fade in active" id="lit_survey" role="tabpanel">
<h2>Literature Survey</h2> <h2>Literature Survey</h2>
<div class="card"> <div class="card">
...@@ -303,10 +282,8 @@ ...@@ -303,10 +282,8 @@
</div> </div>
</div> </div>
<!-- end of literature_survey--> <div role="tabpanel" class="tab-pane fade" id="r-gap">
<!--research gap-->
<div class="tab-pane fade" id="research_gap" role="tabpanel">
<h2>Research Gap</h2> <h2>Research Gap</h2>
<!--research gap table--> <!--research gap table-->
...@@ -397,13 +374,9 @@ ...@@ -397,13 +374,9 @@
</tr> </tr>
</tbody> </tbody>
</table> </table>
<!--end of research gap table-->
</div> </div>
<!-- end of research gap--> <div role="tabpanel" class="tab-pane fade" id="rp">
<!--research problem-->
<div class="tab-pane fade" id="research_problem" role="tabpanel">
<h2>Research Problem</h2> <h2>Research Problem</h2>
<ul class="list-group"> <ul class="list-group">
...@@ -428,10 +401,7 @@ ...@@ -428,10 +401,7 @@
</li> </li>
</ul> </ul>
</div> </div>
<!-- end of research problem--> <div role="tabpanel" class="tab-pane fade" id="ro">
<!--research objectives-->
<div class="tab-pane fade" id="research_objectives" role="tabpanel">
<h2>Research Objectives</h2> <h2>Research Objectives</h2>
<!--1st row--> <!--1st row-->
...@@ -540,13 +510,8 @@ ...@@ -540,13 +510,8 @@
</div> </div>
</div> </div>
<!--end of 2nd row--> <!--end of 2nd row-->
</div> </div>
<!-- end of research objectives--> <div role="tabpanel" class="tab-pane fade" id="meth">
<!--methodology-->
<div class="tab-pane fade" id="methodology" role="tabpanel">
<h2>Methodology</h2> <h2>Methodology</h2>
<div class="row no-gutters"> <div class="row no-gutters">
...@@ -607,13 +572,8 @@ ...@@ -607,13 +572,8 @@
<!--end of description column--> <!--end of description column-->
</div> </div>
</div> </div>
<!-- end of methodology--> <div role="tabpanel" class="tab-pane fade" id="tu">
<!--technologies used-->
<div class="tab-pane fade" id="technologies_used" role="tabpanel">
<h2>Domains</h2> <h2>Domains</h2>
<!-- logos of the domains used--> <!-- logos of the domains used-->
...@@ -706,12 +666,8 @@ ...@@ -706,12 +666,8 @@
</div> </div>
<!--end of logos--> <!--end of logos-->
</div> </div>
<!-- end of technologies used-->
</div> </div>
<!--end of tab content--> </div>
</div> </div>
</section> </section>
<!-- End Research Scope Section --> <!-- End Research Scope Section -->
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment