Defectum/Site_Vologda
3
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Version 2

Browse Source
This commit is contained in:
Петухова Ростислава
2023-10-31 19:39:28 +03:00
parent 648dba0a50
commit c5b1b7125f
12 changed files with 200 additions and 126 deletions
Download Patch File Download Diff File Expand all files Collapse all files

BIN
site/favicon.ico Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 386 KiB

96
site/index.html
View File

@@ -1,51 +1,28 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="ru"> <html lang="ru">
<head> <head>
<link rel="stylesheet" href="style/textFont.css"> <link rel="stylesheet" href="/style/textFont.css">
<link rel="stylesheet" href="style/background.css"> <link rel="stylesheet" href="/style/background.css">
<link rel="stylesheet" href="style/buttonStyle.css"> <link rel="stylesheet" href="/style/buttonStyle.css">
<link rel="stylesheet" href="style/backgroundEffect.css"> <link rel="stylesheet" href="/style/backgroundEffect.css">
<meta charset="utf-8" /> <link rel="icon" href="/favicon.ico">
<meta charset="utf-8"/>
<title>Site</title> <title>Site</title>
<script type="text/javascript" charset="utf-8" src="https://api-maps.yandex.ru/services/constructor/1.0/js/?um=constructor%3Abac1416c747a6867070208e3a71fefae060843d99a9cd9f4c84fc00cb6aba4f0&amp;id=mymap&amp;lang=ru_RU&amp;apikey=<API-ключ>"></script>
<!-- HTML loader script -->
<script type="text/javascript" charset="utf-8" src="/scripts/w3-include.js"></script>
<!--VOLOGDA MAPS-->
<script type="text/javascript" charset="utf-8" src="https://api-maps.yandex.ru/services/constructor/1.0/js/?um=constructor%3Abac1416c747a6867070208e3a71fefae060843d99a9cd9f4c84fc00cb6aba4f0&amp;id=AttractionsMap&amp;lang=ru_RU&amp;apikey=<API-ключ>"></script>
<!-- <script type="text/javascript" charset="utf-8" src="https://api-maps.yandex.ru/services/constructor/1.0/js/?um=constructor%3Adff641cfd3a15a83ae8bfb686cf24c228c2737343f7aa7ea54e39ad42c100ead&amp;id=RestaurantsMap&amp;lang=ru_RU&amp;apikey=<API-ключ>"></script> -->
</head> </head>
<body> <body>
<div class="snowflakes"> <!-- SNOWFLAKES -->
<div class="snowflake"> <div w3-include-html="/style/snowflakes.html"></div>
В ВОЛОГДЕ ВКУСНОЕ МОЛОКО !
</div>
<div class="snowflake">
ВОЛОГДА СУПЕР !
</div>
<div class="snowflake">
ГДЕ ? В ВОЛОГДЕ !
</div>
<div class="snowflake">
КРУЖЕВА ПРОСТО КЛАСС !
</div>
<div class="snowflake">
МАСЛО ЛУЧШЕЕ !
</div>
<div class="snowflake">
В ВОЛОГДЕ КЛАСС !
</div>
<div class="snowflake">
В ВОЛОГДЕ ПРЕКРАСНО!
</div>
<div class="snowflake">
ВОЛОГДА СУПЕР !
</div>
<div class="snowflake">
ВОЛОГДА!
</div>
</div>
<!--HEADER --> <!--HEADER -->
<header> <div w3-include-html="/style/header.html"></div>
<p class="titleText">Вологда путешествия</p>
</header>
<div class="postHeader"></div>
<!--VOLOGDA DESCRIPTION--> <!--VOLOGDA DESCRIPTION-->
<div class="vologdaDescription"> <div class="vologdaDescription">
@@ -53,49 +30,16 @@
</div> </div>
<!--ATTRACTIONS--> <!--ATTRACTIONS-->
<div id="mymap" class="vologdaMap"> <div id="AttractionsMap" class="vologdaMap">
<p class="titleText">Достопримечательности Вологды</p> <p class="titleText">Достопримечательности Вологды</p>
</div> </div>
<div class="vologdaPlace"> <div w3-include-html="/pages/attractions.html"></div>
<p class="titleText">Места которые стоит посетить в первую очередь</p>
<div class="button-grid">
<div>
<a href="https://yandex.ru/profile/1013241328?no-distribution=1&source=wizbiz_new_map_single&ysclid=lo71yg4axi242363857"><button class="image-button" style="background-image: url('https://avatars.mds.yandex.net/get-altay/1909414/2a0000016ae3289d21e668710123484a2ba4/XXXL');"></button></a>
<p class="normalText">Музей заповедник</p>
</div>
<div>
<a href="https://yandex.ru/maps/org/pamyatnik_bukve_o/53849898478/?ll=39.884983%2C59.224170&z=16"><button class="image-button" style="background-image: url('https://avatars.mds.yandex.net/get-altay/10703420/2a0000018aa8a9bc716ee91011ad8e39d9d3/XXXL');"></button></a>
<p class="normalText">Памятник букве О</p>
</div>
<div>
<a href="https://yandex.ru/maps/org/kosmonavtu_p_i_belyayevu/72397562391/?ll=39.876151%2C59.219917&z=17"><button class="image-button" style="background-image: url('https://avatars.mds.yandex.net/get-altay/9663145/2a00000189fcf8d098873379888732ea442f/XXXL');"></button></a>
<p class="normalText">Парк заповедник</p>
</div>
<div>
<a href="https://yandex.ru/profile/223457860077"><button class="image-button" style="background-image: url('https://avatars.mds.yandex.net/get-altay/5099617/2a000001827c21670f508af692362e7074a5/XXXL');"></button></a>
<p class="normalText">Бульвар Пирогова</p>
</div>
<div>
<a href="https://yandex.ru/profile/3596464852"><button class="image-button" style="background-image: url('https://avatars.mds.yandex.net/get-altay/10589039/2a0000018aa9f71543a9c2c4fed3e048ce5a/XXXL');"></button></a>
<p class="normalText">Кремлёвский сад</p>
</div>
<div>
<a href="https://yandex.ru/maps/org/kosmonavtu_p_i_belyayevu/72397562391/?ll=39.876151%2C59.219917&z=17"><button class="image-button" style="background-image: url('https://avatars.mds.yandex.net/get-altay/4336337/2a0000017758c929f9c648c203c32557b43a/XXXL');"></button></a>
<p class="normalText">Парк заповедник</p>
</div>
</div>
</div>
<!--RESTAURANTS--> <!--RESTAURANTS-->
<!--FOOTER--> <!--FOOTER-->
<footer> <footer>
<div class="prevFooter"></div> <div class="prevFooter"></div>
@@ -103,5 +47,7 @@
<p class="miniText"> ©Defectum studio</p> <p class="miniText"> ©Defectum studio</p>
</div> </div>
</footer> </footer>
<!-- load all included html pages -->
<script>includeHTML();</script>
</body> </body>
</html> </html>

