Skip to content

Commit

Permalink
basic website done
Browse files Browse the repository at this point in the history
  • Loading branch information
pat-alt committed Aug 28, 2024
1 parent 254deaf commit 4ee897c
Show file tree
Hide file tree
Showing 26 changed files with 2,536 additions and 34 deletions.
8 changes: 8 additions & 0 deletions docs/README.qmd
Original file line number Diff line number Diff line change
@@ -0,0 +1,8 @@
---
format:
gfm:
wrap: preserve
bibliography: bib.bib
---

{{< include about.qmd >}}
10 changes: 10 additions & 0 deletions docs/_extensions/pat-alt/documenterjl/_extension.yml
Original file line number Diff line number Diff line change
@@ -0,0 +1,10 @@
title: |
`Documenter.jl`
author: pat-alt
version: 1.0.0
quarto-required: ">=1.3"
contributes:
formats:
commonmark:
variant: -raw_html+tex_math_dollars
wrap: preserve
18 changes: 18 additions & 0 deletions docs/_extensions/pat-alt/julia/_extension.yml
Original file line number Diff line number Diff line change
@@ -0,0 +1,18 @@
title: Julia
author: pat-alt
version: 1.0.0
quarto-required: ">=1.3"
contributes:
formats:
html:
toc: true
theme: [default, custom.scss]
revealjs:
theme: [default, custom.scss, revealjs.scss]
include-in-header: revealjs_header.html
callout-icon: false
title-slide-attributes:
data-background-position: bottom right
data-background-size: 20%
html-math-method: mathjax

71 changes: 71 additions & 0 deletions docs/_extensions/pat-alt/julia/custom.scss
Original file line number Diff line number Diff line change
@@ -0,0 +1,71 @@
/*-- scss:defaults --*/
@font-face {
font-family: JuliaMono-Light;
src: url("https://cdn.jsdelivr.net/gh/cormullion/juliamono/webfonts/JuliaMono-Light.woff2");
}

