Merge pull request #19 from fybx/dev

This commit is contained in:
Ferit Yiğit BALABAN
2022-08-01 09:32:13 +03:00
committed by GitHub
30 changed files with 541 additions and 535 deletions

1
.gitignore vendored
View File

@@ -1,3 +1,4 @@
.idea/
.sass-cache/
*.css.map
*.sass.map

5
.idea/.gitignore generated vendored
View File

@@ -1,5 +0,0 @@
# Default ignored files
/shelf/
/workspace.xml
# Editor-based HTTP Client requests
/httpRequests/

View File

@@ -1,22 +0,0 @@
<component name="InspectionProjectProfileManager">
<profile version="1.0">
<option name="myName" value="Project Default" />
<inspection_tool class="CssUnknownProperty" enabled="true" level="WARNING" enabled_by_default="true">
<option name="myCustomPropertiesEnabled" value="true" />
<option name="myIgnoreVendorSpecificProperties" value="false" />
<option name="myCustomPropertiesList">
<value>
<list size="1">
<item index="0" class="java.lang.String" itemvalue="transform" />
</list>
</value>
</option>
</inspection_tool>
<inspection_tool class="LanguageDetectionInspection" enabled="true" level="TYPO" enabled_by_default="true" />
<inspection_tool class="SpellCheckingInspection" enabled="true" level="INFORMATION" enabled_by_default="true">
<option name="processCode" value="true" />
<option name="processLiterals" value="true" />
<option name="processComments" value="true" />
</inspection_tool>
</profile>
</component>

8
.idea/modules.xml generated
View File

@@ -1,8 +0,0 @@
<?xml version="1.0" encoding="UTF-8"?>
<project version="4">
<component name="ProjectModuleManager">
<modules>
<module fileurl="file://$PROJECT_DIR$/.idea/ugurgaleri.iml" filepath="$PROJECT_DIR$/.idea/ugurgaleri.iml" />
</modules>
</component>
</project>

12
.idea/ugurgaleri.iml generated
View File

@@ -1,12 +0,0 @@
<?xml version="1.0" encoding="UTF-8"?>
<module type="WEB_MODULE" version="4">
<component name="NewModuleRootManager">
<content url="file://$MODULE_DIR$">
<excludeFolder url="file://$MODULE_DIR$/temp" />
<excludeFolder url="file://$MODULE_DIR$/.tmp" />
<excludeFolder url="file://$MODULE_DIR$/tmp" />
</content>
<orderEntry type="inheritedJdk" />
<orderEntry type="sourceFolder" forTests="false" />
</component>
</module>

6
.idea/vcs.xml generated
View File

@@ -1,6 +0,0 @@
<?xml version="1.0" encoding="UTF-8"?>
<project version="4">
<component name="VcsDirectoryMappings">
<mapping directory="$PROJECT_DIR$" vcs="Git" />
</component>
</project>

View File

@@ -1,4 +0,0 @@
<?xml version="1.0" encoding="UTF-8"?>
<project version="4">
<component name="ProjectTasksOptions" suppressed-tasks="SCSS" />
</project>

View File

@@ -39,12 +39,12 @@
<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="hakkimizda.html">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 id="drawer">
<a class="drawer-item" href="index.html">Ana sayfa</a>
<a class="drawer-item" href="hakkimizda.html">Hakkımızda</a>
<a class="drawer-item" href="index.html#brands">Markalar</a>
<a class="drawer-item" href="https://ugurgaleri1.sahibinden.com/">Araçlarımız</a>
<a class="drawer-item" href="iletisim.html">İletişim</a>
</nav>
<div id="container">
<main id="content">
@@ -720,8 +720,8 @@
<ul>
<li><a href="hakkimizda.html#misyon">Misyonumuz</a></li>
<li><a href="hakkimizda.html#vizyon">Vizyonumuz</a></li>
<li><a href="hakkimizda.html#yonetim">Yönetim</a></li>
<li><a href="aydinlatma.html">KVKK Aydınlatma Metni</a></li>
<li><a href="galeri.html">Fotoğraf Galerisi</a></li>
<li><a href="#">Aydınlatma Metni</a></li>
<li><a href="kamera.html">Kamera Kullanımı</a></li>
</ul>
</div>

View File

