Skip to content

Instantly share code, notes, and snippets.

@JacobLett
Created April 15, 2019 10:22
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save JacobLett/6761c258757dee149fe527f11e9156c5 to your computer and use it in GitHub Desktop.
Save JacobLett/6761c258757dee149fe527f11e9156c5 to your computer and use it in GitHub Desktop.
technolawyer hubspot form embed
<!--[if lte IE 8]>
<script charset="utf-8" type="text/javascript" src="//js.hsforms.net/forms/v2-legacy.js"></script>
<![endif]-->
<script charset="utf-8" type="text/javascript" src="//js.hsforms.net/forms/v2.js"></script>
<script>
hbspt.forms.create({
portalId: "4518656",
formId: "0022373b-0680-4647-a549-3dcbe772e71d",
css: '',
cssClass: 'tl-form'
});
</script>
<style>
/* This may not be needed if texted added inside hubspot */
.tl-form h2 {
position: relative;
margin-top: -15px;
}
.tl-form h2::before {
position: absolute;
content: "Download Our Media Kit and Rates";
text-indent: 200%;
white-space: nowrap;
overflow: hidden;
position: absolute;
left: 0;
background: url('img/header-download-rate-card.png') no-repeat 0 0;
width: 303px;
height: 27px;
z-index: 1000;
}
.tl-form {
max-width: 364px;
font-family: Verdana, sans-serif;
font-size: 12px;
-webkit-box-sizing: border-box;
box-sizing: border-box;
margin: 20px 0 30px 0;
position: relative;
background: #fff;
background: #e6f3ff;
border: 1px solid #ccc;
padding: 0 24px 0 24px;
border-radius: 10px;
float: left;
}
.hs-form-required {
display: none;
}
.tl-form .hs-richtext {
font-size: 13px;
font-weight: 300;
margin-bottom: 20px;
}
.hs-fieldtype-intl-phone.hs-input select {
margin-right: 5px;
padding: 6px;
height: 27px;
background: #fff;
}
.hs-fieldtype-intl-phone.hs-input input {
width: 67% !important;
}
/* Form Field (selector for form field wrapper) */
.hs-form .hs-form-field {
display: block;
overflow: hidden;
margin-bottom: 8px;
}
.hs-form .hs-form-field>label {
text-align: right;
font-size: 11px;
font-weight: 700;
text-align: right;
padding-right: 12px;
line-height: 18px;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
.hs-form .input {
overflow: hidden;
}
/* Inputs (selectors for all inputs) */
.hs-form input[type="text"],
.hs-form input[type="password"],
.hs-form input[type="datetime"],
.hs-form input[type="datetime-local"],
.hs-form input[type="date"],
.hs-form input[type="month"],
.hs-form input[type="time"],
.hs-form input[type="week"],
.hs-form input[type="number"],
.hs-form input[type="email"],
.hs-form input[type="url"],
.hs-form input[type="search"],
.hs-form input[type="tel"],
.hs-form input[type="color"],
.hs-form input[type="file"],
.hs-form textarea,
.hs-form select {
display: block;
font-size: 11px;
border: 1px solid #707070;
padding: 2px;
width: 100%;
float: left;
-webkit-box-sizing: border-box;
box-sizing: border-box;
border-radius: 0;
padding: 6px;
}
.hs-form select {
font-size: 11px;
}
/* Error message (selector for validation messages) */
.hs-form .hs-error-msgs {
padding: 0;
margin: 5px 0 0 0;
}
.hs-form .hs-error-msgs li {
list-style-type: none;
color: red;
width: 100%;
}
/* Submit buttons (selectors for all non-CTA buttons)
========================================================================== */
.hs-submit {
text-align: right;
}
.hs-submit .hs-button {
background: url("img/bt_download.gif") no-repeat center center;
width: 136px;
height: 23px;
margin: 5px 0 20px 0;
padding: 0;
border: 0;
display: inline-block;
font-size: 0px;
cursor: pointer;
}
/* desktop and up */
@media (min-width: 746px) {
.tl-form {
max-width: 364px;
}
/* Form Field (selector for form field wrapper) */
.hs-form .hs-form-field {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
.hs-form .hs-form-field>label {
width: 40%;
}
.hs-form .input {
display: block;
width: 60%;
}
.hs-form .hs-error-msgs {
width: 100%;
}
.hs-form .hs-error-msgs li {
text-align: center;
}
/* end desktop up */
}
</style>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment