📖 Improve collapsible code sections and formatting of tutorials

[camilamacedo86]

The following changes impact mainly the tutorials.
To review see:

• https://deploy-preview-5175--kubebuilder.netlify.app/cronjob-tutorial/cronjob-tutorial
• https://deploy-preview-5175--kubebuilder.netlify.app/multiversion-tutorial/tutorial

Documentation Improvements Summary

Changes

New Features:

• Added "(click to expand/collapse)" hints
• Soft collapse styling (no icons, italic text)

Layout:

• Content width: 95% (wider)
• Code padding: 0.5em (reduced)
• Tab-size: 2 (compact)

Content Cleanup:

• Hidden Apache License and Import blocks
• Hidden closing braces in tests
• Removed duplicate collapse markers
• Fixed extra } appearing outside code blocks

Label Updates:

• "Clock" → "Clock Code Implementation"
• "Go imports" → "Imports"
• "Validate object name" → "validateCronJobName() Code Implementation"
• "old stuff" → "Remaining code from "
• "The rest of Spec" → "CronJobSpec Full Code"

Closes: #4862

[k8s-ci-robot]

[APPROVALNOTIFIER] This PR is APPROVED

This pull-request has been approved by: camilamacedo86

The full list of commands accepted by this bot can be found here.

The pull request process is described here

Needs approval from an approver in each of these files:

• OWNERS [camilamacedo86]

Approvers can indicate their approval by writing /approve in a comment
Approvers can cancel approval by writing /approve cancel in a comment

[vitorfloriano]

The copy button seems to not be working correctly when we insert the code using the directive {{#literatego}}.

As a suggestion, what would happen if we wrapped the directives in a codeblock, like this:

```go
{{#literatego ./getting-started/testdata/project/api/v1alpha1/memcached_types.go}}
```

[vitorfloriano]

@camilamacedo86 I suggested ealier that we tried wrapping the {{#literatego}} directives in a codeblock, but that could create another problem: In some parts of the docs, we insert the whole file into a markdown file, and add the rest of the page in the tutorial as comments in that file. If we wrap everything in a codeblock, the docs inserted as comments in those files may not work properly.

And that raises the question: why do we start some parts in a markdown file, then continue the page by inserting comments in the file that was inserted?

As an example, let's consider this page: https://book.kubebuilder.io/cronjob-tutorial/empty-main

We start it here: https://github.com/kubernetes-sigs/kubebuilder/blob/master/docs/book/src/cronjob-tutorial/empty-main.md

Then we insert this file: https://github.com/kubernetes-sigs/kubebuilder/blob/master/docs/book/src/cronjob-tutorial/testdata/emptymain.go

And then we add comments to that file to continue the instructions in the page.

So, couldn't we keep all the instruction in markdown files, and add only the sections of code that we need? That way, we could wrap each section in a codeblock, to be rendered properly, with the copy button.

See: https://rust-lang.github.io/mdBook/format/mdbook.html?highlight=hide#including-portions-of-a-file

[camilamacedo86]

Hi @vitorfloriano

I reverted the copy button changes
So, we might be good to go with the others
WDYT?

Btw, thank you a lot for all the help !!!
And amazing review

[vitorfloriano]

@camilamacedo86 I checked the preview and it seems that some copy buttons are still missing. See: https://deploy-preview-5175--kubebuilder.netlify.app/cronjob-tutorial/empty-main#every-journey-needs-a-start-every-program-needs-a-main

In code blocks that they are not missing, they are misplaced. See: https://deploy-preview-5175--kubebuilder.netlify.app/cronjob-tutorial/cronjob-tutorial#scaffolding-out-our-project

The custom CSS seems to be affecting how the copy buttons are displayed.

For testing, I checked out your PR and served the book using mdBook v0.4.40, then I deleted the custom CSS to see what happens and all the code blocks displayed the copy button properly (other parts broke, though 😅):

[camilamacedo86]

/hold

I will be looking on that
Good catcher.