diff --git a/assets/scss/_styles_project.scss b/assets/scss/_styles_project.scss index 99017c1..a3324e1 100644 --- a/assets/scss/_styles_project.scss +++ b/assets/scss/_styles_project.scss @@ -1,37 +1,4 @@ -.td-navbar { - background: $dark; - min-height: 5rem; - .navbar-brand__name { - display: none; - } - .nav-link { - color: $secondary !important; - font-weight: 600; - border-radius: 5px; - } - .nav-link:hover { - background-color: #61616144; - transition: background-color 0.2s ease-in-out; - } - - .nav-link.active{ - background-color: #616161; - color: white; - } -} - -.td-breadcrumbs__single { - visibility: hidden; -} - -.td-navbar .td-navbar-nav-scroll { - height: unset !important; - margin-top: unset !important; -} - -.td-navbar .td-navbar-nav-scroll .nav-link { - padding: .5rem 1.5rem; -} +@import "docsy_overrides"; .sp-footer h2, .sp-footer h3, @@ -57,103 +24,6 @@ margin: auto; } -.td-navbar .td-navbar-nav-scroll .navbar-nav { - padding-bottom: 0 !important; -} - -.nav-item { - margin-right: .5rem !important; -} - -.dropdown-menu { - right: 0; - left: unset; - padding: 0px; - box-shadow: 0 8px 8px rgba(0, 0, 0, 0.25); -} - -.dropdown-item { - padding: 0.5rem 1.5rem; - border-radius: 0.25rem; -} - -.td-sidebar-nav-active-item { - color: $primary !important; - font-weight: 600; -} - -.td-sidebar-nav .td-sidebar-link__page, -ul.ul-2>.td-sidebar-nav__section-title a { - color: #616161 !important; - font-weight: 400; - padding: .3rem .8rem !important; - border-radius: .3rem; - margin: .1rem !important; -} - -.td-sidebar-link.td-sidebar-link__section { - border-radius: .3rem; - padding: .3rem .8rem !important; - margin: .1rem !important; -} - -.td-sidebar-link.td-sidebar-link__section:hover { - color: $primary !important; - background-color: #7EB07F11; - transition: background-color 0.2s ease-in-out; - transition: color 0.2s ease-in-out; -} - -.td-sidebar-nav a.active { - color: $primary !important; - background-color: #7EB07F22; -} - -ul.ul-2 { - padding: 0; -} - -ul.ul-2>.td-sidebar-nav__section-title a:hover { - color: $primary !important; - background-color: #7EB07F11; - transition: background-color 0.2s ease-in-out; - transition: color 0.2s ease-in-out; -} - -ul.ul-0 li a.tree-root, -h5.taxonomy-title { - display: none !important; -} - -li:has(input[type="checkbox"]) { - list-style-type: none; -} - -.td-toc ul { - margin-top: 1rem; -} - -.td-toc li { - display: block; - padding-bottom: .5rem; -} - -.td-toc a{ - display: inline !important; -} - -@media (min-width: 768px) { - .td-sidebar { - padding-top: 5rem; - } - .td-404 main, .td-main main { - padding-top: 6.5rem; - } - .td-sidebar-toc { - padding-top: 2.75rem; - } -} - .rounded-img { border-radius: 1rem; } @@ -171,10 +41,6 @@ li:has(input[type="checkbox"]) { padding-top: 0.8rem; } -.btn { - font-weight: 600; -} - .sp-feature-title { font-weight: 600; } @@ -184,23 +50,26 @@ li:has(input[type="checkbox"]) { font-weight: 600; padding: 0.3rem 0; color: $navbar-dark-color; - &:hover { color: $navbar-dark-hover-color; } - &:active { color: $navbar-dark-active-color; } - &:disabled { color: $navbar-dark-disabled-color; } + span { + width: 2rem; + display: inline-flex; + align-items: center; + border-radius: .1rem; + padding: .5rem; + } + } + span i { + margin: auto; } -} - -.text-secondary { - font-weight: 600; } .sp-service-icon { @@ -212,7 +81,7 @@ li:has(input[type="checkbox"]) { } .sp-service-card { - background: #FFFFFF; + background: white; box-shadow: 0 8px 8px rgba(0, 0, 0, 0.25); border-radius: 10px; border: none; @@ -222,10 +91,6 @@ li:has(input[type="checkbox"]) { margin-top: 6rem; } -.tab-content .tab-pane { - max-width: 100% !important; -} - .sp-supperted-by-img { max-height: 5rem; margin: 1rem; @@ -239,21 +104,30 @@ li:has(input[type="checkbox"]) { } .sp-supported-by-card { - background: #FFFFFF; - box-shadow: 0 8px 8px rgba(0, 0, 0, 0.25); + background: white; + box-shadow: $shadow; border-radius: 10px; border: none; margin-top: 1rem; } body { - background-color: whitesmoke; + background-color: $bg-color; } a.nav-link.sp-coming-soon { pointer-events: none; cursor: default; - color: #616161; + color: $gray; + &::after { + content: "Coming soon!"; + display: inline-block; + background-color: $gray; + color: $dark; + margin-left: .5rem; + padding: .1rem .5rem; + border-radius: .1rem; + } } a.nav-link.sp-coming-soon::after { @@ -264,50 +138,4 @@ a.nav-link.sp-coming-soon::after { margin-left: .5rem; padding: .1rem .5rem; border-radius: .1rem; -} - -.tab-content .tab-pane { - border: 1px solid rgba(0, 0, 0, 0.125) !important; - border-radius: 0px .25rem .25rem .25rem; -} - -.nav-tabs { - border: none !important; -} - -.nav-tabs .nav-item .nav-link.active { - border-color: transparent transparent white transparent !important; -} - -.nav-tabs .nav-item .nav-link { - border: none !important; - box-shadow: 0 8px 8px rgba(0, 0, 0, 0.25); -} - -.tab-body { - background-color: white; - border: none !important; - position: relative; - z-index: 1; -} - -.tab-body h3:before { - content: none; -} - -.tab-content .tab-pane { - border: none !important; - box-shadow: 0 8px 8px rgba(0, 0, 0, 0.25); -} - -.nav-tabs a:not(.active).nav-link:hover { - background-color: #0d6efd11; -} - -.td-content ul li, .td-content ol li { - margin-bottom: unset !important; -} - -.tab-content div { - transition: none; } \ No newline at end of file diff --git a/assets/scss/_variables_project.scss b/assets/scss/_variables_project.scss index c284a43..642d12f 100644 --- a/assets/scss/_variables_project.scss +++ b/assets/scss/_variables_project.scss @@ -6,7 +6,11 @@ Add styles or override variables from the theme here. $primary: #7EB07F; $secondary: #F2C94C; +$gray: #616161; $dark: #30312C; +$bg-color: whitesmoke; + +$shadow: 0 8px 8px rgba(0, 0, 0, 0.25); $td-enable-google-fonts: false; $google_font_name: "Montserrat"; diff --git a/assets/scss/docsy_overrides.scss b/assets/scss/docsy_overrides.scss new file mode 100644 index 0000000..02a2e28 --- /dev/null +++ b/assets/scss/docsy_overrides.scss @@ -0,0 +1,195 @@ +.td-navbar { + background: $dark; + min-height: 5rem; + .navbar-brand__name { + display: none; + } + .nav-link { + color: $secondary !important; + font-weight: 600; + border-radius: 5px; + &:hover { + background-color: #61616144; + transition: background-color 0.2s ease-in-out; + } + &.nav-link.active { + background-color: #616161; + } + } + .td-navbar-nav-scroll { + height: unset !important; + margin-top: unset !important; + .nav-link { + padding: .5rem 1.5rem; + } + .navbar-nav { + padding-bottom: 0 !important; + } + } +} + +.td-breadcrumbs__single { + visibility: hidden; +} + +.td-sidebar-nav .td-sidebar-link__page, +ul.ul-2>.td-sidebar-nav__section-title a { + color: $gray !important; + font-weight: 400; + &:hover { + color: $blue !important; + } +} + +ul.ul-2 { + padding: 0; + &>.td-sidebar-nav__section-title a:hover { + color: $primary !important; + background-color: #7EB07F11; + transition: background-color 0.2s ease-in-out; + transition: color 0.2s ease-in-out; + } +} + +ul.ul-0 li a.tree-root, +h5.taxonomy-title { + display: none !important; +} + +.nav-item { + margin-right: .5rem !important; + } + +.td-sidebar-nav-active-item { + color: $primary !important; + font-weight: 600; +} + +.td-sidebar-nav a.active { + color: $primary !important; + background-color: #7EB07F22; +} + +.td-sidebar-link { +&.td-sidebar-link__section, &.td-sidebar-link__page { + border-radius: .3rem; + padding: .3rem .8rem !important; + margin: .1rem !important; + + &:hover { + color: $primary !important; + background-color: #7EB07F11; + transition: background-color 0.2s ease-in-out; + transition: color 0.2s ease-in-out; + } +} +} + +.td-toc { + ul { + margin-top: 1rem; + } + li { + display: block; + padding-bottom: .5rem; + } + a { + display: inline !important; + } +} + +.tab-content { + .tab-pane { + border: 1px solid rgba(0, 0, 0, 0.125) !important; + border-radius: 0px .25rem .25rem .25rem; + max-width: 100% !important; + } + ul li, ol li { + margin-bottom: unset !important; + } + div { + transition: none; + } +} + +.nav-tabs { + border: none !important; + a:not(.active).nav-link:hover { + background-color: #0d6efd11; + } +} + +.nav-item { + margin-right: .5rem !important; +} + +.dropdown-menu { + right: 0; + left: unset; + padding: 0px; + box-shadow: $shadow; +} + +.dropdown-item { + padding: 0.5rem 1.5rem; + border-radius: 0.25rem; +} + +li:has(input[type="checkbox"]) { + list-style-type: none; +} + +.btn, +.text-secondary { + font-weight: 600; +} + +.tab-content { + .tab-pane { + border: none !important; + box-shadow: $shadow; + } + div { + transition: none; + } +} + +.nav-tabs { + border: none !important; + + .nav-item { + .nav-link { + border: none !important; + box-shadow: $shadow; + margin-bottom: -4px; + } + .nav-link.active { + border-color: transparent transparent white transparent !important; + } + } + a:not(.active).nav-link:hover { + background-color: #0d6efd11; + } +} + +.tab-body { + background-color: white; + border: none !important; + position: relative; + z-index: 1; + h3:before { + content: none; + } +} + +@media (min-width: 768px) { + .td-sidebar { + padding-top: 5rem; + } + .td-404 main, .td-main main { + padding-top: 6.5rem; + } + .td-sidebar-toc { + padding-top: 2.75rem; + } +} \ No newline at end of file diff --git a/layouts/partials/footer.html b/layouts/partials/footer.html index a0d92b1..a77b83c 100644 --- a/layouts/partials/footer.html +++ b/layouts/partials/footer.html @@ -44,7 +44,7 @@

{{ T "footer_download" }}

{{ T "footer_download_phone" }}

- \ No newline at end of file +