Pen Settings

HTML

CSS

CSS Base

Vendor Prefixing

Add External Stylesheets/Pens

Any URLs added here will be added as <link>s in order, and before the CSS in the editor. You can use the CSS from another Pen by using its URL and the proper URL extension.

+ add another resource

JavaScript

Babel includes JSX processing.

Add External Scripts/Pens

Any URL's added here will be added as <script>s in order, and run before the JavaScript in the editor. You can use the URL of any other Pen and it will include the JavaScript from that Pen.

+ add another resource

Packages

Add Packages

Search for and use JavaScript packages from npm here. By selecting a package, an import statement will be added to the top of the JavaScript editor for this package.

Behavior

Auto Save

If active, Pens will autosave every 30 seconds after being saved once.

Auto-Updating Preview

If enabled, the preview panel updates automatically as you code. If disabled, use the "Run" button to update.

Format on Save

If enabled, your code will be formatted when you actively save your Pen. Note: your code becomes un-folded during formatting.

Editor Settings

Code Indentation

Want to change your Syntax Highlighting theme, Fonts and more?

Visit your global Editor Settings.

HTML

              
                <body class="bg-white text-sky-950 min-h-screen transition duration-300 
    has-[input#theme:checked]:bg-sky-950 
    has-[input#theme:checked]:text-white
">
  
  <!-- theme toggle radio -->
  <input type="checkbox" id="theme" class="sr-only peer/theme" checked>

  <header class="p-6 px-6 flex items-center justify-between
    peer-checked/theme:[&_.switch]:bg-slate-600
    peer-checked/theme:before:[&_.switch]:inset-[var(--p)_var(--p)_var(--p)_calc(50%+var(--p))]
    peer-checked/theme:before:[&_.switch]:bg-sky-950
    peer-checked/theme:[&_.switch>span]:text-white">
    <div class="flex items-center gap-2">
      
      <img src="https://shismqklzntzxworibfn.supabase.co/storage/v1/object/public/avatars/60c986ed-60f5-43d3-afd8-77f9dd94c36e.png" class="bg-black/50 rounded-full size-10 border border-white/30"> Chris
    </div>
    <!-- theme toggle switch -->
    <div style="--h:2rem;--p:0.25rem;" class="   
                *:w-[calc(var(--h)*2)]
                *:h-[var(--h)]
                *:cursor-pointer
                *:grid
                *:grid-cols-2
                *:justify-center
                *:rounded-full
                *:bg-slate-200 
                *:transition-all
                *:duration-300
                *:relative
                *:isolate
                before:*:absolute
                before:*:inset-[var(--p)_calc(50%+var(--p))_var(--p)_var(--p);]
                before:*:rounded-full
                before:*:bg-yellow-400
                before:*:-z-10
                before:*:transition-all
                before:*:duration-500
                before:*:ease-in-out
                [&>label>span]:grid
                [&>label>span]:place-content-center
                [&>label>span]:text-slate-700
                [&>label>span]:text-lg
                [&>label>span]:transition-all
                [&>label>span]:duration-500
            ">
      <label for="theme" class="switch" aria-label="Theme toggle">
        <span class="material-symbols-outlined">light_mode</span>
        <span class="material-symbols-outlined">dark_mode</span>
      </label>
    </div>
  </header>

  <section class="p-6 grid sm:grid-cols-2 gap-8">
    <div class="space-y-6">
      <h1 class="text-2xl tracking-wider ">365 days<br>+480 challenges</h1>
      <h2 class="text-sm w-[32ch]">Completed at least one <a href="https://www.icodethis.com?ref=Chris" target="_blank" class="underline hover:text-rose-300">iCodeThis</a> challenge per day for the last 365 days</h2>

    </div>

    <div class="[grid-row:2] flex items-center gap-4 
                *:opacity-70
                *:transition 
                *:duration-300 
                *:relative 
                *:isolate 
                *:p-1 
                *:size-10                 
                *:grid 
                *:place-content-center
                before:*:absolute
                before:*:inset-full
                before:*:rounded-full
                before:*:bg-black/20
                before:*:-z-10
                before:*:transition-all
                before:*:duration-300
                hover:before:*:inset-0
                before:*:
                hover:*:opacity-100
                hover:*:scale-110
            ">
      <a href="https://x.com/cbolson" target="_blank" title="X">
        <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="currentColor" class="icon icon-tabler icons-tabler-filled icon-tabler-brand-x">
          <path stroke="none" d="M0 0h24v24H0z" fill="none" />
          <path d="M8.267 3a1 1 0 0 1 .73 .317l.076 .092l4.274 5.828l5.946 -5.944a1 1 0 0 1 1.497 1.32l-.083 .094l-6.163 6.162l6.262 8.54a1 1 0 0 1 -.697 1.585l-.109 .006h-4.267a1 1 0 0 1 -.73 -.317l-.076 -.092l-4.276 -5.829l-5.944 5.945a1 1 0 0 1 -1.497 -1.32l.083 -.094l6.161 -6.163l-6.26 -8.539a1 1 0 0 1 .697 -1.585l.109 -.006h4.267z" />
        </svg>
      </a>
      <a href="https://github.com/cbolson" target="_blank" title="github">
        <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="currentColor" class="icon icon-tabler icons-tabler-filled icon-tabler-brand-github">
          <path stroke="none" d="M0 0h24v24H0z" fill="none" />
          <path d="M5.315 2.1c.791 -.113 1.9 .145 3.333 .966l.272 .161l.16 .1l.397 -.083a13.3 13.3 0 0 1 4.59 -.08l.456 .08l.396 .083l.161 -.1c1.385 -.84 2.487 -1.17 3.322 -1.148l.164 .008l.147 .017l.076 .014l.05 .011l.144 .047a1 1 0 0 1 .53 .514a5.2 5.2 0 0 1 .397 2.91l-.047 .267l-.046 .196l.123 .163c.574 .795 .93 1.728 1.03 2.707l.023 .295l.007 .272c0 3.855 -1.659 5.883 -4.644 6.68l-.245 .061l-.132 .029l.014 .161l.008 .157l.004 .365l-.002 .213l-.003 3.834a1 1 0 0 1 -.883 .993l-.117 .007h-6a1 1 0 0 1 -.993 -.883l-.007 -.117v-.734c-1.818 .26 -3.03 -.424 -4.11 -1.878l-.535 -.766c-.28 -.396 -.455 -.579 -.589 -.644l-.048 -.019a1 1 0 0 1 .564 -1.918c.642 .188 1.074 .568 1.57 1.239l.538 .769c.76 1.079 1.36 1.459 2.609 1.191l.001 -.678l-.018 -.168a5.03 5.03 0 0 1 -.021 -.824l.017 -.185l.019 -.12l-.108 -.024c-2.976 -.71 -4.703 -2.573 -4.875 -6.139l-.01 -.31l-.004 -.292a5.6 5.6 0 0 1 .908 -3.051l.152 -.222l.122 -.163l-.045 -.196a5.2 5.2 0 0 1 .145 -2.642l.1 -.282l.106 -.253a1 1 0 0 1 .529 -.514l.144 -.047l.154 -.03z" />
        </svg>
      </a>
      <a href="https://www.linkedin.com/in/chrisbolson/" target="_blank" title="Linkedin">
        <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-brand-linkedin">
          <path stroke="none" d="M0 0h24v24H0z" fill="none" />
          <path d="M4 4m0 2a2 2 0 0 1 2 -2h12a2 2 0 0 1 2 2v12a2 2 0 0 1 -2 2h-12a2 2 0 0 1 -2 -2z" />
          <path d="M8 11l0 5" />
          <path d="M8 8l0 .01" />
          <path d="M12 16l0 -5" />
          <path d="M16 16v-3a2 2 0 0 0 -4 0" />
        </svg>
      </a>
      <a href="https://www.icodethis.com/Chris" target="_blank" title="iCodeThis">
        <svg id="icodethis-logo" viewBox="0 0 100 100" fill="none"" style="padding-top:5px" class="size-6">
                <path d=" M66.7698 0H42.0371V24.7327H66.7698V0Z" fill="currentColor"></path>
                <path d="M42.037 24.7327H0V49.4654H42.037V24.7327Z" fill="currentColor"></path>
                <path d="M93.4193 49.4653H41.8115V74.1981H93.4193V49.4653Z" fill="currentColor"></path>
            </svg>
      </a>
      <a href="https://codepen.io/cbolson" target="_blank" title="Codepen">
          <svg xmlns="http://www.w3.org/2000/svg"  viewBox="0 0 32 32" class="size-6">
                <path fill="currentColor"
                    d="m16 2.844l-.563.375l-12 8.031l-.437.281v8.938l.438.281l12 8.031l.562.375l.563-.375l12-8.031l.437-.281V11.53l-.438-.281l-12-8.031zm-1 3.062v5.438l-5.156 3.469l-4.031-2.72zm2 0l9.188 6.188l-4.032 2.719L17 11.342zm-1 7.188L20.344 16L16 18.906L11.656 16zm-11 .844L8.063 16L5 18.063zm22 0v4.124L23.937 16zm-17.125 3.25L15 20.655v5.438l-9.188-6.188zm12.25 0l4.063 2.718L17 26.094v-5.438z" />
            </svg>
        </a>
    </div>
  </section>

  <div class="sm:mt-6 flex gap-2 px-6 
            *:transition-all
            *:duration-300
            *:opacity-70
            disabled:*:opacity-25
            hover:[&>button:not([disabled])]:opacity-100
            hover:[&>button:not([disabled])]:scale-125
            focus-visible:[&>button:not([disabled])]:opacity-100
            focus-visible:[&>button:not([disabled])]:scale-125
        ">
    <button type="button" id="btn-prev" title="previous" disabled>
      <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-chevron-left">
        <path stroke="none" d="M0 0h24v24H0z" fill="none" />
        <path d="M15 6l-6 6l6 6" />
      </svg>
    </button>
    <button type="button" id="btn-next" title="next">
      <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-chevron-right">
        <path stroke="none" d="M0 0h24v24H0z" fill="none" />
        <path d="M9 6l6 6l-6 6" />
      </svg>
    </button>
  </div>

  <section id="gallery" class="my-6 pb-12 grid gap-3 grid-flow-col auto-cols-max overflow-x-auto
            [&:has(a:hover)_img:not(:hover)]:scale-[80%]
            [&:has(a:hover)_img:not(:hover)]:saturate-50
            [scroll-snap-type:x_mandatory;]
            max-[400px]:*:w-40
            *:w-60
            *:[scroll-snap-align:start;]
            *:transition-all
            *:p-2
            [&>a:hover>img]:scale-115
            
            [&_img]:relative
            [&_img]:transition-all 
            [&_img]:duration-300
            [&_img]:w-full
            [&_img]:h-full
            [&_img]:object-cover
            [&_img]:z-10

            [&_p]:text-xs
            [&_p]:p-1
            [&_p]:-translate-y-8
            [&_p]:opacity-0
            [&_p]:transition-all
            [&_p]:duration-300
            [&_p]:-z-10

            [&>a:hover>p]:translate-y-0
            [&>a:hover>p]:opacity-100
        ">
  </section>
</body>
              
            
!

CSS

              
                
              
            
!

JS

              
                const SUBMISSIONS = [
  {
    "submission_id": "305676",
    "mode": "Coming Soon",
    "previewImage": "5d867962-2456-43b8-a478-57efd1ed784a.png",
    "modeId": "545"
  },
  {
    "submission_id": "305531",
    "mode": "Charts",
    "previewImage": "b4e1df27-7374-4bb0-9d23-afbb4731a99c.png",
    "modeId": "544"
  },
  {
    "submission_id": "305294",
    "mode": "Calendar Comps",
    "previewImage": "35a01cd5-9788-485d-9592-edc1e6674341.png",
    "modeId": "543"
  },
  {
    "submission_id": "305158",
    "mode": "Boardme Signup",
    "previewImage": "f86fba7a-b991-45a4-a521-41041bd21a14.png",
    "modeId": "542"
  },
  {
    "submission_id": "304937",
    "mode": "Blog Comps",
    "previewImage": "c5e6727b-f787-4901-b75e-400a2c0e7eed.png",
    "modeId": "541"
  },
  {
    "submission_id": "304763",
    "mode": "Big Menu 2",
    "previewImage": "f4766524-53ce-462f-964c-37d97605080d.png",
    "modeId": "540"
  },
  {
    "submission_id": "304294",
    "mode": "Website Comps",
    "previewImage": "bc4f1215-94ed-4c85-99e5-4d26ac44b5f9.png",
    "modeId": "558"
  },
  {
    "submission_id": "304177",
    "mode": "Search Ui",
    "previewImage": "864e914e-ab1c-4712-b27a-054cec8e4c18.png",
    "modeId": "555"
  },
  {
    "submission_id": "303823",
    "mode": "Search Comps",
    "previewImage": "6ab27df6-17f5-453f-b6f0-5e67031e31b9.png",
    "modeId": "553"
  },
  {
    "submission_id": "303650",
    "mode": "Recipe Comps",
    "previewImage": "0df1bec1-088f-47cd-a03f-005427ff8000.png",
    "modeId": "552"
  },
  {
    "submission_id": "303266",
    "mode": "Rating Comps",
    "previewImage": "7ed58df5-a5c4-4c99-a8d4-eb0890c867f2.png",
    "modeId": "551"
  },
  {
    "submission_id": "302719",
    "mode": "Progress Checks 2",
    "previewImage": "34e27e75-8936-403d-af99-0511619c1ee1.png",
    "modeId": "550"
  },
  {
    "submission_id": "302624",
    "mode": "Filter Comps",
    "previewImage": "89f89dc6-f748-4495-89eb-3955cc46864b.png",
    "modeId": "549"
  },
  {
    "submission_id": "302546",
    "mode": "Skewed Pricing",
    "previewImage": "e38e8bbc-b9fe-4784-8642-5c6b87b6c64d.png",
    "modeId": "556"
  },
  {
    "submission_id": "302403",
    "mode": "Ui Design Daily",
    "previewImage": "0f6a71e5-98e4-4567-9798-5e55064a1465.png",
    "modeId": "557"
  },
  {
    "submission_id": "302208",
    "mode": "Company Card",
    "previewImage": "f12977dd-4a27-42e1-8b39-fe8cf95e04df.png",
    "modeId": "95"
  },
  {
    "submission_id": "301702",
    "mode": "Ecommerce Landing",
    "previewImage": "ede17316-2a24-4ac2-9bc1-0fbe9f5122f5.png",
    "modeId": "355"
  },
  {
    "submission_id": "301773",
    "mode": "Steps",
    "previewImage": "9b2751ce-b755-4963-955e-6a748a04fc57.png",
    "modeId": "93"
  },
  {
    "submission_id": "301719",
    "mode": "New Message",
    "previewImage": "98fa42d2-7a0f-4cc1-98db-78d066640756.png",
    "modeId": "422"
  },
  {
    "submission_id": "301521",
    "mode": "Translator App",
    "previewImage": "bf9e78eb-6351-456f-9ff0-198cd2b5a8b5.png",
    "modeId": "411"
  },
  {
    "submission_id": "301351",
    "mode": "Social Profile",
    "previewImage": "13ad373d-615a-4cfc-b9a5-221b9a6023d5.png",
    "modeId": "76"
  },
  {
    "submission_id": "301204",
    "mode": "Task Details",
    "previewImage": "186f11bf-ae0b-47f6-b104-3dccc47cb67c.png",
    "modeId": "340"
  },
  {
    "submission_id": "300988",
    "mode": "Domain Landing Page",
    "previewImage": "52c5c2fe-3766-4c3f-aa40-2b43bbe35816.png",
    "modeId": "431"
  },
  {
    "submission_id": "300795",
    "mode": "Social Profile 2",
    "previewImage": "3f983193-a53d-4f01-ad4e-da1c6baeacf0.png",
    "modeId": "522"
  },
  {
    "submission_id": "300583",
    "mode": "Fancy Sliders",
    "previewImage": "3b978c8c-2572-496e-8a00-97ec7689a5ed.png",
    "modeId": "78"
  },
  {
    "submission_id": "300277",
    "mode": "Sync Component",
    "previewImage": "1cf56e34-1be9-4563-9225-58adb92f854c.png",
    "modeId": "526"
  },
  {
    "submission_id": "300009",
    "mode": "Testimonial Slider",
    "previewImage": "ca781ea1-9796-4aae-a6cd-47f100b830fc.png",
    "modeId": "527"
  },
  {
    "submission_id": "299920",
    "mode": "Webshop Components 2",
    "previewImage": "36436625-9186-4d57-b058-bcea5692a156.png",
    "modeId": "532"
  },
  {
    "submission_id": "299697",
    "mode": "User Type Select",
    "previewImage": "c65f12d2-ef33-4b00-8451-260d87074aa8.png",
    "modeId": "531"
  },
  {
    "submission_id": "299330",
    "mode": "User Profile Form",
    "previewImage": "2d611c68-eb84-4e55-8701-90e0405a3a5b.png",
    "modeId": "530"
  },
  {
    "submission_id": "299188",
    "mode": "Upload Media",
    "previewImage": "36f94398-1044-4b61-abaa-b3606ca358e2.png",
    "modeId": "529"
  },
  {
    "submission_id": "298898",
    "mode": "Tooltip",
    "previewImage": "78bcfcf1-3d48-4a12-8039-97708d2113fe.png",
    "modeId": "528"
  },
  {
    "submission_id": "298558",
    "mode": "Statistics 2",
    "previewImage": "f8479485-6685-43a7-8d96-ba60c4d5abd9.png",
    "modeId": "444"
  },
  {
    "submission_id": "298133",
    "mode": "Survey",
    "previewImage": "540ad152-b4f1-4cfb-b609-f06e95e5ba93.png",
    "modeId": "525"
  },
  {
    "submission_id": "297825",
    "mode": "Subscribe Popup",
    "previewImage": "702a089e-624e-4c35-bf70-43bf3c724e14.png",
    "modeId": "524"
  },
  {
    "submission_id": "297527",
    "mode": "Sound Settings",
    "previewImage": "dcecab2e-0b48-461b-80ab-4d2814fb9134.png",
    "modeId": "523"
  },
  {
    "submission_id": "296939",
    "mode": "Simple Cards 2",
    "previewImage": "10109702-fadd-40de-8fca-8ec1f77e7f3a.png",
    "modeId": "521"
  },
  {
    "submission_id": "296680",
    "mode": "Sign-in Select",
    "previewImage": "0395a728-df7c-4c5d-9cc2-ee43fe4bec70.png",
    "modeId": "520"
  },
  {
    "submission_id": "296526",
    "mode": "Sidebar Menu",
    "previewImage": "d6b7cd81-642c-4edd-8eef-a004d6a24010.png",
    "modeId": "519"
  },
  {
    "submission_id": "295601",
    "mode": "JoBurger #5",
    "previewImage": "71ef18d0-c918-409b-b2ef-3424c2d7aa7c.png",
    "modeId": "537"
  },
  {
    "submission_id": "295418",
    "mode": "JoBurger #4",
    "previewImage": "6e07c0a5-deb7-4b24-a2e1-fbab2006b55c.png",
    "modeId": "536"
  },
  {
    "submission_id": "295208",
    "mode": "JoBurger #3",
    "previewImage": "df2ce413-2cce-4047-a32d-fd8938365fd2.png",
    "modeId": "535"
  },
  {
    "submission_id": "294981",
    "mode": "JoBurger #2",
    "previewImage": "148ee527-0cd1-479f-9d92-47df01e73c25.png",
    "modeId": "534"
  },
  {
    "submission_id": "294843",
    "mode": "JoBurger #1",
    "previewImage": "8a55a885-c988-4db5-8395-4c32f31b3693.png",
    "modeId": "533"
  },
  {
    "submission_id": "294435",
    "mode": "Landing Page",
    "previewImage": "dc9bca62-cae9-47d4-8ab2-430b623b2b29.png",
    "modeId": "423"
  },
  {
    "submission_id": "294364",
    "mode": "Rent A Car",
    "previewImage": "069ce837-dfb6-46fe-9dd0-9e34492328d1.png",
    "modeId": "475"
  },
  {
    "submission_id": "294239",
    "mode": "Pending Invites",
    "previewImage": "35dde480-4ae1-4490-9809-92599540e025.png",
    "modeId": "446"
  },
  {
    "submission_id": "294060",
    "mode": "Billing",
    "previewImage": "1ee6fa56-2440-4e08-8ce3-628af8e635fd.png",
    "modeId": "147"
  },
  {
    "submission_id": "293894",
    "mode": "Stats Cards",
    "previewImage": "4dde8f40-e75e-4cfb-a162-582b52fa23fc.png",
    "modeId": "420"
  },
  {
    "submission_id": "293758",
    "mode": "Kanban",
    "previewImage": "5aecfc20-3bda-4d78-8138-050541011276.png",
    "modeId": "120"
  },
  {
    "submission_id": "293564",
    "mode": "Projects Chart",
    "previewImage": "0f384d32-0829-4b92-a600-7013a434f29a.png",
    "modeId": "94"
  },
  {
    "submission_id": "293459",
    "mode": "Drink Water",
    "previewImage": "2ec8f1ef-2076-4b29-bc7f-baba2e144628.png",
    "modeId": "74"
  },
  {
    "submission_id": "293358",
    "mode": "Webinar Signup",
    "previewImage": "a48e1d08-dde3-4d10-adf0-9e8949716635.png",
    "modeId": "144"
  },
  {
    "submission_id": "293196",
    "mode": "Courses Landing",
    "previewImage": "e41fc5d3-d025-4451-abc4-4ad599ae5158.png",
    "modeId": "464"
  },
  {
    "submission_id": "293041",
    "mode": "Portfolio Profile",
    "previewImage": "cefe75c8-3e21-4048-9e0d-84f26b229821.png",
    "modeId": "48"
  },
  {
    "submission_id": "292865",
    "mode": "Mortgage Calculator",
    "previewImage": "745871c1-faf5-47f1-a925-c10ac9f00a3e.png",
    "modeId": "102"
  },
  {
    "submission_id": "292596",
    "mode": "Circle Team",
    "previewImage": "120d8510-a934-402a-8ceb-f6a5594c2655.png",
    "modeId": "518"
  },
  {
    "submission_id": "292273",
    "mode": "Pagination",
    "previewImage": "eca76419-4fdd-4782-b6f1-3879854f108e.png",
    "modeId": "87"
  },
  {
    "submission_id": "292073",
    "mode": "Video Player",
    "previewImage": "bcc3a4a6-d7ec-428e-9786-ec6a3a4e2a4d.png",
    "modeId": "117"
  },
  {
    "submission_id": "234911",
    "mode": "Video Player 2",
    "previewImage": "00d6ec4c-20d4-4d15-adc5-f41d0b59749a.png",
    "modeId": "441"
  },
  {
    "submission_id": "291038",
    "mode": "Design System",
    "previewImage": "e3862002-064c-4840-8b5f-76adce2eac0a.png",
    "modeId": "451"
  },
  {
    "submission_id": "290561",
    "mode": "Notes App",
    "previewImage": "88089669-f31e-4efc-88f2-1e8304a1d5bf.png",
    "modeId": "129"
  },
  {
    "submission_id": "290342",
    "mode": "Blog Header",
    "previewImage": "0684869b-97d2-446d-9e0b-cc801d2ef034.png",
    "modeId": "106"
  },
  {
    "submission_id": "289738",
    "mode": "Verify Code",
    "previewImage": "9272b306-3be6-4d24-a546-93713a48c9ea.png",
    "modeId": "134"
  },
  {
    "submission_id": "289604",
    "mode": "Apps List",
    "previewImage": "1b5463bf-dcdf-4689-bd0f-231115c93345.png",
    "modeId": "104"
  },
  {
    "submission_id": "289183",
    "mode": "Redeem Coupon",
    "previewImage": "0ec00c47-d99e-4d18-802d-7a32aef0df2c.png",
    "modeId": "517"
  },
  {
    "submission_id": "289020",
    "mode": "Rainbow Section",
    "previewImage": "018a3901-fdb2-4cf4-8586-a7ad3fc84576.png",
    "modeId": "516"
  },
  {
    "submission_id": "288911",
    "mode": "Progress Bars",
    "previewImage": "a5531e39-bcc3-4e9f-8961-2b9f89614848.png",
    "modeId": "515"
  },
  {
    "submission_id": "288758",
    "mode": "Profile Cards Ui",
    "previewImage": "4731a358-c230-4378-a7bb-9003a8211af9.png",
    "modeId": "514"
  },
  {
    "submission_id": "288661",
    "mode": "Profile Card 2",
    "previewImage": "8f8742fa-c523-4d6d-bdb8-346501237ef6.png",
    "modeId": "513"
  },
  {
    "submission_id": "288537",
    "mode": "Pricing Plans",
    "previewImage": "c51ff1b3-5a0f-4490-8287-ab7852ef9c4b.png",
    "modeId": "512"
  },
  {
    "submission_id": "288427",
    "mode": "Post Section",
    "previewImage": "aeb802f3-eddf-4cda-9c9b-9782cf2d90d0.png",
    "modeId": "511"
  },
  {
    "submission_id": "288333",
    "mode": "Poll 2",
    "previewImage": "1164a59d-30cf-4c54-902f-608d0e887a14.png",
    "modeId": "510"
  },
  {
    "submission_id": "288175",
    "mode": "Plant Care App",
    "previewImage": "33880691-b7fd-4a18-a7a9-24a8fd900f90.png",
    "modeId": "509"
  },
  {
    "submission_id": "288028",
    "mode": "Photos Slider",
    "previewImage": "24b5caca-51b9-4b92-8487-89c202193e3a.png",
    "modeId": "508"
  },
  {
    "submission_id": "287952",
    "mode": "Neumorphic Ui 2",
    "previewImage": "0e304ab9-b627-4360-b814-78348a491232.png",
    "modeId": "506"
  },
  {
    "submission_id": "287818",
    "mode": "Navigation Kit",
    "previewImage": "cff6076a-62bb-402a-8c45-bbb385271b57.png",
    "modeId": "507"
  },
  {
    "submission_id": "287739",
    "mode": "Nav Dropdown",
    "previewImage": "1d88c3ab-f26a-4627-ba03-707d27d13d8a.png",
    "modeId": "153"
  },
  {
    "submission_id": "287588",
    "mode": "Mobile Blogging App",
    "previewImage": "5b72d716-6b20-4300-ba0a-230dd25ee2f4.png",
    "modeId": "151"
  },
  {
    "submission_id": "287384",
    "mode": "Missed Call Card",
    "previewImage": "50ef4877-f217-4df1-8fea-e1d0519e8388.png",
    "modeId": "152"
  },
  {
    "submission_id": "287304",
    "mode": "Mind Map",
    "previewImage": "91462b31-ff9a-4fd5-8de6-3bba3d477dba.png",
    "modeId": "154"
  },
  {
    "submission_id": "287124",
    "mode": "Meeting End Screen",
    "previewImage": "70e390ed-e641-424b-9d26-f09b2899fc6a.png",
    "modeId": "155"
  },
  {
    "submission_id": "286999",
    "mode": "Login Screen 2",
    "previewImage": "e7e45deb-f6be-4620-8ba7-d23dbb5b84b9.png",
    "modeId": "156"
  },
  {
    "submission_id": "286887",
    "mode": "Login Dark Theme",
    "previewImage": "551ec6c2-b111-4048-a9de-b19a7c66caad.png",
    "modeId": "157"
  },
  {
    "submission_id": "286723",
    "mode": "Job Post",
    "previewImage": "8840633e-2800-4add-a5d8-f6301ed97499.png",
    "modeId": "158"
  },
  {
    "submission_id": "286611",
    "mode": "Hiring Profile",
    "previewImage": "a9875b4a-d7d4-4a7a-9b72-1cee7827f818.png",
    "modeId": "159"
  },
  {
    "submission_id": "286462",
    "mode": "Give Feedback",
    "previewImage": "7b44e872-a810-4d57-bd52-3ba840d94e21.png",
    "modeId": "160"
  },
  {
    "submission_id": "286377",
    "mode": "Get The App Popup",
    "previewImage": "2c12ac52-4a59-42a8-a805-da34d926db5e.png",
    "modeId": "161"
  },
  {
    "submission_id": "286221",
    "mode": "Form Dark Theme",
    "previewImage": "ba6d6387-7b82-4a24-b209-c97c288e5afe.png",
    "modeId": "162"
  },
  {
    "submission_id": "286085",
    "mode": "Follower Stats",
    "previewImage": "11cd929f-8caf-4c33-b2b8-ad0ec77b4560.png",
    "modeId": "163"
  },
  {
    "submission_id": "286038",
    "mode": "Filter Components",
    "previewImage": "edbbfcbd-e921-470a-8d67-481caf9c32c1.png",
    "modeId": "164"
  },
  {
    "submission_id": "285886",
    "mode": "Enable Notifications",
    "previewImage": "d457c265-3f89-4172-8b51-ad0b20f9d2e1.png",
    "modeId": "165"
  },
  {
    "submission_id": "285747",
    "mode": "Empty Board",
    "previewImage": "24df3d8b-1d6f-4a18-a809-473ac9045559.png",
    "modeId": "166"
  },
  {
    "submission_id": "285610",
    "mode": "E-Ticket 2",
    "previewImage": "56a1f1db-a82d-4acb-bff1-56bdb469ae90.png",
    "modeId": "167"
  },
  {
    "submission_id": "285526",
    "mode": "Course Progress",
    "previewImage": "617c7026-f3c5-4c0e-8c91-70ed6b31e95d.png",
    "modeId": "168"
  },
  {
    "submission_id": "285329",
    "mode": "Countdown 3",
    "previewImage": "a9187e50-ac94-4470-b967-3a6842abcf17.png",
    "modeId": "169"
  },
  {
    "submission_id": "285245",
    "mode": "Clock In App",
    "previewImage": "e34da963-1c8e-4f13-bd7b-198ae3183697.png",
    "modeId": "170"
  },
  {
    "submission_id": "285043",
    "mode": "Breadcrumbs 2",
    "previewImage": "44135b53-95bb-48db-aa1c-239af3cdef6f.png",
    "modeId": "171"
  },
  {
    "submission_id": "284912",
    "mode": "Billing Cards",
    "previewImage": "9ac88602-8cb0-4af9-8505-850f9397dbbc.png",
    "modeId": "172"
  },
  {
    "submission_id": "284771",
    "mode": "Alarm",
    "previewImage": "c9818df9-f8e8-431f-b8b1-d807ad1eda64.png",
    "modeId": "173"
  },
  {
    "submission_id": "284626",
    "mode": "Account Settings",
    "previewImage": "60798762-cd02-40d3-8c85-2617b4dd4811.png",
    "modeId": "174"
  },
  {
    "submission_id": "284508",
    "mode": "Account Panel",
    "previewImage": "73de1db1-509c-4542-ae6a-972954797c15.png",
    "modeId": "175"
  },
  {
    "submission_id": "284402",
    "mode": "Account Dropdown",
    "previewImage": "6be4834d-7206-4cd2-bf07-347952e81a62.png",
    "modeId": "176"
  },
  {
    "submission_id": "284178",
    "mode": "Webshop Components",
    "previewImage": "48813223-fae2-411a-9ed6-51779fbdff37.png",
    "modeId": "177"
  },
  {
    "submission_id": "284058",
    "mode": "Users List",
    "previewImage": "7ad377ea-a8e7-4070-b7ad-31e115f112f1.png",
    "modeId": "178"
  },
  {
    "submission_id": "283847",
    "mode": "User Profile Ui Kit",
    "previewImage": "610af786-5e12-434c-99ad-3c97b346ecd4.png",
    "modeId": "179"
  },
  {
    "submission_id": "283611",
    "mode": "User Authentication",
    "previewImage": "a09e9b34-48bb-4e4e-8675-09b3e5cb7be9.png",
    "modeId": "180"
  },
  {
    "submission_id": "283490",
    "mode": "To Do 2",
    "previewImage": "0bb774cf-4cd9-414b-8b06-17d99fdba5dc.png",
    "modeId": "181"
  },
  {
    "submission_id": "283338",
    "mode": "Subscription Plan",
    "previewImage": "020be4eb-b0d8-449c-88e0-fd0bd7437681.png",
    "modeId": "182"
  },
  {
    "submission_id": "283159",
    "mode": "Statistics Website",
    "previewImage": "029ed7d1-d497-4e0b-abf7-fe25689011b8.png",
    "modeId": "183"
  },
  {
    "submission_id": "283118",
    "mode": "Sport Webshop",
    "previewImage": "8cd3beba-69fc-40aa-b2f9-b27c1eabfba5.png",
    "modeId": "184"
  },
  {
    "submission_id": "282860",
    "mode": "Settings Widget",
    "previewImage": "e0a6fcfa-111c-4602-8fad-c2fc38519118.png",
    "modeId": "185"
  },
  {
    "submission_id": "224484",
    "mode": "Pricing Card",
    "previewImage": "37765b6d-6f3f-4f6f-a353-2f78dbe6b307.png",
    "modeId": "90"
  },
  {
    "submission_id": "236359",
    "mode": "Info Section",
    "previewImage": "1f7b123a-bdcf-40f4-9c2d-fe05627154e4.png",
    "modeId": "424"
  },
  {
    "submission_id": "282794",
    "mode": "Promote Link",
    "previewImage": "d6350410-dfd9-49ae-baa0-5db74c876f0d.png",
    "modeId": "186"
  },
  {
    "submission_id": "282634",
    "mode": "Payment Method 2",
    "previewImage": "54404411-bac1-4ae4-ad7c-7108eedd4bff.png",
    "modeId": "187"
  },
  {
    "submission_id": "282474",
    "mode": "Payment App",
    "previewImage": "5f54f8a9-6b3c-40de-9c56-cb7a8943f2fe.png",
    "modeId": "188"
  },
  {
    "submission_id": "282296",
    "mode": "Job Board",
    "previewImage": "4fb8b9d1-69f7-4cee-9e7b-a30c60d223a2.png",
    "modeId": "189"
  },
  {
    "submission_id": "282128",
    "mode": "Details Card",
    "previewImage": "3b8bdf9f-ad97-461b-9140-02bd1900fa5e.png",
    "modeId": "190"
  },
  {
    "submission_id": "282016",
    "mode": "Ui Components",
    "previewImage": "dfd7f938-7c34-46a7-914f-b0bd317d4b4e.png",
    "modeId": "191"
  },
  {
    "submission_id": "281818",
    "mode": "Resources Slider",
    "previewImage": "729f8171-e956-4382-8c16-f65f5570dfd0.png",
    "modeId": "192"
  },
  {
    "submission_id": "223900",
    "mode": "Statistics",
    "previewImage": "eb612aa4-c5f3-4676-bc19-bd5240cfabd8.png",
    "modeId": "81"
  },
  {
    "submission_id": "235143",
    "mode": "Dashboard Ui",
    "previewImage": "1afd4729-f316-4ecb-93e1-22140438a7b7.png",
    "modeId": "439"
  },
  {
    "submission_id": "281672",
    "mode": "Message Notification",
    "previewImage": "f612bf42-b5fc-490d-9918-8bc1faafe157.png",
    "modeId": "193"
  },
  {
    "submission_id": "227171",
    "mode": "Incident History",
    "previewImage": "27a3ad1d-4b12-4b49-922a-47b11b411020.png",
    "modeId": "122"
  },
  {
    "submission_id": "281472",
    "mode": "Login Screen",
    "previewImage": "c257e1df-c3e9-4f3c-b32d-5e9f2544f76e.png",
    "modeId": "194"
  },
  {
    "submission_id": "281329",
    "mode": "Inbox Ui",
    "previewImage": "83709180-9b54-47bd-a36f-b041103ec6c4.png",
    "modeId": "195"
  },
  {
    "submission_id": "281194",
    "mode": "Add Collection",
    "previewImage": "81bffb04-8022-4e09-b119-b21a7247842f.png",
    "modeId": "196"
  },
  {
    "submission_id": "228271",
    "mode": "Donate",
    "previewImage": "a6c2399d-30b0-4caa-ab60-d70621ebba47.png",
    "modeId": "138"
  },
  {
    "submission_id": "281039",
    "mode": "Account Ui",
    "previewImage": "fa4be809-a65f-443c-b159-7c506161f3bb.png",
    "modeId": "197"
  },
  {
    "submission_id": "280955",
    "mode": "Restaurant UI Kit",
    "previewImage": "7ef4b95c-edab-4d9e-bce8-f824037671dd.png",
    "modeId": "198"
  },
  {
    "submission_id": "280747",
    "mode": "Vertical Landing",
    "previewImage": "10fdaa6f-f09a-492c-b827-e263056810e3.png",
    "modeId": "199"
  },
  {
    "submission_id": "280633",
    "mode": "Travel Itinerary",
    "previewImage": "2a5b1e2a-f6e0-4de3-9129-780b46d153b5.png",
    "modeId": "200"
  },
  {
    "submission_id": "280413",
    "mode": "Subscription Pricing",
    "previewImage": "a232bade-9f18-45d5-95ed-7cd042c8cda9.png",
    "modeId": "201"
  },
  {
    "submission_id": "280234",
    "mode": "Social Profile Light",
    "previewImage": "003c5527-4d13-4302-b518-0ad5f0201e49.png",
    "modeId": "202"
  },
  {
    "submission_id": "280137",
    "mode": "Simple Pricing 2",
    "previewImage": "a6c09635-f7f3-4162-97a8-e75805f7a6cd.png",
    "modeId": "203"
  },
  {
    "submission_id": "279859",
    "mode": "Resturants Location",
    "previewImage": "6c75e39d-c177-4cd5-a5ea-d978c9be2432.png",
    "modeId": "204"
  },
  {
    "submission_id": "279556",
    "mode": "Basics",
    "previewImage": "ea17cb1c-5fdf-4a12-b6b1-bb88f843ceee.png",
    "modeId": "67"
  },
  {
    "submission_id": "226281",
    "mode": "UI Cards",
    "previewImage": "06a8a651-da1c-48da-a69d-6e5341315902.png",
    "modeId": "113"
  },
  {
    "submission_id": "279387",
    "mode": "Recording UI",
    "previewImage": "eaa4f4c0-e1f3-4767-a285-a587bef2f145.png",
    "modeId": "205"
  },
  {
    "submission_id": "224323",
    "mode": "Movie Ticket",
    "previewImage": "2c70a521-8b36-4fff-8b71-bcf8b48be13d.png",
    "modeId": "64"
  },
  {
    "submission_id": "279266",
    "mode": "Projects Board",
    "previewImage": "44a3bfd1-bd21-41ba-b2cf-ba42b57550df.png",
    "modeId": "206"
  },
  {
    "submission_id": "279027",
    "mode": "One Time Pricing",
    "previewImage": "014146e2-7a32-42b2-892c-e850be2b7411.png",
    "modeId": "207"
  },
  {
    "submission_id": "278943",
    "mode": "Nav Header UI",
    "previewImage": "3aa507f6-52e0-4e43-a856-97b307e9f9ec.png",
    "modeId": "208"
  },
  {
    "submission_id": "278819",
    "mode": "Music Profile",
    "previewImage": "f93de88d-fa4b-4ffb-b023-983026821a4c.png",
    "modeId": "209"
  },
  {
    "submission_id": "278596",
    "mode": "Language Learn",
    "previewImage": "5cd617de-6273-4b8e-9dd2-0b5370a90fdd.png",
    "modeId": "210"
  },
  {
    "submission_id": "278505",
    "mode": "Full Page Select",
    "previewImage": "329085e8-5b8d-4e00-9772-258a7344dc1e.png",
    "modeId": "211"
  },
  {
    "submission_id": "278273",
    "mode": "Double Registration",
    "previewImage": "130f49ea-54cf-4453-b3f7-e60daf530a9f.png",
    "modeId": "212"
  },
  {
    "submission_id": "224599",
    "mode": "Team Page",
    "previewImage": "15ee7c9f-7e92-4b17-bf24-21842808234b.png",
    "modeId": "92"
  },
  {
    "submission_id": "225851",
    "mode": "Followers",
    "previewImage": "47622d16-f310-488c-9210-8d3d4963aa53.png",
    "modeId": "108"
  },
  {
    "submission_id": "226064",
    "mode": "Newsletter",
    "previewImage": "042aa793-98d4-47a1-9dac-c88798fab104.png",
    "modeId": "110"
  },
  {
    "submission_id": "278122",
    "mode": "Documents App",
    "previewImage": "8439095e-b4ad-4b37-a618-704ffa4aed1a.png",
    "modeId": "213"
  },
  {
    "submission_id": "225320",
    "mode": "Calculator",
    "previewImage": "a298f71f-f990-40b5-b6e6-f06979ea32af.png",
    "modeId": "47"
  },
  {
    "submission_id": "277880",
    "mode": "Curriculum Progress",
    "previewImage": "9f6d61cd-fcb6-4748-924d-ee3e610e59ad.png",
    "modeId": "214"
  },
  {
    "submission_id": "277758",
    "mode": "Course CTA",
    "previewImage": "22f87ea5-feac-4629-835b-58d8996fbf92.png",
    "modeId": "215"
  },
  {
    "submission_id": "277631",
    "mode": "Cookie Notification",
    "previewImage": "d243d3a3-72cd-495d-9c73-48e964e91212.png",
    "modeId": "216"
  },
  {
    "submission_id": "277393",
    "mode": "Calculator 2",
    "previewImage": "51cfc6a0-e403-43a1-8a3a-4fe40ebf9a9b.png",
    "modeId": "217"
  },
  {
    "submission_id": "277245",
    "mode": "Analytics Graph",
    "previewImage": "59d2c99a-7eab-4672-a4fd-c1096cdd3fec.png",
    "modeId": "218"
  },
  {
    "submission_id": "277069",
    "mode": "20s Profile",
    "previewImage": "e70305ab-1e6a-4037-bd84-4de1a16dcee3.png",
    "modeId": "219"
  },
  {
    "submission_id": "227013",
    "mode": "Pricing Table 2",
    "previewImage": "c4ec2b53-e893-4d01-aafa-54ca37f05ac9.png",
    "modeId": "121"
  },
  {
    "submission_id": "228195",
    "mode": "Chatbox",
    "previewImage": "fe3363c1-1e39-4cfc-8f3f-934b5932f950.png",
    "modeId": "137"
  },
  {
    "submission_id": "276855",
    "mode": "Testimonials 4",
    "previewImage": "021bac8d-9d02-4f1a-9775-e13e48ac8598.png",
    "modeId": "220"
  },
  {
    "submission_id": "276644",
    "mode": "Storage Plans",
    "previewImage": "dac4718e-6457-42a7-81ba-3568f671327b.png",
    "modeId": "221"
  },
  {
    "submission_id": "276513",
    "mode": "Social Invite",
    "previewImage": "2d1b520c-6c4a-46b0-9c79-80dbb276e9a3.png",
    "modeId": "222"
  },
  {
    "submission_id": "276427",
    "mode": "Select Account",
    "previewImage": "c865de47-d49a-4c24-bb4e-1773d31baa78.png",
    "modeId": "223"
  },
  {
    "submission_id": "276174",
    "mode": "Product Comps",
    "previewImage": "d3abceb2-069f-4e78-970c-643cbec4691e.png",
    "modeId": "224"
  },
  {
    "submission_id": "275981",
    "mode": "Grid Footer",
    "previewImage": "814b07c4-459a-4ae2-8557-dbae3c00d303.png",
    "modeId": "225"
  },
  {
    "submission_id": "275796",
    "mode": "Blog Ui",
    "previewImage": "6b8150ad-1d8f-40cf-a190-f2d855424921.png",
    "modeId": "226"
  },
  {
    "submission_id": "275689",
    "mode": "Blog Page",
    "previewImage": "080db1a2-898f-493b-9663-54d342ceaf86.png",
    "modeId": "227"
  },
  {
    "submission_id": "275450",
    "mode": "Available Positions",
    "previewImage": "33b85401-9c0b-42c0-a7f1-5e3d1975198c.png",
    "modeId": "228"
  },
  {
    "submission_id": "223485",
    "mode": "Christmas Promo",
    "previewImage": "bd5f1a69-fa27-4a5e-87c3-fe27604b6820.png",
    "modeId": "60"
  },
  {
    "submission_id": "275254",
    "mode": "iCodeMas #24",
    "previewImage": "d83b42dc-edbd-4c8f-b7b0-32777c640f66.png",
    "modeId": "229"
  },
  {
    "submission_id": "275100",
    "mode": "iCodeMas #23",
    "previewImage": "84882a2e-166b-4f8b-8fcf-96b84d23c842.png",
    "modeId": "230"
  },
  {
    "submission_id": "274907",
    "mode": "iCodeMas #22",
    "previewImage": "c5989c4e-a05c-4128-a781-bab151ee8198.png",
    "modeId": "231"
  },
  {
    "submission_id": "274714",
    "mode": "iCodeMas #21",
    "previewImage": "19ed0788-41e1-40df-a664-a44377aa6498.png",
    "modeId": "232"
  },
  {
    "submission_id": "274579",
    "mode": "iCodeMas #20",
    "previewImage": "8fad3daf-38f3-44bb-b6e4-e536e8121c19.png",
    "modeId": "233"
  },
  {
    "submission_id": "274393",
    "mode": "iCodeMas #19",
    "previewImage": "decda9d1-51d6-4bf8-b81d-8e96f0e5f756.png",
    "modeId": "234"
  },
  {
    "submission_id": "274151",
    "mode": "iCodeMas #18",
    "previewImage": "56ee1b0b-e687-45b3-96fc-479d6d28fffd.png",
    "modeId": "235"
  },
  {
    "submission_id": "273989",
    "mode": "iCodeMas #17",
    "previewImage": "2924915b-e9b1-4c3d-ac11-1b195e92123d.png",
    "modeId": "236"
  },
  {
    "submission_id": "273843",
    "mode": "iCodeMas #16",
    "previewImage": "e99077b9-4a55-4f1e-8716-b32a00cdf724.png",
    "modeId": "237"
  },
  {
    "submission_id": "273570",
    "mode": "iCodeMas #15",
    "previewImage": "2c26251c-f33b-440d-b1bb-163cdfdafca5.png",
    "modeId": "238"
  },
  {
    "submission_id": "273323",
    "mode": "iCodeMas #14",
    "previewImage": "6cc071a9-0ac6-4a1e-9ddf-c333d5375368.png",
    "modeId": "239"
  },
  {
    "submission_id": "273167",
    "mode": "iCodeMas #13",
    "previewImage": "16f527d1-ec61-400e-8a42-4a72841f45ac.png",
    "modeId": "240"
  },
  {
    "submission_id": "272983",
    "mode": "iCodeMas #12",
    "previewImage": "4129c5f2-4d6d-4125-8dd2-676ce5d40849.png",
    "modeId": "241"
  },
  {
    "submission_id": "224062",
    "mode": "Blog Cards 2",
    "previewImage": "95ebd8e2-1fdf-4483-bce9-6ef95fc9b32e.png",
    "modeId": "83"
  },
  {
    "submission_id": "229933",
    "mode": "Shopping Cart",
    "previewImage": "f971430d-1e99-48c4-a726-07be35663771.png",
    "modeId": "498"
  },
  {
    "submission_id": "223134",
    "mode": "User Feedback",
    "previewImage": "80d577b9-97e1-43b0-b95e-4da6f4730b00.png",
    "modeId": "72"
  },
  {
    "submission_id": "272767",
    "mode": "iCodeMas #11",
    "previewImage": "bb6555ea-3f39-4ab0-8912-974fecf1fbcb.png",
    "modeId": "242"
  },
  {
    "submission_id": "272558",
    "mode": "iCodeMas #10",
    "previewImage": "15d0e8e5-5334-4700-b561-162dd22e4a20.png",
    "modeId": "243"
  },
  {
    "submission_id": "272337",
    "mode": "iCodeMas #09",
    "previewImage": "316fa43f-7859-4f70-b65b-bfb97babd758.png",
    "modeId": "244"
  },
  {
    "submission_id": "272194",
    "mode": "iCodeMas #08",
    "previewImage": "9a5b9f85-594f-4887-8583-75b89728bbac.png",
    "modeId": "245"
  },
  {
    "submission_id": "271975",
    "mode": "iCodeMas #07",
    "previewImage": "40c06e7a-5065-4552-8f5e-56cf6b3b7bec.png",
    "modeId": "246"
  },
  {
    "submission_id": "271747",
    "mode": "iCodeMas #06",
    "previewImage": "d7e99f11-313f-4c1d-ac3b-a961be804773.png",
    "modeId": "247"
  },
  {
    "submission_id": "271507",
    "mode": "iCodeMas #05",
    "previewImage": "bbeee2f7-e253-43a1-a759-3018c2522776.png",
    "modeId": "248"
  },
  {
    "submission_id": "271116",
    "mode": "iCodeMas #04",
    "previewImage": "94c3ac2c-3778-42bd-a5af-74d98c96e55c.png",
    "modeId": "249"
  },
  {
    "submission_id": "228147",
    "mode": "Carousel",
    "previewImage": "68e44616-a67e-4474-a50f-00e1e5071f04.png",
    "modeId": "136"
  },
  {
    "submission_id": "270832",
    "mode": "iCodeMas #03",
    "previewImage": "83b07fa8-62c1-4fdb-99ca-af9ba52d1b73.png",
    "modeId": "250"
  },
  {
    "submission_id": "270498",
    "mode": "iCodeMas #02",
    "previewImage": "9a9a7f0f-5a2f-42e9-8f42-00707f0bd81a.png",
    "modeId": "251"
  },
  {
    "submission_id": "270252",
    "mode": "iCodeMas #01",
    "previewImage": "cdc336b3-b91c-4bee-aef2-57402dd9821c.png",
    "modeId": "252"
  },
  {
    "submission_id": "227632",
    "mode": "Music Store",
    "previewImage": "8569817e-0dad-4470-98ed-a0d6add1fa4b.png",
    "modeId": "128"
  },
  {
    "submission_id": "225780",
    "mode": "FAQ",
    "previewImage": "79e3cbcb-c168-476f-978f-611629eef052.png",
    "modeId": "107"
  },
  {
    "submission_id": "269751",
    "mode": "Simple Contact",
    "previewImage": "c3b495d0-d83e-4b11-918d-003d16973e7f.png",
    "modeId": "253"
  },
  {
    "submission_id": "226729",
    "mode": "Color Generator",
    "previewImage": "58613d66-2148-45db-8a8a-e95d68e6c2b8.png",
    "modeId": "118"
  },
  {
    "submission_id": "224108",
    "mode": "Blog Post",
    "previewImage": "879922b0-87e1-4b23-8862-f1543cc69b20.png",
    "modeId": "84"
  },
  {
    "submission_id": "226456",
    "mode": "User Card",
    "previewImage": "d068c9d8-3fc0-4778-be8f-494d8f98aee6.png",
    "modeId": "115"
  },
  {
    "submission_id": "269508",
    "mode": "Pricing Saas",
    "previewImage": "a42896cf-cc0b-48a2-b235-0c7d408eec59.png",
    "modeId": "254"
  },
  {
    "submission_id": "226532",
    "mode": "User Profiles",
    "previewImage": "0f1ab8bb-bc8d-4a4e-bbff-b168ae9beafc.png",
    "modeId": "116"
  },
  {
    "submission_id": "269446",
    "mode": "Newsletter Cookies",
    "previewImage": "d1e0999e-e593-442a-b663-8d86e1d130f3.png",
    "modeId": "255"
  },
  {
    "submission_id": "224044",
    "mode": "Blog Cards",
    "previewImage": "46cbd617-7766-43ad-b208-8a39ac6cf476.png",
    "modeId": "82"
  },
  {
    "submission_id": "232365",
    "mode": "Create Account",
    "previewImage": "74a4e4b8-95c2-425a-9f7f-8db009cceb71.png",
    "modeId": "463"
  },
  {
    "submission_id": "269129",
    "mode": "Freelancer Card",
    "previewImage": "df4a6ef5-24e3-48e4-a16f-0e4f905ff0b3.png",
    "modeId": "256"
  },
  {
    "submission_id": "268824",
    "mode": "Drag And Drop",
    "previewImage": "9eac3aba-8c96-4100-9581-a29deb6ec0f0.png",
    "modeId": "257"
  },
  {
    "submission_id": "227846",
    "mode": "Photo Gallery",
    "previewImage": "6e1cd661-d56a-49ff-9b88-dcfb9a8c21b3.png",
    "modeId": "131"
  },
  {
    "submission_id": "268640",
    "mode": "Delivery Landing",
    "previewImage": "04d6e042-f09a-404c-b036-50b02b7e06de.png",
    "modeId": "258"
  },
  {
    "submission_id": "227973",
    "mode": "Top Charts",
    "previewImage": "6024823f-a63f-4b0b-b88b-6a4e6f102271.png",
    "modeId": "133"
  },
  {
    "submission_id": "268356",
    "mode": "Confirm Message",
    "previewImage": "aae4f6d7-11e0-4ee1-ad38-4e229ccab33b.png",
    "modeId": "259"
  },
  {
    "submission_id": "228081",
    "mode": "Big Menu",
    "previewImage": "050c4060-5225-49e5-97a7-89d53bf2d20e.png",
    "modeId": "135"
  },
  {
    "submission_id": "268169",
    "mode": "Account Menu",
    "previewImage": "43410ad3-e2f0-4f3a-a8df-c485cf74d2b5.png",
    "modeId": "260"
  },
  {
    "submission_id": "223844",
    "mode": "Job List",
    "previewImage": "cc82efad-9352-4c3d-943a-86cca6c3df12.png",
    "modeId": "80"
  },
  {
    "submission_id": "224184",
    "mode": "Blog Widgets",
    "previewImage": "f3ef573b-917a-452b-9e6c-82a826d611f7.png",
    "modeId": "85"
  },
  {
    "submission_id": "234129",
    "mode": "Newsletter List",
    "previewImage": "7561b3ba-71ec-455a-be2f-cd0f72a12a48.png",
    "modeId": "449"
  },
  {
    "submission_id": "235238",
    "mode": "Reviews #1",
    "previewImage": "d5a95416-6f68-4f2f-8352-846128e5b43b.png",
    "modeId": "494"
  },
  {
    "submission_id": "228681",
    "mode": "Reviews #2",
    "previewImage": "25b047c1-c4ee-4fa4-9205-0969b90065a7.png",
    "modeId": "500"
  },
  {
    "submission_id": "267990",
    "mode": "Traffic Chart",
    "previewImage": "99bdd6a6-b7a7-42a0-a484-f536f51797f9.png",
    "modeId": "261"
  },
  {
    "submission_id": "267905",
    "mode": "Simple User Cards",
    "previewImage": "9f255e0d-5ae4-4d98-b6cc-5b9752665a2c.png",
    "modeId": "262"
  },
  {
    "submission_id": "267633",
    "mode": "Purple Login",
    "previewImage": "2eae30fe-7ca5-4f5c-ac9d-f4ba9c02b096.png",
    "modeId": "263"
  },
  {
    "submission_id": "227352",
    "mode": "Weather App",
    "previewImage": "45062766-f534-412c-b82d-3593183480bd.png",
    "modeId": "124"
  },
  {
    "submission_id": "267599",
    "mode": "Onboarding 4",
    "previewImage": "9e29934d-481b-4401-b3be-d6b3d040d529.png",
    "modeId": "264"
  },
  {
    "submission_id": "267450",
    "mode": "Double Popups",
    "previewImage": "4d85bdf4-0a42-4a1c-96ff-f3fb3cd01268.png",
    "modeId": "265"
  },
  {
    "submission_id": "229821",
    "mode": "Agency Search",
    "previewImage": "1b409b2d-2ece-4193-a421-cb696ec43d0e.png",
    "modeId": "488"
  },
  {
    "submission_id": "228419",
    "mode": "Neumorphic Ui",
    "previewImage": "e7bb59f1-9dc3-468d-a801-27081c8d8559.png",
    "modeId": "139"
  },
  {
    "submission_id": "267227",
    "mode": "Cart Details",
    "previewImage": "aaf635e9-f697-4803-bb3f-7f3d86d612da.png",
    "modeId": "266"
  },
  {
    "submission_id": "230460",
    "mode": "Box Layout",
    "previewImage": "35fedd0c-8072-4f12-acb8-80bfd10384d9.png",
    "modeId": "483"
  },
  {
    "submission_id": "224194",
    "mode": "Feedback Form",
    "previewImage": "978c013a-441a-4820-932a-dafe8ec122a1.png",
    "modeId": "86"
  },
  {
    "submission_id": "228852",
    "mode": "Services Section",
    "previewImage": "509fcbbd-b200-4586-b31c-259f431e9089.png",
    "modeId": "143"
  },
  {
    "submission_id": "229505",
    "mode": "Features List",
    "previewImage": "3cb8f87f-1a9f-4ca8-9243-a4f5d62479f9.png",
    "modeId": "149"
  },
  {
    "submission_id": "235193",
    "mode": "Links Section 2",
    "previewImage": "db927eda-ed96-4192-a947-5132997d46bb.png",
    "modeId": "438"
  },
  {
    "submission_id": "229377",
    "mode": "Donate Card",
    "previewImage": "5362c6b9-e8de-45d2-8eb9-c0373ecb6b28.png",
    "modeId": "148"
  },
  {
    "submission_id": "231197",
    "mode": "Search Suggestions",
    "previewImage": "1fdb30e7-e20c-4f5a-86e4-931d4451660d.png",
    "modeId": "474"
  },
  {
    "submission_id": "267184",
    "mode": "Book List",
    "previewImage": "b26dc261-b706-49be-8f03-3b49f19b5384.png",
    "modeId": "267"
  },
  {
    "submission_id": "227770",
    "mode": "Notes Card",
    "previewImage": "dee240d8-90c6-4471-9fd7-a2d41c79ab51.png",
    "modeId": "130"
  },
  {
    "submission_id": "224924",
    "mode": "Sign in Form",
    "previewImage": "f681af95-8dfa-447d-a74b-4634b5ea6848.png",
    "modeId": "97"
  },
  {
    "submission_id": "233499",
    "mode": "Blog Cards 3",
    "previewImage": "2672b44c-9b62-4559-a2db-3b73e705ba40.png",
    "modeId": "455"
  },
  {
    "submission_id": "225904",
    "mode": "Mega Menu",
    "previewImage": "5c69d3d4-a8e0-4026-b3b2-8082afeb33e3.png",
    "modeId": "109"
  },
  {
    "submission_id": "226389",
    "mode": "Users Card #1",
    "previewImage": "fa7a8e62-d9cb-4c90-9363-397b545f3e78.png",
    "modeId": "501"
  },
  {
    "submission_id": "233832",
    "mode": "Date Picker",
    "previewImage": "325f58b0-9f37-477d-a940-6f4d3ce42d9f.png",
    "modeId": "452"
  },
  {
    "submission_id": "267029",
    "mode": "Blue Cards",
    "previewImage": "e202bb54-b0bc-4a81-a045-714abccbad50.png",
    "modeId": "268"
  },
  {
    "submission_id": "223567",
    "mode": "Testimonials #1",
    "previewImage": "451d83ba-ba11-4756-b65e-2de93a81d2a6.png",
    "modeId": "504"
  },
  {
    "submission_id": "228508",
    "mode": "Onboarding",
    "previewImage": "d05931fa-d048-44e0-a6b7-5a186133d15f.png",
    "modeId": "140"
  },
  {
    "submission_id": "223588",
    "mode": "Signup Form #1",
    "previewImage": "41efc613-ee37-4d7d-bcb8-4fdebf09d0cb.png",
    "modeId": "503"
  },
  {
    "submission_id": "231019",
    "mode": "Menu",
    "previewImage": "1d485c0c-5eef-44ec-a049-9dda60b9d07f.png",
    "modeId": "477"
  },
  {
    "submission_id": "229210",
    "mode": "Activity Feed",
    "previewImage": "8fd0763d-251b-4cf5-b57c-51de502d06dd.png",
    "modeId": "146"
  },
  {
    "submission_id": "226856",
    "mode": "Features",
    "previewImage": "995d2a0f-a74a-446c-9f12-0f0a6f2ca7d0.png",
    "modeId": "119"
  },
  {
    "submission_id": "266877",
    "mode": "Achievements",
    "previewImage": "5f5601ea-cca0-4f41-a1b8-2fd5e76ce299.png",
    "modeId": "269"
  },
  {
    "submission_id": "227415",
    "mode": "Account Popup",
    "previewImage": "d757a323-3f48-4bbc-a398-b6b910922896.png",
    "modeId": "125"
  },
  {
    "submission_id": "231050",
    "mode": "Product Page",
    "previewImage": "93e002f9-12ad-4da5-8147-52139aafe276.png",
    "modeId": "476"
  },
  {
    "submission_id": "266722",
    "mode": "Event Schedule",
    "previewImage": "355ae34f-36db-4623-8224-137afcde385a.png",
    "modeId": "270"
  },
  {
    "submission_id": "266569",
    "mode": "Wishlist",
    "previewImage": "7cb3234b-1012-40e6-b608-37d0b55f4a17.png",
    "modeId": "271"
  },
  {
    "submission_id": "230632",
    "mode": "Cancel Form",
    "previewImage": "467182b6-72a6-4840-8db4-f0efb611650e.png",
    "modeId": "481"
  },
  {
    "submission_id": "266496",
    "mode": "Quiz App",
    "previewImage": "c3e20b52-3d0c-4bba-87fe-09c346911a61.png",
    "modeId": "272"
  },
  {
    "submission_id": "224393",
    "mode": "Pagination 2",
    "previewImage": "05c85855-3515-40be-911e-027fe9dd8b90.png",
    "modeId": "88"
  },
  {
    "submission_id": "223243",
    "mode": "Mobile Menu",
    "previewImage": "45d001d5-6ae7-4f6e-a200-b16bb468c54a.png",
    "modeId": "61"
  },
  {
    "submission_id": "233395",
    "mode": "Authentication",
    "previewImage": "586da44e-dfb1-4242-b5b7-568b2e4575e9.png",
    "modeId": "456"
  },
  {
    "submission_id": "266224",
    "mode": "Pricing Table 4",
    "previewImage": "91c34968-9cc8-49d0-875d-e9ac5333d9bb.png",
    "modeId": "273"
  },
  {
    "submission_id": "229117",
    "mode": "Accordion 2",
    "previewImage": "2fca9e4d-ba7a-4a45-a099-fcb559e38ce0.png",
    "modeId": "145"
  },
  {
    "submission_id": "234021",
    "mode": "Messages Box",
    "previewImage": "75f09ff0-a23d-4aea-b0ec-3628a23d2b51.png",
    "modeId": "450"
  },
  {
    "submission_id": "231826",
    "mode": "Help Center #1",
    "previewImage": "ab005242-72f2-440d-86f4-f49324ca4f35.png",
    "modeId": "496"
  },
  {
    "submission_id": "266183",
    "mode": "Follow List",
    "previewImage": "207f86f7-b951-45d1-b5df-38a13e7e17f0.png",
    "modeId": "274"
  },
  {
    "submission_id": "233604",
    "mode": "Contacts Table",
    "previewImage": "5545888a-98d1-4a7e-9669-d9db1e6e2d82.png",
    "modeId": "454"
  },
  {
    "submission_id": "227568",
    "mode": "Countdown",
    "previewImage": "a20bdacd-daa2-437a-87d1-4e9e716f1ed3.png",
    "modeId": "127"
  },
  {
    "submission_id": "266003",
    "mode": "E-Ticket",
    "previewImage": "a9193512-a5de-4a5d-b62a-b6e5c1e58f1c.png",
    "modeId": "275"
  },
  {
    "submission_id": "225248",
    "mode": "Book Trip",
    "previewImage": "c6f199ff-9fff-4e5d-9981-f207270aae86.png",
    "modeId": "101"
  },
  {
    "submission_id": "231717",
    "mode": "Get Started",
    "previewImage": "6b1c813a-000b-42c3-9dc4-59e603fe3570.png",
    "modeId": "469"
  },
  {
    "submission_id": "265817",
    "mode": "Custom Form Elements",
    "previewImage": "d04a4ca6-5de6-4407-8fdd-b4287f547c11.png",
    "modeId": "276"
  },
  {
    "submission_id": "223355",
    "mode": "Expenses Graph",
    "previewImage": "1c446a53-2aa6-4beb-b5c9-fbd6b520c122.png",
    "modeId": "75"
  },
  {
    "submission_id": "223301",
    "mode": "Leaderboard #1",
    "previewImage": "1436ece1-f1af-49be-9b1c-30a888247dc6.png",
    "modeId": "505"
  },
  {
    "submission_id": "265596",
    "mode": "Countdown 2",
    "previewImage": "7047c171-c72d-4235-baab-0d41b62565ba.png",
    "modeId": "277"
  },
  {
    "submission_id": "265482",
    "mode": "Smart Bulb",
    "previewImage": "23e4c486-5e08-4084-b899-5d6f528358b9.png",
    "modeId": "278"
  },
  {
    "submission_id": "265286",
    "mode": "Reminder App",
    "previewImage": "4387e581-f39b-406a-8c94-57e45e6cadf6.png",
    "modeId": "279"
  },
  {
    "submission_id": "230755",
    "mode": "Email Settings",
    "previewImage": "de205d93-062a-4a2d-853d-105f62bb5b60.png",
    "modeId": "480"
  },
  {
    "submission_id": "232791",
    "mode": "Report",
    "previewImage": "e502aa0a-c0e7-4432-b7fe-68aa9c87d6ed.png",
    "modeId": "460"
  },
  {
    "submission_id": "265063",
    "mode": "Pricing Crop",
    "previewImage": "368934a9-c290-48ff-8521-3fe8ed3e941a.png",
    "modeId": "280"
  },
  {
    "submission_id": "225042",
    "mode": "Background Pattern",
    "previewImage": "d38c2ff5-0a37-4618-9847-597863d1668f.png",
    "modeId": "98"
  },
  {
    "submission_id": "265003",
    "mode": "Post Card 2",
    "previewImage": "441c629a-1238-44e0-985f-39c26e92d3e9.png",
    "modeId": "281"
  },
  {
    "submission_id": "264720",
    "mode": "Onboarding 2",
    "previewImage": "29564590-4f30-46e7-8e94-cdc27ee85ab8.png",
    "modeId": "282"
  },
  {
    "submission_id": "264416",
    "mode": "Halloween",
    "previewImage": "8cb9d932-94fc-4615-be7a-e9367804eb74.png",
    "modeId": "283"
  },
  {
    "submission_id": "232574",
    "mode": "Free Apis",
    "previewImage": "79f5b1bf-405d-446d-86f2-948dc88cf8d1.png",
    "modeId": "461"
  },
  {
    "submission_id": "232672",
    "mode": "Leaderboard #2",
    "previewImage": "3398458f-5e18-41e9-b530-3cfc30ff5aeb.png",
    "modeId": "495"
  },
  {
    "submission_id": "230083",
    "mode": "Stats Card",
    "previewImage": "6a85f85c-c9a7-4ff2-ae59-2bab53b61375.png",
    "modeId": "485"
  },
  {
    "submission_id": "264252",
    "mode": "Creative Dropdown",
    "previewImage": "44346d1b-2f4c-40a2-b8d4-f76a1470a87b.png",
    "modeId": "284"
  },
  {
    "submission_id": "264137",
    "mode": "Trees Community",
    "previewImage": "8bc3aaba-9ba5-443b-915f-d8b62f6d0641.png",
    "modeId": "285"
  },
  {
    "submission_id": "264025",
    "mode": "Settings Modal",
    "previewImage": "b9cfc545-93d5-4a3c-8176-a6a83fcefc4d.png",
    "modeId": "286"
  },
  {
    "submission_id": "227495",
    "mode": "Analytics Chart",
    "previewImage": "3d344225-a5e9-4673-b733-9afc9d874681.png",
    "modeId": "126"
  },
  {
    "submission_id": "229553",
    "mode": "Help Center #2",
    "previewImage": "b50e5366-6d8b-4b5e-b06f-d1326706a8d2.png",
    "modeId": "499"
  },
  {
    "submission_id": "232945",
    "mode": "Share Link",
    "previewImage": "774b7ad6-120a-4ba6-b1b8-1c46b69ece56.png",
    "modeId": "459"
  },
  {
    "submission_id": "263875",
    "mode": "Pro Profile",
    "previewImage": "c0af09e3-aa79-48db-822a-0e2debe0e4f4.png",
    "modeId": "287"
  },
  {
    "submission_id": "232028",
    "mode": "Testimonials 2",
    "previewImage": "7f4e2b95-0803-4fe6-8db8-c8ad0eebe4d5.png",
    "modeId": "467"
  },
  {
    "submission_id": "234777",
    "mode": "Subscription Popup",
    "previewImage": "6751b95b-7e0c-4efa-ab06-8de9d38e8a8c.png",
    "modeId": "442"
  },
  {
    "submission_id": "225978",
    "mode": "Music Player",
    "previewImage": "6c80cad9-df48-4a2c-a76a-5b4deecef0bc.png",
    "modeId": "59"
  },
  {
    "submission_id": "263518",
    "mode": "Profile Dropdown",
    "previewImage": "fd751fe6-2c54-4a23-9290-323e900a1192.png",
    "modeId": "288"
  },
  {
    "submission_id": "230562",
    "mode": "Booking",
    "previewImage": "2fb6cda8-1e09-4384-a0f1-8c9560a9c06e.png",
    "modeId": "482"
  },
  {
    "submission_id": "234227",
    "mode": "Order Placed",
    "previewImage": "43302822-c023-4717-8c81-32b0bdadbb59.png",
    "modeId": "448"
  },
  {
    "submission_id": "263496",
    "mode": "Onboarding 3",
    "previewImage": "1b967adf-a199-445f-b7ab-be4a75cbdb1a.png",
    "modeId": "289"
  },
  {
    "submission_id": "225493",
    "mode": "Calendar 2",
    "previewImage": "69bcd0bb-9b7d-4cf3-8e86-cb164002cc24.png",
    "modeId": "63"
  },
  {
    "submission_id": "224244",
    "mode": "Movie Card",
    "previewImage": "bf5a3d93-bb83-4648-baae-23f951c154b2.png",
    "modeId": "57"
  },
  {
    "submission_id": "225648",
    "mode": "App Card",
    "previewImage": "f7b9acd6-9031-4949-ae86-fa28a3af6611.png",
    "modeId": "105"
  },
  {
    "submission_id": "223274",
    "mode": "Cart Item",
    "previewImage": "4a507646-a00e-4f6a-8eed-14309f59b4e5.png",
    "modeId": "52"
  },
  {
    "submission_id": "263133",
    "mode": "Message Box",
    "previewImage": "2da01921-3886-44b7-bad7-09b09c4cdb19.png",
    "modeId": "290"
  },
  {
    "submission_id": "223968",
    "mode": "Article Page",
    "previewImage": "22fd9592-6017-4d39-89da-bdf2fd2811b4.png",
    "modeId": "49"
  },
  {
    "submission_id": "224419",
    "mode": "Poll",
    "previewImage": "1e0a495c-1750-4542-a98a-234a2e293ba8.png",
    "modeId": "89"
  },
  {
    "submission_id": "223656",
    "mode": "Profile Header",
    "previewImage": "389b32e5-1100-4e1e-9efa-b37fcb220c80.png",
    "modeId": "51"
  },
  {
    "submission_id": "223914",
    "mode": "Password Field",
    "previewImage": "c436cfeb-8d2c-4e1e-be97-c0b76cd0487d.png",
    "modeId": "46"
  },
  {
    "submission_id": "262992",
    "mode": "Timeline 2",
    "previewImage": "0fa44970-85dd-46b9-95a2-89fc52514ea8.png",
    "modeId": "291"
  },
  {
    "submission_id": "228313",
    "mode": "Login Card",
    "previewImage": "76a2d403-0e85-4d0a-825a-94947714cecb.png",
    "modeId": "38"
  },
  {
    "submission_id": "262688",
    "mode": "Promo Section",
    "previewImage": "10a62efb-7d04-43b6-bd0f-3473e7c53c59.png",
    "modeId": "292"
  },
  {
    "submission_id": "227080",
    "mode": "Project Card",
    "previewImage": "c54c44cf-60d5-4375-b680-40cf08c6c855.png",
    "modeId": "56"
  },
  {
    "submission_id": "224957",
    "mode": "Signup Form #2",
    "previewImage": "75d9c71d-ccbb-4b6a-aa25-9a1a4679f65a.png",
    "modeId": "502"
  },
  {
    "submission_id": "262627",
    "mode": "Price Details",
    "previewImage": "27b1d7d2-feb0-4b1f-a372-eb4b6252b206.png",
    "modeId": "293"
  },
  {
    "submission_id": "223345",
    "mode": "Friend Request",
    "previewImage": "a854b0b7-748e-4a7a-9e97-9e5fa1156a8c.png",
    "modeId": "53"
  },
  {
    "submission_id": "223389",
    "mode": "Birthday List",
    "previewImage": "11c95f94-3733-483d-a6a9-5f5c5c5b377c.png",
    "modeId": "39"
  },
  {
    "submission_id": "262306",
    "mode": "Menu 2",
    "previewImage": "9403e044-3a9c-4e90-a82f-5bc60c3a3082.png",
    "modeId": "294"
  },
  {
    "submission_id": "229702",
    "mode": "Table",
    "previewImage": "2a7a2e90-c3e8-4e77-aa77-1f883b35f156.png",
    "modeId": "490"
  },
  {
    "submission_id": "262100",
    "mode": "Management Dashboard",
    "previewImage": "cb8c518c-b1d3-4474-b625-3cfae9e40818.png",
    "modeId": "295"
  },
  {
    "submission_id": "235483",
    "mode": "Signup Form 3",
    "previewImage": "a5fe9d60-4138-413d-8f88-4ffd4c0122ef.png",
    "modeId": "435"
  },
  {
    "submission_id": "230286",
    "mode": "Timeline",
    "previewImage": "eab8ce2a-2c89-4bd1-9c20-347ef25dbba8.png",
    "modeId": "484"
  },
  {
    "submission_id": "262018",
    "mode": "Invite Cards",
    "previewImage": "f4adf6d8-415f-4adf-a058-ded87c0b9952.png",
    "modeId": "296"
  },
  {
    "submission_id": "261845",
    "mode": "Forum Components",
    "previewImage": "6e25a86d-9c28-44e3-af17-c19c198df280.png",
    "modeId": "297"
  },
  {
    "submission_id": "229852",
    "mode": "Post Card",
    "previewImage": "273e9ef3-06f7-4096-bdab-f74c024f2037.png",
    "modeId": "487"
  },
  {
    "submission_id": "231533",
    "mode": "Age Stats",
    "previewImage": "80014457-d368-4c4b-add0-067eeac77585.png",
    "modeId": "471"
  },
  {
    "submission_id": "231361",
    "mode": "To Do",
    "previewImage": "4ff5d402-5f2c-4ee2-b473-454a4e0eba13.png",
    "modeId": "472"
  },
  {
    "submission_id": "261447",
    "mode": "Conferences Page",
    "previewImage": "7c59f202-2a2d-41a7-8ee6-8da1bb644ce3.png",
    "modeId": "298"
  },
  {
    "submission_id": "261356",
    "mode": "Simple Cards",
    "previewImage": "a2ce5be5-f5a6-4f8c-84ae-1d045805a991.png",
    "modeId": "299"
  },
  {
    "submission_id": "261027",
    "mode": "Pricing Components",
    "previewImage": "5f5026d7-d49e-4f40-9b56-a4594f30eee8.png",
    "modeId": "300"
  },
  {
    "submission_id": "260801",
    "mode": "Pricing Cards 5",
    "previewImage": "3f923442-dab0-4da9-b12e-ead0fa97e6b1.png",
    "modeId": "301"
  },
  {
    "submission_id": "260605",
    "mode": "Menu 3",
    "previewImage": "aeadebb8-4330-41c2-bebd-d17c70df73ce.png",
    "modeId": "302"
  },
  {
    "submission_id": "230892",
    "mode": "Lesson Feedback",
    "previewImage": "72e19302-0ec7-4e20-ad6b-8580ae977aa4.png",
    "modeId": "478"
  },
  {
    "submission_id": "226197",
    "mode": "Song Card",
    "previewImage": "3ec2ce33-5951-4479-a8ca-6269cf9391f6.png",
    "modeId": "112"
  },
  {
    "submission_id": "260311",
    "mode": "Landing Page 2",
    "previewImage": "c5d2d3be-e517-4623-9267-85163425690a.png",
    "modeId": "303"
  },
  {
    "submission_id": "260008",
    "mode": "Groups",
    "previewImage": "2e2d4b54-7901-4c3d-aa7e-3856c31e119b.png",
    "modeId": "304"
  },
  {
    "submission_id": "223709",
    "mode": "Pricing Table",
    "previewImage": "5b591d23-709a-45ba-9bb2-b20710e2da6c.png",
    "modeId": "50"
  },
  {
    "submission_id": "259945",
    "mode": "Store Location",
    "previewImage": "bda34a9d-92a7-4987-ba09-a0a08df29611.png",
    "modeId": "305"
  },
  {
    "submission_id": "259796",
    "mode": "Retro Notifications",
    "previewImage": "26fd5570-b27b-4323-ad34-fa1a8ea8cc32.png",
    "modeId": "306"
  },
  {
    "submission_id": "233164",
    "mode": "Subscribe",
    "previewImage": "8781ecde-07b1-40a0-9f65-112f80f34dd1.png",
    "modeId": "55"
  },
  {
    "submission_id": "231265",
    "mode": "Subscription",
    "previewImage": "e0a51803-67fe-4776-b1af-5727956939e8.png",
    "modeId": "473"
  },
  {
    "submission_id": "259617",
    "mode": "Retro Modal",
    "previewImage": "dafc7ce6-1c6b-4512-8909-05aaa43dff9e.png",
    "modeId": "307"
  },
  {
    "submission_id": "228570",
    "mode": "Progress Checks",
    "previewImage": "8eecdb9d-63f6-4621-88f3-e536464491ae.png",
    "modeId": "141"
  },
  {
    "submission_id": "223186",
    "mode": "Social Login",
    "previewImage": "3103072f-905f-414d-8522-6f0cca972284.png",
    "modeId": "45"
  },
  {
    "submission_id": "259498",
    "mode": "Retro Messages",
    "previewImage": "5c43c39d-df65-47ca-ae12-307e9215663c.png",
    "modeId": "308"
  },
  {
    "submission_id": "230177",
    "mode": "Testimonials #2",
    "previewImage": "8963d0f2-bc96-4bcd-a281-2e39b945f335.png",
    "modeId": "497"
  },
  {
    "submission_id": "230005",
    "mode": "Simple Pricing",
    "previewImage": "93b8dc47-80fd-47c2-8af3-b1a9695ac2c5.png",
    "modeId": "486"
  },
  {
    "submission_id": "230326",
    "mode": "Toasts",
    "previewImage": "68b2779d-e07d-4568-8fbb-cb0d45ac011b.png",
    "modeId": "41"
  },
  {
    "submission_id": "234511",
    "mode": "Sign In Form 2",
    "previewImage": "8e02d3dd-b2ce-4beb-9a43-968fcde2160d.png",
    "modeId": "445"
  },
  {
    "submission_id": "259424",
    "mode": "Retro Flash",
    "previewImage": "3656bf5a-31da-4453-9038-d4e00c910bde.png",
    "modeId": "309"
  },
  {
    "submission_id": "225164",
    "mode": "Alerts",
    "previewImage": "d721b8a5-0295-41e4-8fc9-d5b65090eaaa.png",
    "modeId": "100"
  },
  {
    "submission_id": "259279",
    "mode": "Mobile Movie App",
    "previewImage": "46971b1d-402f-4e1b-8c61-1188564e4255.png",
    "modeId": "310"
  },
  {
    "submission_id": "259026",
    "mode": "Inbox List",
    "previewImage": "3add14be-3f93-4513-bc24-eaa23a711351.png",
    "modeId": "311"
  },
  {
    "submission_id": "226131",
    "mode": "Search Bar",
    "previewImage": "805f255a-de37-459d-bba0-2ec8d65e571e.png",
    "modeId": "111"
  },
  {
    "submission_id": "236786",
    "mode": "Likes Dislikes Stats",
    "previewImage": "48da8564-e614-457d-83dd-df98d599588a.png",
    "modeId": "416"
  },
  {
    "submission_id": "258828",
    "mode": "Booking Calendar",
    "previewImage": "2c113e12-8e09-4c0d-bac8-522b5c3bbc2e.png",
    "modeId": "312"
  },
  {
    "submission_id": "231909",
    "mode": "Meeting Feedback",
    "previewImage": "9d57f201-3ede-4efa-8817-b22e37104d68.png",
    "modeId": "468"
  },
  {
    "submission_id": "231625",
    "mode": "Breadcrumbs",
    "previewImage": "9a433932-adf2-47c4-bf87-55b3f6f46fa5.png",
    "modeId": "470"
  },
  {
    "submission_id": "234337",
    "mode": "Order Placed 2",
    "previewImage": "d0de975b-eb5a-4222-a3b0-c7069e0c5e86.png",
    "modeId": "447"
  },
  {
    "submission_id": "235335",
    "mode": "Share Article Modal",
    "previewImage": "ebbfa21e-d6a8-4887-a742-a5fd3160156d.png",
    "modeId": "437"
  },
  {
    "submission_id": "258730",
    "mode": "User Card 2",
    "previewImage": "536385e0-a594-43ac-b194-666cee2def6a.png",
    "modeId": "313"
  },
  {
    "submission_id": "258659",
    "mode": "Users Card #2",
    "previewImage": "7d534548-ba10-4165-84d2-2fed581b9e77.png",
    "modeId": "492"
  },
  {
    "submission_id": "233273",
    "mode": "404 Page",
    "previewImage": "bcba2965-4b8a-4d46-96ca-88ff0512e150.png",
    "modeId": "457"
  },
  {
    "submission_id": "234668",
    "mode": "Subscribe 2",
    "previewImage": "240020ca-8808-4d84-bf71-62d6936135d9.png",
    "modeId": "443"
  },
  {
    "submission_id": "258525",
    "mode": "Mobile Movie Card",
    "previewImage": "c5792b78-3d63-4e41-85b0-ecdec88c7df9.png",
    "modeId": "314"
  },
  {
    "submission_id": "258449",
    "mode": "Menu Card",
    "previewImage": "a3a9be07-cc47-44de-b56a-2c280a039f6b.png",
    "modeId": "315"
  },
  {
    "submission_id": "235398",
    "mode": "Share Link 2",
    "previewImage": "7ac5eed8-2d27-4f1e-ac68-2b6fc657adc4.png",
    "modeId": "436"
  },
  {
    "submission_id": "258277",
    "mode": "Challenges",
    "previewImage": "e555adc4-8154-4b7d-add7-1e1eabed2d42.png",
    "modeId": "316"
  },
  {
    "submission_id": "258060",
    "mode": "Workout Tracker",
    "previewImage": "a1a3094a-f2c3-4edc-a358-d67ac32bc2b2.png",
    "modeId": "317"
  },
  {
    "submission_id": "257900",
    "mode": "Weather",
    "previewImage": "acabd425-6bee-4d59-82a1-173b321b3377.png",
    "modeId": "318"
  },
  {
    "submission_id": "257734",
    "mode": "Wallet Balance",
    "previewImage": "aab2f3e1-7c77-458e-801f-91c158aa2f59.png",
    "modeId": "319"
  },
  {
    "submission_id": "257580",
    "mode": "Testimonials Grid",
    "previewImage": "7deef78e-0b59-4d07-a77f-57cb70aa3dd1.png",
    "modeId": "320"
  },
  {
    "submission_id": "257439",
    "mode": "Shopping Cart #2",
    "previewImage": "5e5e50c8-d648-4c25-bc00-f66a67de9982.png",
    "modeId": "493"
  },
  {
    "submission_id": "257334",
    "mode": "Settings Retro",
    "previewImage": "7f5522ba-9005-452c-897a-31bb1c90a820.png",
    "modeId": "322"
  },
  {
    "submission_id": "224536",
    "mode": "Progress Bar",
    "previewImage": "808346cf-4d5a-49c1-8964-aea3d7a287f2.png",
    "modeId": "91"
  },
  {
    "submission_id": "257240",
    "mode": "Progress Bar 2",
    "previewImage": "858ca4e6-7d97-4537-9ac6-5eb6b3b9b6f4.png",
    "modeId": "323"
  },
  {
    "submission_id": "232443",
    "mode": "Events",
    "previewImage": "9475dad7-cd82-421f-83d1-87115d01f7b8.png",
    "modeId": "462"
  },
  {
    "submission_id": "257039",
    "mode": "Pricing 3",
    "previewImage": "5331202d-b6fa-4f66-bce4-1f5bb3090d77.png",
    "modeId": "324"
  },
  {
    "submission_id": "256952",
    "mode": "Photograph Profile",
    "previewImage": "639ad46f-1b3e-4896-a6d9-790ef17be38c.png",
    "modeId": "65"
  },
  {
    "submission_id": "256703",
    "mode": "Pagination 4",
    "previewImage": "2c2fa6fe-21cb-48aa-ae53-a8f529f12454.png",
    "modeId": "325"
  },
  {
    "submission_id": "256627",
    "mode": "Pagination 3",
    "previewImage": "490c3b5d-317a-4610-8e87-4adc7d0344f3.png",
    "modeId": "326"
  },
  {
    "submission_id": "256510",
    "mode": "Music Player 2",
    "previewImage": "2aef3a92-1f60-4c77-9ba7-91b9464c08f6.png",
    "modeId": "327"
  },
  {
    "submission_id": "256375",
    "mode": "Mobile Pad",
    "previewImage": "90f59ab9-59c8-4de4-846f-8a32cfca6c07.png",
    "modeId": "328"
  },
  {
    "submission_id": "256061",
    "mode": "Leaderboard 3",
    "previewImage": "a27f488e-6ea3-469d-9011-1867aa00535b.png",
    "modeId": "329"
  },
  {
    "submission_id": "230853",
    "mode": "Image Search",
    "previewImage": "95edeead-f076-40c7-8442-81d3cb530b2b.png",
    "modeId": "479"
  },
  {
    "submission_id": "255922",
    "mode": "Image Zoom",
    "previewImage": "494534d9-1e3a-45d3-a931-77685371b26e.png",
    "modeId": "330"
  },
  {
    "submission_id": "255864",
    "mode": "Halloween Countdown",
    "previewImage": "808eb048-0b72-4228-8caf-5f24ca5936e9.png",
    "modeId": "331"
  },
  {
    "submission_id": "255630",
    "mode": "Fullpage Slider",
    "previewImage": "056cc5bc-96a9-461d-a408-4a521e86e447.png",
    "modeId": "332"
  },
  {
    "submission_id": "255513",
    "mode": "Food Menu",
    "previewImage": "e34e9f05-674f-4db0-8f9a-763cd1f791eb.png",
    "modeId": "333"
  },
  {
    "submission_id": "255269",
    "mode": "File Upload",
    "previewImage": "ec34c009-07bb-4ede-949f-9297a69cd312.png",
    "modeId": "334"
  },
  {
    "submission_id": "255102",
    "mode": "Course Card",
    "previewImage": "a1c27e26-061f-40e4-bf30-561655ff09cc.png",
    "modeId": "335"
  },
  {
    "submission_id": "227261",
    "mode": "User Select",
    "previewImage": "6212e3a8-ceb8-4d52-a76d-46fb3ef620c7.png",
    "modeId": "123"
  },
  {
    "submission_id": "254910",
    "mode": "Car Interface",
    "previewImage": "de10621d-2420-4eb2-b612-40045e591858.png",
    "modeId": "336"
  },
  {
    "submission_id": "236858",
    "mode": "Member Invite",
    "previewImage": "72c957c4-414a-4edc-bbbe-c1883767e5f7.png",
    "modeId": "415"
  },
  {
    "submission_id": "254603",
    "mode": "Testimonials 3",
    "previewImage": "09e477d6-9a65-4455-8bc9-8e2423d63520.png",
    "modeId": "337"
  },
  {
    "submission_id": "254533",
    "mode": "Reviews 3",
    "previewImage": "0897a0bc-571f-49b9-a2c2-1146cb82c557.png",
    "modeId": "338"
  },
  {
    "submission_id": "254143",
    "mode": "Notifications 3",
    "previewImage": "adcea257-71b6-476f-b826-90d8ca2fb249.png",
    "modeId": "339"
  },
  {
    "submission_id": "253767",
    "mode": "Social Ui Kit",
    "previewImage": "207e4273-5ba3-4984-8539-e71b11658c88.png",
    "modeId": "66"
  },
  {
    "submission_id": "253463",
    "mode": "Select Interest",
    "previewImage": "b24c95e8-fac7-4564-bf0f-60afec1217f8.png",
    "modeId": "341"
  },
  {
    "submission_id": "253293",
    "mode": "Purple Messages",
    "previewImage": "c8178f34-f595-4923-8a5d-1543a1ec41d9.png",
    "modeId": "44"
  },
  {
    "submission_id": "253041",
    "mode": "Playlist",
    "previewImage": "8b752cf9-ffdb-4284-859d-5a34d81b57e1.png",
    "modeId": "342"
  },
  {
    "submission_id": "252742",
    "mode": "Mobile Movie Ad",
    "previewImage": "4248ce46-41d4-43d8-b142-66169331bd6c.png",
    "modeId": "343"
  },
  {
    "submission_id": "252469",
    "mode": "Games List",
    "previewImage": "4dd572a2-b8f2-4685-a6bf-f8701a8eb43b.png",
    "modeId": "344"
  },
  {
    "submission_id": "252260",
    "mode": "Check In",
    "previewImage": "33a29b2f-2b55-46a1-afc0-e3b94f25a5cc.png",
    "modeId": "345"
  },
  {
    "submission_id": "251882",
    "mode": "Watch Giveaway",
    "previewImage": "d7bb3899-0515-489d-9fd8-6ddeab24ef90.png",
    "modeId": "346"
  },
  {
    "submission_id": "251625",
    "mode": "Ui Kit",
    "previewImage": "19df80b0-fe9e-4f2c-bd68-8c78101a2f63.png",
    "modeId": "347"
  },
  {
    "submission_id": "236665",
    "mode": "Time Picker",
    "previewImage": "0a6e5abd-ad70-4dae-b219-4ed8891819a4.png",
    "modeId": "419"
  },
  {
    "submission_id": "251322",
    "mode": "App Notifications",
    "previewImage": "a937d41d-3be8-4c58-98b2-8180b3377fbe.png",
    "modeId": "348"
  },
  {
    "submission_id": "251106",
    "mode": "Upsell Features",
    "previewImage": "4fd756aa-aac5-431c-aa23-2530d39c2365.png",
    "modeId": "349"
  },
  {
    "submission_id": "250690",
    "mode": "Tv App",
    "previewImage": "167de6a7-cb49-429d-b913-79f9015847a0.png",
    "modeId": "350"
  },
  {
    "submission_id": "250296",
    "mode": "Reviews 2",
    "previewImage": "b280307d-6203-4494-bbf0-76d8eab3a78f.png",
    "modeId": "351"
  },
  {
    "submission_id": "250283",
    "mode": "Radio App",
    "previewImage": "e468de96-efcd-4df4-86e3-957ddf4af2b6.png",
    "modeId": "352"
  },
  {
    "submission_id": "250056",
    "mode": "Promo Card",
    "previewImage": "a76292ef-4b57-4481-bf7c-d74ca2408f8c.png",
    "modeId": "353"
  },
  {
    "submission_id": "249750",
    "mode": "Gift Membership",
    "previewImage": "64aa7468-7993-41dc-b537-c37daed455d2.png",
    "modeId": "354"
  },
  {
    "submission_id": "248907",
    "mode": "Coffee Social Card",
    "previewImage": "d1bc72fe-a1b2-4bfd-98aa-4e75ddc92e8e.png",
    "modeId": "356"
  },
  {
    "submission_id": "248594",
    "mode": "Calendar 4",
    "previewImage": "b622dc02-3d2d-4e07-a32d-b84eae075870.png",
    "modeId": "357"
  },
  {
    "submission_id": "248442",
    "mode": "Calendar 3",
    "previewImage": "386a819b-7eb2-4bb0-a945-7b30ec430f49.png",
    "modeId": "358"
  },
  {
    "submission_id": "248125",
    "mode": "Book Card",
    "previewImage": "07ad82f1-6a98-4cb1-b446-4de4560a2ccc.png",
    "modeId": "359"
  },
  {
    "submission_id": "247876",
    "mode": "Accordion 4",
    "previewImage": "612d452b-d4f4-4684-931d-97f04b2afc97.png",
    "modeId": "360"
  },
  {
    "submission_id": "232118",
    "mode": "Accordion 3",
    "previewImage": "5df7a2d0-5030-4ff2-95de-94d9262fe995.png",
    "modeId": "466"
  },
  {
    "submission_id": "247260",
    "mode": "Subscribe Popup",
    "previewImage": "907ab0d8-0b26-4e18-ab37-ddc5348f0533.png",
    "modeId": "361"
  },
  {
    "submission_id": "247057",
    "mode": "Product Review",
    "previewImage": "0c1940ce-e5ad-404d-9b1b-f889236c4803.png",
    "modeId": "362"
  },
  {
    "submission_id": "246787",
    "mode": "Members Share",
    "previewImage": "8845001f-923a-44c6-ba21-89feaf2d15d5.png",
    "modeId": "363"
  },
  {
    "submission_id": "246253",
    "mode": "Glassy Profile",
    "previewImage": "68b717e7-d648-4ea4-a018-b825f4624dfe.png",
    "modeId": "364"
  },
  {
    "submission_id": "245704",
    "mode": "Glassy Landing",
    "previewImage": "b01ae75c-4986-4ca5-b05e-0e112ed9b8e3.png",
    "modeId": "365"
  },
  {
    "submission_id": "245568",
    "mode": "Editable Components",
    "previewImage": "9f05c560-ea2e-48ab-9547-9df0a421d7c5.png",
    "modeId": "366"
  },
  {
    "submission_id": "245231",
    "mode": "Download Status",
    "previewImage": "b119c0a5-4858-4fa2-9eb6-3f7355305762.png",
    "modeId": "367"
  },
  {
    "submission_id": "244689",
    "mode": "Buttons Kit",
    "previewImage": "6f8473ac-6782-4190-9fc0-52b60924c20d.png",
    "modeId": "368"
  },
  {
    "submission_id": "244511",
    "mode": "Big Footer 2",
    "previewImage": "1b5fa004-0cdb-466e-aa4e-68841b12d464.png",
    "modeId": "369"
  },
  {
    "submission_id": "233684",
    "mode": "Cookie Popup",
    "previewImage": "a4cfb5c1-bfe5-42bc-9394-dd63ed3c5edb.png",
    "modeId": "453"
  },
  {
    "submission_id": "243976",
    "mode": "Pricing Cards",
    "previewImage": "a1e67ed7-c86b-4f19-a3f9-ee856e519052.png",
    "modeId": "370"
  },
  {
    "submission_id": "243396",
    "mode": "Verification Code",
    "previewImage": "8a32fc40-a290-4adc-8434-7d3ddc4fecd3.png",
    "modeId": "371"
  },
  {
    "submission_id": "243347",
    "mode": "Tags",
    "previewImage": "78c18942-fa20-4866-b2a2-840a73fc4baf.png",
    "modeId": "372"
  },
  {
    "submission_id": "229754",
    "mode": "Accordion",
    "previewImage": "94ad8504-fc64-4275-a299-50e5e974a3f6.png",
    "modeId": "489"
  },
  {
    "submission_id": "225440",
    "mode": "Calendar",
    "previewImage": "66111a2f-037a-4f69-8e7a-cca66072a66a.png",
    "modeId": "103"
  },
  {
    "submission_id": "243190",
    "mode": "Notifications 2",
    "previewImage": "e7be97a4-574a-4903-b0bf-dc056a58e72b.png",
    "modeId": "373"
  },
  {
    "submission_id": "227885",
    "mode": "Switch",
    "previewImage": "295d65b5-d23e-46af-ac27-0d8a2ebc3e7d.png",
    "modeId": "132"
  },
  {
    "submission_id": "243119",
    "mode": "Member Subscriptions",
    "previewImage": "71c75c89-a726-4e4d-bb9f-225318fd2aec.png",
    "modeId": "374"
  },
  {
    "submission_id": "243053",
    "mode": "Meal Results",
    "previewImage": "2a8e8da2-a4ae-4d10-a7ab-5fb7eb520ffd.png",
    "modeId": "375"
  },
  {
    "submission_id": "242935",
    "mode": "Inputs",
    "previewImage": "797dde25-50f6-4b21-9231-a8234c41c104.png",
    "modeId": "376"
  },
  {
    "submission_id": "229638",
    "mode": "Multi Toggle",
    "previewImage": "d87f246f-5c03-470f-b428-41b687fec4a6.png",
    "modeId": "491"
  },
  {
    "submission_id": "235007",
    "mode": "Updates Card",
    "previewImage": "057a5888-7104-4378-be99-676930aa1a4b.png",
    "modeId": "440"
  },
  {
    "submission_id": "242811",
    "mode": "Events App",
    "previewImage": "9bbd8cc3-c992-4321-89ba-93aac91b535f.png",
    "modeId": "377"
  },
  {
    "submission_id": "225088",
    "mode": "Banner",
    "previewImage": "b23012bf-105e-406e-807e-07dd47119dc1.png",
    "modeId": "99"
  },
  {
    "submission_id": "242625",
    "mode": "Crypto Account",
    "previewImage": "bfdf8074-1d4a-46ff-a056-fe453acc4511.png",
    "modeId": "378"
  },
  {
    "submission_id": "242486",
    "mode": "Challenges List",
    "previewImage": "eac481d3-9179-40bd-8aa9-0a6210535a94.png",
    "modeId": "379"
  },
  {
    "submission_id": "236744",
    "mode": "Edit Account",
    "previewImage": "81343dbb-e1e2-4fb2-a557-53e83bc5bcb0.png",
    "modeId": "417"
  },
  {
    "submission_id": "242420",
    "mode": "Blog Cards 4",
    "previewImage": "26bddf56-5206-41ed-b70d-7125ecd13788.png",
    "modeId": "62"
  },
  {
    "submission_id": "242171",
    "mode": "Apps Card",
    "previewImage": "13971b4d-7030-4890-a30d-81b02c9b8348.png",
    "modeId": "43"
  },
  {
    "submission_id": "242136",
    "mode": "Timer",
    "previewImage": "9f2a7339-bcc4-450f-afbb-63f69e33ddb2.png",
    "modeId": "54"
  },
  {
    "submission_id": "241971",
    "mode": "Ticket Event",
    "previewImage": "9950bba2-df71-4b61-baab-51a301035954.png",
    "modeId": "380"
  },
  {
    "submission_id": "241791",
    "mode": "Style Guide",
    "previewImage": "1521fb05-6628-4320-8aab-4c2894052580.png",
    "modeId": "381"
  },
  {
    "submission_id": "233048",
    "mode": "Share Modal",
    "previewImage": "8a1d156e-7870-49e5-b03c-f6225dfae533.png",
    "modeId": "458"
  },
  {
    "submission_id": "241654",
    "mode": "Saas Landing",
    "previewImage": "3836a183-dab0-42bb-9024-02751ba105de.png",
    "modeId": "382"
  },
  {
    "submission_id": "237147",
    "mode": "Search Bar 2",
    "previewImage": "95d87503-f6c6-4a69-a123-e4dc0c49a9b1.png",
    "modeId": "413"
  },
  {
    "submission_id": "241480",
    "mode": "Press Page",
    "previewImage": "d067aa6d-e5d6-4733-8cbd-dd53eaa2b5e8.png",
    "modeId": "383"
  },
  {
    "submission_id": "241439",
    "mode": "Payment Method",
    "previewImage": "830dc219-7900-451c-9a13-f51e5e5595b7.png",
    "modeId": "384"
  },
  {
    "submission_id": "241302",
    "mode": "Moksha Coffee",
    "previewImage": "89518f36-b99d-4668-bfcb-ae2a127149a8.png",
    "modeId": "385"
  },
  {
    "submission_id": "241201",
    "mode": "Keyboard",
    "previewImage": "6541b23c-5c56-44fc-8925-263e272f1c5b.png",
    "modeId": "386"
  },
  {
    "submission_id": "236236",
    "mode": "Subscribe Modal",
    "previewImage": "1fd646d9-0974-4bf6-ae21-9caf8406d891.png",
    "modeId": "425"
  },
  {
    "submission_id": "241019",
    "mode": "Flight Booking",
    "previewImage": "e3f6cb21-2efa-4bee-bad0-dae5393ffd40.png",
    "modeId": "387"
  },
  {
    "submission_id": "240833",
    "mode": "Credit Card",
    "previewImage": "12c446e5-7754-41f3-8ad1-c59eb6b0e4e4.png",
    "modeId": "388"
  },
  {
    "submission_id": "240729",
    "mode": "Blog Kit",
    "previewImage": "0d2b27eb-8691-4512-9f6c-82d40f7c7b7a.png",
    "modeId": "389"
  },
  {
    "submission_id": "240612",
    "mode": "Arya Targets",
    "previewImage": "5188c66c-0436-4dd3-bdab-1c22b4bdb545.png",
    "modeId": "390"
  },
  {
    "submission_id": "240533",
    "mode": "Apps List 2",
    "previewImage": "10afcab0-1b40-4067-a42a-8196eea9d12c.png",
    "modeId": "391"
  },
  {
    "submission_id": "236714",
    "mode": "Device Stats",
    "previewImage": "13b40e75-6b55-4f70-9038-9f28ec930cad.png",
    "modeId": "418"
  },
  {
    "submission_id": "240450",
    "mode": "Sponsorship Pricing",
    "previewImage": "52a9467e-4a3a-49de-9a4e-4ca800049570.png",
    "modeId": "392"
  },
  {
    "submission_id": "236516",
    "mode": "Repositories List",
    "previewImage": "502bae93-5490-4fcf-af1f-e843fb9c9060.png",
    "modeId": "421"
  },
  {
    "submission_id": "240249",
    "mode": "Simple Testimonials",
    "previewImage": "0f2512df-12d7-4e72-b6e6-ca9402698a39.png",
    "modeId": "393"
  },
  {
    "submission_id": "240091",
    "mode": "Select Flight",
    "previewImage": "d19a9885-9f4d-47ae-9e76-9da27a94697d.png",
    "modeId": "394"
  },
  {
    "submission_id": "223659",
    "mode": "Collections List",
    "previewImage": "540a691f-c15e-4531-8faf-c7186ec0012c.png",
    "modeId": "58"
  },
  {
    "submission_id": "239922",
    "mode": "Order Summary",
    "previewImage": "db08a988-c845-4c4b-a6cd-1e6b409d942f.png",
    "modeId": "395"
  },
  {
    "submission_id": "232184",
    "mode": "Contact Card",
    "previewImage": "5a056257-eff4-45a6-a2e9-ea1ad88c42e6.png",
    "modeId": "465"
  },
  {
    "submission_id": "239715",
    "mode": "Notification Cards",
    "previewImage": "4a4a44dc-c343-4bd7-a299-e8c3ed387a35.png",
    "modeId": "396"
  },
  {
    "submission_id": "239563",
    "mode": "Conversations",
    "previewImage": "3e246d04-a2af-40f8-a355-9dc3e37a7ba9.png",
    "modeId": "397"
  },
  {
    "submission_id": "239482",
    "mode": "Sms Share",
    "previewImage": "7adbf107-8b53-4e24-992b-795c0eac8caa.png",
    "modeId": "398"
  },
  {
    "submission_id": "239350",
    "mode": "Radar Chart",
    "previewImage": "d4fe1aef-31a9-41cf-a030-d3fac5579bef.png",
    "modeId": "399"
  },
  {
    "submission_id": "239301",
    "mode": "Kanban 2",
    "previewImage": "13cafb1b-41d9-4cb1-9f7b-31b0d33308c0.png",
    "modeId": "400"
  },
  {
    "submission_id": "239208",
    "mode": "Get In Touch",
    "previewImage": "85a50c64-5d9d-4f5d-a3b3-6d49c93ab2d1.png",
    "modeId": "401"
  },
  {
    "submission_id": "239010",
    "mode": "Forgot Password",
    "previewImage": "4fb4a318-d958-4895-b20d-c6e8f9f8e571.png",
    "modeId": "402"
  },
  {
    "submission_id": "238796",
    "mode": "404 Error Page",
    "previewImage": "fc895570-9e0c-460f-8231-61d21e2a7165.png",
    "modeId": "42"
  },
  {
    "submission_id": "238725",
    "mode": "Time Picker 2",
    "previewImage": "7c9838cc-af8a-4c48-8e5c-27b8e7d21863.png",
    "modeId": "403"
  },
  {
    "submission_id": "236905",
    "mode": "Percentage Calculator",
    "previewImage": "ef553dbf-9e9e-4624-9a90-2f4cc842812d.png",
    "modeId": "414"
  },
  {
    "submission_id": "238565",
    "mode": "Side Panel",
    "previewImage": "089ff078-e0f6-4968-97e0-10d14f89e730.png",
    "modeId": "404"
  },
  {
    "submission_id": "223817",
    "mode": "Big Footer",
    "previewImage": "5861c05a-7b1f-4d1e-abd0-1cb9bc3f754b.png",
    "modeId": "79"
  },
  {
    "submission_id": "238513",
    "mode": "Profile Card",
    "previewImage": "d070181e-d412-414a-9d21-d78d8d3dce29.png",
    "modeId": "405"
  },
  {
    "submission_id": "238408",
    "mode": "Notifications",
    "previewImage": "b7edf5cc-8847-40bc-9c9e-96ffd9b72c1e.png",
    "modeId": "406"
  },
  {
    "submission_id": "238269",
    "mode": "Music App",
    "previewImage": "b1a8eb42-d44a-4204-872e-ce368caec679.png",
    "modeId": "407"
  },
  {
    "submission_id": "238156",
    "mode": "Colored Cards",
    "previewImage": "5ddf17b7-bb78-4a64-9143-9011ad60586d.png",
    "modeId": "408"
  },
  {
    "submission_id": "237822",
    "mode": "Announcements",
    "previewImage": "2bc64915-d751-4c74-8c02-cd6e6675bb7d.png",
    "modeId": "409"
  },
  {
    "submission_id": "237769",
    "mode": "Address Finder",
    "previewImage": "22127367-bba3-4508-adc4-f30d4ca3a5cd.png",
    "modeId": "410"
  },
  {
    "submission_id": "237267",
    "mode": "Support Survery",
    "previewImage": "022b5106-4615-4bc4-be57-f0ffa51f9553.png",
    "modeId": "412"
  },
  {
    "submission_id": "236168",
    "mode": "Recordings",
    "previewImage": "0b4f4d1c-9047-41ff-a1f2-fb0236ea0342.png",
    "modeId": "426"
  },
  {
    "submission_id": "224766",
    "mode": "Profile Tooltip",
    "previewImage": "a3c4ca78-9859-4ee6-802c-46c818503413.png",
    "modeId": "96"
  },
  {
    "submission_id": "236054",
    "mode": "Links Section",
    "previewImage": "7c6a77d2-6ce7-4955-adbc-55566cf9c546.png",
    "modeId": "427"
  },
  {
    "submission_id": "236001",
    "mode": "Info Section 2",
    "previewImage": "3150734d-39a9-4f13-ac4f-3d0a964c95b2.png",
    "modeId": "428"
  },
  {
    "submission_id": "235938",
    "mode": "Footer Ui",
    "previewImage": "e8823bde-5b22-49bb-9a69-866043b8cc73.png",
    "modeId": "429"
  },
  {
    "submission_id": "235868",
    "mode": "Feedback Widgets",
    "previewImage": "38726642-ae34-4084-bf9d-daa56e6a4286.png",
    "modeId": "430"
  },
  {
    "submission_id": "235714",
    "mode": "Date Picker 2",
    "previewImage": "ccbc0eb1-abae-40b3-888d-f3f65fdf98fb.png",
    "modeId": "432"
  },
  {
    "submission_id": "235665",
    "mode": "Tabbed Ui",
    "previewImage": "9624093d-f9b2-43f3-b417-f2467016581e.png",
    "modeId": "433"
  },
  {
    "submission_id": "235626",
    "mode": "Simple Stats",
    "previewImage": "0c1b556c-bdb7-4287-b96b-aef1bcfd2295.png",
    "modeId": "434"
  }
]


// selectors
const gallery = document.getElementById('gallery');
const btnPrev = document.getElementById('btn-prev');
const btnNext = document.getElementById('btn-next');

// create gallery
function populateGallery(data) {
    const numColumns = Math.ceil(data.length / 2);
    gallery.style.gridTemplateColumns = `repeat(${numColumns}, 1fr)`;

    // Sort data by REVERSE date 
    data.sort((a, b) => new Date(b.submitted) - new Date(a.submitted));
    
    // create and add image blocks
    data.forEach((item, index) => {
        const link = document.createElement('a');
        link.style.gridColumn = "span 1";
        link.style.gridRow = (index % 3 === 0) ? "span 2" : "span 1";
        
        const img = document.createElement('img');
        img.src = `https://shismqklzntzxworibfn.supabase.co/storage/v1/object/public/previews/${item.previewImage}`;
        img.alt = item.mode;

        const title = document.createElement('p');
        title.innerText = item.mode;

        link.href = `https://icodethis.com/modes/design-to-code/${item.modeId}/submissions/${item.submission_id}`;
        link.target = "_blank";
        link.appendChild(img);
        link.appendChild(title);
        
        gallery.appendChild(link);
    });
}


// gallery nav
function galleryControls() {
    let counter = 0;
    btnPrev.addEventListener('click', () => {
        gallery.scrollBy({
            left: -window.innerWidth,
            behavior: 'smooth'
         });
         counter--;
        btnState(counter)
    });
    btnNext.addEventListener('click', () => {
        gallery.scrollBy({
            left: window.innerWidth,
            behavior: 'smooth'
        });
        counter++;
        btnState(counter)
    });
    
}
function btnState(counter){
    btnPrev.disabled = counter>0 ? false : true;
}

populateGallery(SUBMISSIONS)
galleryControls();
              
            
!
999px

Console