mirror of
https://github.com/XRPLF/xrpl-dev-portal.git
synced 2025-11-04 11:55:50 +00:00
124 lines
2.5 KiB
SCSS
124 lines
2.5 KiB
SCSS
.top-banner {
|
|
height: 46px;
|
|
background: url(../img/backgrounds/bg-learning-banner.png);
|
|
background-position: center;
|
|
background-size: cover;
|
|
// padding: 2px 0;
|
|
color: #fff;
|
|
text-align: center;
|
|
font-size: 16px;
|
|
font-weight: bold;
|
|
line-height: 24px;
|
|
|
|
@include media-breakpoint-up(md) {
|
|
padding: 5px 8px;
|
|
background: url(../img/backgrounds/bg-learning-banner-md.png);
|
|
background-position: center;
|
|
background-size: cover;
|
|
}
|
|
|
|
@include media-breakpoint-up(xl) {
|
|
background: url(../img/backgrounds/bg-learning-banner-lg.png);
|
|
background-position: center;
|
|
background-size: cover;
|
|
}
|
|
|
|
.btn {
|
|
margin-left: 4px;
|
|
font-size: 12px;
|
|
color: #fff;
|
|
padding: 2px 4px;
|
|
border: 1px solid #fff;
|
|
border-radius: 2px;
|
|
|
|
@include media-breakpoint-up(md) {
|
|
margin-top: 6px;
|
|
margin-left: 16px;
|
|
font-size: 16px;
|
|
padding: 4px 8px;
|
|
border: 1.5px solid #fff;
|
|
border-radius: 4px;
|
|
}
|
|
}
|
|
|
|
.btn-outline-secondary {
|
|
&:not(:disabled):not(.disabled):hover {
|
|
color: #111112;
|
|
background-color: #fff;
|
|
}
|
|
}
|
|
|
|
p {
|
|
font-size: 12px;
|
|
line-height: 20px;
|
|
text-align: center;
|
|
margin: auto;
|
|
|
|
@include media-breakpoint-up(md) {
|
|
padding-top: 7px;
|
|
font-size: 16px;
|
|
width: initial;
|
|
line-height: 24px;
|
|
}
|
|
}
|
|
}
|
|
|
|
body {
|
|
padding-top: 46px;
|
|
}
|
|
.top-nav {
|
|
top: 46px;
|
|
}
|
|
.right-sidebar,
|
|
.left-sidebar {
|
|
@include media-breakpoint-up(lg) {
|
|
top: 100px;
|
|
}
|
|
}
|
|
|
|
$banner-top-offset: 146px;
|
|
|
|
.floating-nav {
|
|
top: $banner-top-offset;
|
|
}
|
|
|
|
.main h1:before,
|
|
.main h2:before,
|
|
.main h3:before,
|
|
.main h4:before,
|
|
.main h5:before,
|
|
.main h6:before,
|
|
#main_content_wrapper:before,
|
|
.interactive-block:before {
|
|
margin-top: -$banner-top-offset;
|
|
height: $banner-top-offset;
|
|
}
|
|
|
|
.content h1:first-child:before {
|
|
margin-top: -$banner-top-offset;
|
|
}
|
|
|
|
#main_content_wrapper {
|
|
margin-top: 53px;
|
|
}
|
|
|
|
html.light {
|
|
.top-banner {
|
|
|
|
.btn-outline-secondary {
|
|
color: #fff;
|
|
border-color: #fff;
|
|
&:not(:disabled):not(.disabled):hover {
|
|
color: #111112;
|
|
background-color: #fff;
|
|
border-color: #fff;
|
|
}
|
|
}
|
|
|
|
}
|
|
}
|
|
|
|
.page-calculator #calculator-mobile-toggle.show {
|
|
top: ($banner-top-offset + 4px)
|
|
}
|