@progressive-development/pd-page 0.0.15 → 0.0.17

package/package.json

@@ -3,7 +3,7 @@
   "description": "Progressive development page helper, teaser, menu, footer.",
   "license": "SEE LICENSE IN LICENSE",
   "author": "PD Progressive Development",
-  "version": "0.0.15",
+  "version": "0.0.17",
   "main": "index.js",
   "module": "index.js",
   "scripts": {
@@ -18,10 +18,10 @@
   },
   "dependencies": {
     "lit": "^2.0.2",
-    "@progressive-development/pd-contact": "0.0.3",
-    "@progressive-development/pd-forms": "0.0.14",
-    "@progressive-development/pd-dialog": "0.0.8",
-    "@progressive-development/pd-icon": "0.0.4"
+    "@progressive-development/pd-contact": "0.0.5",
+    "@progressive-development/pd-forms": "0.0.16",
+    "@progressive-development/pd-dialog": "0.0.10",
+    "@progressive-development/pd-icon": "0.0.7"
   },
   "devDependencies": {
     "@custom-elements-manifest/analyzer": "^0.4.17",

package/src/PdFooter.js

@@ -73,7 +73,7 @@ export class PdFooter extends LitElement {
       }
 
       .right-content li {
-        display: flex;        
+        display: flex;
         align-items: center;
         padding: 0rem 1rem;
         height: 100%;
@@ -90,35 +90,33 @@ export class PdFooter extends LitElement {
       .version {
         color: #9fbdc0;
         font-style: italic;
-        font-size: 0.9rem;        
+        font-size: 0.9rem;
       }
 
-      .madeBy {        
+      .madeBy {
         color: white;
-        font-size: 0.9rem;        
-      }      
+        font-size: 0.9rem;
+      }
 
-      .madeBy:hover {        
+      .madeBy:hover {
         border-bottom: 1px solid #ffc857;
       }
-      
-      .madeBy:hover, .item a:hover {
+
+      .madeBy:hover,
+      .item a:hover {
         color: #ffc857;
-        cursor: pointer;        
+        cursor: pointer;
       }
 
       /* Size Elements for small width */
-      @media (max-width: 450px) {                
-
+      @media (max-width: 450px) {
         .right-content ul {
           height: 40%;
         }
 
         .right-content {
-          width: 30%;          
+          width: 30%;
         }
-
-
       }
     `;
   }
@@ -132,7 +130,7 @@ export class PdFooter extends LitElement {
   constructor() {
     super();
     this.version = undefined;
-    this._mailTo = "info@progressive-development.com"
+    this._mailTo = 'info@progressive-development.com';
   }
 
   firstUpdated() {}
@@ -143,7 +141,9 @@ export class PdFooter extends LitElement {
         <p>
           © ticomi technics<br />
           <span class="version">${this.version} development by</span><br />
-          <span class="madeBy" @click="${this._mailToProgressiveDevelopment}">PD Progressive Development</span>
+          <span class="madeBy" @click="${this._mailToProgressiveDevelopment}"
+            >PD Progressive Development</span
+          >
         </p>
       </div>
 

package/src/PdMenu.js

@@ -63,7 +63,7 @@ export class PdMenu extends LitElement {
         font-family: Oswald, sans-serif;
         font-size: 1.2rem;
 
-        --squi-icon-fill: var(--my-header-text-color);
+        --pd-icon-fill: var(--my-header-text-color);
       }
       .item.active {
         color: #ffc857;
@@ -76,11 +76,11 @@ export class PdMenu extends LitElement {
         This is also the reason why icon-fill is defined for item, not for topMenuItem
         Erkennbar: Farbe Icon leicht unterschiedlich zu Farbe Text nach hover icon.
         */
-        --squi-icon-fill: #ffc857;
+        --pd-icon-fill: #ffc857;
       }
 
       .topItemLogo {
-        --squi-icon-size: 1.6rem;
+        --pd-icon-size: 1.6rem;
         --icon-transition: none;
         pointer-events: none;
       }
@@ -184,10 +184,10 @@ export class PdMenu extends LitElement {
               @click="${this._menuItemClicked}"
             >
               ${topItem.icon
-                ? html`<squi-icon
+                ? html`<pd-icon
                     class="topItemLogo"
                     icon="${topItem.icon}"
-                  ></squi-icon>`
+                  ></pd-icon>`
                 : ''}
               ${topItem.name}
             </li>

package/src/PdTeaser.js

@@ -66,7 +66,7 @@ export class PdTeaser extends LitElement {
         top: calc(var(--my-height) / 2);        
         left: 10px;        
         z-index: 1;   
-        --squi-icon-fill: white;
+        --pd-icon-fill: white;
       }
 
       .next {                
@@ -74,7 +74,7 @@ export class PdTeaser extends LitElement {
         top: calc(var(--my-height) / 2);        
         right: 10px;   
         z-index: 1;        
-        --squi-icon-fill: white;
+        --pd-icon-fill: white;
       }
       
       .content {
@@ -226,16 +226,16 @@ export class PdTeaser extends LitElement {
   render() {
     return html`
       <div class="teaser-flex ${this._visible ? '' : 'in-active'}">
-        <squi-icon
+        <pd-icon
           icon="previousArrow"
           class="previous"
           @click="${this._prevContent}"
-        ></squi-icon>
-        <squi-icon
+        ></pd-icon>
+        <pd-icon
           icon="nextArrow"
           class="next"
           @click="${this._nextContent}"
-        ></squi-icon>
+        ></pd-icon>
 
         ${this.teaserObjects.map(
           (teaserObj, index) => html`