Assign element ids in templates

This commit is contained in:
Benjamin Beganović 2020-09-04 13:16:05 +02:00
parent 4b6c2bff4c
commit 52dea9c665
9 changed files with 43 additions and 47 deletions

View File

@ -1,11 +1,11 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<head> <head id="head">
<meta charset="UTF-8" /> <meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" />
</head> </head>
<style> <style id="style">
* { * {
margin: 0; margin: 0;
padding: 0; padding: 0;
@ -111,8 +111,8 @@
} }
</style> </style>
<body> <body id="body">
<div class="header-wrapper"> <div class="header-wrapper" id="header">
<div> <!-- Empty space placeholder--> </div> <div> <!-- Empty space placeholder--> </div>
<div id="company-details"></div> <div id="company-details"></div>

View File

@ -1,6 +1,6 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<head> <head id="head">
<meta charset="UTF-8" /> <meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" />
@ -137,8 +137,8 @@
</style> </style>
</head> </head>
<body> <body id="body">
<div class="header-container"> <div class="header-container" id="header">
<img <img
src="$company.logo" src="$company.logo"
class="company-logo" class="company-logo"

View File

@ -1,11 +1,11 @@
<!-- Template: Clean --> <!-- Template: Clean -->
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<head> <head id="head">
<meta charset="UTF-8" /> <meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" />
<style> <style id="style">
body { body {
margin: 2rem; margin: 2rem;
-webkit-font-smoothing: antialiased; -webkit-font-smoothing: antialiased;
@ -111,8 +111,8 @@
</style> </style>
</head> </head>
<body> <body id="body">
<div class="header-container"> <div class="header-container" id="header">
<img <img
class="company-logo" class="company-logo"
src="$company.logo" src="$company.logo"

View File

@ -1,10 +1,10 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<head> <head id="head">
<meta charset="UTF-8" /> <meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" />
<style> <style id="style">
* { * {
margin: 0; margin: 0;
padding: 0; padding: 0;
@ -104,8 +104,8 @@
</style> </style>
</head> </head>
<body class="background"> <body id="body">
<div class="header-wrapper"> <div class="header-wrapper" id="header">
<div id="client-details"></div> <div id="client-details"></div>
<div class="company-info-wrapper"> <div class="company-info-wrapper">

View File

@ -1,10 +1,10 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<head> <head id="head">
<meta charset="UTF-8" /> <meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" />
<style> <style id="style">
* { * {
margin: 0; margin: 0;
padding: 0; padding: 0;
@ -121,8 +121,8 @@
</style> </style>
</head> </head>
<body> <body id="body">
<div class="company-logo-wrapper"> <div class="company-logo-wrapper" id="header">
<img <img
class="company-logo" class="company-logo"
src="$company.logo" src="$company.logo"
@ -154,9 +154,9 @@
<table id="product-table" cellspacing="0"></table> <table id="product-table" cellspacing="0"></table>
<footer id="footer"></footer> <footer id="footer">
<p class="thanks-label">$thanks_label!</p> <p class="thanks-label">$thanks_label!</p>
<hr class="double-border" /> <hr class="double-border" />
</footer>
</body> </body>
</html> </html>

View File

@ -1,10 +1,10 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<head> <head id="head">
<meta charset="UTF-8" /> <meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" />
<style> <style id="style">
* { * {
margin: 0; margin: 0;
padding: 0; padding: 0;
@ -128,25 +128,21 @@
</style> </style>
</head> </head>
<body> <body id="body">
<div class="header-wrapper"> <div class="header-wrapper" id="header">
<div class="header-left-side-wrapper"> <div class="header-left-side-wrapper">
<p class="header-text-label">$from_label:</p> <p class="header-text-label">$from_label:</p>
<!-- company_details -->
<div id="company-details"></div>
<!-- company_address --> <div id="company-details"></div>
<div id="company-address"></div> <div id="company-address"></div>
</div> </div>
<div class="header-right-side-wrapper"> <div class="header-right-side-wrapper">
<!-- client_details -->
<div> <div>
<p class="header-text-label">$to_label:</p> <p class="header-text-label">$to_label:</p>
<div id="client-details"></div> <div id="client-details"></div>
</div> </div>
<!-- company_logo -->
<img <img
class="company-logo" class="company-logo"
src="$company.logo" src="$company.logo"

View File

@ -1,10 +1,10 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<head> <head id="head">
<meta charset="UTF-8" /> <meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" />
<style> <style id="style">
* { * {
margin: 0; margin: 0;
padding: 0; padding: 0;
@ -124,8 +124,8 @@
</style> </style>
</head> </head>
<body> <body id="body">
<div class="header-container"> <div class="header-container" id="header">
<h1 class="company-name">$company.name</h1> <h1 class="company-name">$company.name</h1>
<table id="entity-details" cellspacing="0"></table> <table id="entity-details" cellspacing="0"></table>
@ -145,8 +145,6 @@
<table id="product-table" cellspacing="0"></table> <table id="product-table" cellspacing="0"></table>
</div> </div>
<footer id="footer"></footer>
<div class="footer-wrapper"> <div class="footer-wrapper">
<div> <div>
<!-- Placeholder for offset --> <!-- Placeholder for offset -->
@ -155,5 +153,7 @@
<div id="company-details"></div> <div id="company-details"></div>
<div id="company-address"></div> <div id="company-address"></div>
</div> </div>
<footer id="footer"></footer>
</body> </body>
</html> </html>

View File

@ -1,10 +1,10 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<head> <head id="head">
<meta charset="UTF-8" /> <meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" />
<style> <style id="style">
* { * {
margin: 0; margin: 0;
padding: 0; padding: 0;
@ -93,7 +93,7 @@
</style> </style>
</head> </head>
<body> <body id="body">
<div class="header-wrapper" id="header"> <div class="header-wrapper" id="header">
<p>$company.name</p> <p>$company.name</p>

View File

@ -1,10 +1,10 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<head> <head id="head">
<meta charset="UTF-8" /> <meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" />
<style> <style id="style">
* { * {
margin: 0; margin: 0;
padding: 0; padding: 0;
@ -133,8 +133,8 @@
</style> </style>
</head> </head>
<body> <body id="body">
<div class="header-wrapper"> <div class="header-wrapper" id="header">
<img <img
class="company-logo" class="company-logo"
src="$company.logo" src="$company.logo"