mirror of https://github.com/docker/docs.git
_scss: remove unused styles, and combine some
Signed-off-by: Sebastiaan van Stijn <github@gone.nl>
This commit is contained in:
Sebastiaan van Stijn
parent
034c23319b
commit
e3e280c54a
|
|
@ -38,7 +38,7 @@ a.button.outline-btn.min-hgt {
|
|||
border: 1px solid rgba(0, 0, 0, 0.1);
|
||||
text-shadow: 0 1px rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
|
||||
/*
|
||||
.secondary-btn {
|
||||
background-color: rgba(255, 255, 255, 0.2);
|
||||
box-shadow: 0 1px 0 0 rgba(0, 0, 0, 0.1);
|
||||
|
|
@ -52,20 +52,20 @@ a.button.outline-btn.min-hgt {
|
|||
border: 1px solid rgba(0, 0, 0, 0.1);
|
||||
text-shadow: 0 1px rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
*/
|
||||
|
||||
.outline-btn {
|
||||
background: #fff;
|
||||
border: 1px solid #0087C8;
|
||||
text-decoration: none;
|
||||
margin: 0;
|
||||
&:hover {
|
||||
color: #1488C6;
|
||||
}
|
||||
}
|
||||
|
||||
.outline-btn:hover,
|
||||
//.secondary-btn:hover,
|
||||
.primary-btn:hover,
|
||||
.secondary-btn:hover {
|
||||
.outline-btn:hover {
|
||||
opacity: 0.8;
|
||||
}
|
||||
|
||||
.outline-btn:hover {
|
||||
color: #1488C6;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -63,53 +63,18 @@ code {
|
|||
float: left;
|
||||
height: 250px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.component-full {
|
||||
padding: 5px 0 10px 20px;
|
||||
float: left;
|
||||
min-height: 100px;
|
||||
margin: 0 0 15px 0;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.component,
|
||||
.component-full {
|
||||
background: $bg-component;
|
||||
}
|
||||
|
||||
.component-full-icon {
|
||||
float: left;
|
||||
padding: 5px 15px 0 7px;
|
||||
}
|
||||
|
||||
.component-full p {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.component-full h3 {
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.component img,
|
||||
.component-full-icon img {
|
||||
width: 70px;
|
||||
height: 70px;
|
||||
}
|
||||
|
||||
.component-icon {
|
||||
margin: 0 auto;
|
||||
width: 70px;
|
||||
}
|
||||
|
||||
.component-full-copy {
|
||||
float: left;
|
||||
width: 80%;
|
||||
}
|
||||
|
||||
.component h3,
|
||||
.component p {
|
||||
margin: 0;
|
||||
img {
|
||||
width: 70px;
|
||||
height: 70px;
|
||||
}
|
||||
.component-icon {
|
||||
margin: 0 auto;
|
||||
width: 70px;
|
||||
}
|
||||
h3, p {
|
||||
margin: 0;
|
||||
}
|
||||
}
|
||||
|
||||
a.anchorLink {
|
||||
|
|
|
|||
|
|
@ -1,53 +0,0 @@
|
|||
/*
|
||||
* hero banner text *************************************************************
|
||||
*/
|
||||
|
||||
.hero-text {
|
||||
align-items: center;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
-webkit-box-align: center;
|
||||
-webkit-align-items: center;
|
||||
min-height: 20em;
|
||||
min-width: 400px;
|
||||
-ms-flex-align: center;
|
||||
-ms-flex-pack: center;
|
||||
justify-content: center;
|
||||
& h1 {
|
||||
color: $white;
|
||||
}
|
||||
& ul {
|
||||
padding: 0;
|
||||
li {
|
||||
padding: 0 10px 0 0;
|
||||
}
|
||||
}
|
||||
p {
|
||||
color: $white;
|
||||
margin-bottom: 15px;
|
||||
font-size: 18px;
|
||||
font-family: "Open Sans", sans-serif;
|
||||
}
|
||||
}
|
||||
|
||||
.hero-text-centered {
|
||||
-ms-flex: none;
|
||||
flex: none;
|
||||
text-align: center;
|
||||
max-width: 70%;
|
||||
}
|
||||
|
||||
|
||||
/* dockercon banner */
|
||||
|
||||
.banner {
|
||||
width: 270px;
|
||||
height: auto;
|
||||
position: absolute;
|
||||
bottom: 55px;
|
||||
right: 0;
|
||||
z-index: 1;
|
||||
img {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
|
@ -40,9 +40,7 @@
|
|||
height: unset;
|
||||
}
|
||||
|
||||
.columns,
|
||||
.col-body {
|
||||
display: flex;
|
||||
.columns {
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
|
|
@ -51,6 +49,7 @@
|
|||
}
|
||||
|
||||
.col-body {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
flex: 1;
|
||||
min-height: 555px;
|
||||
|
|
@ -77,16 +76,12 @@
|
|||
}
|
||||
|
||||
.content {
|
||||
padding: 80px 70px 20px 70px;
|
||||
padding: 80px 20px 40px 40px;
|
||||
max-width: 1024px;
|
||||
min-width: 300px;
|
||||
min-height: 500px;
|
||||
}
|
||||
|
||||
.main-content {
|
||||
padding: 0 35px 25px 30px;
|
||||
}
|
||||
|
||||
section.section {
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -6,13 +6,10 @@
|
|||
and (min-width : 376px)
|
||||
and (max-width : 1150px) {
|
||||
.nav-primary,
|
||||
.hero-text,
|
||||
.banner,
|
||||
ul.primary.nav.navbar-nav {
|
||||
display: none;
|
||||
}
|
||||
.header,
|
||||
.nav-secondary-tabs {
|
||||
.header {
|
||||
height: 55px;
|
||||
}
|
||||
.tabs li a {
|
||||
|
|
@ -38,7 +35,7 @@
|
|||
h4 {
|
||||
font-size: 16px;
|
||||
}
|
||||
.nav-secondary-tabs .search-form input[type=search] {
|
||||
.nav-secondary .search-form input[type=search] {
|
||||
min-width: auto;
|
||||
}
|
||||
.nav-container,
|
||||
|
|
@ -61,9 +58,6 @@
|
|||
z-index: 100;
|
||||
background-color: $bg-sidebar;
|
||||
}
|
||||
.main-content {
|
||||
padding: 22px 35px 25px 30px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
|
@ -76,8 +70,6 @@
|
|||
and (min-device-width: 320px)
|
||||
and (max-device-width: 670px) {
|
||||
.logo,
|
||||
.hero-text,
|
||||
.banner,
|
||||
.ctrl-right {
|
||||
display: none;///// CHECK THIS /////
|
||||
}
|
||||
|
|
@ -129,11 +121,7 @@
|
|||
.content {
|
||||
padding: 65px 25px;
|
||||
}
|
||||
.main-content {
|
||||
padding: 10px 25px;
|
||||
}
|
||||
.sidebar,
|
||||
.sidebar-home {
|
||||
.sidebar {
|
||||
background-color: $bg-sidebar;
|
||||
top: 51px;
|
||||
left: 0;
|
||||
|
|
@ -144,23 +132,9 @@
|
|||
position: fixed;
|
||||
width: 100%;
|
||||
}
|
||||
.sidebar-home,
|
||||
.sidebar-home .affix {
|
||||
background: #192837;
|
||||
width: 100%;
|
||||
}
|
||||
.search-form {
|
||||
display: block!important;
|
||||
}
|
||||
.component-full {
|
||||
text-align: center;
|
||||
}
|
||||
.component-full-copy {
|
||||
width: 100%;
|
||||
}
|
||||
.component-full-icon {
|
||||
float: none;
|
||||
}
|
||||
.top_footer {
|
||||
padding: 50px 0 35px;
|
||||
text-align: center;
|
||||
|
|
@ -171,12 +145,6 @@
|
|||
and (min-device-width: 320px)
|
||||
and (max-device-width: 372px)
|
||||
and (orientation: portrait) {
|
||||
.nav-secondary-tabs {
|
||||
> .container-fluid {
|
||||
padding-left: 5px;
|
||||
padding-right: 5px;
|
||||
}
|
||||
}
|
||||
.tabs {
|
||||
display: -webkit-box;
|
||||
display: -moz-box;
|
||||
|
|
@ -218,18 +186,13 @@
|
|||
h4 {
|
||||
font-size: 16px;
|
||||
}
|
||||
.header,
|
||||
.nav-secondary-tabs {
|
||||
.header {
|
||||
height: 100px;
|
||||
}
|
||||
.content {
|
||||
padding: 120px 20px;
|
||||
}
|
||||
.main-content {
|
||||
padding: 0 10px;
|
||||
}
|
||||
.sidebar,
|
||||
.sidebar-home {
|
||||
.sidebar {
|
||||
background-color: $bg-sidebar;
|
||||
top: 51px;
|
||||
left: 0;
|
||||
|
|
@ -240,15 +203,6 @@
|
|||
position: fixed;
|
||||
width: 100%;
|
||||
}
|
||||
.component-full {
|
||||
text-align: center;
|
||||
}
|
||||
.component-full-copy {
|
||||
width: 100%;
|
||||
}
|
||||
.component-full-icon {
|
||||
float: none;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
|
@ -321,10 +275,3 @@
|
|||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 1024px) {
|
||||
.nav-secondary-tabs.affix-top {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -5,47 +5,12 @@
|
|||
height: 55px;
|
||||
}
|
||||
|
||||
.primary {
|
||||
padding: 5px 0 0 20px;
|
||||
}
|
||||
|
||||
.nav-primary {
|
||||
background: transparent;
|
||||
max-width: 1024px;
|
||||
margin: 0 auto;
|
||||
a {
|
||||
color: #fff;
|
||||
}
|
||||
li:nth-child(5n) {
|
||||
padding-right: 50px;
|
||||
}
|
||||
}
|
||||
|
||||
.sidebar-toggle {
|
||||
margin: 4px 0 0 0;
|
||||
float: right;
|
||||
padding: 16px 15px 0 0;
|
||||
}
|
||||
|
||||
/*
|
||||
* user-nav ********************************************************************
|
||||
*/
|
||||
|
||||
.user-nav {
|
||||
padding: 20px 0 0;
|
||||
float: right;
|
||||
ul {
|
||||
li {
|
||||
list-style-type: none;
|
||||
display: inline;
|
||||
padding-right: 10px;
|
||||
a {
|
||||
display: inline;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
* Secondary Navigation *******************************************************
|
||||
*/
|
||||
|
|
@ -57,29 +22,6 @@
|
|||
}
|
||||
|
||||
|
||||
/*
|
||||
* nav-secondary-tabs *********************************************************
|
||||
*/
|
||||
|
||||
.nav-secondary-tabs {
|
||||
background-color: $bg-secondary-tabs;
|
||||
bottom: 0;
|
||||
height: 55px;
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
&.affix {
|
||||
background-color: $bg-secondary;
|
||||
box-shadow: 0 1px 13px rgba(0, 0, 0, 0.24);
|
||||
top: 0;
|
||||
position: fixed;
|
||||
z-index: 100;
|
||||
}
|
||||
.search-form {
|
||||
margin: 5px 27px 0 -10px;
|
||||
width: 240px;
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
* NAV SIDEBAR *****************************************************************
|
||||
*/
|
||||
|
|
@ -151,10 +93,6 @@
|
|||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.leftnav {
|
||||
padding: 0 20px 20px 0;
|
||||
}
|
||||
|
||||
/* pointer for collapsed sidebar list items */
|
||||
|
||||
.collapsed
|
||||
|
|
@ -201,11 +139,6 @@
|
|||
color: $primary-links;
|
||||
}
|
||||
|
||||
i.fa.fa-question {
|
||||
font-size: 21px;
|
||||
margin: 0 11px 0 0;
|
||||
}
|
||||
|
||||
div#side-toc-title {
|
||||
font-size: 12px;
|
||||
font-weight: bold;
|
||||
|
|
@ -329,8 +262,8 @@ input:checked+.slider:before {
|
|||
* feedback links **************************************************************
|
||||
*/
|
||||
|
||||
#sidebar-right.affix .feedback-links {
|
||||
margin: 50px 0 10px 0;
|
||||
.feedback-links {
|
||||
margin: 0 0 10px 0;
|
||||
}
|
||||
|
||||
/* polldaddy */
|
||||
|
|
|
|||
|
|
@ -6,19 +6,14 @@ body.night {
|
|||
ul,
|
||||
.rating-nero-value,
|
||||
.reading-time {
|
||||
color: $body-text-night!important;
|
||||
color: $body-text-night !important;
|
||||
}
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6,
|
||||
.component h3 {
|
||||
color: $white!important;
|
||||
|
||||
h1,h2,h3,h4,h5,h6,
|
||||
div#side-toc-title {
|
||||
color: $white;
|
||||
}
|
||||
a,
|
||||
.toc-nav i.fa {
|
||||
a {
|
||||
color: $primary-links-night;
|
||||
}
|
||||
.header {
|
||||
|
|
@ -27,54 +22,32 @@ body.night {
|
|||
hr {
|
||||
border-top: 1px solid #4f6071;
|
||||
}
|
||||
.hero-text h1,
|
||||
div#side-toc-title {
|
||||
color: $white;
|
||||
}
|
||||
.nav-secondary {
|
||||
background: $bg-secondary-night;
|
||||
}
|
||||
.nav-secondary input[type=search] {
|
||||
background: rgba(76, 76, 76, 0.47) url(/images/search.png) no-repeat 10px 9px;
|
||||
color: $white;
|
||||
}
|
||||
.nav-secondary-tabs .search-form input[type=search] {
|
||||
background: rgba(16, 28, 41, 0.6) url(/images/search.png) no-repeat 10px 9px;
|
||||
}
|
||||
.nav-secondary-tabs .search-form input[type=search]:focus {
|
||||
background: rgba(255, 255, 255, 0.17) url(/images/search.png) no-repeat 10px 9px;
|
||||
}
|
||||
.nav-secondary .search-form input[type=search]:focus {
|
||||
background: rgba(255, 255, 255, 0.17) url(/images/search.png) no-repeat 10px 9px !important;
|
||||
background-color: $bg-secondary-night;
|
||||
|
||||
.search-form input[type=search] {
|
||||
background-color: rgba(76, 76, 76, 0.47);
|
||||
color: $white;
|
||||
|
||||
& :focus {
|
||||
background-color: rgba(255, 255, 255, 0.17);
|
||||
}
|
||||
}
|
||||
}
|
||||
.sidebar,
|
||||
.sidebar-home,
|
||||
#sidebar-wrapper,
|
||||
#sidebar-wrapper-home,
|
||||
.sidebar-home .affix,
|
||||
#sidebar-right,
|
||||
#sidebar-right.affix,
|
||||
.col-nav {
|
||||
background-color: $bg-sidebar-night;
|
||||
border: none;
|
||||
}
|
||||
.nav-secondary-tabs {
|
||||
background-color: rgba(15, 28, 42, 0.35);
|
||||
border-top: 1px solid rgba(68, 77, 87, 0.38);
|
||||
border-bottom: 1px solid #29343f;
|
||||
}
|
||||
.nav-secondary-tabs.affix {
|
||||
background: $bg-secondary-night;
|
||||
}
|
||||
.nav-sidebar ul li a.active,
|
||||
.nav-sidebar.nav>li>a:focus,
|
||||
.toc-nav li a.active {
|
||||
color: $active-sidebar-night;
|
||||
background: #0a151a;
|
||||
border-left: 4px solid $primary-links//add to variables
|
||||
border-left: 4px solid $primary-links;
|
||||
}
|
||||
.tabs li.active a {
|
||||
border-bottom: 4px solid $primary-links;//add to variables
|
||||
border-bottom: 4px solid $primary-links;
|
||||
}
|
||||
.slider {
|
||||
background-color: #344658;
|
||||
|
|
@ -113,13 +86,8 @@ body.night {
|
|||
color: #a7e2ff;
|
||||
}
|
||||
a.glossary,
|
||||
.toc-nav i.fa{
|
||||
color: $body-text-night;
|
||||
}
|
||||
.component img, .component-full-icon img {
|
||||
opacity: 1;
|
||||
-webkit-filter: grayscale(100%);
|
||||
filter: grayscale(100%);
|
||||
.toc-nav i.fa {
|
||||
color: $body-text-night;
|
||||
}
|
||||
div#autocompleteResults {
|
||||
background: $bg-search-results-night;
|
||||
|
|
@ -133,9 +101,6 @@ body.night {
|
|||
color: #b7a4de;
|
||||
}
|
||||
|
||||
span.reading-time {
|
||||
color: #bfabe5;
|
||||
}
|
||||
/* for google results styles - forgive us css gods */
|
||||
.gsc-control-cse .gsc-webResult.gsc-result, .gsc-results .gsc-imageResult {
|
||||
border-color: #192837!important;
|
||||
|
|
@ -156,10 +121,11 @@ body.night {
|
|||
color: #a9e4ff!important;
|
||||
}
|
||||
.component {
|
||||
background: #101c29;
|
||||
}
|
||||
.component-full {
|
||||
background: #101c29;
|
||||
background: $bg-component-night;
|
||||
img {
|
||||
opacity: 1;
|
||||
filter: grayscale(100%);
|
||||
}
|
||||
}
|
||||
.transparent-btn {
|
||||
background-color: rgb(0, 135, 200);
|
||||
|
|
@ -198,16 +164,6 @@ body.night {
|
|||
}
|
||||
}
|
||||
|
||||
/* Primary Global Menu Overrides */
|
||||
.dropdown-menu{
|
||||
background: $black;
|
||||
}
|
||||
.dropdown-menu>li>a {
|
||||
color: #d0e8ff!important;
|
||||
}
|
||||
h6.dropdown-header {
|
||||
color: $white;
|
||||
}
|
||||
/* apply to images with garbled text */
|
||||
img.white-bg {
|
||||
background-color: white;
|
||||
|
|
|
|||
|
|
@ -2,35 +2,12 @@
|
|||
* Bootstrap Overrides *********************************************************
|
||||
*/
|
||||
|
||||
.nav-secondary-tabs .dropdown-btn {
|
||||
background: transparent;
|
||||
color: #fff;
|
||||
padding: 5px 11px 0 0;
|
||||
margin-top: 7px;
|
||||
border: 0;
|
||||
font-size: 12px;
|
||||
font-weight: 600;
|
||||
}
|
||||
.nav-secondary .dropdown-btn {
|
||||
background: transparent;
|
||||
color: #b4d4e4;
|
||||
padding: 5px 11px 0 0;
|
||||
margin-top: 7px;
|
||||
border: 0;
|
||||
font-size: 12px;
|
||||
font-weight: 600;
|
||||
}
|
||||
.navbar-toggle {
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
@media (max-width: 767px) {
|
||||
.navbar-nav .open .dropdown-menu .dropdown-header,
|
||||
.navbar-nav .open .dropdown-menu>li>a {
|
||||
padding: 5px 15px 5px 25px;
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
.icon-bar {
|
||||
background-color: #fff !important;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -39,10 +16,6 @@
|
|||
border-color: transparent;
|
||||
}
|
||||
|
||||
.navbar-toggle .icon-bar {
|
||||
background-color: #fff !important;
|
||||
}
|
||||
|
||||
.nav>li>a:focus,
|
||||
.nav>li>a:hover {
|
||||
background-color: transparent;
|
||||
|
|
|
|||
|
|
@ -96,7 +96,6 @@ img.inline {
|
|||
}
|
||||
}
|
||||
|
||||
.nav-secondary-tabs .search-form input[type=search],
|
||||
.nav-secondary input[type=search]
|
||||
{
|
||||
background: rgba(0, 0, 0, 0.17) url("/images/search.png") no-repeat 10px 9px;
|
||||
|
|
@ -109,28 +108,13 @@ img.inline {
|
|||
width: 100%;
|
||||
}
|
||||
|
||||
.nav-secondary-tabs .search-form input[type=search] {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.search-form input[type=text]:focus {
|
||||
background: #fff;
|
||||
box-shadow: 0;
|
||||
}
|
||||
|
||||
input[type=text],
|
||||
.nav-secondary-tabs.affix input[type=text] {
|
||||
background: #10628e;
|
||||
border: 0;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.nav-secondary-tabs .search-form input[type=search]:focus {
|
||||
background: rgba(255, 255, 255, 0.17) url(/images/search.png) no-repeat 10px 9px;
|
||||
}
|
||||
|
||||
.nav-secondary-tabs.affix input[type=search],
|
||||
input[type=text] {
|
||||
margin: 0;
|
||||
background: rgba(0, 0, 0, 0.17) url(/images/search.png) no-repeat 10px 9px;
|
||||
border: 1px solid transparent;
|
||||
box-shadow: none;
|
||||
|
|
@ -230,28 +214,3 @@ div#autocompleteResults span {
|
|||
display: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
.alert-info {
|
||||
border: 0 #bce8f1;
|
||||
border-radius: 0;
|
||||
background-color: #3F51B5!important;
|
||||
text-align: center;
|
||||
color: #fff;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.alert-info ul {
|
||||
list-style-type: none;
|
||||
}
|
||||
|
||||
.close {
|
||||
float: right;
|
||||
font-size: 21px;
|
||||
font-weight: 700;
|
||||
line-height: 1;
|
||||
color: #fffdfd;
|
||||
text-shadow: 0 1px 0 #fff;
|
||||
filter: alpha(opacity=20);
|
||||
opacity: .2;
|
||||
margin: 10px 15px 0 0;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -46,6 +46,8 @@ $bg-secondary-night: #101c29;
|
|||
$bg-sidebar-night: #101e26;
|
||||
$bg-footer-night: #000000;
|
||||
|
||||
$bg-component-night: #101c29;
|
||||
|
||||
$active-sidebar-night: #9cd7f7;
|
||||
|
||||
$bg-search-results-night: rgba(10, 10, 10, 0.95);
|
||||
|
|
|
|||
|
|
@ -9,7 +9,6 @@
|
|||
@import "typography";
|
||||
@import "landing";
|
||||
@import "layout";
|
||||
@import "global-header";
|
||||
@import "navigation";
|
||||
@import "buttons";
|
||||
@import "content";
|
||||
|
|
|
|||
Loading…
Reference in New Issue