Skip to content

Add code examples #2

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 2 commits into from
Oct 23, 2024
Merged

Add code examples #2

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
8969cf1
add dangling code example
simonsteiger Oct 22, 2024
b60c43d
add code example section
simonsteiger Oct 23, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
3 changes: 1 addition & 2 deletions _quarto.yml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -17,8 +17,6 @@ website:
navbar:
logo: "assets/images/turing-logo.svg"
logo-href: https://turinglang.org/
#background: "#073c44"
#foreground: "#ffffff"
left:
- text: Get Started
href: https://turinglang.org/docs/tutorials/docs-00-getting-started/
Expand Down Expand Up @@ -63,6 +61,7 @@ format:
theme:
light: [cosmo, theming/light.scss]
dark: [cosmo, theming/dark.scss]
highlight-style: github
toc: true
smooth-scroll: true
code-overflow: wrap
Expand Down
109 changes: 86 additions & 23 deletions index.qmd
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,33 +8,96 @@ description: |
Turing.jl is a probabilistic programming language and Bayesian modelling framework for the Julia programming language.
---

<div class="d-flex flex-column align-items-center gap-0" style="padding:7rem 0;">
<image src="assets/images/turing-logo.svg" width="150px" alt="Three normal probability distributions">
<span style="font-size:4rem;font-weight:700;">Turing.jl</span>
<span style="font-size:2rem;padding-bottom:1.25rem;">Bayesian inference with probabilistic programming</span>
<div class="d-flex flex-row gap-2">
[Get Started](https://turinglang.org/docs/tutorials/docs-00-getting-started/){.button--fill .btn}

<!-- The empty line above makes quarto accept the div class -->
[API reference](/library/){.button .btn}
</div>
</div>
<div class="d-flex flex-row flex-wrap justify-content-center gap-3 pb-5">
<div class="card">
<div class="card-title">Intuitive</div>
Turing models are easy to write and communicate — syntax is close to mathematical notations.
```{=html}
<div class="content-panel">
<div class="d-flex flex-column align-items-center gap-0" style="padding:6rem 0;">
<image src="assets/images/turing-logo.svg" width="150px" alt="Three normal probability distributions">
<span style="font-size:4rem;font-weight:700;">
Turing.jl
</span>
<span class="display-6 d-block text-center pb-4 display-md-5 display-lg-4">
Bayesian inference with probabilistic programming
</span>
<div class="d-flex flex-row flex-wrap justify-content-center gap-2">
<a href="https://turinglang.org/docs/tutorials/docs-00-getting-started/" class="button--fill btn">
Tutorials
</a>
<a href="/library" class="button btn">
Ecosystem
</a>
<a href="https://github.com/TuringLang" class="button btn">
View on GitHub
</a>
</div>
</div>

<div class="card">
<div class="card-title">General-purpose</div>
Turing supports models with discrete parameters and stochastic control flow.
<div class="d-flex flex-row flex-wrap justify-content-center gap-3" style="padding-bottom:6rem;">
<div class="card">
<div class="card-title">
Intuitive
</div>
Turing models are easy to write and communicate — syntax is close to mathematical notations.
</div>
<div class="card">
<div class="card-title">
General-purpose
</div>
Turing supports models with discrete parameters and stochastic control flow.
</div>
<div class="card">
<div class="card-title">
Modular & composable
</div>
Turing is modular, written entirely in Julia, and is interoperable with the powerful Julia ecosystem.
</div>
</div>

<div class="card">
<div class="card-title">Modular & composable</div>
Turing is modular, written entirely in Julia, and is interoperable with the powerful Julia ecosystem.
</div>
```
<div class="content-panel">
<div class="d-flex flex-row flex-wrap justify-content-center gap-3">
<div style="min-width:420px; max-width:420px;text-align:right;padding:0.5rem;">
<div style="font-size:x-large;font-weight:700;padding-bottom:0.5rem;">
Hello, World in Turing
</div>
Some text about how easy it is to [get going](https://turinglang.org/docs/tutorials/00-introduction/).
</div>
<div style="min-width:500px;">
```julia
@model function coinflip(; N::Int)
# Prior belief about the probability of heads
p ~ Beta(1, 1)

# Heads or tails of a coin are drawn from `N`
# Bernoulli distributions with success rate `p`
y ~ filldist(Bernoulli(p), N)

return y
end;
```
</div>
</div>
<div class="d-flex flex-row flex-wrap justify-content-center gap-3">
<div style="min-width:500px;">
```julia
@model function putting_model(d, n; jitter=1e-4)
v ~ Gamma(2, 1)
l ~ Gamma(4, 1)
f = GP(v * with_lengthscale(SEKernel(), l))
f_latent ~ f(d, jitter)
binomials = Binomial.(n, logistic.(f_latent))
y ~ product_distribution(binomials)
return (fx=f(d, jitter), f_latent=f_latent, y=y)
end
```
</div>
<div style="min-width:420px; max-width:420px;padding:0.5rem;">
<div style="font-size:x-large;font-weight:700;padding-bottom:0.5rem;">
Goodbye, World in Turing
</div>
Some text about how easy it is to interface with external packages like AbstractGPs. Learn more about modelling [Gaussian Processes](https://turinglang.org/docs/tutorials/15-gaussian-processes/) with Turing.jl.
</div>
</div>
</div>


<!--
::: {.hero-banner}
Expand Down
2 changes: 2 additions & 0 deletions theming/dark.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,8 +8,10 @@ $theme: "cosmo" !default;

/*-- scss:rules --*/

@import "rules/layouts";
@import "rules/cards";
@import "rules/buttons";
@import "rules/navbar";
@import "rules/sourceCode";

//
2 changes: 2 additions & 0 deletions theming/light.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,9 @@

/*-- scss:rules --*/

@import "rules/layouts";
@import "rules/cards";
@import "rules/buttons";
@import "rules/navbar";
@import "rules/sourceCode";

4 changes: 2 additions & 2 deletions theming/rules/_buttons.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -17,8 +17,8 @@
border: solid $color-secondary 1px;

&:hover {
background-color: lighten($color-secondary, 10%) !important;
border-color: lighten($color-secondary, 10%) !important;
background-color: $color-highlight !important;
border-color: $color-highlight !important;
}
}
}
6 changes: 6 additions & 0 deletions theming/rules/_cards.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,13 @@

.card-title {
color: $color-fg !important;
margin-bottom: 0.5rem !important;
font-size: x-large;
font-weight: 700;
}

&--nopad {
@extend .card;
padding: 0rem;
}
}
3 changes: 3 additions & 0 deletions theming/rules/_layouts.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
.content-panel {
padding: 1.5rem;
}
4 changes: 4 additions & 0 deletions theming/rules/_navbar.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,4 +1,8 @@
.navbar {
background-color: $body-bg;
color: $text-muted;

a:hover {
text-decoration: none;
}
}
9 changes: 9 additions & 0 deletions theming/rules/_sourceCode.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,9 @@
.sourceCode {
background-color: $color-mute-bg !important;
border-color: $color-mute-bg !important;
border-radius: $border-radius-sm !important;

pre {
padding: 0.5rem !important;
}
}
9 changes: 4 additions & 5 deletions theming/variables/_colorsdark.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,15 +11,12 @@ $gray-900: #212529 !default;
$black: #000000 !default;

