github.com/Jeffail/benthos/v3@v3.65.0/website/src/pages/blobfish.js (about)

     1  import React from 'react';
     2  
     3  import Layout from '@theme/Layout';
     4  
     5  import classnames from 'classnames';
     6  import styles from './blobfish.module.css';
     7  
     8  const emojis = [
     9    "blob.png",
    10    "blobok.png",
    11    "blobyes.png",
    12    "blobno.png",
    13    "blobcool.png",
    14    "blobkiss.png",
    15    "blobthanks.png",
    16    "blobthinking.png",
    17    "blobpalm.png",
    18    "blobwave.png",
    19    "blobheart.png",
    20    "blobcrying.png",
    21    "blobcrylaugh.png",
    22    "blobnaughty.png",
    23    "blobbot.png",
    24    "blobemo.png",
    25    "blobnerd.png",
    26    "cowblob.png",
    27    "blobbug.png",
    28    "blobpirate.png",
    29    "blobbounce.gif",
    30    "blobtrance.gif",
    31  ];
    32  
    33  function Blobfish() {
    34    return (
    35      <Layout title="Blobfish" description="The offical Benthos mascot">
    36        <header className={classnames("hero")}>
    37          <div className="container">
    38            <div className="row">
    39              <div className="col col--6 col--offset-3 text--center">
    40                <img className={styles.headerImg} src="/img/logo.svg" />
    41                <div>
    42                  <h1>The Benthos Blobfish</h1>
    43                  <div className="hero--subtitle">
    44                      The official Benthos mascot.
    45                  </div>
    46                </div>
    47              </div>
    48            </div>
    49          </div>
    50        </header>
    51        <main>
    52          <section>
    53            <div className="container container-narrow padding-top--lg">
    54              <div className="row margin-bottom--lg">
    55                <div className="col col--8 col--offset-2">
    56                  <p>
    57  The Benthos blobfish began its life as a dumb placeholder logo, and since nothing has changed this is still the case.
    58                  </p>
    59                  <p>
    60  Variations of the mascot such as the <a href="/img/Blobpirate.svg">dapper captain blobfish</a> and the utterly flawless <a href="/img/Blobchef.svg">chef blobish</a> were created with love by <a href="https://biscuittowndesigns.com/">Esther Arzola</a>. Sticker packs and other swag can be purchased directly from <a href="https://www.redbubble.com/people/earzola/shop">https://www.redbubble.com/people/earzola/shop</a>.
    61                  </p>
    62                </div>
    63              </div>
    64            </div>
    65          </section>
    66          <section>
    67            <div className="container container--xs">
    68              <div className="row">
    69                <div className="col text--center">
    70                  <h3 className="margin-bottom--sm">Emojis</h3>
    71                  <p>Use these with great care.</p>
    72                </div>
    73              </div>
    74              <div className="row">
    75                <div className={classnames("margin-bottom--lg", "col", "col--8", "col--offset-2", styles.emojiContainer)}>
    76                  {emojis.map((emoji, idx) => (
    77                    <a key={idx} href={`/img/emojis/${emoji}`}>
    78                      <img className={styles.emoji} src={`/img/emojis/${emoji}`}/>
    79                    </a>
    80                  ))}
    81                </div>
    82              </div>
    83            </div>
    84          </section>
    85        </main>
    86      </Layout>
    87    );
    88  }
    89  
    90  export default Blobfish;