@progressive-development/pd-page 0.0.14 → 0.0.15

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (2) hide show
  1. package/package.json +1 -1
  2. package/src/PdFooter.js +33 -12
package/package.json CHANGED
@@ -3,7 +3,7 @@
3
3
  "description": "Progressive development page helper, teaser, menu, footer.",
4
4
  "license": "SEE LICENSE IN LICENSE",
5
5
  "author": "PD Progressive Development",
6
- "version": "0.0.14",
6
+ "version": "0.0.15",
7
7
  "main": "index.js",
8
8
  "module": "index.js",
9
9
  "scripts": {
package/src/PdFooter.js CHANGED
@@ -1,3 +1,4 @@
1
+ /* eslint-disable lit-a11y/click-events-have-key-events */
1
2
  /* eslint-disable lit-a11y/anchor-is-valid */
2
3
  /**
3
4
  * @license
@@ -72,7 +73,7 @@ export class PdFooter extends LitElement {
72
73
  }
73
74
 
74
75
  .right-content li {
75
- display: flex;
76
+ display: flex;
76
77
  align-items: center;
77
78
  padding: 0rem 1rem;
78
79
  height: 100%;
@@ -83,28 +84,41 @@ export class PdFooter extends LitElement {
83
84
  .left-content p {
84
85
  color: #2bcadb;
85
86
  font-size: 1.1rem;
87
+ white-space: nowrap;
86
88
  }
87
89
 
88
90
  .version {
89
91
  color: #9fbdc0;
90
92
  font-style: italic;
91
- font-size: 0.9rem;
93
+ font-size: 0.9rem;
92
94
  }
93
95
 
94
- .item a:hover {
96
+ .madeBy {
97
+ color: white;
98
+ font-size: 0.9rem;
99
+ }
100
+
101
+ .madeBy:hover {
102
+ border-bottom: 1px solid #ffc857;
103
+ }
104
+
105
+ .madeBy:hover, .item a:hover {
95
106
  color: #ffc857;
96
- cursor: pointer;
97
- /*border-bottom: 1px solid #ffc857;*/
107
+ cursor: pointer;
98
108
  }
99
109
 
100
110
  /* Size Elements for small width */
101
- @media (max-width: 440px) {
102
- .item {
103
- display: none;
111
+ @media (max-width: 450px) {
112
+
113
+ .right-content ul {
114
+ height: 40%;
104
115
  }
105
- ul {
106
- justify-content: left;
116
+
117
+ .right-content {
118
+ width: 30%;
107
119
  }
120
+
121
+
108
122
  }
109
123
  `;
110
124
  }
@@ -118,6 +132,7 @@ export class PdFooter extends LitElement {
118
132
  constructor() {
119
133
  super();
120
134
  this.version = undefined;
135
+ this._mailTo = "info@progressive-development.com"
121
136
  }
122
137
 
123
138
  firstUpdated() {}
@@ -126,7 +141,9 @@ export class PdFooter extends LitElement {
126
141
  return html`
127
142
  <div class="left-content">
128
143
  <p>
129
- © ticomi technics<br /><span class="version">${this.version}</span>
144
+ © ticomi technics<br />
145
+ <span class="version">${this.version} development by</span><br />
146
+ <span class="madeBy" @click="${this._mailToProgressiveDevelopment}">PD Progressive Development</span>
130
147
  </p>
131
148
  </div>
132
149
 
@@ -138,7 +155,7 @@ export class PdFooter extends LitElement {
138
155
  console.log();
139
156
  }}"
140
157
  @click="${this._legalClicked}"
141
- >Verkoopvoorwaarden</a
158
+ >Voorwaarden</a
142
159
  >
143
160
  </li>
144
161
  <li class="item">
@@ -167,6 +184,10 @@ export class PdFooter extends LitElement {
167
184
  `;
168
185
  }
169
186
 
187
+ _mailToProgressiveDevelopment() {
188
+ window.location.href = `mailto:${this._mailTo}`;
189
+ }
190
+
170
191
  _legalClicked() {
171
192
  this.shadowRoot.getElementById('legalPopupId').showPopup();
172
193
  }