44
site/pages/attractions.html Normal file
View File

@@ -0,0 +1,44 @@
<div class="vologdaPlace">
<p class="titleText">Места которые стоит посетить в первую очередь</p>
<div class="button-grid">
<div>
<!-- <a href="https://yandex.ru/profile/1013241328?no-distribution=1&source=wizbiz_new_map_single&ysclid=lo71yg4axi242363857"><button class="image-button" style="background-image: url('https://avatars.mds.yandex.net/get-altay/1909414/2a0000016ae3289d21e668710123484a2ba4/XXXL');"></button></a> -->
<a href="/pages/Музей-заповедник.html"><button class="image-button" style="background-image: url('https://avatars.mds.yandex.net/get-altay/1909414/2a0000016ae3289d21e668710123484a2ba4/XXXL');"></button></a>
<p class="normalText">Музей заповедник</p>
</div>
<div>
<!-- <a href="https://yandex.ru/maps/org/pamyatnik_bukve_o/53849898478/?ll=39.884983%2C59.224170&z=16"><button class="image-button" style="background-image: url('https://avatars.mds.yandex.net/get-altay/10703420/2a0000018aa8a9bc716ee91011ad8e39d9d3/XXXL');"></button></a> -->
<a href="/pages/Памятник букве О.html"><button class="image-button" style="background-image: url('https://avatars.mds.yandex.net/get-altay/10703420/2a0000018aa8a9bc716ee91011ad8e39d9d3/XXXL');"></button></a>
<p class="normalText">Памятник букве О</p>
</div>
<div>
<!-- <a href="https://yandex.ru/maps/org/kosmonavtu_p_i_belyayevu/72397562391/?ll=39.876151%2C59.219917&z=17"><button class="image-button" style="background-image: url('https://avatars.mds.yandex.net/get-altay/9663145/2a00000189fcf8d098873379888732ea442f/XXXL');"></button></a> -->
<a href="/pages/Парк заповедник.html"><button class="image-button" style="background-image: url('https://avatars.mds.yandex.net/get-altay/9663145/2a00000189fcf8d098873379888732ea442f/XXXL');"></button></a>
<p class="normalText">Парк заповедник</p>
</div>
<div>
<!-- <a href="https://yandex.ru/profile/223457860077"><button class="image-button" style="background-image: url('https://avatars.mds.yandex.net/get-altay/5099617/2a000001827c21670f508af692362e7074a5/XXXL');"></button></a> -->
<a href="/pages/Бульвар Пирогова.html"><button class="image-button" style="background-image: url('https://avatars.mds.yandex.net/get-altay/5099617/2a000001827c21670f508af692362e7074a5/XXXL');"></button></a>
<p class="normalText">Бульвар Пирогова</p>
</div>
<div>
<!-- <a href="https://yandex.ru/profile/3596464852"><button class="image-button" style="background-image: url('https://avatars.mds.yandex.net/get-altay/10589039/2a0000018aa9f71543a9c2c4fed3e048ce5a/XXXL');"></button></a> -->
<a href="/pages/Кремлёвский сад.html"><button class="image-button" style="background-image: url('https://avatars.mds.yandex.net/get-altay/10589039/2a0000018aa9f71543a9c2c4fed3e048ce5a/XXXL');"></button></a>
<p class="normalText">Кремлёвский сад</p>
</div>
<div>
<!-- <a href="https://yandex.ru/maps/org/kosmonavtu_p_i_belyayevu/72397562391/?ll=39.876151%2C59.219917&z=17"><button class="image-button" style="background-image: url('https://avatars.mds.yandex.net/get-altay/4336337/2a0000017758c929f9c648c203c32557b43a/XXXL');"></button></a> -->
<a href="/pages/Парк заповедник.html"><button class="image-button" style="background-image: url('https://avatars.mds.yandex.net/get-altay/4336337/2a0000017758c929f9c648c203c32557b43a/XXXL');"></button></a>
<p class="normalText">Парк заповедник</p>
</div>
</div>
</div>

