Code Monkey home page Code Monkey logo

mkdocs-windmill's Introduction

PyPI

Windmill theme for MkDocs

Outstanding mkdocs theme with a focus on navigation and usability, from Grist Labs.

Highlights:

  • Convenient navigation for larger documentation projects.
  • Retains state of the navigation menu across page transitions.
  • Search with term highlighting.
  • User may search in a quick dropdown or load results in a full page.
  • Default mkdocs theme within pages, including syntax highlighting.

Quick start

To install using pip:

pip install mkdocs-windmill

To use in mkdocs.yml:

theme: windmill

Note that it's important for there to exist a homepage, e.g. a top-level root element in mkdocs 1.0+:

nav:
  - Home: index.md

Demo and documentation

More details are on this site generated with the Windmill theme:

  • Usage for more on installation and usage.
  • Customization for extra configuration options that Windmill supports.

Development

If doing development on mkdocs-windmill, check it out with

git clone https://github.com/gristlabs/mkdocs-windmill/
cd mkdocs-windmill

There are Selenium browser tests, based on NodeJS. To set them up, first install Yarn, then from mkdocs-windmill checkout, run

cd tests
yarn install

You can run tests when you make changes as follows:

cd tests
MKDOCS_BINARY=<path-to-mkdocs-command> SELENIUM_BROWSER=chrome yarn test

mkdocs-windmill's People

Contributors

anjoman avatar dsagal avatar dsinn avatar edentsai avatar raimon49 avatar spencer-sawyer avatar thewoolleyman avatar ysagal avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar

mkdocs-windmill's Issues

Content Frame Size

This is not an issue but, how can I change the content frame size to use the entire screen.
I'm using Full HD (10920x1080) and there's too much empty screen.

The Ivory Theme, for example uses the entire frame to display the content.

I love the Windmill Theme!

Search not working on new content, and not displaying right on mobile

I'm using your theme to build a documentation site on Tibetan NLP in Tibetan. I've opted to download the theme folder from github, but somehow the search doesn't build properly and the search bar doesn't scale properly on my mobile. My project is here.

bug

Thanks a lot for building this theme! It's going to be great.

TOC navigation glitch

The TOC navigation has a small glitch: the title that is selected hides behind the top banner. For instance when I select the page Workflow, the title is displayed properly.
image
But when I click on Digitization Workflow, most of the title disappears behind the banner.
image

Is that a problem you experience too? Is there something to do about it?

Extra space on indented lists

Hello! Love the windmill theme.

One bug I noticed:
In Markdown, I type:

- list
    - a
    - b
- next list
    - c

When rendered into my wiki, there is more space between - list and - a than there is between - b and - next list. Which doesn't seem right. It throws off the look when you are trying to show organization and the separation (if any) should be between - b and - next list.

mkdocs complains about a missing configuration file

I am using MkDocs with the Windmill theme for a new site. I have a Docker container running a development server during development, then I use Travis CI from GitHub to build the actual site into GitHub Pages. In both places, which use the most recent version of mkdocs-windmill available to pip, I get a warning:

WARNING - The theme 'windmill' does not appear to have a configuration file. Please upgrade to a current version of the theme.

Looking at the MkDocs source code, it appears to be looking for a mkdocs_theme.yml file. Could you provide one to prevent the warning?

Add Google Tag Manager

I would like to extend this theme to include Google Tag Manager and I'd like to mirror how mkdocs-material did it:
squidfunk/mkdocs-material#2055
Before I submit a PR I wanted to confirm that this repo was still being actively monitored. Thanks.

Pages are not display properly if viewed offline

if I use the theme and do 'mkdocs serve' everything looks and acts great:.
screen shot 2017-08-03 at 4 13 35 pm

but if I do 'mkdocs build' then trying to access that same page results in the following:

screen shot 2017-08-03 at 4 16 33 pm

The image above was taken from our QWebEngine based html viewer (Basically Chrome). If I try the same site within Safari then the enclosing folder of the index.html file is opened up.

I use the "material" theme or the "mkdocs" theme I do not have these issues.

