Skip to content

Instantly share code, notes, and snippets.

@TRUNKSNEO
Forked from adrianhajdin/buildQuery.ts
Created January 27, 2024 00:22
Show Gist options
  • Select an option

  • Save TRUNKSNEO/fd4cfb8cf27b4f3b09c25e3028bfb6b6 to your computer and use it in GitHub Desktop.

Select an option

Save TRUNKSNEO/fd4cfb8cf27b4f3b09c25e3028bfb6b6 to your computer and use it in GitHub Desktop.

Revisions

  1. @adrianhajdin adrianhajdin created this gist Sep 18, 2023.
    21 changes: 21 additions & 0 deletions buildQuery.ts
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,21 @@
    export function buildQuery(params: BuildQueryParams) {
    const { type, query, category, page = 1, perPage = 20 } = params;

    const conditions = [`*[_type=="${type}"`];

    if (query) conditions.push(`title match "*${query}*"`);

    if (category && category !== "all") {
    conditions.push(`category == "${category}"`);
    }

    // Calculate pagination limits
    const offset = (page - 1) * perPage;
    const limit = perPage;

    return conditions.length > 1
    ? `${conditions[0]} && (${conditions
    .slice(1)
    .join(" && ")})][${offset}...${limit}]`
    : `${conditions[0]}][${offset}...${limit}]`;
    }
    240 changes: 240 additions & 0 deletions globals.css
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,240 @@
    @import url("https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,300;1,400&display=swap");

    @tailwind base;
    @tailwind components;
    @tailwind utilities;

    * {
    font-family: "Poppins", sans-serif;
    }

    @layer utilities {
    .paddle-checkout {
    @apply min-h-screen w-full py-10 md:py-20 lg:w-1/2;
    }

    .hero-height {
    @apply min-h-[calc(100vh-100px)];
    }

    .text-gradient {
    background: linear-gradient(90deg, #4ca5ff 2.34%, #b673f8 100.78%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    text-fill-color: transparent;
    }

    .heading1 {
    @apply text-[64px] leading-[67.2px] font-bold;
    }

    .heading2 {
    @apply font-bold text-[48px] leading-[50.4px];
    }

    .heading3 {
    @apply font-bold sm:text-[32px] sm:leading-[33.6px] text-[28px] leading-[40px] tracking-[-0.25%];
    }

    .base-regular {
    @apply text-[24px] font-normal leading-[31.2px];
    }

    .base-bold {
    @apply text-[24px] font-semibold leading-[31.2px];
    }

    .paragraph-regular {
    @apply text-[20px] font-normal leading-[26px];
    }

    .paragraph-semibold {
    @apply text-[20px] font-semibold leading-[26px];
    }

    .body-regular {
    @apply text-[16px] font-normal leading-[20.8px];
    }

    .body-semibold {
    @apply text-[16px] font-semibold leading-[20.8px];
    }

    .body-medium {
    @apply text-[16px] font-medium leading-[22.4px];
    }

    .small-regular {
    @apply text-[14px] font-normal leading-[17.5px];
    }

    .small-bold {
    @apply text-[14px] font-semibold leading-[17.5px];
    }

    .heading4 {
    @apply font-semibold text-[20px] leading-[26px] tracking-[0.25%];
    }

    .body-text {
    @apply text-[16px] leading-[22px] font-normal;
    }

    .nav-padding {
    @apply pt-[98px];
    }

    .paddings {
    @apply sm:p-16 xs:p-8 px-6 py-12;
    }

    .y-paddings {
    @apply sm:py-16 py-12;
    }

    .x-paddings {
    @apply sm:px-16 px-6;
    }

    .career-paddings {
    @apply sm:p-28 xs:p-8 px-6 py-12;
    }

    .flex-between {
    @apply flex justify-between items-center;
    }

    .flex-center {
    @apply flex justify-center items-center;
    }

    .flex-start {
    @apply flex justify-start items-start;
    }

    .flex-end {
    @apply flex justify-end;
    }

    .inner-width {
    @apply 3xl:max-w-[1280px] w-full mx-auto;
    }

    .inter-width {
    @apply lg:w-[80%] w-[100%];
    }

    .no-focus {
    @apply focus-visible:ring-0 focus-visible:ring-transparent focus-visible:ring-offset-0 !important;
    }
    }

    .frame {
    border-style: inset;
    border: 1px solid #40a0ff;
    position: relative;
    }

    .sm-box {
    width: 25px;
    height: 25px;
    position: absolute;
    border: 1px solid #40a0ff;
    }

    .sm-box-1 {
    top: -15px;
    left: -15px;
    }

    .sm-box-2 {
    top: -15px;
    right: -15px;
    }

    .sm-box-3 {
    bottom: -15px;
    right: -15px;
    }

    .sm-box-4 {
    bottom: -15px;
    left: -15px;
    }

    .sm-box-5 {
    bottom: 50%;
    left: -15px;
    }

    .sm-box-6 {
    bottom: 50%;
    right: -15px;
    }

    .sm-box-7 {
    bottom: -15px;
    left: 50%;
    }

    .sm-box-8 {
    top: -15px;
    left: 50%;
    }

    @media screen and (max-width: 500px) {
    .sm-box-5,
    .sm-box-6,
    .sm-box-7,
    .sm-box-8 {
    display: none;
    }

    .frame {
    border-radius: 10px;
    }
    }

    .text-gradient_purple-blue {
    background: linear-gradient(90deg, #4c73ff 0%, #73e0f8 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    text-fill-color: transparent;
    }

    .gradient_blue-purple {
    background: linear-gradient(90deg, #4ca5ff 0%, #b573f8 100%);
    }

    .text-gradient_blue {
    background: linear-gradient(90deg, #4c73ff 2.34%, #389bff 100.78%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    text-fill-color: transparent;
    }

    .gradient_purple {
    background: linear-gradient(90deg, #854cff 0%, #b573f8 100%);
    }

    .text-gradient_blue-purple {
    background: linear-gradient(90deg, #4ca5ff 0%, #b573f8 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    text-fill-color: transparent;
    }

    /* Hide scrollbar for Chrome, Safari and Opera */
    .no-scrollbar::-webkit-scrollbar {
    display: none;
    }

    /* Hide scrollbar for IE, Edge and Firefox */
    .no-scrollbar {
    -ms-overflow-style: none; /* IE and Edge */
    scrollbar-width: none; /* Firefox */
    }
    76 changes: 76 additions & 0 deletions tailwind.config.ts
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,76 @@
    /** @type {import('tailwindcss').Config} */
    module.exports = {
    darkMode: ["class"],
    content: [
    "./pages/**/*.{ts,tsx}",
    "./components/**/*.{ts,tsx}",
    "./app/**/*.{ts,tsx}",
    "./src/**/*.{ts,tsx}",
    ],
    theme: {
    screens: {
    xs: "400px",
    sm: "640px",
    md: "768px",
    lg: "1024px",
    xl: "1220px",
    "2xl": "1440px",
    "3xl": "1700px",
    },
    container: {
    center: true,
    padding: "2rem",
    screens: {
    "2xl": "1400px",
    },
    },
    extend: {
    fontFamily: {
    poppins: ["Poppins", "sans-serif"],
    inter: ["Inter", "sans-serif"],
    },
    colors: {
    primary: "#2190FF",
    black: {
    DEFAULT: "#000",
    100: "#0D1117",
    200: "#161B22",
    300: "#1F2428",
    400: "#242C38",
    },
    grey: {
    100: "#969BA5",
    200: "#55616D",
    },
    white: {
    DEFAULT: "#FFF",
    400: "#A3B3BC",
    500: "#A4B8D5",
    800: "#D0DFFF",
    },
    purple: "#8C7CFF",
    pink: "#ED5FBD",
    violet: "#F16565",
    orange: "#FF964B",
    },
    backgroundImage: {
    banner: "url('/jsm_resources_banner.svg')",
    },
    keyframes: {
    "accordion-down": {
    from: { height: 0 },
    to: { height: "var(--radix-accordion-content-height)" },
    },
    "accordion-up": {
    from: { height: "var(--radix-accordion-content-height)" },
    to: { height: 0 },
    },
    },
    animation: {
    "accordion-down": "accordion-down 0.2s ease-out",
    "accordion-up": "accordion-up 0.2s ease-out",
    },
    },
    },
    plugins: [require("tailwindcss-animate")],
    };