Actually, go with the below code, it has the default checkboxes fixed so 
you don't need to specify the PrintRiver div at all

input[type="checkbox"],
.tc-tiddler-body input[type="checkbox"], 
.tc-tiddler-preview-preview input[type="checkbox"], 
.tc-sidebar-scrollable input[type="checkbox"] {
   -webkit-appearance:none;
   background-color: rgba(var(--primary),0.15);
   border: none;
   box-shadow: 0 0 0 1px rgba(var(--primary),1) inset;
   display: inline-block;
   height: 0.8em;
   outline-color: transparent;
   width: 0.8em;
}

input[type="checkbox"]:checked,
.tc-tiddler-body input[type="checkbox"]:checked, 
.tc-tiddler-preview-preview input[type="checkbox"]:checked, 
.tc-sidebar-scrollable input[type="checkbox"]:checked { 
   background-color: rgba(var(--primary),1);
}

input[type="checkbox"]:checked::after,
.tc-tiddler-body input[type="checkbox"]:checked::after, 
.tc-tiddler-preview-preview input[type="checkbox"]:checked::after, 
.tc-sidebar-scrollable input[type="checkbox"]:checked::after { 
   color: rgba(var(--secondary),1);
   content: "\2713";
   font-size: 1em;
   font-weight: bold;
   left: 0;
   position: relative;
   text-shadow: 1px 1px 1px #000;
   top: -0.3em;
}

input[type="checkbox"]:active,
.tc-tiddler-body input[type="checkbox"]:active, 
.tc-tiddler-preview-preview input[type="checkbox"]:active, 
.tc-sidebar-scrollable input[type="checkbox"]:active { 
   border: none;
   box-shadow: none;
   outline-color: transparent;
}

On Friday, June 18, 2021 at 2:04:14 PM UTC-7 Brian Radspinner wrote:

> I added the PrintRiver div class to the code. Give the below update a shot:
>
>
> .tc-tiddler-body input[type="checkbox"],
> .tc-tiddler-preview-preview input[type="checkbox"],
> .tc-sidebar-scrollable input[type="checkbox"],
> .tc-print-river-view-template input[type="checkbox"] {
>
>    -webkit-appearance:none;
>    background-color: rgb(38,38,38);
>    border: none;
>    box-shadow: 0 0 0 1px rgba(210,210,210,0.5) inset;
>    display: inline-block;
>    height: 0.8em;
>    outline-color: transparent;
>    width: 0.8em;
> }
>
> .tc-tiddler-body input[type="checkbox"]:checked,
> .tc-tiddler-preview-preview input[type="checkbox"]:checked,
> .tc-sidebar-scrollable input[type="checkbox"]:checked,
> .tc-print-river-view-template input[type="checkbox"]:checked {
>
>    background-color: rgba(38, 38, 38,0.5);
> }
>
> .tc-tiddler-body input[type="checkbox"]:checked::after,
> .tc-tiddler-preview-preview input[type="checkbox"]:checked::after,
> .tc-sidebar-scrollable input[type="checkbox"]:checked::after,
> .tc-print-river-view-template input[type="checkbox"]:checked::after {
>
>    color: rgb(144,238,144);
>    content: "\2713";
>    font-size: 1.1em;
>    font-weight: bold;
>    left: 0;
>    position: relative;
>    text-shadow: 1px 1px 1px #000;
>    top: -0.3em;
> }
>
> .tc-tiddler-body input[type="checkbox"]:active,
> .tc-tiddler-preview-preview input[type="checkbox"]:active,
> .tc-sidebar-scrollable input[type="checkbox"]:active,
> .tc-print-river-view-template  input[type="checkbox"]:active {
>
>    border: none;
>    box-shadow: none;
>    outline-color: transparent;
> }
>
>
>
> On Friday, June 18, 2021 at 10:53:11 AM UTC-7 S² wrote:
>
>> Hello,
>>
>> I got this CSS ( 
>>
>> https://groups.google.com/g/tiddlywiki/c/483sdAJq6AY/m/r8Q3H8YmBQAJ
>> ) from Brain - thanks to Brain - to have custom checkbox colors.
>>
>> This is working fine for the Wiki but not for the PrintRiver Plugin.
>> Print Preview:
>> [image: PrintRiver_print_window.png]
>>
>> This is my adapted CSS:
>>
>> .tc-tiddler-body input[type="checkbox"],
>> .tc-tiddler-preview-preview input[type="checkbox"],
>> .tc-sidebar-scrollable input[type="checkbox"] {
>>    -webkit-appearance:none;
>>    background-color: rgb(38,38,38);
>>    border: none;
>>    box-shadow: 0 0 0 1px rgba(210,210,210,0.5) inset;
>>    display: inline-block;
>>    height: 0.8em;
>>    outline-color: transparent;
>>    width: 0.8em;
>> }
>>
>> .tc-tiddler-body input[type="checkbox"]:checked,
>> .tc-tiddler-preview-preview input[type="checkbox"]:checked,
>> .tc-sidebar-scrollable input[type="checkbox"]:checked {
>>    background-color: rgba(38, 38, 38,0.5);
>> }
>>
>> .tc-tiddler-body input[type="checkbox"]:checked::after,
>> .tc-tiddler-preview-preview input[type="checkbox"]:checked::after,
>> .tc-sidebar-scrollable input[type="checkbox"]:checked::after {
>>    color: rgb(144,238,144);
>>    content: "\2713";
>>    font-size: 1.1em;
>>    font-weight: bold;
>>    left: 0;
>>    position: relative;
>>    text-shadow: 1px 1px 1px #000;
>>    top: -0.3em;
>> }
>>
>> .tc-tiddler-body input[type="checkbox"]:active,
>> .tc-tiddler-preview-preview input[type="checkbox"]:active,
>> .tc-sidebar-scrollable input[type="checkbox"]:active {
>>    border: none;
>>    box-shadow: none;
>>    outline-color: transparent;
>> }
>>
>> What is needed to have it also for the PrintRiver Plugin?
>>
>> Thanks for feedback
>> Stefan
>>
>

-- 
You received this message because you are subscribed to the Google Groups 
"TiddlyWiki" group.
To unsubscribe from this group and stop receiving emails from it, send an email 
to tiddlywiki+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/tiddlywiki/516f59bc-5b66-4f5f-8d44-2c3bf16789d3n%40googlegroups.com.

Reply via email to