I like your theme because we have a large documentation project and the permanent navigation on the left side is extremely useful for navigation.

Add bootstrap.min.css.map to css directory

Please consider adding the bootstrap.min.css.map file from the standard Bootstrap distribution to the theme CSS directory. It seems to be used when examining rendered pages in developer mode.

External links in menu bar doesn’t work!:help-wanted

Hi,
I am trying to have a menu links in the sidebar where i can just given an url to html file!
I know it can be done with
nav:
- Test: "http://example.com"

But i am not using nav at all!
I have

theme:
name: null
custom_dir: theme
search_index_only: true
include_search_page: true

And it takes the folder structure automatically! if i will use nav, it override my current folder structure!

Does not support ie

Hi, I recently installed the windmill package as my theme. On chrome it works just fine although a pointer on how to decrease the width of the page so that the text and everything doesn't seem so small would be helpful. But on ie the first page doesn't open up the content. And then when you click on anything in navigation after going to the page you clicked the navigation bar disappears completely. Any ideas on how to fix?
Thanks.

Search ,previous and next not working with mkdocs 1.04!

During search,the url adds "." after # in the url
For eg. after searching the url would be something like "http://127.0.0.1:8000/#.widgets/alert" instead of
"http://127.0.0.1:8000/#widgets/alert

Previous and next keeps adding to the url instead of clearing it first.
For eg. Before clicking,url would be something like "http://127.0.0.1:8000/#widgets/alert",
after clicking next, url would be "http://127.0.0.1:8000/#widgets/alert/widgets/accordion" instead of
"http://127.0.0.1:8000/#widgets/accordion"

index.md problem

Hello guys, nice theme btw
I am trying to build the menu. The problem is the menu item that points to the index.md file generated without anchor tag, so the menu item that is associated with it, is not clickable.
My mkdocs.yml:

site_name: some site
theme: 'windmill'
nav: 
  - Introduction: 'index.md'
  - Purpose of the system design document : 'purpose of the system design document.md'
  - General overview and design guidelines/approach: 
    - General overview : 'general overview.md'
    - Assumptions/Constraints: 
      - Assumptions: 'assumptions.md'
      - Constraints: 'constraints.md'
  - Desing considerations: 
      - Goals: 'goals.md'  
      - Dependencies: 'dependencies.md'  
  - Overall system architecture:
      - Functional architecture:
        - UAE pass mobile app : 'uae pass mobile app.md'
        - UAE pass self-service portal: 'uae pass self-service portal.md'
      - Infrastructure architecture: 'infrastructure architecture.md'  
      - Network architecture : 'network architecture.md'
      - Security architecture : 'security architecture.md'
  - Operational scenarios: 
      - User enrolments : 'user enrolments.md'
      - Auth : 'auth.md'
      - Change email/mobile : 'change email-mobile.md'
      - User profile management: 'user profile management.md'
      - Notifications: 'notifications.md'
      - Google Drive and Dropbox integration : 'google drive and dropbox integration.md'
  - Databases design: 'database design.md'
  - Interfaces UX/UI: 'interfaces.md'
  - Acronyms and Abbreviations: 'acronyms and abbreviations.md'  

Every other menu or menu item works correctly except the "Introduciton"

highlightjs parameters are ignored

Thanks for a theme with such an awesome navigation!

It seems highlightjs parameters (such as hljs_style and hljs_languages) are not respected in Windmill despite being fully supported in mkdocs. I.e. following code works fine with mkdocs but not with name: windmill:

theme:
  name: mkdocs
  highlightjs: true
  hljs_style: 'atelier-sulphurpool-light'
  hljs_languages:
    - protobuf

Anchors broken for home page

From some applications (e.g. Gmail and Slack OSX Desktop app), anchors on the home page are broken.

