Mercurial > dive4elements > website

changeset 0:20e1ebb86d9d

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
Laying out Repository
author Ariane Broermann <ariane@intevation.de>
date Tue, 28 Jan 2014 09:32:34 +0100
parents
children 9a344b2a8baf
files README css/style.css index.html
diffstat 3 files changed, 234 insertions(+), 0 deletions(-) [+]
line wrap: on
line diff
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/README	Tue Jan 28 09:32:34 2014 +0100
@@ -0,0 +1,12 @@
+Benötigte Bibliothek
+====================
+bootstrap-3.0.3
+
+Ordnerstruktur
+==============
+website/
+|- bootstrap-3.0.3/dist/- |- css/
+|- css/style.css          |- fonts/
+|- img/                   |- js/
+|- index.html
+|- README
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/css/style.css	Tue Jan 28 09:32:34 2014 +0100
@@ -0,0 +1,94 @@
+/* Space out content a bit */
+body {
+  padding-top: 20px;
+  padding-bottom: 20px;
+}
+.navbar {
+    margin-bottom: 20px;
+}
+
+/* Everything but the jumbotron gets side spacing for mobile first views */
+.navbar
+.marketing,
+.footer {
+  padding-left: 15px;
+  padding-right: 15px;
+}
+
+/* Custom page footer */
+.footer {
+  padding-top: 19px;
+  color: #777;
+  border-top: 1px solid #e5e5e5;
+}
+.row-offcanvas {
+        position: relative;
+            transition: all 0.25s ease-out 0s;
+}
+.row-offcanvas-right .sidebar-offcanvas {
+        right: -50%;
+}
+.row-offcanvas-left .sidebar-offcanvas {
+        left: -50%;
+}
+.row-offcanvas-right.active {
+        right: 50%;
+}
+.row-offcanvas-left.active {
+        left: 50%;
+}
+.sidebar-offcanvas {
+        position: absolute;
+        top: 0;
+        width: 50%;
+}
+/* Customize container */
+@media (min-width: 768px) {
+  .container {
+    max-width: 730px;
+  }
+}
+.container-narrow > hr {
+  margin: 30px 0;
+}
+.container p {
+    font-size: 15px;
+}
+/* Main marketing message and sign up button */
+.jumbotron {
+  text-align: center;
+  border-bottom: 1px solid #e5e5e5;
+}
+.jumbotron .btn {
+  font-size: 21px;
+  padding: 14px 24px;
+}
+
+/* Supporting marketing content */
+.marketing {
+  margin: 40px 0;
+}
+.marketing p + h4 {
+  margin-top: 28px;
+}
+
+
+/* Responsive: Portrait tablets and up */
+@media screen and (min-width: 768px) {
+  /* Remove the padding we set earlier */
+  .navbar,
+  .marketing,
+  .footer {
+    padding-left: 0;
+    padding-right: 0;
+  }
+  /* Space out the masthead */
+  .navbar {
+    margin-bottom: 30px;
+  }
+  /* Remove the bottom border on the jumbotron for visual effect */
+  .jumbotron {
+    border-bottom: 0;
+  }
+}
+
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/index.html	Tue Jan 28 09:32:34 2014 +0100
@@ -0,0 +1,128 @@
+<!DOCTYPE html>
+<html>
+    <head>
+        <title>Dive4Elements</title>
+        <meta name="viewport" content="width=device-width, initial-scale=1.0">
+        <meta charset="utf-8">
+        <meta name="description" content="">
+        <meta name="author" content="Ariane Brörmann">
+        <!-- Bootstrap -->
+        <link href="bootstrap-3.0.3/dist/css/bootstrap.min.css" rel="stylesheet">
+        
+        <!-- Custom styles for this template -->
+        <link href="css/style.css" rel="stylesheet">
+
+        <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
+        <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
+        <!--[if lt IE 9]>
+        <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
+        <script src="https://oss.maxcdn.com/libs/respond.js/1.3.0/respond.min.js"></script>
+        <![endif]-->
+    </head>
+    <body>
+        <div class="container">
+
+            <!-- Static navbar -->
+            <div class="navbar navbar-default" role="navigation">
+                <div class="navbar-header">
+                    <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
+                        <span class="sr-only">Toggle navigation</span>
+                        <span class="icon-bar"></span>
+                        <span class="icon-bar"></span>
+                        <span class="icon-bar"></span>
+                    </button>
+                    <a class="navbar-brand" href="#">Dive4Elements</a>
+                </div>
+                <div class="navbar-collapse collapse">
+                    <ul class="nav navbar-nav navbar-right">
+                        <li><a href="#">Kontakt</a></li>
+                    </ul>
+                </div>
+            </div><!-- /navbar -->
+
+            <div class="container">
+                <div class="row-offcanvas row-offcanvas-right">
+                    <p class="lead"> Dive4Elements ist eine datenbankbasierte Webapplikation zur raum-zeitlichen Analyse von Fachdaten der 4 Elemente (Feuer, Wasser, Luft und Erde). Dive steht für Digging, Investigating, Viewing, Exporting.
+                    Dive4Elements gewährt webbasiert den Zugriff auf Datenmodelle in einem zentralen Datawarehouse und bietet die Möglichkeit zur Analyse, Visualisierung der Daten sowie Exportmöglichkeiten in offene Formate.
+                    </p>
+
+                    <div class="jumbotron">
+                        <p class="lead">Dive4Elements River oder auch FLYSS - Flusshydrologische Software</p>
+                        <p><a class="btn btn-lg btn-success" href="#" role="button">Get it</a></p>
+
+                        <!-- Carousel -->
+                        <div id="myCarousel" class="carousel slide data-ride="carousel"">
+                        <!-- Carousel items -->
+                        <div class="carousel-inner">
+                            <div class="item active">
+                                <img src="img/screenshot1.png" alt="1. Bild" class="img-responsive">
+                                <div class="carousel-caption">
+                                    <p>Titel und ggf. kurze Erläuterung </p>
+                                </div>
+                            </div>
+                            <div class="item">
+                                <img src="img/screenshot2.png" alt="2. Bild" class="img-responsive">
+                                <div class="carousel-caption">
+                                    <p>Titel und ggf. kurze Erläuterung </p>
+                                </div>
+                            </div>
+                            <div class="item">
+                                <img src="img/screenshot3.png" alt="3. Bild" class="img-responsive">
+                                <div class="carousel-caption">
+                                    <p>Titel und ggf. kurze Erläuterung </p>
+                                </div>
+                            </div>
+                            <div class="item">
+                                <img src="img/screenshot5.png" alt="4. Bild" class="img-responsive">
+                                <div class="carousel-caption">
+                                    <p>Titel und ggf. kurze Erläuterung </p>
+                                </div>
+                            </div>
+                            <div class="item">
+                                <img src="img/screenshot8.png" alt="5. Bild" class="img-responsive">
+                                <div class="carousel-caption">
+                                    <p>Titel und ggf. kurze Erläuterung </p>
+                                </div>
+                            </div>
+                        </div>
+                        <!-- Carousel nav -->
+                        <a class="left carousel-control" data-slide="prev" href="#myCarousel"><span class="prev"></span></a>
+                        <a class="right carousel-control" data-slide="next" href="#myCarousel"><span class="next"></span></a>
+                    </div><!-- /myCarousel -->
+                </div><!-- /jumbobutton-->
+
+                <div class="row marketing">
+                    <div class="col-lg-6">
+                        <h4>Was ist Dive4Elements River?</h4>
+                        <p>Es folgt der Text.</p>
+                    </div>
+                    <div class="col-lg-6">
+                        <h4>Visualisierung und Analyse</h4>
+                        <p>Es folgt der Text.</p>
+                    </div>
+                </div><!-- /row -->
+                
+                <div class="col-xs-6 col-sm-3 sidebar-offcanvas" id="sidebar" role="navigation">
+                    <div class="news_feed">
+                        <p>News</p>
+                    </div>
+                </div><!-- /sidebar -->
+            
+                <div class="jumbotron">
+                    <p>Dive4Elements Ocean (GNV)</p>
+                </div>
+
+            </div><!-- /container -->
+
+            <div class="footer">
+                © 2011 Intevation GmbH <br>
+                Dive4Elements ist lizensiert unter der <a href=
+                "http://www.gnu.org/licenses/lgpl-2.1.html">GNU LGPL v2.1</a>.
+            </div>
+        </div> <!-- /container -->
+        <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
+        <script src="https://code.jquery.com/jquery.js"></script>
+        <!-- Include all compiled plugins (below), or include individual files as needed -->
+        <script src="bootstrap-3.0.3/dist/js/bootstrap.min.js"></script>
+    </body>
+</html>
This site is hosted by Intevation GmbH (Datenschutzerklärung und Impressum | Privacy Policy and Imprint)