mirror of
https://github.com/facebook/react-native.git
synced 2025-11-01 09:14:26 +00:00
Updated docs for next
This commit is contained in:
Website Deployment Script
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@@ -1,4 +1,4 @@
|
||||
<!DOCTYPE html><html><head><title>0.36: Headless JS, the Keyboard API, & more</title><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"><meta name="viewport" content="width=device-width"><meta property="fb:app_id" content="1677033832619985"><meta property="fb:admins" content="121800083"><meta property="og:site_name" content="React Native"><meta property="og:title" content="0.36: Headless JS, the Keyboard API, & more"><meta property="og:url" content="https://facebook.github.io/react-native/blog/2016/10/25/0-36-headless-js-the-keyboard-api-and-more.html"><meta property="og:image" content="https://facebook.github.io/react-native/img/opengraph.png"><meta property="og:description" content="Today we are releasing React Native 0.36. Read on to learn more about what's new."><meta name="twitter:site" content="@reactnative"><meta name="twitter:card" content="summary_large_image"><meta property="og:type" content="article"><meta property="article:author" content="Héctor Ramos"><meta name="twitter:creator" content="@hectorramos"><base href="/react-native/releases/next/"><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"><link rel="shortcut icon" href="img/favicon.png?2"><link rel="stylesheet" href="css/react-native.css"><link rel="stylesheet" href="css/prism.css"><link rel="alternate" type="application/rss+xml" title="React Native Blog" href="https://facebook.github.io/react-native/blog/feed.xml"><link href="//cdn-images.mailchimp.com/embedcode/horizontal-slim-10_7.css" rel="stylesheet" type="text/css"><script type="text/javascript" src="//use.typekit.net/vqa1hcx.js"></script><script type="text/javascript">try{Typekit.load();}catch(e){}</script></head><body><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));</script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><div class="container"><div class="nav-main"><div class="wrap"><a class="nav-home" href=""><img src="img/header_logo.png">React Native</a><a class="nav-version" href="/react-native/versions.html">next</a><div class="nav-site-wrapper"><ul class="nav-site nav-site-internal"><li><a href="docs/getting-started.html" class="" data-target=".nav-docs">Docs</a></li><li><a href="/react-native/support.html" class="">Help</a></li><li><a href="/react-native/showcase.html" class="">Showcase</a></li><li><a href="/react-native/blog/" class="active">Blog</a></li></ul><div class="algolia-search-wrapper"><input id="algolia-doc-search" tabindex="0" type="text" placeholder="Search docs..."></div><ul class="nav-site nav-site-external"><li><a href="https://github.com/facebook/react-native" class="">GitHub</a></li><li><a href="http://facebook.github.io/react" class="">React</a></li></ul></div></div></div><div class="hero"><div class="wrap"><div class="text">React Native Blog</div><div class="minitext">Stay up-to-date with the latest React Native news and events.</div></div></div><section class="content wrap documentationContent"><article class="entry-body"><header class="entry-header"><h4 class="entry-authordate"><a href="https://twitter.com/hectorramos" target="_blank" class="author">Héctor Ramos</a> — <time class="date">October 25, 2016</time></h4><h1 class="entry-title">0.36: Headless JS, the Keyboard API, & more</h1></header><div class="entry-content"><div><p>Today we are releasing <a href="https://github.com/facebook/react-native/releases/tag/v0.36.0" target="_blank">React Native 0.36</a>. Read on to learn more about what's new.</p><h2><a class="anchor" name="headless-js"></a>Headless JS <a class="hash-link" href="#headless-js">#</a></h2><p>Headless JS is a way to run tasks in JavaScript while your app is in the background. It can be used, for example, to sync fresh data, handle push notifications, or play music. It is only available on Android, for now.</p><p>To get started, define your async task in a dedicated file (e.g. <code>SomeTaskName.js</code>):</p><div class="prism language-javascript">module<span class="token punctuation">.</span>exports <span class="token operator">=</span> <span class="token keyword">async</span> <span class="token punctuation">(</span>taskData<span class="token punctuation">)</span> <span class="token operator">=></span> <span class="token punctuation">{</span>
|
||||
<!DOCTYPE html><html><head><title>0.36: Headless JS, the Keyboard API, & more</title><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"><meta name="viewport" content="width=device-width"><meta property="fb:app_id" content="1677033832619985"><meta property="fb:admins" content="121800083"><meta property="og:site_name" content="React Native"><meta property="og:title" content="0.36: Headless JS, the Keyboard API, & more"><meta property="og:url" content="https://facebook.github.io/react-native/blog/2016/10/25/0-36-headless-js-the-keyboard-api-and-more.html"><meta property="og:image" content="https://facebook.github.io/react-native/img/opengraph.png"><meta property="og:description" content="Today we are releasing React Native 0.36. Read on to learn more about what's new."><meta name="twitter:site" content="@reactnative"><meta name="twitter:card" content="summary_large_image"><meta property="og:type" content="article"><meta property="article:author" content="Héctor Ramos"><meta name="twitter:creator" content="@hectorramos"><base href="/react-native/releases/next/"><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"><link rel="shortcut icon" href="img/favicon.png?2"><link rel="stylesheet" href="css/react-native.css"><link rel="stylesheet" href="css/prism.css"><link rel="alternate" type="application/rss+xml" title="React Native Blog" href="https://facebook.github.io/react-native/blog/feed.xml"><link href="//cdn-images.mailchimp.com/embedcode/horizontal-slim-10_7.css" rel="stylesheet" type="text/css"><script type="text/javascript" src="//use.typekit.net/vqa1hcx.js"></script><script type="text/javascript">try{Typekit.load();}catch(e){}</script></head><body><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));</script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><div class="container"><div class="nav-main"><div class="wrap"><a class="nav-home" href=""><img src="img/header_logo.png">React Native</a><a class="nav-version" href="/react-native/versions.html">next</a><div class="nav-site-wrapper"><ul class="nav-site nav-site-internal"><li><a href="docs/getting-started.html" class="" data-target=".nav-docs">Docs</a></li><li><a href="/react-native/support.html" class="">Help</a></li><li><a href="/react-native/blog/" class="active">Blog</a></li></ul><div class="algolia-search-wrapper"><input id="algolia-doc-search" tabindex="0" type="text" placeholder="Search docs..."></div><ul class="nav-site nav-site-external"><li><a href="https://github.com/facebook/react-native" class="">GitHub</a></li><li><a href="http://facebook.github.io/react" class="">React</a></li></ul></div></div></div><section class="content wrap documentationContent"><article class="entry-body"><header class="entry-header"><h4 class="entry-authordate"><a href="https://twitter.com/hectorramos" target="_blank" class="author">Héctor Ramos</a> — <time class="date">October 25, 2016</time></h4><h1 class="entry-title">0.36: Headless JS, the Keyboard API, & more</h1></header><div class="entry-content"><div><p>Today we are releasing <a href="https://github.com/facebook/react-native/releases/tag/v0.36.0" target="_blank">React Native 0.36</a>. Read on to learn more about what's new.</p><h2><a class="anchor" name="headless-js"></a>Headless JS <a class="hash-link" href="#headless-js">#</a></h2><p>Headless JS is a way to run tasks in JavaScript while your app is in the background. It can be used, for example, to sync fresh data, handle push notifications, or play music. It is only available on Android, for now.</p><p>To get started, define your async task in a dedicated file (e.g. <code>SomeTaskName.js</code>):</p><div class="prism language-javascript">module<span class="token punctuation">.</span>exports <span class="token operator">=</span> <span class="token keyword">async</span> <span class="token punctuation">(</span>taskData<span class="token punctuation">)</span> <span class="token operator">=></span> <span class="token punctuation">{</span>
|
||||
<span class="token comment" spellcheck="true"> // Perform your task here.
|
||||
</span><span class="token punctuation">}</span></div><p>Next, register your task in on <code>AppRegistry</code>:</p><div class="prism language-javascript">AppRegistry<span class="token punctuation">.</span><span class="token function">registerHeadlessTask</span><span class="token punctuation">(</span><span class="token string">'SomeTaskName'</span><span class="token punctuation">,</span> <span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token operator">=></span> <span class="token function">require</span><span class="token punctuation">(</span><span class="token string">'SomeTaskName'</span><span class="token punctuation">)</span><span class="token punctuation">)</span><span class="token punctuation">;</span></div><p>Using Headless JS does require some native Java code to be written in order to allow you to start up the service when needed. Take a look at our new <a href="/react-native/docs/headless-js-android.html" target="">Headless JS docs</a> to learn more!</p><h2><a class="anchor" name="the-keyboard-api"></a>The Keyboard API <a class="hash-link" href="#the-keyboard-api">#</a></h2><p>Working with the on-screen keyboard is now easier with <a href="/react-native/docs/keyboard.html" target=""><code>Keyboard</code></a>. You can now listen for native keyboard events and react to them. For example, to dismiss the active keyboard, simply call <code>Keyboard.dismiss()</code>:</p><div class="prism language-js"><span class="token keyword">import</span> <span class="token punctuation">{</span> Keyboard <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">'react-native'</span>
|
||||
<span class="token comment" spellcheck="true">
|
||||
@@ -11,7 +11,7 @@ Animated<span class="token punctuation">.</span><span class="token function">spr
|
||||
<span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">start</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span></div><p><code>b</code> will then follow <code>a</code>'s spring animation and produce the value of <code>1 / a</code>.</p><p>The basic usage is like this:</p><div class="prism language-javascript"><span class="token operator"><</span>Animated<span class="token punctuation">.</span>View style<span class="token operator">=</span><span class="token punctuation">{</span><span class="token punctuation">{</span>transform<span class="token punctuation">:</span> <span class="token punctuation">[</span><span class="token punctuation">{</span>scale<span class="token punctuation">:</span> a<span class="token punctuation">}</span><span class="token punctuation">]</span><span class="token punctuation">}</span><span class="token punctuation">}</span><span class="token operator">></span>
|
||||
<span class="token operator"><</span>Animated<span class="token punctuation">.</span>Image style<span class="token operator">=</span><span class="token punctuation">{</span><span class="token punctuation">{</span>transform<span class="token punctuation">:</span> <span class="token punctuation">[</span><span class="token punctuation">{</span>scale<span class="token punctuation">:</span> b<span class="token punctuation">}</span><span class="token punctuation">]</span><span class="token punctuation">}</span><span class="token punctuation">}</span> <span class="token operator">/</span><span class="token operator">></span>
|
||||
<span class="token operator"><</span>Animated<span class="token punctuation">.</span>View<span class="token operator">></span></div><p>In this example, the inner image won't get stretched at all because the parent's scaling gets cancelled out. If you'd like to learn more, check out the <a href="/react-native/docs/animations.html" target="">Animations guide</a>.</p><h2><a class="anchor" name="dark-status-bars"></a>Dark Status Bars <a class="hash-link" href="#dark-status-bars">#</a></h2><p>A new <code>barStyle</code> value has been added to <code>StatusBar</code>: <code>dark-content</code>. With this addition, you can now use <a href="/react-native/docs/statusbar.html#barstyle" target=""><code>barStyle</code></a> on both iOS and Android. The behavior will now be the following:</p><ul><li><code>default</code>: Use the platform default (light on iOS, dark on Android).</li><li><code>light-content</code>: Use a light status bar with black text and icons.</li><li><code>dark-content</code>: Use a dark status bar with white text and icons.</li></ul><h2><a class="anchor" name="and-more"></a>...and more <a class="hash-link" href="#and-more">#</a></h2><p>The above is just a sample of what has changed in 0.36. Check out the <a href="https://github.com/facebook/react-native/releases/tag/v0.36.0" target="_blank">release notes on GitHub</a> to see the full list of new features, bug fixes, and breaking changes.</p><p>You can upgrade to 0.36 by running the following commands in a terminal:</p><div class="prism language-bash">$ npm install <span class="token operator">--</span>save react<span class="token operator">-</span>native@<span class="token number">0.36</span>
|
||||
$ react<span class="token operator">-</span>native upgrade</div></div></div><div><aside class="author-info"><div class="author-image"><span class="the-image" style="background-image:url(https://s.gravatar.com/avatar/f2223874e66e884c99087e452501f2da?s=128);"></span></div><p class="posted-on">Posted on <time class="date">October 25, 2016</time></p><p class="name-title"><a href="https://twitter.com/hectorramos" target="_blank">Héctor Ramos</a>, <span class="title">Developer Advocate at Facebook</span></p></aside><aside class="entry-share"><h3 class="small-title">Share this post</h3><div class="social-buttons"><div class="fb-like" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div><a href="https://twitter.com/share" class="twitter-share-button" data-text="0.36: Headless JS, the Keyboard API, & more" data-url="http://facebook.github.io/react-native/blog/2016/10/25/0-36-headless-js-the-keyboard-api-and-more.html" data-via="hectorramos" data-related="reactnative" data-show-count="false">Tweet</a></div></aside></div></article></section><footer class="nav-footer"><section class="sitemap"><a href="/react-native" class="nav-home"><img src="img/header_logo.png" alt="React Native" width="66" height="58"></a><div><h5><a href="docs/">Docs</a></h5><a href="docs/getting-started.html">Getting Started</a><a href="docs/tutorial.html">Tutorial</a><a href="docs/integration-with-existing-apps.html">Integration With Existing Apps</a><a href="docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/support.html">Community</a></h5><a href="/react-native/showcase.html">Showcase</a><a href="http://www.meetup.com/topics/react-native/" target="_blank">Upcoming Events</a><a href="https://www.facebook.com/groups/react.native.community" target="_blank">Facebook Group</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a></div><div><h5><a href="/react-native/support.html">Help</a></h5><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a><a href="/react-native/versions.html" target="_blank">Latest Releases</a><a href="https://react-native.canny.io/feature-requests" target="_blank">Feature Requests</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://facebook.github.io/react/" target="_blank">React</a></div></section><section class="newsletter"><div id="mc_embed_signup"><form action="//reactnative.us10.list-manage.com/subscribe/post?u=db0dd948e2b729ee62625b1a8&id=47cd41008f" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate><div id="mc_embed_signup_scroll"><label for="mce-EMAIL"><h5>Get the React Native Newsletter</h5></label><input type="email" value="" name="EMAIL" class="email" id="mce-EMAIL" placeholder="email address" required><div style="position:absolute;left:-5000px;" aria-hidden="true"><input type="text" name="b_db0dd948e2b729ee62625b1a8_47cd41008f" tabindex="-1" value=""></div><div class="clear"><input type="submit" value="Sign up" name="subscribe" id="mc-embedded-subscribe" class="button"></div></div></form></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"></a><section class="copyright">Copyright © 2017 Facebook Inc.</section></footer></div><div id="fb-root"></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>
|
||||
$ react<span class="token operator">-</span>native upgrade</div></div></div><div><aside class="author-info"><div class="author-image"><span class="the-image" style="background-image:url(https://s.gravatar.com/avatar/f2223874e66e884c99087e452501f2da?s=128);"></span></div><p class="posted-on">Posted on <time class="date">October 25, 2016</time></p><p class="name-title"><a href="https://twitter.com/hectorramos" target="_blank">Héctor Ramos</a>, <span class="title">Developer Advocate at Facebook</span></p></aside><aside class="entry-share"><h3 class="small-title">Share this post</h3><div class="social-buttons"><div class="fb-like" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div><a href="https://twitter.com/share" class="twitter-share-button" data-text="0.36: Headless JS, the Keyboard API, & more" data-url="http://facebook.github.io/react-native/blog/2016/10/25/0-36-headless-js-the-keyboard-api-and-more.html" data-via="hectorramos" data-related="reactnative" data-show-count="false">Tweet</a></div></aside></div></article></section><footer class="nav-footer"><section class="sitemap"><a href="/react-native" class="nav-home"><img src="img/header_logo.png" alt="React Native" width="66" height="58"></a><div><h5><a href="docs/">Docs</a></h5><a href="docs/getting-started.html">Getting Started</a><a href="docs/tutorial.html">Learn the Basics</a><a href="docs/components-and-apis.html">Components and APIs</a><a href="docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/support.html">Community</a></h5><a href="/react-native/showcase.html">Who's using React Native?</a><a href="http://www.meetup.com/topics/react-native/" target="_blank">Meetups</a><a href="https://www.facebook.com/groups/react.native.community" target="_blank">Facebook Group</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a></div><div><h5><a href="/react-native/support.html">Help</a></h5><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a><a href="/react-native/versions.html" target="_blank">Latest Releases</a><a href="https://react-native.canny.io/feature-requests" target="_blank">Feature Requests</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="http://facebook.github.io/react/" target="_blank">React</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><div class="githubButton"><a class="github-button" href="https://github.com/facebook/react-native" data-icon="octicon-star" data-count-href="/facebook/react-native/stargazers" data-count-api="/repos/facebook/react-native#stargazers_count" data-count-aria-label="# stargazers on GitHub" aria-label="Star facebook/react-native on GitHub">Star</a></div></div></section><section class="newsletter"><div id="mc_embed_signup"><form action="//reactnative.us10.list-manage.com/subscribe/post?u=db0dd948e2b729ee62625b1a8&id=47cd41008f" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate><div id="mc_embed_signup_scroll"><label for="mce-EMAIL"><h5>Get the React Native Newsletter</h5></label><input type="email" value="" name="EMAIL" class="email" id="mce-EMAIL" placeholder="email address" required><div style="position:absolute;left:-5000px;" aria-hidden="true"><input type="text" name="b_db0dd948e2b729ee62625b1a8_47cd41008f" tabindex="-1" value=""></div><div class="clear"><input type="submit" value="Sign up" name="subscribe" id="mc-embedded-subscribe" class="button"></div></div></form></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"></a><section class="copyright">Copyright © 2017 Facebook Inc.</section></footer></div><div id="fb-root"></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>
|
||||
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
|
||||
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
|
||||
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
|
||||
@@ -29,4 +29,4 @@ $ react<span class="token operator">-</span>native upgrade</div></div></div><div
|
||||
inputSelector: '#algolia-doc-search',
|
||||
algoliaOptions: { facetFilters: [ "tags:master" ], hitsPerPage: 5 }
|
||||
});
|
||||
</script><script src="js/scripts.js"></script><script type="text/javascript" src="//s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script><script type="text/javascript">(function($) {window.fnames = new Array(); window.ftypes = new Array();fnames[0]='EMAIL';ftypes[0]='email';fnames[1]='FNAME';ftypes[1]='text';fnames[2]='LNAME';ftypes[2]='text';}(jQuery));var $mcj = jQuery.noConflict(true);</script><script type="text/javascript" src="https://snack.expo.io/embed.js"></script></body></html>
|
||||
</script><script src="js/scripts.js"></script><script type="text/javascript" src="//s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script><script type="text/javascript">(function($) {window.fnames = new Array(); window.ftypes = new Array();fnames[0]='EMAIL';ftypes[0]='email';fnames[1]='FNAME';ftypes[1]='text';fnames[2]='LNAME';ftypes[2]='text';}(jQuery));var $mcj = jQuery.noConflict(true);</script><script type="text/javascript" src="https://snack.expo.io/embed.js"></script><script async defer src="https://buttons.github.io/buttons.js"></script></body></html>
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@@ -1,10 +1,10 @@
|
||||
<!DOCTYPE html><html><head><title>idx: The Existential Function</title><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"><meta name="viewport" content="width=device-width"><meta property="fb:app_id" content="1677033832619985"><meta property="fb:admins" content="121800083"><meta property="og:site_name" content="React Native"><meta property="og:title" content="idx: The Existential Function"><meta property="og:url" content="https://facebook.github.io/react-native/blog/2017/03/13/idx-the-existential-function.html"><meta property="og:image" content="https://facebook.github.io/react-native/img/opengraph.png"><meta property="og:description" content="At Facebook, we often need to access deeply nested values in data structures fetched with GraphQL. On the way to accessing these deeply nested values, it is common for one or more intermediate fields to be nullable. These intermediate fields may be null for a variety of reasons, from failed privacy checks to the mere fact that null happens to be the most flexible way to represent non-fatal errors."><meta name="twitter:site" content="@reactnative"><meta name="twitter:card" content="summary_large_image"><meta property="og:type" content="article"><meta property="article:author" content="Timothy Yung"><meta name="twitter:creator" content="@yungsters"><base href="/react-native/releases/next/"><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"><link rel="shortcut icon" href="img/favicon.png?2"><link rel="stylesheet" href="css/react-native.css"><link rel="stylesheet" href="css/prism.css"><link rel="alternate" type="application/rss+xml" title="React Native Blog" href="https://facebook.github.io/react-native/blog/feed.xml"><link href="//cdn-images.mailchimp.com/embedcode/horizontal-slim-10_7.css" rel="stylesheet" type="text/css"><script type="text/javascript" src="//use.typekit.net/vqa1hcx.js"></script><script type="text/javascript">try{Typekit.load();}catch(e){}</script></head><body><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));</script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><div class="container"><div class="nav-main"><div class="wrap"><a class="nav-home" href=""><img src="img/header_logo.png">React Native</a><a class="nav-version" href="/react-native/versions.html">next</a><div class="nav-site-wrapper"><ul class="nav-site nav-site-internal"><li><a href="docs/getting-started.html" class="" data-target=".nav-docs">Docs</a></li><li><a href="/react-native/support.html" class="">Help</a></li><li><a href="/react-native/showcase.html" class="">Showcase</a></li><li><a href="/react-native/blog/" class="active">Blog</a></li></ul><div class="algolia-search-wrapper"><input id="algolia-doc-search" tabindex="0" type="text" placeholder="Search docs..."></div><ul class="nav-site nav-site-external"><li><a href="https://github.com/facebook/react-native" class="">GitHub</a></li><li><a href="http://facebook.github.io/react" class="">React</a></li></ul></div></div></div><div class="hero"><div class="wrap"><div class="text">React Native Blog</div><div class="minitext">Stay up-to-date with the latest React Native news and events.</div></div></div><section class="content wrap documentationContent"><article class="entry-body"><header class="entry-header"><h4 class="entry-authordate"><a href="https://github.com/yungsters" target="_blank" class="author">Timothy Yung</a> — <time class="date">March 13, 2017</time></h4><h1 class="entry-title">idx: The Existential Function</h1></header><div class="entry-content"><div><p>At Facebook, we often need to access deeply nested values in data structures fetched with GraphQL. On the way to accessing these deeply nested values, it is common for one or more intermediate fields to be nullable. These intermediate fields may be null for a variety of reasons, from failed privacy checks to the mere fact that null happens to be the most flexible way to represent non-fatal errors.</p><p>Unfortunately, accessing these deeply nested values is currently tedious and verbose.</p><div class="prism language-javascript">props<span class="token punctuation">.</span>user <span class="token operator">&&</span>
|
||||
<!DOCTYPE html><html><head><title>idx: The Existential Function</title><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"><meta name="viewport" content="width=device-width"><meta property="fb:app_id" content="1677033832619985"><meta property="fb:admins" content="121800083"><meta property="og:site_name" content="React Native"><meta property="og:title" content="idx: The Existential Function"><meta property="og:url" content="https://facebook.github.io/react-native/blog/2017/03/13/idx-the-existential-function.html"><meta property="og:image" content="https://facebook.github.io/react-native/img/opengraph.png"><meta property="og:description" content="At Facebook, we often need to access deeply nested values in data structures fetched with GraphQL. On the way to accessing these deeply nested values, it is common for one or more intermediate fields to be nullable. These intermediate fields may be null for a variety of reasons, from failed privacy checks to the mere fact that null happens to be the most flexible way to represent non-fatal errors."><meta name="twitter:site" content="@reactnative"><meta name="twitter:card" content="summary_large_image"><meta property="og:type" content="article"><meta property="article:author" content="Timothy Yung"><meta name="twitter:creator" content="@yungsters"><base href="/react-native/releases/next/"><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"><link rel="shortcut icon" href="img/favicon.png?2"><link rel="stylesheet" href="css/react-native.css"><link rel="stylesheet" href="css/prism.css"><link rel="alternate" type="application/rss+xml" title="React Native Blog" href="https://facebook.github.io/react-native/blog/feed.xml"><link href="//cdn-images.mailchimp.com/embedcode/horizontal-slim-10_7.css" rel="stylesheet" type="text/css"><script type="text/javascript" src="//use.typekit.net/vqa1hcx.js"></script><script type="text/javascript">try{Typekit.load();}catch(e){}</script></head><body><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));</script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><div class="container"><div class="nav-main"><div class="wrap"><a class="nav-home" href=""><img src="img/header_logo.png">React Native</a><a class="nav-version" href="/react-native/versions.html">next</a><div class="nav-site-wrapper"><ul class="nav-site nav-site-internal"><li><a href="docs/getting-started.html" class="" data-target=".nav-docs">Docs</a></li><li><a href="/react-native/support.html" class="">Help</a></li><li><a href="/react-native/blog/" class="active">Blog</a></li></ul><div class="algolia-search-wrapper"><input id="algolia-doc-search" tabindex="0" type="text" placeholder="Search docs..."></div><ul class="nav-site nav-site-external"><li><a href="https://github.com/facebook/react-native" class="">GitHub</a></li><li><a href="http://facebook.github.io/react" class="">React</a></li></ul></div></div></div><section class="content wrap documentationContent"><article class="entry-body"><header class="entry-header"><h4 class="entry-authordate"><a href="https://github.com/yungsters" target="_blank" class="author">Timothy Yung</a> — <time class="date">March 13, 2017</time></h4><h1 class="entry-title">idx: The Existential Function</h1></header><div class="entry-content"><div><p>At Facebook, we often need to access deeply nested values in data structures fetched with GraphQL. On the way to accessing these deeply nested values, it is common for one or more intermediate fields to be nullable. These intermediate fields may be null for a variety of reasons, from failed privacy checks to the mere fact that null happens to be the most flexible way to represent non-fatal errors.</p><p>Unfortunately, accessing these deeply nested values is currently tedious and verbose.</p><div class="prism language-javascript">props<span class="token punctuation">.</span>user <span class="token operator">&&</span>
|
||||
props<span class="token punctuation">.</span>user<span class="token punctuation">.</span>friends <span class="token operator">&&</span>
|
||||
props<span class="token punctuation">.</span>user<span class="token punctuation">.</span>friends<span class="token punctuation">[</span><span class="token number">0</span><span class="token punctuation">]</span> <span class="token operator">&&</span>
|
||||
props<span class="token punctuation">.</span>user<span class="token punctuation">.</span>friends<span class="token punctuation">[</span><span class="token number">0</span><span class="token punctuation">]</span><span class="token punctuation">.</span>friends</div><p>There is <a href="https://github.com/claudepache/es-optional-chaining" target="_blank">an ECMAScript proposal to introduce the existential operator</a> which will make this much more convenient. But until a time when that proposal is finalized, we want a solution that improves our quality of life, maintains existing language semantics, and encourages type safety with Flow.</p><p>We came up with an existential <em>function</em> we call <code>idx</code>.</p><div class="prism language-javascript"><span class="token function">idx</span><span class="token punctuation">(</span>props<span class="token punctuation">,</span> _ <span class="token operator">=></span> _<span class="token punctuation">.</span>user<span class="token punctuation">.</span>friends<span class="token punctuation">[</span><span class="token number">0</span><span class="token punctuation">]</span><span class="token punctuation">.</span>friends<span class="token punctuation">)</span></div><p>The invocation in this code snippet behaves similarly to the boolean expression in the code snippet above, except with significantly less repetition. The <code>idx</code> function takes exactly two arguments:</p><ul><li>Any value, typically an object or array into which you want to access a nested value.</li><li>A function that receives the first argument and accesses a nested value on it.</li></ul><p>In theory, the <code>idx</code> function will try-catch errors that are the result of accessing properties on null or undefined. If such an error is caught, it will return either null or undefined. (And you can see how this might be implemented in <a href="https://github.com/facebookincubator/idx/blob/master/packages/idx/src/idx.js" target="_blank">idx.js</a>.)</p><p>In practice, try-catching every nested property access is slow, and differentiating between specific kinds of TypeErrors is fragile. To deal with these shortcomings, we created a Babel plugin that transforms the above <code>idx</code> invocation into the following expression:</p><div class="prism language-javascript">props<span class="token punctuation">.</span>user <span class="token operator">==</span> <span class="token keyword">null</span> <span class="token operator">?</span> props<span class="token punctuation">.</span>user <span class="token punctuation">:</span>
|
||||
props<span class="token punctuation">.</span>user<span class="token punctuation">.</span>friends <span class="token operator">==</span> <span class="token keyword">null</span> <span class="token operator">?</span> props<span class="token punctuation">.</span>user<span class="token punctuation">.</span>friends <span class="token punctuation">:</span>
|
||||
props<span class="token punctuation">.</span>user<span class="token punctuation">.</span>friends<span class="token punctuation">[</span><span class="token number">0</span><span class="token punctuation">]</span> <span class="token operator">==</span> <span class="token keyword">null</span> <span class="token operator">?</span> props<span class="token punctuation">.</span>user<span class="token punctuation">.</span>friends<span class="token punctuation">[</span><span class="token number">0</span><span class="token punctuation">]</span> <span class="token punctuation">:</span>
|
||||
props<span class="token punctuation">.</span>user<span class="token punctuation">.</span>friends<span class="token punctuation">[</span><span class="token number">0</span><span class="token punctuation">]</span><span class="token punctuation">.</span>friends</div><p>Finally, we added a custom Flow type declaration for <code>idx</code> that allows the traversal in the second argument to be properly type-checked while permitting nested access on nullable properties.</p><p>The function, Babel plugin, and Flow declaration are now <a href="https://github.com/facebookincubator/idx" target="_blank">available on GitHub</a>. They are used by installing the <strong>idx</strong> and <strong>babel-plugin-idx</strong> npm packages, and adding “idx” to the list of plugins in your <code>.babelrc</code> file.</p></div></div><div><aside class="author-info"><div class="author-image"><span class="the-image" style="background-image:url(https://pbs.twimg.com/profile_images/1592444107/image.jpg);"></span></div><p class="posted-on">Posted on <time class="date">March 13, 2017</time></p><p class="name-title"><a href="https://github.com/yungsters" target="_blank">Timothy Yung</a>, <span class="title">Engineering Manager at Facebook</span></p></aside><aside class="entry-share"><h3 class="small-title">Share this post</h3><div class="social-buttons"><div class="fb-like" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div><a href="https://twitter.com/share" class="twitter-share-button" data-text="idx: The Existential Function" data-url="http://facebook.github.io/react-native/blog/2017/03/13/idx-the-existential-function.html" data-via="yungsters" data-related="reactnative" data-show-count="false">Tweet</a></div></aside></div></article></section><footer class="nav-footer"><section class="sitemap"><a href="/react-native" class="nav-home"><img src="img/header_logo.png" alt="React Native" width="66" height="58"></a><div><h5><a href="docs/">Docs</a></h5><a href="docs/getting-started.html">Getting Started</a><a href="docs/tutorial.html">Tutorial</a><a href="docs/integration-with-existing-apps.html">Integration With Existing Apps</a><a href="docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/support.html">Community</a></h5><a href="/react-native/showcase.html">Showcase</a><a href="http://www.meetup.com/topics/react-native/" target="_blank">Upcoming Events</a><a href="https://www.facebook.com/groups/react.native.community" target="_blank">Facebook Group</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a></div><div><h5><a href="/react-native/support.html">Help</a></h5><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a><a href="/react-native/versions.html" target="_blank">Latest Releases</a><a href="https://react-native.canny.io/feature-requests" target="_blank">Feature Requests</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://facebook.github.io/react/" target="_blank">React</a></div></section><section class="newsletter"><div id="mc_embed_signup"><form action="//reactnative.us10.list-manage.com/subscribe/post?u=db0dd948e2b729ee62625b1a8&id=47cd41008f" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate><div id="mc_embed_signup_scroll"><label for="mce-EMAIL"><h5>Get the React Native Newsletter</h5></label><input type="email" value="" name="EMAIL" class="email" id="mce-EMAIL" placeholder="email address" required><div style="position:absolute;left:-5000px;" aria-hidden="true"><input type="text" name="b_db0dd948e2b729ee62625b1a8_47cd41008f" tabindex="-1" value=""></div><div class="clear"><input type="submit" value="Sign up" name="subscribe" id="mc-embedded-subscribe" class="button"></div></div></form></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"></a><section class="copyright">Copyright © 2017 Facebook Inc.</section></footer></div><div id="fb-root"></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>
|
||||
props<span class="token punctuation">.</span>user<span class="token punctuation">.</span>friends<span class="token punctuation">[</span><span class="token number">0</span><span class="token punctuation">]</span><span class="token punctuation">.</span>friends</div><p>Finally, we added a custom Flow type declaration for <code>idx</code> that allows the traversal in the second argument to be properly type-checked while permitting nested access on nullable properties.</p><p>The function, Babel plugin, and Flow declaration are now <a href="https://github.com/facebookincubator/idx" target="_blank">available on GitHub</a>. They are used by installing the <strong>idx</strong> and <strong>babel-plugin-idx</strong> npm packages, and adding “idx” to the list of plugins in your <code>.babelrc</code> file.</p></div></div><div><aside class="author-info"><div class="author-image"><span class="the-image" style="background-image:url(https://pbs.twimg.com/profile_images/1592444107/image.jpg);"></span></div><p class="posted-on">Posted on <time class="date">March 13, 2017</time></p><p class="name-title"><a href="https://github.com/yungsters" target="_blank">Timothy Yung</a>, <span class="title">Engineering Manager at Facebook</span></p></aside><aside class="entry-share"><h3 class="small-title">Share this post</h3><div class="social-buttons"><div class="fb-like" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div><a href="https://twitter.com/share" class="twitter-share-button" data-text="idx: The Existential Function" data-url="http://facebook.github.io/react-native/blog/2017/03/13/idx-the-existential-function.html" data-via="yungsters" data-related="reactnative" data-show-count="false">Tweet</a></div></aside></div></article></section><footer class="nav-footer"><section class="sitemap"><a href="/react-native" class="nav-home"><img src="img/header_logo.png" alt="React Native" width="66" height="58"></a><div><h5><a href="docs/">Docs</a></h5><a href="docs/getting-started.html">Getting Started</a><a href="docs/tutorial.html">Learn the Basics</a><a href="docs/components-and-apis.html">Components and APIs</a><a href="docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/support.html">Community</a></h5><a href="/react-native/showcase.html">Who's using React Native?</a><a href="http://www.meetup.com/topics/react-native/" target="_blank">Meetups</a><a href="https://www.facebook.com/groups/react.native.community" target="_blank">Facebook Group</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a></div><div><h5><a href="/react-native/support.html">Help</a></h5><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a><a href="/react-native/versions.html" target="_blank">Latest Releases</a><a href="https://react-native.canny.io/feature-requests" target="_blank">Feature Requests</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="http://facebook.github.io/react/" target="_blank">React</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><div class="githubButton"><a class="github-button" href="https://github.com/facebook/react-native" data-icon="octicon-star" data-count-href="/facebook/react-native/stargazers" data-count-api="/repos/facebook/react-native#stargazers_count" data-count-aria-label="# stargazers on GitHub" aria-label="Star facebook/react-native on GitHub">Star</a></div></div></section><section class="newsletter"><div id="mc_embed_signup"><form action="//reactnative.us10.list-manage.com/subscribe/post?u=db0dd948e2b729ee62625b1a8&id=47cd41008f" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate><div id="mc_embed_signup_scroll"><label for="mce-EMAIL"><h5>Get the React Native Newsletter</h5></label><input type="email" value="" name="EMAIL" class="email" id="mce-EMAIL" placeholder="email address" required><div style="position:absolute;left:-5000px;" aria-hidden="true"><input type="text" name="b_db0dd948e2b729ee62625b1a8_47cd41008f" tabindex="-1" value=""></div><div class="clear"><input type="submit" value="Sign up" name="subscribe" id="mc-embedded-subscribe" class="button"></div></div></form></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"></a><section class="copyright">Copyright © 2017 Facebook Inc.</section></footer></div><div id="fb-root"></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>
|
||||
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
|
||||
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
|
||||
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
|
||||
@@ -22,4 +22,4 @@ props<span class="token punctuation">.</span>user<span class="token punctuation"
|
||||
inputSelector: '#algolia-doc-search',
|
||||
algoliaOptions: { facetFilters: [ "tags:master" ], hitsPerPage: 5 }
|
||||
});
|
||||
</script><script src="js/scripts.js"></script><script type="text/javascript" src="//s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script><script type="text/javascript">(function($) {window.fnames = new Array(); window.ftypes = new Array();fnames[0]='EMAIL';ftypes[0]='email';fnames[1]='FNAME';ftypes[1]='text';fnames[2]='LNAME';ftypes[2]='text';}(jQuery));var $mcj = jQuery.noConflict(true);</script><script type="text/javascript" src="https://snack.expo.io/embed.js"></script></body></html>
|
||||
</script><script src="js/scripts.js"></script><script type="text/javascript" src="//s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script><script type="text/javascript">(function($) {window.fnames = new Array(); window.ftypes = new Array();fnames[0]='EMAIL';ftypes[0]='email';fnames[1]='FNAME';ftypes[1]='text';fnames[2]='LNAME';ftypes[2]='text';}(jQuery));var $mcj = jQuery.noConflict(true);</script><script type="text/javascript" src="https://snack.expo.io/embed.js"></script><script async defer src="https://buttons.github.io/buttons.js"></script></body></html>
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
+2
-2
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@@ -443,7 +443,7 @@ h1, h2, h3, h4 {
|
||||
line-height: 40px; }
|
||||
|
||||
h1 {
|
||||
font-size: 39px; }
|
||||
font-size: 40px; }
|
||||
|
||||
h2 {
|
||||
font-size: 31px; }
|
||||
@@ -506,6 +506,9 @@ html * {
|
||||
color-profile: sRGB;
|
||||
rendering-intent: auto; }
|
||||
|
||||
.content {
|
||||
font-size: 18px;
|
||||
}
|
||||
.subHeader {
|
||||
font-size: 21px;
|
||||
font-weight: 300;
|
||||
@@ -605,7 +608,9 @@ h1:hover .hash-link, h2:hover .hash-link, h3:hover .hash-link, h4:hover .hash-li
|
||||
text-decoration: none; }
|
||||
|
||||
.nav-main .nav-site-wrapper {
|
||||
display: inline; }
|
||||
display: inline;
|
||||
float: right;
|
||||
}
|
||||
|
||||
.nav-main .nav-site-internal {
|
||||
margin: 0 0 0 20px; }
|
||||
@@ -719,7 +724,7 @@ h1:hover .hash-link, h2:hover .hash-link, h3:hover .hash-link, h4:hover .hash-li
|
||||
padding-bottom: 0; }
|
||||
.nav-docs-section h3 {
|
||||
color: white;
|
||||
font-size: 16px;
|
||||
font-size: 18px;
|
||||
font-weight: 400;
|
||||
line-height: 20px;
|
||||
margin-top: 0;
|
||||
@@ -928,7 +933,8 @@ h1:hover .hash-link, h2:hover .hash-link, h3:hover .hash-link, h4:hover .hash-li
|
||||
margin-bottom: 60px; }
|
||||
|
||||
.docs-nextprev {
|
||||
*zoom: 1; }
|
||||
*zoom: 1;
|
||||
}
|
||||
|
||||
.docs-nextprev:before, .docs-nextprev:after {
|
||||
content: " ";
|
||||
@@ -1002,7 +1008,7 @@ h2 {
|
||||
.docs-prevnext {
|
||||
min-width: 320px;
|
||||
max-width: 640px;
|
||||
margin: 0 auto 40px;
|
||||
margin: 40px auto;
|
||||
padding-bottom: 20px; }
|
||||
|
||||
.button {
|
||||
@@ -1534,7 +1540,7 @@ table.versions {
|
||||
|
||||
.edit-page-block {
|
||||
padding: 5px;
|
||||
margin-bottom: 40px;
|
||||
margin: 40px auto;
|
||||
font-size: 12px;
|
||||
color: #887766;
|
||||
text-align: center;
|
||||
@@ -1987,7 +1993,7 @@ article li {
|
||||
padding: 9px 18px;
|
||||
border-radius: 4px;
|
||||
text-align: center;
|
||||
font-size: 12px; }
|
||||
}
|
||||
|
||||
.btn a {
|
||||
text-decoration: none !important; }
|
||||
@@ -2019,7 +2025,7 @@ article li {
|
||||
footer.nav-footer {
|
||||
box-sizing: border-box;
|
||||
border: none;
|
||||
font-weight: 300;
|
||||
font-weight: normal;
|
||||
color: #202020;
|
||||
font-size: 15px;
|
||||
line-height: 24px;
|
||||
@@ -2085,7 +2091,8 @@ footer .sitemap h6,
|
||||
footer .sitemap h5 > a,
|
||||
footer .sitemap h6 > a {
|
||||
color: #05A5D1;
|
||||
font-weight: 900; }
|
||||
font-size: 15px;
|
||||
}
|
||||
|
||||
footer .sitemap h5 > a,
|
||||
footer .sitemap h6 > a {
|
||||
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user