fix: Center course info below participant name in certificates
Layout now: 1. Participant name (centered) 2. Course title (centered, below name) 3. Date range (centered, below course title) Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
@@ -39,20 +39,29 @@
|
||||
background-repeat: no-repeat;
|
||||
}
|
||||
|
||||
/* Course info section - positioned below "o absolvovaní kurzu" */
|
||||
.course-section {
|
||||
/* Main content - centered in the white area */
|
||||
.main-content {
|
||||
position: absolute;
|
||||
top: 32mm;
|
||||
left: 18mm;
|
||||
right: 18mm;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
text-align: center;
|
||||
margin-top: -15mm;
|
||||
}
|
||||
|
||||
.participant-name {
|
||||
font-size: 28pt;
|
||||
font-weight: 700;
|
||||
color: #1a1a1a;
|
||||
margin-bottom: 8mm;
|
||||
}
|
||||
|
||||
.course-title {
|
||||
font-family: 'Bahnschrift', 'Open Sans', Arial, sans-serif;
|
||||
font-size: 32pt;
|
||||
font-size: 24pt;
|
||||
font-weight: 700;
|
||||
color: #1a1a1a;
|
||||
margin-bottom: 5mm;
|
||||
margin-bottom: 4mm;
|
||||
}
|
||||
|
||||
.course-dates {
|
||||
@@ -68,21 +77,6 @@
|
||||
color: #1a1a1a;
|
||||
}
|
||||
|
||||
/* Participant name - centered above the horizontal line */
|
||||
.participant-section {
|
||||
position: absolute;
|
||||
top: 92mm;
|
||||
left: 0;
|
||||
right: 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.participant-name {
|
||||
font-size: 28pt;
|
||||
font-weight: 700;
|
||||
color: #1a1a1a;
|
||||
}
|
||||
|
||||
/* Issue date - above "Dátum" at bottom left */
|
||||
.issue-date {
|
||||
position: absolute;
|
||||
@@ -103,7 +97,8 @@
|
||||
</head>
|
||||
<body>
|
||||
<div class="certificate">
|
||||
<div class="course-section">
|
||||
<div class="main-content">
|
||||
<h3 class="participant-name">{{participantName}}</h3>
|
||||
<h2 class="course-title">{{courseTitle}}</h2>
|
||||
{{#if dateRange}}
|
||||
<p class="course-dates">{{dateRange}}</p>
|
||||
@@ -113,10 +108,6 @@
|
||||
{{/if}}
|
||||
</div>
|
||||
|
||||
<div class="participant-section">
|
||||
<h3 class="participant-name">{{participantName}}</h3>
|
||||
</div>
|
||||
|
||||
<div class="issue-date">{{issueDate}}</div>
|
||||
<div class="certificate-id">ID: {{certificateId}}</div>
|
||||
</div>
|
||||
|
||||
@@ -39,20 +39,29 @@
|
||||
background-repeat: no-repeat;
|
||||
}
|
||||
|
||||
/* Course info section - positioned below "o absolvovaní kurzu" */
|
||||
.course-section {
|
||||
/* Main content - centered in the white area */
|
||||
.main-content {
|
||||
position: absolute;
|
||||
top: 32mm;
|
||||
left: 18mm;
|
||||
right: 18mm;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
text-align: center;
|
||||
margin-top: -15mm;
|
||||
}
|
||||
|
||||
.participant-name {
|
||||
font-size: 28pt;
|
||||
font-weight: 700;
|
||||
color: #1a1a1a;
|
||||
margin-bottom: 8mm;
|
||||
}
|
||||
|
||||
.course-title {
|
||||
font-family: 'Bahnschrift', 'Open Sans', Arial, sans-serif;
|
||||
font-size: 32pt;
|
||||
font-size: 24pt;
|
||||
font-weight: 700;
|
||||
color: #1a1a1a;
|
||||
margin-bottom: 5mm;
|
||||
margin-bottom: 4mm;
|
||||
}
|
||||
|
||||
.course-dates {
|
||||
@@ -68,21 +77,6 @@
|
||||
color: #1a1a1a;
|
||||
}
|
||||
|
||||
/* Participant name - centered above the horizontal line */
|
||||
.participant-section {
|
||||
position: absolute;
|
||||
top: 92mm;
|
||||
left: 0;
|
||||
right: 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.participant-name {
|
||||
font-size: 28pt;
|
||||
font-weight: 700;
|
||||
color: #1a1a1a;
|
||||
}
|
||||
|
||||
/* Issue date - above "Dátum" at bottom left */
|
||||
.issue-date {
|
||||
position: absolute;
|
||||
@@ -103,7 +97,8 @@
|
||||
</head>
|
||||
<body>
|
||||
<div class="certificate">
|
||||
<div class="course-section">
|
||||
<div class="main-content">
|
||||
<h3 class="participant-name">{{participantName}}</h3>
|
||||
<h2 class="course-title">{{courseTitle}}</h2>
|
||||
{{#if dateRange}}
|
||||
<p class="course-dates">{{dateRange}}</p>
|
||||
@@ -113,10 +108,6 @@
|
||||
{{/if}}
|
||||
</div>
|
||||
|
||||
<div class="participant-section">
|
||||
<h3 class="participant-name">{{participantName}}</h3>
|
||||
</div>
|
||||
|
||||
<div class="issue-date">{{issueDate}}</div>
|
||||
<div class="certificate-id">ID: {{certificateId}}</div>
|
||||
</div>
|
||||
|
||||
@@ -39,20 +39,29 @@
|
||||
background-repeat: no-repeat;
|
||||
}
|
||||
|
||||
/* Course info section - positioned below "o absolvovaní kurzu" */
|
||||
.course-section {
|
||||
/* Main content - centered in the white area */
|
||||
.main-content {
|
||||
position: absolute;
|
||||
top: 32mm;
|
||||
left: 18mm;
|
||||
right: 18mm;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
text-align: center;
|
||||
margin-top: -15mm;
|
||||
}
|
||||
|
||||
.participant-name {
|
||||
font-size: 28pt;
|
||||
font-weight: 700;
|
||||
color: #1a1a1a;
|
||||
margin-bottom: 8mm;
|
||||
}
|
||||
|
||||
.course-title {
|
||||
font-family: 'Bahnschrift', 'Open Sans', Arial, sans-serif;
|
||||
font-size: 32pt;
|
||||
font-size: 24pt;
|
||||
font-weight: 700;
|
||||
color: #1a1a1a;
|
||||
margin-bottom: 5mm;
|
||||
margin-bottom: 4mm;
|
||||
}
|
||||
|
||||
.course-dates {
|
||||
@@ -68,21 +77,6 @@
|
||||
color: #1a1a1a;
|
||||
}
|
||||
|
||||
/* Participant name - centered above the horizontal line */
|
||||
.participant-section {
|
||||
position: absolute;
|
||||
top: 92mm;
|
||||
left: 0;
|
||||
right: 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.participant-name {
|
||||
font-size: 28pt;
|
||||
font-weight: 700;
|
||||
color: #1a1a1a;
|
||||
}
|
||||
|
||||
/* Issue date - above "Dátum" at bottom left */
|
||||
.issue-date {
|
||||
position: absolute;
|
||||
@@ -103,7 +97,8 @@
|
||||
</head>
|
||||
<body>
|
||||
<div class="certificate">
|
||||
<div class="course-section">
|
||||
<div class="main-content">
|
||||
<h3 class="participant-name">{{participantName}}</h3>
|
||||
<h2 class="course-title">{{courseTitle}}</h2>
|
||||
{{#if dateRange}}
|
||||
<p class="course-dates">{{dateRange}}</p>
|
||||
@@ -113,10 +108,6 @@
|
||||
{{/if}}
|
||||
</div>
|
||||
|
||||
<div class="participant-section">
|
||||
<h3 class="participant-name">{{participantName}}</h3>
|
||||
</div>
|
||||
|
||||
<div class="issue-date">{{issueDate}}</div>
|
||||
<div class="certificate-id">ID: {{certificateId}}</div>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user