Compare commits

...

5 Commits

  1. 9
      Makefile
  2. 48
      content/u/products/video-conference/contents.lr
  3. BIN
      content/u/products/video-conference/jitsi.jpg
  4. BIN
      content/u/products/video-conference/video-call.jpg
  5. BIN
      content/u/products/video-conference/video-chat.mp4
  6. 27
      flowblocks/slide.ini
  7. 3
      models/page-2020.ini
  8. 4
      models/product.ini
  9. 23
      templates/blocks/slide.html
  10. 3
      templates/blocks/slider.html
  11. 80
      templates/layout-2020.html

9
Makefile

@ -1,5 +1,12 @@
BUILDDIR?=../ungleich-staticcms-build
DESTINATION=ungleichstatic@staticweb.ungleich.ch:/home/services/www/ungleichstatic/staticcms.ungleich.ch/www/u/
BRANCH := $(shell git rev-parse --abbrev-ref HEAD)
ifeq ($(BRANCH), "master")
DESTINATION=ungleichstatic@staticweb.ungleich.ch:/home/services/www/ungleichstatic/staticcms.ungleich.ch/www/u/
else
DESTINATION=ungleichstatic@staticweb.ungleich.ch:/home/services/www/ungleichstatic/staticcms-staging.ungleich.ch/www/u/
endif
all: publish

48
content/u/products/video-conference/contents.lr

@ -4,13 +4,17 @@ _hidden: no
---
title: Video Conference Call
---
subtitle: Free, Open Source and sustainable Video Conference
subtitle:
Free, Open Source and sustainable Video Conference
---
image: /u/image/cards/videoconf.jpg
---
headline1: Secure & Free
---
headline2: Video Conference
headline2:
Video Conference
---
header_background_color: #095fce
---
@ -35,4 +39,42 @@ Use our free video conference to call the ones you need to talk to. Wherever you
---
content1_image: /u/image/jitsi-ungleich.jpg
---
---
slide:
#### slide ####
title: Online Video Conferencing
----
description: We would provide you excellent open source tools that would help you get started with online video conferencing
----
button_text: Click Me
----
button_link: https://www.google.com
----
background_image:
----
video_mp4: video-chat.mp4
#### slide ####
title: Online Video Conferencing For Education
----
description: Whether, you are a Student or a Teacher, with our remote video conferencing you can collaborate easily
----
button_text: Click Me
----
button_link: http://www.google.com
----
background_image: video-call.jpg
----
video_mp4:
#### slide ####
title: Jitsi
----
description: A very reasonable open source video conferencing tool
----
button_text: Click Me
----
button_link: https://google.com
----
background_image: jitsi.jpg
----
video_mp4:

BIN
content/u/products/video-conference/jitsi.jpg

Binary file not shown.

After

Width:  |  Height:  |  Size: 76 KiB

BIN
content/u/products/video-conference/video-call.jpg

Binary file not shown.

After

Width:  |  Height:  |  Size: 288 KiB

BIN
content/u/products/video-conference/video-chat.mp4

Binary file not shown.

27
flowblocks/slide.ini

@ -0,0 +1,27 @@
[block]
name = Slide
button_label = Slide
[fields.title]
label = Title
type = string
[fields.description]
label = Description
type = string
[fields.button_text]
label = Button Text
type = string
[fields.button_link]
label = Button Link
type = url
[fields.background_image]
label = Background Image
type = text
[fields.video_mp4]
label = Video MP4
type = text

3
models/page-2020.ini

@ -18,6 +18,3 @@ type = markdown
label = Image
type = url
[fields.slider]
type = flow
flow_blocks = slider

4
models/product.ini

@ -181,3 +181,7 @@ type = url
[fields.image]
label = Index Image
type = url
[fields.slide]
type = flow
flow_blocks = slide

23
templates/blocks/slide.html

@ -0,0 +1,23 @@
<!-- active -->
<div class="carousel-item">
{% if this.video_mp4 %}
<video autoplay muted loop>
<source src="{{ this.video_mp4 }}" type="video/mp4">
</video>
{% elif this.background_image %}
<img src="{{ this.background_image }}" class="d-block w-100" alt="...">
{% endif %}
<div class="container">
<div class="carousel-caption">
<h3 class="display-4">{{ this.title }}</h3>
<p class="lead">
{{ this.description }}
<br>
<a href="{{ this.button_link }}" class="btn btn-primary btn-lg" role="button" aria-pressed="true">
{{ this.button_text }}
</a>
</p>
</div>
</div>
</div>

3
templates/blocks/slider.html

@ -1,3 +0,0 @@
<div class="text-block text-block-{{ this.class }}">
{{ this.text }}
</div>

80
templates/layout-2020.html

@ -41,6 +41,56 @@
</script>
<!-- End Google Analytics -->
<style>
video{
width:100%;
object-fit: cover;
}
.carousel-caption {
right: 5%;
text-align: right;
left: auto;
padding:5px;
}
/* Extra small devices (portrait phones, less than 576px) */
@media (max-width: 575.98px) {
.carousel-item img, video {
height: 280px;
}
}
/* Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) and (max-width: 767.98px) {
.carousel-item img, video {
height: 300px;
}
}
/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) and (max-width: 991.98px) {
.carousel-item img, video {
height: 400px;
}
}
/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) and (max-width: 1199.98px) {
.carousel-item img, video {
height: 450px;
}
}
/* Extra large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {
.carousel-item img, video {
height: 900px;
}
}
</style>
</head>
<body>
{% if this.header_background_color %}
@ -104,8 +154,33 @@
If headline1/2/3 given, take the headline.
Else default to boxed title + subtitle
#}
{% if this.slide %}
<!-- Start of Slider -->
<div id="head-carousel" class="carousel slide" data-ride="carousel">
<ol class="carousel-indicators">
{% for slide in this.slide.blocks %}
{% if loop.index0 == 0 %}<li data-target="#head-carousel" data-slide-to="0" class="active"></li>{% else %}<li data-target="#head-carousel" data-slide-to="{{ loop.index0 }}"></li>{% endif %}
{% endfor %}
</ol>
<div class="carousel-inner">
{{ this.slide }}
</div>
<div class="d-none d-sm-none d-md-block">
<a class="carousel-control-prev" href="#head-carousel" role="button" data-slide="prev">
<span class="carousel-control-prev-icon" aria-hidden="true"></span>
<span class="sr-only">Previous</span>
</a>
<a class="carousel-control-next" href="#head-carousel" role="button" data-slide="next">
<span class="carousel-control-next-icon" aria-hidden="true"></span>
<span class="sr-only">Next</span>
</a>
</div>
</div>
<!-- End of Slider-->
{% if this.headline1 or this.headline2 or this.headline3 %}
{% elif this.headline1 or this.headline2 or this.headline3 %}
<div class="jumbotron jumbotron-fluid" style="background-color: {{this.header_background_color}};">
<div class="container-fluid">
<h1 class="display-1 generic-header {{this.header_text_color}}" style="font-weight: bolder;">
@ -154,5 +229,8 @@
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>
<script type="text/javascript">
$("div.carousel-item")[0].classList += " active";
</script>
</body>
</html>

Loading…
Cancel
Save