Topcoat starter project
How do I make an topcoat starter project?
Very basic Topcoat starter project. It already includes the Mobile dark styles and icons.. What is a topcoat starter project? How do you make a topcoat starter project? This script and codes were developed by Topcoat on 20 September 2022, Tuesday.
Topcoat starter project - Script Codes HTML Codes
<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>Topcoat starter project</title> <meta name="format-detection" content="telephone=no"><meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, width=device-width, height=device-width, target-densitydpi=device-dpi"> <link rel='stylesheet prefetch' href='http://cdnjs.cloudflare.com/ajax/libs/topcoat-icons/0.2.0/font/icomatic.css'>
<link rel='stylesheet prefetch' href='http://cdnjs.cloudflare.com/ajax/libs/topcoat/0.8.0/css/topcoat-mobile-dark.min.css'>
<link rel='stylesheet prefetch' href='http://topcoat.io/grid/css/grid.css'> <style> /* NOTE: The styles were added inline because Prefixfree needs access to your styles and they must be inlined if they are on local disk! */ .list { position: absolute; top: 4.35rem; right: 0; left: 0; bottom: 0;
}
.topcoat-icon { font-size: 1.55rem;
} </style> <script src="https://cdnjs.cloudflare.com/ajax/libs/prefixfree/1.0.7/prefixfree.min.js"></script>
</head>
<body> <div class="topcoat-grid">
<header class="topcoat-navigation-bar topcoat-grid__row"> <div class="topcoat-navigation-bar__item topcoat-grid__column--1"> <button class="topcoat-icon-button--quiet"> <span class="topcoat-icon icomatic">back</span>
</button> </div> <div class="topcoat-navigation-bar__item topcoat-grid__column--auto center"> <h1 class="topcoat-navigation-bar__title">How you doin</h1> </div>
</header>
<div class="topcoat-list list"> <h3 class="topcoat-list__header">Category</h3> <ul class="topcoat-list__container"> <li class="topcoat-list__item"> Item </li> <li class="topcoat-list__item"> Item </li> <li class="topcoat-list__item"> Item </li> <li class="topcoat-list__item"> Item </li> <li class="topcoat-list__item"> Item </li> <li class="topcoat-list__item"> Item </li> <li class="topcoat-list__item"> Item </li> <li class="topcoat-list__item"> Item </li> <li class="topcoat-list__item"> Item </li> <li class="topcoat-list__item"> Item </li> <li class="topcoat-list__item"> Item </li> <li class="topcoat-list__item"> Item </li> <li class="topcoat-list__item"> Item </li> <li class="topcoat-list__item"> Item </li> <li class="topcoat-list__item"> Item </li> <li class="topcoat-list__item"> Item </li> <li class="topcoat-list__item"> Item </li> <li class="topcoat-list__item"> Item </li> <li class="topcoat-list__item"> Item </li> <li class="topcoat-list__item"> Item </li> <li class="topcoat-list__item"> Item </li> <li class="topcoat-list__item"> Item </li> <li class="topcoat-list__item"> Item </li> <li class="topcoat-list__item"> Item </li> <li class="topcoat-list__item"> Item </li> <li class="topcoat-list__item"> Item </li> <li class="topcoat-list__item"> Item </li> <li class="topcoat-list__item"> Item </li> <li class="topcoat-list__item"> Item </li> <li class="topcoat-list__item"> Item </li> <li class="topcoat-list__item"> Item </li> <li class="topcoat-list__item"> Item </li> <li class="topcoat-list__item"> Item </li> </ul>
</div>
</body>
</html>
Topcoat starter project - Script Codes CSS Codes
.list { position: absolute; top: 4.35rem; right: 0; left: 0; bottom: 0;
}
.topcoat-icon { font-size: 1.55rem;
}
Developer | Topcoat |
Username | Topcoat |
Uploaded | September 20, 2022 |
Rating | 3 |
Size | 2,085 Kb |
Views | 12,144 |
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!
Name | Size |
Topcoat Mobile Button | 2,526 Kb |
Topcoat Checkboxes | 3,096 Kb |
Variables Shared | 2,466 Kb |
Topcoat Onsen UI theme | 1,295 Kb |
Topcoat Switch | 2,271 Kb |
Topcoat range input | 2,641 Kb |
Topcoat Desktop Light | 27,370 Kb |
Variables Dark | 2,731 Kb |
Topcoat Tab Bar | 2,548 Kb |
Topcoat Radio Buttons | 2,599 Kb |
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!
Name | Username | Size |
A Bouncy Menu Toggle | Billyysea | 4,563 Kb |
Sticky div | Kaslab | 2,225 Kb |
Filter inputs | Rowinf | 1,721 Kb |
No Vacancy 404 CSS Only | Sethkontny | 0 Kb |
Siema - add pagination to prototype | Pawelgrzybek | 2,575 Kb |
WRENCH - STAFF | Lolita-adams | 1,608 Kb |
Android Play Store With Slick Carousel | -J0hn- | 4,982 Kb |
Haml Calendar | Katydecorah | 5,643 Kb |
Headroom.js demo | WickyNilliams | 3,982 Kb |
GrcJS | Vino6 | 2,047 Kb |
Surf anonymously, prevent hackers from acquiring your IP address, send anonymous email, and encrypt your Internet connection. High speed, ultra secure, and easy to use. Instant setup. Hide Your IP Now!