Merge pull request eksctl-io#7027 from Himangini/eksctl-adopters

Adopters for eksctl

CONTRIBUTING.md

@@ -698,4 +698,4 @@ Each proposal/design doc should cover the following _at a minimum_:
 
 ---
 
-## :rocket: :tada: Thanks for reading! :tada: :rocket
+## :rocket: :tada: Thanks for reading! :tada: :rocket:

userdocs/mkdocs.yml

@@ -79,6 +79,9 @@ extra_css:
   - stylesheets/extra.css
   - stylesheets/schema.css
 
+extra_javascript:
+  - https://cdn.jsdelivr.net/npm/@glidejs/glide
+
 # Extensions
 markdown_extensions:
   - toc:
@@ -158,3 +161,4 @@ nav:
     - announcements/nodegroup-override-announcement.md
   - Examples: "https://github.com/eksctl-io/eksctl/tree/main/examples"
   - Community: community.md
+  - Adopters: adopters.md

userdocs/src/adopters.md

@@ -0,0 +1,15 @@
+# eksctl Adopters :fontawesome-solid-handshake-simple:
+
+Are you and your organisation using `eksctl`?
+We would love to hear from you! :octicons-heart-fill-24:{ .heart }
+
+Get featured on our [website](/), follow the instructions below.
+
+- Follow the [contributions guide](https://github.com/eksctl-io/eksctl/blob/main/CONTRIBUTING.md#developing-eksctl) to fork the `eksctl` repository.
+- Add your company logo to the folder `/userdocs/theme/assets/adopters/`. The logo image should be either `.png`, `.jpg` or `.svg` format. Max width and height should be 150px.
+The logo image must be named after your organisation for eg., If your organisation name is Acme Corp then your logo image should be named `acme-logo.png`.
+- Edit `/userdocs/theme/partials/copyright.html` file and add a new `li` element with your logo details above the line `<!-- Add new logos here -->`.
+Following the example of the Acme Corp, new list element will be `<li class="glide__slide"><img src="/assets/adopters/acme-logo.png" alt="Acme Corp"></li>`.
+- Commit your changes, follow the [PR submission guidelines](https://github.com/eksctl-io/eksctl/blob/main/CONTRIBUTING.md#pr-submission-guidelines) and open a
+Pull Request in `eksctl` [repository](https://github.com/eksctl-io/eksctl).
+- We will happily review your contribution. :fontawesome-solid-wand-magic-sparkles:

userdocs/src/stylesheets/extra.css

@@ -48,7 +48,31 @@ img[src$="#wwinline"] {
     20%, 60% {
       transform: scale(1.15);
     }
-  }
-  .heart {
+ }
+
+.heart {
     animation: heart 1000ms infinite;
-  }
+}
+
+.glide__slide img {
+    height: 50px;
+}
+
+.glide__slides {
+    list-style-type: none !important;
+}
+
+.glide {
+    width: 100%;
+    padding: .4rem 0;
+    text-align: center; 
+    margin: auto 0.6rem;
+}
+
+.md-copyright {
+    width: 100% !important;
+}
+
+ol:not([hidden]).glide__slides, ul:not([hidden]).glide__slides {
+    display: flex !important;
+}

userdocs/theme/main.html

@@ -7,4 +7,21 @@
     <a class="md-button" href="https://www.weave.works/blog/weaveworks-and-aws-collaborate-to-enhance-the-open-source-eks-cli">Weaveworks Blog</a>
     and <a class="md-button" href="https://aws.amazon.com/blogs/opensource/weaveworks-and-aws-joining-forces-to-maintain-open-source-eksctl/">AWS Blog</a> posts.
   </p>
+{% endblock %}
+
+{% block scripts %}
+  <!-- Add scripts that need to run before here -->
+  {{ super() }}
+<script>
+document.addEventListener( 'DOMContentLoaded', function() {
+    new Glide('.adopters', {
+        type: 'carousel',
+        autoplay: 4000,
+        hoverpause: false,
+        perView: 3,
+        animationTimingFunc: 'linear',
+        animationDuration: 1000
+    }).mount()
+});
+</script>
 {% endblock %}

userdocs/theme/partials/copyright.html

@@ -1,6 +1,23 @@
 <div class="md-copyright">
+    <h2>Eksctl Adopters</h2>
+        <p>We are happy and proud to have you all as part of our community! 
+            <span class="twemoji heart-fill-24 heart">
+                {% include ".icons/octicons/heart-fill-24.svg" %} 
+              </span>
+              To join the list of eksctl adopters, please follow these <a href="/adopters">instructions</a>.
+    </p>
+    <div class="glide adopters">
+        <div class="glide__track" data-glide-el="track">
+            <ul class="glide__slides">
+            <li class="glide__slide"><img src="/assets/adopters/aws-logo.png" alt="AWS logo"></li>
+            <li class="glide__slide"><img src="/assets/adopters/weave-logo.png" alt="Weaveworks logo"></li>
+            <li class="glide__slide"><img src="/assets/adopters/gophers.png" alt="Gophers"></li>
+            <!-- Add new logos here -->
+            </ul>
+        </div>
+    </div>    
         <p><img alt="Gophers: E, K, S, C, T, &amp; L" src="https://eksctl.io/img/eksctl.png"></p>
-        <p><em>Original Gophers drawn by <a href="https://twitter.com/ashleymcnamara">Ashley McNamara</a>, unique E, K, S, C, T &amp; L Gopher identities had been produced with <a href="https://github.com/matryer/gopherize.me">Gopherize.me</a>.</em></p>
+        <p>Original Gophers drawn by <a href="https://twitter.com/ashleymcnamara">Ashley McNamara</a>, unique E, K, S, C, T &amp; L Gopher identities had been produced with <a href="https://github.com/matryer/gopherize.me">Gopherize.me</a>.</p>
         <p>Site powered by <a href="https://netlify.com">Netlify &copy;</a></p>
     Copyright &copy; {{ build_date_utc.strftime('%Y') }} Weaveworks
     <br>