Skip to content

Commit

Permalink
revise: makes crate grid more responsive
Browse files Browse the repository at this point in the history
  • Loading branch information
claymcleod committed Oct 13, 2024
1 parent b46d495 commit e3b5eea
Show file tree
Hide file tree
Showing 3 changed files with 67 additions and 59 deletions.
7 changes: 4 additions & 3 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -11,8 +11,8 @@
},
"dependencies": {
"@iconify-json/carbon": "^1.2.3",
"@iconify-json/heroicons-outline": "^1.2.0",
"@iconify-json/heroicons": "^1.2.1",
"@iconify-json/heroicons-outline": "^1.2.0",
"@iconify-json/mdi": "^1.2.1",
"@iconify-json/octicon": "^1.2.1",
"@iconify-json/tabler": "^1.2.5",
Expand All @@ -22,12 +22,13 @@
"@nuxt/ui": "^2.18.6",
"@nuxtjs/color-mode": "^3.5.1",
"@nuxtjs/tailwindcss": "^6.12.1",
"@vueuse/core": "^11.1.0",
"change-case": "^5.4.4",
"d3": "^7.9.0",
"nuxt": "^3.13.2",
"remark-gfm": "^4.0.0",
"vue-router": "latest",
"vue": "latest"
"vue": "latest",
"vue-router": "latest"
},
"packageManager": "pnpm@9.12.0+sha512.4abf725084d7bcbafbd728bfc7bee61f2f791f977fd87542b3579dcb23504d170d46337945e4c66485cd12d588a0c0e570ed9c477e7ccdd8507cf05f3f92eaca",
"devDependencies": {
Expand Down
116 changes: 60 additions & 56 deletions pages/docs/index.vue
Original file line number Diff line number Diff line change
Expand Up @@ -2,98 +2,101 @@
<div class="flex w-full h-full">
<MoleculesDocsLeftSidebar />
<div class="flex w-full h-full pt-10 bg-white dark:bg-slate-950">
<main class="h-full mx-10 px-16 overflow-auto">
<main class="h-full w-full mx-4 px-4 md:mx-6 md:px-8 lg:mx-10 lg:px-16 overflow-auto">
<span v-if="alertVisible">
<UAlert icon="i-heroicons-information-circle" color="orange" variant="subtle" title="Heads up!" description="These
crates and/or categories haven't been officially adopted yet—we're just
using these examples to sketch out what the website will look like here
in the future. In fact... quite a few things don't seem to be working yet...
we'll get to it!" :close-button="{
icon: 'i-heroicons-x-mark-20-solid',
color: 'gray',
variant: 'link',
padded: false,
}" @close="alertVisible = false" />
icon: 'i-heroicons-x-mark-20-solid',
color: 'gray',
variant: 'link',
padded: false,
}" @close="alertVisible = false" />
</span>
<div class="prose dark:prose-invert max-w-6xl pt-4">
<h1 class="mb-2">Crates</h1>
<div class="max-w-3xl">
<p>The following crates have been formally ratified within the <code>rust-seq</code> stack.</p>
<p>
The following crates have been formally ratified within the
<code>rust-seq</code> stack.
</p>
</div>
</div>

<article class=" prose prose-slate dark:prose-invert max-w-6xl">
<div class="grid grid-cols-3 gap-4">
<article class="prose prose-slate dark:prose-invert max-w-full">
<div class="grid gap-4" style="grid-template-columns: repeat(auto-fill, minmax(350px, 1fr));">
<CrateCard name="noodles" organization="zaeleus" description="A
bioinformatics I/O library written natively in Rust that values
correctness and ergonomic APIs." :kind="Kind.Library" :category="{
name: 'File I/O',
icon: 'heroicons-outline:newspaper',
}" :socials="{
github: 'https://github.com/zaeleus/noodles',
docs: 'https://docs.rs/noodles',
zulip: true,
}" />
name: 'File I/O',
icon: 'heroicons-outline:newspaper',
}" :socials="{
github: 'https://github.com/zaeleus/noodles',
docs: 'https://docs.rs/noodles',
zulip: true,
}" />

