docker
/
docs
mirror of https://github.com/docker/docs.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

_scss: remove unused styles, and combine some 

Signed-off-by: Sebastiaan van Stijn <github@gone.nl>
This commit is contained in:
Sebastiaan van Stijn 2020-10-11 16:39:35 +02:00
parent 034c23319b
commit e3e280c54a
No known key found for this signature in database
GPG Key ID: 76698F39D527CE8C
11 changed files with 58 additions and 382 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
_scss/_buttons.scss
View File

@ -38,7 +38,7 @@ a.button.outline-btn.min-hgt {
border: 1px solid rgba(0, 0, 0, 0.1); border: 1px solid rgba(0, 0, 0, 0.1);
text-shadow: 0 1px rgba(0, 0, 0, 0.2); text-shadow: 0 1px rgba(0, 0, 0, 0.2);
} }
/*
.secondary-btn { .secondary-btn {
background-color: rgba(255, 255, 255, 0.2); background-color: rgba(255, 255, 255, 0.2);
box-shadow: 0 1px 0 0 rgba(0, 0, 0, 0.1); 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); border: 1px solid rgba(0, 0, 0, 0.1);
text-shadow: 0 1px rgba(0, 0, 0, 0.2); text-shadow: 0 1px rgba(0, 0, 0, 0.2);
} }
*/
.outline-btn { .outline-btn {
background: #fff; background: #fff;
border: 1px solid #0087C8; border: 1px solid #0087C8;
text-decoration: none; text-decoration: none;
margin: 0; margin: 0;
&:hover {
color: #1488C6;
}
} }
.outline-btn:hover, //.secondary-btn:hover,
.primary-btn:hover, .primary-btn:hover,
.secondary-btn:hover { .outline-btn:hover {
opacity: 0.8; opacity: 0.8;
} }
.outline-btn:hover {
color: #1488C6;
}

57
_scss/_content.scss
View File

@ -63,53 +63,18 @@ code {
float: left; float: left;
height: 250px; height: 250px;
width: 100%; 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; background: $bg-component;
} img {
width: 70px;
.component-full-icon { height: 70px;
float: left; }
padding: 5px 15px 0 7px; .component-icon {
} margin: 0 auto;
width: 70px;
.component-full p { }
margin: 0; h3, 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;
} }
a.anchorLink { a.anchorLink {

53
_scss/_global-header.scss
View File

@ -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%;
}
}

11
_scss/_layout.scss
View File

@ -40,9 +40,7 @@
height: unset; height: unset;
} }
.columns, .columns {
.col-body {
display: flex;
flex-direction: column; flex-direction: column;
} }
@ -51,6 +49,7 @@
} }
.col-body { .col-body {
display: flex;
flex-direction: row; flex-direction: row;
flex: 1; flex: 1;
min-height: 555px; min-height: 555px;
@ -77,16 +76,12 @@
} }
.content { .content {
padding: 80px 70px 20px 70px; padding: 80px 20px 40px 40px;
max-width: 1024px; max-width: 1024px;
min-width: 300px; min-width: 300px;
min-height: 500px; min-height: 500px;
} }
.main-content {
padding: 0 35px 25px 30px;
}
section.section { section.section {
margin: 0 auto; margin: 0 auto;
} }

63
_scss/_mobile.scss
View File

