Home page company section

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

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"
   }

weblate_web/static/custom.js

@@ -207,3 +207,13 @@ ready(() => {
 
   new ClipboardJS("[data-clipboard-text]");
 });
+
+if (typeof SimpleSlider === 'function'){
+
+  new SimpleSlider('.page-slider', {
+    slidesPerView: {
+      850: 2,
+      1165: 3
+    }
+  });
+}

weblate_web/static/style-rtl.css

@@ -4110,3 +4110,253 @@ 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;
+}
+.contentt{
+  margin-top: 20px;
+  margin-right: 45px;
+}
+.contentt a{
+  color: #1FA385;
+  line-height: 23px;
+  text-decoration: underline;
+}
+.unqimg{
+  margin: 0px !important;
+}
+
+.slider-slide {
+display: -webkit-flex;
+display: flex;
+-webkit-align-items: center;
+align-items: center;
+-webkit-justify-content: center;
+justify-content: center;
+
+}
+
+.slider-number {
+font-size: 40px;
+color: #fff;
+display: block
+}
+
+.page {
+margin-left: auto;
+margin-right: auto;
+padding: 15px;
+max-width: 650px
+}
+
+.page-heading {
+font-size: 28px;
+color: #151515;
+margin: 30px 0 0 0
+}
+
+.page-desc {
+font-size: 12px;
+color: #636363;
+margin-top: 2px;
+margin-bottom: 10px;
+display: inline-block
+}
+
+.page-link {
+font-weight: 700;
+font-size: 14px;
+color: #0652dd;
+margin-bottom: 30px;
+display: block
+}
+
+.page-link:hover,
+.page-link:focus {
+color: #151515
+}
+
+.page-slider {
+width: 100%;
+height: 400px
+}
+
+.page-code {
+font-size: 15px;
+padding: 15px 0;
+display: block
+}
+
+.page-code .code-line {
+display: block;
+margin-left: 30px
+}
+
+.page-code .code-line-deep {
+display: block;
+margin-left: 60px
+}
+
+.container,
+.footer,
+.main,
+.header {
+width: 100%;
+max-width: 1000px;
+margin-left: auto;
+margin-right: auto
+}
+
+.header {
+padding: 40px
+}
+
+.header-heading {
+font-weight: 700;
+font-size: 32px;
+color: #151515;
+margin: 0
+}
+
+.main {
+background-color: #fff
+}
+
+.main-column {
+flex: 1 1 50%;
+padding: 10px 40px
+}
+
+.content {
+margin-bottom: 65px
+}
+
+.content .content-heading {
+font-weight: 700;
+font-size: 22px;
+color: #151515;
+margin-bottom: 10px;
+margin-top: 0
+}
+
+.content .content-line {
+width: 50px;
+height: 2px;
+text-align: left;
+background-color: #636363;
+border: 0;
+margin: 0
+}
+
+.content .content-desc {
+font-size: 13px;
+line-height: 22px;
+color: #636363
+}
+
+.content .content-desc.has-bg {
+font-size: 12px;
+color: #151515;
+padding: 6px;
+border: 2px solid #636363
+}
+
+.content .content-link {
+font-size: 12px;
+color: #fff;
+display: inline-block;
+padding: 8px 12px;
+margin-top: 15px;
+background-color: #151515;
+transition: all .2s
+}
+
+.content .content-link:hover,
+.content .content-link:focus {
+color: #151515;
+background-color: #fff
+}
+
+@media screen and (min-width: 600px) {
+.main {
+  display: -webkit-flex;
+  display: flex
+}
+}
+
+.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;
+}
+
+
+