fleet/website/assets/styles/pages/admin/email-preview.less
Eric 2d0f33f369
Website: Add script for creating HTML email partials from Markdown articles (#7574)
* add to-html-email

* email-preview

* add build-html-email script, update .gitignore

* email preview and email-templates pages, update routes, importer and policies

* add newsletter email layout, build-html-email script, to-html-email updates

* Update .gitignore

* add newsletter emails section to growth handbook

* update scripts

* update fonts in emails

* Update README.md

* Update build-html-email.js

* update comments, add page scripts to layouts

* revert change to build-static-content

* update script

* update email layout and helper

* update handbook entry

* update template data and helper

* update email layout

* update fake data and unsubscribe link

* move added handbook section to the marketing handbook

* rename script

* update colors in unused email template

* update capitalization in helper

* view-email-preview » view-email-template-preview

* Hide emails generated from markdown if they don't exist

* update preview page

* update markdown email directory, create sample article email

* lint fixes, add target="_blank" to links in emails

* update page layouts & styles

* update sample newsletter email, code font, newsletter layout

* Update README.md

* Update view-email-template-preview.js

Co-authored-by: Tim Kern <tim@fleetdm.com>
Co-authored-by: Mike Thomas <78363703+mike-j-thomas@users.noreply.github.com>
Co-authored-by: Mike McNeil <mikermcneil@users.noreply.github.com>
2022-12-05 16:30:24 -06:00

77 lines
1.3 KiB
Plaintext
Vendored

#email-preview {
padding-top: 80px;
padding-bottom: 80px;
overflow-x: scroll;
h2 {
font-size: 24px;
margin-bottom: 0px;
}
h3 {
font-size: 20px;
font-weight: 700;
margin-bottom: 0px;
}
[purpose='form-factors'] {
margin-top: 40px;
margin-bottom: 40px;
}
[purpose='preview-title'] {
max-width: 1200px;
margin-right: auto;
margin-left: auto;
}
[purpose='preview-selector'] {
cursor: pointer;
border: solid 1px @core-vibrant-blue-15;
min-width: 160px;
background-color: #FAFAFA;
height: 40px;
border-radius: 4px;
padding: 9px 16px 9px;
img {
margin-left: auto;
}
}
[purpose='preview-selector-dropwdown'] {
cursor: pointer;
}
.pretend-inbox-wrapper-for-sample-email {
margin-left: auto;
margin-right: auto;
.preview-iframe {
margin-top: 40px;
border: 1px solid #666;
width: 100%;
height: 900px;
max-width: 100%;
}
&.simulate-320px-width {
width: 320px;
}
&.simulate-480px-width {
width: 480px;
}
&.simulate-768px-width {
width: 768px;
}
&.simulate-1024px-width {
width: 1024px;
}
}
@media (max-width: 768px) {
padding-top: 40px;
h2 {
font-size: 20px;
}
h3 {
font-size: 18px;
}
}
}