Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add News Page #25

Open
wants to merge 1 commit into
base: master
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
8 changes: 8 additions & 0 deletions css/style.css
Original file line number Diff line number Diff line change
Expand Up @@ -1922,10 +1922,18 @@ h3.small_heading {
margin-top: 50px;
}

.margin-top_150 {
margin-top: 150px;
}

.margin-bottom_30 {
margin-bottom: 30px;
}

.margin-bottom_60 {
margin-bottom: 60px;
}

.carousel a.carousel-control-prev {
background: #d4a81e;
opacity: 1;
Expand Down
379 changes: 379 additions & 0 deletions news.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,379 @@
<!DOCTYPE html>
<html lang="en">
<!-- Basic -->

<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />

<!-- Mobile Metas -->
<meta
name="viewport"
content="width=device-width, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no"
/>

<!-- Site Metas -->
<title>Codesis - Responsive HTML5 Template</title>
<meta name="keywords" content="" />
<meta name="description" content="" />
<meta name="author" content="" />

<!-- Site Icons -->
<link rel="shortcut icon" href="#" type="image/x-icon" />
<link rel="apple-touch-icon" href="#" />

<!-- Bootstrap CSS -->
<link rel="stylesheet" href="css/bootstrap.min.css" />
<!-- Pogo Slider CSS -->
<link rel="stylesheet" href="css/pogo-slider.min.css" />
<!-- Site CSS -->
<link rel="stylesheet" href="css/style.css" />
<!-- Responsive CSS -->
<link rel="stylesheet" href="css/responsive.css" />
<!-- Custom CSS -->
<link rel="stylesheet" href="css/custom.css" />

<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
</head>

<body
id="inner_page"
data-spy="scroll"
data-target="#navbar-wd"
data-offset="98"
>
<!-- LOADER -->
<div id="preloader">
<div class="loader">
<img src="images/loader.gif" alt="#" />
</div>
</div>
<!-- end loader -->
<!-- END LOADER -->

<!-- Start header -->
<header class="top-header">
<nav class="navbar header-nav navbar-expand-lg">
<div class="container-fluid">
<a class="navbar-brand" href="index.html"
><img src="images/logo.png" alt="image"
/></a>
<button
class="navbar-toggler"
type="button"
data-toggle="collapse"
data-target="#navbar-wd"
aria-controls="navbar-wd"
aria-expanded="false"
aria-label="Toggle navigation"
>
<span></span>
<span></span>
<span></span>
</button>
<div
class="collapse navbar-collapse justify-content-end"
id="navbar-wd"
>
<ul class="navbar-nav">
<li><a class="nav-link active" href="index.html">Home</a></li>
<li><a class="nav-link" href="about.html">About</a></li>
<li><a class="nav-link" href="courses.html">Courses</a></li>
<li><a class="nav-link" href="reaserch.html">Reaserch</a></li>
<li><a class="nav-link" href="news.html">News</a></li>
<li><a class="nav-link" href="contact.html">Contact us</a></li>
</ul>
</div>
<div class="search-box">
<input type="text" class="search-txt" placeholder="Search" />
<a class="search-btn">
<img src="images/search_icon.png" alt="#" />
</a>
</div>
</div>
</nav>
</header>
<!-- End header -->

<!-- section -->

<section class="inner_banner">
<div class="container">
<div class="row">
<div class="col-12">
<div class="full">
<h3>News</h3>
</div>
</div>
</div>
</div>
</section>

<!-- end section -->

<!-- section -->
<div
class="section layout_padding contact_section"
style="background:#f6f6f6;"
>
<div class="container">
<div class="row row-cols-1 row-cols-md-3">
<div class="col mb-4">
<div class="card h-100">
<a href="#">
<img src="images/img9.png" class="card-img-top" alt="...">
</a>
<div class="card-body">
<h5 class="card-title">Technology</h5>
<p class="card-text">Technology is the sum of techniques, skills, methods, and processes used in the production of goods or services or in the accomplishment of objectives</p>
</div>
</div>
</div>
<div class="col mb-4">
<div class="card h-100">
<a href="#">
<img src="images/img8.png" class="card-img-top" alt="...">
</a>
<div class="card-body">
<h5 class="card-title">Education</h5>
<p class="card-text">Education gives us a knowledge of the world around us and changes it into something better</p>
</div>
</div>
</div>
<div class="col mb-4">
<div class="card h-100">
<a href="#">
<img src="images/img6.png" class="card-img-top" alt="...">
</a>
<div class="card-body">
<h5 class="card-title">Technology</h5>
<p class="card-text">Technology is the sum of techniques, skills, methods, and processes used in the production of goods or services or in the accomplishment of objectives</p>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- end section -->
<!-- Start Footer -->
<footer class="footer-box">
<div class="container">
<div class="row">
<div class="col-xs-12 col-sm-6 col-md-6 col-lg-3">
<div class="footer_blog">
<div class="full margin-bottom_30">
<img src="images/footer_logo.png" alt="#" />
</div>
<div class="full white_fonts">
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed
do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Ut enim ad minim veniam, quis nostrud exercitation ullamco
laboris nisi ut aliquip
</p>
</div>
</div>
</div>

<div class="col-xs-12 col-sm-6 col-md-6 col-lg-3">
<div class="footer_blog footer_menu white_fonts">
<h3>Quick links</h3>
<ul>
<li><a href="#">> Join Us</a></li>
<li><a href="#">> Maintenance</a></li>
<li><a href="#">> Language Packs</a></li>
<li><a href="#">> LearnPress</a></li>
<li><a href="#">> Release Status</a></li>
</ul>
</div>
</div>

<div class="col-xs-12 col-sm-6 col-md-6 col-lg-3">
<div class="footer_blog full white_fonts">
<h3>Newsletter</h3>
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do
</p>
<div class="newsletter_form">
<form action="index.html">
<input
type="email"
placeholder="Your Email"
name="#"
required
/>
<button>Submit</button>
</form>
</div>
</div>
</div>

<div class="col-xs-12 col-sm-6 col-md-6 col-lg-3">
<div class="footer_blog full white_fonts">
<h3>Contact us</h3>
<ul class="full">
<li>
<img src="images/i5.png" /><span
>London 145<br />United Kingdom</span
>
</li>
<li><img src="images/i6.png" /><span>[email protected]</span></li>
<li><img src="images/i7.png" /><span>+12586954775</span></li>
</ul>
</div>
</div>
</div>
</div>
</footer>
<!-- End Footer -->

<div class="footer_bottom">
<div class="container">
<div class="row">
<div class="col-12">
<p class="crp">© Copyrights 2019 design by html.design</p>
</div>
</div>
</div>
</div>

<a href="#" id="scroll-to-top" class="hvr-radial-out"
><i class="fa fa-angle-up"></i
></a>

<!-- ALL JS FILES -->
<script src="js/jquery.min.js"></script>
<script src="js/popper.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<!-- ALL PLUGINS -->
<script src="js/jquery.magnific-popup.min.js"></script>
<script src="js/jquery.pogo-slider.min.js"></script>
<script src="js/slider-index.js"></script>
<script src="js/smoothscroll.js"></script>
<script src="js/form-validator.min.js"></script>
<script src="js/contact-form-script.js"></script>
<script src="js/isotope.min.js"></script>
<script src="js/images-loded.min.js"></script>
<script src="js/custom.js"></script>
<script>
/* counter js */

(function($) {
$.fn.countTo = function(options) {
options = options || {};

return $(this).each(function() {
// set options for current element
var settings = $.extend(
{},
$.fn.countTo.defaults,
{
from: $(this).data("from"),
to: $(this).data("to"),
speed: $(this).data("speed"),
refreshInterval: $(this).data("refresh-interval"),
decimals: $(this).data("decimals"),
},
options
);

// how many times to update the value, and how much to increment the value on each update
var loops = Math.ceil(settings.speed / settings.refreshInterval),
increment = (settings.to - settings.from) / loops;

// references & variables that will change with each update
var self = this,
$self = $(this),
loopCount = 0,
value = settings.from,
data = $self.data("countTo") || {};

$self.data("countTo", data);

// if an existing interval can be found, clear it first
if (data.interval) {
clearInterval(data.interval);
}
data.interval = setInterval(updateTimer, settings.refreshInterval);

// initialize the element with the starting value
render(value);

function updateTimer() {
value += increment;
loopCount++;

render(value);

if (typeof settings.onUpdate == "function") {
settings.onUpdate.call(self, value);
}

if (loopCount >= loops) {
// remove the interval
$self.removeData("countTo");
clearInterval(data.interval);
value = settings.to;

if (typeof settings.onComplete == "function") {
settings.onComplete.call(self, value);
}
}
}

function render(value) {
var formattedValue = settings.formatter.call(
self,
value,
settings
);
$self.html(formattedValue);
}
});
};

$.fn.countTo.defaults = {
from: 0, // the number the element should start at
to: 0, // the number the element should end at
speed: 1000, // how long it should take to count between the target numbers
refreshInterval: 100, // how often the element should be updated
decimals: 0, // the number of decimal places to show
formatter: formatter, // handler for formatting the value before rendering
onUpdate: null, // callback method for every time the element is updated
onComplete: null, // callback method for when the element finishes updating
};

function formatter(value, settings) {
return value.toFixed(settings.decimals);
}
})(jQuery);

jQuery(function($) {
// custom formatting example
$(".count-number").data("countToOptions", {
formatter: function(value, options) {
return value
.toFixed(options.decimals)
.replace(/\B(?=(?:\d{3})+(?!\d))/g, ",");
},
});

// start all the timers
$(".timer").each(count);

function count(options) {
var $this = $(this);
options = $.extend(
{},
options || {},
$this.data("countToOptions") || {}
);
$this.countTo(options);
}
});
</script>
</body>
</html>