fix(detail-page-header): replace svg with inline-svg (#125)

carbon-design-system · May 26, 2017 · a9c5528 · a9c5528
1 parent ed96bb6
commit a9c5528
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 8 deletions.
diff --git a/src/components/detail-page-header/detail-page-header--no-tabs.html b/src/components/detail-page-header/detail-page-header--no-tabs.html
@@ -16,7 +16,7 @@
     <div class="bx--detail-page-header-title-container">
       <div class="bx--detail-page-header-icon-container">
         <svg width="24" height="24" viewBox="0 0 24 24">
-          <path fill="#D8D8D8" d="M0 0h24v24H0z" fill-rule="evenodd"/>
+          <path fill="#D8D8D8" d="M0 0h24v24H0z" fill-rule="evenodd" />
         </svg>
       </div>
       <h1 class="bx--detail-page-header-title">Title</h1>
@@ -28,8 +28,10 @@ <h1 class="bx--detail-page-header-title">Title</h1>
   </div>
   <div class="bx--detail-page-header-menu">
     <div data-overflow-menu tabindex="0" aria-label="Overflow menu description" class="bx--overflow-menu">
-      <svg class="bx--overflow-menu__icon">
-        <use xlink:href="/carbon-icons/bluemix-icons.svg#icon--overflow-menu"></use>
+      <svg class="bx--overflow-menu__icon" width="4" height="20" viewBox="0 0 4 20" fill-rule="evenodd">
+        <circle cx="2" cy="2" r="2"></circle>
+        <circle cx="2" cy="10" r="2"></circle>
+        <circle cx="2" cy="18" r="2"></circle>
       </svg>
       <ul class="bx--overflow-menu-options bx--overflow-menu--flip">
         <li class="bx--overflow-menu-options__option">

diff --git a/src/components/detail-page-header/detail-page-header--with-tabs.html b/src/components/detail-page-header/detail-page-header--with-tabs.html
@@ -15,7 +15,7 @@
     <div class="bx--detail-page-header-title-container">
       <div class="bx--detail-page-header-icon-container">
         <svg width="24" height="24" viewBox="0 0 24 24">
-          <path fill="#D8D8D8" d="M0 0h24v24H0z" fill-rule="evenodd"/>
+          <path fill="#D8D8D8" d="M0 0h24v24H0z" fill-rule="evenodd" />
         </svg>
       </div>
       <h1 class="bx--detail-page-header-title">Title</h1>
@@ -27,8 +27,8 @@ <h1 class="bx--detail-page-header-title">Title</h1>
     <nav data-tabs class="bx--tabs" role="navigation">
       <div class="bx--tabs-trigger">
         <a href="javascript:void(0)" class="bx--tabs-trigger-text"></a>
-        <svg>
-          <use xlink:href="/carbon-icons/bluemix-icons.svg#icon--caret--down"></use>
+        <svg width="10" height="5" viewBox="0 0 10 5" fill-rule="evenodd">
+          <path d="M10 0L5 5 0 0z"></path>
         </svg>
       </div>
       <ul class="bx--tabs__nav bx--tabs__nav--hidden" role="tablist">
@@ -52,8 +52,10 @@ <h1 class="bx--detail-page-header-title">Title</h1>
   </div>
   <div class="bx--detail-page-header-menu">
     <div data-overflow-menu tabindex="0" aria-label="Overflow menu description" class="bx--overflow-menu">
-      <svg class="bx--overflow-menu__icon">
-        <use xlink:href="/carbon-icons/bluemix-icons.svg#icon--overflow-menu"></use>
+      <svg class="bx--overflow-menu__icon" width="4" height="20" viewBox="0 0 4 20" fill-rule="evenodd">
+        <circle cx="2" cy="2" r="2"></circle>
+        <circle cx="2" cy="10" r="2"></circle>
+        <circle cx="2" cy="18" r="2"></circle>
       </svg>
       <ul class="bx--overflow-menu-options bx--overflow-menu--flip">
         <li class="bx--overflow-menu-options__option">