docs.diadata.org

> ## Documentation Index > Fetch the complete documentation index at: https://www.diadata.org/docs/llms.txt > Use this file to discover all available pages before exploring further. # Home export function openSearch() { document.getElementById("search-bar-entry").click(); } <div className="relative w-full flex items-center justify-center h-[20rem] md:h-[26rem] overflow-hidden"> <div className="absolute inset-0 hidden dark:block" style={{ backgroundImage: "url('images/hero-dark.svg')", backgroundSize: 'cover', backgroundPosition: 'center' }} /> <div className="absolute inset-0 block dark:hidden" style={{ backgroundImage: "url('images/hero-light.svg')", backgroundSize: 'cover', backgroundPosition: 'center' }} /> <div className="absolute text-center w-full max-w-[90%] sm:max-w-[80%] md:max-w-[70%] lg:max-w-[60%] px-4 sm:px-6 md:px-8 left-1/2 -translate-x-1/2"> {/* Allow full-width scaling on mobile */} <h1 className="text-black dark:text-white text-3xl sm:text-4xl md:text-5xl lg:text-6xl font-semibold leading-snug sm:leading-tight md:leading-[1.2] break-words" style={{ marginTop: '1rem' }}> DIA Oracles Docs </h1> <p className="mt-3 text-black dark:text-white font-semibold text-base sm:text-lg md:text-xl leading-relaxed"> Build onchain with trustless oracles. </p> {/* Search bar */} <div className="flex justify-center mt-8"> <button type="button" className="w-full max-w-2xl flex items-center text-sm leading-6 rounded-none py-3 px-4 shadow-sm text-gray-500 dark:text-gray-400 bg-white dark:bg-black ring-1 ring-gray-400/20 hover:ring-gray-600/25 dark:ring-gray-700 dark:hover:ring-gray-500" id="home-search-entry" onClick={openSearch}> <svg className="h-4 w-4 flex-none mr-3 bg-gray-400" style={{ maskImage: 'url("https://mintlify.b-cdn.net/v6.5.1/solid/magnifying-glass.svg")', maskRepeat: 'no-repeat', maskPosition: 'center center' }} />