diff --git a/assets/scss/_styles_project.scss b/assets/scss/_styles_project.scss index 0234286..d6ed406 100644 --- a/assets/scss/_styles_project.scss +++ b/assets/scss/_styles_project.scss @@ -1,31 +1,15 @@ -.td-navbar { - background: $dark; - min-height: 5rem; - .navbar-brand__name { - display: none; - } - .nav-link { - color: $secondary !important; - font-weight: 600; - } - .nav-link:hover, .nav-link.active{ - background-color: #616161; - color: white; - border-radius: 5px; - } +@import "docsy_overrides"; + +.sp-footer h2, +.sp-footer h3, +.sp-footer a.nav-link { + padding: 0.3rem 1rem !important; } -.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; +.sp-footer a.nav-link:hover { + background-color: #61616144; + transition: background-color 0.2s ease-in-out; + border-radius: .3rem; } .sp-footer a.nav-link span { @@ -39,77 +23,6 @@ .sp-footer span i { 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 .td-sidebar-link__page, -ul.ul-2>.td-sidebar-nav__section-title a { - color: #616161 !important; - font-weight: 400; -} - -ul.ul-2>.td-sidebar-nav__section-title a:hover { - color: $blue !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; - } -} -.carousel-control-next, .carousel-control-prev { - background-image: none; -} - -.carousel-control-next { - right: -15% -} - -.carousel-control-prev { - left: -15% -} - .rounded-img { border-radius: 1rem; } @@ -127,10 +40,6 @@ li:has(input[type="checkbox"]) { padding-top: 0.8rem; } -.btn { - font-weight: 600; -} - .sp-feature-title { font-weight: 600; } @@ -140,23 +49,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 { @@ -168,7 +80,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; @@ -178,10 +90,6 @@ li:has(input[type="checkbox"]) { margin-top: 6rem; } -.tab-content .tab-pane { - max-width: 100% !important; -} - .sp-supported-by-img { max-height: 5rem; margin: 1rem; @@ -191,12 +99,40 @@ li:has(input[type="checkbox"]) { display: flex; align-items: center; justify-content: center; - column-gap: 10vw; + column-gap: 5vw; flex-wrap: wrap; + margin-top: 2rem; + & > a > img { + max-width: 15vw; + } +} + +a.nav-link.sp-coming-soon { + pointer-events: none; + cursor: default; + color: $gray; + &::after { + content: "Coming soon!"; + display: inline-block; + background-color: $gray; + color: $dark; + margin-left: .5rem; + padding: .1rem .5rem; + border-radius: .1rem; + } +} + +html, body { + max-width: 100%; + overflow-x: hidden; +} + +body { + background-color: $bg-color; } .sp-advantages { - row-gap: 20vh; + row-gap: 0px; } .sp-feature { @@ -221,31 +157,7 @@ li:has(input[type="checkbox"]) { top: 14vh; } -body { - overflow-x: hidden; -} - .container-fluid { padding-left: 0 !important; padding-right: 0 !important; -} - -body { - background-color: whitesmoke; -} - -a.nav-link.sp-coming-soon { - pointer-events: none; - cursor: default; - color: #616161; -} - -a.nav-link.sp-coming-soon::after { - content: "Coming soon!"; - display: inline-block; - background-color: #616161; - color: $dark; - margin-left: .5rem; - padding: .1rem .5rem; - border-radius: .1rem; } \ 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..b3748f8 --- /dev/null +++ b/assets/scss/docsy_overrides.scss @@ -0,0 +1,199 @@ +.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; + } +} + +.carousel-control-next, .carousel-control-prev { + background-image: none; +} \ No newline at end of file diff --git a/config.toml b/config.toml index c8b1422..50ef071 100644 --- a/config.toml +++ b/config.toml @@ -16,22 +16,6 @@ enableGitInfo = true # Comment out to enable taxonomies in Docsy # disableKinds = ["taxonomy", "taxonomyTerm"] -# You can add your own taxonomies -[taxonomies] -tag = "tags" -category = "categories" - -[params.taxonomy] -# set taxonomyCloud = [] to hide taxonomy clouds -taxonomyCloud = ["tags", "categories"] - -# If used, must have same length as taxonomyCloud -taxonomyCloudTitle = ["Tag Cloud", "Categories"] - -# set taxonomyPageHeader = [] to hide taxonomies on the page headers -taxonomyPageHeader = ["tags", "categories"] - - # Highlighting config pygmentsCodeFences = true pygmentsUseClasses = false diff --git a/content/en/_index.html b/content/en/_index.html index 3bdd519..69e2bfe 100644 --- a/content/en/_index.html +++ b/content/en/_index.html @@ -20,19 +20,27 @@ linkTitle = "SelfPrivacy"