Skip to content

Commit

Permalink
Various post-launch fixes (docker#2549)
Browse files Browse the repository at this point in the history
* WIP docker#2052

- Adding sass
- Test components
- Night mode
- docker con banner
- archive legacy css

* add compressed css

* Update branding for cloud api docs

* split out global header

* rescale mods

* adjust viewport rescaling

* sync

* test

* testing deploy

* john rules, please update man

* test: removing all styles

* trying to make netlify work

* add min-height to sidebars

* testing

* Update style.css

manually add css

* testing

* test

* Update style.css

* adding dockercon svg

* add svgs

add svgs

* remove css

* re-add

* s/container-fluid/container
  • Loading branch information
jsouth authored and johndmulhausen committed Mar 31, 2017
1 parent c72a0d7 commit 492074c
Show file tree
Hide file tree
Showing 35 changed files with 2,721 additions and 3,436 deletions.
7 changes: 7 additions & 0 deletions _config.yml
Original file line number Diff line number Diff line change
Expand Up @@ -163,3 +163,10 @@ defaults:
path: "apidocs/v2.0.1"
values:
hide_from_sitemap: true

# Assets
#
# We specify the directory for Jekyll so we can use @imports.
sass:
sass_dir: _scss
style: :compressed
140 changes: 75 additions & 65 deletions _includes/global-header.html
Original file line number Diff line number Diff line change
@@ -1,51 +1,55 @@
<div class="header">
<div class="fan"></div>
<div class="container">
<div class="row">
<nav class="nav-primary">
<div class="container">
<div class="navbar-header">
<img class="logo" src="../images/docker-docs-logo.svg" alt="Docker Docs" title="Docker Docs">
</div>
<div class="navbar-collapse collapse">
<ul class="primary nav navbar-nav">
<li><a href="https://docker.com/what-docker">What is Docker?</a></li>
<li><a href="https://docker.com/get-docker">Product</a></li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Get Docker <span class="caret"></span></a>
<ul class="dropdown-menu nav-main">
<h6 class="dropdown-header">For Desktops</h6>
<li><a href="https://docker.com/docker-mac">Mac</a></li>
<li><a href="https://docker.com/docker-windows">Windows</a></li>
<h6 class="dropdown-header">For Cloud Providers</h6>
<li><a href="https://docker.com/docker-aws">AWS</a></li>
<li><a href="https://docker.com/docker-microsoft-azure">Azure</a></li>
<h6 class="dropdown-header">For Servers</h6>
<li><a href="https://docker.com/docker-windows-server">Windows Server</a></li>
<li><a href="https://docker.com/docker-centos">CentOS</a></li>
<li><a href="https://docker.com/docker-debian">Debian</a></li>
<li><a href="https://docker.com/docker-fedora">Fedora</a></li>
<li><a href="https://docker.com/docker-oracle-linux">Oracle Enterprise Linux</a></li>
<li><a href="https://docker.com/docker-rhel">RHEL</a></li>
<li><a href="https://docker.com/docker-sles">SLES</a></li>
<li><a href="https://docker.com/docker-ubuntu">Ubuntu</a></li>
</ul>
</li>
<li><a href="https://docs.docker.com">Docs</a></li>
<li><a href="https://docker.com/docker-community">Community</a></li>
</ul>
<ul class="nav navbar-nav navbar-right user-nav">
<li><a href="https://cloud.docker.com/">Create Docker ID</a></li>
<li><a href="https://cloud.docker.com/login">Sign In</a></li>
</ul>
</div>
<!--/.nav-collapse -->
</div>
</nav>
</div>
<div class="container-fluid">
<div class="row">
<nav class="nav-primary">
<div class="container-fluid">
<div class="navbar-header">
<img class="logo" src="../images/docker-docs-logo.svg" alt="Docker Docs" title="Docker Docs">
</div>
<div class="navbar-collapse collapse">
<ul class="primary nav navbar-nav">
<li><a href="https://docker.com/what-docker">What is Docker?</a></li>
<li><a href="https://docker.com/get-docker">Product</a></li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Get Docker <span class="caret"></span></a>
<ul class="dropdown-menu nav-main">
<h6 class="dropdown-header">For Desktops</h6>
<li><a href="https://docker.com/docker-mac">Mac</a></li>
<li><a href="https://docker.com/docker-windows">Windows</a></li>
<h6 class="dropdown-header">For Cloud Providers</h6>
<li><a href="https://docker.com/docker-aws">AWS</a></li>
<li><a href="https://docker.com/docker-microsoft-azure">Azure</a></li>
<h6 class="dropdown-header">For Servers</h6>
<li><a href="https://docker.com/docker-windows-server">Windows Server</a></li>
<li><a href="https://docker.com/docker-centos">CentOS</a></li>
<li><a href="https://docker.com/docker-debian">Debian</a></li>
<li><a href="https://docker.com/docker-fedora">Fedora</a></li>
<li><a href="https://docker.com/docker-oracle-linux">Oracle Enterprise Linux</a></li>
<li><a href="https://docker.com/docker-rhel">RHEL</a></li>
<li><a href="https://docker.com/docker-sles">SLES</a></li>
<li><a href="https://docker.com/docker-ubuntu">Ubuntu</a></li>
</ul>
</li>
<li><a href="https://docs.docker.com">Docs</a></li>
<li><a href="https://docker.com/docker-community">Community</a></li>
<li><a href="https://cloud.docker.com/">Create Docker ID</a></li>
<li><a href="https://cloud.docker.com/login">Sign In</a></li>
</ul>
<!-- <div class="user-nav hidden-sm">
<ul>
<li><a href="https://cloud.docker.com/">Create Docker ID</a></li>
<li><a href="https://cloud.docker.com/login">Sign In</a></li>
</ul>
</div> -->
</div>
<!--/.nav-collapse -->
</div>
</nav>
</div>
</div>
<!-- hero banner text -->
<div class="container">
<div class="container-fluid">
<div class="row">
<div class="hero-text">
<div class="hero-text-centered">
Expand All @@ -58,30 +62,36 @@ <h1>Docker Documentation</h1>
</div>
</div>
</div>
<a href="http://2017.dockercon.com/" target="_blank">
<div class="banner">
<img src="images/dockercon.svg">
</div>
</a>
</div>
<!-- nav-secondary -->
<nav class="nav-secondary-tabs" data-spy="affix" data-offset-top="490">
<div class="container-fluid">
<!-- <div class="affix-logo">
<img class="logo" src="../images/docker-docs-logo.svg" alt="Docker Docs" title="Docker Docs">
</div> -->
<div class="search-form">
<form class="search-form form-inline ng-pristine ng-valid" id="searchForm" action="/search/">
<input class="search-field form-control ds-input" id="st-search-input" value="" name="q" placeholder="Search the docs" type="search" autocomplete="off" spellcheck="false" dir="auto" style="position: relative; vertical-align: top;">
<div id="autocompleteContainer">
<div id="autocompleteResults"></div>
<div class="container-fluid-fluid">
<div class="row">
<div class="col-xs-12 col-sm-3 col-md-3 col-lg-3">
<div class="search-form">
<form class="search form-inline ng-pristine ng-valid" id="searchForm" action="/search/">
<input class="search-field form-control ds-input" id="st-search-input" value="" name="q" placeholder="Search the docs" type="search" autocomplete="off" spellcheck="false" dir="auto" style="position: relative; vertical-align: top;">
<div id="autocompletecontainer-fluid">
<div id="autocompleteResults"></div>
</div>
<!-- <button type="submit" class="search-submit btn btn-default">Search</button> -->
</form>
</div>
<!-- <button type="submit" class="search-submit btn btn-default">Search</button> -->
</form>
</div>
<div class="sidebar-toggle">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<div class="sidebar-toggle">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
</div>
</div>

<div id="tabs">
<!-- <ul class="tabs nav navbar-nav navbar-collapse collapse navbar-left"> -->
<ul class="tabs nav navbar-nav navbar-collapse navbar-left">
Expand All @@ -92,5 +102,5 @@ <h1>Docker Documentation</h1>
{% include archive-list.html %}
</div>
</div>
</nav>
</div>
</div>
</nav>
25 changes: 13 additions & 12 deletions _includes/header.html
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
<nav class="nav-secondary navbar navbar-fixed-top">
<div class="fan"></div>
<div class="container-fluid">
<!-- <div class="ctrl-left">
<!-- <div class="ctrl-left">
<a href="javascript:void(0)" id="menu-toggle-left"><i class="fa fa-outdent" aria-hidden="true"></i></a>
</div> -->
<div class="navbar-header">
Expand All @@ -18,23 +18,24 @@
<!-- <button type="submit" class="search-submit btn btn-default">Search</button> -->
</form>
</div>
<div class="sidebar-toggle">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
</div>
<div class="sidebar-toggle">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
</div>
<div>
<div id="tabs">
<ul class="tabs nav navbar-nav">
<ul class="tabs">
{% include treebuilder.html %}
</ul>
</div>
<div class="ctrl-right">
<div class="ctrl-right hidden-xs hidden-sm">
<a href="javascript:void(0)" id="menu-toggle"><i class="fa fa-indent" aria-hidden="true"></i></a>
{% include archive-list.html %}
</div>
</div>
</div>
</nav>
</nav>
4 changes: 2 additions & 2 deletions _includes/side-menu.html
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
{% if page.landing == true %}<div id="navbar" class="nav-sidebar navbar-collapse collapse affix" data-spy="affix" data-offset-top="490">{%else%}<div id="navbar" class="nav-sidebar navbar-collapse collapse">{% endif %}
<ul class="nav navbar-collapse" id="stacked-menu">
{% if page.landing == true %}<div id="navbar" class="nav-sidebar">{%else%}<div id="navbar" class="nav-sidebar">{% endif %}
<ul class="nav" affix" {% if page.landing == true %}data-spy="affix" data-offset-top="490"{% endif %}>
{{ leftnav }}
</ul>
</div>
8 changes: 4 additions & 4 deletions _layouts/docs.html
Original file line number Diff line number Diff line change
Expand Up @@ -106,7 +106,7 @@ <h1>{{ page.title }}</h1>{% endif %} {% if page.advisory %}
}
</script>
{% if page.noratings != true %}
<div style="text-align: center; margin-top: 50px">
<div style="color:#b9c2cc; text-align: center; margin-top: 150px">
<img src="/images/chat.png" alt="chat icon" style="display:inline">
<b>Feedback?</b> Suggestions? Can't find something in the docs?<br/> {% if edit_url != "" %}
<a href="{{ edit_url }}">Edit this page</a> <span>&#9679;</span> {% endif %}
Expand Down Expand Up @@ -141,7 +141,7 @@ <h1>{{ page.title }}</h1>{% endif %} {% if page.advisory %}
</div>
</nav>
<div class="col-toc">
<div id="{% if page.landing == true %}sidebar-wrapper-home{%else%}sidebar-wrapper{% endif %}" class="{% if page.landing == true %} affix-top{%else%}sidebar-wrapper toc-nav{% endif %}" {% if page.landing == true %} data-spy="affix" data-offset-top="490"{% endif %}>
<div id="{% if page.landing == true %}sidebar-right{%else%}sidebar-wrapper{% endif %}" class="{% if page.landing == true %} affix-top hidden-xs hidden-sm{%else%}sidebar-wrapper hidden-xs hidden-sm{% endif %}" {% if page.landing == true %} data-spy="affix" data-offset-top="490"{% endif %}>
<div class="toc-nav">
<div class="feedback-links">
<ul>
Expand All @@ -150,8 +150,8 @@ <h1>{{ page.title }}</h1>{% endif %} {% if page.advisory %}
<li><a href="https://github.com/docker/docker.github.io/issues/new?assignee={% if page.assignee %}{{ page.assignee }}{% else %}{{ page.defaultassignee }}{% endif %}&body=File: [{{ page.path }}](https://docs.docker.com{{ page.url }}), CC @{{ assignee }}"
class="nomunge"><i class="fa fa-check" aria-hidden="true"></i> Request docs changes</a></li>
<li><a href="https://www.docker.com/docker-support-services"><i class="fa fa-question" aria-hidden="true"></i> Get support</a></li>
<!-- day/night switch
<li>
<!-- toggle mode -->
<!-- <li>
<div class="toggle-mode">
<div class="icon">
<i class="fa fa-sun-o" aria-hidden="true"></i>
Expand Down
Loading

0 comments on commit 492074c

Please sign in to comment.