fyb/ugurgaleri
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Commit with no name

Browse Source
This commit is contained in:
Ferit Yiğit BALABAN
2022-05-18 14:06:29 +03:00
parent 25a7fe7fcd
commit 1f9d2076f2
12 changed files with 210 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

42
index.html
View File

@@ -22,7 +22,47 @@
<h1>Merhaba!</h1>
</div>
<div id="right"></div> <!-- Intentionally blank -->
<footer id="footer"></footer>
<footer id="footer">
<div class="footer-column">
<h2>Uğur Galeri</h2>
<hr>
<a class="nav-item" href="index.html">Ana sayfa</a>
<a class="nav-item" href="https://ugurgaleri1.sahibinden.com/">Araçlarımız</a>
<a class="nav-item" href="hakkimizda.html">Hakkımızda</a>
<a class="nav-item" href="iletisim.html">İletişim</a>
</div>
<div class="footer-column">
<h2>Çalışma Saatlerimiz</h2>
<hr>
<p>Hafta İçi: 09:00 - 18:00</p>
<p>Cumartesi: 09:00 - 19:30</p>
<p>Pazar: 12:00 - 17:00</p>
</div>
<div class="footer-column">
<h2>İletişim Bilgilerimiz</h2>
<hr>
</div>
<div class="footer-column">
<h2>Sosyal Medya Hesaplarımız</h2>
<hr>
<a class="footer-social" href="https://www.arabam.com/galeri/yavuz-ugur-galeri">
<img src="resources/imgs/arabam.jpg" alt="arabam.com logosu">
<p>Arabam.com Hesabımız</p>
</a>
<a class="footer-social" href="https://ugurgaleri1.sahibinden.com/">
<img src="resources/imgs/sahibinden.png" alt="sahibinden.com logosu">
<p>Sahibinden.com Hesabımız</p>
</a>
<a class="footer-social" href="https://www.facebook.com/ugurgalerikaracabey/">
<img src="resources/imgs/facebook.svg" alt="facebook.com logosu">
<p>Facebook Hesabımız</p>
</a>
<a class="footer-social" href="https://www.instagram.com/ugurgaleri/">
<img src="resources/imgs/instagram.png" alt="instagram.com logosu">
<p>Instagram Hesabımız</p>
</a>
</div>
</footer>
</div>
</body>
</html>

3
resources/css/main.scss
View File

@@ -6,6 +6,7 @@
html, body {
margin: 0;
padding: 0;
background-color: variables.$clr_sides;
}
#container {
@@ -24,7 +25,6 @@ html, body {
}
#left {
background: aqua;
grid-column: 1;
grid-row-start: 1;
grid-row-end: 3;
@@ -51,7 +51,6 @@ html, body {
}
#right {
background: aqua;
grid-column: 3;
grid-row-start: 1;
grid-row-end: 3;

67
resources/css/partials/footer.scss
View File

@@ -0,0 +1,67 @@
@use "../variables.scss";
#footer {
margin: 0;
display: flex;
justify-content: flex-start;
flex-direction: row;
align-items: flex-start;
padding: variables.$innerContainerMargin;
.footer-column {
color: aliceblue;
display: flex;
flex-direction: column;
margin: 0 20px 0 0;
h2 {
font: 22px "Montserrat", sans-serif;
font-weight: 600;
color: white;
margin-bottom: 0;
}
hr {
margin: 0 0 10px 0;
border: 1px dotted white;
}
a {
color: inherit;
text-decoration: none;
margin: 0 0 5px 0;
font: 16px "Montserrat", sans-serif;
font-weight: 500;
}
.footer-social {
display: inline-flex;
align-items: center;
border-radius: 5px;
img {
border-radius: 10px;
width: 35px;
height: 35px;
margin: 0 15px 0 0;
}
&:hover {
background: variables.$clr_nav_active;
color: black;
}
}
p {
font: 16px "Montserrat", sans-serif;
font-weight: 500;
color: inherit;
margin: 0;
}
&:last-of-type {
margin: 0;
}
}
}

11
resources/css/partials/header.scss
View File