@ -6,13 +6,10 @@
and (min-width : 376px) and (min-width : 376px)
and (max-width : 1150px) { and (max-width : 1150px) {
.nav-primary, .nav-primary,
.hero-text,
.banner,
ul.primary.nav.navbar-nav { ul.primary.nav.navbar-nav {
display: none; display: none;
} }
.header, .header {
.nav-secondary-tabs {
height: 55px; height: 55px;
} }
.tabs li a { .tabs li a {
@ -38,7 +35,7 @@
h4 { h4 {
font-size: 16px; font-size: 16px;
} }
.nav-secondary-tabs .search-form input[type=search] { .nav-secondary .search-form input[type=search] {
min-width: auto; min-width: auto;
} }
.nav-container, .nav-container,
@ -61,9 +58,6 @@
z-index: 100; z-index: 100;
background-color: $bg-sidebar; background-color: $bg-sidebar;
} }
.main-content {
padding: 22px 35px 25px 30px;
}
} }
@ -76,8 +70,6 @@
and (min-device-width: 320px) and (min-device-width: 320px)
and (max-device-width: 670px) { and (max-device-width: 670px) {
.logo, .logo,
.hero-text,
.banner,
.ctrl-right { .ctrl-right {
display: none;///// CHECK THIS ///// display: none;///// CHECK THIS /////
} }
@ -129,11 +121,7 @@
.content { .content {
padding: 65px 25px; padding: 65px 25px;
} }
.main-content { .sidebar {
padding: 10px 25px;
}
.sidebar,
.sidebar-home {
background-color: $bg-sidebar; background-color: $bg-sidebar;
top: 51px; top: 51px;
left: 0; left: 0;
@ -144,23 +132,9 @@
position: fixed; position: fixed;
width: 100%; width: 100%;
} }
.sidebar-home,
.sidebar-home .affix {
background: #192837;
width: 100%;
}
.search-form { .search-form {
display: block!important; display: block!important;
} }
.component-full {
text-align: center;
}
.component-full-copy {
width: 100%;
}
.component-full-icon {
float: none;
}
.top_footer { .top_footer {
padding: 50px 0 35px; padding: 50px 0 35px;
text-align: center; text-align: center;
@ -171,12 +145,6 @@
and (min-device-width: 320px) and (min-device-width: 320px)
and (max-device-width: 372px) and (max-device-width: 372px)
and (orientation: portrait) { and (orientation: portrait) {
.nav-secondary-tabs {
> .container-fluid {
padding-left: 5px;
padding-right: 5px;
}
}
.tabs { .tabs {
display: -webkit-box; display: -webkit-box;
display: -moz-box; display: -moz-box;
@ -218,18 +186,13 @@
h4 { h4 {
font-size: 16px; font-size: 16px;
} }
.header, .header {
.nav-secondary-tabs {
height: 100px; height: 100px;
} }
.content { .content {
padding: 120px 20px; padding: 120px 20px;
} }
.main-content { .sidebar {
padding: 0 10px;
}
.sidebar,
.sidebar-home {
background-color: $bg-sidebar; background-color: $bg-sidebar;
top: 51px; top: 51px;
left: 0; left: 0;
@ -240,15 +203,6 @@
position: fixed; position: fixed;
width: 100%; width: 100%;
} }
.component-full {
text-align: center;
}
.component-full-copy {
width: 100%;
}
.component-full-icon {
float: none;
}
} }
@ -321,10 +275,3 @@
display: block; display: block;
} }
} }
@media (max-width: 1024px) {
.nav-secondary-tabs.affix-top {
position: fixed;
top: 0;
}
}

71
_scss/_navigation.scss
View File

@ -5,47 +5,12 @@
height: 55px; 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 { .sidebar-toggle {
margin: 4px 0 0 0; margin: 4px 0 0 0;
float: right; float: right;
padding: 16px 15px 0 0; 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 ******************************************************* * 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 ***************************************************************** * NAV SIDEBAR *****************************************************************
*/ */
@ -151,10 +93,6 @@
margin-top: 10px; margin-top: 10px;
} }
.leftnav {
padding: 0 20px 20px 0;
}
/* pointer for collapsed sidebar list items */ /* pointer for collapsed sidebar list items */
.collapsed .collapsed
@ -201,11 +139,6 @@
color: $primary-links; color: $primary-links;
} }
i.fa.fa-question {
font-size: 21px;
margin: 0 11px 0 0;
}
div#side-toc-title { div#side-toc-title {
font-size: 12px; font-size: 12px;
font-weight: bold; font-weight: bold;
@ -329,8 +262,8 @@ input:checked+.slider:before {
* feedback links ************************************************************** * feedback links **************************************************************
*/ */
#sidebar-right.affix .feedback-links { .feedback-links {
margin: 50px 0 10px 0; margin: 0 0 10px 0;
} }
/* polldaddy */ /* polldaddy */

94
_scss/_night-mode.scss
View File

