diff --git a/.gitignore b/.gitignore
index cad237a38e..1464ee90b1 100644
--- a/.gitignore
+++ b/.gitignore
@@ -1,5 +1,7 @@
/built_doc
/hotdoc-private*
+/.hotdoc.d
+/*.stamp
Debug
Release
ipch
diff --git a/.gitmodules b/.gitmodules
new file mode 100644
index 0000000000..7eb6e16e97
--- /dev/null
+++ b/.gitmodules
@@ -0,0 +1,3 @@
+[submodule "hotdoc_bootstrap_theme"]
+ path = hotdoc_bootstrap_theme
+ url = git@github.com:hotdoc/hotdoc_bootstrap_theme.git
diff --git a/Makefile b/Makefile
index d21c078bba..d4f8f6d856 100644
--- a/Makefile
+++ b/Makefile
@@ -1,3 +1,9 @@
+all:
+
+install:
+
+clean:
+
HOTDOC ?= hotdoc
prefix ?= /usr
datadir ?= ${prefix}/share
@@ -20,11 +26,18 @@ gst_docs_HOTDOC_FLAGS = \
--conf-file hotdoc.json \
$(NULL)
-all:
+theme.stamp: less/variables.less
+ +make -C hotdoc_bootstrap_theme LESS_INCLUDE_PATH=$$PWD/less
+ @rm -rf hotdoc-private*
+ @touch theme.stamp
-install:
+clean_theme:
+ rm -f theme.stamp
+ +make -C hotdoc_bootstrap_theme clean
-clean:
+clean: clean_theme
+
+gst_docs_HOTDOC_EXTRA_DEPS = theme.stamp
.PHONY: all install clean
diff --git a/README b/README
index 5a896184c0..2d629c6153 100644
--- a/README
+++ b/README
@@ -27,22 +27,26 @@ for *stable* automatic formatting.
* We *experimentally* use the hotdoc C extension to include functions by
name, follow the steps outlined [here](https://github.com/hotdoc/hotdoc_c_extension)
-* Optionally install the `hotdoc_syntax_highlighting_extension`:
+* We recompile and override hotdoc's default theme, which is a submodule of this project:
```
-pip install hotdoc-syntax-highlighting-extension
+git submodule update --init
```
-* Optionally install the `hotdoc_search_extension`:
+Follow the instructions outlined in the theme's README.md, you can dispense
+with the last step (building the theme):
```
-pip install hotdoc-search-extension
+cd hotdoc_bootstrap_theme
+sudo dnf install nodejs # On Fedora
+npm install && ./node_modules/bower/bin/bower install
+cd ..
```
* Build the portal:
```
-hotdoc run
+make
```
* And browse it:
diff --git a/extra_theme/images/gstreamer-logo.svg b/extra_theme/images/gstreamer-logo.svg
new file mode 100644
index 0000000000..26998462f1
--- /dev/null
+++ b/extra_theme/images/gstreamer-logo.svg
@@ -0,0 +1,54 @@
+
+
+
+
+]>
+
diff --git a/extra_theme/templates/brand-logo.html b/extra_theme/templates/brand-logo.html
new file mode 100644
index 0000000000..dcf36e6e47
--- /dev/null
+++ b/extra_theme/templates/brand-logo.html
@@ -0,0 +1,3 @@
+@require(assets_path)
+
+
diff --git a/hotdoc.json b/hotdoc.json
index 041dc94a24..4875f391ad 100644
--- a/hotdoc.json
+++ b/hotdoc.json
@@ -12,5 +12,7 @@
"project_name": "GStreamer Documentation",
"sitemap": "sitemap.txt",
"syntax_highlighting_activate": true,
- "devhelp_activate": true
+ "devhelp_activate": true,
+ "html_theme": "hotdoc_bootstrap_theme/dist",
+ "html_extra_theme": "extra_theme"
}
diff --git a/hotdoc_bootstrap_theme b/hotdoc_bootstrap_theme
new file mode 160000
index 0000000000..c1fc1c9b3d
--- /dev/null
+++ b/hotdoc_bootstrap_theme
@@ -0,0 +1 @@
+Subproject commit c1fc1c9b3dc9ab699ad8e3ea4633d6f28ebd8a63
diff --git a/less/variables.less b/less/variables.less
new file mode 100644
index 0000000000..67da154b05
--- /dev/null
+++ b/less/variables.less
@@ -0,0 +1,875 @@
+// Lumen 3.3.7
+// Variables
+// --------------------------------------------------
+
+
+//== Colors
+//
+//## Gray and brand colors for use across Bootstrap.
+
+@gray-base: #000;
+@gray-darker: lighten(@gray-base, 13.5%); // #222
+@gray-dark: lighten(@gray-base, 20%); // #333
+@gray: lighten(@gray-base, 33.5%); // #555
+@gray-light: lighten(@gray-base, 60%); // #999
+@gray-lighter: lighten(@gray-base, 93.5%); // #eee
+
+@brand-primary: #158CBA;
+@brand-success: #28B62C;
+@brand-info: #75CAEB;
+@brand-warning: #FF851B;
+@brand-danger: #FF4136;
+
+
+//== Scaffolding
+//
+//## Settings for some of the most global styles.
+
+//** Background color for `
`.
+@body-bg: #fff;
+//** Global text color on ``.
+@text-color: @gray;
+
+//** Global textual link color.
+@link-color: @brand-primary;
+//** Link hover color set via `darken()` function.
+@link-hover-color: @link-color;
+//** Link hover decoration.
+@link-hover-decoration: underline;
+
+
+//== Typography
+//
+//## Font, line-height, and color for body text, headings, and more.
+
+@font-family-sans-serif: "Source Sans Pro", "Helvetica Neue", Helvetica, Arial, sans-serif;
+@font-family-serif: Georgia, "Times New Roman", Times, serif;
+//** Default monospace fonts for ``, ``, and `
`.
+@font-family-monospace: Menlo, Monaco, Consolas, "Courier New", monospace;
+@font-family-base: @font-family-sans-serif;
+
+@font-size-base: 14px;
+@font-size-large: ceil((@font-size-base * 1.25)); // ~18px
+@font-size-small: ceil((@font-size-base * 0.85)); // ~12px
+
+@font-size-h1: floor((@font-size-base * 2.6)); // ~36px
+@font-size-h2: floor((@font-size-base * 2.15)); // ~30px
+@font-size-h3: ceil((@font-size-base * 1.7)); // ~24px
+@font-size-h4: ceil((@font-size-base * 1.25)); // ~18px
+@font-size-h5: @font-size-base;
+@font-size-h6: ceil((@font-size-base * 0.85)); // ~12px
+
+//** Unit-less `line-height` for use in components like buttons.
+@line-height-base: 1.428571429; // 20/14
+//** Computed "line-height" (`font-size` * `line-height`) for use with `margin`, `padding`, etc.
+@line-height-computed: floor((@font-size-base * @line-height-base)); // ~20px
+
+//** By default, this inherits from the ``.
+@headings-font-family: inherit;
+@headings-font-weight: 400;
+@headings-line-height: 1.1;
+@headings-color: @gray-dark;
+
+
+//== Iconography
+//
+//## Specify custom location and filename of the included Glyphicons icon font. Useful for those including Bootstrap via Bower.
+
+//** Load fonts from this directory.
+@icon-font-path: "../fonts/";
+//** File name for all font files.
+@icon-font-name: "glyphicons-halflings-regular";
+//** Element ID within SVG icon file.
+@icon-font-svg-id: "glyphicons_halflingsregular";
+
+
+//== Components
+//
+//## Define common padding and border radius sizes and more. Values based on 14px text and 1.428 line-height (~20px to start).
+
+@padding-base-vertical: 7px;
+@padding-base-horizontal: 12px;
+
+@padding-large-vertical: 13px;
+@padding-large-horizontal: 16px;
+
+@padding-small-vertical: 4px;
+@padding-small-horizontal: 10px;
+
+@padding-xs-vertical: 1px;
+@padding-xs-horizontal: 5px;
+
+@line-height-large: 1.3333333; // extra decimals for Win 8.1 Chrome
+@line-height-small: 1.5;
+
+@border-radius-base: 4px;
+@border-radius-large: 5px;
+@border-radius-small: 2px;
+
+//** Global color for active items (e.g., navs or dropdowns).
+@component-active-color: #fff;
+//** Global background color for active items (e.g., navs or dropdowns).
+@component-active-bg: @brand-primary;
+
+//** Width of the `border` for generating carets that indicate dropdowns.
+@caret-width-base: 4px;
+//** Carets increase slightly in size for larger components.
+@caret-width-large: 5px;
+
+
+//== Tables
+//
+//## Customizes the `.table` component with basic values, each used across all table variations.
+
+//** Padding for `
`s and `
`s.
+@table-cell-padding: 8px;
+//** Padding for cells in `.table-condensed`.
+@table-condensed-cell-padding: 5px;
+
+//** Default background color used for all tables.
+@table-bg: transparent;
+//** Background color used for `.table-striped`.
+@table-bg-accent: #f9f9f9;
+//** Background color used for `.table-hover`.
+@table-bg-hover: #f5f5f5;
+@table-bg-active: @table-bg-hover;
+
+//** Border color for table and cell borders.
+@table-border-color: @gray-lighter;
+
+
+//== Buttons
+//
+//## For each of Bootstrap's buttons, define text, background and border color.
+
+@btn-font-weight: normal;
+
+@btn-default-color: @gray;
+@btn-default-bg: @gray-lighter;
+@btn-default-border: darken(@btn-default-bg, 5%);
+
+@btn-primary-color: #fff;
+@btn-primary-bg: @brand-primary;
+@btn-primary-border: darken(@btn-primary-bg, 5%);
+
+@btn-success-color: #fff;
+@btn-success-bg: @brand-success;
+@btn-success-border: darken(@btn-success-bg, 5%);
+
+@btn-info-color: #fff;
+@btn-info-bg: @brand-info;
+@btn-info-border: darken(@btn-info-bg, 5%);
+
+@btn-warning-color: #fff;
+@btn-warning-bg: @brand-warning;
+@btn-warning-border: darken(@btn-warning-bg, 5%);
+
+@btn-danger-color: #fff;
+@btn-danger-bg: @brand-danger;
+@btn-danger-border: darken(@btn-danger-bg, 5%);
+
+@btn-link-disabled-color: @gray-light;
+
+// Allows for customizing button radius independently from global border radius
+@btn-border-radius-base: @border-radius-base;
+@btn-border-radius-large: @border-radius-large;
+@btn-border-radius-small: @border-radius-small;
+
+
+//== Forms
+//
+//##
+
+//** `` background color
+@input-bg: #fff;
+//** `` background color
+@input-bg-disabled: @gray-lighter;
+
+//** Text color for ``s
+@input-color: @gray;
+//** `` border color
+@input-border: darken(#f8f8f8, 6.5%);
+
+// TODO: Rename `@input-border-radius` to `@input-border-radius-base` in v4
+//** Default `.form-control` border radius
+// This has no effect on `