diff --git a/scripts/yarn-update b/scripts/yarn-update index 6eef49dfc8..6f323e2154 100755 --- a/scripts/yarn-update +++ b/scripts/yarn-update @@ -9,6 +9,9 @@ yarn upgrade-interactive # Clipboard cp node_modules/clipboard/dist/clipboard.min.js ../../weblate_web/static/vendor/clipboard.js +cp node_modules/simpleslider-js/dist/simpleSlider.min.js ../../weblate_web/static/vendor/simpleSlider.min.js +cp node_modules/simpleslider-js/dist/simpleSlider.min.css ../../weblate_web/static/vendor/simpleSlider.min.css + # Source Sans/Code Pro fonts mkdir -p ../../weblate_web/static/font-source diff --git a/scripts/yarn/package.json b/scripts/yarn/package.json index db62c93082..88f8926ff1 100644 --- a/scripts/yarn/package.json +++ b/scripts/yarn/package.json @@ -5,6 +5,7 @@ "license": "GPL-3.0+", "dependencies": { "clipboard": "^2.0.6", + "simpleslider-js": "^1.9.0", "source-code-pro": "2.30.2", "source-sans-pro": "3.6.0" } diff --git a/weblate_web/static/custom.js b/weblate_web/static/custom.js index 0300124208..559f9acd4c 100644 --- a/weblate_web/static/custom.js +++ b/weblate_web/static/custom.js @@ -207,3 +207,12 @@ ready(() => { new ClipboardJS("[data-clipboard-text]"); }); + +if (typeof SimpleSlider === "function") { + new SimpleSlider(".page-slider", { + slidesPerView: { + 850: 2, + 1165: 3, + }, + }); +} diff --git a/weblate_web/static/img/Dyson-logo.png b/weblate_web/static/img/Dyson-logo.png new file mode 100644 index 0000000000..a7a35c0544 Binary files /dev/null and b/weblate_web/static/img/Dyson-logo.png differ diff --git a/weblate_web/static/img/Logo-Turris.png b/weblate_web/static/img/Logo-Turris.png new file mode 100644 index 0000000000..964fa5402b Binary files /dev/null and b/weblate_web/static/img/Logo-Turris.png differ diff --git a/weblate_web/static/img/LogoFreedomBox.png b/weblate_web/static/img/LogoFreedomBox.png new file mode 100644 index 0000000000..a0409e9f66 Binary files /dev/null and b/weblate_web/static/img/LogoFreedomBox.png differ diff --git a/weblate_web/static/img/LogoOpenSuse.png b/weblate_web/static/img/LogoOpenSuse.png new file mode 100644 index 0000000000..104a2a1c9a Binary files /dev/null and b/weblate_web/static/img/LogoOpenSuse.png differ diff --git a/weblate_web/static/img/LogoPhpMyAdmin.png b/weblate_web/static/img/LogoPhpMyAdmin.png new file mode 100644 index 0000000000..111d45ee64 Binary files /dev/null and b/weblate_web/static/img/LogoPhpMyAdmin.png differ diff --git a/weblate_web/static/img/LogoSonicPi.png b/weblate_web/static/img/LogoSonicPi.png new file mode 100644 index 0000000000..710ff995dd Binary files /dev/null and b/weblate_web/static/img/LogoSonicPi.png differ diff --git a/weblate_web/static/img/Quotes.png b/weblate_web/static/img/Quotes.png new file mode 100644 index 0000000000..e9d74f5a55 Binary files /dev/null and b/weblate_web/static/img/Quotes.png differ diff --git a/weblate_web/static/img/Siemens-logo.png b/weblate_web/static/img/Siemens-logo.png new file mode 100644 index 0000000000..693c67d780 Binary files /dev/null and b/weblate_web/static/img/Siemens-logo.png differ diff --git a/weblate_web/static/img/YouGov-logo.png b/weblate_web/static/img/YouGov-logo.png new file mode 100644 index 0000000000..5dce12fa65 Binary files /dev/null and b/weblate_web/static/img/YouGov-logo.png differ diff --git a/weblate_web/static/img/chevron.png b/weblate_web/static/img/chevron.png new file mode 100644 index 0000000000..c2bfcc8b16 Binary files /dev/null and b/weblate_web/static/img/chevron.png differ diff --git a/weblate_web/static/img/chevron1.png b/weblate_web/static/img/chevron1.png new file mode 100644 index 0000000000..aef882d423 Binary files /dev/null and b/weblate_web/static/img/chevron1.png differ diff --git a/weblate_web/static/img/donald.png b/weblate_web/static/img/donald.png new file mode 100644 index 0000000000..f38f7ac2b4 Binary files /dev/null and b/weblate_web/static/img/donald.png differ diff --git a/weblate_web/static/img/dyson-group.png b/weblate_web/static/img/dyson-group.png new file mode 100644 index 0000000000..61f753584e Binary files /dev/null and b/weblate_web/static/img/dyson-group.png differ diff --git a/weblate_web/static/img/next.svg b/weblate_web/static/img/next.svg new file mode 100644 index 0000000000..1f00195a51 --- /dev/null +++ b/weblate_web/static/img/next.svg @@ -0,0 +1,4 @@ + + + + diff --git a/weblate_web/static/img/prev.svg b/weblate_web/static/img/prev.svg new file mode 100644 index 0000000000..50c2096cdd --- /dev/null +++ b/weblate_web/static/img/prev.svg @@ -0,0 +1,2 @@ + + \ No newline at end of file diff --git a/weblate_web/static/img/siemens-group.png b/weblate_web/static/img/siemens-group.png new file mode 100644 index 0000000000..857eb318de Binary files /dev/null and b/weblate_web/static/img/siemens-group.png differ diff --git a/weblate_web/static/img/siemens-log.png b/weblate_web/static/img/siemens-log.png new file mode 100644 index 0000000000..f58f8fa9ec Binary files /dev/null and b/weblate_web/static/img/siemens-log.png differ diff --git a/weblate_web/static/style-rtl.css b/weblate_web/static/style-rtl.css index 492ab39ed5..a8739a9a5e 100644 --- a/weblate_web/static/style-rtl.css +++ b/weblate_web/static/style-rtl.css @@ -4110,3 +4110,101 @@ input.fullwidth { font-size: 10px; } } + +.testimonial { + width: 365px; + border-radius: 30px; + background-color: #ffffff; + box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.1); + margin-left: 10px; +} + +.icon-review { + text-align: right; +} +.icon-review img { + margin-right: 50px; +} +.icon-review p { + margin-right: 35px; + margin-top: -25px; + width: 70%; + font-size: 15px; + line-height: 18px; + letter-spacing: 0.5px; + color: #2a3744; +} + +.circle-user { + width: 40px; + height: 40px; + border-radius: 50%; + position: relative; + right: 32px; + margin-top: 20px; +} +.circle-user img { + margin: 0px; + border-radius: 50%; +} + +.icon-user { + display: flex; + text-align: right; + padding-bottom: 25px; +} +.content-user { + margin-top: 20px; + margin-right: 45px; +} +.content-user a { + color: #1fa385; + line-height: 23px; + text-decoration: underline; +} +.content-logo { + margin: 0px !important; +} + +.slider-slide { + display: -webkit-flex; + display: flex; + -webkit-align-items: center; + align-items: center; + -webkit-justify-content: center; + justify-content: center; +} + +.simple-slider { + height: 400px; +} + +.simple-slider .slider-btn.slider-btn-prev { + left: 11px !important; + background-position: left !important; + box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.1) !important; + background: white !important; + border-radius: 50% !important; + width: 50px !important; + height: 50px !important; +} + +.simple-slider .slider-btn.slider-btn-next { + right: 4px !important; + background-position: right !important; + border-radius: 50% !important; + width: 50px !important; + height: 50px !important; + background: white !important; + box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.1) !important; +} + +.simple-slider .slider-btn.slider-btn-next img { + padding: 18px; + margin: 0px; +} + +.simple-slider .slider-btn.slider-btn-prev img { + padding: 18px; + margin: 0px; +} diff --git a/weblate_web/static/style.css b/weblate_web/static/style.css index 90ad251cfc..0c59b6ea9e 100644 --- a/weblate_web/static/style.css +++ b/weblate_web/static/style.css @@ -4102,3 +4102,103 @@ input.fullwidth { font-size: 10px; } } + +/*Testimonial and Slider CSS*/ + +.testimonial { + width: 365px; + border-radius: 30px; + background-color: #ffffff; + box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.1); + margin-left: 10px; +} + +.icon-review { + text-align: left; +} +.icon-review img { + margin-left: 50px; +} +.icon-review p { + margin-left: 35px; + margin-top: -25px; + width: 70%; + font-size: 15px; + line-height: 18px; + letter-spacing: 0.5px; + color: #2a3744; +} + +.circle-user { + width: 40px; + height: 40px; + border-radius: 50%; + position: relative; + left: 32px; + margin-top: 20px; +} +.circle-user img { + margin: 0px; + border-radius: 50%; +} + +.icon-user { + display: flex; + text-align: left; + padding-bottom: 25px; +} +.content-user { + margin-top: 20px; + margin-left: 45px; +} +.content-user a { + color: #1fa385; + line-height: 23px; + text-decoration: underline; +} +.content-logo { + margin: 0px !important; +} + +.slider-slide { + display: -webkit-flex; + display: flex; + -webkit-align-items: center; + align-items: center; + -webkit-justify-content: center; + justify-content: center; +} + +.simple-slider { + height: 400px; +} + +.simple-slider .slider-btn.slider-btn-prev { + left: 11px !important; + background-position: left !important; + box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.1) !important; + background: white !important; + border-radius: 50% !important; + width: 50px !important; + height: 50px !important; +} + +.simple-slider .slider-btn.slider-btn-next { + right: 4px !important; + background-position: right !important; + border-radius: 50% !important; + width: 50px !important; + height: 50px !important; + background: white !important; + box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.1) !important; +} + +.simple-slider .slider-btn.slider-btn-next img { + padding: 18px; + margin: 0px; +} + +.simple-slider .slider-btn.slider-btn-prev img { + padding: 18px; + margin: 0px; +} diff --git a/weblate_web/static/vendor/simpleSlider.min.css b/weblate_web/static/vendor/simpleSlider.min.css new file mode 100644 index 0000000000..818419317c --- /dev/null +++ b/weblate_web/static/vendor/simpleSlider.min.css @@ -0,0 +1,10 @@ +@charset "UTF-8"; +/*! + * SimpleSlider v1.9.0 + * Simple responsive slider created in pure javascript. + * https://github.com/michu2k/SimpleSlider + * + * Copyright 2017-2019 Michał Strumpf + * Published under MIT License + */ +.simple-slider{overflow:hidden;position:relative}.simple-slider .slider-wrapper{height:100%;position:relative;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);-webkit-transition-timing-function:cubic-bezier(.7,0,.3,1);transition-timing-function:cubic-bezier(.7,0,.3,1)}.simple-slider .slider-slide{background-size:cover;background-position:center top;height:100%;float:left}.simple-slider .slider-pagination{text-align:center;width:100%;bottom:0;position:absolute}.simple-slider .slider-pagination .pagination-bullet{display:inline-block;cursor:pointer;width:16px;height:5px;margin:4px;background-color:#fff;-webkit-transition:all .3s ease;transition:all .3s ease}.simple-slider .slider-pagination .pagination-bullet.is-active{background-color:#999}.simple-slider .slider-btn{width:30px;height:50px;top:50%;cursor:pointer;background-repeat:no-repeat;position:absolute;-webkit-transform:translate(0,-50%);transform:translate(0,-50%)}.simple-slider .slider-btn.slider-btn-prev{left:20px;background-image:url(../img/prev.svg);background-position:left}.simple-slider .slider-btn.slider-btn-next{right:20px;background-image:url(../img/next.svg);background-position:right} \ No newline at end of file diff --git a/weblate_web/static/vendor/simpleSlider.min.js b/weblate_web/static/vendor/simpleSlider.min.js new file mode 100644 index 0000000000..ddfd02c402 --- /dev/null +++ b/weblate_web/static/vendor/simpleSlider.min.js @@ -0,0 +1,9 @@ +/*! + * SimpleSlider v1.9.0 + * Simple responsive slider created in pure javascript. + * https://github.com/michu2k/SimpleSlider + * + * Copyright 2017-2019 Michał Strumpf + * Published under MIT License + */ +"use strict";function _typeof(e){return(_typeof="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e})(e)}function _toConsumableArray(e){return _arrayWithoutHoles(e)||_iterableToArray(e)||_nonIterableSpread()}function _nonIterableSpread(){throw new TypeError("Invalid attempt to spread non-iterable instance")}function _iterableToArray(e){if(Symbol.iterator in Object(e)||"[object Arguments]"===Object.prototype.toString.call(e))return Array.from(e)}function _arrayWithoutHoles(e){if(Array.isArray(e)){for(var t=0,n=new Array(e.length);t=e&&(d.slidesPerView=n[e])}),d.maxIndex=t?d.slides.length:d.slides.length-d.slidesPerView+1},this.createClones=function(){if(d.options.loop){for(var e,t=d.options.class.slide,n=d.wrapper,i=d.slides.length-1,a=document.createDocumentFragment(),r=document.createDocumentFragment(),o=0;o=d.maxIndex-Math.floor(d.slidesPerView/2)?d.maxIndex-1:d.index);for(var n=0;n=d.slides.length)&&(d.index=d.updateIndex(d.index),d.wrapper.style[d.transitionDuration]="0ms",d.moveWrapper()),d.disableEvents=!1},n))},this.createPagination=function(){if(d.pagination){for(var e,t=d.options,n=t.loop,i=t.class.paginationItem,a=document.createDocumentFragment(),r=n?0:Math.min(d.index,d.maxIndex-1),o=0;o=d.slides.length?0:e<0?d.slides.length-1:e:e>=d.maxIndex?d.maxIndex-1:e<=0?0:e},this.autoplay=function(){var e=d.options,t=e.autoplay,n=e.delay,i=e.speed;t&&(d.timer=setTimeout(function(){d.increaseIndex(),d.changeSlide(!0),d.autoplay()},n+i))},this.resetAutoplay=function(){return clearTimeout(d.timer)},this.updateSliderAfterDrag=function(){var e=d.options.speed;d.drag.focused=!1,d.drag.dragDiff&&(d.autoplay(),100=d.maxIndex-1&&d.drag.dragDiff<0&&(i=100)),d.drag.dragDiff-1*i?d.wrapper.style[d.transform]="translate3d(".concat(-1*n,"px, 0, 0)"):d.updateSliderAfterDrag()},this.mousedownHandler=function(e){e.stopPropagation(),e.preventDefault(),d.wrapper.style[d.transitionDuration]="0ms",d.drag.focused=!0,d.drag.startX=e.pageX},this.mousemoveHandler=function(e){e.stopPropagation(),!d.disableEvents&&d.drag.focused&&("A"===e.target.nodeName&&(d.drag.isLink=!0),d.drag.endX=e.pageX,d.updateSliderDuringDrag())},this.mouseupHandler=function(e){e.stopPropagation(),d.updateSliderAfterDrag()},this.mouseleaveHandler=function(e){e.stopPropagation(),d.updateSliderAfterDrag()},this.clickHandler=function(e){d.drag.isLink&&e.preventDefault(),d.drag.isLink=!1},this.touchstartHandler=function(e){e.stopPropagation(),d.wrapper.style[d.transitionDuration]="0ms",d.drag.focused=!0,d.drag.startX=e.touches[0].pageX},this.touchmoveHandler=function(e){e.stopPropagation(),!d.disableEvents&&d.drag.focused&&(d.drag.endX=e.touches[0].pageX,d.updateSliderDuringDrag())},this.touchendHandler=function(e){e.stopPropagation(),d.updateSliderAfterDrag()},this.visibilitychangeHandler=function(){d.resetAutoplay(),document.hidden||d.autoplay()},this.resizeHandler=function(){var e=d.options.loop,t=d.slidesPerView;d.wrapper.style[d.transitionDuration]="0ms",d.calculateSlidesPerView(),d.setWidth(),d.moveWrapper(),e||t===d.slidesPerView||(d.destroyPagination(),d.createPagination())};var l=function(e){return"string"==typeof document.documentElement.style[e]?e:(e=e.charAt(0).toUpperCase()+e.slice(1),"webkit".concat(e))},n=function(e,t){var n,i;if(null!=t&&"undefined"!=t)for(n in t){var a=t[n];if("object"===_typeof(a))for(i in a)e[n][i]=a[i];else e[n]=a}return e};this.init()}"undefined"!=typeof module&&void 0!==module.exports?module.exports=e:i.SimpleSlider=e}(window); \ No newline at end of file diff --git a/weblate_web/templates/base.html b/weblate_web/templates/base.html index 7cdce14a0c..78ce96206f 100644 --- a/weblate_web/templates/base.html +++ b/weblate_web/templates/base.html @@ -15,6 +15,11 @@ {% endcompress %} +{% if request.resolver_match.url_name == 'home' %} + +{% endif %} + + @@ -125,6 +130,10 @@ {% include "snippets/languages.html" %} +{% if request.resolver_match.url_name == 'home' %} + +{% endif %} + {% compress js %} diff --git a/weblate_web/templates/index.html b/weblate_web/templates/index.html index 5a7efdd6cf..3943a53c6b 100644 --- a/weblate_web/templates/index.html +++ b/weblate_web/templates/index.html @@ -52,7 +52,12 @@

