Proper way to override task-list display

[jimhall]

Issue: when creating an task list item like so in a post:

- [x] Review relevant GitHub Labs

It generates the following display:

I would like to eliminate the green '>>' prior to the check area. I think it is redundant.
My challenge is that I don't know where I can change this behavior.

Does anyone know how to eliminate the green '>>'?

Workaround: I created a black dot to hide the green '>>'

I created an inline style for the post.html file using directions from this link:

<style>
ul.task-list {
  list-style: none; /* Remove default bullets */
}
ul.task-list li::before {
  content: "\2022";  /* Add content: \2022 is the CSS Code/unicode for a bullet */
  color: #151515; /* Change the color */
  font-weight: bold; /* If you want it to be bold */
  display: inline-block; /* Needed to add space between the bullet and the text */
  width: 1em; /* Also needed for space (tweak if needed) */
  margin-left: -3.5em; /* Also needed for space (tweak if needed) */
}
li.task-list-item {
  list-style-image: url("{{ '/assets/images/black-dot.png' | relative_url }}");
}
</style>

[davorpa]

Hi @jimhall

Here is where it is defined:

hacker/_sass/jekyll-theme-hacker.scss

Lines 152 to 154 in 4c94250

	ul li {
	list-style-image:url('../images/bullet.png');
	}

Try to put this rule above:

ul.task-list {
    list-style: none;
}
ul li.task-list-item {
    list-style-image: none;
}

Even easier, it isnt?

For a complete implementation acording this theme guidelines see PR #83

[rabooli]

در تاریخ سه‌شنبه ۳۱ اوت ۲۰۲۱،‏ ۰۵:۱۹ David Ordás ***@***.***> نوشت:

…

Hi @jimhall <https://github.com/jimhall> Here is where it is defined: https://github.com/pages-themes/hacker/blob/4c942506cf8d5329a9cbc66b1eff75ad86a49e34/_sass/jekyll-theme-hacker.scss#L152-L154 Try to put this rule above: ul.task-list li { list-style-image: none; } — You are receiving this because you are subscribed to this thread. Reply to this email directly, view it on GitHub <#75 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/AOOITSYMVVON766QEQS56PDT7QRINANCNFSM5AQFJVVA> . Triage notifications on the go with GitHub Mobile for iOS <https://apps.apple.com/app/apple-store/id1477376905?ct=notification-email&mt=8&pt=524675> or Android <https://play.google.com/store/apps/details?id=com.github.android&referrer=utm_campaign%3Dnotification-email%26utm_medium%3Demail%26utm_source%3Dgithub>.

[rabooli]

۱۴۰۰-۰۶-۰۹ ۶:۳۸ ‎+۰۴:۳۰ گرینویچ, rabooli ***@***.***>:

…

در تاریخ سه‌شنبه ۳۱ اوت ۲۰۲۱،‏ ۰۵:۱۹ David Ordás ***@***.***> نوشت: > Hi @jimhall <https://github.com/jimhall> > > Here is where it is defined: > > > https://github.com/pages-themes/hacker/blob/4c942506cf8d5329a9cbc66b1eff75ad86a49e34/_sass/jekyll-theme-hacker.scss#L152-L154 > > Try to put this rule above: > > ul.task-list li { > list-style-image: none; > } > > — > You are receiving this because you are subscribed to this thread. > Reply to this email directly, view it on GitHub > <#75 (comment)>, > or unsubscribe > <https://github.com/notifications/unsubscribe-auth/AOOITSYMVVON766QEQS56PDT7QRINANCNFSM5AQFJVVA> > . > Triage notifications on the go with GitHub Mobile for iOS > <https://apps.apple.com/app/apple-store/id1477376905?ct=notification-email&mt=8&pt=524675> > or Android > <https://play.google.com/store/apps/details?id=com.github.android&referrer=utm_campaign%3Dnotification-email%26utm_medium%3Demail%26utm_source%3Dgithub>. > > -- You are receiving this because you are subscribed to this thread. Reply to this email directly or view it on GitHub: #75 (comment)

[jimhall]

Oh wow - thanks for the workaround and like your final approach in PR #83

Thanks for the help!

[davorpa]

You are welcome,

Upvote then if you want to take more chance to be merged 😉

CSS outline property is the only way to enhace color customization due to the way tasklist checkboxes are rendered. Having checkboxes followed by a label will enable more posibilities

[rabooli]

در تاریخ سه‌شنبه ۳۱ اوت ۲۰۲۱،‏ ۱۸:۲۰ jimhall ***@***.***> نوشت:

…

Oh wow - thanks for the workaround and like your final approach in PR #83 <#83> Thanks for the help! — You are receiving this because you commented. Reply to this email directly, view it on GitHub <#75 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/AOOITS7VRDT5GKPJ7LXOTH3T7TM2TANCNFSM5AQFJVVA> . Triage notifications on the go with GitHub Mobile for iOS <https://apps.apple.com/app/apple-store/id1477376905?ct=notification-email&mt=8&pt=524675> or Android <https://play.google.com/store/apps/details?id=com.github.android&referrer=utm_campaign%3Dnotification-email%26utm_medium%3Demail%26utm_source%3Dgithub>.

[stale]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.