elastic · cjcenizal · Jan 9, 2018 · Jan 3, 2018 · Jan 6, 2018 · Jan 6, 2018
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,9 +1,16 @@
 # [`master`](https://github.com/elastic/eui/tree/master)
 
 - Added Apache, Nginx, MySQL logos [(#270)](https://github.com/elastic/eui/pull/270)
-- Fixed `<EuiContextMenu>` to pass the `event` argument to a `<EuiContextMenuItem>`'s `onClick` handler even when a panel is defined. [(#265)](https://github.com/elastic/eui/pull/265)
 - Added small version of `EuiCallOut` [(#269)](https://github.com/elastic/eui/pull/269)
 
+**Bug fixes**
+
+- Fixed `<EuiContextMenu>` to pass the `event` argument to a `<EuiContextMenuItem>`'s `onClick` handler even when a panel is defined. [(#265)](https://github.com/elastic/eui/pull/265)
+
+**Breaking changes**
+
+- Removed `color` prop from `<EuiCodeBlock>`. This component's highlighting now matches whichever theme is currently active. [(#259)](https://github.com/elastic/eui/pull/259)
+
 # [`0.0.11`](https://github.com/elastic/eui/tree/v0.0.11)
 
 - Added `<EuiImage>` component to allow for image sizing and zooms. [(#262)](https://github.com/elastic/eui/pull/262)

diff --git a/src-docs/src/components/guide_section/guide_section.js b/src-docs/src/components/guide_section/guide_section.js
@@ -1,5 +1,5 @@
-import PropTypes from 'prop-types';
 import React, { Component } from 'react';
+import PropTypes from 'prop-types';
 
 import {
   GuideSandboxChrome,
@@ -119,7 +119,6 @@ export class GuideSection extends Component {
       <div key={name} ref={name}>
         <EuiCodeBlock
           language={codeClass}
-          color="dark"
           overflowHeight={400}
         >
           {source.code}
@@ -144,9 +143,11 @@ export class GuideSection extends Component {
   }
 
   render() {
+    const chrome = this.renderChrome();
+
     return (
       <div className="guideSection" id={this.props.id}>
-        {this.renderChrome()}
+        {chrome}
         {this.renderContent()}
       </div>
     );

diff --git a/src-docs/src/views/code/code_example.js b/src-docs/src/views/code/code_example.js
@@ -53,7 +53,6 @@ export const CodeExample = {
         </p>
         <ul>
           <li><EuiCode>language</EuiCode> sets the syntax highlighting for a specific language.</li>
-          <li><EuiCode>color</EuiCode> accepts dark (default) or light.</li>
           <li><EuiCode>paddingSize</EuiCode> accepts &ldquo;s&rdquo; / &ldquo;m&rdquo; / &ldquo;l&rdquo; (default).</li>
           <li><EuiCode>fontSize</EuiCode> accepts &ldquo;s&rdquo; (default) / &ldquo;m&rdquo; / &ldquo;l&rdquo;.</li>
           <li><EuiCode>overflowHeight</EuiCode> accepts a number. By default it is not set.</li>

diff --git a/src/components/code/__snapshots__/_code_block.test.js.snap b/src/components/code/__snapshots__/_code_block.test.js.snap
@@ -2,7 +2,7 @@
 
 exports[`EuiCodeBlockImpl block highlights javascript code, adding "js" class 1`] = `
 <div
-  class="euiCodeBlock euiCodeBlock--light euiCodeBlock--fontSmall euiCodeBlock--paddingLarge"
+  class="euiCodeBlock euiCodeBlock--fontSmall euiCodeBlock--paddingLarge"
 >
   <pre
     class="euiCodeBlock__pre"
@@ -11,12 +11,30 @@ exports[`EuiCodeBlockImpl block highlights javascript code, adding "js" class 1`
       class="euiCodeBlock__code js"
     />
   </pre>
+  <button
+    aria-label="Expand"
+    class="euiButtonIcon euiButtonIcon--primary euiCodeBlock__fullScreenButton"
+    type="button"
+  >
+    <svg
+      aria-hidden="true"
+      class="euiIcon euiButtonIcon__icon euiIcon--medium"
+      height="16"
+      width="16"
+      xmlns="http://www.w3.org/2000/svg"
+    >
+      <path
+        d="M2.014 10.777l-.043 2.8a.52.52 0 0 0 .544.544l2.8-.043a.526.526 0 0 1 .546.546.598.598 0 0 1-.575.575l-2.802.044A1.571 1.571 0 0 1 .85 13.609l.044-2.802a.598.598 0 0 1 .575-.575.526.526 0 0 1 .545.545zm12.064-5.461l.043-2.801a.52.52 0 0 0-.543-.544l-2.801.043a.526.526 0 0 1-.545-.545.598.598 0 0 1 .575-.575L13.609.85a1.571 1.571 0 0 1 1.634 1.634l-.044 2.802a.598.598 0 0 1-.575.575.526.526 0 0 1-.546-.545zm-9.724 7.038a.5.5 0 0 1-.708-.708l8-8a.5.5 0 0 1 .708.708l-8 8z"
+        fill-rule="evenodd"
+      />
+    </svg>
+  </button>
 </div>
 `;
 
 exports[`EuiCodeBlockImpl block renders a pre block tag 1`] = `
 <div
-  class="euiCodeBlock euiCodeBlock--light euiCodeBlock--fontSmall euiCodeBlock--paddingLarge testClass1 testClass2"
+  class="euiCodeBlock euiCodeBlock--fontSmall euiCodeBlock--paddingLarge testClass1 testClass2"
 >
   <pre
     class="euiCodeBlock__pre"
@@ -30,26 +48,30 @@ exports[`EuiCodeBlockImpl block renders a pre block tag 1`] = `
 console.log(some);
     </code>
   </pre>
-</div>
-`;
-
-exports[`EuiCodeBlockImpl block renders with dark theme 1`] = `
-<div
-  class="euiCodeBlock euiCodeBlock--dark euiCodeBlock--fontSmall euiCodeBlock--paddingLarge"
->
-  <pre
-    class="euiCodeBlock__pre"
+  <button
+    aria-label="Expand"
+    class="euiButtonIcon euiButtonIcon--primary euiCodeBlock__fullScreenButton"
+    type="button"
   >
-    <code
-      class="euiCodeBlock__code"
-    />
-  </pre>
+    <svg
+      aria-hidden="true"
+      class="euiIcon euiButtonIcon__icon euiIcon--medium"
+      height="16"
+      width="16"
+      xmlns="http://www.w3.org/2000/svg"
+    >
+      <path
+        d="M2.014 10.777l-.043 2.8a.52.52 0 0 0 .544.544l2.8-.043a.526.526 0 0 1 .546.546.598.598 0 0 1-.575.575l-2.802.044A1.571 1.571 0 0 1 .85 13.609l.044-2.802a.598.598 0 0 1 .575-.575.526.526 0 0 1 .545.545zm12.064-5.461l.043-2.801a.52.52 0 0 0-.543-.544l-2.801.043a.526.526 0 0 1-.545-.545.598.598 0 0 1 .575-.575L13.609.85a1.571 1.571 0 0 1 1.634 1.634l-.044 2.802a.598.598 0 0 1-.575.575.526.526 0 0 1-.546-.545zm-9.724 7.038a.5.5 0 0 1-.708-.708l8-8a.5.5 0 0 1 .708.708l-8 8z"
+        fill-rule="evenodd"
+      />
+    </svg>
+  </button>
 </div>
 `;
 
 exports[`EuiCodeBlockImpl block renders with transparent background 1`] = `
 <div
-  class="euiCodeBlock euiCodeBlock--light euiCodeBlock--fontSmall euiCodeBlock--paddingLarge euiCodeBlock--transparentBackground"
+  class="euiCodeBlock euiCodeBlock--fontSmall euiCodeBlock--paddingLarge euiCodeBlock--transparentBackground"
 >
   <pre
     class="euiCodeBlock__pre"
@@ -58,12 +80,30 @@ exports[`EuiCodeBlockImpl block renders with transparent background 1`] = `
       class="euiCodeBlock__code"
     />
   </pre>
+  <button
+    aria-label="Expand"
+    class="euiButtonIcon euiButtonIcon--primary euiCodeBlock__fullScreenButton"
+    type="button"
+  >
+    <svg
+      aria-hidden="true"
+      class="euiIcon euiButtonIcon__icon euiIcon--medium"
+      height="16"
+      width="16"
+      xmlns="http://www.w3.org/2000/svg"
+    >
+      <path
+        d="M2.014 10.777l-.043 2.8a.52.52 0 0 0 .544.544l2.8-.043a.526.526 0 0 1 .546.546.598.598 0 0 1-.575.575l-2.802.044A1.571 1.571 0 0 1 .85 13.609l.044-2.802a.598.598 0 0 1 .575-.575.526.526 0 0 1 .545.545zm12.064-5.461l.043-2.801a.52.52 0 0 0-.543-.544l-2.801.043a.526.526 0 0 1-.545-.545.598.598 0 0 1 .575-.575L13.609.85a1.571 1.571 0 0 1 1.634 1.634l-.044 2.802a.598.598 0 0 1-.575.575.526.526 0 0 1-.546-.545zm-9.724 7.038a.5.5 0 0 1-.708-.708l8-8a.5.5 0 0 1 .708.708l-8 8z"
+        fill-rule="evenodd"
+      />
+    </svg>
+  </button>
 </div>
 `;
 
 exports[`EuiCodeBlockImpl inline highlights javascript code, adding "js" class 1`] = `
 <span
-  class="euiCodeBlock euiCodeBlock--light euiCodeBlock--fontSmall euiCodeBlock--paddingLarge euiCodeBlock--inline"
+  class="euiCodeBlock euiCodeBlock--fontSmall euiCodeBlock--paddingLarge euiCodeBlock--inline"
 >
   <code
     class="euiCodeBlock__code js"
@@ -73,7 +113,7 @@ exports[`EuiCodeBlockImpl inline highlights javascript code, adding "js" class 1
 
 exports[`EuiCodeBlockImpl inline renders an inline code tag 1`] = `
 <span
-  class="euiCodeBlock euiCodeBlock--light euiCodeBlock--fontSmall euiCodeBlock--paddingLarge euiCodeBlock--inline testClass1 testClass2"
+  class="euiCodeBlock euiCodeBlock--fontSmall euiCodeBlock--paddingLarge euiCodeBlock--inline testClass1 testClass2"
 >
   <code
     aria-label="aria-label"
@@ -86,19 +126,9 @@ console.log(some);
 </span>
 `;
 
-exports[`EuiCodeBlockImpl inline renders with dark theme 1`] = `
-<span
-  class="euiCodeBlock euiCodeBlock--dark euiCodeBlock--fontSmall euiCodeBlock--paddingLarge euiCodeBlock--inline"
->
-  <code
-    class="euiCodeBlock__code"
-  />
-</span>
-`;
-
 exports[`EuiCodeBlockImpl inline renders with transparent background 1`] = `
 <span
-  class="euiCodeBlock euiCodeBlock--light euiCodeBlock--fontSmall euiCodeBlock--paddingLarge euiCodeBlock--transparentBackground euiCodeBlock--inline"
+  class="euiCodeBlock euiCodeBlock--fontSmall euiCodeBlock--paddingLarge euiCodeBlock--transparentBackground euiCodeBlock--inline"
 >
   <code
     class="euiCodeBlock__code"

diff --git a/src/components/code/__snapshots__/code.test.js.snap b/src/components/code/__snapshots__/code.test.js.snap
@@ -2,7 +2,7 @@
 
 exports[`EuiCode renders a code snippet 1`] = `
 <span
-  class="euiCodeBlock euiCodeBlock--light euiCodeBlock--fontSmall euiCodeBlock--paddingLarge euiCodeBlock--inline testClass1 testClass2"
+  class="euiCodeBlock euiCodeBlock--fontSmall euiCodeBlock--paddingLarge euiCodeBlock--inline testClass1 testClass2"
 >
   <code
     aria-label="aria-label"

diff --git a/src/components/code/__snapshots__/code_block.test.js.snap b/src/components/code/__snapshots__/code_block.test.js.snap
@@ -2,7 +2,7 @@
 
 exports[`EuiCodeBlock renders a code block 1`] = `
 <div
-  class="euiCodeBlock euiCodeBlock--light euiCodeBlock--fontSmall euiCodeBlock--paddingLarge testClass1 testClass2"
+  class="euiCodeBlock euiCodeBlock--fontSmall euiCodeBlock--paddingLarge testClass1 testClass2"
 >
   <pre
     class="euiCodeBlock__pre"
@@ -16,5 +16,23 @@ exports[`EuiCodeBlock renders a code block 1`] = `
 console.log(some);
     </code>
   </pre>
+  <button
+    aria-label="Expand"
+    class="euiButtonIcon euiButtonIcon--primary euiCodeBlock__fullScreenButton"
+    type="button"
+  >
+    <svg
+      aria-hidden="true"
+      class="euiIcon euiButtonIcon__icon euiIcon--medium"
+      height="16"
+      width="16"
+      xmlns="http://www.w3.org/2000/svg"
+    >
+      <path
+        d="M2.014 10.777l-.043 2.8a.52.52 0 0 0 .544.544l2.8-.043a.526.526 0 0 1 .546.546.598.598 0 0 1-.575.575l-2.802.044A1.571 1.571 0 0 1 .85 13.609l.044-2.802a.598.598 0 0 1 .575-.575.526.526 0 0 1 .545.545zm12.064-5.461l.043-2.801a.52.52 0 0 0-.543-.544l-2.801.043a.526.526 0 0 1-.545-.545.598.598 0 0 1 .575-.575L13.609.85a1.571 1.571 0 0 1 1.634 1.634l-.044 2.802a.598.598 0 0 1-.575.575.526.526 0 0 1-.546-.545zm-9.724 7.038a.5.5 0 0 1-.708-.708l8-8a.5.5 0 0 1 .708.708l-8 8z"
+        fill-rule="evenodd"
+      />
+    </svg>
+  </button>
 </div>
 `;