{% trans "Robust feature set" %}

{% trans "Explore all features" %}
-

{% trans "Users and Supporters" %}

+

{% trans "Companies using Weblate" %}

+ {% include "snippets/reviews.html" %} +
+ +
+

{% trans "Supporters & open source projects" %}

{% include "snippets/users.html" %}
diff --git a/weblate_web/templates/snippets/reviews.html b/weblate_web/templates/snippets/reviews.html new file mode 100644 index 0000000000..c51ecc2c47 --- /dev/null +++ b/weblate_web/templates/snippets/reviews.html @@ -0,0 +1,73 @@ +{% load i18n %} +{% load static %} + +
+ Siemens + Dyson + YouGov +
+
+
+
+
+
+
+ Quotes +

Weblate is gorgeous app! It really saved my life. Translations are managed within same version control as code. Weblate is gorgeous app! It really my life. Translations are managed within.

+
+
+
+ Quotes +
+
+

Donald McCalister

+ +

Dyson Electronics

+ +
+
+
+
+
+
+
+ Quotes +

Weblate is gorgeous app! It really saved my life. Translations are managed within same version control system as code. Weblate is gorgeous app! It really saved my life. Translations are managed within same version control system as code.

+
+
+
+

Elvis McCalister

+ +

No Case Study Ltd.

+ + +
+
+
+
+
+
+
+ Quotes +

Weblate is gorgeous app! It really saved my life. Translations are managed within same version control system as code. Weblate is gorgeous app! It really saved my life. Translations are managed within same version control system as code.

+
+
+
+

Jonathan McCalister

+ +

Siemens Inc.

+ + +
+
+
+
+
+
Quotes
+
Quotes
+
+
+
+
+ {% trans "See case studies" %} +
diff --git a/weblate_web/templates/snippets/users.html b/weblate_web/templates/snippets/users.html index d9186a193f..da6499162b 100644 --- a/weblate_web/templates/snippets/users.html +++ b/weblate_web/templates/snippets/users.html @@ -1,10 +1,12 @@ {% load i18n %} {% load static %} +Turris +SonicPi openSUSE +PhpMyAdmin +FreedomBox LibreOffice Fedora -Freedombox Collabora
{% trans "See all projects" %} -{% trans "See all supporters" %}