@@ -43,12 +43,12 @@
<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="hakkimizda.html">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 id="drawer">
<a class="drawer-item" href="index.html">Ana sayfa</a>
<a class="drawer-item" href="hakkimizda.html">Hakkımızda</a>
<a class="drawer-item" href="index.html#brands">Markalar</a>
<a class="drawer-item" href="https://ugurgaleri1.sahibinden.com/">Araçlarımız</a>
<a class="drawer-item" href="iletisim.html">İletişim</a>
</nav>
<div id="container">
<main id="content">
@@ -68,11 +68,9 @@
<div class="photo-container"><img class="photo" src="resources/img/galeri/0420.JPG" alt="Fotoğraf" loading="lazy"></div>
<div class="photo-container"><img class="photo" src="resources/img/galeri/0422.JPG" alt="Fotoğraf" loading="lazy"></div>
<div class="photo-container"><img class="photo" src="resources/img/galeri/0423.JPG" alt="Fotoğraf" loading="lazy"></div>
<div class="photo-container"><img class="photo" src="resources/img/galeri/0423.jpg" alt="Fotoğraf" loading="lazy"></div>
<div class="photo-container"><img class="photo" src="resources/img/galeri/0424.jpg" alt="Fotoğraf" loading="lazy"></div>
<div class="photo-container"><img class="photo" src="resources/img/galeri/0426.jpg" alt="Fotoğraf" loading="lazy"></div>
<div class="photo-container"><img class="photo" src="resources/img/galeri/0429.jpg" alt="Fotoğraf" loading="lazy"></div>
<div class="photo-container"><img class="photo" src="resources/img/galeri/0436.JPG" alt="Fotoğraf" loading="lazy"></div>
<div class="photo-container"><img class="photo" src="resources/img/galeri/0438.jpg" alt="Fotoğraf" loading="lazy"></div>
<div class="photo-container"><img class="photo" src="resources/img/galeri/0863.jpg" alt="Fotoğraf" loading="lazy"></div>
<div class="photo-container"><img class="photo" src="resources/img/galeri/0866.JPG" alt="Fotoğraf" loading="lazy"></div>
@@ -89,7 +87,6 @@
<div class="photo-container"><img class="photo" src="resources/img/galeri/7843.jpg" alt="Fotoğraf" loading="lazy"></div>
<div class="photo-container"><img class="photo" src="resources/img/galeri/7850.jpg" alt="Fotoğraf" loading="lazy"></div>
<div class="photo-container"><img class="photo" src="resources/img/galeri/7851.JPG" alt="Fotoğraf" loading="lazy"></div>
<div class="photo-container"><img class="photo" src="resources/img/galeri/7880.JPG" alt="Fotoğraf" loading="lazy"></div>
<div class="photo-container"><img class="photo" src="resources/img/galeri/7881.jpg" alt="Fotoğraf" loading="lazy"></div>
<div class="photo-container"><img class="photo" src="resources/img/galeri/7891.jpg" alt="Fotoğraf" loading="lazy"></div>
<div class="photo-container"><img class="photo" src="resources/img/galeri/7893.jpg" alt="Fotoğraf" loading="lazy"></div>
@@ -120,8 +117,8 @@
<ul>
<li><a href="hakkimizda.html#misyon">Misyonumuz</a></li>
<li><a href="hakkimizda.html#vizyon">Vizyonumuz</a></li>
<li><a href="hakkimizda.html#yonetim">Yönetim</a></li>
<li><a href="aydinlatma.html">KVKK Aydınlatma Metni</a></li>
<li><a href="#">Fotoğraf Galerisi</a></li>
<li><a href="aydinlatma.html">Aydınlatma Metni</a></li>
<li><a href="kamera.html">Kamera Kullanımı</a></li>
</ul>
</div>

View File

@@ -39,12 +39,12 @@
<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 id="drawer">
<a class="drawer-item" href="index.html">Ana sayfa</a>
<a class="drawer-item" href="#">Hakkımızda</a>
<a class="drawer-item" href="index.html#brands">Markalar</a>
<a class="drawer-item" href="https://ugurgaleri1.sahibinden.com/">Araçlarımız</a>
<a class="drawer-item" href="iletisim.html">İletişim</a>
</nav>
<div id="container">
<main id="content">
@@ -53,24 +53,31 @@
<video src="" controls>Tarayıcınız burada video gösterilmesine izin vermiyor.</video>
</section>-->
<section id="hikaye" class="content-spacing">
<h1>Kuruluş Hikâyemiz</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Aliquid cum, dolores impedit itaque iure, nemo nesciunt nobis quos rem repudiandae sint suscipit? Accusamus accusantium adipisci aspernatur beatae blanditiis cupiditate dolore enim et eveniet ex fuga id ipsam itaque, iure labore laborum, magni molestiae nihil nulla quis quisquam sequi sunt tempore unde velit veniam vero. Accusantium alias aperiam aut delectus deserunt eius enim et explicabo facilis fugiat fugit harum itaque iusto laboriosam libero, minima molestias nulla optio praesentium, qui quod tempore tenetur voluptates. Amet aut blanditiis cumque, deleniti deserunt dolore eligendi, enim eum incidunt magni neque nobis omnis pariatur quas reiciendis repudiandae totam vero. Ad asperiores aspernatur culpa dolor et in ipsa ipsum iste itaque, maiores nemo numquam odio odit officia perspiciatis quas quasi quia, quidem repellendus repudiandae, tempora ut vel? Animi asperiores, cumque dignissimos error excepturi inventore itaque laudantium maxime minima officia quas rem repellat sed similique velit vitae voluptatibus!</p>
<h1 class="heading">Kuruluş Hikâyemiz</h1>
<section>
<section class="text-area">
<p class="paragraph">Kurucumuz Uğur Koçak 1966 yılında Nevşehir'in Ürgüp ilçesinde 12 çocuklu bir ailenin ferdi olarak dünyaya geldi. Dönemin ekonomik koşulları gereği küçük yaşta çalışma hayatına atılan Uğur Koçak, ağır vasıta sektörünün ilişkili olduğu işler yaptıktan sonra yirmili yaşlarında Nevşehir'de galericilik mesleğine adım atmıştır. Otuzlu yaşlarında Balıkesir'e gelerek meslekte deneyimini arttırdıktan sonra kendi galerisini kurmak üzere potansiyelini hissettiği ve eksikliğini gördüğü Bursa'nın Karacabey ilçesine gelerek 1996 yılında hâlen aynı mevkide hizmet veren galerisinin kuruluşunu gerçekleştirmiştir. Bugün Güney Marmara'nın İstanbul - İzmir - Çanakkale - Bursa yollarının kesişim noktasında bulunan, 35 dönum arazi üzerinde Türkiye'nin en büyük galerilerinden biri haline getirmiştir.</p>
<p class="paragraph">Uğur Koçak 2 evlat babası olup, şirketin fiili yönetimini 2018 yılı itibariyle yurt içi ve yurt dışı eğitimleri tamamlayarak gelen iki kuşakta yönetimini devralan Furkan Koçak'a teslim etmiştir. Furkan Koçak vizyoner bakış açısıyla yönetimi başarıyla devam ettirmektedir.</p>
</section>
<figure>
<img src="resources/img/01.JPG" alt="Uğur Koçak">
</figure>
</section>
</section>
<section id="misyon" class="content-spacing">
<h1>Misyonumuz</h1>
<p>Alanında deneyimli, güler yüzlü personelimiz ve sektördeki köklü geçmişimizin getirdiği bilgi birikimi ile müşterilerimizin ihtiyaçları doğrultusunda en doğru araca ulaşmalarını sağlıyoruz. Müşterilerimiz ile ilişkilerimizi kısa süreli görmüyor, süreç boyunca ve sonrasında doğru ve eksiksiz iletişimi sağlayarak sorunlarınıza çözüm üretiyoruz.</p>
<h1 class="heading">Misyonumuz</h1>
<p class="paragraph">Alanında deneyimli, güler yüzlü personelimiz ve sektördeki köklü geçmişimizin getirdiği bilgi birikimi ile müşterilerimizin ihtiyaçları doğrultusunda en doğru araca ulaşmalarını sağlıyoruz. Müşterilerimiz ile ilişkilerimizi kısa süreli görmüyor, süreç boyunca ve sonrasında doğru ve eksiksiz iletişimi sağlayarak sorunlarınıza çözüm üretiyoruz.</p>
</section>
<section id="vizyon" class="content-spacing">
<h1>Vizyonumuz</h1>
<p>Profesyonel altyapısı, köklü geçmişi ve geniş bilgi birikimi ile Uğur Galeri ve Uğur Koçak Treyler olarak Türkiye ağır vasıta pazarında büyük başarılara imza atmış bulunmaktayız.</p>
<p>Hedeflerimiz;</p>
<h1 class="heading">Vizyonumuz</h1>
<p class="paragraph">Profesyonel altyapısı, köklü geçmişi ve geniş bilgi birikimi ile Uğur Galeri ve Uğur Koçak Treyler olarak Türkiye ağır vasıta pazarında büyük başarılara imza atmış bulunmaktayız.</p>
<p class="paragraph">Hedeflerimiz;</p>
<ul>
<li>ır vasıta ve ikinci el ticari araç pazarında alım satımını ve distribütörlüğünü yaptığımız markaların ulusal ölçekte önde gelen temsilcilerinden birisi olmak.</li>
<li>Hizmet verdiğimiz sektörde müşterilerimizin her birinin çalışmaktan güven duyduğu ve memnun kaldığı bir şirket konumuna yükselmek.</li>
<li>Ulusal pazarda ve ticari sektörde standartları ve doğruları belirlemek.</li>
<li class="paragraph">ır vasıta ve ikinci el ticari araç pazarında alım satımını ve distribütörlüğünü yaptığımız markaların ulusal ölçekte önde gelen temsilcilerinden birisi olmak.</li>
<li class="paragraph">Hizmet verdiğimiz sektörde müşterilerimizin her birinin çalışmaktan güven duyduğu ve memnun kaldığı bir şirket konumuna yükselmek.</li>
<li class="paragraph">Ulusal pazarda ve ticari sektörde standartları ve doğruları belirlemek.</li>
</ul>
</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">
@@ -91,8 +98,8 @@
<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="galeri.html">Fotoğraf Galerisi</a></li>
<li><a href="aydinlatma.html">Aydınlatma Metni</a></li>
<li><a href="kamera.html">Kamera Kullanımı</a></li>
</ul>
</div>

