Skip to content

Commit 37a4936

Browse files
Nick2bad4uNick2bad4u
committed
chore(css): update version to 1.6.4 and refine styling logic for Reddit comments
1 parent 0f64f68 commit 37a4936

1 file changed

Lines changed: 126 additions & 127 deletions

File tree

‎RedditColoredComments.user.css‎

Lines changed: 126 additions & 127 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
@namespace typpi.online
44
@description Customizable Colored Comments for Reddit. [Updated for RES Users 2025]
55
@author vednoc [Updated by Nick2bad4u]
6-
@version 1.6.3
6+
@version 1.6.4
77
@license MIT
88
@homepageURL https://github.com/Nick2bad4u/UserStyles
99
@supportURL https://github.com/Nick2bad4u/UserStyles/issues
@@ -69,130 +69,129 @@ Original Style made by Vendoc
6969
7070
==/UserStyle== */
7171
@-moz-document domain('reddit.com') {
72-
// Set line width for the new design
73-
if ( lineWidth != 2 ) {
74-
.threadline {
75-
border-right-width: s( '%spx', lineWidth ) !important;
76-
}
77-
}
78-
79-
// Set mode for line style in the new design
80-
$mode = '';
81-
82-
if ( lineStyle ) {
83-
$mode = '> div >';
84-
}
85-
86-
// Apply colors and styles to each level up to 20
87-
for $i in 1 .. 20 {
88-
div[id ^= 't'] > :first-child,
89-
div[id ^= 'moreComments'] > :first-child,
90-
div[id ^= 'continueThread'] > :first-child {
91-
// Create a string for the nth-child selector
92-
$nth = s( '%s', $i );
93-
94-
> :nth-child({$nth}) {
95-
$mode;
96-
}
97-
98-
.threadline {
99-
border-right-color: color + $i !important;
100-
}
101-
102-
// Hide previous lines if the option is checked
103-
if ( hideLines ) {
104-
> :nth-child({$nth}) > .threadline {
105-
border-right-color: #0000 !important;
106-
}
107-
}
108-
}
109-
}
110-
111-
// Old design specific styles
112-
.comment .child,
113-
.comment .showreplies,
114-
.res-commentBoxes.res-continuity .comment div.child {
115-
// Set line width for the old design
116-
if ( oldLineWidth != 1 ) {
117-
border-left-width: s( '%spx', oldLineWidth ) !important;
118-
}
119-
120-
// Set line style for the old design
121-
if ( oldLineStyle == 0 ) {
122-
border-left-style: solid !important;
123-
}
124-
else {
125-
border-left-style: dotted !important;
126-
}
127-
}
128-
129-
// Apply colors to nested child elements
130-
$str = '.res-commentBoxes.res-continuity .comment div.child ';
131-
132-
for $i in 1 .. 20 {
133-
{$str} {
134-
border-left-color: color + $i !important;
135-
}
136-
137-
// Increase the nesting level for each iteration
138-
$str += '> .sitetable > .comment > .child ';
139-
}
140-
141-
// Toggle coloring of the area
142-
if ( oldMinimizeRainbow == 1 ) {
143-
// Apply color to .expand elements within nested child elements
144-
$str2 = '.res-commentBoxes.res-continuity .comment div.child ';
145-
146-
for $i in 1 .. 20 {
147-
{$str2} .expand {
148-
background-color: color + $i !important;
149-
}
150-
151-
// Increase the nesting level for each iteration
152-
$str2 += '> .sitetable > .comment > .child ';
153-
}
154-
}
155-
156-
if ( oldHoverRainbow == 1 && oldMinimizeRainbow == 1 ) {
157-
// Apply hover effect to .expand elements within nested child elements
158-
$str5 = '.res-commentBoxes.res-continuity .comment div.child ';
159-
160-
for $i in 11 .. 20 {
161-
{$str5} .expand:hover {
162-
background-color: color + $i !important;
163-
}
164-
165-
// Increase the nesting level for each iteration
166-
$str5 += '> .sitetable > .comment > .child ';
167-
}
168-
}
169-
170-
171-
if ( oldHoverRainbow == 1 && oldMinimizeRainbow == 0 ) {
172-
// Apply hover effect to .expand elements within nested child elements
173-
$str5 = '.res-commentBoxes.res-continuity .comment div.child ';
174-
175-
for $i in 1 .. 20 {
176-
{$str5} .expand:hover {
177-
background-color: color + $i !important;
178-
}
179-
180-
// Increase the nesting level for each iteration
181-
$str5 += '> .sitetable > .comment > .child ';
182-
}
183-
}
184-
185-
if ( oldMinimizeArea == 1 ) {
186-
// Apply a background color to .expand elements in the tagline
187-
.commentarea .entry > .tagline > .expand {
188-
background-color: oldMinimizeColor !important;
189-
}
190-
}
191-
192-
if ( oldHoverArea == 1 ) {
193-
// Apply a background color to .expand elements in the tagline
194-
.commentarea .entry > .tagline > .expand:hover {
195-
background-color: oldHoverColor !important;
196-
}
197-
}
72+
// Set line width for the new design
73+
if ( lineWidth != 2 ) {
74+
.threadline {
75+
border-right-width: s( '%spx', lineWidth ) !important;
76+
}
77+
}
78+
79+
// Set mode for line style in the new design
80+
$mode = '';
81+
82+
if ( lineStyle ) {
83+
$mode = '> div >';
84+
}
85+
86+
// Apply colors and styles to each level up to 20
87+
for $i in 1 .. 20 {
88+
div[id ^= 't'] > :first-child,
89+
div[id ^= 'moreComments'] > :first-child,
90+
div[id ^= 'continueThread'] > :first-child {
91+
// Create a string for the nth-child selector
92+
$nth = s( '%s', $i );
93+
94+
> :nth-child({$nth}) {
95+
$mode;
96+
}
97+
98+
.threadline {
99+
border-right-color: color + $i !important;
100+
}
101+
102+
// Hide previous lines if the option is checked
103+
if ( hideLines ) {
104+
> :nth-child({$nth}) > .threadline {
105+
border-right-color: #0000 !important;
106+
}
107+
}
108+
}
109+
}
110+
111+
// Old design specific styles
112+
.comment .child,
113+
.comment .showreplies,
114+
.res-commentBoxes.res-continuity .comment div.child {
115+
// Set line width for the old design
116+
if ( oldLineWidth != 1 ) {
117+
border-left-width: s( '%spx', oldLineWidth ) !important;
118+
}
119+
120+
// Set line style for the old design
121+
if ( oldLineStyle == 0 ) {
122+
border-left-style: solid !important;
123+
}
124+
else {
125+
border-left-style: dotted !important;
126+
}
127+
}
128+
129+
// Apply colors to nested child elements
130+
$str = '.res-commentBoxes.res-continuity .comment div.child ';
131+
132+
for $i in 1 .. 20 {
133+
{$str} {
134+
border-left-color: color + $i !important;
135+
}
136+
137+
// Increase the nesting level for each iteration
138+
$str += '> .sitetable > .comment > .child ';
139+
}
140+
141+
// Toggle coloring of the area
142+
if ( oldMinimizeRainbow == 1 ) {
143+
// Apply color to .expand elements within nested child elements
144+
$str2 = '.res-commentBoxes.res-continuity .comment div.child ';
145+
146+
for $i in 1 .. 20 {
147+
{$str2} .expand {
148+
background-color: color + $i !important;
149+
}
150+
151+
// Increase the nesting level for each iteration
152+
$str2 += '> .sitetable > .comment > .child ';
153+
}
154+
}
155+
156+
if ( oldHoverRainbow == 1 && ( oldMinimizeRainbow == 1 ) ) {
157+
// Apply hover effect to .expand elements within nested child elements
158+
$str5 = '.res-commentBoxes.res-continuity .comment div.child ';
159+
160+
for $i in 11 .. 20 {
161+
{$str5} .expand:hover {
162+
background-color: color + $i !important;
163+
}
164+
165+
// Increase the nesting level for each iteration
166+
$str5 += '> .sitetable > .comment > .child ';
167+
}
168+
}
169+
170+
if ( oldHoverRainbow == 1 && ( oldMinimizeRainbow == 0 ) ) {
171+
// Apply hover effect to .expand elements within nested child elements
172+
$str5 = '.res-commentBoxes.res-continuity .comment div.child ';
173+
174+
for $i in 1 .. 20 {
175+
{$str5} .expand:hover {
176+
background-color: color + $i !important;
177+
}
178+
179+
// Increase the nesting level for each iteration
180+
$str5 += '> .sitetable > .comment > .child ';
181+
}
182+
}
183+
184+
if ( oldMinimizeArea == 1 ) {
185+
// Apply a background color to .expand elements in the tagline
186+
.commentarea .entry > .tagline > .expand {
187+
background-color: oldMinimizeColor !important;
188+
}
189+
}
190+
191+
if ( oldHoverArea == 1 ) {
192+
// Apply a background color to .expand elements in the tagline
193+
.commentarea .entry > .tagline > .expand:hover {
194+
background-color: oldHoverColor !important;
195+
}
196+
}
198197
}

0 commit comments

Comments
 (0)