42
site/pages/Музей-заповедник.html Normal file
View File

@@ -0,0 +1,42 @@
<!DOCTYPE html>
<html lang="ru">
<head>
<link rel="stylesheet" href="/style/textFont.css">
<link rel="stylesheet" href="/style/background.css">
<link rel="stylesheet" href="/style/buttonStyle.css">
<link rel="stylesheet" href="/style/backgroundEffect.css">
<link rel="icon" href="/favicon.ico">
<meta charset="utf-8"/>
<title>Site</title>
<!-- HTML loader script -->
<script type="text/javascript" charset="utf-8" src="/scripts/w3-include.js"></script>
<!--VOLOGDA MAPS-->
<script type="text/javascript" charset="utf-8" src="https://api-maps.yandex.ru/services/constructor/1.0/js/?um=constructor%3Abac1416c747a6867070208e3a71fefae060843d99a9cd9f4c84fc00cb6aba4f0&amp;id=AttractionsMap&amp;lang=ru_RU&amp;apikey=<API-ключ>"></script>
<!-- <script type="text/javascript" charset="utf-8" src="https://api-maps.yandex.ru/services/constructor/1.0/js/?um=constructor%3Adff641cfd3a15a83ae8bfb686cf24c228c2737343f7aa7ea54e39ad42c100ead&amp;id=RestaurantsMap&amp;lang=ru_RU&amp;apikey=<API-ключ>"></script> -->
</head>
<body>
<!-- SNOWFLAKES -->
<div w3-include-html="/style/snowflakes.html"></div>
<!--HEADER -->
<div w3-include-html="/style/header.html"></div>
<!--VOLOGDA DESCRIPTION-->
<div class="vologdaDescription">
<p class="normalText">Вологда – город, которые многие называют душой Русского Севера. Это родина вологодского масла и вологодского кружева, столица Опричнины и кладезь исторических достопримечательностей. Это город древний – с девятивековой историей, богатый – с более чем двумястами памятниками культуры и архитектуры, самобытный и живописный.</p>
</div>
<!--FOOTER-->
<footer>
<div class="prevFooter"></div>
<div class = "postFooter">
<p class="miniText"> ©Defectum studio</p>
</div>
</footer>
<!-- load all included html pages -->
<script>includeHTML();</script>
</body>
</html>

