mirror of
https://github.com/qdrant/landing_page.git
synced 2026-09-28 23:48:31 +02:00
Marquee for customer logos (#332)
* marquee for customer logos * fix * two new logos * fix * marquee mixin fixes * new logos and md files for them * fixes * fix * fixes * replaced text, moved the logos section up
This commit is contained in:
@@ -50,11 +50,19 @@ docker run -p 6333:6333 qdrant/qdrant</code>
|
||||
</section>
|
||||
<!-- End Banner Section -->
|
||||
|
||||
<!--Customers Section-->
|
||||
<section class="pt-5 mt-5">
|
||||
{{ with (.Site.GetPage "section" "stack") }}
|
||||
{{ partial "customers-section" . }}
|
||||
{{ end }}
|
||||
</section>
|
||||
<!--End Customers Section-->
|
||||
|
||||
|
||||
{{ with (.Site.GetPage "section" "features") }}
|
||||
|
||||
<!-- Feature Section -->
|
||||
<section class="features-section">
|
||||
<section class="features-section pt-5">
|
||||
<div class="auto-container">
|
||||
<div class="row clearfix">
|
||||
|
||||
@@ -189,32 +197,7 @@ docker run -p 6333:6333 qdrant/qdrant</code>
|
||||
{{ end }}
|
||||
<!-- End Business Section -->
|
||||
|
||||
|
||||
{{ with (.Site.GetPage "section" "stack") }}
|
||||
<!--Clients Section-->
|
||||
<section class="clients-section">
|
||||
<div class="auto-container">
|
||||
<div class="row">
|
||||
<div class="col-12 sec-title">
|
||||
<h2>{{ .Title | safeHTML }}</h2>
|
||||
<div class="text">{{ .Params.subtitle}}</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<ul class="sponsors-outer">
|
||||
{{ range $i, $e := first 3 .Pages }}
|
||||
<li class="mt-3 mb-3 image-box">
|
||||
<a href="{{ .Params.origin_url }}" target="_blank" rel="nofollow"><img src="{{ .Params.image }}-mono.png" alt=""></a>
|
||||
</li>
|
||||
{{ end }}
|
||||
</ul>
|
||||
|
||||
</div>
|
||||
</section>
|
||||
<!--End Clients Section-->
|
||||
{{ end }}
|
||||
|
||||
{{ with (.Site.GetPage "section" "articles") }}
|
||||
{{ with (.Site.GetPage "section" "articles") }}
|
||||
<!-- Start Articles Section -->
|
||||
<section id="articles" class="projects-section-two" style="background: var(--brand-light);">
|
||||
<div class="auto-container">
|
||||
|
||||
@@ -0,0 +1,33 @@
|
||||
<div class="auto-container">
|
||||
<div class="row">
|
||||
<div class="col-12 sec-title">
|
||||
<h2>{{ .Title | safeHTML }}</h2>
|
||||
<div class="text">{{ .Params.subtitle}}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="marquee mt-3 mb-5">
|
||||
<div class="marquee__container">
|
||||
<div class="marquee__block">
|
||||
<div class="marquee__inner marquee__inner_to-left">
|
||||
<span>
|
||||
{{ range .Pages }}
|
||||
<div class="marquee__item">
|
||||
<img src="{{ .Params.image }}-mono.png" alt="{{ .Params.name}} logo">
|
||||
</div>
|
||||
{{ end }}
|
||||
</span>
|
||||
<span>
|
||||
{{ range .Pages }}
|
||||
<div class="marquee__item">
|
||||
<img src="{{ .Params.image }}-mono.png" alt="{{ .Params.name}} logo">
|
||||
</div>
|
||||
{{ end }}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -88,21 +88,11 @@
|
||||
font-size: 50px;
|
||||
}
|
||||
|
||||
.clients-section-two .sponsors-outer,
|
||||
.magic-block .inner-box {
|
||||
padding-right: 0px;
|
||||
}
|
||||
|
||||
.banner-section-two .image-column .inner-column {
|
||||
padding-left: 0px;
|
||||
margin-right: 0px;
|
||||
}
|
||||
|
||||
.magic-section .blocks-column .inner-column,
|
||||
.optimized-section .image-column .inner-column {
|
||||
padding-left: 0px;
|
||||
}
|
||||
|
||||
.banner-section-two .side-layer,
|
||||
.about-section .content-column .inner-column .sec-title h2 br,
|
||||
.magic-section .blocks-column .inner-column .magic-block:before {
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
@use "../helpers/functions" as lib;
|
||||
@use "../helpers/mixins" as mixins;
|
||||
@use "../mixins/mixins" as mixins;
|
||||
|
||||
article aside[role="alert"],
|
||||
article aside[role="status"] {
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
@use "../helpers/mixins" as mixins;
|
||||
@use "../mixins/mixins" as mixins;
|
||||
@use "../helpers/functions" as lib;
|
||||
|
||||
.documentation {
|
||||
|
||||
File diff suppressed because one or more lines are too long
@@ -1,5 +1,6 @@
|
||||
@use "helpers/functions";
|
||||
@use "helpers/utils";
|
||||
@use "mixins/marquee";
|
||||
|
||||
@import "colors";
|
||||
@import "../../../../node_modules/bootstrap/scss/bootstrap.scss";
|
||||
@@ -146,6 +147,10 @@ blockquote {
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
.marquee {
|
||||
@include marquee.base(80px, 200px, 12, 6, 20px, false, 50s);
|
||||
}
|
||||
|
||||
@import "blocks/forms";
|
||||
@import "blocks/categories-widget";
|
||||
@import "blocks/tags-widget";
|
||||
|
||||
@@ -0,0 +1,96 @@
|
||||
@mixin base($height, $itemWidth: 200px, $total-marquee-items: 6, $visible-marquee-items: 6, $item-padding: 20px, $pauseOnHover: false, $speed: 25s) {
|
||||
|
||||
$inner-width: $total-marquee-items / $visible-marquee-items * 2 * 100%;
|
||||
|
||||
max-width: 100%;
|
||||
text-align: center;
|
||||
height: $height;
|
||||
|
||||
&__container {
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
&__block {
|
||||
height: $height;
|
||||
display: grid;
|
||||
width: $itemWidth * $visible-marquee-items;
|
||||
overflow: hidden;
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
margin: 0 auto;
|
||||
|
||||
&:before {
|
||||
content: "";
|
||||
display: block;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
width: 0;
|
||||
box-shadow: 0 0 30px 30px white;
|
||||
z-index: 1;
|
||||
}
|
||||
&:after {
|
||||
content: "";
|
||||
display: block;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
width: 0;
|
||||
box-shadow: 0 0 30px 30px white;
|
||||
z-index: 1;
|
||||
}
|
||||
}
|
||||
|
||||
&__inner {
|
||||
display: block;
|
||||
width: $inner-width;
|
||||
position: absolute;
|
||||
|
||||
& > span {
|
||||
float: left;
|
||||
width: 50%;
|
||||
}
|
||||
|
||||
&_to-left {
|
||||
animation: marqueeLeft $speed linear infinite;
|
||||
}
|
||||
|
||||
&_to-right {
|
||||
animation: marqueeRight $speed linear infinite;
|
||||
}
|
||||
}
|
||||
|
||||
&__item {
|
||||
width: $itemWidth - $item-padding * 2;
|
||||
height: $height;
|
||||
display: inline-flex;
|
||||
margin: 0 $item-padding;
|
||||
float: left;
|
||||
transition: all .2s ease-out;
|
||||
align-items: center;
|
||||
|
||||
img {
|
||||
max-width: 100%;
|
||||
height: auto;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes marqueeLeft {
|
||||
0% {
|
||||
left: 0;
|
||||
}
|
||||
100% {
|
||||
left: $inner-width / 2 * -1;
|
||||
}
|
||||
}
|
||||
@keyframes marqueeRight {
|
||||
0% {
|
||||
left: $inner-width / 2 * -1;
|
||||
}
|
||||
100% {
|
||||
left: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
+1
-1
@@ -80,4 +80,4 @@
|
||||
-o-transition: all $ms ease;
|
||||
-moz-transition: all $ms ease;
|
||||
transition: all $ms ease;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,37 @@
|
||||
/*!
|
||||
* Bootstrap v4.6.2 (https://getbootstrap.com/)
|
||||
* Copyright 2011-2022 The Bootstrap Authors (https://github.com/twbs/bootstrap/graphs/contributors)
|
||||
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
|
||||
*/
|
||||
|
||||
/*!
|
||||
* Splide.js
|
||||
* Version : 4.1.4
|
||||
* License : MIT
|
||||
* Copyright: 2022 Naotoshi Fujita
|
||||
*/
|
||||
|
||||
/**!
|
||||
* @fileOverview Kickass library to create and place poppers near their reference elements.
|
||||
* @version 1.16.1
|
||||
* @license
|
||||
* Copyright (c) 2016 Federico Zivolo and contributors
|
||||
*
|
||||
* Permission is hereby granted, free of charge, to any person obtaining a copy
|
||||
* of this software and associated documentation files (the "Software"), to deal
|
||||
* in the Software without restriction, including without limitation the rights
|
||||
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
||||
* copies of the Software, and to permit persons to whom the Software is
|
||||
* furnished to do so, subject to the following conditions:
|
||||
*
|
||||
* The above copyright notice and this permission notice shall be included in all
|
||||
* copies or substantial portions of the Software.
|
||||
*
|
||||
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
||||
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
||||
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
||||
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
||||
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
||||
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
||||
* SOFTWARE.
|
||||
*/
|
||||
Reference in New Issue
Block a user