Skip to content

P
Practice 6 sem
Commit 6c76bac0 authored by Третьяк Глеб Игоревич's avatar Третьяк Глеб Игоревич
Browse files
Options

Upload New File

parent 46f7ecf7
Show whitespace changes
Inline Side-by-side
Showing with 177 additions and 0 deletions
Задание 9/nav_tab.html 0 → 100644
View file @ 6c76bac0
<!--
Документация
Аргументы mainTitle и mainText служат для добавления текста в зону над Nav Tab
Аргумент subTitle - для заголовка навтаба
Аргументы iconName1, iconName2, iconName3 служат для добавления нужных иконок в зону текста
В данные аргументы следует добавлять имена иконок, как они названы в теме
title1, title2, title3 - для заголовков навигации; text1, text2, text3 - для текста под заголовками
bigImg1, bigImg2, bigImg3 нужны для картинок, которые отображаются слева
Для этих аргументов задан базовый путь /img/, предполагается, что нужные картинки будут находиться там.
-->
<!DOCTYPE html>
<html lang="ru">
<head>
<!-- Required Meta Tags Always Come First -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<!-- Title -->
<title>Icon Blocks - Snippets | Unify - Multipurpose Responsive Template</title>
<!-- Favicon -->
<link rel="shortcut icon" href="../favicon.ico">
<!-- Font -->
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet">
<!-- CSS Implementing Plugins -->
<link rel="stylesheet" href="/vendor/bootstrap-icons/font/bootstrap-icons.css">
<!-- CSS Unify Template -->
<link rel="stylesheet" href="/css/theme.min.css">
<link rel="stylesheet" href="/css/snippets.min.css">
</head>
<!-- Features -->
<div class="overflow-hidden">
<div class="container content-space-1">
<!-- Heading -->
<div class="w-lg-65 text-center mx-lg-auto mb-5 mb-sm-7 mb-lg-10">
<h2>{{ .Get "mainTitle" }}</h2>
<p>{{ .Get "mainText" }}</p>
</div>
<!-- End Heading -->
<div class="position-relative content-space-1">
<div class="row justify-content-lg-between align-items-md-center">
<div class="col-md-6 col-lg-5 order-md-2 mb-7 mb-md-0">
<div class="mb-5">
<h3>{{ .Get "subTitle" }}</h3>
</div>
<!-- Nav Pills -->
<ul class="nav nav-pills nav-pills-shadow flex-md-column gap-md-1" id="featuresTab" role="tablist">
<li class="nav-item" role="presentation">
<a class="nav-link active" href="#featuresThree" id="featuresOne-tab" data-bs-toggle="tab" data-bs-target="#featuresOne" role="tab" aria-controls="featuresOne" aria-selected="false">
<!-- Media -->
<div class="d-flex">
<i class="bi-{{ .Get "iconName1" }} fs-2 text-success"></i>
<div class="flex-grow-1 ms-4">
<h6 class="text-success mb-1">{{ .Get "title1" }}</h6>
<p class="text-body mb-0">{{ .Get "text1" }}</p>
</div>
</div>
<!-- End Media -->
</a>
</li>
<li class="nav-item" role="presentation">
<a class="nav-link" href="#featuresTwo" id="featuresTwo-tab" data-bs-toggle="tab" data-bs-target="#featuresTwo" role="tab" aria-controls="featuresTwo" aria-selected="true">
<!-- Media -->
<div class="d-flex">
<i class="bi-{{ .Get "iconName2" }} fs-2 text-success"></i>
<div class="flex-grow-1 ms-4">
<h6 class="text-success mb-1">{{ .Get "title2" }}</h6>
<p class="text-body mb-0">{{ .Get "text2" }}</p>
</div>
</div>
<!-- End Media -->
</a>
</li>
<li class="nav-item" role="presentation">
<a class="nav-link" href="#featuresThree" id="featuresThree-tab" data-bs-toggle="tab" data-bs-target="#featuresThree" role="tab" aria-controls="featuresThree" aria-selected="false">
<!-- Media -->
<div class="d-flex">
<i class="bi-{{ .Get "iconName3" }} fs-2 text-success"></i>
<div class="flex-grow-1 ms-4">
<h6 class="text-success mb-1">{{ .Get "title3" }}</h6>
<p class="text-body mb-0">{{ .Get "text3" }}</p>
</div>
</div>
<!-- End Media -->
</a>
</li>
</ul>
<!-- End Nav Pills -->
</div>
<!-- End Col -->
<div class="col-md-6">
<div class="position-relative">
<!-- Tab Content -->
<div class="tab-content" id="featuresTabContent">
<div class="tab-pane fade show active" id="featuresOne" role="tabpanel" aria-labelledby="featuresOne-tab">
<img class="img-fluid shadow rounded-3" src="/img/{{ .Get "bigImg1" }}" alt="Image Description">
</div>
<div class="tab-pane fade" id="featuresTwo" role="tabpanel" aria-labelledby="featuresTwo-tab">
<img class="img-fluid shadow rounded-3" src="/img/{{ .Get "bigImg2" }}" alt="Image Description">
</div>
<div class="tab-pane fade" id="featuresThree" role="tabpanel" aria-labelledby="featuresThree-tab">
<img class="img-fluid shadow rounded-3" src="/img/{{ .Get "bigImg3" }}" alt="Image Description">
</div>
</div>
<!-- End Tab Content -->
<!-- SVG Shape -->
<figure class="position-absolute top-0 end-0 mt-n5 me-n10" style="width: 4rem;">
<img class="img-fluid" src="/svg/components/pointer-up.svg" alt="Image Description">
</figure>
<!-- End SVG Shape -->
</div>
</div>
<!-- End Col -->
</div>
<!-- End Row -->
<div class="position-absolute top-0 end-0 w-100 w-lg-65 h-65 h-md-100 bg-soft-primary rounded-3 zi-n1 me-n5"></div>
</div>
</div>
</div>
<!-- End Features -->
<!-- ========== SECONDARY CONTENTS ========== -->
<!-- Go To -->
<a class="js-go-to go-to position-fixed" href="javascript:;" style="visibility: hidden;"
data-hs-go-to-options='{
"offsetTop": 700,
"position": {
"init": {
"right": "2rem"
},
"show": {
"bottom": "2rem"
},
"hide": {
"bottom": "-2rem"
}
}
}'>
<i class="bi-chevron-up"></i>
</a>
<!-- ========== END SECONDARY CONTENTS ========== -->
<!-- JS Global Compulsory -->
<script src="/vendor/bootstrap/dist/js/bootstrap.bundle.min.js"></script>
<!-- JS Implementing Plugins -->
<script src="/vendor/hs-header/dist/hs-header.min.js"></script>
<script src="/vendor/hs-nav-scroller/dist/hs-nav-scroller.min.js"></script>
<script src="/vendor/list.js/dist/list.min.js"></script>
<script src="/vendor/hs-go-to/dist/hs-go-to.min.js"></script>
<script src="/vendor/prism/prism.js"></script>
<!-- JS Unify -->
<script src="/js/theme.min.js"></script>
</body>
</html>
\ No newline at end of file
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