withClass annotation is not working

[lavr001]

Hello,

I'm following this code hike docs to implement a withClass annotation to make the first line bold here is my code:

# withClass[1:45] bold

? Enter a name for the project reactamplified
The following configuration will be applied:

here is my css:

.bold {
  font-weight: bold;
}

And instead of applying the styling from the bold class, I see this # withClass[1:45] bold in the code container:

Any suggestions?

[pomber]

Hi,

The comment syntax depends on the language. Currently the comment detection isn't super smart, if # withClass doesn't work, it probably means you need to use // withClass.

[lavr001]

It kind of worked, thank you. Can you apply withClass annotations with lines, instead of columns? I tried to use it twice in one step, and it only worked the first time.

Does code hike have a language for terminal prompts? (e.g. keep all CLI outputs in white color regardless of the theme used)

[pomber]

It should work twice in the same line. Here for example.

Does code hike have a language for terminal prompts? (e.g. keep all CLI outputs in white color regardless of the theme used)

Nope, but I want to add something eventually. If you have ideas you can share them in this issue: https://github.com/code-hike/codehike/issues/206.

[lavr001]

In regards to the withClass annotation, what I meant was is it possible to use it to apply styles to different lines, instead of columns (e.g. similar to mark=4,15).

For example if I have 20 lines of code in one step, and would like to apply a specific style to lines 2, 6, 12, is there a way to do it in one line (withClass=2,6,12)?

[pomber]

Yes. The syntax is like this:

```python hello.py
print("This is Code Hike")
# withClass(1:2,4) red
print("This is Code Hike")
print("This is Code Hike")
print("This is Code Hike")
print("This is Code Hike")
print("This is Code Hike")

[lavr001]

I tried this: js focus=1:2 mark=1 // withClass(1) bold

and got the error: 'Error: Code Hike can't handle two annotations for the same line', see attached

[pomber]

Can you try it in the playground and share the link?

[lavr001]

Here is the playground link.

I made it work with applying styling to columns using square brackets, but just wondering if there is a cleaner solution with applying custom styling to line(s)

[pomber]

Oh, that's because you are applying both annotations to the same line (mark and withClass).

‘mark‘ also accepts a class so you can do this: https://play.codehike.org/#N4IgtgJgHiBcIB0B2BiABACQKYBscHtlkBRCASwBc0wsA6IpAA2YCsBnNAQwAdvb20yAPRDqnAE4BrNACN8OCMgD8aYkgpZxXNEk400AM3xaKACyxpu4-CywBjKuKycHe7jjIGyWRUgAq5obyBADuZEgA5mh2+EheEQCu4pwUZLFoYXiyFjzu3hCwDCoACta2DmjhRuJgKWlIyAA+aAByeliwaGhOLhRuHl4+TapIAG5k1kg06p0QWKPDACJYBpwJOFQ+lMadAGpkbAmcOGgAyhQJ5PhoAML4c8MAgrxoFACe3B1oLJyjnGx2cRkbgUYYAKV+-0BwKoBmSNBCxkknR6DmGp3wSTsFkWE3sFGMbzQxRSpk6bHEdiWBwoQJkCVS6VxTgchOJpM69LICmGACEEtyILd8GBakgCjpuGBugkkABaAFAkGyAU8pDNc4SKh3UWccWdJBSmXyxUwtBsPriUENJjMBggAA0IDsbDYcBAtCs828ITlMXUnHCmjQwEESC6tXEEXCnQAHNwoABuMMAXwYtDkChDyC6RnUcpCWDIEVMFE58ggieQKcdzti8TgoA8SCwLQSYBkmjdsFWODYWCdbFM+BCd24b35FAJSDgvf7TrMWBo7tqGiBxzlEAkkk0IBTKaAA

[lavr001]

Thank you! That's exactly what I was looking for.