Blank slates

Developer
Dave
Size
2,666 Kb
Views
12,144
  1. Blank slates Previews
  2. Blank slates HTML Codes
  3. Blank slates CSS Codes

How do I make an blank slates?

What is a blank slates? How do you make a blank slates? This script and codes were developed by Dave on 17 September 2022, Saturday.

Blank slates Previews
IQ Test

Blank slates - Script Codes HTML Codes

<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>Blank slates</title> <link rel='stylesheet prefetch' href='https://css.createsend1.com/css/global-old-setup.min.css?h=CE207EC102082016'>
<link rel='stylesheet prefetch' href='https://css.createsend1.com/css/global-new-setup.min.css?h=DB94DB9C02082016'>
<link rel='stylesheet prefetch' href='https://css.createsend1.com/css/pretty.min.css?h=83F7CBCA02082016'>
<link rel='stylesheet prefetch' href='https://css.createsend1.com/css/cm-blue.min.css?h=A2A5E6C502082016'> <link rel="stylesheet" href="css/style.css">
</head>
<body> <svg xmlns="http://www.w3.org/2000/svg" version="1.1" class="u-hide"> <symbol id="blank-slate-arrow" viewBox="-286 392 38 9"> <path d="M-257.4 392l.9 3.9c-11-2-19.8-.5-29.4 1.6l.6 2.1c9.7-2 19.2-3.4 28.9-1.4l-2.3 2.9 10.8-2.9-9.5-6.2z" /> </symbol>
</svg>
<ol class="c-arrowed-list"> <li class="c-arrowed-list__item"> <figure class="c-illustration-with-caption"> <img class="c-illustration-with-caption__image" src="/img/_new-setup/icons/png/customize-template.png" srcset="/img/_new-setup/icons/png/customize-template.png, /img/_new-setup/icons/png/[email protected] 2x" alt="Illustration of a template" width="197" height="218"> <figcaption class="c-illustration-with-caption__caption">Start based on subscriber activity</figcaption> </figure> <svg class="c-icon--curly-arrow c-arrowed-list__arrow" aria-hidden="true"> <use xlink:href="#blank-slate-arrow" /> </svg> </li> <li class="c-arrowed-list__item"> <figure> <img class="c-illustration-with-caption__image" src="/img/_new-setup/icons/png/add-subscribers.png" srcset="/img/_new-setup/icons/png/add-subscribers.png, /img/_new-setup/icons/png/[email protected] 2x" alt="Illustration of a template" width="173" height="218"> <figcaption class=" c-illustration-with-caption__caption">Send content at the right time</figcaption> </figure> <svg class="c-icon--curly-arrow c-icon--curly-arrow--flip-vertically c-arrowed-list__arrow" aria-hidden="true"> <use xlink:href="#blank-slate-arrow" /> </svg> </li> <li class="c-arrowed-list__item"> <figure> <img class="c-illustration-with-caption__image" src="/img/_new-setup/icons/png/test-and-send.png" srcset="/img/_new-setup/icons/png/test-and-send.png, /img/_new-setup/icons/png/[email protected] 2x" alt="Illustration of a template" width="211" height="218"> <figcaption class="c-illustration-with-caption__caption">Follow up based on their actions</figcaption> </figure> </li>
</ol>
</body>
</html>

Blank slates - Script Codes CSS Codes

.c-arrowed-list { display: flex; list-style: none;
}
.c-arrowed-list__item:not(:first-child) { padding-left: 50px;
}
.c-arrowed-list__item:not(:last-child) { padding-right: 50px;
}
.c-arrowed-list__item { position: relative;
}
.c-arrowed-list__arrow { position: absolute; top: calc(50% - 9px); right: calc(0% - 19px);
}
.c-illustration-with-caption { text-align: center;
}
.c-illustration-with-caption__image { display: block; margin: 0 auto;
}
.c-illustration-with-caption__caption,
.c-blank-slate__image-grid__item__caption { color: #6f6f6f; display: block; font-size: 1.16667rem; font-weight: 400; margin-top: 1.5rem;
}
Blank slates - Script Codes
Blank slates - Script Codes
Home Page Home
Developer Dave
Username DaveOrDead
Uploaded September 17, 2022
Rating 3
Size 2,666 Kb
Views 12,144
Do you need developer help for Blank slates?

Find the perfect freelance services for your business! Fiverr's mission is to change how the world works together. Fiverr connects businesses with freelancers offering digital services in 500+ categories. Find Developer!

Dave (DaveOrDead) Script Codes
Name
Inline-block grid
Pogo map
Flexbox Grid - equal height
Shell CSS lib
React Calculator
Dice roller
Callbacks
Validation fun
Webpack config
Callbacks 2 - Passing arguments
Create amazing love letters with AI!

Jasper is the AI Content Generator that helps you and your team break through creative blocks to create amazing, original content 10X faster. Discover all the ways the Jasper AI Content Platform can help streamline your creative workflows. Start For Free!