replace unsafeCSS with css.

DreamworldSolutions · Nov 27, 2019 · 927909a · 927909a
1 parent ec5abda
commit 927909a
Show file tree

Hide file tree

Showing 10 changed files with 129 additions and 192 deletions.
diff --git a/flex-layout-alignment-literals.js b/flex-layout-alignment-literals.js
@@ -1,118 +1,118 @@
-import { unsafeCSS } from 'lit-element';
+import { css } from 'lit-element';
 
-export const startAligned = unsafeCSS`
+export const startAligned = css`
   -ms-flex-align: start;
   -webkit-align-items: flex-start;
   align-items: flex-start;
 `;
 
-export const centerAligned = unsafeCSS`
+export const centerAligned = css`
   -ms-flex-align: center;
   -webkit-align-items: center;
   align-items: center;
 `;
 
-export const endAligned = unsafeCSS`
+export const endAligned = css`
   -ms-flex-align: end;
   -webkit-align-items: flex-end;
   align-items: flex-end;
 `;
 
-export const baseline = unsafeCSS`
+export const baseline = css`
   -ms-flex-align: baseline;
   -webkit-align-items: baseline;
   align-items: baseline;
 `;
 
-export const startJustified = unsafeCSS`
+export const startJustified = css`
   -ms-flex-pack: start;
   -webkit-justify-content: flex-start;
   justify-content: flex-start;
 `;
 
-export const centerJustified = unsafeCSS`
+export const centerJustified = css`
   -ms-flex-pack: center;
   -webkit-justify-content: center;
   justify-content: center;
 `;
 
-export const endJustified = unsafeCSS`
+export const endJustified = css`
   -ms-flex-pack: end;
   -webkit-justify-content: flex-end;
   justify-content: flex-end;
 `;
 
-export const aroundJustified = unsafeCSS`
+export const aroundJustified = css`
   -ms-flex-pack: distribute;
   -webkit-justify-content: space-around;
   justify-content: space-around;
 `;
 
-export const justified = unsafeCSS`
+export const justified = css`
   -ms-flex-pack: justify;
   -webkit-justify-content: space-between;
   justify-content: space-between;
 `;
 
-export const selfStart = unsafeCSS`
+export const selfStart = css`
   -ms-align-self: flex-start;
   -webkit-align-self: flex-start;
   align-self: flex-start;
 `;
 
-export const selfCenter = unsafeCSS`
+export const selfCenter = css`
   -ms-align-self: center;
   -webkit-align-self: center;
   align-self: center;
 `;
 
-export const selfEnd = unsafeCSS`
+export const selfEnd = css`
   -ms-align-self: flex-end;
   -webkit-align-self: flex-end;
   align-self: flex-end;
 `;
 
-export const selfStretch = unsafeCSS`
+export const selfStretch = css`
   -ms-align-self: stretch;
   -webkit-align-self: stretch;
   align-self: stretch;
 `;
 
-export const selfBaseline = unsafeCSS`
+export const selfBaseline = css`
   -ms-align-self: baseline;
   -webkit-align-self: baseline;
   align-self: baseline;
 `;
 
-export const startAlignedContent = unsafeCSS`
+export const startAlignedContent = css`
   -ms-flex-line-pack: start; /* IE10 */
   -ms-align-content: flex-start;
   -webkit-align-content: flex-start;
   align-content: flex-start;
 `;
 
-export const endAlignedContent = unsafeCSS`
+export const endAlignedContent = css`
   -ms-flex-line-pack: end; /* IE10 */
   -ms-align-content: flex-end;
   -webkit-align-content: flex-end;
   align-content: flex-end;
 `;
 
-export const centerAlignedContent = unsafeCSS`
+export const centerAlignedContent = css`
   -ms-flex-line-pack: center; /* IE10 */
   -ms-align-content: center;
   -webkit-align-content: center;
   align-content: center;
 `;
 
-export const betweenAlignedContent = unsafeCSS`
+export const betweenAlignedContent = css`
   -ms-flex-line-pack: justify; /* IE10 */
   -ms-align-content: space-between;
   -webkit-align-content: space-between;
   align-content: space-between;
 `;
 
-export const aroundAlignedContent = unsafeCSS`
+export const aroundAlignedContent = css`
   -ms-flex-line-pack: distribute; /* IE10 */
   -ms-align-content: space-around;
   -webkit-align-content: space-around;

diff --git a/flex-layout-alignment.js b/flex-layout-alignment.js
@@ -8,85 +8,65 @@ Code distributed by Google as part of the polymer project is also
 subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
 */
 import { css } from 'lit-element';
