mirror of
https://github.com/docker/docs.git
synced 2026-03-27 22:38:54 +07:00
392e93a277
simplified the workflow title WIP: graphical and format updates for workflow steps on home page working on better formatting for subtopic bullets formatting updates and wording tweaks to workflow on home page wording tweak on app tutorial where to learn more Signed-off-by: Victoria Bialas <victoria.bialas@docker.com>
460 lines
9.2 KiB
CSS
460 lines
9.2 KiB
CSS
/* FIXUP allcss.css */
|
||
/* @media screen and (max-width: 1199px) */
|
||
|
||
.logo {
|
||
margin-top: 1px !important;
|
||
width: auto !important;
|
||
height: auto !important;
|
||
max-width: none !important;
|
||
}
|
||
.autocompleteSelected {
|
||
background-color: #f5f5f5;
|
||
}
|
||
.autocompleteList
|
||
{
|
||
list-style-type: none;
|
||
width: 400px;
|
||
padding:0px;
|
||
margin-bottom: 0px;
|
||
}
|
||
.autoCompleteResult {
|
||
border-bottom: 1px solid #6db9d1;
|
||
padding-bottom: 10px;
|
||
}
|
||
#autocompleteShowAll {
|
||
padding-bottom: 10px;
|
||
}
|
||
.autocompleteList li {
|
||
width: 380px;
|
||
border: 0px;
|
||
padding-right: 20px;
|
||
margin: 0px;
|
||
}
|
||
.autocompleteTitle {
|
||
/* font-weight: bold; */
|
||
padding-top: 10px !important;
|
||
}
|
||
.autocompleteUrl {
|
||
font-size: 9px;
|
||
color: green;
|
||
padding-left: 10px;
|
||
}
|
||
.autocompleteDescription {
|
||
padding-left: 10px;
|
||
font-size: 12px;
|
||
}
|
||
.autocompleteKeywords, .autocompleteBreadcrumb {
|
||
font-size: 9px;
|
||
padding-left: 10px;
|
||
}
|
||
|
||
#autocompleteContainer {
|
||
position: relative;
|
||
}
|
||
|
||
#autocompleteResults {
|
||
display: none;
|
||
position: absolute;
|
||
z-index: 1;
|
||
top: 0;
|
||
right: 0;
|
||
background: #ffffff;
|
||
background-color: #FFFFFF;
|
||
width: 400px;
|
||
border-radius: 3px;
|
||
border: 1px solid #6db9d1;
|
||
}
|
||
|
||
.dockercon16 section.title_section, header.main-header::after {
|
||
background-position: initial;
|
||
}
|
||
/* Notes */
|
||
#DocumentationText p {
|
||
margin-bottom: 1.25rem;
|
||
}
|
||
#DocumentationText strong,
|
||
#DocumentationText b {
|
||
font-weight: 500;
|
||
line-height: inherit;
|
||
}
|
||
#DocumentationText blockquote {
|
||
font-size: 16px;
|
||
border-left: 4px solid #6db9d1;
|
||
padding: 6px;
|
||
background-color: #fafafa;
|
||
color: black !important;
|
||
}
|
||
#DocumentationText blockquote li div.highlighter-rouge {
|
||
padding-left: 20px;
|
||
padding-right: 20px;
|
||
}
|
||
#DocumentationText blockquote p {
|
||
color: black !important;
|
||
margin: 0;
|
||
padding: 10px 20px;
|
||
}
|
||
/*#DocumentationText blockquote p strong {
|
||
color: #6db9d1;
|
||
}*/
|
||
#DocumentationText blockquote ol, #DocumentationText blockquote ul {
|
||
padding-left: 20px !important;
|
||
}
|
||
#DocumentationText code {
|
||
border-width: 0px !important;
|
||
background-color: #f5f5f5 !important;
|
||
}
|
||
#DocumentationText thead {
|
||
background: rgb(200, 230, 239);
|
||
}
|
||
#DocumentationText thead th {
|
||
color: black;
|
||
font-weight: normal;
|
||
font-size: 1rem;
|
||
}
|
||
#DocumentationText {
|
||
padding: 20px !important;
|
||
}
|
||
#DocumentationText h2 {
|
||
font-size: 38px;
|
||
}
|
||
#DocumentationText h1,
|
||
#DocumentationText h2,
|
||
#DocumentationText h3,
|
||
#DocumentationText h4,
|
||
#DocumentationText h5,
|
||
#DocumentationText h6 {
|
||
color: #155A74;
|
||
font-weight: normal;
|
||
}
|
||
#DocumentationText,
|
||
#TableOfContentsSection {
|
||
color: black;
|
||
}
|
||
#DocumentationText a,
|
||
#TableOfContentsSection a {
|
||
color: #008AB5;
|
||
}
|
||
/* reset away from #008AB5 */
|
||
|
||
/* removed hard-coded color for button links pre new CSS from Design */
|
||
#DocumentationText a.button {
|
||
}
|
||
|
||
#DocumentationText .darkblue-btn {
|
||
color: #ffffff;
|
||
margin-top: 15px;
|
||
}
|
||
|
||
/* hard coded color and other settings pre new CSS from Design */
|
||
#DocumentationText .secondary-btn,
|
||
button .secondary-btn {
|
||
border: 2px solid #1488c6;
|
||
color: #1488c6;
|
||
background: white;
|
||
margin-top: 15px;
|
||
font-size: 14px;
|
||
padding: 12px 30px 12px 30px;
|
||
text-decoration: none;
|
||
font-family: Open Sans, sans-serif;
|
||
font-weight: 700;
|
||
}
|
||
|
||
#DocumentationText button.secondary-btn {
|
||
background: transparent;
|
||
}
|
||
#DocumentationText .secondary-btn:hover,
|
||
button .secondary-btn:hover {
|
||
opacity: .8;
|
||
}
|
||
|
||
/* box shadow for docs home page workflow*/
|
||
|
||
#DocumentationText .boxer
|
||
{box-shadow: 2px 2px #888, -2px -2px #F4D03F, 0px 0px 5px 5px #F4D03F;
|
||
}
|
||
|
||
#DocumentationText table {
|
||
margin: 1.25rem 0;
|
||
width: 100%;
|
||
}
|
||
|
||
/* anchor links to reveal paragraph marker on hover */
|
||
|
||
a.anchorLink {
|
||
margin-left: 5px;
|
||
visibility: hidden;
|
||
}
|
||
|
||
h1:hover > a.anchorLink,
|
||
h2:hover > a.anchorLink,
|
||
h3:hover > a.anchorLink {
|
||
visibility: visible;
|
||
}
|
||
|
||
/* ========== Start sidebarnav ========== */
|
||
div.docsidebarnav_section.affix {
|
||
position: fixed;
|
||
z-index: 9999;
|
||
top: 0;
|
||
}
|
||
div.docsidebarnav_section.affix ul {
|
||
margin: 0 0 1.5rem 0;
|
||
}
|
||
.docsidebarnav_section {
|
||
left: 0;
|
||
padding: 0;
|
||
}
|
||
.docsidebarnav_section ul{
|
||
list-style: none;
|
||
padding: 0;
|
||
margin: -25px 0 1.5rem 0;
|
||
position: absolute;
|
||
left: 0;
|
||
background-color: #fff;
|
||
padding: 0;
|
||
width: 270px;
|
||
width: 100%;
|
||
text-align: left;
|
||
overflow: hidden;
|
||
}
|
||
.docsidebarnav_section ul li{
|
||
display: block;
|
||
}
|
||
.docsidebarnav_section ul li a {
|
||
color: #fff;
|
||
font-size: 13px;
|
||
font-family: 'Geomanist Regular', sans-serif;
|
||
font-weight: 400;
|
||
display: block;
|
||
width: 100%;
|
||
padding: 16px 5px 16px 20px;
|
||
line-height: 15px;
|
||
border-radius: 0;
|
||
background-color: #fff;
|
||
color: rgba(0, 0, 0, 0.7);
|
||
}
|
||
.docsidebarnav_section ul li a:hover {
|
||
background: rgba(0, 0, 0, 0.05);
|
||
}
|
||
.docsidebarnav_section ul li a,
|
||
.docsidebarnav_section ul li a:hover,
|
||
.docsidebarnav_section ul li a:focus
|
||
{
|
||
border-bottom: none;
|
||
text-decoration: none;
|
||
border-left: 2px solid rgba(188, 181, 185, 0.3);
|
||
}
|
||
.docsidebarnav_section ul li a.active {
|
||
cursor: default;
|
||
}
|
||
/* ========== End sidebarnav ========== */
|
||
.docsidebarnav_section a.expand-menu {
|
||
background-color: #fff;
|
||
}
|
||
|
||
.docsidebarnav_section a.expand-menu:hover {
|
||
background: rgba(0, 0, 0, 0.05);
|
||
}
|
||
.docsidebarnav_section a.expand-menu.active {
|
||
background-color: #fff;
|
||
}
|
||
.docsidebarnav_section .caret {float: right;
|
||
margin-right: 10px;
|
||
margin-top: 5px;}
|
||
.docsidebarnav_section.affix ul,
|
||
.docsidebarnav_section ul {position: initial;margin:initial !important;}
|
||
.nav-sub .currentPage,
|
||
.nav-sub .currentPage:hover {
|
||
color: rgb(20, 136, 198);
|
||
border-left: 2px solid rgb(20, 136, 198);
|
||
font-weight: 500;
|
||
}
|
||
.menu-closed .nav-sub {height: 0 !important;}
|
||
.menu-open .nav-sub {height: auto;}
|
||
div>.nav-sub>li {
|
||
margin: 0;
|
||
}
|
||
.docsidebarnav_section ul li a,
|
||
.nav-sub li a {padding-left: 1em;}
|
||
.nav-sub li li a {padding-left: 1.5em;}
|
||
.nav-sub li li li a {padding-left: 2em;}
|
||
.nav-sub li li li li a {padding-left: 2.5em;}
|
||
.nav-sub li li li li li a {padding-left: 3em;}
|
||
#DocumentationText pre {
|
||
margin: 20px 0 20px !important;
|
||
padding: 10px;
|
||
}
|
||
#DocumentationText li p {
|
||
margin-bottom: 0;
|
||
}
|
||
.docsidebarnav_section .menu-icon {
|
||
float: right;
|
||
color: #b7b9b5;
|
||
}
|
||
.menu-open .menu-icon:after {
|
||
content: "\e260";
|
||
margin: 0 5px;
|
||
font-family: 'Glyphicons Halflings';
|
||
}
|
||
.menu-closed .menu-icon:after {
|
||
content: "\e259";
|
||
margin: 0 5px;
|
||
font-family: 'Glyphicons Halflings';
|
||
}
|
||
.glyphicon-menu-down:before {
|
||
content: "\e259";
|
||
}
|
||
.glyphicon-menu-up:before {
|
||
content: "\e260";
|
||
}
|
||
|
||
/* TableOfContents */
|
||
.tableofcontents_section {
|
||
padding: 0;
|
||
}
|
||
.rating-msg {
|
||
display: none !important;
|
||
}
|
||
#pd_rating_holder_8453675 {
|
||
vertical-align: bottom !important;
|
||
}
|
||
#rating_info_8453675 {
|
||
display: none !important;
|
||
}
|
||
|
||
#TableOfContents {
|
||
padding-top: 10px;
|
||
}
|
||
#TableOfContentsSection {
|
||
margin: 0;
|
||
padding: 0 !important;
|
||
background-color: #f5fdff;
|
||
}
|
||
|
||
#TableOfContents li a,
|
||
#TableOfContentsSection .heading {
|
||
font-size: 14px;
|
||
font-style: normal;
|
||
margin: 0;
|
||
padding: 10px 15px;
|
||
display: block !important;
|
||
line-height: 15px;
|
||
}
|
||
#TableOfContentsSection .heading {
|
||
background-color: #6db9d1;
|
||
color: #ffffff;
|
||
}
|
||
#TableOfContentsSection #TableOfContents {
|
||
background-color: #F5FDFF;
|
||
margin: 0;
|
||
padding: 15px;
|
||
}
|
||
#TableOfContentsSection #TableOfContents ul {
|
||
list-style: none;
|
||
padding: 0;
|
||
left: 0;
|
||
padding: 0;
|
||
width: 100%;
|
||
text-align: left;
|
||
overflow: hidden;
|
||
margin-left: 0;
|
||
padding-left: 0.30rem;
|
||
font-size: 14px;
|
||
}
|
||
|
||
#TableOfContentsSection #TableOfContents > ul {
|
||
padding-left: 0;
|
||
list-style: none;
|
||
}
|
||
|
||
#TableOfContentsSection #TableOfContents > ul > li > ul {
|
||
padding-left: 0;
|
||
}
|
||
|
||
.advisory {
|
||
color: #F04124;
|
||
margin: -20px -20px 20px -20px;
|
||
padding: 20px;
|
||
border-left: 4px solid;
|
||
}
|
||
|
||
/* search form */
|
||
.form-control:focus {
|
||
outline: 0;
|
||
-webkit-box-shadow: none;
|
||
box-shadow: none;
|
||
}
|
||
.search-banner {
|
||
width: 100%;
|
||
align: center;
|
||
}
|
||
.search-form .algolia-autocomplete {
|
||
width: 100%;
|
||
padding-right: 54px;
|
||
}
|
||
.search-form .algolia-autocomplete .search-field, #st-search-input {
|
||
width: 100%;
|
||
border: 1px solid lightgray;
|
||
}
|
||
.search-form{
|
||
max-width: 420px;
|
||
width: 100%;
|
||
margin: auto;
|
||
display: block;
|
||
position: relative;
|
||
padding: 0;
|
||
margin-bottom: 0px;
|
||
}
|
||
.search-form .search-field {
|
||
NOwidth: 280px;
|
||
NOmargin: auto;
|
||
height: 54px;
|
||
margin: 0px;
|
||
background-color: #fff;
|
||
border: none;
|
||
/* text-indent: 80px; */
|
||
transition: opacity 400ms;
|
||
color: #9098a2;
|
||
font-size: 14px;
|
||
padding: 10px;
|
||
border-radius: 0;
|
||
}
|
||
.search-form .search-submit {
|
||
width: 54px;
|
||
height: 54px;
|
||
position: absolute;
|
||
top: 0px;
|
||
/* left: .8rem; */
|
||
right: 0px;
|
||
border: 0;
|
||
text-indent: -9999px;
|
||
background-color: transparent;
|
||
background-image: url("/images/search-icon.png");
|
||
/* background-size: 38px 38px; */
|
||
background-repeat: no-repeat;
|
||
background-position: center center;
|
||
/* border-right: 1px solid #e1e1e1; */
|
||
outline: none;
|
||
border-radius: 0;
|
||
}
|
||
|
||
/* end search */
|
||
|
||
/* begin reading_time */
|
||
|
||
span.reading-time {
|
||
font-style: italic;
|
||
font-size: 80%;
|
||
display: block;
|
||
padding-top: 10px;
|
||
padding-bottom: 10px;
|
||
color: #999;
|
||
}
|
||
|
||
span.reading-time-label {
|
||
}
|
||
|
||
img.with-border {
|
||
border: 1px solid #eaeaea;
|
||
}
|