Bootstrap products
This commit is contained in:
Nico Schottelius
parent
16fb2bb919
commit
5f0f8f66db
19 changed files with 355 additions and 323 deletions
|
|
@ -5,8 +5,11 @@
|
|||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
||||
|
||||
<!-- Bootstrap CSS -->
|
||||
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">
|
||||
<!-- Bootstrap + helpers2 -->
|
||||
<link rel="stylesheet"
|
||||
href="/u/static/bootstrap-4.4.1-dist/css/bootstrap.min.css">
|
||||
|
||||
|
||||
|
||||
<title>{% block title %}Welcome to {% endblock %} | ungleich.ch</title>
|
||||
</head>
|
||||
|
|
@ -23,10 +26,16 @@
|
|||
<div class="collapse navbar-collapse" id="navbarSupportedContent">
|
||||
<ul class="navbar-nav mr-auto">
|
||||
<li class="nav-item active">
|
||||
<a class="nav-link" href="#">Home <span class="sr-only">(current)</span></a>
|
||||
<a class="nav-link" href="/blog/">Old Blog<a/>
|
||||
</li>
|
||||
<li class="nav-item active">
|
||||
<a class="nav-link" href="/u/blog/">New Blog<a/>
|
||||
</li>
|
||||
<li class="nav-item active">
|
||||
<a class="nav-link" href="https://chat.ungleich.ch/">Chat<a/>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="#">Link</a>
|
||||
<a class="nav-link" href="/u/products/">Products</a>
|
||||
</li>
|
||||
</ul>
|
||||
<form class="form-inline my-2 my-lg-0"
|
||||
|
|
@ -57,5 +66,13 @@
|
|||
<a class=footer-link href="https://ungleich.ch">ungleich</a>.</span>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
<!-- slow javascript at the end -->
|
||||
<script type="text/javascript"
|
||||
src="/u/static/js/jquery-3.4.1.min.js"></script>
|
||||
<script type="text/javascript"
|
||||
src="/u/static/popper.js-1.16.0/dist/esm/popper.min.js"></script>
|
||||
<script type="text/javascript"
|
||||
src="/u/static/bootstrap-4.4.1-dist/js/bootstrap.min.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -1,34 +1,87 @@
|
|||
{% extends "layout.html" %}
|
||||
{% from "macros/blog.html" import render_blog_post %}
|
||||
{% from "macros/pagination.html" import render_pagination %}
|
||||
{% extends "layout-2020.html" %}
|
||||
{% block title %}{{ this.title }}{% endblock %}
|
||||
{% block body %}
|
||||
<header class="intro-header" style="background-image: url('/u/static/images/home-bg.jpg');">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-lg-8 col-lg-offset-2 col-md-10 col-md-offset-1">
|
||||
<div class="site-heading">
|
||||
<h1>ungleich store</h1>
|
||||
<hr class="small">
|
||||
<span class="subheading"></span>
|
||||
</div>
|
||||
</div>
|
||||
{% block subtitle %}{{ this.subtitle }}{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
<div class="container">
|
||||
<div class="row mb-5">
|
||||
<div class="col-md-4">
|
||||
<h3 class="font-weight-normal">{{ this.feature1_title }}</h3>
|
||||
<p class="font-weight-normal">{{ this.feature1_text }}</p>
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
<h3 class="font-weight-normal">{{ this.feature2_title }}</h3>
|
||||
<p class="font-weight-normal">{{ this.feature2_text }}</p>
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
<h3 class="font-weight-normal">{{ this.feature3_title }}</h3>
|
||||
<p class="font-weight-normal">{{ this.feature3_text }}</p>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-md-3">
|
||||
<div class="panel panel-primary">
|
||||
<div class="panel-heading">
|
||||
<h3 class="panel-title">{{this.name}}</h3>
|
||||
</div>
|
||||
<div class="panel-body">
|
||||
{{this.description}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="container">
|
||||
<div class="row mb-3">
|
||||
<div class="col-md-7">
|
||||
{{ this.content1_text }}
|
||||
</div>
|
||||
<div class="col-md-5">
|
||||
{% if this.content1_image %}
|
||||
<img src="{{ this.content1_image }}" class="img-fluid">
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="container">
|
||||
<div class="row mb-3">
|
||||
<div class="col-md-4">
|
||||
{% if this.offer1_title and this.offer1_text and this.offer1_link %}
|
||||
<div class="card">
|
||||
<div class="card-body">
|
||||
<h5 class="card-title">{{ this.offer1_title }}</h5>
|
||||
<p class="card-text">{{ this.offer1_text }}</p>
|
||||
<a href="{{ this.offer1_link }}" class="btn btn-primary">Order</a>
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
{% if this.offer2_title and this.offer2_text and this.offer2_link %}
|
||||
<div class="card">
|
||||
<div class="card-body">
|
||||
<h5 class="card-title">{{ this.offer2_title }}</h5>
|
||||
<p class="card-text">{{ this.offer2_text }}</p>
|
||||
<a href="{{ this.offer2_link }}" class="btn btn-primary">Order</a>
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
{% if this.offer3_title and this.offer3_text and this.offer3_link %}
|
||||
<div class="card">
|
||||
<div class="card-body">
|
||||
<h5 class="card-title">{{ this.offer3_title }}</h5>
|
||||
<p class="card-text">{{ this.offer3_text }}</p>
|
||||
<a href="{{ this.offer3_link }}" class="btn btn-primary">Order</a>
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<hr/>
|
||||
|
||||
<div class="container">
|
||||
<div class="row mb-3">
|
||||
<div class="col-md-7">
|
||||
{{ this.content2_text }}
|
||||
</div>
|
||||
<div class="col-md-5">
|
||||
{% if this.content2_image %}
|
||||
<img src="{{ this.content2_image }}" class="img-fluid">
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% endblock %}
|
||||
|
|
|
|||
|
|
@ -1,37 +1,31 @@
|
|||
{% extends "layout.html" %}
|
||||
{% from "macros/blog.html" import render_blog_post %}
|
||||
{% from "macros/pagination.html" import render_pagination %}
|
||||
{% extends "layout-2020.html" %}
|
||||
{% block title %}{{ this.title }}{% endblock %}
|
||||
{% block body %}
|
||||
{% block content %}
|
||||
|
||||
<header class="intro-header" style="background-image: url('/u/static/images/home-bg.jpg');">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-lg-8 col-lg-offset-2 col-md-10 col-md-offset-1">
|
||||
<div class="site-heading">
|
||||
<h1>Products</h1>
|
||||
<hr class="small">
|
||||
<span class="subheading"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
{% for product in this.children %}
|
||||
<div class="col-md-3">
|
||||
<div class="panel panel-primary">
|
||||
<div class="panel-heading">
|
||||
<h2 class="panel-title">{{ product.name}}</h2>
|
||||
</div>
|
||||
<div class="panel-body">
|
||||
{{product.teaser}}
|
||||
{% for product in this.children %}
|
||||
{% if loop.first %}
|
||||
<div class="row mb-3">
|
||||
{% endif %}
|
||||
<div class="col-md-4">
|
||||
<div class="card">
|
||||
<div class="card-body">
|
||||
<h5 class="card-title">{{ product.title }}</h5>
|
||||
<p class="card-text">{{ product.subtitle }}</p>
|
||||
<a class="btn btn-primary" href="{{ product|url }}">Check it out</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% endfor %}
|
||||
{% if loop.index is divisibleby 3 %}
|
||||
</div>
|
||||
<hr/>
|
||||
<div class="row">
|
||||
{% endif %}
|
||||
{% if loop.last %}
|
||||
</div>
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1,82 +0,0 @@
|
|||
{% extends "layout-2020.html" %}
|
||||
{% block title %}{{ this.title }}{% endblock %}
|
||||
{% block subtitle %}{{ this.subtitle }}{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
<div class="container">
|
||||
<div class="row mb-5">
|
||||
<div class="col-md-4">
|
||||
<h3 class="font-weight-normal">{{ this.feature1_title }}</h3>
|
||||
<p class="font-weight-normal">{{ this.feature1_text }}</p>
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
<h3 class="font-weight-normal">{{ this.feature2_title }}</h3>
|
||||
<p class="font-weight-normal">{{ this.feature2_text }}</p>
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
<h3 class="font-weight-normal">{{ this.feature3_title }}</h3>
|
||||
<p class="font-weight-normal">{{ this.feature3_text }}</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="container">
|
||||
<div class="row mb-3">
|
||||
<div class="col-md-7">
|
||||
{{ this.content1_text }}
|
||||
</div>
|
||||
<div class="col-md-5">
|
||||
{% if this.content1_image %}
|
||||
<img src="{{ this.content1_image }}" class="img-fluid">
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="container">
|
||||
<div class="row mb-3">
|
||||
<div class="col-md-4">
|
||||
<div class="card">
|
||||
<div class="card-body">
|
||||
<h5 class="card-title">Offer 1</h5>
|
||||
<p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.</p>
|
||||
<a href="#" class="btn btn-primary">Go somewhere</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
<div class="card">
|
||||
<div class="card-body">
|
||||
<h5 class="card-title">Offer 2</h5>
|
||||
<p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.</p>
|
||||
<a href="#" class="btn btn-primary">Go somewhere</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
<div class="card">
|
||||
<div class="card-body">
|
||||
<h5 class="card-title">Offer 3</h5>
|
||||
<p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.</p>
|
||||
<a href="#" class="btn btn-primary">Go somewhere</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<hr/>
|
||||
|
||||
<div class="container">
|
||||
<div class="row mb-3">
|
||||
<div class="col-md-7">
|
||||
{{ this.content2_text }}
|
||||
</div>
|
||||
<div class="col-md-5">
|
||||
{% if this.content2_image %}
|
||||
<img src="{{ this.content2_image }}" class="img-fluid">
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% endblock %}
|
||||
Loading…
Add table
Add a link
Reference in a new issue