@energycap/components 0.38.3 → 0.38.4-ECAP-19826-email-table-styles.20231006-1607

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 (3) hide show
  1. package/energycap-email.min.css +1 -1
  2. package/package.json +1 -1
  3. package/src/styles/email/_email-base.scss +49 -3
package/energycap-email.min.css CHANGED
@@ -1 +1 @@
1
- html{background-color:#fff;font-size:16px}body{font-size:14px;font-weight:400;color:#1a1a23;line-height:1.2;font-family:Roboto,-apple-system,BlinkMacSystemFont,"Segoe UI","Oxygen","Ubuntu","Fira Sans","Droid Sans","Helvetica Neue",sans-serif;text-align:left;margin:0}table{width:100%;border-spacing:0;font-size:14px}tr,td{border-image-width:0}.email-wrapper{width:600px;padding-top:48px}.email-header{padding-right:16px;padding-left:16px}.email-body{padding:32px 24px}[tabindex="-1"]:focus{outline:0 !important}h1,h2,h3,h4,h5,h6,p,ol,ul{margin-top:0;margin-bottom:16px}h1,h2{font-size:20px;line-height:24px}h3,h4{font-size:16px;line-height:24px}h5,h6{font-size:12px;line-height:16px;text-transform:uppercase;color:rgba(26,26,35,.66)}h1,h3,h5{font-weight:bold}h2,h4,h6{font-weight:normal}ol ol,ul ul,ol ul,ul ol{margin-bottom:0}b,strong{font-weight:bolder}a{color:#0084a9;text-decoration:none;background-color:rgba(0,0,0,0)}a:hover{text-decoration:underline}a:focus{outline:#0084a9 solid 2px;outline-offset:2px;border-radius:2px}a:not([href]):not([tabindex]){color:inherit;text-decoration:none}a:not([href]):not([tabindex]),a:not([href]):not([tabindex]):focus{color:inherit;text-decoration:none}a:not([href]):not([tabindex]):focus{outline:0}.email-button,.email-button-primary{display:inline-block;margin-right:8px;margin-bottom:8px;background-color:#d6d6d7;padding:0 16px;line-height:32px;border-radius:4px;color:#1a1a23 !important}.email-button-primary{background-color:#cfd856}.email-cta{display:inline-block;margin-right:8px;margin-bottom:8px;background-color:#17303b;color:#d8e902 !important;line-height:48px;padding:0 24px;min-width:176px;text-align:center;border-radius:6px}img{max-width:100%;height:auto}hr{height:0;border-bottom:0;overflow:visible;margin:16px 0;border-color:rgba(26,26,35,.18)}.text-left{text-align:left}.text-center{text-align:center}.text-right{text-align:right}.text-underline{text-decoration:underline}.text-caption-1{color:rgba(26,26,35,.66);font-size:12px}.text-caption-2{color:rgba(26,26,35,.66);font-size:10px}.email-logo{width:100%;max-width:292px;font-size:28px;font-weight:normal}.email-logo-wl{margin-left:4px;width:56px;max-width:56px}
1
+ html{background-color:#fff;font-size:16px}body{font-size:14px;font-weight:400;color:#1a1a23;line-height:1.2;font-family:Roboto,-apple-system,BlinkMacSystemFont,"Segoe UI","Oxygen","Ubuntu","Fira Sans","Droid Sans","Helvetica Neue",sans-serif;text-align:left;margin:0}table{width:100%;border-spacing:0;font-size:14px}tr,td{border-image-width:0}.email-wrapper{width:600px;padding-top:48px}.email-header{padding-right:16px;padding-left:16px}.email-body{padding:32px 24px}[tabindex="-1"]:focus{outline:0 !important}h1,h2,h3,h4,h5,h6,p,ol,ul{margin-top:0;margin-bottom:16px}h1,h2{font-size:20px;line-height:24px}h3,h4{font-size:16px;line-height:24px}h5,h6{font-size:12px;line-height:16px;text-transform:uppercase;color:rgba(26,26,35,.66)}h1,h3,h5{font-weight:bold}h2,h4,h6{font-weight:normal}ol ol,ul ul,ol ul,ul ol{margin-bottom:0}b,strong{font-weight:bolder}a{color:#0084a9;text-decoration:none;background-color:rgba(0,0,0,0)}th,td{text-align:start}a:hover{text-decoration:underline}a:focus{outline:#0084a9 solid 2px;outline-offset:2px;border-radius:2px}a:not([href]):not([tabindex]){color:inherit;text-decoration:none}a:not([href]):not([tabindex]),a:not([href]):not([tabindex]):focus{color:inherit;text-decoration:none}a:not([href]):not([tabindex]):focus{outline:0}.email-button,.email-button-primary{display:inline-block;margin-right:8px;margin-bottom:8px;background-color:#d6d6d7;padding:0 16px;line-height:32px;border-radius:4px;color:#1a1a23 !important}.email-button-primary{background-color:#cfd856}.email-cta{display:inline-block;margin-right:8px;margin-bottom:8px;background-color:#17303b;color:#d8e902 !important;line-height:48px;padding:0 24px;min-width:176px;text-align:center;border-radius:6px}.email-table{font-size:12px}.email-table th,.email-table td{height:32px;line-height:16px;padding:8px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.email-table th{font-weight:normal;vertical-align:middle;color:rgba(26,26,35,.66);border-bottom:1px solid #383840}.email-table td{border-top:1px solid #d6d6d7;vertical-align:top}.email-table th:first-child,.email-table td:first-child{padding-left:0}.email-table th:last-child,.email-table td:last-child{padding-right:0}.email-table tr:first-child td{border-top:0}img{max-width:100%;height:auto}hr{height:0;border:0;overflow:visible;margin:16px 0;border-top:1px solid #d6d6d7}.text-left{text-align:left}.text-center{text-align:center}.text-right{text-align:right}.text-underline{text-decoration:underline}.text-caption-1{color:rgba(26,26,35,.66);font-size:12px}.text-caption-2{color:rgba(26,26,35,.66);font-size:10px}.email-logo{width:100%;max-width:292px;font-size:28px;font-weight:normal}.email-logo-wl{margin-left:4px;width:56px;max-width:56px}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@energycap/components",
3
- "version": "0.38.3",
3
+ "version": "0.38.4-ECAP-19826-email-table-styles.20231006-1607",
4
4
  "dependencies": {
5
5
  "tslib": "^2.0.0"
6
6
  },
package/src/styles/email/_email-base.scss CHANGED
@@ -4,7 +4,8 @@ $ec-color-primary-dark: rgb(26, 26, 35);
4
4
  $ec-color-secondary-dark: rgba(26, 26, 35, .66);
5
5
  $ec-color-interactive: rgb(0, 132, 169);
6
6
  $ec-background-color: rgb(255, 255, 255);
7
- $ec-border-color: rgba(26, 26, 35, .18);
7
+ $ec-border-color: #D6D6D7;
8
+ $ec-border-color-dark: #383840;
8
9
  $ec-font-family: Roboto, -apple-system, BlinkMacSystemFont, "Segoe UI", "Oxygen", "Ubuntu", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
9
10
  $green-3: #cfd856;
10
11
 
@@ -65,6 +66,11 @@ $green-3: #cfd856;
65
66
  text-decoration: none;
66
67
  background-color: transparent;
67
68
  }
69
+
70
+ th,
71
+ td {
72
+ text-align: start;
73
+ }
68
74
 
69
75
  a:hover {
70
76
  text-decoration: underline;
@@ -119,6 +125,46 @@ $green-3: #cfd856;
119
125
  text-align: center;
120
126
  border-radius: 6px;
121
127
  }
128
+
129
+ .email-table {
130
+ font-size: 12px;
131
+
132
+ th,
133
+ td {
134
+ height: 32px;
135
+ line-height: 16px;
136
+ padding: 8px;
137
+ overflow: hidden;
138
+ text-overflow: ellipsis;
139
+ white-space: nowrap;
140
+ }
141
+
142
+ th {
143
+ font-weight: normal;
144
+ vertical-align: middle;
145
+ color: $ec-color-secondary-dark;
146
+ border-bottom: 1px solid $ec-border-color-dark;
147
+ }
148
+
149
+ td {
150
+ border-top: 1px solid $ec-border-color;
151
+ vertical-align: top;
152
+ }
153
+
154
+ th:first-child,
155
+ td:first-child {
156
+ padding-left: 0;
157
+ }
158
+
159
+ th:last-child,
160
+ td:last-child {
161
+ padding-right: 0;
162
+ }
163
+
164
+ tr:first-child td {
165
+ border-top: 0;
166
+ }
167
+ }
122
168
 
123
169
  img {
124
170
  max-width: 100%;
@@ -127,10 +173,10 @@ $green-3: #cfd856;
127
173
 
128
174
  hr {
129
175
  height: 0;
130
- border-bottom: 0;
176
+ border: 0;
131
177
  overflow: visible;
132
178
  margin: 16px 0;
133
- border-color: $ec-border-color;
179
+ border-top: 1px solid $ec-border-color;
134
180
  }
135
181
 
136
182
  .text-left {