mirror of
https://github.com/status-im/react-native.git
synced 2025-01-09 17:15:54 +00:00
00c77800c9
Summary: Fixes #7519 JS detects handheld device by sniffing UA string (very primitive detection). If on handheld device, event listener is registered. Event handler toggles Docs Navigation overlay after clicking on "Docs" nav button. Original Docs Navigation panel is taken out of the natural page flow using pure CSS and is styled to look "good" on device. As a result of this, Navigation overlay is ONLY visible when you are at Docs page, otherwise "Docs" nav button takes you Docs page first. iPhone/iPad previews   Closes https://github.com/facebook/react-native/pull/7640 Differential Revision: D3325440 Pulled By: vjeux fbshipit-source-id: a06b21d743d56bfea5db5b750836856c3af9bbe2
60 lines
1.7 KiB
JavaScript
60 lines
1.7 KiB
JavaScript
/**
|
|
* Copyright (c) 2015-present, Facebook, Inc.
|
|
* All rights reserved.
|
|
*
|
|
* This source code is licensed under the BSD-style license found in the
|
|
* LICENSE file in the root directory of this source tree. An additional grant
|
|
* of patent rights can be found in the PATENTS file in the same directory.
|
|
*
|
|
* @providesModule HeaderLinks
|
|
*/
|
|
|
|
var React = require('React');
|
|
var AlgoliaDocSearch = require('AlgoliaDocSearch');
|
|
|
|
var HeaderLinks = React.createClass({
|
|
linksInternal: [
|
|
{section: 'docs', href: 'docs/getting-started.html', text: 'Docs', target: '.nav-docs'},
|
|
{section: 'support', href: 'support.html', text: 'Support'},
|
|
{section: 'showcase', href: 'showcase.html', text: 'Showcase'},
|
|
{section: 'blog', href: 'blog/', text: 'Blog'},
|
|
],
|
|
linksExternal: [
|
|
{section: 'github', href: 'https://github.com/facebook/react-native', text: 'GitHub'},
|
|
{section: 'react', href: 'http://facebook.github.io/react', text: 'React'},
|
|
],
|
|
|
|
makeLinks: function(links) {
|
|
return links.map(function(link) {
|
|
return (
|
|
<li key={link.section}>
|
|
<a
|
|
href={link.href}
|
|
className={link.section === this.props.section ? 'active' : ''}
|
|
data-target={link.target}>
|
|
{link.text}
|
|
</a>
|
|
</li>
|
|
);
|
|
}, this);
|
|
},
|
|
|
|
render: function() {
|
|
return (
|
|
<div className="nav-site-wrapper">
|
|
<ul className="nav-site nav-site-internal">
|
|
{this.makeLinks(this.linksInternal)}
|
|
</ul>
|
|
|
|
<AlgoliaDocSearch />
|
|
|
|
<ul className="nav-site nav-site-external">
|
|
{this.makeLinks(this.linksExternal)}
|
|
</ul>
|
|
</div>
|
|
);
|
|
}
|
|
});
|
|
|
|
module.exports = HeaderLinks;
|