Skip to content

Commit

Permalink
Work credits table improvements (#365)
Browse files Browse the repository at this point in the history 
* Improved the layout and formatting of the work credits guide page.

* Adjusted the layout of the work credits table to ensure the final year is consistently aligned with the other years.
  • Loading branch information
@Gregable
Gregable authored Jul 21, 2024
1 parent 620a47e commit 92688a3
Showing 1 changed file with 58 additions and 35 deletions.
93 changes: 58 additions & 35 deletions src/routes/guides/work-credits/+page.svelte
View file
Original file line number Diff line number Diff line change
Expand Up @@ -28,25 +28,32 @@
<p class="postdate">Published: {publishDate.toLocaleDateString()}</p>

<p>
Understanding work credits is crucial for anyone planning their retirement or considering Social Security benefits. This guide explains what work credits are, how to earn them, and why they matter for your Social Security eligibility.
Understanding work credits is crucial for anyone planning their retirement
or considering Social Security benefits. This guide explains what work
credits are, how to earn them, and why they matter for your Social Security
eligibility.
</p>

<h2>What Are Work Credits?</h2>

<p>
<strong>Work credits</strong> are the building blocks of your Social Security eligibility. They are earned by working and paying Social Security taxes. This system ensures a minimum level of work contribution before qualifying for benefits.
<strong>Work credits</strong> are the building blocks of your Social Security
eligibility. They are earned by working and paying Social Security taxes. This
system ensures a minimum level of work contribution before qualifying for benefits.
</p>

<h2>How Many Work Credits Do I Need?</h2>

<h3>For Retirement Benefits</h3>
<p>
<strong>You need 40 work credits to qualify for retirement benefits.</strong> This typically requires at least 10 years of work.
<strong>You need 40 work credits to qualify for retirement benefits.</strong
> This typically requires at least 10 years of work.
</p>

<h3>For Survivor's Benefits</h3>
<p>
The number of work credits required for your family to qualify for survivor's benefits depends on your age at the time of death:
The number of work credits required for your family to qualify for
survivor's benefits depends on your age at the time of death:
</p>
<ul>
<li>Younger individuals need fewer credits</li>
Expand All @@ -55,7 +62,11 @@

<h3>For Disability Benefits</h3>
<p>
The required number of work credits for disability benefits varies based on your age when you become disabled. For more details, visit the <a href="https://www.ssa.gov/benefits/retirement/planner/credits.html#h3">official SSA website</a>.
The required number of work credits for disability benefits varies based on
your age when you become disabled. For more details, visit the <a
href="https://www.ssa.gov/benefits/retirement/planner/credits.html#h3"
>official SSA website</a
>.
</p>

<h2>How Do I Earn Work Credits?</h2>
Expand All @@ -69,78 +80,90 @@

<h3>Before 1987</h3>
<p>
One work credit was earned for each calendar quarter with at least $250 in wages. These were also known as "quarters of coverage" (QCs).
One work credit was earned for each calendar quarter with at least $250 in
wages. These were also known as "quarters of coverage" (QCs).
</p>

<h3>After 1987</h3>
<p>
The system changed to a yearly basis:
</p>
<p>The system changed to a yearly basis:</p>
<ul>
<li>One credit is earned for each fixed dollar amount of earnings</li>
<li>The required amount changes annually to keep pace with wage growth</li>
<li>Example: In 2000, you would earn one credit for each $780 of earnings</li>
<li>
Example: In 2000, you would earn one credit for each $780 of earnings
</li>
</ul>

<h2>Amount of Earnings Needed per Credit</h2>

<p>
The earnings required to earn a credit change yearly. Here's a table showing the amount needed for each year since 1978:
The earnings required to earn a credit change yearly. Here's a table showing
the amount needed for each year since 1978:
</p>

<table class="earnings-table">
<tr><th>Year</th><th>Earnings Required</th></tr>
<div class="earnings-container">
{#each Object.entries(constants.EARNINGS_PER_CREDIT) as [year, earnings]}
<tr>
<td>{year}</td>
<td>${earnings.wholeDollars()}</td>
</tr>
<div class="earnings-year">
<span class="year">{year}:</span>
<span class="earnings">{earnings.wholeDollars()}</span>
</div>
{/each}
</table>

</div>
<p>
<strong>Example:</strong> In 1989, $500 earned one credit. With $1,700 in earnings that year, you would earn 3 credits. The extra $200 above $1,500 would not count towards a partial credit.
<strong>Example:</strong> In 1989, $500 earned one credit. With $1,700 in earnings
that year, you would earn 3 credits. The extra $200 above $1,500 would not count
towards a partial credit.
</p>

<h2>Qualifying for Spousal Benefits</h2>

<p>
<strong>Important note:</strong> To receive spousal benefits, you don't need to have earned work credits yourself. You only need to be married to someone who has earned enough work credits.
<strong>Important note:</strong> To receive spousal benefits, you don't need
to have earned work credits yourself. You only need to be married to someone
who has earned enough work credits.
</p>

<h2>Additional Resources</h2>

<ul>
<li>
<a href="https://www.ssa.gov/benefits/retirement/planner/credits.html">Social Security Administration: How You Earn Credits</a>
<a href="https://www.ssa.gov/benefits/retirement/planner/credits.html"
>Social Security Administration: How You Earn Credits</a
>
</li>
<li>
<a href="https://www.ssa.gov/benefits/retirement/planner/credits.html#h3">Social Security Administration: How Many Credits You Need</a>
<a href="https://www.ssa.gov/benefits/retirement/planner/credits.html#h3"
>Social Security Administration: How Many Credits You Need</a
>
</li>
<li>
<a href="https://www.ssa.gov/oact/cola/QC.html">Social Security Administration: Quarters of Coverage</a>
<a href="https://www.ssa.gov/oact/cola/QC.html"
>Social Security Administration: Quarters of Coverage</a
>
</li>
</ul>

<GuideFooter />
</div>

<style>
.earnings-table {
.earnings-container {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
gap: 0.5rem;
width: 100%;
border-collapse: collapse;
margin-bottom: 1rem;
font-size: 1.3rem;
padding: 1rem 0;
}
.earnings-table th, .earnings-table td {
border: 1px solid #ddd;
padding: 8px;
text-align: left;
.earnings-year {
padding: 0.5rem;
}
.earnings-table th {
background-color: #f2f2f2;
.year {
font-weight: bold;
padding-right: 0.5rem;
}
.earnings-table tr:nth-child(even) {
background-color: #f9f9f9;
.earnings {
display: inline-block;
width: 4em;
}
</style>

0 comments on commit 92688a3

Please sign in to comment.