@@ -2,6 +2,7 @@
@use "../mixins.scss";
#header {
background: variables.$clr_header;
display: flex;
flex-direction: row;
justify-content: space-between;
@@ -12,7 +13,10 @@
}
#logo {
font-family: "Montserrat", sans-serif;
font-weight: 700;
margin-left: variables.$innerContainerMargin;
color: variables.$clr_logo
}
.navbar {
@@ -20,8 +24,15 @@
.nav-item {
margin-right: variables.$innerContainerMargin;
font: 18px "Montserrat", sans-serif;
font-weight: 600;
color: variables.$clr_nav_sleep;
text-decoration: none;
&:hover {
color: variables.$clr_nav_active;
}
@include mixins.navbar_overflow {
&:last-of-type {
margin-right: 0;

13
resources/css/variables.scss
View File

@@ -4,4 +4,15 @@ $tablet: 768px;
$main: 1700px;
$fourK: 2560px;
$innerContainerMargin: 20px;
$innerContainerMargin: 20px;
$clr_header: #01003B;
$clr_logo: #D6FFFF;
$clr_nav_sleep: #A3C2C2;
$clr_nav_active: $clr_logo;
$clr_sides: #364040;
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@500&display=swap');
@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');

BIN
resources/fonts/Montserrat-Regular.woff2 Normal file
View File

Binary file not shown.

BIN
resources/imgs/arabam.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 6.8 KiB

7
resources/imgs/facebook.svg Normal file
View File

@@ -0,0 +1,7 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="256px" height="256px" viewBox="0 0 256 256" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" preserveAspectRatio="xMidYMid">
<g>
<path d="M241.871,256.001 C249.673,256.001 256,249.675 256,241.872 L256,14.129 C256,6.325 249.673,0 241.871,0 L14.129,0 C6.324,0 0,6.325 0,14.129 L0,241.872 C0,249.675 6.324,256.001 14.129,256.001 L241.871,256.001" fill="#395185"></path>
<path d="M176.635,256.001 L176.635,156.864 L209.912,156.864 L214.894,118.229 L176.635,118.229 L176.635,93.561 C176.635,82.375 179.742,74.752 195.783,74.752 L216.242,74.743 L216.242,40.188 C212.702,39.717 200.558,38.665 186.43,38.665 C156.932,38.665 136.738,56.67 136.738,89.736 L136.738,118.229 L103.376,118.229 L103.376,156.864 L136.738,156.864 L136.738,256.001 L176.635,256.001" fill="#FFFFFF"></path>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 898 B

BIN
resources/imgs/instagram.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.3 MiB

BIN
resources/imgs/sahibinden.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 12 KiB

72
styles/main.css
View File

@@ -1,4 +1,8 @@
@import url("https://fonts.googleapis.com/css2?family=Montserrat:wght@500&display=swap");
@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");
#header {
background: #01003B;
display: flex;
flex-direction: row;
justify-content: space-between;
@@ -10,24 +14,90 @@
}
}
#header #logo {
font-family: "Montserrat", sans-serif;
font-weight: 700;
margin-left: 20px;
color: #D6FFFF;
}
#header .navbar {
display: flex;
}
#header .navbar .nav-item {
margin-right: 20px;
font: 18px "Montserrat", sans-serif;
font-weight: 600;
color: #A3C2C2;
text-decoration: none;
}
#header .navbar .nav-item:hover {
color: #D6FFFF;
}
@media screen and (max-width: 550px) {
#header .navbar .nav-item:last-of-type {
margin-right: 0;
}
}
#footer {
margin: 0;
display: flex;
justify-content: flex-start;
flex-direction: row;
align-items: flex-start;
padding: 20px;
}
#footer .footer-column {
color: aliceblue;
display: flex;
flex-direction: column;
margin: 0 20px 0 0;
}
#footer .footer-column h2 {
font: 22px "Montserrat", sans-serif;
font-weight: 600;
color: white;
margin-bottom: 0;
}
#footer .footer-column hr {
margin: 0 0 10px 0;
border: 1px dotted white;
}
#footer .footer-column a {
color: inherit;
text-decoration: none;
margin: 0 0 5px 0;
font: 16px "Montserrat", sans-serif;
font-weight: 500;
}
#footer .footer-column .footer-social {
display: inline-flex;
align-items: center;
border-radius: 5px;
}
#footer .footer-column .footer-social img {
border-radius: 10px;
width: 35px;
height: 35px;
margin: 0 15px 0 0;
}
#footer .footer-column .footer-social:hover {
background: #D6FFFF;
color: black;
}
#footer .footer-column p {
font: 16px "Montserrat", sans-serif;
font-weight: 500;
color: inherit;
margin: 0;
}
#footer .footer-column:last-of-type {
margin: 0;
}
html, body {
margin: 0;
padding: 0;
background-color: #364040;
}
#container {
@@ -47,7 +117,6 @@ html, body {
}
#left {
background: aqua;
grid-column: 1;
grid-row-start: 1;
grid-row-end: 3;
@@ -73,7 +142,6 @@ html, body {
}
#right {
background: aqua;
grid-column: 3;
grid-row-start: 1;
grid-row-end: 3;

2
styles/main.css.map
View File

@@ -1 +1 @@
{"version":3,"sourceRoot":"","sources":["../resources/css/partials/header.scss","../resources/css/mixins.scss","../resources/css/variables.scss","../resources/css/main.scss"],"names":[],"mappings":"AAGA;EACE;EACA;EACA;EACA;;ACEA;EDNF;IAOI;;;AAGF;EACE,aERmB;;AFWrB;EACE;;AAEA;EACE,cEfiB;EFgBjB;;ACbJ;EDgBM;IACE;;;;AGrBV;EACE;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AFIA;EEXF;IAUI;IACA;;;;AAIJ;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;EACA;EAEA,SDpCqB;ECqCrB;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA","file":"main.css"}
{"version":3,"sourceRoot":"","sources":["../resources/css/variables.scss","../resources/css/partials/header.scss","../resources/css/mixins.scss","../resources/css/partials/footer.scss","../resources/css/main.scss"],"names":[],"mappings":"AAeQ;AACA;AACA;ACdR;EACE,YDIW;ECHX;EACA;EACA;EACA;;ACCA;EDNF;IAQI;;;AAGF;EACE;EACA;EACA,aDXmB;ECYnB,ODTO;;ACYT;EACE;;AAEA;EACE,cDnBiB;ECoBjB;EACA;EACA,ODlBU;ECmBV;;AAEA;EACE,ODvBG;;AEAT;ED2BM;IACE;;;;AElCV;EACE;EACA;EACA;EACA;EACA;EACA,SHHqB;;AGKrB;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;;AAGF;EACE;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;;AAGF;EACE,YHzCG;EG0CH;;AAIJ;EACE;EACA;EACA;EACA;;AAGF;EACE;;;AC1DN;EACE;EACA;EACA,kBJKU;;;AIFZ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AFGA;EEVF;IAUI;IACA;;;;AAIJ;EACE;EACA;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;EACA;EAEA,SJpCqB;EIqCrB;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;EACA;EACA","file":"main.css"}