27
site/scripts/w3-include.js Normal file
View File

@@ -0,0 +1,27 @@
function includeHTML() {
var z, i, elmnt, file, xhttp;
/* Loop through a collection of all HTML elements: */
z = document.getElementsByTagName("*");
for (i = 0; i < z.length; i++) {
elmnt = z[i];
/*search for elements with a certain atrribute:*/
file = elmnt.getAttribute("w3-include-html");
if (file) {
/* Make an HTTP request using the attribute value as the file name: */
xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4) {
if (this.status == 200) {elmnt.innerHTML = this.responseText;}
if (this.status == 404) {elmnt.innerHTML = "Page not found.";}
/* Remove the attribute, and call this function once more: */
elmnt.removeAttribute("w3-include-html");
includeHTML();
}
}
xhttp.open("GET", file, true);
xhttp.send();
/* Exit the function: */
return;
}
}
}

52
site/style/background.css
View File

@@ -1,33 +1,27 @@
html {
scroll-behavior: smooth;
}
header{ header{
position: fixed; position: fixed;
margin: 0 auto; margin: 0 auto;
left: 0; left: 0;
top: 0; top: 0;
height: calc(var(--boxHeight) * 1.5);
width: 100%; width: 100%;
z-index: 2; z-index: 2;
}
.prevHeader{
background-color: var(--headerBoxColor); background-color: var(--headerBoxColor);
overflow: hidden; overflow: hidden;
} }
.postHeader{ .postHeader{
position: fixed; height: calc(var(--boxHeight) * 0.3);
margin: 0 auto; background-color: var(--postHeaderBoxColor);
left: 0;
top: 0;
margin-top: calc(var(--boxHeight) * 1.5);
height: calc(var(--boxHeight) * 0.2);
width: 100%;
z-index: 2;
border-bottom-right-radius: 1vw;
border-bottom-left-radius: 1vw; border-bottom-left-radius: 1vw;
border-bottom-right-radius: 1vw;
background-color: var(--postHeaderBoxColor);
overflow: hidden;
} }
body{ body{
@@ -36,11 +30,10 @@
.vologdaDescription{ .vologdaDescription{
position:relative; position:relative;
left: calc(100% - (50% + var(--blockSize)/2)); margin: auto;
margin-top: calc(var(--boxHeight) * 2.2); margin-top: 10%;
width: var(--blockSize); width: var(--blockSize);
height: calc(var(--boxHeight) * 2.8);
text-align: center; text-align: center;
@@ -51,11 +44,11 @@
.vologdaPlace{ .vologdaPlace{
position:relative; position:relative;
left: calc(100% - (50% + var(--blockSize)/2)); margin: auto;
width: var(--blockSize); width: var(--blockSize);
margin-top: 6vw; margin-top: 6vw;
height: calc(var(--boxHeight) * 10); height: 25%;
text-align: center; text-align: center;
@@ -66,11 +59,11 @@
.vologdaMap{ .vologdaMap{
position:relative; position:relative;
left: calc(100% - (50% + var(--blockSize)/2)); margin: auto;
margin-top: var(--vologdaBoxMargin); margin-top: var(--vologdaBoxMargin);
width: var(--blockSize); width: var(--blockSize);
height: calc(var(--boxHeight) * 8); height: 30vw;
text-align: center; text-align: center;
@@ -101,8 +94,6 @@
} }
.postFooter{ .postFooter{
height: calc(var(--boxHeight) * 1);
border-bottom-right-radius: 1vw; border-bottom-right-radius: 1vw;
border-bottom-left-radius: 1vw; border-bottom-left-radius: 1vw;
background-color: var(--headerBoxColor); background-color: var(--headerBoxColor);
@@ -118,17 +109,8 @@
--bodyBoxColor:rgb(255, 255, 255); --bodyBoxColor:rgb(255, 255, 255);
--vologdaBoxMargin: 6vw; --vologdaBoxMargin: 6vw;
--blockSize: 40vw; --blockSize: 50vw;
--vologdaBoxColor: rgb(177, 250, 250); --vologdaBoxColor: rgb(177, 250, 250);
--boxHeight: 3.1vw; --boxHeight: 3.1vw;
}
@media screen and (max-width: 980px) {
:root {
--vologdaBoxMargin: 12vw;
--blockSize: 80vw;
--boxHeight: 6.2vw;
}
} }

12
site/style/buttonStyle.css
View File

@@ -2,9 +2,9 @@
.button-grid { .button-grid {
display: grid; display: grid;
display: grid; display: grid;
grid-template-columns: 2fr 0.1fr 2fr; grid-template-columns: 4fr 4fr 4fr;
grid-template-rows: calc(11vw * var(--sizeButton)) calc(11vw * var(--sizeButton)) calc(11vw * var(--sizeButton)); grid-template-rows: 4fr 4fr;
grid-gap: calc(2vw * var(--sizeButton)); grid-gap: 4fr;
} }
.image-button { .image-button {
@@ -35,10 +35,4 @@
:root { :root {
--sizeButton: 1; --sizeButton: 1;
}
@media screen and (max-width: 980px) {
:root {
--sizeButton: 2;
}
} }

6
site/style/header.html Normal file
View File

@@ -0,0 +1,6 @@
<header>
<div class="prevHeader">
<p class="titleText">Вологда путешествия</p>
</div>
<div class="postHeader"></div>
</header>

29
site/style/snowflakes.html Normal file
View File

@@ -0,0 +1,29 @@
<div class="snowflakes">
<div class="snowflake">
В ВОЛОГДЕ ВКУСНОЕ МОЛОКО !
</div>
<div class="snowflake">
ВОЛОГДА СУПЕР !
</div>
<div class="snowflake">
ГДЕ ? В ВОЛОГДЕ !
</div>
<div class="snowflake">
КРУЖЕВА ПРОСТО КЛАСС !
</div>
<div class="snowflake">
МАСЛО ЛУЧШЕЕ !
</div>
<div class="snowflake">
В ВОЛОГДЕ КЛАСС !
</div>
<div class="snowflake">
В ВОЛОГДЕ ПРЕКРАСНО!
</div>
<div class="snowflake">
ВОЛОГДА СУПЕР !
</div>
<div class="snowflake">
ВОЛОГДА!
</div>
</div>

8
site/style/textFont.css
View File

@@ -21,11 +21,5 @@
} }
:root { :root {
--textSize: 1vw; --textSize: 1.2em;
}
@media screen and (max-width: 980px) {
:root {
--textSize: 2vw;
}
} }

3
Что на сайте.md
View File

@@ -3,3 +3,6 @@
- Где покушать - Где покушать
- Турагентсва - Турагентсва
- История Вологды - История Вологды
- Отели
Дополнительный index:

7
Что на сайте.txt Normal file
View File

@@ -0,0 +1,7 @@
Главная:
-достопромичетальности
-Где покушать
-Турагентсва
-История Вологды