Update styles for dark mode, add general bootstrap overrides

This commit is contained in:
Mark H 2021-07-13 09:53:30 +01:00
parent c45879262e
commit 86b24990ee
5 changed files with 34 additions and 7 deletions

View File

@ -271,7 +271,6 @@ body.landing {
background: #FF3F73;
color: white;
font-size: 17px;
font-weight: bold;
margin-top: 50px;
padding: 20px 60px;

View File

@ -25,7 +25,7 @@ body.night {
div#side-toc-title {
color: $white;
}
a:not(.btn) {
a:not(.btn):not(.button) {
color: $primary-links-night;
}
.header {

View File

@ -29,6 +29,26 @@
display: block;
}
.btn {
font-weight: bold;
}
.btn-primary {
background-color: $marine-50;
border: 1px solid rgba(0, 0, 0, 0.1);
padding: 10px 15px 6px;
&:hover {
opacity: 0.8;
// override default bootstrap behaviour
background-color: $marine-50;
border: 1px solid rgba(0, 0, 0, 0.1);
}
font-family: $buttons;
}
.btn-default:hover {
color: #fff!important;
background-color: transparent!important;

View File

@ -1,12 +1,20 @@
.docker-upgrade-cta {
background-color: $orange-10;
color: $body-text; // we want this irrespective of light/dark mode
body.night & {
background-color: change-color($orange-10, $alpha: 0.3);
border: 1px solid $orange-10;
p, .docker-upgrade-cta__heading { color: $orange-10; }
}
body:not(.night) & {
background-color: $orange-10;
border: 1px solid $orange-20;
p, .docker-upgrade-cta__heading { color: inherit; }
}
padding: 16px 25px;
margin: 0 0 20px;
border-radius: 4px;
border: 1px solid $orange-20;
border-radius: 3px;
.docker-upgrade-cta__heading {
font-weight: bold;

View File

@ -672,7 +672,7 @@ Use the `upgrade-cta.html` include to render a CTA asking the user to upgrade th
{% include upgrade-cta.html
body="Upgrade to gain access to this feature"
header-text="This feature is restricted to X and Y plans"
target-url="https://www.example.com/
target-url="https://www.example.com/"
%}
```
{% endraw %}