-import {
-  startAligned,
-  centerAligned,
-  endAligned,
-  baseline,
-  startJustified,
-  centerJustified,
-  endJustified,
-  aroundJustified,
-  justified,
-  selfStart,
-  selfCenter,
-  selfEnd,
-  selfStretch,
-  selfBaseline,
-  startAlignedContent,
-  endAlignedContent,
-  centerAlignedContent,
-  betweenAlignedContent,
-  aroundAlignedContent
-} from './flex-layout-alignment-literals';
+import * as literals from './flex-layout-alignment-literals';
 export const alignment = css`
   .layout.start {
-    ${startAligned}
+    ${literals.startAligned}
   }
   .layout.center,
   .layout.center-center {
-    ${centerAligned}
+    ${literals.centerAligned}
   }
   .layout.end {
-    ${endAligned}
+    ${literals.endAligned}
   }
   .layout.baseline {
-    ${baseline}
+    ${literals.baseline}
   }
   .layout.start-justified {
-    ${startJustified}
+    ${literals.startJustified}
   }
   .layout.center-justified,
   .layout.center-center {
-    ${centerJustified}
+    ${literals.centerJustified}
   }
   .layout.end-justified {
-    ${endJustified}
+    ${literals.endJustified}
   }
   .layout.around-justified {
-    ${aroundJustified}
+    ${literals.aroundJustified}
   }
   .layout.justified {
-    ${justified}
+    ${literals.justified}
   }
   .self-start {
-    ${selfStart}
+    ${literals.selfStart}
   }
   .self-center {
-    ${selfCenter}
+    ${literals.selfCenter}
   }
   .self-end {
-    ${selfEnd}
+    ${literals.selfEnd}
   }
   .self-stretch {
-    ${selfStretch}
+    ${literals.selfStretch}
   }
   .self-baseline {
-    ${selfBaseline}
+    ${literals.selfBaseline}
   }
   .layout.start-aligned {
-    ${startAlignedContent}
+    ${literals.startAlignedContent}
   }
   .layout.end-aligned {
-    ${endAlignedContent}
+    ${literals.endAlignedContent}
   }
   .layout.center-aligned {
-    ${centerAlignedContent}
+    ${literals.centerAlignedContent}
   }
   .layout.between-aligned {
-    ${betweenAlignedContent}
+    ${literals.betweenAlignedContent}
   }
   .layout.around-aligned {
-    ${aroundAlignedContent}
+    ${literals.aroundAlignedContent}
   }
 `;
diff --git a/flex-layout-factors-literals.js b/flex-layout-factors-literals.js
@@ -1,73 +1,73 @@
-import { unsafeCSS } from 'lit-element';
-export const flexFactor = unsafeCSS`
+import { css } from 'lit-element';
+export const flexFactor = css`
   -ms-flex: 1 1 0.000000001px;
   -webkit-flex: 1;
   flex: 1;
   -webkit-flex-basis: 0.000000001px;
   flex-basis: 0.000000001px;
 `;
 
-export const flex2 = unsafeCSS`
+export const flex2 = css`
   -ms-flex: 2;
   -webkit-flex: 2;
   flex: 2;
 `;
 
-export const flex3 = unsafeCSS`
+export const flex3 = css`
   -ms-flex: 3;
   -webkit-flex: 3;
   flex: 3;
 `;
 
-export const flex4 = unsafeCSS`
+export const flex4 = css`
   -ms-flex: 4;
   -webkit-flex: 4;
   flex: 4;
 `;
 
-export const flex5 = unsafeCSS`
+export const flex5 = css`
   -ms-flex: 5;
   -webkit-flex: 5;
   flex: 5;
 `;
 
-export const flex6 = unsafeCSS`
+export const flex6 = css`
   -ms-flex: 6;
   -webkit-flex: 6;
   flex: 6;
 `;
 
-export const flex7 = unsafeCSS`
+export const flex7 = css`
   -ms-flex: 7;
   -webkit-flex: 7;
   flex: 7;
 `;
 
-export const flex8 = unsafeCSS`
+export const flex8 = css`
   -ms-flex: 8;
   -webkit-flex: 8;
   flex: 8;
 `;
 
-export const flex9 = unsafeCSS`
+export const flex9 = css`
   -ms-flex: 9;
   -webkit-flex: 9;
   flex: 9;
 `;
 
-export const flex10 = unsafeCSS`
+export const flex10 = css`
   -ms-flex: 10;
   -webkit-flex: 10;
   flex: 10;
 `;
 
-export const flex11 = unsafeCSS`
+export const flex11 = css`
   -ms-flex: 11;
   -webkit-flex: 11;
   flex: 11;
 `;
 
-export const flex12 = unsafeCSS`
+export const flex12 = css`
   -ms-flex: 12;
   -webkit-flex: 12;
   flex: 12;