ghost-theme/partials/menus/learnMenu.hbs

{{!-- <div>
  <h3 class="text-sm font-medium tracking-wide text-gray-500 uppercase">
    Get Started With Speckle
  </h3>
  <ul class="mt-5 space-y-6">

    <li class="flow-root">
      <a href="#" class="-m-3 p-3 flex items-center rounded-md text-base font-medium text-gray-900 text-gray-900 dark:text-gray-200 dark:hover:text-gray-500 dark:text-gray-200 dark:hover:text-gray-500 hover:bg-gray-50">
        <svg class="flex-shrink-0 h-6 w-6 text-gray-400"
          x-description="Heroicon name: user-group" xmlns="http://www.w3.org/2000/svg"
          fill="none" viewBox="0 0 24 24" stroke="currentColor"
          aria-hidden="true">
          <path stroke-linecap="round" stroke-linejoin="round"
            stroke-width="2" d="M17 20h5v-2a3 3 0 00-5.356-1.857M17 20H7m10 0v-2c0-.656-.126-1.283-.356-1.857M7 20H2v-2a3 3 0 015.356-1.857M7 20v-2c0-.656.126-1.283.356-1.857m0 0a5.002 5.002 0 019.288 0M15 7a3 3 0 11-6 0 3 3 0 016 0zm6 3a2 2 0 11-4 0 2 2 0 014 0zM7 10a2 2 0 11-4 0 2 2 0 014 0z"></path>
        </svg>
        <span class="ml-4">Installation & First Steps</span>
      </a>
    </li>

    <li class="flow-root">
      <a href="#" class="-m-3 p-3 flex items-center rounded-md text-base font-medium text-gray-900 text-gray-900 dark:text-gray-200 dark:hover:text-gray-500 dark:text-gray-200 dark:hover:text-gray-500 hover:bg-gray-50">
        <svg class="flex-shrink-0 h-6 w-6 text-gray-400"
          x-description="Heroicon name: globe-alt" xmlns="http://www.w3.org/2000/svg"
          fill="none" viewBox="0 0 24 24" stroke="currentColor"
          aria-hidden="true">
          <path stroke-linecap="round" stroke-linejoin="round"
            stroke-width="2" d="M21 12a9 9 0 01-9 9m9-9a9 9 0 00-9-9m9 9H3m9 9a9 9 0 01-9-9m9 9c1.657 0 3-4.03 3-9s-1.343-9-3-9m0 18c-1.657 0-3-4.03-3-9s1.343-9 3-9m-9 9a9 9 0 019-9"></path>
        </svg>
        <span class="ml-4">The Speckle Connectors</span>
      </a>
    </li>

    <li class="flow-root">
      <a href="#" class="-m-3 p-3 flex items-center rounded-md text-base font-medium text-gray-900 text-gray-900 dark:text-gray-200 dark:hover:text-gray-500 hover:bg-gray-50">
        <svg class="flex-shrink-0 h-6 w-6 text-gray-400"
          x-description="Heroicon name: bookmark-alt" xmlns="http://www.w3.org/2000/svg"
          fill="none" viewBox="0 0 24 24" stroke="currentColor"
          aria-hidden="true">
          <path stroke-linecap="round" stroke-linejoin="round"
            stroke-width="2" d="M16 4v12l-4-2-4 2V4M6 20h12a2 2 0 002-2V6a2 2 0 00-2-2H6a2 2 0 00-2 2v12a2 2 0 002 2z"></path>
        </svg>
        <span class="ml-4">Speckle for Rhino</span>
      </a>
    </li>

    <li class="flow-root">
      <a href="#" class="-m-3 p-3 flex items-center rounded-md text-base font-medium text-gray-900 text-gray-900 dark:text-gray-200 dark:hover:text-gray-500 hover:bg-gray-50">
        <svg class="flex-shrink-0 h-6 w-6 text-gray-400"
          x-description="Heroicon name: desktop-computer"
          xmlns="http://www.w3.org/2000/svg" fill="none"
          viewBox="0 0 24 24" stroke="currentColor"
          aria-hidden="true">
          <path stroke-linecap="round" stroke-linejoin="round"
            stroke-width="2" d="M9.75 17L9 20l-1 1h8l-1-1-.75-3M3 13h18M5 17h14a2 2 0 002-2V5a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z"></path>
        </svg>
        <span class="ml-4">Speckle for Grasshopper</span>
      </a>
    </li>

    <li class="flow-root">
      <a href="#" class="-m-3 p-3 flex items-center rounded-md text-base font-medium text-gray-900 text-gray-900 dark:text-gray-200 dark:hover:text-gray-500 hover:bg-gray-50">
        <svg class="flex-shrink-0 h-6 w-6 text-gray-400"
          x-description="Heroicon name: desktop-computer"
          xmlns="http://www.w3.org/2000/svg" fill="none"
          viewBox="0 0 24 24" stroke="currentColor"
          aria-hidden="true">
          <path stroke-linecap="round" stroke-linejoin="round"
            stroke-width="2" d="M9.75 17L9 20l-1 1h8l-1-1-.75-3M3 13h18M5 17h14a2 2 0 002-2V5a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z"></path>
        </svg>
        <span class="ml-4">Speckle for Dynamo</span>
      </a>
    </li>


  </ul>
</div> --}}