<CrateCard name="chainfile" organization="stjude-rust-labs" description="A
crate for lifting over single positions or intervals using UCSC chain
files." :kind="Kind.Library" :category="{
name: 'File I/O',
icon: 'heroicons-outline:newspaper',
}" :socials="{
github: 'https://github.com/stjude-rust-labs/chainfile',
docs: 'https://docs.rs/chainfile',
zulip: true,
}" />
name: 'File I/O',
icon: 'heroicons-outline:newspaper',
}" :socials="{
github: 'https://github.com/stjude-rust-labs/chainfile',
docs: 'https://docs.rs/chainfile',
zulip: true,
}" />

<CrateCard name="minimizer-queue" organization="rust-seq" description="A
crate for fast computation of minimizers of
crate for fast computation of minimizers of
a sequence using a monotone queue." :kind="Kind.Library" :category="{
name: 'Sequence Algorithms',
icon: 'carbon:dna',
}" :socials="{
github: 'https://github.com/rust-seq/minimizer-queue',
zulip: true,
}" />
name: 'Sequence Algorithms',
icon: 'carbon:dna',
}" :socials="{
github: 'https://github.com/rust-seq/minimizer-queue',
zulip: true,
}" />

<CrateCard name="minimizer-iter" organization="rust-seq" description="A
crate for efficient iteration of the minimizers of a sequence." :kind="Kind.Library" :category="{
name: 'Sequence Algorithms',
icon: 'carbon:dna',
}" :socials="{
github: 'https://github.com/rust-seq/minimizer-iter',
zulip: true,
}" />
name: 'Sequence Algorithms',
icon: 'carbon:dna',
}" :socials="{
github: 'https://github.com/rust-seq/minimizer-iter',
zulip: true,
}" />

<CrateCard name="packed-seq" organization="rust-seq" description="A
crate for efficient (packed) representation of strings of small alphabets." :kind="Kind.Library" :category="{
name: 'Sequence Algorithms',
icon: 'carbon:dna',
}" :socials="{
github: 'https://github.com/rust-seq/packed-seq',
zulip: true,
}" />
name: 'Sequence Algorithms',
icon: 'carbon:dna',
}" :socials="{
github: 'https://github.com/rust-seq/packed-seq',
zulip: true,
}" />

<CrateCard name="foobar" organization="stjude-rust-labs" description="A
command line tool for performing common operations on next-generation sequencing
data—built on top of noodles." :kind="Kind.Binary" :category="{
name: 'Command Line Tools',
icon: 'heroicons-outline:command-line',
}" :socials="{
github: 'https://github.com/stjude-rust-labs/foobar',
zulip: true,
}" />
name: 'Command Line Tools',
icon: 'heroicons-outline:command-line',
}" :socials="{
github: 'https://github.com/stjude-rust-labs/foobar',
zulip: true,
}" />

<CrateCard name="omics" organization="stjude-rust-labs" description="A
crate for lifting over single positions or intervals using UCSC chain
files." :kind="Kind.Library" :category="{
name: 'Foundational',
icon: 'heroicons:code-bracket-16-solid',
}" :socials="{
github: 'https://github.com/stjude-rust-labs/omics',
docs: 'https://docs.rs/omics',
zulip: true,
}" />
name: 'Foundational',
icon: 'heroicons:code-bracket-16-solid',
}" :socials="{
github: 'https://github.com/stjude-rust-labs/omics',
docs: 'https://docs.rs/omics',
zulip: true,
}" />
</div>
</article>
</main>
Expand All @@ -104,6 +107,7 @@
<script setup lang="ts">
import CrateCard from "~/components/molecules/docs/CrateCard.vue";
import { Kind } from "~/components/molecules/docs/crate-card/kind";
import { useStorage } from '@vueuse/core'
const alertVisible = ref(true);
const alertVisible = useStorage("crates-page:alert-visible", true);
</script>
3 changes: 3 additions & 0 deletions pnpm-lock.yaml

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

0 comments on commit e3b5eea

Please sign in to comment.