Giter Club home page Giter Club logo

doxygen-awesome-css's Introduction

Doxygen Awesome

GitHub release (latest by date) GitHub GitHub Repo stars

Screenshot of Doxygen Awesome CSS

Doxygen Awesome is a custom CSS theme for Doxygen HTML-documentation with lots of customization parameters.

Motivation

I really like how the Doxygen HTML-documentation is structured! But IMHO it looks a bit outdated.

This theme is an attempt to update the visuals of Doxygen without changing its overall layout too much.

Features

  • ๐ŸŒˆ Clean, modern design
  • ๐Ÿš€ Heavily customizable by adjusting CSS-variables
  • ๐Ÿงฉ No changes to the HTML structure of Doxygen required
  • ๐Ÿ“ฑ Improved mobile usability
  • ๐ŸŒ˜ Dark mode support!
  • ๐Ÿฅ‡ Works best with doxygen 1.9.1 - 1.9.4

Examples

Some websites using this theme:

Installation

To use the theme in your documentation, copy the required CSS and JS files from this repository into your project or add the repository as submodule and check out the latest release:

git submodule add https://github.com/jothepro/doxygen-awesome-css.git
cd doxygen-awesome-css
git checkout v2.0.3

All theme files are located in the root of this repository and start with the prefix doxygen-awesome-. You may not need all of them. Follow the install instructions to figure out what files are required for your setup.

Choosing a layout

There is two layout options. Choose one of them and configure Doxygen accordingly:

Available theme variants

Base Theme (1)

Comes with the typical Doxygen titlebar. Optionally the treeview in the sidebar can be enabled.

Required files: doxygen-awesome.css

Required Doxyfile configuration:

GENERATE_TREEVIEW      = YES # optional. Also works without treeview
DISABLE_INDEX = NO
FULL_SIDEBAR = NO
HTML_EXTRA_STYLESHEET  = doxygen-awesome-css/doxygen-awesome.css

Sidebar-Only Theme (2)

Hides the top titlebar to give more space to the content. The treeview must be enabled in order for this theme to work.

Required files: doxygen-awesome.css, doxygen-awesome-sidebar-only.css

Required Doxyfile configuration:

GENERATE_TREEVIEW      = YES # required!
DISABLE_INDEX          = NO
FULL_SIDEBAR           = NO
HTML_EXTRA_STYLESHEET  = doxygen-awesome-css/doxygen-awesome.css \
                         doxygen-awesome-css/doxygen-awesome-sidebar-only.css

Caution: This theme is not compatible with the FULL_SIDEBAR = YES option provided by Doxygen!

Further installation instructions:

Browser support

Tested with

  • Chrome 104, Chrome 104 for Android, Chrome 103 for iOS
  • Safari 15, Safari for iOS 15
  • Firefox 103, Firefox 103 for Android, Firefox Daylight 102 for iOS
  • Edge 104

The theme does not strive to be backwards compatible to (significantly) older browser versions.

Credits

  • This theme was initially inspired by the vuepress static site generator default theme.
  • Thank you for all the bug reports, pull requests and inspiring feedback on github!

Read Next: Extensions

doxygen-awesome-css's People

Contributors

briederer avatar jothepro avatar nambers avatar r0ckarong avatar

Watchers

 avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.