{{!-- <div>
  <h3 class="text-sm font-medium tracking-wide text-gray-500 uppercase">
    Interoperability Guides
  </h3>
  <ul class="mt-5 space-y-6">

    <li class="flow-root">
      <a href="#" class="-m-3 p-3 flex items-center rounded-md text-base font-medium text-gray-900 text-gray-900 dark:text-gray-200 dark:hover:text-gray-500 hover:bg-gray-50">
        <svg class="flex-shrink-0 h-6 w-6 text-gray-400"
          x-description="Heroicon name: user-group" xmlns="http://www.w3.org/2000/svg"
          fill="none" viewBox="0 0 24 24" stroke="currentColor"
          aria-hidden="true">
          <path stroke-linecap="round" stroke-linejoin="round"
            stroke-width="2" d="M17 20h5v-2a3 3 0 00-5.356-1.857M17 20H7m10 0v-2c0-.656-.126-1.283-.356-1.857M7 20H2v-2a3 3 0 015.356-1.857M7 20v-2c0-.656.126-1.283.356-1.857m0 0a5.002 5.002 0 019.288 0M15 7a3 3 0 11-6 0 3 3 0 016 0zm6 3a2 2 0 11-4 0 2 2 0 014 0zM7 10a2 2 0 11-4 0 2 2 0 014 0z"></path>
        </svg>
        <span class="ml-4">Rhino ↔ Revit</span>
      </a>
    </li>

    <li class="flow-root">
      <a href="#" class="-m-3 p-3 flex items-center rounded-md text-base font-medium text-gray-900 text-gray-900 dark:text-gray-200 dark:hover:text-gray-500 hover:bg-gray-50">
        <svg class="flex-shrink-0 h-6 w-6 text-gray-400"
          x-description="Heroicon name: globe-alt" xmlns="http://www.w3.org/2000/svg"
          fill="none" viewBox="0 0 24 24" stroke="currentColor"
          aria-hidden="true">
          <path stroke-linecap="round" stroke-linejoin="round"
            stroke-width="2" d="M21 12a9 9 0 01-9 9m9-9a9 9 0 00-9-9m9 9H3m9 9a9 9 0 01-9-9m9 9c1.657 0 3-4.03 3-9s-1.343-9-3-9m0 18c-1.657 0-3-4.03-3-9s1.343-9 3-9m-9 9a9 9 0 019-9"></path>
        </svg>
        <span class="ml-4">Grasshopper ↔ Revit</span>
      </a>
    </li>

    <li class="flow-root">
      <a href="#" class="-m-3 p-3 flex items-center rounded-md text-base font-medium text-gray-900 text-gray-900 dark:text-gray-200 dark:hover:text-gray-500 hover:bg-gray-50">
        <svg class="flex-shrink-0 h-6 w-6 text-gray-400"
          x-description="Heroicon name: bookmark-alt" xmlns="http://www.w3.org/2000/svg"
          fill="none" viewBox="0 0 24 24" stroke="currentColor"
          aria-hidden="true">
          <path stroke-linecap="round" stroke-linejoin="round"
            stroke-width="2" d="M16 4v12l-4-2-4 2V4M6 20h12a2 2 0 002-2V6a2 2 0 00-2-2H6a2 2 0 00-2 2v12a2 2 0 002 2z"></path>
        </svg>
        <span class="ml-4">Revit ↔ Others</span>
      </a>
    </li>
  </ul>
</div> --}}

