Bladeren bron

Загрузить файлы ''

Keanu 1 jaar geleden
bovenliggende
commit
95b2c62baa
4 gewijzigde bestanden met toevoegingen van 208 en 0 verwijderingen
  1. 90 0
      Beauty.css
  2. 118 0
      Videotyan.html
  3. BIN
      car.jpg
  4. BIN
      icon.ico

+ 90 - 0
Beauty.css

@@ -0,0 +1,90 @@
+body {
+	background-color: #f4f4f4;
+	font-family: Arial, sans-serif;
+}
+
+.tab {
+	display: flex;
+	flex-wrap: wrap;
+	background-color: #fff;
+	box-shadow: 0px 0px 5px rgba(0,0,0,0.3);
+	position: relative;
+	z-index: 1;
+}
+
+.tab button {
+	display: block;
+	padding: 10px 15px;
+	color: #666;
+	background-color: #fff;
+	border: none;
+	box-shadow: 0px 0px 5px rgba(0,0,0,0.1);
+	font-size: 16px;
+	font-weight: bold;
+	text-transform: uppercase;
+	transition: all 0.3s ease;
+}
+
+.tab button.active {
+	background-color: #007bff;
+	color: #fff;
+	box-shadow: none;
+}
+
+.tabcontent {
+	display: none;
+	background-color: #fff;
+	padding: 30px;
+	box-shadow: 0px 0px 5px rgba(0,0,0,0.3);
+	position: absolute;
+	top: 50px;
+	left: 0;
+	right: 0;
+	z-index: -1;
+}
+
+.tabcontent.active {
+	display: block;
+}
+
+form label {
+	display: block;
+	margin-bottom: 10px;
+}
+
+form input:not([type="submit"]), form textarea {
+	width: 100%;
+	padding: 10px;
+	border: none;
+	box-shadow: 0px 0px 5px rgba(0,0,0,0.1);
+	margin-bottom: 20px;
+}
+
+form input[type="submit"] {
+	background-color: #007bff;
+	color: #fff;
+	padding: 10px 20px;
+	border: none;
+	cursor: pointer;
+}
+
+form input[type="submit"]:hover {
+	background-color: #0056b3;
+}
+
+form input:invalid, form textarea:invalid {
+	border-color: #dc3545;
+}
+
+form input:focus:invalid, form textarea:focus:invalid {
+	outline: none;
+}
+
+form input[type="date"]::-webkit-inner-spin-button {
+	display: none;
+}
+
+body {
+    background-image: url('Assets/car.jpg');
+    background-size: cover;
+}

+ 118 - 0
Videotyan.html

@@ -0,0 +1,118 @@
+<!DOCTYPE html>
+<html>
+<head>
+	<title>Videotyan</title>
+	<meta charset="UTF-8">
+	<link rel="shortcut icon" href="icon.ico" type="image/x-icon">
+    <link rel="stylesheet" href="Beauty.css">
+	<style>
+		.tab {
+			overflow: hidden;
+			background-color: #f1f1f1;
+		}
+
+		.tab button {
+			background-color: inherit;
+			border: none;
+			outline: none;
+			cursor: pointer;
+			padding: 14px 16px;
+			transition: 0.3s;
+			font-size: 17px;
+		}
+
+		.tab button:hover {
+			background-color: #ddd;
+		}
+
+		.tab button.active {
+			background-color: #ccc;
+		}
+
+		.tabcontent {
+			display: none;
+			padding: 6px 12px;
+			border: 1px solid #ccc;
+			border-top: none;
+		}
+	</style>
+</head>
+<body>
+
+	<div class="tab">
+		<button class="tablinks" onclick="openTab(event, 'home')">Главная</button>
+		<button class="tablinks" onclick="openTab(event, 'about')">О компании</button>
+	</div>
+
+	<div id="home" class="tabcontent">
+		<h3>Добро пожаловать на главную страницу сайта ВидеоТян</h3>
+		<p>Наше приложение поможет найти нужных специалистов, чтобы написать сценарий, снять и смонтировать видео различной степени сложности *(например, видео о путешествиях, рекламные видео, трейлер для сериала и многое другое)*.
+			Всё что от вас нужно - это наличие идеи для видео. Наше приложение подберет для вас специалистов под ваши задачи
+			(съемка локации, озвучка текста, монтаж видеоролика и т.д).</p>
+        <h4>Оставьте заявку</h4>
+        <form>
+        <label for="name">ФИО:</label>
+        <input type="text" id="name" name="name" required>
+
+        <label for="phone">Контактный телефон:</label>
+        <input type="tel" id="phone" name="phone" required>
+
+        <label for="email">Адрес почты:</label>
+        <input type="email" id="email" name="email" required>
+
+        <label for="company">Название компании:</label>
+        <input type="text" id="company" name="company" required>
+
+        <label for="project-description">Описание проекта:</label>
+        <textarea id="project-description" name="project-description" rows="4" cols="50" required></textarea>
+
+        <label for="budget">Бюджет проекта:</label>
+        <input type="number" id="budget" name="budget" required>
+
+        <label for="deadline">Сроки реализации:</label>
+        <input type="date" id="deadline" name="deadline" required>
+
+        <input type="submit" value="Отправить">
+        </form>
+	</div>
+
+	<div id="about" class="tabcontent">
+		<h3>О нашей компании</h3>
+		<p>Мы - команда студентов, создавшая это приложение в рамках учебного проекта. 
+			Наша цель - помочь людям в создании видео различной сложности, будь то рекламные ролики или видео о путешествиях. 
+			Мы собрали команду лучших специалистов, готовых помочь вам в создании видео - от съемки до монтажа. Наше приложение поможет 
+			вам легко и быстро найти идеальных специалистов для вашего проекта. С нами ваше видео будет выглядеть профессионально и качественно!</p>
+
+        <h4>Партнеры компании</h4>
+        <p>Мы являемся готовыми сотрудничать с различными компаниями и организациями, 
+			чтобы предоставлять нашим клиентам еще больше возможностей. Ниже приведены некоторые из наших партнеров:
+
+			- Фотостудия "Кадр"
+			- Агентство контента "Contento"
+			- Туроператор "Путешествуй с нами"
+			- Медиа-агентство "ProMotion"</p>
+			
+        <h4>Контакты</h4>
+        <p> - Адрес: ул. Пушкина, д. 10, офис 15
+			- Электронная почта: [info@videoteam.ru](mailto:info@videoteam.ru)
+			- Телефон: +7 (495) 123-45-67</p>
+	</div>
+
+	<script>
+		function openTab(evt, tabName) {
+			let i, tabcontent, tablinks;
+			tabcontent = document.getElementsByClassName("tabcontent");
+			for (i = 0; i < tabcontent.length; i++) {
+				tabcontent[i].style.display = "none";
+			}
+			tablinks = document.getElementsByClassName("tablinks");
+			for (i = 0; i < tablinks.length; i++) {
+				tablinks[i].className = tablinks[i].className.replace(" active", "");
+			}
+			document.getElementById(tabName).style.display = "block";
+			evt.currentTarget.className += " active";
+		}
+	</script>
+
+</body>
+</html>

BIN
car.jpg


BIN
icon.ico