View File

@@ -39,12 +39,12 @@
<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="hakkimizda.html">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="#">İletişim</a>
<nav id="drawer">
<a class="drawer-item" href="index.html">Ana sayfa</a>
<a class="drawer-item" href="hakkimizda.html">Hakkımızda</a>
<a class="drawer-item" href="index.html#brands">Markalar</a>
<a class="drawer-item" href="https://ugurgaleri1.sahibinden.com/">Araçlarımız</a>
<a class="drawer-item" href="#">İletişim</a>
</nav>
<div id="container">
<main id="content">
@@ -98,16 +98,16 @@
<li><a href="hakkimizda.html">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="">İletişim</a></li>
<li><a href="#">İletişim</a></li>
</ul>
</div>
<div class="footer-column">
<h1>Kurumsal</h1>
<ul>
<li><a>Misyonumuz</a></li>
<li><a>Vizyonumuz</a></li>
<li><a>Yönetim</a></li>
<li><a href="aydinlatma.html">KVKK Aydınlatma Metni</a></li>
<li><a href="hakkimizda.html#misyon">Misyonumuz</a></li>
<li><a href="hakkimizda.html#vizyon">Vizyonumuz</a></li>
<li><a href="galeri.html">Fotoğraf Galerisi</a></li>
<li><a href="aydinlatma.html">Aydınlatma Metni</a></li>
<li><a href="kamera.html">Kamera Kullanımı</a></li>
</ul>
</div>

View File