This is because they turn two consecutive hashes (##) into the second one url-escaped (#%23).

E.g., if you paste this into slack app or send in gmail, then click it:

https://mysite.com/##header

You get sent to this page (which obviously 404s):

https://mysite.com/#%23header

This only happens on the root page (which is the only one with consecutive hashes in the URL), so one solution would be to use mysite/#/ (with a trailing slash) as the root, instead of just mysite/#. However, this seems to work on real sites (served via nginx), but not when served locally via mkdocs serve.

Error with search option

I am using windmill theme for mkdocs to generate static webpages. Good news is everything works charm as expected however I have an issue with search option.

When I search for any resources the url is changed to http://#.
Please notice a dot(.) between domain and key which is causing the problem. When I checked search.html, I could see key is present without dot(.) which is correct

Wondering where an extra dot(.) is getting appended during the search. Any leads on this issue would be highly appreciated

PS: I do not have any fancy configurations in mkdocs.yaml and I have kept very basic

Regards,
Karthik

Ampersands are escaped in menu

If ampersands are part of a menu item, they are escaped and displayed as &amp; instead of &. When the same item is displayed in the document text, ampersands are rendered fine as &.

Window resize issue when heading is too long

Another minor issue I noticed is that when I type a heading that is too long (they are nested within other headings btw) the window resize makes the navigation window on the left larger and spill out onto the notes section of the pages.

Example:
in a .md file, I use a very long heading:

## Very extremely super duper longish but pretty long heading
  • Try recreating it and see if it's just me.

I'm using Chrome on a fairly new Macbook Pro 13"

Provide example for extra customisation options

After reading the Customization and the Customizing a Theme, I can't figure out how to define the extra parameters on the mkdocs.yml.

What I've tried so far:

theme: windmill

extra:
    - extra.logo: 'img/Logo-128.png'
theme: windmill

extra:
extra.logo: 'img/Logo-128.png'

The error messages are

The configuration is invalid. The expected type was a key value mapping (a python dict) but we got an object of type: <type 'NoneType'>

The configuration is invalid. The expected type was a key value mapping (a python dict) but we got an object of type: <type 'NoneType'>

Could you please provide an example for the extra customisation options? Thank you!

Syntax highlighting does not respect language specified

In the windmill theme, try writing a page containing the following code block:

```sh
git clone https://github.com/gristlabs/mkdocs-windmill.git
```

It will ignore the language specification and attempt to guess the language instead, probably arriving at some conclusion like "vim" and highlighting the s: in the URL blue (!).

For two years, mkdocs has supported disabling highlight.js, which is great because highlight.js insists on guessing the code language, ignoring the user's explicit direction, and guesses something silly, as in the example above. In all built-in mkdocs themes, you can do:

theme:
    highlightjs: false

markdown_extensions:
    - codehilite

extra_css:
    - css/code_styles.css

Please add support for this to windmill.

To see how mkdocs did it for their themes, check out, for example, this PR.

Thanks!

Search results not appearing

Hi,

I followed the install instructions and I am using the development server (mkdocs serve) without extra configuration besides your theme:

site_name: My Site
theme: windmill

When I do I search I get the default theme style without highlighting. But if I click twice on the search box then the highlight appears. Also when I click on SEE ALL RESULTS http://localhost:8000/#search.html?q=test I get a 404 for that page.

Do I need to setup anything else for the search to work correctly ?

Thanks,
Claudio.

Lvl4 on left menu not handled

Hello,

I know not everyone will need this, but it would be nice to go to lvl4 on left menu.
You just need to add it in base.css:

.wm-toc-lev1 > .wm-toc-text { padding-left: 14px; }
.wm-toc-lev2 > .wm-toc-text { padding-left: 28px; }
.wm-toc-lev3 > .wm-toc-text { padding-left: 42px; }
.wm-toc-lev4 > .wm-toc-text { padding-left: 56px; }

.wm-toc-lev1 + .wm-page-toc { margin-left: 14px; }
.wm-toc-lev2 + .wm-page-toc { margin-left: 28px; }
.wm-toc-lev3 + .wm-page-toc { margin-left: 42px; }
.wm-toc-lev4 + .wm-page-toc { margin-left: 56px; }

And it works like a charm :-)

And by the way, many thanks for this Theme, it's perfect !

Ox

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.