ARCHIVE/xrpl-dev-portal
1
0
Fork 0
mirror of https://github.com/XRPLF/xrpl-dev-portal.git synced 2025-11-19 03:05:49 +00:00
Code Issues Packages Projects Releases Wiki Activity

adds banner for sm md and lg breakpoints

Browse Source
This commit is contained in:
akcodez
2023-06-14 10:57:04 -07:00
parent d97d0ade15
commit 647b5770cc
6 changed files with 122 additions and 91 deletions
Download Patch File Download Diff File Expand all files Collapse all files

51
styles/_top-nav.scss
View File

@@ -12,28 +12,47 @@
align-items: center;
display: flex;
}
.marquee-item {
width: 6192px;
height: 32px;
background-image: url(../img/apex-banner.png);
background-position: 0%;
background-repeat: repeat-x;
background-size: auto 32px;
flex: none;
justify-content: flex-start;
align-items: center;
display: flex;
position: relative;
white-space: nowrap;
will-change: transform;
animation: marquee-horizontal 16s linear infinite;
#apex-banner {
width: 100%;
@include media-breakpoint-only(xs) {
content: url(../img/apex-banner-sm.png);
height: 46px;
}
@include media-breakpoint-only(sm) {
content: url(../img/apex-banner-sm.png);
height: 46px;
}
// Medium devices (tablets, 768px and up)
@include media-breakpoint-only(md) {
content: url(../img/apex-banner-md.png);
height: 46px;
}
// Large devices (desktops, 992px and up)
@include media-breakpoint-up(lg) {
content: url(../img/apex-banner.png);
height: 40px;
}
// background-position: 0%;
// background-repeat: repeat-x;
// background-size: auto 32px;
// flex: none;
// justify-content: flex-start;
// align-items: center;
// display: flex;
// position: relative;
// white-space: nowrap;
// will-change: transform;
// animation: marquee-horizontal 16s linear infinite;
}
/* Top navigation ----------------------------------------------------------- */
.top-nav {
background-color: $gray-900;
height: 80px;
padding: 0;
// Logo
.navbar-brand {
text-decoration: none;