@@ -40,36 +40,40 @@
<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="hakkimizda.html">Hakkımızda</a>
<a class="dropdown-nav-item hidden" href="#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 id="drawer">
<a class="drawer-item" href="#">Ana sayfa</a>
<a class="drawer-item" href="hakkimizda.html">Hakkımızda</a>
<a class="drawer-item" href="index.html#brands">Markalar</a>
<a class="drawer-item" href="https://ugurgaleri1.sahibinden.com/">Araçlarımız</a>
<a class="drawer-item" href="iletisim.html">İletişim</a>
</nav>
<div id="container">
<main id="content">
<div class="showcase content-spacing">
<h1 style="color: white; font: 500 45px Montserrat, sans-serif;">Güvenilir alışverişin<br>merkezine<br>hoşgeldiniz! </h1>
</div>
<!-- TODO <section class="araclar">
<ul class="slideshow">
<li><span></span></li>
<li><span></span></li>
<li><span></span></li>
<li><span></span></li>
<li><span></span></li>
</ul>
<section class="araclar content-spacing-small">
<a href="https://ugurgaleri1.sahibinden.com/">Araçlarımızı incelemek için tıklayınız.</a>
</section>-->
</section>
<div id="brands" class="table content-spacing">
<div class="table-item square">
<img src="resources/img/ugurgaleri-utek.png" alt="Uğur Galeri U logosu">
<hr>
<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>
<p class="paragraph">Şirketimiz 1996 yılında 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" alt="Uğur Koçak Treyler logosu">
<hr>
<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>
<p class="paragraph">Uğur Koçak Treyler, müşteri gereksinimlerine istinaden 2012 yılında <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" alt="galericilerden.com logosu">
<hr>
<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>
<p class="paragraph">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>
</div>
</div>
<div id="social" class="social content-spacing ignore-vertical">
@@ -88,7 +92,7 @@
<div class="footer-column">
<h1>Uğur Galeri</h1>
<ul>
<li><a href="index.html">Ana sayfa</a></li>
<li><a href="#">Ana sayfa</a></li>
<li><a href="hakkimizda.html">Hakkımızda</a></li>
<li><a href="#brands">Markalarımız</a></li>
<li><a href="https://ugurgaleri1.sahibinden.com">Araçlarımız</a></li>
@@ -98,11 +102,11 @@
<div class="footer-column">
<h1>Kurumsal</h1>
<ul>
<li><a href="hakkimizda.html#misyon">Misyonumuz</a></li>
<li><a href="hakkimizda.html#vizyon">Vizyonumuz</a></li>
<li><a href="hakkimizda.html#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>
<li><a href="hakkimizda.html#misyon">Misyonumuz</a></li>
<li><a href="hakkimizda.html#vizyon">Vizyonumuz</a></li>
<li><a href="galeri.html">Fotoğraf Galerisi</a></li>
<li><a href="aydinlatma.html">Aydınlatma Metni</a></li>
<li><a href="kamera.html">Kamera Kullanımı</a></li>
</ul>
</div>
</div>

View File

@@ -38,12 +38,12 @@
<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="hakkimizda.html">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 id="drawer">
<a class="drawer-item" href="index.html">Ana sayfa</a>
<a class="drawer-item" href="hakkimizda.html">Hakkımızda</a>
<a class="drawer-item" href="index.html#brands">Markalar</a>
<a class="drawer-item" href="https://ugurgaleri1.sahibinden.com/">Araçlarımız</a>
<a class="drawer-item" href="iletisim.html">İletişim</a>
</nav>
<div id="container">
<main id="content">
@@ -132,9 +132,9 @@
<ul>
<li><a href="hakkimizda.html#misyon">Misyonumuz</a></li>
<li><a href="hakkimizda.html#vizyon">Vizyonumuz</a></li>
<li><a href="hakkimizda.html#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>
<li><a href="galeri.html">Fotoğraf Galerisi</a></li>
<li><a href="aydinlatma.html">Aydınlatma Metni</a></li>
<li><a href="#">Kamera Kullanımı</a></li>
</ul>
</div>
</div>

View File

@@ -1,3 +1,5 @@
@use "variables";
@keyframes fullscreen-image-appear {
from {
opacity: 0;
@@ -9,4 +11,44 @@
width: 100%;
height: 100vh;
}
}
@keyframes slideshow {
0% {
opacity: 0;
animation-timing-function: ease-in;
}
8% {
opacity: 1;
animation-timing-function: ease-out;
}
17% {
opacity: 1;
}
25% {
opacity: 0;
}
100% {
opacity: 0;
}
}
@keyframes important {
0% {
transform: scale(1);
text-shadow: black 0 0 0;
color: white;
}
50% {
transform: scale(1.02);
text-shadow: variables.$clr_dark 0 0 20px;
color: #FFFFFF;
}
100% {
transform: scale(1);
text-shadow: black 0 0 0;
color: white;
}
}

View File