@ -6,19 +6,14 @@ body.night {
ul, ul,
.rating-nero-value, .rating-nero-value,
.reading-time { .reading-time {
color: $body-text-night!important; color: $body-text-night !important;
} }
h1,
h2, h1,h2,h3,h4,h5,h6,
h3, div#side-toc-title {
h4, color: $white;
h5,
h6,
.component h3 {
color: $white!important;
} }
a, a {
.toc-nav i.fa {
color: $primary-links-night; color: $primary-links-night;
} }
.header { .header {
@ -27,54 +22,32 @@ body.night {
hr { hr {
border-top: 1px solid #4f6071; border-top: 1px solid #4f6071;
} }
.hero-text h1,
div#side-toc-title {
color: $white;
}
.nav-secondary { .nav-secondary {
background: $bg-secondary-night; background-color: $bg-secondary-night;
}
.nav-secondary input[type=search] { .search-form input[type=search] {
background: rgba(76, 76, 76, 0.47) url(/images/search.png) no-repeat 10px 9px; background-color: rgba(76, 76, 76, 0.47);
color: $white; color: $white;
}
.nav-secondary-tabs .search-form input[type=search] { & :focus {
background: rgba(16, 28, 41, 0.6) url(/images/search.png) no-repeat 10px 9px; background-color: rgba(255, 255, 255, 0.17);
} }
.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;
} }
.sidebar, .sidebar,
.sidebar-home,
#sidebar-wrapper,
#sidebar-wrapper-home,
.sidebar-home .affix,
#sidebar-right,
#sidebar-right.affix,
.col-nav { .col-nav {
background-color: $bg-sidebar-night; background-color: $bg-sidebar-night;
border: none; 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 ul li a.active,
.nav-sidebar.nav>li>a:focus, .nav-sidebar.nav>li>a:focus,
.toc-nav li a.active { .toc-nav li a.active {
color: $active-sidebar-night; color: $active-sidebar-night;
background: #0a151a; background: #0a151a;
border-left: 4px solid $primary-links//add to variables border-left: 4px solid $primary-links;
} }
.tabs li.active a { .tabs li.active a {
border-bottom: 4px solid $primary-links;//add to variables border-bottom: 4px solid $primary-links;
} }
.slider { .slider {
background-color: #344658; background-color: #344658;
@ -113,13 +86,8 @@ body.night {
color: #a7e2ff; color: #a7e2ff;
} }
a.glossary, a.glossary,
.toc-nav i.fa{ .toc-nav i.fa {
color: $body-text-night; color: $body-text-night;
}
.component img, .component-full-icon img {
opacity: 1;
-webkit-filter: grayscale(100%);
filter: grayscale(100%);
} }
div#autocompleteResults { div#autocompleteResults {
background: $bg-search-results-night; background: $bg-search-results-night;
@ -133,9 +101,6 @@ body.night {
color: #b7a4de; color: #b7a4de;
} }
span.reading-time {
color: #bfabe5;
}
/* for google results styles - forgive us css gods */ /* for google results styles - forgive us css gods */
.gsc-control-cse .gsc-webResult.gsc-result, .gsc-results .gsc-imageResult { .gsc-control-cse .gsc-webResult.gsc-result, .gsc-results .gsc-imageResult {
border-color: #192837!important; border-color: #192837!important;
@ -156,10 +121,11 @@ body.night {
color: #a9e4ff!important; color: #a9e4ff!important;
} }
.component { .component {
background: #101c29; background: $bg-component-night;
} img {
.component-full { opacity: 1;
background: #101c29; filter: grayscale(100%);
}
} }
.transparent-btn { .transparent-btn {
background-color: rgb(0, 135, 200); 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 */ /* apply to images with garbled text */
img.white-bg { img.white-bg {
background-color: white; background-color: white;

31
_scss/_overrides.scss
View File

@ -2,35 +2,12 @@
* Bootstrap Overrides ********************************************************* * 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 { .navbar-toggle {
padding: 0; padding: 0;
margin: 0; margin: 0;
}
@media (max-width: 767px) { .icon-bar {
.navbar-nav .open .dropdown-menu .dropdown-header, background-color: #fff !important;
.navbar-nav .open .dropdown-menu>li>a {
padding: 5px 15px 5px 25px;
color: #fff;
text-align: center;
} }
} }
@ -39,10 +16,6 @@
border-color: transparent; border-color: transparent;
} }
.navbar-toggle .icon-bar {
background-color: #fff !important;
}
.nav>li>a:focus, .nav>li>a:focus,
.nav>li>a:hover { .nav>li>a:hover {
background-color: transparent; background-color: transparent;

43
_scss/_utilities.scss
View File

@ -96,7 +96,6 @@ img.inline {
} }
} }
.nav-secondary-tabs .search-form input[type=search],
.nav-secondary input[type=search] .nav-secondary input[type=search]
{ {
background: rgba(0, 0, 0, 0.17) url("/images/search.png") no-repeat 10px 9px; background: rgba(0, 0, 0, 0.17) url("/images/search.png") no-repeat 10px 9px;
@ -109,28 +108,13 @@ img.inline {
width: 100%; width: 100%;
} }
.nav-secondary-tabs .search-form input[type=search] {
width: 100%;
}
.search-form input[type=text]:focus { .search-form input[type=text]:focus {
background: #fff; background: #fff;
box-shadow: 0; 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] { input[type=text] {
margin: 0;
background: rgba(0, 0, 0, 0.17) url(/images/search.png) no-repeat 10px 9px; background: rgba(0, 0, 0, 0.17) url(/images/search.png) no-repeat 10px 9px;
border: 1px solid transparent; border: 1px solid transparent;
box-shadow: none; box-shadow: none;
@ -230,28 +214,3 @@ div#autocompleteResults span {
display: none !important; 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;
}

2
_scss/_variables.scss
View File

@ -46,6 +46,8 @@ $bg-secondary-night: #101c29;
$bg-sidebar-night: #101e26; $bg-sidebar-night: #101e26;
$bg-footer-night: #000000; $bg-footer-night: #000000;
$bg-component-night: #101c29;
$active-sidebar-night: #9cd7f7; $active-sidebar-night: #9cd7f7;
$bg-search-results-night: rgba(10, 10, 10, 0.95); $bg-search-results-night: rgba(10, 10, 10, 0.95);

1
css/style.scss
View File

@ -9,7 +9,6 @@
@import "typography"; @import "typography";
@import "landing"; @import "landing";
@import "layout"; @import "layout";
@import "global-header";
@import "navigation"; @import "navigation";
@import "buttons"; @import "buttons";
@import "content"; @import "content";