$dark-green: #073c44;
$thistle: #E7CEED;
$light-orange: darken(#FEEEEB, 5%); // the actual KI color is a little light for many potential use cases
$light-blue: darken(#EDF4F4, 5%);
$logo-plum: #870052;
$medium-grey: #CCD1D5;

$color-primary: $thistle;
$color-primary: red; // ??? Nope
$color-secondary: $dark-green;
$color-highlight: lighten($dark-green, 10%);
$color-highlight: lighten($color-secondary, 10%);

$color-mute-bg: $gray-800;

Expand All @@ -34,3 +31,5 @@ $quarto-category-border-color: lighten($light-bg, 30%);
$quarto-category-hover-background-color: darken($light-bg, 5%);
$quarto-category-hover-border-color: lighten($light-bg, 50%);
$quarto-category-highlight: $color-fg;

$link-color: lighten($dark-green, 15%);
6 changes: 3 additions & 3 deletions theming/variables/_colorslight.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,15 +11,13 @@ $gray-900: #212529 !default;
$black: #000000 !default;

$dark-green: #073c44;
$thistle: #E7CEED;
$light-orange: darken(#FEEEEB, 5%); // the actual KI color is a little light for many potential use cases
$light-blue: #EDF4F4;
$logo-plum: #870052;
$medium-grey: #CCD1D5;
$color-fg: black;

$color-primary: $dark-green;
$color-secondary: darken($light-blue, 20%);
$color-highlight: lighten($color-secondary, 10%);

$color-mute-bg: $gray-200;

Expand All @@ -32,3 +30,5 @@ $quarto-category-highlight: $color-fg;

$light-bg: white;
$light-bg-offset: $color-secondary;

$link-color: lighten($dark-green, 15%);