<a href="https://discourse.speckle.works" target="blank"
  class="-m-3 p-3 flex flex-col justify-between rounded-lg transition dark:bg-gray-950 hover:bg-blue-100 dark:hover:bg-gray-800">
  <div class="flex-shrink-0">
    <span class="inline-flex items-center justify-center h-64 w-64 rounded-md text-gray-500 dark:text-white sm:h-12 sm:w-12">
      <svg class="h-6 w-6" x-description="Heroicon name: chart-bar"
        xmlns="http://www.w3.org/2000/svg" fill="none"
        viewBox="0 0 24 24" stroke="currentColor"
        aria-hidden="true">
        <path stroke-linecap="round" stroke-linejoin="round"
          stroke-width="2" d="M17 20h5v-2a3 3 0 00-5.356-1.857M17 20H7m10 0v-2c0-.656-.126-1.283-.356-1.857M7 20H2v-2a3 3 0 015.356-1.857M7 20v-2c0-.656.126-1.283.356-1.857m0 0a5.002 5.002 0 019.288 0M15 7a3 3 0 11-6 0 3 3 0 016 0zm6 3a2 2 0 11-4 0 2 2 0 014 0zM7 10a2 2 0 11-4 0 2 2 0 014 0z" />
      </svg>
    </span>
  </div>
  <div class="flex items-center md:h-full lg:flex-col">
    <div class="ml-4 md:flex-1 md:flex md:flex-col md:justify-between lg:ml-0 lg:mt-4">
      <div>
        <p class="text-base font-medium text-gray-900 dark:text-gray-50">
          Documentation
        </p>
        <p class="mt-1 text-sm text-gray-900 dark:text-gray-50">
          We're working hard to improve it!
        </p>
      </div>
      <p class="mt-2 text-sm font-medium text-blue-600 lg:mt-4">Check it out <span aria-hidden="true">→</span></p>
    </div>
  </div>
</a>

<a href="https://discourse.speckle.works" target="blank"
  class="-m-3 p-3 flex flex-col justify-between rounded-lg transition dark:bg-gray-950 hover:bg-blue-100 dark:hover:bg-gray-800">
  <div class="flex-shrink-0">
    <span class="inline-flex items-center justify-center h-64 w-64 rounded-md text-gray-500 dark:text-white sm:h-12 sm:w-12">
      <svg class="h-6 w-6" x-description="Heroicon name: chart-bar"
        xmlns="http://www.w3.org/2000/svg" fill="none"
        viewBox="0 0 24 24" stroke="currentColor"
        aria-hidden="true">
        <path stroke-linecap="round" stroke-linejoin="round"
          stroke-width="2" d="M17 20h5v-2a3 3 0 00-5.356-1.857M17 20H7m10 0v-2c0-.656-.126-1.283-.356-1.857M7 20H2v-2a3 3 0 015.356-1.857M7 20v-2c0-.656.126-1.283.356-1.857m0 0a5.002 5.002 0 019.288 0M15 7a3 3 0 11-6 0 3 3 0 016 0zm6 3a2 2 0 11-4 0 2 2 0 014 0zM7 10a2 2 0 11-4 0 2 2 0 014 0z" />
      </svg>
      {{!-- <img src="{{img_url feature_image size="m"}}"> --}}
    </span>
  </div>
  <div class="flex items-center md:h-full lg:flex-col">
    <div class="ml-4 md:flex-1 md:flex md:flex-col md:justify-between lg:ml-0 lg:mt-4">
      <div>
        <p class="text-base font-medium text-gray-900 dark:text-gray-50">
          Community Forum
        </p>
        <p class="mt-1 text-sm text-gray-900 dark:text-gray-50">
          Where questions get answered, showcases, and
          more!
        </p>
      </div>
      <p class="mt-2 text-sm font-medium text-blue-600 lg:mt-4">Register
        now <span aria-hidden="true">→</span></p>
    </div>
  </div>
