Skip to content

Commit

Permalink
Merge pull request #1866 from bgoonz/master
Browse files Browse the repository at this point in the history
  • Loading branch information
@bgoonz
bgoonz authored Mar 14, 2022
2 parents 08bfd31 + 7dbcdb7 commit 81fdf57
Show file tree
Hide file tree
Showing 2 changed files with 43 additions and 43 deletions.
13 changes: 7 additions & 6 deletions src/components/DocsMenu.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,8 +6,9 @@ export default class DocsMenu extends React.Component {
render() {
let site = _.get(this.props, 'site', null);
let page = _.get(this.props, 'page', null);
let root_docs_path = _.get(site, 'data.doc_sections.root_docs_path', null);
let root_page = getPage(this.props.pageContext.pages, root_docs_path);
let root_docs_path = _.get( site, 'data.doc_sections.root_docs_path', null );
let pageContextProps = this.props.pageContext.pages;
let root_page = getPage(pageContextProps, root_docs_path);
return (
<nav id="docs-nav" className="docs-nav">
<div id="docs-nav-inside" className="docs-nav-inside sticky">
Expand All @@ -26,14 +27,14 @@ export default class DocsMenu extends React.Component {
</li>
{_.map(_.get(site, 'data.doc_sections.sections', null), (section, section_idx) => {
let section_path = pathJoin(root_docs_path, section);
let section_page = getPage(this.props.pageContext.pages, section_path);
let child_pages = _.orderBy(getPages(this.props.pageContext.pages, section_path), 'frontmatter.weight');
let section_page = getPage(pageContextProps, section_path);
let child_pages = _.orderBy(getPages(pageContextProps, section_path), 'frontmatter.weight');
let child_count = _.size(child_pages);
let has_children = child_count > 0 ? true : false;
let is_current_page = _.get(page, 'url', null) === _.get(section_page, 'url', null) ? true : false;
let is_current_page = !!(_.get(page, 'url', null) === _.get(section_page, 'url', null));
let is_active = _.get(page, 'url', null).startsWith(_.get(section_page, 'url', null));
return (
<React.Fragment key={section_idx + '.1'}>
<React.Fragment key={`${section_idx}.1`}>
<li
key={section_idx}
className={classNames('docs-menu-item', {
Expand Down
73 changes: 36 additions & 37 deletions src/components/Header.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,24 +11,24 @@ export default class Header extends React.Component {
<div className="inner">
<div className="site-header-inside">
<div className="site-branding">
{_.get(this.props, 'pageContext.site.siteMetadata.header.logo_img', null) ? (
{ _.get( this.props, 'pageContext.site.siteMetadata.header.logo_img', null ) ? (
<p className="site-logo">
<Link to={withPrefix(_.get(this.props, 'pageContext.site.siteMetadata.header.url', null) || '/')}>
<Link to={ withPrefix( _.get( this.props, 'pageContext.site.siteMetadata.header.url', null ) || '/' ) }>
<img
src={withPrefix(_.get(this.props, 'pageContext.site.siteMetadata.header.logo_img', null))}
alt={_.get(this.props, 'pageContext.site.siteMetadata.header.logo_img_alt', null)}
src={ withPrefix( _.get( this.props, 'pageContext.site.siteMetadata.header.logo_img', null ) ) }
alt={ _.get( this.props, 'pageContext.site.siteMetadata.header.logo_img_alt', null ) }
/>
</Link>
</p>
) : (
<p className="site-logo">
<Link to={withPrefix(_.get(this.props, 'pageContext.site.siteMetadata.header.url', null) || '/')}>
{_.get(this.props, 'pageContext.site.siteMetadata.header.title', null)}
</Link>
</p>
)}
<p className="site-logo">
<Link to={ withPrefix( _.get( this.props, 'pageContext.site.siteMetadata.header.url', null ) || '/' ) }>
{ _.get( this.props, 'pageContext.site.siteMetadata.header.title', null ) }
</Link>
</p>
) }
</div>
{_.get(this.props, 'pageContext.site.siteMetadata.header.has_nav', null) && (
{ _.get( this.props, 'pageContext.site.siteMetadata.header.has_nav', null ) && (
<React.Fragment>
<nav id="main-navigation" className="site-navigation" aria-label="Main Navigation">
<div className="site-nav-inside">
Expand All @@ -37,36 +37,36 @@ export default class Header extends React.Component {
<span className="icon-close" aria-hidden="true" />
</button>
<ul className="menu">
{_.map(_.get(this.props, 'pageContext.site.siteMetadata.header.nav_links', null), (action, action_idx) => {
let page_url = _.trim(_.get(this.props, 'pageContext.url', null), '/');
let action_url = _.trim(_.get(action, 'url', null), '/');
{ _.map( _.get( this.props, 'pageContext.site.siteMetadata.header.nav_links', null ), ( action, action_idx ) => {
let page_url = _.trim( _.get( this.props, 'pageContext.url', null ), '/' );
let action_url = _.trim( _.get( action, 'url', null ), '/' );
return (
<li
key={action_idx}
className={classNames('menu-item', {
'has-children': _.get(action, 'has_subnav', null) && _.get(action, 'subnav_links', null),
key={ action_idx }
className={ classNames( 'menu-item', {
'has-children': _.get( action, 'has_subnav', null ) && _.get( action, 'subnav_links', null ),
current: page_url === action_url,
'menu-button': _.get(action, 'style', null) !== 'link'
})}
'menu-button': _.get( action, 'style', null ) !== 'link'
} ) }
>
<ActionLink {...this.props} action={action} />
{_.get(action, 'has_subnav', null) && _.get(action, 'subnav_links', null) && (
<ActionLink { ...this.props } action={ action } />
{ _.get( action, 'has_subnav', null ) && _.get( action, 'subnav_links', null ) && (
<React.Fragment>
<button className="submenu-toggle">
<span className="icon-angle-right" aria-hidden="true" />
<span className="screen-reader-text">Sub-menu</span>
</button>
<Submenu
{...this.props}
submenu={_.get(action, 'subnav_links', null)}
menu_class={'submenu'}
page={this.props.pageContext}
{ ...this.props }
submenu={ _.get( action, 'subnav_links', null ) }
menu_class={ 'submenu' }
page={ this.props.pageContext }
/>
</React.Fragment>
)}
) }
</li>
);
})}
} ) }
</ul>
</div>
</nav>
Expand All @@ -75,13 +75,12 @@ export default class Header extends React.Component {
<span className="icon-menu" aria-hidden="true" />
</button>
</React.Fragment>
)}
) }
</div>
</div>
<div>
<>
myCustomTextInputID
<div id="sb-search-input-example">
<div id="sb-search-input-example">
<div className="sb-content sb-hero">
<div className="sb-search sb-hero">
<div className="sb-input">
Expand All @@ -100,10 +99,10 @@ export default class Header extends React.Component {
</div>
</div>
<style
dangerouslySetInnerHTML={{
dangerouslySetInnerHTML={ {
__html:
"\n @font-face {\n font-family: font-sb;\n src: url(https://api.searchbar.org/fonts/sb.eot?39450784);\n src: url(https://api.searchbar.org/fonts/sb.eot?39450784#iefix) format('embedded-opentype'), url(https://api.searchbar.org/fonts/sb.woff?39450784) format('woff'), url(https://api.searchbar.org/fonts/?39450784) format('truetype'), url(https://api.searchbar.org/fonts/sb.svg?39450784#font-sb) format('svg');\n font-weight: 400;\n font-style: normal\n }\n\n #sb-search-input-example {\n position: static;\n top: 0;\n width: 100%;\n height: 90px;\n place-content: center;\n display: flex;\n }\n\n #sb-search-input-example a, #sb-search-input-example button, #sb-search-input-example div, #sb-search-input-example em, #sb-search-input-example h1, #sb-search-input-example h2, #sb-search-input-example h3, #sb-search-input-example h4, #sb-search-input-example h5, #sb-search-input-example input, #sb-search-input-example p, #sb-search-input-example span {\n all: initial;\n font-family: Roboto, Helvetica, Arial;\n font-size: 0px;\n }\n\n #sb-search-input-example div, #sb-search-input-example h1, #sb-search-input-example h2, #sb-search-input-example h3, #sb-search-input-example h4, #sb-search-input-example h5, #sb-search-input-example p {\n display: block\n }\n\n #sb-search-input-example div, #sb-search-input-example em, #sb-search-input-example h1, #sb-search-input-example h2, #sb-search-input-example h3, #sb-search-input-example h4, #sb-search-input-example h5, #sb-search-input-example p, #sb-search-input-example span {\n font-size: inherit;\n font-weight: inherit;\n text-transform: inherit;\n color: inherit\n }\n\n #sb-search-input-example a, #sb-search-input-example a * {\n cursor: pointer;\n user-select: none\n }\n\n #sb-search-input-example * {\n box-sizing: border-box\n }\n\n\n #sb-search-input-example .sb-content {\n background: rgba(238, 238, 238, .82);\n backdrop-filter: blur(30px);\n -webkit-backdrop-filter: blur(30px);\n border-radius: 46px;\n display: block;\n text-align: left;\n width: 100%;\n top: calc(120px - 92px);\n margin-bottom: 0;\n overflow: hidden;\n z-index: 1000\n }\n\n #sb-search-input-example .sb-content.sb-hero {\n top: 0px;\n max-width: 660px;\n height: auto;\n z-index: 800;\n background-color: rgba(202, 202, 202, 0.2);\n -webkit-backdrop-filter: blur(30px);\n backdrop-filter: blur(30px)\n }\n\n #sb-search-input-example .sb-search {\n background: rgba(255, 255, 255, 0.7);\n backdrop-filter: blur(30px);\n -webkit-backdrop-filter: blur(30px);\n border-radius: 116px;\n border: 0 none;\n height: 58px;\n width: auto;\n margin: 16px;\n display: flex;\n z-index: 999;\n position: relative;\n }\n\n #sb-search-input-example .sb-search.sb-hero {\n padding: 0 0 0 16px;\n background-color: white;\n }\n\n #sb-search-input-example .sb-input {\n align-items: center;\n display: flex;\n height: 100%;\n width: 100%;\n border-radius: 100%;\n padding: 0 0 0 8px\n }\n\n #sb-search-input-example input {\n outline: 0;\n color: #007cff;\n background-color: rgba(0, 0, 0, 0);\n -webkit-appearance: none\n }\n\n #sb-search-input-example ::placeholder {\n color: #8a8a8a;\n opacity: 1\n\n }\n\n #sb-search-input-example input[type=search]::-ms-clear {\n display: none;\n width: 0;\n height: 0\n }\n\n #sb-search-input-example input[type=search]::-ms-reveal {\n display: none;\n width: 0;\n height: 0\n }\n\n #sb-search-input-example input[type=search]::-webkit-search-cancel-button, #sb-search-input-example input[type=search]::-webkit-search-decoration, #sb-search-input-example input[type=search]::-webkit-search-results-button, #sb-search-input-example input[type=search]::-webkit-search-results-decoration {\n display: none\n }\n\n #sb-search-input-example .sb-search-field {\n border: 0 none;\n height: 100%;\n width: 100%;\n font-size: 18px;\n display: block\n }\n\n #sb-search-input-example .sb-icon {\n font: normal normal 400 26px font-sb;\n line-height: 26px;\n align-items: center;\n padding: 10px;\n speak: none;\n display: inline-block;\n text-decoration: inherit;\n text-align: center;\n text-transform: none;\n cursor: pointer;\n margin: 0;\n }\n\n #sb-search-input-example .sb-search-icon {\n box-sizing: border-box;\n border: 0px;\n margin-right: 7px;\n align-items: center;\n border-radius: 50%;\n background: #007cff;\n color: #fff;\n cursor: pointer;\n display: flex;\n }\n\n @media (prefers-color-scheme: dark) {\n\n #sb-search-input-example .sb-search.sb-hero {\n background-color: rgba(0, 0, 0, 0.7);\n }\n\n #sb-search-input-example .sb-content {\n background: rgba(20, 20, 20, .8);\n }\n\n\n #sb-search-input-example .sb-search {\n background: rgba(0, 0, 0, 0.7);\n }\n\n #sb-search-input-example .sb-icon {\n color: #fff;\n }\n\n #sb-search-input-example input {\n outline: 0;\n color: #5eb2fe;\n -webkit-appearance: none;\n }\n\n #sb-search-input-example ::placeholder {\n color: #b5b5b5;\n opacity: 1;\n }\n\n }\n\t"
}}
} }
/>
</div>
</>
Expand All @@ -112,10 +111,10 @@ export default class Header extends React.Component {
<a className="github-corner" href="https://github.com/bgoonz/BGOONZ_BLOG_2.0" aria-label="View source on Github">
<svg
aria-hidden="true"
width={30}
height={30}
width={ 30 }
height={ 30 }
viewBox="0 0 250 250"
style={{
style={ {
zIndex: 100000,
fill: 'black',
color: '#fff',
Expand All @@ -124,14 +123,14 @@ export default class Header extends React.Component {
border: 1,
left: '0px',
transform: 'scale(-1.5, 1.5)'
}}
} }
>
<path d="M0,0 L115,115 L130,115 L142,142 L250,250 L250,0 Z"></path>
<path
className="octo-arm"
d="M128.3,109.0 C113.8,99.7 119.0,89.6 119.0,89.6 C122.0,82.7 120.5,78.6 120.5,78.6 C119.2,72.0 123.4,76.3 123.4,76.3 C127.3,80.9 125.5,87.3 125.5,87.3 C122.9,97.6 130.6,101.9 134.4,103.2"
fill="currentColor"
style={{ transformOrigin: '130px 106px' }}
style={ { transformOrigin: '130px 106px' } }
></path>
<path
className="octo-body"
Expand Down

0 comments on commit 81fdf57

Please sign in to comment.