@@ -46,6 +46,18 @@ a {
}
}
.content-spacing-small {
padding: math.div(variables.$px_horizontalPadding, 4) math.div(variables.$px_horizontalPadding, 2);
@include mixins.mx_index_brands_fix {
padding: math.div(variables.$px_horizontalPadding2, 4) math.div(variables.$px_horizontalPadding2, 2);
}
@include mixins.mx_index_brands_fix2 {
padding: math.div(variables.$px_horizontalPadding3, 4) math.div(variables.$px_horizontalPadding3, 2);
}
}
.ignore-vertical {
// ignores vertical padding applied by .content-spacing
padding-top: 0;
@@ -73,6 +85,38 @@ a {
}
}
.paragraph {
font: 500 x-large "Montserrat", sans-serif;
@include mixins.mx_index_brands_fix {
font-size: large;
}
@include mixins.mx_index_brands_fix2 {
font-size: 18px;
}
@include mixins.mx_mobile {
font-size: 16px;
}
}
.heading {
font: 600 50px "Montserrat", sans-serif;
@include mixins.mx_index_brands_fix {
font-size: 35px;
}
@include mixins.mx_index_brands_fix2 {
font-size: 25px;
}
@include mixins.mx_mobile {
font-size: 20px;
}
}
#header {
position: sticky;
top: 0;
@@ -85,19 +129,22 @@ a {
}
}
.dropdown {
#drawer {
position: fixed;
bottom: 0;
right: 0;
z-index: 2;
background: variables.$cg_drawer;
width: 100%;
width: 0;
height: 90vh;
-webkit-animation: drawer-open 550ms;
animation: drawer-open 550ms;
display: flex;
flex-direction: column;
align-items: center;
transition: width 500ms;
.dropdown-nav-item {
.drawer-item {
position: relative;
opacity: 0;
margin-top: math.div(variables.$px_horizontalPadding, 4);
background: variables.$cg_drawer_navitem;
-webkit-background-clip: text;
@@ -106,8 +153,7 @@ a {
color: transparent;
font: 600 28px "Montserrat", sans-serif;
text-decoration: none;
-webkit-animation: navbar-appear 550ms;
animation: navbar-appear 550ms;
transition: opacity 250ms ease-in-out;
&:first-of-type {
margin-top: math.div(variables.$px_horizontalPadding, 2);
@@ -130,6 +176,15 @@ a {
transform: scaleX(1);
transform-origin: bottom left;
}
&.visible {
opacity: 1;
}
}
&.expanded {
width: 100%;
top: unset;
}
@include mixins.header_overflow2 {
@@ -137,116 +192,6 @@ a {
}
}
.dropdown_close_animation {
-webkit-animation: drawer-close 550ms;
animation: drawer-close 550ms;
}
.dropdown-nav-item_close_animation {
-webkit-animation: navbar-disappear 550ms;
animation: navbar-disappear 550ms;
}
@-webkit-keyframes drawer-close {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
visibility: hidden;
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@keyframes drawer-close {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
visibility: hidden;
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@-webkit-keyframes drawer-open {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
visibility: visible;
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes drawer-open {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
visibility: visible;
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes navbar-appear {
from {
opacity: 0;
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
opacity: 1;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes navbar-appear {
from {
opacity: 0;
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
opacity: 1;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes navbar-disappear {
from {
opacity: 1;
}
to {
opacity: 0;
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@keyframes navbar-disappear {
from {
opacity: 1;
}
to {
opacity: 0;
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
#container {
min-height: 90vh;
display: grid;
@@ -258,6 +203,10 @@ a {
@include mixins.header_overflow2 {
min-height: calc(100vh - 45px);
}
&.hidden {
display: none;
}
}
#content {
@@ -270,7 +219,6 @@ a {
#scroll-to-top {
width: $px_scroll-to-top_size;
height: $px_scroll-to-top_size;
display: none;
position: fixed;
right: 25px;
bottom: 55px;
@@ -279,6 +227,7 @@ a {
border: none;
border-radius: 50%;
background-color: variables.$clr_brand;
box-shadow: white 0 0 50px -5px;
img {
height: 100%;

View File

@@ -95,4 +95,10 @@
@media (hover: hover) and (pointer: fine) {
@content;
}
}
@mixin mx_hakkimizda_text-area {
@media screen and (max-width: overflow.$hakkimizda_sec_text-area) {
@content;
}
}

View File

@@ -3,4 +3,6 @@ $kamera_sec_links-to-documents2: 610px;
$iletisim_sec_information: 1235px;
$iletisim_sec_information2: 1170px;
$iletisim_sec_information3: 490px;
$iletisim_sec_information3: 490px;
$hakkimizda_sec_text-area: 1700px;

View File

@@ -98,6 +98,13 @@ $toggle-label_s_second_bar: math.div($toggle-label_s_width - 4, 2);
height: $toggle-label_l_width;
position: relative;
cursor: pointer;
-webkit-tap-highlight-color: transparent;
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
.bar {
padding: 0;

View File

@@ -1,2 +1,8 @@
$index_showcase_bg_day: url("../img/index/g.jpg");
$index_showcase_bg_night: url("../img/index/y.jpg");
$index_showcase_bg_night: url("../img/index/y.jpg");
$index_slide1: url("../img/galeri/9761.jpg");
$index_slide2: url("../img/galeri/7925.jpg");
$index_slide3: url("../img/galeri/0414.jpg");
$index_slide4: url("../img/galeri/7815.jpg");
$index_slide5: url("../img/galeri/0429.jpg");

View File

@@ -23,10 +23,11 @@ $sz_s_footer_p: 8px;
$clr_dark: #01003B;
$clr_brand: #1d60b5;
$clr_brand_gradient: linear-gradient(to left, $clr_brand, #3b8fff);
$clr_brand_gradient: linear-gradient(to left, $clr_brand, #77afff);
$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);
$cg_brand_reverse: linear-gradient(to right, $clr_brand, #77afff);
$clr_logo: #FDFFFF;
$clr_header: #FDFFFF;

View File

@@ -6,14 +6,9 @@
h1 {
margin: 0 0 1em 0;
font: 600 2.5vw "Montserrat", sans-serif;
color: black;
}
p {
font: 500 1.25vw "Montserrat", sans-serif;
}
ul {
list-style-position: inside;
font-size: 1vw;
@@ -31,4 +26,25 @@
width: 100% !important;
height: auto !important;
}
}
#hikaye {
section {
display: flex;
align-items: center;
figure {
img {
height: 25vw;
}
}
@include mixins.mx_hakkimizda_text-area {
flex-direction: column-reverse;
}
}
.text-area {
flex-direction: column;
}
}

View File

@@ -1,6 +1,7 @@
@use "../variables.scss";
@use "../mixins.scss";
@use "../urls.scss";
@use "../keyframes";
@use "sass:math";
$table-item_img_width_l: 150px;
@@ -11,36 +12,77 @@ $table-item_margin_between_items: 10px;
$social-button_img_width: 32px;
$social-button_inner_margin: 10px;
.showcase {
display: flex;
height: 90vh;
background-image: urls.$index_showcase_bg_day;
background-position: center;
background-size: cover;
background-repeat: no-repeat;
.slideshow {
margin: 0;
padding: 0;
height: 80vh;
z-index: 0;
list-style-type: none;
@include mixins.header_overflow2 {
height: 95vh;
height: calc(100vh - 45px);
}
}
.showcase-animation {
animation: slideshow-appear 1000ms;
}
@keyframes slideshow-appear {
from {
li span {
position: absolute;
width: 100%;
height: 80vh;
left: 0;
color: transparent;
background-size: cover;
background-position: 50% 90%;
background-repeat: no-repeat;
opacity: 0;
z-index: 0;
animation: slideshow 30s linear infinite 0s;
@include mixins.header_overflow2 {
height: calc(100vh - 45px);
}
}
to {
opacity: 1;
li:nth-child(1) span {
background-image: urls.$index_slide1;
background-position-y: 50%;
}
li:nth-child(2) span {
background-image: urls.$index_slide2;
animation-delay: 6s;
}
li:nth-child(3) span {
background-image: urls.$index_slide3;
animation-delay: 12s;
}
li:nth-child(4) span {
background-image: urls.$index_slide4;
animation-delay: 18s;
}
li:nth-child(5) span {
background-image: urls.$index_slide5;
animation-delay: 24s;
}
}
.araclar {
background: variables.$clr_brand_gradient;
text-align: center;
font: 600 32px "Montserrat", sans-serif;
a {
display: inline-block;
color: white;
font: 600 32px "Montserrat", sans-serif;
animation: important 2s infinite ease-in-out;
&:hover {
animation-play-state: paused;
font-style: italic;
color: variables.$clr_dark;
}
@include mixins.header_overflow2 {
margin: 1.5vh 1vw;
}
}
}
.table {
@@ -52,22 +94,6 @@ $social-button_inner_margin: 10px;
display: inline-flex;
flex-direction: row;
p {
font: x-large sans-serif;
@include mixins.mx_index_brands_fix {
font-size: large;
}
@include mixins.mx_index_brands_fix2 {
font-size: 18px;
}
@include mixins.mx_mobile {
font-size: 16px;
}
}
img {
align-self: center;
margin-right: math.div(variables.$px_horizontalPadding, 10);

BIN
resources/img/01.JPG Executable file

Binary file not shown.

After

Width:  |  Height:  |  Size: 409 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.2 MiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 704 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 766 KiB

View File

@@ -1,23 +1,3 @@
const doSlideshow = true;
const slideTime = 7500; // milliseconds
const animTime = 1000; // milliseconds
async function slideshow() {
let showcase = document.getElementsByClassName("showcase")[0];
while(doSlideshow) {
showcase.style.backgroundImage = "url(resources/img/index/g.jpg)";
showcase.classList.add("showcase-animation");
await sleep(animTime);
showcase.classList.remove("showcase-animation");
await sleep(slideTime);
showcase.style.backgroundImage = "url(resources/img/index/y.jpg)";
showcase.classList.add("showcase-animation");
await sleep(animTime);
showcase.classList.remove("showcase-animation");
await sleep(slideTime);
}
}
const observer = new IntersectionObserver(entries => {
entries.forEach(entry => {
if (entry.isIntersecting) {
@@ -32,6 +12,4 @@ const observer = new IntersectionObserver(entries => {
let targets = document.querySelectorAll('.table-item');
targets.forEach(target => {
observer.observe(target);
})
slideshow();
})

View File

@@ -1,10 +1,13 @@
scroll_to_top = document.getElementById("scroll-to-top");
const SCROLL_MIN = 100;
const $scroll_to_top = document.getElementById("scroll-to-top");
const $drawer = document.getElementById("drawer");
const $drawer_item = document.querySelectorAll(".drawer-item");
window.onscroll = function () {
if (document.documentElement.scrollTop > 100 || document.body.scrollTop > 100) {
scroll_to_top.style.display = "block";
function checkScroll() {
if (document.documentElement.scrollTop > SCROLL_MIN || document.body.scrollTop > SCROLL_MIN) {
$scroll_to_top.style.visibility = "visible";
} else {
scroll_to_top.style.display = "none";
$scroll_to_top.style.visibility = "hidden";
}
}
@@ -17,47 +20,21 @@ async function sleep(milliseconds) {
return new Promise(resolve => setTimeout(resolve, milliseconds));
}
let dropdown = document.getElementsByClassName('dropdown')[0];
let navitems = document.getElementsByClassName('dropdown-nav-item');
function showDropdown() {
dropdown.classList.remove('hidden');
dropdown.classList.add('flex');
}
function hideDropdown() {
dropdown.classList.remove('flex');
dropdown.classList.add('hidden');
}
function showNavitems() {
for (let i = 0; i < navitems.length; i++) {
navitems[i].classList.remove('hidden');
navitems[i].classList.add('inline-block');
}
}
function hideNavitems() {
for (let i = 0; i < navitems.length; i++) {
navitems[i].classList.remove('inline-block');
navitems[i].classList.add('hidden');
}
}
async function toggleDropdown() {
if (dropdown.classList.contains('hidden')) {
showDropdown();
await sleep(550);
document.getElementById("container").style.display = "none";
await sleep(200);
showNavitems();
let expanded = $drawer.classList.contains("expanded");
if (expanded) {
for (let i = 0; i < $drawer_item.length; i++) {
$drawer_item[i].classList.toggle("visible");
}
$drawer.classList.toggle("expanded");
} else {
$drawer.classList.toggle("expanded");
await sleep(250);
for (let i = 0; i < $drawer_item.length; i++) {
$drawer_item[i].classList.toggle("visible");
}
}
else {
document.getElementById("container").style.display = "grid";
dropdown.classList.add('dropdown_close_animation');
await sleep(550);
dropdown.classList.remove('dropdown_close_animation');
hideDropdown();
hideNavitems();
}
}
}
window.addEventListener('load', checkScroll);
window.addEventListener('scroll', checkScroll);

View File

@@ -2,35 +2,123 @@
@import url("https://fonts.googleapis.com/css2?family=Montserrat:wght@600&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Montserrat:wght@700&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Oswald:wght@600&display=swap");
.showcase {
display: flex;
height: 90vh;
background-image: url("../img/index/g.jpg");
background-position: center;
background-size: cover;
background-repeat: no-repeat;
}
@media screen and (max-width: 850px) {
.showcase {
height: 95vh;
}
}
.showcase-animation {
animation: slideshow-appear 1000ms;
}
@keyframes slideshow-appear {
@keyframes fullscreen-image-appear {
from {
opacity: 0;
width: 0;
height: 0;
}
to {
opacity: 1;
width: 100%;
height: 100vh;
}
}
@keyframes slideshow {
0% {
opacity: 0;
animation-timing-function: ease-in;
}
8% {
opacity: 1;
animation-timing-function: ease-out;
}
17% {
opacity: 1;
}
25% {
opacity: 0;
}
100% {
opacity: 0;
}
}
@keyframes important {
0% {
transform: scale(1);
text-shadow: black 0 0 0;
color: white;
}
50% {
transform: scale(1.02);
text-shadow: #01003B 0 0 20px;
color: #FFFFFF;
}
100% {
transform: scale(1);
text-shadow: black 0 0 0;
color: white;
}
}
.slideshow {
margin: 0;
padding: 0;
height: 80vh;
z-index: 0;
list-style-type: none;
}
@media screen and (max-width: 850px) {
.slideshow {
height: calc(100vh - 45px);
}
}
.slideshow li span {
position: absolute;
width: 100%;
height: 80vh;
left: 0;
color: transparent;
background-size: cover;
background-position: 50% 90%;
background-repeat: no-repeat;
opacity: 0;
z-index: 0;
animation: slideshow 30s linear infinite 0s;
}
@media screen and (max-width: 850px) {
.slideshow li span {
height: calc(100vh - 45px);
}
}
.slideshow li:nth-child(1) span {
background-image: url("../img/galeri/9761.jpg");
background-position-y: 50%;
}
.slideshow li:nth-child(2) span {
background-image: url("../img/galeri/7925.jpg");
animation-delay: 6s;
}
.slideshow li:nth-child(3) span {
background-image: url("../img/galeri/0414.jpg");
animation-delay: 12s;
}
.slideshow li:nth-child(4) span {
background-image: url("../img/galeri/7815.jpg");
animation-delay: 18s;
}
.slideshow li:nth-child(5) span {
background-image: url("../img/galeri/0429.jpg");
animation-delay: 24s;
}
.araclar {
background: linear-gradient(to left, #1d60b5, #77afff);
text-align: center;
}
.araclar a {
display: inline-block;
color: white;
font: 600 32px "Montserrat", sans-serif;
animation: important 2s infinite ease-in-out;
}
.araclar a:hover {
animation-play-state: paused;
font-style: italic;
color: #01003B;
}
@media screen and (max-width: 850px) {
.araclar a {
margin: 1.5vh 1vw;
}
}
.table {
@@ -42,24 +130,6 @@
display: inline-flex;
flex-direction: row;
}
.table .table-item p {
font: x-large sans-serif;
}
@media screen and (max-width: 1100px) {
.table .table-item p {
font-size: large;
}
}
@media screen and (max-width: 850px) {
.table .table-item p {
font-size: 18px;
}
}
@media screen and (max-width: 400px) {
.table .table-item p {
font-size: 16px;
}
}
.table .table-item img {
align-self: center;
margin-right: 20px;
@@ -212,7 +282,7 @@
flex-direction: row;
align-items: center;
justify-content: space-between;
background: linear-gradient(to left, #1d60b5, #3b8fff);
background: linear-gradient(to left, #1d60b5, #77afff);
color: white;
}
.social p {
@@ -276,7 +346,7 @@ td {
.documents {
display: flex;
flex-direction: row;
background: linear-gradient(to left, #1d60b5, #3b8fff);
background: linear-gradient(to left, #1d60b5, #77afff);
}
.documents .document {
margin: 0 5vw 0 0;
@@ -456,12 +526,8 @@ h1 {
}
#video h1, #misyon h1, #vizyon h1, #hikaye h1, #yonetim h1 {
margin: 0 0 1em 0;
font: 600 2.5vw "Montserrat", sans-serif;
color: black;
}
#video p, #misyon p, #vizyon p, #hikaye p, #yonetim p {
font: 500 1.25vw "Montserrat", sans-serif;
}
#video ul, #misyon ul, #vizyon ul, #hikaye ul, #yonetim ul {
list-style-position: inside;
font-size: 1vw;
@@ -472,18 +538,34 @@ h1 {
flex-direction: column;
align-items: center;
color: white;
background: linear-gradient(to left, #1d60b5, #3b8fff);
background: linear-gradient(to left, #1d60b5, #77afff);
}
#video video {
width: 100% !important;
height: auto !important;
}
#hikaye section {
display: flex;
align-items: center;
}
#hikaye section figure img {
height: 25vw;
}
@media screen and (max-width: 1700px) {
#hikaye section {
flex-direction: column-reverse;
}
}
#hikaye .text-area {
flex-direction: column;
}
.sec-links-to-documents {
display: flex;
flex-direction: column;
align-items: center;
background: linear-gradient(to left, #1d60b5, #3b8fff);
background: linear-gradient(to left, #1d60b5, #77afff);
}
.sec-links-to-documents h1 {
font: 500 32px "Montserrat", sans-serif;
@@ -524,17 +606,6 @@ h1 {
}
}
@keyframes fullscreen-image-appear {
from {
opacity: 0;
width: 0;
height: 0;
}
to {
width: 100%;
height: 100vh;
}
}
#fullscreen {
margin: 0;
padding: 0;
@@ -554,7 +625,7 @@ h1 {
.gallery-text {
overflow: auto;
background: linear-gradient(to left, #1d60b5, #3b8fff);
background: linear-gradient(to left, #1d60b5, #77afff);
}
.gallery-text h1 {
margin: 2.5vh 0;
@@ -674,6 +745,13 @@ h1 {
height: 36px;
position: relative;
cursor: pointer;
-webkit-tap-highlight-color: transparent;
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
#header #toggle-label .bar {
padding: 0;
@@ -873,6 +951,20 @@ a:active {
}
}
.content-spacing-small {
padding: 50px 100px;
}
@media screen and (max-width: 1100px) {
.content-spacing-small {
padding: 25px 50px;
}
}
@media screen and (max-width: 850px) {
.content-spacing-small {
padding: 5px 10px;
}
}
.ignore-vertical {
padding-top: 0;
padding-bottom: 0;
@@ -898,6 +990,44 @@ a:active {
color: inherit;
}
.paragraph {
font: 500 x-large "Montserrat", sans-serif;
}
@media screen and (max-width: 1100px) {
.paragraph {
font-size: large;
}
}
@media screen and (max-width: 850px) {
.paragraph {
font-size: 18px;
}
}
@media screen and (max-width: 400px) {
.paragraph {
font-size: 16px;
}
}
.heading {
font: 600 50px "Montserrat", sans-serif;
}
@media screen and (max-width: 1100px) {
.heading {
font-size: 35px;
}
}
@media screen and (max-width: 850px) {
.heading {
font-size: 25px;
}
}
@media screen and (max-width: 400px) {
.heading {
font-size: 20px;
}
}
#header {
position: sticky;
top: 0;
@@ -910,19 +1040,22 @@ a:active {
}
}
.dropdown {
#drawer {
position: fixed;
bottom: 0;
right: 0;
z-index: 2;
background: linear-gradient(to left bottom, #1d60b5, #003e86);
width: 100%;
width: 0;
height: 90vh;
-webkit-animation: drawer-open 550ms;
animation: drawer-open 550ms;
display: flex;
flex-direction: column;
align-items: center;
transition: width 500ms;
}
.dropdown .dropdown-nav-item {
#drawer .drawer-item {
position: relative;
opacity: 0;
margin-top: 50px;
background: linear-gradient(#FFFFFF, #adf0ff);
-webkit-background-clip: text;
@@ -930,13 +1063,12 @@ a:active {
color: transparent;
font: 600 28px "Montserrat", sans-serif;
text-decoration: none;
-webkit-animation: navbar-appear 550ms;
animation: navbar-appear 550ms;
transition: opacity 250ms ease-in-out;
}
.dropdown .dropdown-nav-item:first-of-type {
#drawer .drawer-item:first-of-type {
margin-top: 100px;
}
.dropdown .dropdown-nav-item:after {
#drawer .drawer-item:after {
content: "";
position: absolute;
width: 100%;
@@ -948,114 +1080,23 @@ a:active {
transform-origin: bottom right;
transition: transform 0.25s ease-out;
}
.dropdown .dropdown-nav-item:hover:after {
#drawer .drawer-item:hover:after {
transform: scaleX(1);
transform-origin: bottom left;
}
#drawer .drawer-item.visible {
opacity: 1;
}
#drawer.expanded {
width: 100%;
top: unset;
}
@media screen and (max-width: 850px) {
.dropdown {
#drawer {
height: calc(100vh - 45px);
}
}
.dropdown_close_animation {
-webkit-animation: drawer-close 550ms;
animation: drawer-close 550ms;
}
.dropdown-nav-item_close_animation {
-webkit-animation: navbar-disappear 550ms;
animation: navbar-disappear 550ms;
}
@-webkit-keyframes drawer-close {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
visibility: hidden;
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@keyframes drawer-close {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
visibility: hidden;
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@-webkit-keyframes drawer-open {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
visibility: visible;
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes drawer-open {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
visibility: visible;
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes navbar-appear {
from {
opacity: 0;
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
opacity: 1;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes navbar-appear {
from {
opacity: 0;
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
opacity: 1;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes navbar-disappear {
from {
opacity: 1;
}
to {
opacity: 0;
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@keyframes navbar-disappear {
from {
opacity: 1;
}
to {
opacity: 0;
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
#container {
min-height: 90vh;
display: grid;
@@ -1069,6 +1110,9 @@ a:active {
min-height: calc(100vh - 45px);
}
}
#container.hidden {
display: none;
}
#content {
background: whitesmoke;
@@ -1080,7 +1124,6 @@ a:active {
#scroll-to-top {
width: 50px;
height: 50px;
display: none;
position: fixed;
right: 25px;
bottom: 55px;
@@ -1089,6 +1132,7 @@ a:active {
border: none;
border-radius: 50%;
background-color: #1d60b5;
box-shadow: white 0 0 50px -5px;
}
#scroll-to-top img {
height: 100%;

View File

@@ -16,8 +16,8 @@
<ul>
<li><a href="hakkimizda.html#misyon">Misyonumuz</a></li>
<li><a href="hakkimizda.html#vizyon">Vizyonumuz</a></li>
<li><a href="hakkimizda.html#yonetim">Yönetim</a></li>
<li><a href="aydinlatma.html">KVKK Aydınlatma Metni</a></li>
<li><a href="galeri.html">Fotoğraf Galerisi</a></li>
<li><a href="aydinlatma.html">Aydınlatma Metni</a></li>
<li><a href="kamera.html">Kamera Kullanımı</a></li>
</ul>
</div>