Merge pull request #5 from fybx/dev
This commit is contained in:
Ferit Yiğit BALABAN
GitHub
@@ -4,8 +4,8 @@
|
||||
<meta charset="UTF-8">
|
||||
<meta content="width=device-width, initial-scale=1" name="viewport"/>
|
||||
<meta name="description" content="Kişisel Verilerin Korunması Kanunu hakkında aydınlatma metni.">
|
||||
<link type="text/css" rel="stylesheet" href="resources/styles/main.css">
|
||||
<title>KVKK Aydınlatma Metni | Uğur Galeri</title>
|
||||
<link type="text/css" rel="stylesheet" href="resources/styles/main.css">
|
||||
<script src="resources/scripts/main.js" defer></script>
|
||||
</head>
|
||||
<body>
|
||||
@@ -31,14 +31,12 @@
|
||||
<a class="nav-item" href="iletisim.html">İletişim</a>
|
||||
</nav>
|
||||
|
||||
<input type="checkbox" id="toggle" class="toggle" onchange="toggleDropdown()">
|
||||
<label for="toggle" id="toggle-label">
|
||||
<div class="dropdown-toggle">
|
||||
<span class="bar bar1"></span>
|
||||
<span class="bar bar2"></span>
|
||||
<span class="bar bar3"></span>
|
||||
<span class="bar bar4"></span>
|
||||
</div>
|
||||
<input type="checkbox" id="toggle" class="toggle" onchange="toggleDropdown()" autocomplete="off">
|
||||
<label for="toggle" id="toggle-label" class="dropdown-toggle">
|
||||
<span class="bar bar1"></span>
|
||||
<span class="bar bar2"></span>
|
||||
<span class="bar bar3"></span>
|
||||
<span class="bar bar4"></span>
|
||||
</label>
|
||||
</header>
|
||||
<nav class="dropdown hidden dropdown-navbar">
|
||||
@@ -697,6 +695,7 @@
|
||||
</a>
|
||||
</section>
|
||||
</main>
|
||||
<button id="scroll-to-top" onclick="scrollToTop()"><img src="resources/img/scroll-to-top.svg" alt="Scroll to top"></button>
|
||||
<footer id="footer" class="content-spacing">
|
||||
<img id="small-logo" src="resources/img/Uğur%20Galeri/footer-white.png" alt="Uğur Galeri U logosu">
|
||||
<div class="footer-columns">
|
||||
|
||||
@@ -2,10 +2,93 @@
|
||||
<html lang="tr">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<link type="text/css" rel="stylesheet" href="styles/main.css">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1"/>
|
||||
<meta name="description" content="TODO">
|
||||
<title>Hakkımızda | Uğur Galeri</title>
|
||||
<link type="text/css" rel="stylesheet" href="resources/styles/main.css">
|
||||
<script src="resources/scripts/main.js" defer></script>
|
||||
</head>
|
||||
<body>
|
||||
<header id="header">
|
||||
<div id="logo" class="bounce-animation">
|
||||
<span style="--i: 1;">U</span>
|
||||
<span style="--i: 2;">Ğ</span>
|
||||
<span style="--i: 3;">U</span>
|
||||
<span style="--i: 4;">R</span>
|
||||
<span style="--i: 4;"> </span>
|
||||
<span style="--i: 5;">G</span>
|
||||
<span style="--i: 6;">A</span>
|
||||
<span style="--i: 7;">L</span>
|
||||
<span style="--i: 8;">E</span>
|
||||
<span style="--i: 9;">R</span>
|
||||
<span style="--i: 10;">İ</span>
|
||||
</div>
|
||||
<nav class="navbar">
|
||||
<a class="nav-item" href="index.html">Ana sayfa</a>
|
||||
<a class="nav-item" href="#">Hakkımızda</a>
|
||||
<a class="nav-item" href="index.html#brands">Markalar</a>
|
||||
<a class="nav-item" href="https://ugurgaleri1.sahibinden.com/">Araçlarımız</a>
|
||||
<a class="nav-item" href="iletisim.html">İletişim</a>
|
||||
</nav>
|
||||
|
||||
<input type="checkbox" id="toggle" class="toggle" onchange="toggleDropdown()" autocomplete="off">
|
||||
<label for="toggle" id="toggle-label" class="dropdown-toggle">
|
||||
<span class="bar bar1"></span>
|
||||
<span class="bar bar2"></span>
|
||||
<span class="bar bar3"></span>
|
||||
<span class="bar bar4"></span>
|
||||
</label>
|
||||
</header>
|
||||
<nav class="dropdown hidden dropdown-navbar">
|
||||
<a class="dropdown-nav-item hidden" href="index.html">Ana sayfa</a>
|
||||
<a class="dropdown-nav-item hidden" href="#">Hakkımızda</a>
|
||||
<a class="dropdown-nav-item hidden" href="index.html#brands">Markalar</a>
|
||||
<a class="dropdown-nav-item hidden" href="https://ugurgaleri1.sahibinden.com/">Araçlarımız</a>
|
||||
<a class="dropdown-nav-item hidden" href="iletisim.html">İletişim</a>
|
||||
</nav>
|
||||
<div id="container">
|
||||
<main id="content">
|
||||
<section id="video" class="content-spacing">
|
||||
<h1>Tanıtım Videomuzu izleyin:</h1>
|
||||
<video src="../../Downloads/LC1_EoLA/Abstract%20vector%20spaces%20-%20Chapter%2016.mp4" controls>Tarayıcınız burada video gösterilmesine izin vermiyor.</video>
|
||||
</section>
|
||||
<section id="hikaye" class="content-spacing">
|
||||
<h1>Kuruluş Hikâyemiz</h1>
|
||||
</section>
|
||||
<section id="misyon" class="content-spacing"></section>
|
||||
<section id="vizyon" class="content-spacing"></section>
|
||||
<section id="yonetim" class="content-spacing"></section>
|
||||
</main>
|
||||
<button id="scroll-to-top" onclick="scrollToTop()"><img src="resources/img/scroll-to-top.svg" alt="Scroll to top"></button>
|
||||
<footer id="footer" class="content-spacing">
|
||||
<img id="small-logo" src="resources/img/Uğur%20Galeri/footer-white.png" alt="Uğur Galeri U logosu">
|
||||
<div class="footer-columns">
|
||||
<div class="footer-column">
|
||||
<h1>Uğur Galeri</h1>
|
||||
<ul>
|
||||
<li><a href="index.html">Ana sayfa</a></li>
|
||||
<li><a href="#">Hakkımızda</a></li>
|
||||
<li><a href="index.html#brands">Markalarımız</a></li>
|
||||
<li><a href="https://ugurgaleri1.sahibinden.com">Araçlarımız</a></li>
|
||||
<li><a href="iletisim.html">İletişim</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="footer-column">
|
||||
<h1>Kurumsal</h1>
|
||||
<ul>
|
||||
<li><a href="#misyon">Misyonumuz</a></li>
|
||||
<li><a href="#vizyon">Vizyonumuz</a></li>
|
||||
<li><a href="#yonetim">Yönetim</a></li>
|
||||
<li><a href="aydinlatma.html">KVKK Aydınlatma Metni</a></li>
|
||||
<li><a href="kamera.html">Kamera Kullanımı</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
<footer id="footer-stateless" class="content-spacing ignore-vertical">
|
||||
<p>© Uğur Galeri 2022</p>
|
||||
<p class="smaller">Dizayn & Uygulama: <a href="https://fybx.dev">fybx.dev</a></p>
|
||||
</footer>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
@@ -2,8 +2,11 @@
|
||||
<html lang="tr">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<link type="text/css" rel="stylesheet" href="resources/styles/main.css">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1"/>
|
||||
<meta name="description" content="TODO">
|
||||
<title>İletişim | Uğur Galeri</title>
|
||||
<link type="text/css" rel="stylesheet" href="resources/styles/main.css">
|
||||
<script src="resources/scripts/main.js" defer></script>
|
||||
</head>
|
||||
<body>
|
||||
<header id="header">
|
||||
@@ -28,14 +31,12 @@
|
||||
<a class="nav-item" href="#">İletişim</a>
|
||||
</nav>
|
||||
|
||||
<input type="checkbox" id="toggle" class="toggle" onchange="toggleDropdown()">
|
||||
<label for="toggle" id="toggle-label">
|
||||
<div class="dropdown-toggle">
|
||||
<span class="bar bar1"></span>
|
||||
<span class="bar bar2"></span>
|
||||
<span class="bar bar3"></span>
|
||||
<span class="bar bar4"></span>
|
||||
</div>
|
||||
<input type="checkbox" id="toggle" class="toggle" onchange="toggleDropdown()" autocomplete="off">
|
||||
<label for="toggle" id="toggle-label" class="dropdown-toggle">
|
||||
<span class="bar bar1"></span>
|
||||
<span class="bar bar2"></span>
|
||||
<span class="bar bar3"></span>
|
||||
<span class="bar bar4"></span>
|
||||
</label>
|
||||
</header>
|
||||
<nav class="dropdown hidden dropdown-navbar">
|
||||
@@ -86,6 +87,7 @@
|
||||
</article>
|
||||
</section>
|
||||
</main>
|
||||
<button id="scroll-to-top" onclick="scrollToTop()"><img src="resources/img/scroll-to-top.svg" alt="Scroll to top"></button>
|
||||
<footer id="footer" class="content-spacing">
|
||||
<img id="small-logo" src="resources/img/Uğur%20Galeri/footer-white.png" alt="Uğur Galeri U logosu">
|
||||
<div class="footer-columns">
|
||||
|
||||
31
index.html
31
index.html
@@ -2,12 +2,12 @@
|
||||
<html lang="tr">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta content="width=device-width, initial-scale=1" name="viewport" />
|
||||
<meta name="description" content="Uğur Galeri">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1"/>
|
||||
<meta name="description" content="Uğur Galeri ve Uğur Koçak Treyler'in websitesine hoş geldiniz!">
|
||||
<title>Ana sayfa | Uğur Galeri</title>
|
||||
<link type="text/css" rel="stylesheet" href="resources/styles/main.css">
|
||||
<script src="resources/scripts/main.js" defer></script>
|
||||
<script src="resources/scripts/index.js" defer></script>
|
||||
<link type="text/css" rel="stylesheet" href="resources/styles/main.css">
|
||||
<title>Uğur Galeri</title>
|
||||
</head>
|
||||
<body>
|
||||
<header id="header">
|
||||
@@ -32,14 +32,12 @@
|
||||
<a class="nav-item" href="iletisim.html">İletişim</a>
|
||||
</nav>
|
||||
|
||||
<input type="checkbox" id="toggle" class="toggle" onchange="toggleDropdown()">
|
||||
<label for="toggle" id="toggle-label">
|
||||
<div class="dropdown-toggle">
|
||||
<span class="bar bar1"></span>
|
||||
<span class="bar bar2"></span>
|
||||
<span class="bar bar3"></span>
|
||||
<span class="bar bar4"></span>
|
||||
</div>
|
||||
<input type="checkbox" id="toggle" class="toggle" onchange="toggleDropdown()" autocomplete="off">
|
||||
<label for="toggle" id="toggle-label" class="dropdown-toggle">
|
||||
<span class="bar bar1"></span>
|
||||
<span class="bar bar2"></span>
|
||||
<span class="bar bar3"></span>
|
||||
<span class="bar bar4"></span>
|
||||
</label>
|
||||
</header>
|
||||
<nav class="dropdown hidden dropdown-navbar">
|
||||
@@ -56,19 +54,19 @@
|
||||
</div>
|
||||
<div id="brands" class="table content-spacing">
|
||||
<div class="table-item square">
|
||||
<img src="resources/img/ugurgaleri-utek.png">
|
||||
<img src="resources/img/ugurgaleri-utek.png" alt="Uğur Galeri U logosu">
|
||||
<div class="vertical-separator"></div>
|
||||
<div class="horizontal-separator"></div>
|
||||
<p>Şirketimiz 4 Nisan 2001 tarihinde Karacabey, Bursa'da ikinci el ticari araç ve ağır vasıta satışına başlamıştır. Köklü galericilik deneyimini, satış politikalarını ve zamana ayak uyduran yenilikçi bakış açısını bünyesinde harmanlayan, sektöre yön veren ve yapmış olduğu işler ile sektördeki varlığını kanıtlamış bir firmadır. <a href="iletisim.html#information">Satın alma için tıklayınız.</a></p>
|
||||
</div>
|
||||
<div class="table-item reverse">
|
||||
<img src="resources/img/UKT/UKT.png">
|
||||
<img src="resources/img/UKT/UKT.png" alt="Uğur Koçak Treyler logosu">
|
||||
<div class="vertical-separator"></div>
|
||||
<div class="horizontal-separator"></div>
|
||||
<p>Uğur Koçak Treyler, müşteri gereksinimlerine istinaden 21 Eylül 2012 tarihinde <b>sıfır araç</b> satışı yapmak için kurulmuştur. Firma Uğur Galeri yerleşkesi içerisinde distribütörlük/bayilik anlaşması yapmış olduğu ağır vasıta sektörünün treyler grubunda öncü firmalar ile çalışmakta olup müşterilerin ihtiyaçlarına en hızlı, en doğru ve en kullanışlı biçimde cevap verebilecek niteliktedir.<br>Satış yelpazesinde <!--TODO--><b><i>Krone, Makinsan ve Otokar</i></b> firmaları yer almaktadır. <a href="iletisim.html#information">Satın alma için tıklayınız.</a></p>
|
||||
<p>Uğur Koçak Treyler, müşteri gereksinimlerine istinaden 21 Eylül 2012 tarihinde <b>sıfır araç</b> satışı yapmak için kurulmuştur. Firma Uğur Galeri yerleşkesi içerisinde distribütörlük/bayilik anlaşması yapmış olduğu ağır vasıta sektörünün treyler grubunda öncü firmalar ile çalışmakta olup müşterilerin ihtiyaçlarına en hızlı, en doğru ve en kullanışlı biçimde cevap verebilecek niteliktedir.<br>Satış yelpazesinde <b><i>Krone, Makinsan ve Otokar</i></b> firmaları yer almaktadır. <a href="iletisim.html#information">Satın alma için tıklayınız.</a></p>
|
||||
</div>
|
||||
<div class="table-item">
|
||||
<img src="resources/img/galericilerden.com/galericilerden.jpg">
|
||||
<img src="resources/img/galericilerden.com/galericilerden.jpg" alt="galericilerden.com logosu">
|
||||
<div class="vertical-separator"></div>
|
||||
<div class="horizontal-separator"></div>
|
||||
<p>2018 yılında interaktif satışın müşterilerin talepleri doğrultusunda mevcut ürünlerin tanıtımı ve pazarlanması amacıyla Uğur Galeri bünyesinde e-ticaret alışveriş sitesi olarak kurulmuştur. Hedefimiz, galeri sahiplerinin güvenilir bir platformda araçlarını detaylı biçimde sunabilmeleri; müşterilerin de ihtiyaçlarına göre güvenilir ve uygun şekilde ulaşmalarını sağlamaktır.</p>
|
||||
@@ -83,6 +81,7 @@
|
||||
</nav>
|
||||
</div>
|
||||
</main>
|
||||
<button id="scroll-to-top" onclick="scrollToTop()"><img src="resources/img/scroll-to-top.svg" alt="Scroll to top"></button>
|
||||
<footer id="footer" class="content-spacing">
|
||||
<img id="small-logo" src="resources/img/Uğur%20Galeri/footer-white.png" alt="Uğur Galeri U logosu">
|
||||
<div class="footer-columns">
|
||||
|
||||
24
kamera.html
24
kamera.html
@@ -2,10 +2,11 @@
|
||||
<html lang="tr">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta content="width=device-width, initial-scale=1" name="viewport"/>
|
||||
<meta name="description" content="Uğur Galeri">
|
||||
<link type="text/css" rel="stylesheet" href="resources/styles/main.css">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1"/>
|
||||
<meta name="description" content="TODO">
|
||||
<title>Kamera Kullanımı Aydınlatma Metni | Uğur Galeri</title>
|
||||
<link type="text/css" rel="stylesheet" href="resources/styles/main.css">
|
||||
<script src="resources/scripts/main.js" defer></script>
|
||||
</head>
|
||||
<body>
|
||||
<header id="header">
|
||||
@@ -29,14 +30,12 @@
|
||||
<a class="nav-item" href="https://ugurgaleri1.sahibinden.com/">Araçlarımız</a>
|
||||
<a class="nav-item" href="iletisim.html">İletişim</a>
|
||||
</nav>
|
||||
<input type="checkbox" id="toggle" class="toggle" onchange="toggleDropdown()">
|
||||
<label for="toggle" id="toggle-label">
|
||||
<div class="dropdown-toggle">
|
||||
<input type="checkbox" id="toggle" class="toggle" onchange="toggleDropdown()" autocomplete="off">
|
||||
<label for="toggle" id="toggle-label" class="dropdown-toggle">
|
||||
<span class="bar bar1"></span>
|
||||
<span class="bar bar2"></span>
|
||||
<span class="bar bar3"></span>
|
||||
<span class="bar bar4"></span>
|
||||
</div>
|
||||
</label>
|
||||
</header>
|
||||
<nav class="dropdown hidden dropdown-navbar">
|
||||
@@ -47,8 +46,8 @@
|
||||
<a class="dropdown-nav-item hidden" href="iletisim.html">İletişim</a>
|
||||
</nav>
|
||||
<div id="container">
|
||||
<main id="content" class="content-spacing">
|
||||
<article>
|
||||
<main id="content">
|
||||
<article class="content-spacing">
|
||||
<h1>UĞUR KOÇAK TREYLER, MOTORLU ARAÇLAR ALIM SATIMI VE KOMİSYONCULUĞU, NAKLİYE TİCARET VE SANAYİ LİMİTED
|
||||
ŞİRKETİNDE KAPALI DEVRE KAMERA KAYIT SİSTEMLERİ AYDINLATMA METNİ</h1>
|
||||
|
||||
@@ -108,10 +107,13 @@
|
||||
KOMİSYONCULUĞU, NAKLİYE TİCARET VE SANAYİ LİMİTED ŞİRKETİ Kişisel Verilerin Korunması ve İşlenmesi
|
||||
Politikası’nda belirtilen yöntemlerle iletilmesi halinde 30 (otuz) gün içerisinde değerlendirilerek
|
||||
sonuçlandırılacaktır.</p>
|
||||
|
||||
|
||||
</article>
|
||||
<section class="sec-links-to-documents content-spacing">
|
||||
<h1>KVKK Aydınlatma Metnini okumak için <a href="aydinlatma.html">tıklayınız</a>.</h1>
|
||||
<h1>Diğer belgelere ulaşmak için <a href="aydinlatma.html#belgeler">tıklayınız</a>.</h1>
|
||||
</section>
|
||||
</main>
|
||||
<button id="scroll-to-top" onclick="scrollToTop()"><img src="resources/img/scroll-to-top.svg" alt="Scroll to top"></button>
|
||||
<footer id="footer" class="content-spacing">
|
||||
<img id="small-logo" src="resources/img/Uğur%20Galeri/footer-white.png" alt="Uğur Galeri U logosu">
|
||||
<div class="footer-columns">
|
||||
|
||||
@@ -3,10 +3,14 @@
|
||||
@use "views/index.scss";
|
||||
@use "views/aydinlatma.scss";
|
||||
@use "views/iletisim.scss";
|
||||
@use "views/hakkimizda.scss";
|
||||
@use "views/kamera.scss";
|
||||
@use "partials/header.scss";
|
||||
@use "partials/footer.scss";
|
||||
@use "sass:math";
|
||||
|
||||
$px_scroll-to-top_size: 50px;
|
||||
|
||||
html, body {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
@@ -55,18 +59,21 @@ html, body {
|
||||
}
|
||||
|
||||
#header {
|
||||
position: sticky;
|
||||
top: 0;
|
||||
z-index: 99;
|
||||
// Layout, details and children is set in partials/header.scss
|
||||
height: 10vh;
|
||||
|
||||
@include mixins.header_overflow2 {
|
||||
height: 5vh;
|
||||
height: 45px;
|
||||
}
|
||||
}
|
||||
|
||||
.dropdown {
|
||||
position: fixed;
|
||||
z-index: 2;
|
||||
background: linear-gradient(to left bottom, variables.$clr_brand, #003e86);
|
||||
background: variables.$cg_drawer;
|
||||
width: 100%;
|
||||
height: 90vh;
|
||||
-webkit-animation: drawer-open 550ms;
|
||||
@@ -77,9 +84,11 @@ html, body {
|
||||
.dropdown-nav-item {
|
||||
position: relative;
|
||||
margin-top: math.div(variables.$px_horizontalPadding, 4);
|
||||
background: -webkit-linear-gradient(#FFFFFF, #adf0ff);
|
||||
background: variables.$cg_drawer_navitem;
|
||||
-webkit-background-clip: text;
|
||||
-webkit-text-fill-color: transparent;
|
||||
//noinspection CssInvalidPropertyValue
|
||||
background-clip: text;
|
||||
color: transparent;
|
||||
font: 600 28px "Montserrat", sans-serif;
|
||||
text-decoration: none;
|
||||
-webkit-animation: navbar-appear 550ms;
|
||||
@@ -109,7 +118,7 @@ html, body {
|
||||
}
|
||||
|
||||
@include mixins.header_overflow2 {
|
||||
height: 95vh;
|
||||
height: calc(100vh - 45px);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -224,7 +233,7 @@ html, body {
|
||||
}
|
||||
|
||||
#container {
|
||||
height: 90vh;
|
||||
min-height: 90vh;
|
||||
display: grid;
|
||||
grid-template-rows: 1fr auto;
|
||||
grid-template-columns: 1fr;
|
||||
@@ -232,7 +241,7 @@ html, body {
|
||||
overflow: auto;
|
||||
|
||||
@include mixins.header_overflow2 {
|
||||
height: 95vh;
|
||||
min-height: calc(100vh - 45px);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -243,6 +252,39 @@ html, body {
|
||||
overflow-wrap: break-word;
|
||||
}
|
||||
|
||||
#scroll-to-top {
|
||||
width: $px_scroll-to-top_size;
|
||||
height: $px_scroll-to-top_size;
|
||||
display: none;
|
||||
position: fixed;
|
||||
right: 25px;
|
||||
bottom: 55px;
|
||||
z-index: 99;
|
||||
cursor: pointer;
|
||||
border: none;
|
||||
border-radius: 50%;
|
||||
background-color: variables.$clr_brand;
|
||||
|
||||
img {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
filter: invert(100%);
|
||||
}
|
||||
|
||||
&:hover {
|
||||
width: $px_scroll-to-top_size + 10;
|
||||
height: $px_scroll-to-top_size + 10;
|
||||
right: 20px;
|
||||
bottom: 50px;
|
||||
transition: 250ms cubic-bezier(0.51, 1.27, 0.18, 0.96);
|
||||
|
||||
img {
|
||||
transform: translateY(-5px);
|
||||
transition: 250ms cubic-bezier(0.51, 1.27, 0.18, 0.96);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#footer {
|
||||
grid-column: 1;
|
||||
grid-row: 2;
|
||||
|
||||
@@ -1,4 +1,5 @@
|
||||
@use "variables.scss";
|
||||
@use "overflow";
|
||||
|
||||
@mixin footer_overflow {
|
||||
@media screen and (max-width: variables.$footer_overflow) {
|
||||
@@ -24,6 +25,12 @@
|
||||
}
|
||||
}
|
||||
|
||||
@mixin header_overflow3 {
|
||||
@media screen and (max-width: variables.$header_overflow3) {
|
||||
@content;
|
||||
}
|
||||
}
|
||||
|
||||
@mixin mx_index_brands_fix {
|
||||
@media screen and (max-width: variables.$index_brands_fix) {
|
||||
@content;
|
||||
@@ -52,4 +59,16 @@
|
||||
@media screen and (max-width: variables.$aydinlatma_documents_fix2) {
|
||||
@content;
|
||||
}
|
||||
}
|
||||
|
||||
@mixin mx_kamera_sec-links-to-documents {
|
||||
@media screen and (max-width: overflow.$kamera_sec_links-to-documents) {
|
||||
@content;
|
||||
}
|
||||
}
|
||||
|
||||
@mixin mx_kamera_sec-links-to-documents2 {
|
||||
@media screen and (max-width: overflow.$kamera_sec_links-to-documents2) {
|
||||
@content;
|
||||
}
|
||||
}
|
||||
2
resources/css/overflow.scss
Normal file
2
resources/css/overflow.scss
Normal file
@@ -0,0 +1,2 @@
|
||||
$kamera_sec_links-to-documents: 1215px;
|
||||
$kamera_sec_links-to-documents2: 610px;
|
||||
@@ -27,6 +27,10 @@ $dropdown-toggle_s_second_bar: math.div($dropdown-toggle_s_width - 4, 2);
|
||||
padding: 0 variables.$px_headerPadding2;
|
||||
}
|
||||
|
||||
@include mixins.header_overflow3 {
|
||||
padding: 0 25px;
|
||||
}
|
||||
|
||||
#logo {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
@@ -89,7 +93,7 @@ $dropdown-toggle_s_second_bar: math.div($dropdown-toggle_s_width - 4, 2);
|
||||
}
|
||||
|
||||
.dropdown-toggle {
|
||||
margin: 0 auto 0;
|
||||
margin: 0;
|
||||
width: $dropdown-toggle_l_width;
|
||||
height: $dropdown-toggle_l_width;
|
||||
position: relative;
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
$header_overflow: 1200px;
|
||||
$header_overflow2: 850px;
|
||||
$header_overflow3: 360px;
|
||||
$index_brands_fix: 1100px;
|
||||
$index_brands_fix2: 850px;
|
||||
$footer_overflow: 1200px;
|
||||
@@ -23,6 +24,9 @@ $sz_s_footer_p: 8px;
|
||||
$clr_dark: #01003B;
|
||||
$clr_brand: #1d60b5;
|
||||
$clr_brand_gradient: linear-gradient(to left, $clr_brand, #3b8fff);
|
||||
$cg_drawer: linear-gradient(to left bottom, $clr_brand, #003e86);
|
||||
$cg_drawer_navitem: linear-gradient(#FFFFFF, #adf0ff);
|
||||
$cg_drawer_navitem2: linear-gradient(to top, #FFFFFF, #adf0ff);
|
||||
|
||||
$clr_logo: #FDFFFF;
|
||||
$clr_header: #FDFFFF;
|
||||
|
||||
32
resources/css/views/hakkimizda.scss
Normal file
32
resources/css/views/hakkimizda.scss
Normal file
@@ -0,0 +1,32 @@
|
||||
@use "../variables.scss";
|
||||
@use "../mixins.scss";
|
||||
|
||||
#video {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
background: variables.$clr_brand_gradient;
|
||||
|
||||
video {
|
||||
width: 100% !important;
|
||||
height: auto !important;
|
||||
}
|
||||
|
||||
h1 {
|
||||
margin: 0 0 1em 0;
|
||||
font: 600 2.5vw "Montserrat", sans-serif;
|
||||
color: white;
|
||||
}
|
||||
}
|
||||
|
||||
#hikaye {
|
||||
|
||||
}
|
||||
|
||||
#misyon, #vizyon {
|
||||
|
||||
}
|
||||
|
||||
#yonetim {
|
||||
|
||||
}
|
||||
@@ -70,7 +70,7 @@ $social-button_inner_margin: 10px;
|
||||
}
|
||||
|
||||
@include mixins.mx_index_brands_fix2 {
|
||||
margin-right: math.div(variables.$px_horizontalPadding2, 10);
|
||||
margin-right: math.div(variables.$px_horizontalPadding3, 10);
|
||||
width: $table-item_img_width_s;
|
||||
}
|
||||
|
||||
@@ -80,6 +80,37 @@ $social-button_inner_margin: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
.vertical-separator {
|
||||
// vertical-separator makes an empty div behave as a separator which aligned vertically
|
||||
height: $table-item_img_width + 20px;
|
||||
border: solid 1px variables.$clr_brand;
|
||||
margin-right: 9 * math.div(variables.$px_horizontalPadding, 10);
|
||||
|
||||
@include mixins.mx_index_brands_fix {
|
||||
margin-right: 9 * math.div(variables.$px_horizontalPadding2, 10);
|
||||
}
|
||||
|
||||
@include mixins.mx_index_brands_fix2 {
|
||||
margin-right: 9 * math.div(variables.$px_horizontalPadding3, 10);
|
||||
}
|
||||
|
||||
@include mixins.mx_mobile {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.horizontal-separator {
|
||||
// horizontal-separator makes an empty div behave as a separator which aligned horizontally
|
||||
display: none;
|
||||
width: $table-item_img_width + 20px;
|
||||
border: solid 1px variables.$clr_brand;
|
||||
margin: 0 0 18px 0;
|
||||
|
||||
@include mixins.mx_mobile {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
&:first-of-type {
|
||||
margin-top: 0;
|
||||
}
|
||||
@@ -89,40 +120,9 @@ $social-button_inner_margin: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
.vertical-separator {
|
||||
// vertical-separator makes an empty div behave as a separator which aligned vertically
|
||||
height: $table-item_img_width + 20px;
|
||||
border: solid 1px variables.$clr_brand;
|
||||
margin-right: 9 * math.div(variables.$px_horizontalPadding, 10);
|
||||
|
||||
@include mixins.mx_index_brands_fix {
|
||||
margin-right: 9 * math.div(variables.$px_horizontalPadding2, 10);
|
||||
}
|
||||
|
||||
@include mixins.mx_index_brands_fix2 {
|
||||
margin-right: 9 * math.div(variables.$px_horizontalPadding3, 10);
|
||||
}
|
||||
|
||||
@include mixins.mx_mobile {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.horizontal-separator {
|
||||
// horizontal-separator makes an empty div behave as a separator which aligned horizontally
|
||||
display: none;
|
||||
width: $table-item_img_width + 20px;
|
||||
border: solid 1px variables.$clr_brand;
|
||||
margin: 0 0 18px 0;
|
||||
|
||||
@include mixins.mx_mobile {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
.reverse {
|
||||
// reverse is a property given to .table-item elements
|
||||
// it contains styling for img, p and .vertical-separator elements contained under
|
||||
// it contains styling for img and .vertical-separator elements contained under
|
||||
// a .table-item element
|
||||
flex-direction: row-reverse;
|
||||
|
||||
@@ -154,6 +154,11 @@ $social-button_inner_margin: 10px;
|
||||
|
||||
@include mixins.mx_mobile {
|
||||
flex-direction: column;
|
||||
|
||||
img {
|
||||
margin: 0 0 2px 0;
|
||||
width: $table-item_img_width;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
54
resources/css/views/kamera.scss
Normal file
54
resources/css/views/kamera.scss
Normal file
@@ -0,0 +1,54 @@
|
||||
@use "../variables";
|
||||
@use "../mixins";
|
||||
|
||||
.sec-links-to-documents {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
background: variables.$clr_brand_gradient;
|
||||
|
||||
h1 {
|
||||
font: 500 32px "Montserrat", sans-serif;
|
||||
|
||||
a {
|
||||
background: variables.$cg_drawer_navitem;
|
||||
-webkit-background-clip: text;
|
||||
//noinspection CssInvalidPropertyValue
|
||||
background-clip: text;
|
||||
color: transparent;
|
||||
font: 700 33px "Montserrat", sans-serif;
|
||||
|
||||
&:hover {
|
||||
color: black;
|
||||
}
|
||||
|
||||
&:active {
|
||||
background: variables.$cg_drawer_navitem2;
|
||||
-webkit-background-clip: text;
|
||||
//noinspection CssInvalidPropertyValue
|
||||
background-clip: text;
|
||||
color: transparent;
|
||||
}
|
||||
}
|
||||
|
||||
&:first-of-type {
|
||||
margin: 0 0 2.5vh 0;
|
||||
}
|
||||
|
||||
@include mixins.mx_kamera_sec-links-to-documents {
|
||||
font-size: 22px;
|
||||
|
||||
a {
|
||||
font-size: 23px;
|
||||
}
|
||||
}
|
||||
|
||||
@include mixins.mx_kamera_sec-links-to-documents2 {
|
||||
font-size: 12px;
|
||||
|
||||
a {
|
||||
font-size: 13px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
1
resources/img/scroll-to-top.svg
Normal file
1
resources/img/scroll-to-top.svg
Normal file
@@ -0,0 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-arrow-up"><line x1="12" y1="19" x2="12" y2="5"></line><polyline points="5 12 12 5 19 12"></polyline></svg>
|
||||
|
After Width: | Height: | Size: 289 B |
@@ -1,3 +1,18 @@
|
||||
scroll_to_top = document.getElementById("scroll-to-top");
|
||||
|
||||
window.onscroll = function () {
|
||||
if (document.documentElement.scrollTop > 100 || document.body.scrollTop > 100) {
|
||||
scroll_to_top.style.display = "block";
|
||||
} else {
|
||||
scroll_to_top.style.display = "none";
|
||||
}
|
||||
}
|
||||
|
||||
function scrollToTop() {
|
||||
document.documentElement.scrollTop = 0;
|
||||
document.body.scrollTop = 0;
|
||||
}
|
||||
|
||||
async function sleep(milliseconds) {
|
||||
return new Promise(resolve => setTimeout(resolve, milliseconds));
|
||||
}
|
||||
|
||||
@@ -63,7 +63,7 @@
|
||||
}
|
||||
@media screen and (max-width: 850px) {
|
||||
.table .table-item img {
|
||||
margin-right: 10px;
|
||||
margin-right: 2px;
|
||||
width: 60px;
|
||||
}
|
||||
}
|
||||
@@ -73,45 +73,45 @@
|
||||
width: 100px;
|
||||
}
|
||||
}
|
||||
.table .table-item:first-of-type {
|
||||
margin-top: 0;
|
||||
}
|
||||
@media screen and (max-width: 400px) {
|
||||
.table .table-item {
|
||||
flex-direction: column;
|
||||
}
|
||||
}
|
||||
.table .vertical-separator {
|
||||
.table .table-item .vertical-separator {
|
||||
height: 120px;
|
||||
border: solid 1px #1d60b5;
|
||||
margin-right: 180px;
|
||||
}
|
||||
@media screen and (max-width: 1100px) {
|
||||
.table .vertical-separator {
|
||||
.table .table-item .vertical-separator {
|
||||
margin-right: 90px;
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 850px) {
|
||||
.table .vertical-separator {
|
||||
.table .table-item .vertical-separator {
|
||||
margin-right: 18px;
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 400px) {
|
||||
.table .vertical-separator {
|
||||
.table .table-item .vertical-separator {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
.table .horizontal-separator {
|
||||
.table .table-item .horizontal-separator {
|
||||
display: none;
|
||||
width: 120px;
|
||||
border: solid 1px #1d60b5;
|
||||
margin: 0 0 18px 0;
|
||||
}
|
||||
@media screen and (max-width: 400px) {
|
||||
.table .horizontal-separator {
|
||||
.table .table-item .horizontal-separator {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
.table .table-item:first-of-type {
|
||||
margin-top: 0;
|
||||
}
|
||||
@media screen and (max-width: 400px) {
|
||||
.table .table-item {
|
||||
flex-direction: column;
|
||||
}
|
||||
}
|
||||
.table .reverse {
|
||||
flex-direction: row-reverse;
|
||||
}
|
||||
@@ -147,6 +147,10 @@
|
||||
.table .reverse {
|
||||
flex-direction: column;
|
||||
}
|
||||
.table .reverse img {
|
||||
margin: 0 0 2px 0;
|
||||
width: 100px;
|
||||
}
|
||||
}
|
||||
.table .square img {
|
||||
height: 150px;
|
||||
@@ -377,6 +381,67 @@ a:hover {
|
||||
border: solid 1px black;
|
||||
}
|
||||
|
||||
#video {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
background: linear-gradient(to left, #1d60b5, #3b8fff);
|
||||
}
|
||||
#video video {
|
||||
width: 100% !important;
|
||||
height: auto !important;
|
||||
}
|
||||
#video h1 {
|
||||
margin: 0 0 1em 0;
|
||||
font: 600 2.5vw "Montserrat", sans-serif;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.sec-links-to-documents {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
background: linear-gradient(to left, #1d60b5, #3b8fff);
|
||||
}
|
||||
.sec-links-to-documents h1 {
|
||||
font: 500 32px "Montserrat", sans-serif;
|
||||
}
|
||||
.sec-links-to-documents h1 a {
|
||||
background: linear-gradient(#FFFFFF, #adf0ff);
|
||||
-webkit-background-clip: text;
|
||||
background-clip: text;
|
||||
color: transparent;
|
||||
font: 700 33px "Montserrat", sans-serif;
|
||||
}
|
||||
.sec-links-to-documents h1 a:hover {
|
||||
color: black;
|
||||
}
|
||||
.sec-links-to-documents h1 a:active {
|
||||
background: linear-gradient(to top, #FFFFFF, #adf0ff);
|
||||
-webkit-background-clip: text;
|
||||
background-clip: text;
|
||||
color: transparent;
|
||||
}
|
||||
.sec-links-to-documents h1:first-of-type {
|
||||
margin: 0 0 2.5vh 0;
|
||||
}
|
||||
@media screen and (max-width: 1215px) {
|
||||
.sec-links-to-documents h1 {
|
||||
font-size: 22px;
|
||||
}
|
||||
.sec-links-to-documents h1 a {
|
||||
font-size: 23px;
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 610px) {
|
||||
.sec-links-to-documents h1 {
|
||||
font-size: 12px;
|
||||
}
|
||||
.sec-links-to-documents h1 a {
|
||||
font-size: 13px;
|
||||
}
|
||||
}
|
||||
|
||||
#header {
|
||||
background: #FDFFFF;
|
||||
padding: 0 150px;
|
||||
@@ -391,6 +456,11 @@ a:hover {
|
||||
padding: 0 50px;
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 360px) {
|
||||
#header {
|
||||
padding: 0 25px;
|
||||
}
|
||||
}
|
||||
#header #logo {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
@@ -446,7 +516,7 @@ a:hover {
|
||||
display: none;
|
||||
}
|
||||
#header .dropdown-toggle {
|
||||
margin: 0 auto 0;
|
||||
margin: 0;
|
||||
width: 36px;
|
||||
height: 36px;
|
||||
position: relative;
|
||||
@@ -665,11 +735,14 @@ html, body {
|
||||
}
|
||||
|
||||
#header {
|
||||
position: sticky;
|
||||
top: 0;
|
||||
z-index: 99;
|
||||
height: 10vh;
|
||||
}
|
||||
@media screen and (max-width: 850px) {
|
||||
#header {
|
||||
height: 5vh;
|
||||
height: 45px;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -687,9 +760,10 @@ html, body {
|
||||
.dropdown .dropdown-nav-item {
|
||||
position: relative;
|
||||
margin-top: 50px;
|
||||
background: -webkit-linear-gradient(#FFFFFF, #adf0ff);
|
||||
background: linear-gradient(#FFFFFF, #adf0ff);
|
||||
-webkit-background-clip: text;
|
||||
-webkit-text-fill-color: transparent;
|
||||
background-clip: text;
|
||||
color: transparent;
|
||||
font: 600 28px "Montserrat", sans-serif;
|
||||
text-decoration: none;
|
||||
-webkit-animation: navbar-appear 550ms;
|
||||
@@ -716,7 +790,7 @@ html, body {
|
||||
}
|
||||
@media screen and (max-width: 850px) {
|
||||
.dropdown {
|
||||
height: 95vh;
|
||||
height: calc(100vh - 45px);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -819,7 +893,7 @@ html, body {
|
||||
}
|
||||
}
|
||||
#container {
|
||||
height: 90vh;
|
||||
min-height: 90vh;
|
||||
display: grid;
|
||||
grid-template-rows: 1fr auto;
|
||||
grid-template-columns: 1fr;
|
||||
@@ -828,7 +902,7 @@ html, body {
|
||||
}
|
||||
@media screen and (max-width: 850px) {
|
||||
#container {
|
||||
height: 95vh;
|
||||
min-height: calc(100vh - 45px);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -839,6 +913,36 @@ html, body {
|
||||
overflow-wrap: break-word;
|
||||
}
|
||||
|
||||
#scroll-to-top {
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
display: none;
|
||||
position: fixed;
|
||||
right: 25px;
|
||||
bottom: 55px;
|
||||
z-index: 99;
|
||||
cursor: pointer;
|
||||
border: none;
|
||||
border-radius: 50%;
|
||||
background-color: #1d60b5;
|
||||
}
|
||||
#scroll-to-top img {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
filter: invert(100%);
|
||||
}
|
||||
#scroll-to-top:hover {
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
right: 20px;
|
||||
bottom: 50px;
|
||||
transition: 250ms cubic-bezier(0.51, 1.27, 0.18, 0.96);
|
||||
}
|
||||
#scroll-to-top:hover img {
|
||||
transform: translateY(-5px);
|
||||
transition: 250ms cubic-bezier(0.51, 1.27, 0.18, 0.96);
|
||||
}
|
||||
|
||||
#footer {
|
||||
grid-column: 1;
|
||||
grid-row: 2;
|
||||
|
||||
@@ -15,12 +15,12 @@
|
||||
<nav class="navbar">
|
||||
<a class="nav-item" href="index.html">Ana sayfa</a>
|
||||
<a class="nav-item" href="hakkimizda.html">Hakkımızda</a>
|
||||
<a class="nav-item" href="#brands">Markalar</a>
|
||||
<a class="nav-item" href="index.html#brands">Markalar</a>
|
||||
<a class="nav-item" href="https://ugurgaleri1.sahibinden.com/">Araçlarımız</a>
|
||||
<a class="nav-item" href="iletisim.html">İletişim</a>
|
||||
</nav>
|
||||
|
||||
<input type="checkbox" id="toggle" class="toggle" onchange="toggleDropdown()">
|
||||
<input type="checkbox" id="toggle" class="toggle" onchange="toggleDropdown()" autocomplete="off">
|
||||
<label for="toggle" id="toggle-label">
|
||||
<div class="dropdown-toggle">
|
||||
<span class="bar bar1"></span>
|
||||
@@ -33,7 +33,7 @@
|
||||
<nav class="dropdown hidden dropdown-navbar">
|
||||
<a class="dropdown-nav-item hidden" href="index.html">Ana sayfa</a>
|
||||
<a class="dropdown-nav-item hidden" href="hakkimizda.html">Hakkımızda</a>
|
||||
<a class="dropdown-nav-item hidden" href="#brands">Markalar</a>
|
||||
<a class="dropdown-nav-item hidden" href="index.html#brands">Markalar</a>
|
||||
<a class="dropdown-nav-item hidden" href="https://ugurgaleri1.sahibinden.com/">Araçlarımız</a>
|
||||
<a class="dropdown-nav-item hidden" href="iletisim.html">İletişim</a>
|
||||
</nav>
|
||||
Reference in New Issue
Block a user