-
Notifications
You must be signed in to change notification settings - Fork 125
/
index.html
54 lines (52 loc) · 2.42 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width" />
<title>Esri open source projects</title>
<!-- Tailwind CSS -->
<script src="https://cdn.tailwindcss.com"></script>
<link rel="stylesheet" type="text/css" href="https://webapps-cdn.esri.com/CDN/fonts/v1.4.0/fonts.css" />
<!-- Calcite: -->
<script type="module" src="https://js.arcgis.com/calcite-components/2.10.1/calcite.esm.js"></script>
<link rel="stylesheet" type="text/css" href="https://js.arcgis.com/calcite-components/2.10.1/calcite.css" />
<!-- YAML processor: -->
<script src="https://unpkg.com/js-yaml@4/dist/js-yaml.js"></script>
</head>
<body translate="no">
<header
class="bg-center bg-no-repeat bg-[url('/assets/open-source-hero.jpg')] bg-cover grayscale md:grayscale-0 transition-all duration-1000"
>
<div class="mx-auto max-w-7xl py-14 text-white p-4">
<h1 class="text-4xl md:text-6xl mb-8 leading-7">Esri Open Source</h1>
<h4 class="text-xl leading-7">Thinking spatially, solving problems, together.</h4>
<p>Explore over 600 open-source geospatial projects.</p>
</div>
</header>
<div class="bg-[#efefef]">
<form method="get" action="https://github.com/Esri#org-profile-repositories" class="mx-auto max-w-7xl py-14 text-white p-4 flex flex-row">
<calcite-input
class="grow"
name="q"
scale="l"
placeholder="Search for a topic or project, e.g. iOS"
></calcite-input>
<calcite-button scale="l" type="submit">View on GitHub ></calcite-button>
</form>
</div>
<main id="main" class="pt-12 px-4 max-w-7xl mx-auto">
<!-- The JavaScript will place content here -->
</main>
<footer class="bg-[#efefef] text-center">
<div class="md:flex md:flex-row m-4 p-4 max-w-7xl mx-auto">
<div class="flex-none"><calcite-link href="https://github.com/Esri">Explore other open-source projects</calcite-link></div>
<div class="grow"> </div>
<div class="flex-none"><calcite-link href="https://developers.arcgis.com/">ArcGIS APIs, tools, and location services</calcite-link></div>
</div>
<a href="https://esri.com" class="">
<img class="max-w-xs inline-block p-8" src="https://esri.github.io/assets/logo/esri-logo.svg" />
</a>
</footer>
<script src="index.js"></script>
</body>
</html>