@import url('https://fonts.googleapis.com/css2?family=Barlow:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
@import url("https://fonts.googleapis.com/css?family=Roboto");

$font-family-monospace: "JuliaMono-Light" !default;
$font-family-sans-serif: "Roboto" !default;

// Colors
// Define the Julia colours as per https://github.com/JuliaLang/julia-logo-graphics#color-definitions
$julia-blue: #4063D8;
$julia-green: #389836;
$julia-purple: #9558B2;
$julia-red: #CB3C33;
// Assign:
$primary: $julia-blue !default;
$body-bg: #ffffff !default;
$body-color: #000000 !default;
$presentation-heading-color: $julia-blue !default;
$link-color: $julia-blue !default;
// Code:
$code-color: $julia-green !default;
$dark-bg-code-color: lighten($code-color, 15%) !default;
$light-bg-code-color: darken($code-color, 15%) !default;
$code-block-border-left: lighten($code-color, 15%) !default;
$btn-code-copy-color: $julia-purple !default;
$btn-code-copy-color-active: lighten($btn-code-copy-color, 15%) !default;
// Toc:
$toc-color: $julia-purple !default;
$toc-active-border: $julia-purple !default;
$toc-inactive-border: lighten($toc-active-border, 15%) !default;
// Callouts:
$callout-color-note: $julia-blue !default;
$callout-color-tip: $julia-green !default;
$callout-color-caution: $julia-purple !default;
$callout-color-warning: lighten($callout-color-caution, 30%) !default;
$callout-color-important: $julia-red !default;

/*-- scss:rules --*/
h1, h2, h3, h4, h5, h6 {
font-family: "Barlow";
}

hr {
color: $julia-blue;
}

blockquote {
color: lighten($julia-blue, 15%);
border-left: .25rem solid $julia-blue;
background-color: lighten($julia-blue, 40%);
font-family: "Barlow";
}

// Classes for Julia colors:
.julia-purple {
color: $julia-purple;
}
.julia-blue {
color: $julia-blue;
}
.julia-green {
color: $julia-green;
}
.julia-red {
color: $julia-red;
}
15 changes: 15 additions & 0 deletions docs/_extensions/pat-alt/julia/revealjs.scss
Original file line number Diff line number Diff line change
@@ -0,0 +1,15 @@
/*-- scss:rules --*/
.reveal {

.progress {
color: $code-color;
}

blockquote {
color: lighten($julia-blue, 15%);
border-left: .25rem solid $julia-blue;
background-color: lighten($julia-blue, 40%);
font-family: "Barlow";
}

}
49 changes: 49 additions & 0 deletions docs/_extensions/pat-alt/julia/revealjs_header.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,49 @@
<style type="text/css">

/* Note */
div.callout-note {
border-left-color: #4063d8 !important;
}

div.callout-note.callout-style-default .callout-title {
background-color: #eceffb;
}

/* Tip */
div.callout-tip {
border-left-color: #389836 !important;
}

div.callout-tip.callout-style-default .callout-title {
background-color: #ebf5eb;
}

/* Caution */
div.callout-caution {
border-left-color: #9558B2 !important;
}

div.callout-caution.callout-style-default .callout-title {
background-color: #f4eef7;
}

/* Warning */
div.callout-warning {
border-left-color: #d7c1e2 !important;
}

div.callout-warning.callout-style-default .callout-title {
background-color: #fbf9fc;
}

/* Important */
div.callout-important {
border-left-color: #cb3c33 !important;
}

div.callout-important.callout-style-default .callout-title {
background-color: #faeceb;
}


</style>
149 changes: 131 additions & 18 deletions docs/about.html
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes">


<title>About – Taija</title>
<title>about</title>
<style>
code{white-space: pre-wrap;}
span.smallcaps{font-variant: small-caps;}
Expand All @@ -30,6 +30,7 @@
<script src="site_libs/quarto-search/fuse.min.js"></script>
<script src="site_libs/quarto-search/quarto-search.js"></script>
<meta name="quarto:offset" content="./">
<link href="./www/favicon.ico" rel="icon">
<script src="site_libs/quarto-html/quarto.js"></script>
<script src="site_libs/quarto-html/popper.min.js"></script>
<script src="site_libs/quarto-html/tippy.umd.min.js"></script>
Expand Down Expand Up @@ -66,6 +67,9 @@
"search-label": "Search"
}
}</script>
<script src="site_libs/quarto-diagram/mermaid.min.js"></script>
<script src="site_libs/quarto-diagram/mermaid-init.js"></script>
<link href="site_libs/quarto-diagram/mermaid.css" rel="stylesheet">


<link rel="stylesheet" href="styles.css">
Expand All @@ -78,8 +82,8 @@
<nav class="navbar navbar-expand-lg " data-bs-theme="dark">
<div class="navbar-container container-fluid">
<div class="navbar-brand-container mx-auto">
<a class="navbar-brand" href="./index.html">
<span class="navbar-title">Taija</span>
<a href="./index.html" class="navbar-brand navbar-brand-logo">
<img src="./www/logo_close.png" alt="" class="navbar-logo">
</a>
</div>
<div id="quarto-search" class="" title="Search"></div>
Expand All @@ -96,6 +100,13 @@
<a class="nav-link active" href="./about.html" aria-current="page">
<span class="menu-text">About</span></a>
</li>
</ul>
<ul class="navbar-nav navbar-nav-scroll ms-auto">
<li class="nav-item compact">
<a class="nav-link" href="https://github.com/JuliaTrustworthyAI"> <i class="bi bi-github" role="img">
</i>
<span class="menu-text"></span></a>
</li>
</ul>
</div> <!-- /navcollapse -->
<div class="quarto-navbar-tools">
Expand All @@ -107,34 +118,110 @@
<div id="quarto-content" class="quarto-container page-columns page-rows-contents page-layout-article page-navbar">
<!-- sidebar -->
<!-- margin-sidebar -->
<div id="quarto-margin-sidebar" class="sidebar margin-sidebar zindex-bottom">

