Skip to content
Snippets Groups Projects
Commit ddee26c0 authored by Katarína Furmanová's avatar Katarína Furmanová
Browse files

Upload New File

parent b909be20
No related branches found
No related tags found
No related merge requests found
Pipeline #
Hide whitespace changes
Inline Side-by-side
Showing
with 490 additions and 0 deletions
public/lectures.html 0 → 100644
+ 490
− 0
View file @ ddee26c0
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>PB009 - Principles of Computer Graphics</title>
<meta content="width=device-width, initial-scale=1.0" name="viewport">
<meta content="" name="keywords">
<meta content="" name="description">
<!-- Favicon -->
<link href="img/favicon.ico" rel="icon">
<!-- Google Web Fonts -->
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link
href="https://fonts.googleapis.com/css2?family=Heebo:wght@400;500;600&family=Nunito:wght@600;700;800&display=swap"
rel="stylesheet">
<!-- Icon Font Stylesheet -->
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.10.0/css/all.min.css" rel="stylesheet">
<link href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.4.1/font/bootstrap-icons.css" rel="stylesheet">
<!-- Libraries Stylesheet -->
<link href="lib/animate/animate.min.css" rel="stylesheet">
<link href="lib/owlcarousel/assets/owl.carousel.min.css" rel="stylesheet">
<!-- Customized Bootstrap Stylesheet -->
<link href="css/bootstrap.min.css" rel="stylesheet">
<!-- Template Stylesheet -->
<link href="css/style.css" rel="stylesheet">
</head>
<body>
<!-- Spinner Start -->
<div id="spinner"
class="show bg-white position-fixed translate-middle w-100 vh-100 top-50 start-50 d-flex align-items-center justify-content-center">
<div class="spinner-border text-primary" style="width: 3rem; height: 3rem;" role="status">
<span class="sr-only">Loading...</span>
</div>
</div>
<!-- Spinner End -->
<!-- Navbar Start -->
<nav class="navbar navbar-expand-lg bg-white navbar-light shadow sticky-top p-0">
<a href="index.html" class="navbar-brand d-flex align-items-center px-4 px-lg-5">
<h2 class="m-0 text-primary"><i class="fa fa-book me-3"></i>PB009 Principles of Computer Graphics</h2>
</a>
<button type="button" class="navbar-toggler me-4" data-bs-toggle="collapse" data-bs-target="#navbarCollapse">
<span class="navbar-toggler-icon"></span>
</button>
<div class="position-relative h-100 " style="min-height: 40px; min-width: 150px; ">
<img class="img-fluid position-absolute w-100 h-100" src="img/eu.png" alt="" style="object-fit: contain;">
</div>
<div class="position-relative h-100 " style="min-height: 40px; min-width: 150px; ">
<img class="img-fluid position-absolute w-100 h-100" src="img/npo.png" alt="" style="object-fit: contain;">
</div>
<div class="position-relative h-100 " style="min-height: 50px; min-width: 100px; ">
<img class="img-fluid position-absolute w-100 h-100" src="img/msmt.png" alt="" style="object-fit: contain;">
</div>
<div class="collapse navbar-collapse" id="navbarCollapse">
<div class="navbar-nav ms-auto p-4 p-lg-0">
<a href="lectures.html" class="nav-item nav-link active">Home</a>
</div>
</div>
</nav>
<!-- Navbar End -->
<!-- About Start -->
<div class="container-xxl py-5">
<div class="container">
<div class="row g-5">
<div class="col-lg-6 wow fadeInUp" data-wow-delay="0.1s" style="min-height: 400px;">
<div class="position-relative h-100">
<img class="img-fluid position-absolute w-100 h-100" src="img/about.jpg" alt=""
style="object-fit: cover;">
</div>
</div>
<div class="col-lg-6 wow fadeInUp" data-wow-delay="0.3s">
<h6 class="section-title bg-white text-start text-primary pe-3">PB009</h6>
<h1 class="mb-4">Principles of Computer Graphics</h1>
<p class="mb-4">This site provides supplementary study materials for the course PB009 Pricliples of
Computer Graphics taughed at Faculty of Informatics, Masaryk University.</p>
<p class="mb-4">The aim of the course is to give the students an overview of the basic algorithms
and methods for rendering and data representations used in computer graphics. The gained
knowledge will enable the students to understand a vast range of computer graphics tasks,
including their mathematical background.
</p>
<div class="row gy-2 gx-4 mb-4">
<div class="col-sm-6">
<p class="mb-0"><i class="fa fa-arrow-right text-primary me-2"></i>
<a href="#l1">1: Introduction</a>
</p>
</div>
<div class="col-sm-6">
<p class="mb-0"><i class="fa fa-arrow-right text-primary me-2"></i>
<a href="#l2">2: Vector vs. Raster</a>
</p>
</div>
<div class="col-sm-6">
<p class="mb-0"><i class="fa fa-arrow-right text-primary me-2"></i>
<a href="#l3">3: Rasterization</a>
</p>
</div>
<div class="col-sm-6">
<p class="mb-0"><i class="fa fa-arrow-right text-primary me-2"></i>Geometry representations
</p>
</div>
<div class="col-sm-6">
<p class="mb-0"><i class="fa fa-arrow-right text-primary me-2"></i>Transformations</p>
</div>
<div class="col-sm-6">
<p class="mb-0"><i class="fa fa-arrow-right text-primary me-2"></i>Visibility & clipping</p>
</div>
<div class="col-sm-6">
<p class="mb-0"><i class="fa fa-arrow-right text-primary me-2"></i>Lighting, textures &
colors</p>
</div>
<div class="col-sm-6">
<p class="mb-0"><i class="fa fa-arrow-right text-primary me-2"></i>Raytracing</p>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- About End -->
<!-- Service Start -->
<div class="text-center wow fadeInUp" data-wow-delay="0.1s">
<h6 class="section-title bg-white text-center text-primary px-3">PB009</h6>
</div>
<div class="container-xxl py-5">
<div class="container">
<h5 id="l1">Lecture 1: Introduction</h5>
<iframe src="https://www.youtube.com/embed/-cpKyS6eqzs?si=Q-t0XMmhmmaUybOU" title="YouTube video player"
frameborder="0"
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>
<br> <br>
<h5 id="l2">Lecture 2: Vector vs. Raster Graphics</h5>
<iframe src="https://www.youtube.com/embed/Qbn4kBvlF9U?si=UcQ8Xv994xwc3T3z" title="YouTube video player"
frameborder="0"
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>
<br> <br>
<h5 id="l3">Lecture 3: Rasterization & Filling</h5>
<iframe src="https://www.youtube.com/embed/hwQE9AdJaC8?si=-8IfNSr0pe3Tg2Vj"
title="YouTube video player" frameborder="0"
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>
</div>
</div>
<!-- Service End -->
<!-- Courses Start
<div class="container-xxl py-5">
<div class="container">
<div class="text-center wow fadeInUp" data-wow-delay="0.1s">
<h6 class="section-title bg-white text-center text-primary px-3">Courses</h6>
<h1 class="mb-5">Popular Courses</h1>
</div>
<div class="row g-4 justify-content-center">
<div class="col-lg-4 col-md-6 wow fadeInUp" data-wow-delay="0.1s">
<div class="course-item bg-light">
<div class="position-relative overflow-hidden">
<img class="img-fluid" src="img/course-1.jpg" alt="">
<div class="w-100 d-flex justify-content-center position-absolute bottom-0 start-0 mb-4">
<a href="#" class="flex-shrink-0 btn btn-sm btn-primary px-3 border-end" style="border-radius: 30px 0 0 30px;">Read More</a>
<a href="#" class="flex-shrink-0 btn btn-sm btn-primary px-3" style="border-radius: 0 30px 30px 0;">Join Now</a>
</div>
</div>
<div class="text-center p-4 pb-0">
<h3 class="mb-0">$149.00</h3>
<div class="mb-3">
<small class="fa fa-star text-primary"></small>
<small class="fa fa-star text-primary"></small>
<small class="fa fa-star text-primary"></small>
<small class="fa fa-star text-primary"></small>
<small class="fa fa-star text-primary"></small>
<small>(123)</small>
</div>
<h5 class="mb-4">Web Design & Development Course for Beginners</h5>
</div>
<div class="d-flex border-top">
<small class="flex-fill text-center border-end py-2"><i class="fa fa-user-tie text-primary me-2"></i>John Doe</small>
<small class="flex-fill text-center border-end py-2"><i class="fa fa-clock text-primary me-2"></i>1.49 Hrs</small>
<small class="flex-fill text-center py-2"><i class="fa fa-user text-primary me-2"></i>30 Students</small>
</div>
</div>
</div>
<div class="col-lg-4 col-md-6 wow fadeInUp" data-wow-delay="0.3s">
<div class="course-item bg-light">
<div class="position-relative overflow-hidden">
<img class="img-fluid" src="img/course-2.jpg" alt="">
<div class="w-100 d-flex justify-content-center position-absolute bottom-0 start-0 mb-4">
<a href="#" class="flex-shrink-0 btn btn-sm btn-primary px-3 border-end" style="border-radius: 30px 0 0 30px;">Read More</a>
<a href="#" class="flex-shrink-0 btn btn-sm btn-primary px-3" style="border-radius: 0 30px 30px 0;">Join Now</a>
</div>
</div>
<div class="text-center p-4 pb-0">
<h3 class="mb-0">$149.00</h3>
<div class="mb-3">
<small class="fa fa-star text-primary"></small>
<small class="fa fa-star text-primary"></small>
<small class="fa fa-star text-primary"></small>
<small class="fa fa-star text-primary"></small>
<small class="fa fa-star text-primary"></small>
<small>(123)</small>
</div>
<h5 class="mb-4">Web Design & Development Course for Beginners</h5>
</div>
<div class="d-flex border-top">
<small class="flex-fill text-center border-end py-2"><i class="fa fa-user-tie text-primary me-2"></i>John Doe</small>
<small class="flex-fill text-center border-end py-2"><i class="fa fa-clock text-primary me-2"></i>1.49 Hrs</small>
<small class="flex-fill text-center py-2"><i class="fa fa-user text-primary me-2"></i>30 Students</small>
</div>
</div>
</div>
<div class="col-lg-4 col-md-6 wow fadeInUp" data-wow-delay="0.5s">
<div class="course-item bg-light">
<div class="position-relative overflow-hidden">
<img class="img-fluid" src="img/course-3.jpg" alt="">
<div class="w-100 d-flex justify-content-center position-absolute bottom-0 start-0 mb-4">
<a href="#" class="flex-shrink-0 btn btn-sm btn-primary px-3 border-end" style="border-radius: 30px 0 0 30px;">Read More</a>
<a href="#" class="flex-shrink-0 btn btn-sm btn-primary px-3" style="border-radius: 0 30px 30px 0;">Join Now</a>
</div>
</div>
<div class="text-center p-4 pb-0">
<h3 class="mb-0">$149.00</h3>
<div class="mb-3">
<small class="fa fa-star text-primary"></small>
<small class="fa fa-star text-primary"></small>
<small class="fa fa-star text-primary"></small>
<small class="fa fa-star text-primary"></small>
<small class="fa fa-star text-primary"></small>
<small>(123)</small>
</div>
<h5 class="mb-4">Web Design & Development Course for Beginners</h5>
</div>
<div class="d-flex border-top">
<small class="flex-fill text-center border-end py-2"><i class="fa fa-user-tie text-primary me-2"></i>John Doe</small>
<small class="flex-fill text-center border-end py-2"><i class="fa fa-clock text-primary me-2"></i>1.49 Hrs</small>
<small class="flex-fill text-center py-2"><i class="fa fa-user text-primary me-2"></i>30 Students</small>
</div>
</div>
</div>
</div>
</div>
</div>
Courses End -->
<!-- Team Start
<div class="container-xxl py-5">
<div class="container">
<div class="text-center wow fadeInUp" data-wow-delay="0.1s">
<h6 class="section-title bg-white text-center text-primary px-3">Instructors</h6>
<h1 class="mb-5">Expert Instructors</h1>
</div>
<div class="row g-4">
<div class="col-lg-3 col-md-6 wow fadeInUp" data-wow-delay="0.1s">
<div class="team-item bg-light">
<div class="overflow-hidden">
<img class="img-fluid" src="img/team-1.jpg" alt="">
</div>
<div class="position-relative d-flex justify-content-center" style="margin-top: -23px;">
<div class="bg-light d-flex justify-content-center pt-2 px-1">
<a class="btn btn-sm-square btn-primary mx-1" href=""><i class="fab fa-facebook-f"></i></a>
<a class="btn btn-sm-square btn-primary mx-1" href=""><i class="fab fa-twitter"></i></a>
<a class="btn btn-sm-square btn-primary mx-1" href=""><i class="fab fa-instagram"></i></a>
</div>
</div>
<div class="text-center p-4">
<h5 class="mb-0">Instructor Name</h5>
<small>Designation</small>
</div>
</div>
</div>
<div class="col-lg-3 col-md-6 wow fadeInUp" data-wow-delay="0.3s">
<div class="team-item bg-light">
<div class="overflow-hidden">
<img class="img-fluid" src="img/team-2.jpg" alt="">
</div>
<div class="position-relative d-flex justify-content-center" style="margin-top: -23px;">
<div class="bg-light d-flex justify-content-center pt-2 px-1">
<a class="btn btn-sm-square btn-primary mx-1" href=""><i class="fab fa-facebook-f"></i></a>
<a class="btn btn-sm-square btn-primary mx-1" href=""><i class="fab fa-twitter"></i></a>
<a class="btn btn-sm-square btn-primary mx-1" href=""><i class="fab fa-instagram"></i></a>
</div>
</div>
<div class="text-center p-4">
<h5 class="mb-0">Instructor Name</h5>
<small>Designation</small>
</div>
</div>
</div>
<div class="col-lg-3 col-md-6 wow fadeInUp" data-wow-delay="0.5s">
<div class="team-item bg-light">
<div class="overflow-hidden">
<img class="img-fluid" src="img/team-3.jpg" alt="">
</div>
<div class="position-relative d-flex justify-content-center" style="margin-top: -23px;">
<div class="bg-light d-flex justify-content-center pt-2 px-1">
<a class="btn btn-sm-square btn-primary mx-1" href=""><i class="fab fa-facebook-f"></i></a>
<a class="btn btn-sm-square btn-primary mx-1" href=""><i class="fab fa-twitter"></i></a>
<a class="btn btn-sm-square btn-primary mx-1" href=""><i class="fab fa-instagram"></i></a>
</div>
</div>
<div class="text-center p-4">
<h5 class="mb-0">Instructor Name</h5>
<small>Designation</small>
</div>
</div>
</div>
<div class="col-lg-3 col-md-6 wow fadeInUp" data-wow-delay="0.7s">
<div class="team-item bg-light">
<div class="overflow-hidden">
<img class="img-fluid" src="img/team-4.jpg" alt="">
</div>
<div class="position-relative d-flex justify-content-center" style="margin-top: -23px;">
<div class="bg-light d-flex justify-content-center pt-2 px-1">
<a class="btn btn-sm-square btn-primary mx-1" href=""><i class="fab fa-facebook-f"></i></a>
<a class="btn btn-sm-square btn-primary mx-1" href=""><i class="fab fa-twitter"></i></a>
<a class="btn btn-sm-square btn-primary mx-1" href=""><i class="fab fa-instagram"></i></a>
</div>
</div>
<div class="text-center p-4">
<h5 class="mb-0">Instructor Name</h5>
<small>Designation</small>
</div>
</div>
</div>
</div>
</div>
</div>
Team End -->
<!-- Testimonial Start
<div class="container-xxl py-5 wow fadeInUp" data-wow-delay="0.1s">
<div class="container">
<div class="text-center">
<h6 class="section-title bg-white text-center text-primary px-3">Testimonial</h6>
<h1 class="mb-5">Our Students Say!</h1>
</div>
<div class="owl-carousel testimonial-carousel position-relative">
<div class="testimonial-item text-center">
<img class="border rounded-circle p-2 mx-auto mb-3" src="img/testimonial-1.jpg" style="width: 80px; height: 80px;">
<h5 class="mb-0">Client Name</h5>
<p>Profession</p>
<div class="testimonial-text bg-light text-center p-4">
<p class="mb-0">Tempor erat elitr rebum at clita. Diam dolor diam ipsum sit diam amet diam et eos. Clita erat ipsum et lorem et sit.</p>
</div>
</div>
<div class="testimonial-item text-center">
<img class="border rounded-circle p-2 mx-auto mb-3" src="img/testimonial-2.jpg" style="width: 80px; height: 80px;">
<h5 class="mb-0">Client Name</h5>
<p>Profession</p>
<div class="testimonial-text bg-light text-center p-4">
<p class="mb-0">Tempor erat elitr rebum at clita. Diam dolor diam ipsum sit diam amet diam et eos. Clita erat ipsum et lorem et sit.</p>
</div>
</div>
<div class="testimonial-item text-center">
<img class="border rounded-circle p-2 mx-auto mb-3" src="img/testimonial-3.jpg" style="width: 80px; height: 80px;">
<h5 class="mb-0">Client Name</h5>
<p>Profession</p>
<div class="testimonial-text bg-light text-center p-4">
<p class="mb-0">Tempor erat elitr rebum at clita. Diam dolor diam ipsum sit diam amet diam et eos. Clita erat ipsum et lorem et sit.</p>
</div>
</div>
<div class="testimonial-item text-center">
<img class="border rounded-circle p-2 mx-auto mb-3" src="img/testimonial-4.jpg" style="width: 80px; height: 80px;">
<h5 class="mb-0">Client Name</h5>
<p>Profession</p>
<div class="testimonial-text bg-light text-center p-4">
<p class="mb-0">Tempor erat elitr rebum at clita. Diam dolor diam ipsum sit diam amet diam et eos. Clita erat ipsum et lorem et sit.</p>
</div>
</div>
</div>
</div>
</div>
Testimonial End -->
<!-- Footer Start -->
<div class="container-fluid bg-dark text-light footer pt-5 mt-5 wow fadeIn" data-wow-delay="0.1s">
<div class="container py-5">
<div class="row">
<div>
<h4 class="text-white mb-3">Contact</h4>
<p class="mb-2"><i class="fa fa-user me-3"></i>RNDr. Katarína Furmanová, Ph.D.</p>
<p class="mb-2"><i class="fa fa-map-marker-alt me-3"></i>A413, Botanick 868a, Brno, Czech Republic
</p>
<p class="mb-2"><i class="fa fa-phone-alt me-3"></i>+420 549 49 5835</p>
<p class="mb-2"><i class="fa fa-envelope me-3"></i>furmanova@mail.muni.cz</p>
<!--<div class="d-flex pt-2">
<a class="btn btn-outline-light btn-social" href=""><i class="fab fa-twitter"></i></a>
<a class="btn btn-outline-light btn-social" href=""><i class="fab fa-facebook-f"></i></a>
<a class="btn btn-outline-light btn-social" href=""><i class="fab fa-youtube"></i></a>
<a class="btn btn-outline-light btn-social" href=""><i class="fab fa-linkedin-in"></i></a>
</div>-->
</div>
<!--
<div class="col-lg-3 col-md-6">
<h4 class="text-white mb-3">Gallery</h4>
<div class="row g-2 pt-2">
<div class="col-4">
<img class="img-fluid bg-light p-1" src="img/course-1.jpg" alt="">
</div>
<div class="col-4">
<img class="img-fluid bg-light p-1" src="img/course-2.jpg" alt="">
</div>
<div class="col-4">
<img class="img-fluid bg-light p-1" src="img/course-3.jpg" alt="">
</div>
<div class="col-4">
<img class="img-fluid bg-light p-1" src="img/course-2.jpg" alt="">
</div>
<div class="col-4">
<img class="img-fluid bg-light p-1" src="img/course-3.jpg" alt="">
</div>
<div class="col-4">
<img class="img-fluid bg-light p-1" src="img/course-1.jpg" alt="">
</div>
</div>
</div>
<div class="col-lg-3 col-md-6">
<h4 class="text-white mb-3">Newsletter</h4>
<p>Dolor amet sit justo amet elitr clita ipsum elitr est.</p>
<div class="position-relative mx-auto" style="max-width: 400px;">
<input class="form-control border-0 w-100 py-3 ps-4 pe-5" type="text" placeholder="Your email">
<button type="button" class="btn btn-primary py-2 position-absolute top-0 end-0 mt-2 me-2">SignUp</button>
</div>
</div>-->
</div>
</div>
<div class="container">
<div class="copyright">
<div class="row">
<div class="col-md-6 text-center text-md-start mb-3 mb-md-0">
&copy; <a class="border-bottom" href="https://fi.muni.cz">Faculty of Informatics, Masaryk
University</a>.
<br><br>
<!--/*** This template is free as long as you keep the footer author’s credit link/attribution link/backlink. If you'd like to use the template without the footer author’s credit link/attribution link/backlink, you can purchase the Credit Removal License from "https://htmlcodex.com/credit-removal". Thank you for your support. ***/-->
Designed By <a class="border-bottom" href="https://htmlcodex.com">HTML Codex.</a>
Distributed By <a class="border-bottom" href="https://themewagon.com">ThemeWagon.</a>
</div>
<div class="col-md-6 text-center text-md-end">
<div class="footer-menu">
<a href="">Home</a>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Footer End -->
<!-- Back to Top -->
<a href="#" class="btn btn-lg btn-primary btn-lg-square back-to-top"><i class="bi bi-arrow-up"></i></a>
<!-- JavaScript Libraries -->
<script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0/dist/js/bootstrap.bundle.min.js"></script>
<script src="lib/wow/wow.min.js"></script>
<script src="lib/easing/easing.min.js"></script>
<script src="lib/waypoints/waypoints.min.js"></script>
<script src="lib/owlcarousel/owl.carousel.min.js"></script>
<!-- Template Javascript -->
<script src="js/main.js"></script>
</body>
</html>
\ No newline at end of file
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