</a>

<a href="/blog" class="-m-3 p-3 flex flex-col justify-between rounded-lg transition dark:bg-gray-950 hover:bg-blue-100 dark:hover:bg-gray-800">
  <div class="flex-shrink-0">
    <span class="inline-flex items-center justify-center h-64 w-64 rounded-md text-gray-500 dark:text-white sm:h-12 sm:w-12">
      <svg class="h-6 w-6"
        xmlns="http://www.w3.org/2000/svg" fill="none"
        viewBox="0 0 24 24" stroke="currentColor"
        aria-hidden="true">
        <path stroke-linecap="round" stroke-linejoin="round"
          stroke-width="2" d="M11 5.882V19.24a1.76 1.76 0 01-3.417.592l-2.147-6.15M18 13a3 3 0 100-6M5.436 13.683A4.001 4.001 0 017 6h1.832c4.1 0 7.625-1.234 9.168-3v14c-1.543-1.766-5.067-3-9.168-3H7a3.988 3.988 0 01-1.564-.317z" />
      </svg>
    </span>
  </div>
  <div class="flex items-center md:h-full lg:flex-col">
    <div class="ml-4 md:flex-1 md:flex md:flex-col md:justify-between lg:ml-0 lg:mt-4">
      <div>
        <p class="text-base font-medium text-gray-900 dark:text-gray-50">
          Blog
        </p>
        <p class="mt-1 text-sm text-gray-900 dark:text-gray-50">
          News & thoughts from the Speckle Team.
        </p>
      </div>
      <p class="mt-2 text-sm font-medium text-blue-600 lg:mt-4">Read
        More <span aria-hidden="true">→</span></p>
    </div>
  </div>
</a>

<a href="/blog" class="-m-3 p-3 flex flex-col justify-between rounded-lg transition dark:bg-gray-950 hover:bg-blue-100 dark:hover:bg-gray-800">
  <div class="flex-shrink-0">
    <span class="inline-flex items-center justify-center h-64 w-64 rounded-md text-gray-500 dark:text-white sm:h-12 sm:w-12">
      <svg class="h-6 w-6"
        xmlns="http://www.w3.org/2000/svg" fill="none"
        viewBox="0 0 24 24" stroke="currentColor"
        aria-hidden="true">
        <path stroke-linecap="round" stroke-linejoin="round"
          stroke-width="2" d="M11 5.882V19.24a1.76 1.76 0 01-3.417.592l-2.147-6.15M18 13a3 3 0 100-6M5.436 13.683A4.001 4.001 0 017 6h1.832c4.1 0 7.625-1.234 9.168-3v14c-1.543-1.766-5.067-3-9.168-3H7a3.988 3.988 0 01-1.564-.317z" />
      </svg>
    </span>
  </div>
  <div class="flex items-center md:h-full lg:flex-col">
    <div class="ml-4 md:flex-1 md:flex md:flex-col md:justify-between lg:ml-0 lg:mt-4">
      <div>
        <p class="text-base font-medium text-gray-900 dark:text-gray-50">
          Github
        </p>
        <p class="mt-1 text-sm text-gray-900 dark:text-gray-50">
          Check out the Speckle source code and give us a star ⭐️
        </p>
      </div>
      <p class="mt-2 text-sm font-medium text-blue-600 lg:mt-4">Read
        More <span aria-hidden="true">→</span></p>
    </div>
  </div>
</a>