<div id="quarto-margin-sidebar" class="sidebar margin-sidebar">
<nav id="TOC" role="doc-toc" class="toc-active">
<h2 id="toc-title">On this page</h2>

<ul>
<li><a href="#about" id="toc-about" class="nav-link active" data-scroll-target="#about">About</a></li>
</ul>
<div class="toc-actions"><ul><li><a href="https://github.com/JuliaTrustworthyAI/.github/issues/new" class="toc-action"><i class="bi bi-github"></i>Report an issue</a></li></ul></div></nav>
</div>
<!-- main -->
<main class="content" id="quarto-document-content">

<header id="title-block-header" class="quarto-title-block default">
<div class="quarto-title">
<h1 class="title">About</h1>
</div>



<div class="quarto-title-meta">
<section id="about" class="level2">
<h2 class="anchored" data-anchor-id="about">About</h2>
<p>Taija currently covers a range of approaches towards making AI systems more trustworthy:</p>
<ul>
<li>Model Explainability (<a href="https://github.com/JuliaTrustworthyAI/CounterfactualExplanations.jl">CounterfactualExplanations.jl</a>)</li>
<li>Algorithmic Recourse (<a href="https://github.com/JuliaTrustworthyAI/CounterfactualExplanations.jl">CounterfactualExplanations.jl</a>, <a href="https://github.com/JuliaTrustworthyAI/AlgorithmicRecourseDynamics.jl">AlgorithmicRecourseDynamics.jl</a>)</li>
<li>Predictive Uncertainty Quantification (<a href="https://github.com/JuliaTrustworthyAI/ConformalPrediction.jl">ConformalPrediction.jl</a>, <a href="https://github.com/JuliaTrustworthyAI/LaplaceRedux.jl">LaplaceRedux.jl</a>)</li>
<li>Effortless Bayesian Deep Learning (<a href="https://github.com/JuliaTrustworthyAI/LaplaceRedux.jl">LaplaceRedux.jl</a>)</li>
<li>Hybrid Learning (<a href="https://github.com/JuliaTrustworthyAI/JointEnergyModels.jl">JointEnergyModels.jl</a>)</li>
</ul>
<p>Various meta packages can be used to extend the core functionality:</p>
<ul>
<li>Plotting (<a href="https://github.com/JuliaTrustworthyAI/TaijaPlotting.jl">TaijaPlotting.jl</a>)</li>
<li>Datasets for testing and benchmarking (<a href="https://github.com/JuliaTrustworthyAI/TaijaData.jl">TaijaData.jl</a>)</li>
<li>Parallelization (<a href="https://github.com/JuliaTrustworthyAI/TaijaParallel.jl">TaijaParallel.jl</a>)</li>
<li>Interoperability with other programming languages (<a href="https://github.com/JuliaTrustworthyAI/TaijaInteroperability.jl">TaijaInteroperability.jl</a>)</li>
</ul>
<p>The <a href="https://github.com/JuliaTrustworthyAI/TaijaBase.jl">TaijaBase.jl</a> package provides common symbols, types and functions that are used across all or multiple Taija packages.</p>
<div class="cell" data-file="overview.mmd" data-layout-align="default">
<div class="cell-output-display">
<div id="fig-overview" class="quarto-float quarto-figure quarto-figure-center anchored">
<figure class="quarto-float quarto-float-fig figure">
<div aria-describedby="fig-overview-caption-0ceaefa1-69ba-4598-a22c-09a6ac19f8ca">
<div>
<pre class="mermaid mermaid-js" data-label="fig-overview">%%{
init: {
'theme': 'base',
'themeVariables': {
'primaryColor': '#BB2528',
'primaryTextColor': '#fff',
'primaryBorderColor': '#7C0000',
'lineColor': '#F8B229',
'secondaryColor': '#006100',
'tertiaryColor': '#e9edfb',
'fontFamily': "avenir"
}
}
}%%

