Skip to content

Commit

Permalink
feat: ✨ Move search button to sidebar
Browse files Browse the repository at this point in the history
  • Loading branch information
bcamarneiro committed Oct 31, 2024
1 parent dd81915 commit 4c599ad
Show file tree
Hide file tree
Showing 11 changed files with 1,582 additions and 1,311 deletions.
3 changes: 2 additions & 1 deletion docs/node/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,8 @@ This section provides instructions to help you build a **Fleek Network Node**, i
To participate in the [alpha Testnet](/docs/roadmap), you can begin by setting up and running nodes. Check the [requirements](/docs/node/requirements) and find the [onboarding instructions](/docs/node/testnet-onboarding) to enable you to [install](/docs/node/install) a network node successfully.
:::

# Node operator {#node-operator}
## Node operator {#node-operator}

---

A **Node Operator** is represented as a system administrator who builds, installs or maintains one or many nodes in a server or more.
Expand Down
2,533 changes: 1,350 additions & 1,183 deletions package-lock.json

Large diffs are not rendered by default.

3 changes: 3 additions & 0 deletions sidebars.js
Original file line number Diff line number Diff line change
Expand Up @@ -24,6 +24,7 @@ const sidebars = {
label: 'Learn',
collapsed: true,
collapsible: true,
link: {type: 'doc', id: 'learn/index'},
items: [
'learn/index',
'learn/the-network',
Expand All @@ -38,6 +39,7 @@ const sidebars = {
label: 'Node',
collapsed: true,
collapsible: true,
link: {type: 'doc', id: 'node/index'},
items: [
'node/index',
'node/requirements',
Expand Down Expand Up @@ -71,6 +73,7 @@ const sidebars = {
label: 'Open-source',
collapsed: true,
collapsible: true,
link: {type: 'doc', id: 'Open-source/code-of-conduct'},
items: [
'Open-source/code-of-conduct',
'Open-source/contributing',
Expand Down
92 changes: 51 additions & 41 deletions src/css/custom.css
Original file line number Diff line number Diff line change
Expand Up @@ -5,18 +5,18 @@
*/

/* You can override the default Infima variables here. */
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@300;400;500;600;700&display=swap');
@import url("https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@300;400;500;600;700&display=swap");

@font-face {
font-family: 'Atyp';
src: url('/fonts/AtypDisplay-Regular.woff2') format('woff2') font-weight 400;
src: url('/fonts/AtypDisplay-Medium.woff2') format('woff2') font-weight 500;
src: url('/fonts/AtypDisplay-Semibold.woff2') format('woff2') font-weight 600;
src: url('/fonts/AtypDisplay-Bold.woff2') format('woff2') font-weight 700;
font-family: "Atyp";
src: url("/fonts/AtypDisplay-Regular.woff2") format("woff2") font-weight 400;
src: url("/fonts/AtypDisplay-Medium.woff2") format("woff2") font-weight 500;
src: url("/fonts/AtypDisplay-Semibold.woff2") format("woff2") font-weight 600;
src: url("/fonts/AtypDisplay-Bold.woff2") format("woff2") font-weight 700;
}

:root {
--ifm-font-family-base: 'IBM Plex Mono', sans-serif; /* Set the default font to IBM Plex Sans */
--ifm-font-family-base: "IBM Plex Mono", sans-serif; /* Set the default font to IBM Plex Sans */
--ifm-color-primary: #000;
--ifm-color-primary-dark: #000033;
--ifm-color-primary-darkest: #0048f8;
Expand All @@ -29,16 +29,19 @@
/* NEw COLORS */
--background-color: #fff;
--text-color: #202020;
--link-active: #9E6C00;
--link-active: #9e6c00;
--neutral-3: #f0f0f0;
--neutral-6: #d9d9d9;

--neutral-7: #cecece;
--neutral-11: #646464;

--ifm-navbar-background-color: var(--background-color);
--ifm-navbar-link-color: var(--text-color);
--ifm-navbar-link-hover-color: var(--link-active);

--ifm-menu-color: var(--text-color);
--sidebar-menu-item_border: #d9d9d9;

--ifm-color-primary-darker: var(--link-active);

--ifm-footer-link-color: var(--text-color);
Expand All @@ -49,10 +52,22 @@
--ifm-pagination-nav-color-hover: var(--link-active);
--ifm-font-weight-base: var(--ifm-font-weight-light);
--ifm-heading-color: var(--text-color);
--docsearch-searchbox-focus-background: var(--background-color) !important;
--docsearch-modal-background: var(--background-color) !important;
--docsearch-hit-background: var(--neutral-6) !important;
--docsearch-hit-active-color: var(--link-active) !important;
--docsearch-highlight-color: var(--text-color) !important;
--docsearch-text-color: var(--text-color) !important;
--docsearch-hit-color: var(--text-color) !important;
--docsearch-muted-color: var(--text-color) !important;

--ifm-link-color: var(--text-color);
--ifm-color-content-secondary: var(--text-color) !important;
--docsearch-primary-color: var(--text-color) !important;
}

/* For readability concerns, you should choose a lighter palette in dark mode. */
[data-theme='dark'] {
[data-theme="dark"] {
--ifm-color-primary: #fff;
--ifm-color-primary-dark: #98beff;
--ifm-color-primary-darkest: #0048f8;
Expand All @@ -63,18 +78,13 @@
--docusaurus-highlighted-code-line-bg: rgba(0, 0, 0, 0.3);
}

@import url('./navbar.css');
@import url('./sidebar.css');
@import url('./tags.css');
@import url('./pagination-nav.css');
@import url('./breadcrumbs.css');
@import url('./typography.css');
@import url('./toc.css');

:root {
--docsearch-modal-background: #000 !important;
--custom-color-gray-blue: rgb(62 72 105 / 37.5%);
}
@import url("./navbar.css");
@import url("./sidebar.css");
@import url("./tags.css");
@import url("./pagination-nav.css");
@import url("./breadcrumbs.css");
@import url("./typography.css");
@import url("./toc.css");

.main-wrapper a,
.main-wrapper span,
Expand All @@ -92,16 +102,22 @@
z-index: -1;
}

html[data-theme='dark'] {
html[data-theme="dark"] {
background: var(--background-color);
color: var(--text-color);
}

[data-theme='dark'] .footer {
[data-theme="dark"] .footer {
background: transparent;
border-top: 1px solid var(--neutral-6);
}

div[class*="docRoot_node_modules-@docusaurus-theme-classic-lib-theme-DocRoot-Layout-styles-module"] {
max-width: 1440px;
margin: 0 auto;
width: 100%;
}

.alert {
background: transparent;
border: 1px solid var(--sidebar-menu-item_border);
Expand Down Expand Up @@ -135,10 +151,6 @@ div[class*=" searchLogoColumn"],
display: none;
}

div[class*="docItemContainer"] {
padding: 20px;
}

@media (min-width: 996px) {
.footer .container {
padding: 0;
Expand All @@ -156,8 +168,8 @@ div[class*="docItemContainer"] {

@media (max-width: 996px) {
.footer__col {
margin-bottom: 0;
flex-basis: 0;
margin-bottom: 0;
flex-basis: 0;
}

.footer__links {
Expand All @@ -166,11 +178,9 @@ div[class*="docItemContainer"] {
padding-left: 4rem;
}


.footer__title {
display: none;
}

}

/* Main wrapper */
Expand Down Expand Up @@ -207,8 +217,7 @@ main > .container > .row {
.DocSearch-Button:hover svg {
opacity: 1;
}
§
.DocSearch-Container > .DocSearch-Modal,
§ .DocSearch-Container > .DocSearch-Modal,
.DocSearch-Modal .DocSearch-Form {
box-shadow: none;
border: 1px solid var(--ifm-toc-border-color);
Expand All @@ -218,6 +227,10 @@ main > .container > .row {
font-size: 1em;
}

.DocSearch-Hit[aria-selected="true"] a {
background: var(--neutral-3) !important;
}

input[class^="searchQueryInput_"] {
border: 1px solid var(--ifm-toc-border-color);
max-width: 480px;
Expand Down Expand Up @@ -269,9 +282,7 @@ article h1,
border-left-style: dashed;
}

.markdown img

.table-of-contents li a:hover {
.markdown img .table-of-contents li a:hover {
text-decoration: underline;
}

Expand All @@ -293,8 +304,7 @@ article h1,
text-transform: capitalize;
}


.youtube-player iframe {
.youtube-player iframe {
width: 100%;
aspect-ratio: 16 / 9;
}
Expand All @@ -305,4 +315,4 @@ article h1,

aside.theme-doc-sidebar-container {
border-right: none;
}
}
25 changes: 19 additions & 6 deletions src/css/navbar.css
Original file line number Diff line number Diff line change
@@ -1,7 +1,9 @@
.navbar {
box-shadow: none;
padding-top: 3rem;
padding-bottom: 3rem;
padding: 3rem 0.5rem;
max-width: 1440px;
margin: 0 auto;
width: 100%;
}

.DocSearch-Modal .DocSearch-Footer,
Expand All @@ -11,22 +13,32 @@

.DocSearch-Button,
.DocSearch-Button:hover {
height: 34px;
border-radius: 0px;
color: var(--text-color);
border: 1px solid var(--text-color);
background: var(--background-color);
box-shadow: none !important;

.DocSearch-Search-Icon {
color: var(--text-color);
}
}

@media (max-width: 996px) {
.navbar__toggle+.navbar__brand {
.navbar {
padding: 1.5rem 1rem;
}

.navbar__toggle + .navbar__brand {
display: none;
}

.navbar__items>div:nth-child(2) {
.navbar__toggle {
margin-right: 0;
}

.navbar__items > div:nth-child(2) {
display: flex;
align-items: flex-end;
justify-content: flex-end;
Expand All @@ -40,8 +52,9 @@

@media (min-width: 996px) {
.navbar__items {
justify-content: space-between;
justify-content: center;
height: 100%;
gap: 18px;
}

.navbar__items div:nth-child(1) {
Expand All @@ -52,4 +65,4 @@
.navbar__items .DocSearch-Button {
justify-content: flex-start;
}
}
}
Loading

0 comments on commit 4c599ad

Please sign in to comment.