Commit a18c5d0c authored by Jonas Heinrich's avatar Jonas Heinrich

refine styling about page

parent 92bc6370
<html>
<body>
<div class="description">
<h2>Herzlich Willkommen zu Ausstellung-Virtuell</h2>
<p class="prose-big">Bla bla</p>
<h2>Über das Projekt</h2>
Unsere Virtuelle-Ausstellung beginnt mit velit magni aliquid minus. Repellendus et harum consectetur alias ad. Suscipit vel assumenda quia similique et quia doloribus. Maiores sed animi voluptate et perferendis eum quia. Et est veniam temporibus quia ipsa repudiandae autem quo. Sed harum assumenda accusantium mollitia.
</div>
<section class="grid">
......@@ -92,11 +92,18 @@
</span>
</section>
<div class="description">
Wir danken auch:
<a href=https://www.zak.kit.edu target=new><img src="images/logo_zak_whitened.png" width=100%></a>
<a href=https://www.kit.edu target=new><img src="images/logo_kit_whitened.png" width=100%></a>
<div class="description">
<h2>Partner</h2>
Unsere Virtuelle-Ausstellung beginnt mit velit magni aliquid minus. Repellendus et harum consectetur alias ad. Suscipit vel assumenda quia similique et quia doloribus. Maiores sed animi voluptate et perferendis eum quia. Et est veniam temporibus quia ipsa repudiandae autem quo. Sed harum assumenda accusantium mollitia.
<br><br><br><br>
<a href=https://www.zak.kit.edu target=new><img src="images/logo_zak_whitened.png" width=100%></a>
<a href=https://www.kit.edu target=new><img src="images/logo_kit_whitened.png" width=50%></a>
</div>
<div class="description">
<h2>Impressum</h2>
Unsere Virtuelle-Ausstellung beginnt mit velit magni aliquid minus. Repellendus et harum consectetur alias ad. Suscipit vel assumenda quia similique et quia doloribus. Maiores sed animi voluptate et perferendis eum quia. Et est veniam temporibus quia ipsa repudiandae autem quo. Sed harum assumenda accusantium mollitia.
</div>
</div>
</body>
</html>
......@@ -78,54 +78,6 @@ h2 {
line-height: 60px;
}
.grid {
display: flex;
flex-wrap: wrap;
align-items: stretch;
position: relative;
overflow: hidden;
text-align: center;
user-select: none;
justify-content: center;
}
.grid__item {
position: relative;
width: 140px;
padding-left: 1em;
padding-right: 1em;
padding-top: 0;
padding-bottom: 2em;
}
.profile-img {
border-radius: 50%;
height: 0;
padding-bottom: 100%;
}
.clip {
overflow: hidden;
}
.meta {
position: relative;
margin: 10px 0 0;
padding: 0 0px 0 0;
text-align: center;
}
.center {
text-align: center;
}
.meta__title {
font-size: .95em;
font-weight: bold;
margin: 0;
padding: .4em 0 .1em;
}
h3 {
font-size: 16px;
line-height: 20px;
......@@ -137,21 +89,6 @@ h1, h2, h3, h4, h5, h6 {
margin: 0;
}
.overview {
display: flex;
}
.small {
font-size: 12px;
line-height: 20px;
letter-spacing: 0;
}
.dark .quiet {
color: #7f7f7f;
color: rgba(255,255,255,.5);
}
@media only screen and (max-device-width: 480px) {
.container {
......
.video-grid {
display: flex;
flex-direction: column;
padding: 0 7% 0 8%;
padding: 0 7% 35px 8%;
margin: auto;
}
.video-item {
......
......@@ -7,6 +7,7 @@
<title>Ausstellung-Virtuell | Folge und Varianz</title>
<link rel="stylesheet" type="text/css" href="css/main.css">
<link rel="stylesheet" type="text/css" href="css/overview.css">
<link rel="stylesheet" type="text/css" href="css/about.css">
<link rel="stylesheet" type="text/css" href="css/mapbox-gl-0.43.0.css">
<link rel="stylesheet" type="text/css" href="css/videre.css">
<link rel="stylesheet" href="https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css">
......@@ -28,7 +29,7 @@
</ul>
</navigation>
<map>
<div id='map' style='width: 100%; height: 100%;'></div>
<!-- <div id='map' style='width: 100%; height: 100%;'></div> -->
</map>
<content>
......
......@@ -41,6 +41,21 @@
<span class="video-title">Chapter 28</span>
<p class="video-description">Molestiae odio amet iste recusandae voluptate officia magni. Sed totam fugit repellat rerum. Consectetur veritatis dolor eveniet.</span>
</div>
<div class="video-item">
<div class="video-img" style="background-image: url('video/video1.png');"></div>
<span class="video-title">Chapter 28</span>
<p class="video-description">Molestiae odio amet iste recusandae voluptate officia magni. Sed totam fugit repellat rerum. Consectetur veritatis dolor eveniet.</span>
</div>
<div class="video-item">
<div class="video-img" style="background-image: url('video/video1.png');"></div>
<span class="video-title">Chapter 28</span>
<p class="video-description">Molestiae odio amet iste recusandae voluptate officia magni. Sed totam fugit repellat rerum. Consectetur veritatis dolor eveniet.</span>
</div>
<div class="video-item">
<div class="video-img" style="background-image: url('video/video1.png');"></div>
<span class="video-title">Chapter 28</span>
<p class="video-description">Molestiae odio amet iste recusandae voluptate officia magni. Sed totam fugit repellat rerum. Consectetur veritatis dolor eveniet.</span>
</div>
</section>
<script src="js/main.js"></script>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment