Add focus

This commit is contained in:
Jeremy Thomas
2018-04-09 23:53:34 +01:00
parent e8d4efb274
commit f123eb9562
13 changed files with 310 additions and 247 deletions

View File

@@ -9552,7 +9552,6 @@ label.panel-block:hover {
.bd-header .subtitle {
color: #7a7a7a;
max-width: 16em;
}
.bd-header .subtitle strong {
@@ -9687,6 +9686,9 @@ label.panel-block:hover {
margin-left: -3rem;
padding: 3rem;
}
.bd-lead:last-child {
margin-right: -3rem;
}
.bd-header {
align-items: center;
display: flex;
@@ -9699,7 +9701,7 @@ label.panel-block:hover {
.bd-header-carbon {
flex-grow: 0;
flex-shrink: 0;
margin: -15px 0 -15px 3rem;
margin: -15px 0 -15px 6rem;
width: 300px;
}
.bd-side {
@@ -10086,6 +10088,48 @@ svg {
text-decoration: underline;
}
.bd-focus {
margin: 6rem auto 0;
max-width: 1080px;
}
.bd-focus-item .subtitle {
color: #b5b5b5;
}
.bd-focus-item .subtitle strong {
color: currentColor;
}
.bd-focus-icon .fa-mobile-alt {
color: #b86bff;
margin-right: -20px;
}
.bd-focus-icon .fa-tablet-alt {
color: #ff3860;
margin-left: -20px;
}
.bd-focus-icon .fa-desktop {
color: #ff470f;
margin-left: -20px;
position: relative;
top: 2px;
}
.bd-focus-icon .fa-cubes {
color: #23d160;
}
.bd-focus-icon .fa-css3 {
color: #3273dc;
}
.bd-focus-icon .fa-github-alt {
color: #333333;
}
.intro-content {
margin-left: auto;
margin-right: auto;
@@ -10651,92 +10695,6 @@ svg {
color: #FFD257;
}
.bd-navbar-item-documentation .icon {
color: #00d1b2;
}
.bd-navbar-item-documentation:hover {
background-color: #00d1b2 !important;
color: #fff !important;
}
.bd-navbar-item-documentation:hover .icon {
color: currentColor !important;
}
.bd-navbar-item-templates .icon {
color: #209cee;
}
.bd-navbar-item-templates:hover {
background-color: #209cee !important;
color: #fff !important;
}
.bd-navbar-item-templates:hover .icon {
color: currentColor !important;
}
.bd-navbar-item-videos .icon {
color: #23d160;
}
.bd-navbar-item-videos:hover {
background-color: #23d160 !important;
color: #fff !important;
}
.bd-navbar-item-videos:hover .icon {
color: currentColor !important;
}
.bd-navbar-item-blog .icon {
color: #f26522;
}
.bd-navbar-item-blog:hover {
background-color: #f26522 !important;
color: #fff !important;
}
.bd-navbar-item-blog:hover .icon {
color: currentColor !important;
}
.bd-navbar-item-expo .icon {
color: #FFD257;
}
.bd-navbar-item-expo:hover {
background-color: #FFD257 !important;
color: #fff !important;
}
.bd-navbar-item-expo:hover .icon {
color: currentColor !important;
}
.bd-navbar-item-love .icon {
color: #ff3860;
}
.bd-navbar-item-love:hover {
background-color: #ff3860 !important;
color: #fff !important;
}
.bd-navbar-item-love:hover .icon {
color: currentColor !important;
}
.bd-navbar-item-expo:hover {
color: #8F6900 !important;
}
.bd-navbar-item-expo:hover .icon {
color: #F4B300 !important;
}
.bd-special-shadow {
background-image: linear-gradient(rgba(0, 0, 0, 0.1), transparent);
height: 8px;
@@ -10946,7 +10904,7 @@ svg {
.bd-structure::before,
.bd-snippet::before {
background: #ffdd57;
border-radius: 4px 4px 0 0;
border-radius: 2px 2px 0 0;
bottom: 100%;
color: rgba(0, 0, 0, 0.7);
content: "Example";
@@ -11011,6 +10969,7 @@ svg {
content: "Snippet";
align-items: stretch;
display: flex;
margin-left: -1px;
}
.bd-snippet-preview {