Merge pull request #212 from jrowlingson/tailwind-prefix

Use ad- tailwind prefix

Author: samselikoff

addon/components/api/x-import-path/component.js

@@ -4,7 +4,7 @@ import hbs from 'htmlbars-inline-precompile';
 export default Component.extend({
   tagName: '',
   layout: hbs`
-    <div class="import-path mb-6 font-mono" data-test-import-path>
+    <div class="import-path ad-mb-6 ad-font-mono" data-test-import-path>
       <span class="hljs-keyword">import</span>
 
       {{#if (eq item.exportType "default")}}

addon/components/api/x-meta-panel/component.js

@@ -4,7 +4,7 @@ import hbs from 'htmlbars-inline-precompile';
 export default Component.extend({
   tagName: '',
   layout: hbs`
-    <div class="px-6 pt-3 mt-4 border border-grey-light rounded text-sm">
+    <div class="ad-px-6 ad-pt-3 ad-mt-4 ad-border ad-border-grey-light ad-rounded ad-text-sm">
       {{yield (hash
         header=(component 'api/x-meta-panel/header')
       )}}

addon/components/api/x-meta-panel/header/component.js

@@ -4,7 +4,7 @@ import hbs from 'htmlbars-inline-precompile';
 export default Component.extend({
   tagName: '',
   layout: hbs`
-    <h4 class="mb-2 text-grey font-bold tracking-wide uppercase text-xs">
+    <h4 class="ad-mb-2 ad-text-grey ad-font-bold ad-tracking-wide ad-uppercase ad-text-xs">
       {{yield}}
     </h4>
   `,

addon/components/api/x-section/template.hbs

@@ -3,10 +3,10 @@
     id={{item.name}}
     data-text="{{item.name}}"
     data-test-item-header
-    class="docs-h3 font-mono font-normal"
+    class="docs-h3 ad-font-mono ad-font-normal"
   >
     {{#if (eq item.exportType 'default')}}
-      <span class="border border-grey-light align-text-top leading-loose text-xs pl-2 mr-2 py-1 rounded">
+      <span class="ad-border ad-border-grey-light ad-align-text-top ad-leading-loose ad-text-xs ad-pl-2 ad-mr-2 ad-py-1 ad-rounded">
         Default
       </span>
     {{/if}}
@@ -45,13 +45,13 @@
           Params
         {{/panel.header}}
 
-        <table class="mb-6" data-test-item-params>
+        <table class="ad-mb-6" data-test-item-params>
           <tbody>
             {{#each item.params as |param|}}
               <tr data-test-item-param>
-                <td><span class="font-mono font-bold border-r border-grey-light pr-2">{{param.name}}</span></td>
-                <td><span class="font-mono border-r border-grey-light px-2">{{param.type}}</span></td>
-                <td class="pl-2">{{param.description}}</td>
+                <td><span class="ad-font-mono ad-font-bold ad-border-r ad-border-grey-light ad-pr-2">{{param.name}}</span></td>
+                <td><span class="ad-font-mono ad-border-r ad-border-grey-light ad-px-2">{{param.type}}</span></td>
+                <td class="ad-pl-2">{{param.description}}</td>
               </tr>
             {{/each}}
           </tbody>

addon/components/api/x-toggles/template.hbs

@@ -1,12 +1,12 @@
-<ul class="list-reset mb-6">
+<ul class="ad-list-reset ad-mb-6">
   {{#each-in toggles as |key toggle|}}
     {{#if (not-eq toggle undefined)}}
-      <li class="inline ml-4">
+      <li class="ad-inline ad-ml-4">
         <label data-test-toggle>
           <input type="checkbox"
             checked={{toggle}}
             onclick={{action onToggle key}}
-            class='mr-1'
+            class='ad-mr-1'
           >
 
           {{capitalize key}}

addon/components/docs-demo/template.hbs

@@ -1,18 +1,18 @@
-<div class="rounded border my-8">
+<div class="ad-rounded ad-border ad-my-8">
 
   {{yield (hash
     example=(component 'docs-demo/x-example')
     snippet=(component 'docs-demo/x-snippet' did-init=(action 'registerSnippet') activeSnippet=activeSnippet)
   )}}
 
   {{#if snippets}}
-    <nav class="docs-demo__snippets-nav py-2 px-4 font-medium bg-grey-lighter tracking-tight">
+    <nav class="docs-demo__snippets-nav ad-py-2 ad-px-4 ad-font-medium ad-bg-grey-lighter ad-tracking-tight">
       {{#each snippets as |snippet|}}
         <button {{action 'selectSnippet' snippet}}
           class='
-            mr-4 text-sm no-underline outline-none
-            hover:text-grey-darkest
-            {{if snippet.isActive 'text-grey-darkest' 'text-grey-dark'}}
+            ad-mr-4 ad-text-sm ad-no-underline outline-none
+            hover:ad-text-grey-darkest
+            {{if snippet.isActive 'ad-text-grey-darkest' 'ad-text-grey-dark'}}
           '
         >
           {{snippet.label}}

addon/components/docs-demo/x-example/component.js

@@ -4,7 +4,7 @@ import layout from './template';
 export default Component.extend({
   layout,
 
-  classNames: 'p-4',
+  classNames: 'ad-p-4',
 
   init() {
     this._super(...arguments);

addon/components/docs-header/link/template.hbs

@@ -2,9 +2,9 @@
 
   <a href={{href}}
     class='
-      px-4 py-3 transition uppercase text-xs font-semibold
-      text-grey-darkest no-underline opacity-50 hover:opacity-100
-      {{if push 'ml-auto'}}
+      ad-px-4 ad-py-3 ad-transition ad-uppercase ad-text-xs ad-font-semibold
+      ad-text-grey-darkest ad-no-underline ad-opacity-50 hover:ad-opacity-100
+      {{if push 'ad-ml-auto'}}
     '
     data-test-id={{data-test-id}}>
     {{yield}}
@@ -15,8 +15,8 @@
   <a {{action on-click}}
     href='#'
     class='
-      px-4 py-3 transition uppercase text-xs font-semibold
-      text-grey-darkest no-underline opacity-50 hover:opacity-100
+      ad-px-4 ad-py-3 ad-transition ad-uppercase ad-text-xs ad-font-semibold
+      ad-text-grey-darkest ad-no-underline ad-opacity-50 hover:ad-opacity-100
       {{if push 'ml-auto'}}
     '
     data-test-id={{data-test-id}}>
@@ -27,9 +27,9 @@
 
   {{#link-to route
     class=(concat
-      'px-4 py-3 transition uppercase text-xs font-semibold
-      text-grey-darkest no-underline '
-      (if (and (not isActive) (not (eq route 'index'))) 'opacity-50 hover:opacity-100')
+      'ad-px-4 ad-py-3 ad-transition ad-uppercase ad-text-xs ad-font-semibold
+      ad-text-grey-darkest ad-no-underline '
+      (if (and (not isActive) (not (eq route 'index'))) 'ad-opacity-50 hover:ad-opacity-100')
     )
     data-test-id=data-test-id
   }}

addon/components/docs-header/search-box/component.js

@@ -5,7 +5,7 @@ import { on } from '@ember/object/evented';
 
 export default Component.extend(EKMixin, {
   layout,
-  classNames: 'ml-auto',
+  classNames: 'ad-ml-auto',
 
   query: null,
 

addon/components/docs-header/search-box/template.hbs

@@ -1,5 +1,5 @@
-<div class='relative text-grey-darkest' data-search-box>
-  {{svg-jar 'search' width=12 height=12 class='absolute pin-t h-full ml-1'}}
+<div class='ad-relative ad-text-grey-darkest' data-search-box>
+  {{svg-jar 'search' width=12 height=12 class='ad-absolute ad-pin-t ad-h-full ad-ml-1'}}
 
   {{!--
     This is a dumb input - so why not use the {{input}} helper? Because apparently
@@ -11,7 +11,7 @@
     value={{query}}
     type="text"
     placeholder='Search'
-    class='w-24 text-xs p-2 pl-6 rounded focus:bg-grey-lighter outline-none'
+    class='ad-w-24 ad-text-xs ad-p-2 ad-pl-6 ad-rounded focus:ad-bg-grey-lighter outline-none'
     data-search-box-input
     data-test-search-box-input>
 </div>