GR TYM

Developer
Ashepherd1
Size
4,471 Kb
Views
10,120
  1. GR TYM Previews
  2. GR TYM HTML Codes
  3. GR TYM CSS Codes

How do I make an gr tym?

What is a gr tym? How do you make a gr tym? This script and codes were developed by Ashepherd1 on 29 November 2022, Tuesday.

GR TYM Previews
IQ Test

GR TYM - Script Codes HTML Codes

<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>GR TYM</title> <link rel='stylesheet prefetch' href='https://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css'>
<link rel='stylesheet prefetch' href='https://crateandbarrel.com/bundles/Styles/common.xs.css'>
<link rel='stylesheet prefetch' href='https://crateandbarrel.com/bundles/Areas/Browse/Styles/Browse.xs.css'>
<link rel='stylesheet prefetch' href='https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css'> <link rel="stylesheet" href="css/style.css">
</head>
<body> <div class="wrap"> <div class="tym-layout"> <div class="tym"> <div class="row tym-intro"> <h1 class="page-title">Thank You Manager</h1> <div class="col-xs-12 col-sm-10"> <p>As friends and family buy gifts from your registry, we'll keep a log of who gave what right here.</p> <p>Keep track of gifts received and thank you notes you send. It's one more way we halp you stay organized and ready for your big day.</p> </div> <div class="hidden-xs col-sm-2"> <a href="javascript:window.print();" rel="nofollow,noindex" role="button" class="print-page"><span>Print<span class="sr-only"> this Page</span></span></a> </div> </div> <div class="row tym-th hidden-xs"> <div class="col-sm-2 tym-giver">Gift Giver / Address</div> <div class="col-sm-1 tym-date">Date</div> <div class="col-sm-3 tym-gift">Gifts Purchased</div> <div class="col-sm-1 tym-qty">Qty</div> <div class="col-sm-2 tym-status">Gift Status</div> <div class="col-sm-3">My Notes</div> </div> <div class="row tym-row"> <div class="col-xs-8 col-sm-2 tym-giver"> <span class="tym-name">Aly Raisman</span> <span class="tym-address">81 Grafton<br />Arlington, MA 02474<br />USA</p> </div> <div class="col-xs-4 col-sm-1 tym-date">10/11/2016</div> <div class="col-xs-12 col-sm-4 tym-gift-qty"> <div class="row"> <div class="col-xs-9 col-sm-10 tym-gift">Acorn 90" Round Tablecloth<span class="tym-sku">SKU: 647663</span></div> <div class="col-xs-3 col-sm-2 tym-qty"><span>1</span></div> </div> <div class="row"> <div class="col-xs-9 col-sm-10 tym-gift">Gift Card</div> <div class="col-xs-3 col-sm-2 tym-qty"><span>13</span></div> </div> </div> <div class="col-xs-12 col-sm-2 tym-status"> <form> <fieldset> <legend class="sr-only">Gift Status</legend> <div class="col-xs-12"> <input type="checkbox" name="checkboxes" id="ckbx1" class="a11y-checkbox" /> <label for="ckbx1" class="a11y-checkbox-label">Gift Received</label> </div> <div class="col-xs-12"> <input type="checkbox" name="checkboxes" id="ckbx2" class="a11y-checkbox" /> <label for="ckbx2" class="a11y-checkbox-label">Thank You Sent</label> </div> </fieldset> </form> </div> <div class="col-xs-12 col-sm-3 tym-notes"> <div class="row"> <div class="col-sm-8"> <label for="my-notes">My Notes</label> <textarea id="my-notes" name="my-notes"></textarea> </div> <div class="col-sm-4"> <button class="btn btn-primary btn-block">Save</button> </div> </div> </div> </div> </div> </div>
</div> <script src='https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.0/jquery.min.js'></script>
</body>
</html>

GR TYM - Script Codes CSS Codes

