[WIP] Adding new company page

[d2eight]

PR description

Needs to be reviewed

New page:
/company/

1. Due to the 3 carousel in use on this page, changed the carousel template. Added the next options:

• Items number is configurable now, furthermore it's configurable on the different screen sizes. Example:
  {% include carousel.liquid items = 5 itemsHigher960 = 3 itemsHigher600 = 2 itemsHigher0 = 1 collectionMap = "company-timeline-carousel" timeline = true %} ;

• titleSize, descriptionSize, linkSize is configurable on different screen sizes:
  {% include carousel.liquid collectionMap = "company-values-carousel" titleSize = "96px" titleSizeLower1280 = "64px" titleSizeLower960 = "56px" titleSizeLower600 = "40px" descriptionSize = "36px" descriptionSizeLower960 = "32px" descriptionSizeLower600 = "28px" %} ;

• Such options like loop(true), autoWidth(false), carouselMargin(100), stagePadding(50) are configurable now;

• Added new contentDirection mode, 'imageBackground', here is example of it:
  
  On this image you can see blue lines, that is an option too, recommended to use only with contentDirection = 'imageBackground'. To use it, set thingsboardStyledBackground = true ;

• Added square dotButtonMode, example is above;

• Added titleWeight, descriptionWeight, linkWeight options;

• Added timeline mode for the carousel, example:
  

• To set this you need to write timeline = true, example:

{% include carousel.liquid items = 5 itemsHigher960 = 3 itemsHigher600 = 2 itemsHigher0 = 1 collectionMap = "company-timeline-carousel" timeline = true autoplay = false loop = false carouselMargin = 50 stagePadding = 0 dotButtonMode = "disableDots" navMode = "smallArrow" titleHoverScale = 1.6 titleSize = "24px" titleColor = "#305680" descriptionColor = "#00000c2" titleWeight = "600" titleLineHeight = "40px" descriptionLineHeight = "30px" %}
Data structure for the such carousel is another, example:

2016:
  0: "2 employees"
  1: "Release of CE"
  2: "100 Github stars"
2017:
  0: "10 employees"
  1: "Release of PE"

2016, 2017 are titles, and 0, 1.... are descriptions;

• Added new navMode, which you can on timeline navMode = "smallArrow";

• Added imageBorderRadius options, as a default set 6px;

2. Added scroll-progress-indicator template to the company and use-cases pages
   

3. Added Instagram and Facebook logos to the footer, footer logos block set as an template:
   

4. Added bubble-tabs template
   
   Data structure example:

Sales/Marketing:
  0:
    src: "/images/companyImages/thingsboard-team-photos/leadership/alex-doan.png"
    alt: ""
    title: "Alex Doan"
    description: "VP Sales & Marketing"
  1:
    src: "/images/companyImages/thingsboard-team-photos/sales-marketing/alla-sidnenko.png"
    alt: ""
    title: "Alla Sidnenko"
    description: "CSM"
  2:
    src: "/images/companyImages/thingsboard-team-photos/sales-marketing/anastasiia-antoniuk.png"
    alt: ""
    title: "Anastasiia Antoniuk"
    description: "Sales"
  3:
    src: "/images/companyImages/thingsboard-team-photos/sales-marketing/michael-shapovalov.png"
    alt: ""
    title: "Michael Shapovalov"
    description: "Product/Marketing"
Operation team:
  0:
    src: "/images/companyImages/thingsboard-team-photos/operation-team/oksana-kovalska.png"
    alt: ""
    title: "Oksana Kovalska"
    description: "HRD"
  1:
    src: "/images/companyImages/thingsboard-team-photos/operation-team/mariia-kalitka.png"
    alt: ""
    title: "Mariia Kalitka"
    description: "Recruiter"
  2:
    src: "/images/companyImages/thingsboard-team-photos/kasharix.png"
    alt: ""
    title: "Valeria Shovkun"
    description: "Sourcer/HR Manager"
  3:
    src: "/images/companyImages/thingsboard-team-photos/operation-team/nataliia-avramenko.png"
    alt: ""
    title: "Nataliia Avramenko"
    description: "Sr Accountant"
  4:
    src: "/images/companyImages/thingsboard-team-photos/operation-team/albina-kukharchuk.png"
    alt: ""
    title: "Albina Kukharchuk"
    description: "Accountant"
  5:
    src: "/images/companyImages/thingsboard-team-photos/kasharix.png"
    alt: ""
    title: "Katia Goldin"
    description: "CFO"
  6:
    src: "/images/companyImages/thingsboard-team-photos/kasharix.png"
    alt: ""
    title: "Anastasiia Orlata"
    description: "Office-manager"
  7:
    src: "/images/companyImages/thingsboard-team-photos/kasharix.png"
    alt: ""
    title: "Andrii Doan"
    description: "Lawyer"

Sales/Marketing, Operation team are tab labels, and nested 0, 1, 2.... are tabs content.

Link checker

The links will be checked by the build agent automatically once you create or update your PR.

You can use the following command to check the broken links locally.

docker run --rm -it --network=host --name=linkchecker ghcr.io/linkchecker/linkchecker --check-extern --no-warnings http://0.0.0.0:4000/

Link checker

The links will be checked by the build agent automatically once you create or update your PR.

You can use the following command to check the broken links locally.

docker run --rm -it --network=host --name=linkchecker ghcr.io/linkchecker/linkchecker --check-extern --no-warnings http://0.0.0.0:4000/

[CLAassistant]

Thank you for your submission! We really appreciate it. Like many open source projects, we ask that you sign our Contributor License Agreement before we can accept your contribution.
_{You have signed the CLA already but the status is still pending? Let us recheck it.}