flowchart TB

classDef taija fill:#389836,stroke:#333,color:#fff;
classDef core fill:#CB3C33,stroke:#333,color:#fff;
classDef base fill:#9558B2,stroke:#333,color:#fff;

%% Base
base["TaijaBase.jl"]




</div>

%% Meta
interop["TaijaInteroperability.jl"]
data["TaijaData.jl"]
parallel["TaijaParallel.jl"]
plotting["TaijaPlotting.jl"]

%% Core
ce["CounterfactualExplanations.jl"]
ar["AlgorithmiRecourseDynamics.jl"]
cp["ConformalPrediction.jl"]
lr["LaplaceRedux.jl"]
jem["JointEnergyModels.jl"]

</header>
class base base;
class interop,data,parallel,plotting taija;
class ce,cp,lr,jem,ar core;

%% Graph
subgraph "Meta Packages"
data &amp; plotting &amp; parallel &amp; interop
end

<p>About this site</p>
subgraph "Core Packages"
ce &amp; cp &amp; lr &amp; jem &amp; ar
end</pre>
</div>
</div>
<figcaption class="quarto-float-caption-bottom quarto-float-caption quarto-float-fig" id="fig-overview-caption-0ceaefa1-69ba-4598-a22c-09a6ac19f8ca">
Figure&nbsp;1: An overview of the Taija ecosystem.
</figcaption>
</figure>
</div>
</div>
</div>
<blockquote class="blockquote">
<p>Why <em>Taija</em>?</p>
</blockquote>
<p>Taija stands for <strong>T</strong>rustworthy <strong>A</strong>rtificial <strong>I</strong>ntelligence in <strong>J</strong>uli<strong>a</strong>. When thinking about a logo that embodies trustworthiness, we quickly landed on 🐶.</p>


</section>

</main> <!-- /main -->
<script id="quarto-html-after-body" type="application/javascript">
Expand Down Expand Up @@ -229,7 +316,7 @@ <h1 class="title">About</h1>
}
var localhostRegex = new RegExp(/^(?:http|https):\/\/localhost\:?[0-9]*\//);
var mailtoRegex = new RegExp(/^mailto:/);
var filterRegex = new RegExp('/' + window.location.host + '/');
var filterRegex = new RegExp("https:\/\/www\.taija\.org\/");
var isInternal = (href) => {
return filterRegex.test(href) || localhostRegex.test(href) || mailtoRegex.test(href);
}
Expand Down Expand Up @@ -558,6 +645,32 @@ <h1 class="title">About</h1>
});
</script>
</div> <!-- /content -->
<footer class="footer">
<div class="nav-footer">
<div class="nav-footer-left">
<p><a href="https://opensource.org/licenses/MIT"><img src="https://img.shields.io/badge/License-MIT-yellow.svg" class="img-fluid" alt="License: MIT"></a> <a href="http://creativecommons.org/licenses/by/4.0/"><img src="https://img.shields.io/badge/License-CC%20BY%204.0-lightgrey.svg" class="img-fluid" alt="CC BY 4.0"></a> © 2024, Taija</p>
</div>
<div class="nav-footer-center">
&nbsp;
<div class="toc-actions d-sm-block d-md-none"><ul><li><a href="https://github.com/JuliaTrustworthyAI/.github/issues/new" class="toc-action"><i class="bi bi-github"></i>Report an issue</a></li></ul></div></div>
<div class="nav-footer-right">
<ul class="footer-items list-unstyled">
<li class="nav-item compact">
<a class="nav-link" href="https://www.taija.org/">
<i class="bi bi-house" role="img">
</i>
</a>
</li>
<li class="nav-item compact">
<a class="nav-link" href="https://github.com/JuliaTrustworthyAI">
<i class="bi bi-github" role="img">
</i>
</a>
</li>
</ul>
</div>
</div>
</footer>



Expand Down
Loading

0 comments on commit 4ee897c

Please sign in to comment.