@media screen and (max-width: 768px) { body { background: silver; } .wrap { background: white; width: 100%; max-width: 480px; margin: auto; } .wrap .tym-layout { width: 100%; min-height: 600px; } .wrap .tym-layout .tym { padding: 10px 1.3em; } .wrap .tym-layout .tym .tym-row { border-top: 1px solid #ccc; border-bottom: 1px solid #ccc; margin: 0 -1.3em; padding: 1.3em; } .wrap .tym-layout .tym .tym-row .tym-date { text-align: right; } .wrap .tym-layout .tym .tym-row .tym-gift { margin-bottom: 15px; } .wrap .tym-layout .tym .tym-row .tym-gift span { display: block; font-size: 12px; } .wrap .tym-layout .tym .tym-row .tym-qty { float: right; position: relative; } .wrap .tym-layout .tym .tym-row .tym-qty span { width: auto; float: right; } .wrap .tym-layout .tym .tym-row .tym-qty span:before { content: "Qty: "; } .wrap .tym-layout .tym .tym-row .tym-giver .tym-name { font-size: 15px; font-weight: 600; display: block; } .wrap .tym-layout .tym .tym-row .tym-status { margin-bottom: 10px; font-size: 15px; } .wrap .tym-layout .tym .tym-row .tym-status label { font-weight: 600; font-size: 14px; } .wrap .tym-layout .tym .tym-row .tym-notes label { font-size: 14px; text-transform: uppercase; font-weight: 600; margin-bottom: 4px; color: black; } .wrap .tym-layout .tym .tym-row .tym-notes textarea { min-height: 60px !important; }
}
@media screen and (min-width: 768px) { .wrap { width: 1008px; margin: 50px auto; } .wrap .tym-layout { width: 100%; min-height: 600px; /* custom widths */ /* end custom widths */ } .wrap .tym-layout .tym { padding-bottom: 100px; } .wrap .tym-layout .tym .tym-intro { font-size: 12px; margin-bottom: 20px; } .wrap .tym-layout .tym .tym-intro p { margin-bottom: 0; } .wrap .tym-layout .tym .tym-intro .print-page { padding: 5px 10px 5px 20px; text-align: right; font-size: 14px; float: right; color: black; position: relative; right: 4px; bottom: -13px; } .wrap .tym-layout .tym .tym-intro .print-page:before { content: ""; width: 40px; height: 24px; float: left; background: url(//images.crateandbarrel.com/is/image/Crate/fj_hwj_sprite?fmt=png-alpha) no-repeat; background-position: -111px -66px; } .wrap .tym-layout .tym .tym-th { padding: 12px 0 10px; border-top: 3px solid black; border-bottom: 1px solid #ccc; text-transform: uppercase; font-size: 12px; font-weight: 600; } .wrap .tym-layout .tym .tym-th .tym-status { padding-left: 8px; } .wrap .tym-layout .tym .tym-row { padding: 20px 0; border-bottom: 1px solid #ccc; } .wrap .tym-layout .tym .tym-row .btn-block { font-size: .9em !important; padding: .35em 1.2em !important; float: right; } .wrap .tym-layout .tym .tym-row .tym-giver .tym-name { font-size: 15px; font-weight: 600; margin-bottom: 1px; display: block; } .wrap .tym-layout .tym .tym-row .tym-giver .tym-address { font-size: 13px; margin-bottom: 3px; } .wrap .tym-layout .tym .tym-row .tym-gift-qty .tym-gift { margin-bottom: 18px; font-size: 15px; } .wrap .tym-layout .tym .tym-row .tym-gift-qty .tym-gift .tym-sku { display: block; font-size: 12px; margin-top: 4px; } .wrap .tym-layout .tym .tym-row .tym-gift-qty .tym-qty span { margin-right: 20px; float: right; } .wrap .tym-layout .tym .tym-row .tym-status { padding-left: 8px; } .wrap .tym-layout .tym .tym-row .tym-status label { font-weight: 600; font-size: 14px; } .wrap .tym-layout .tym .tym-row .tym-notes { padding-top: 5px; } .wrap .tym-layout .tym .tym-row .tym-notes label { height: 0; overflow: hidden; margin: 0; } .wrap .tym-layout .tym .tym-row .tym-notes textarea { min-height: 7em; margin-bottom: 0; } .wrap .tym-layout .tym .tym-row .btn-primary { background: #333333; border: 1px solid #333333; margin: 0; float: right; padding: .55em 1.4em !important; font-size: 1em !important; } .wrap .tym-layout .tym .tym-row .btn-primary:focus { background: #000000; } .wrap .tym-layout .tym-th .tym-giver { width: 19.66666667%; } .wrap .tym-layout .tym-th .tym-date { width: 10.33333333%; } .wrap .tym-layout .tym-th .tym-gift { width: 24%; } .wrap .tym-layout .tym-th .tym-qty { width: 4.33333333%; } .wrap .tym-layout .tym-giver { width: 19.66666667%; } .wrap .tym-layout .tym-date { width: 10.33333333%; } .wrap .tym-layout .tym-gift-qty { width: 28.33333333%; }
}
GR TYM - Script Codes
GR TYM - Script Codes
Home Page Home
Developer Ashepherd1
Username ashepherd1
Uploaded November 29, 2022
Rating 3
Size 4,471 Kb
Views 10,120
Do you need developer help for GR TYM?

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!

Ashepherd1 (ashepherd1) Script Codes
Name
Partially Responsive Content Layout
Fade Show Reveal by height
Pattern Library
A Pen by ashepherd1
Menu Toggle
Spill AMP Page
Lazy Sizes
Lazy image swap fade on hover.
Image swap fade on hover.
MatchMedia JS Listener
Create amazing captions 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!