[PR #2397] [CLOSED] Radzen Examples Split View #3240

New Issue

claunia · 2026-01-29T18:22:35Z

claunia commented

2026-01-29 18:22:35 +00:00

📋 Pull Request Information

Original PR: https://github.com/radzenhq/radzen-blazor/pull/2397
Author: @paulo-rico
Created: 12/17/2025
Status: ❌ Closed

Base: master ← Head: master

📝 Commits (1)

eee36c6 Radzen Examples Split View

📊 Changes

1 file changed (+14 additions, -1 deletions)

View changed files

📝 RadzenBlazorDemos/Shared/RadzenExample.razor (+14 -1)

📄 Description

Hi guys

Something that's niggled me a little when using the example site. I do like to scroll through the code of an example while being able to refer to the rendered output. Not too easy when switching tabs. Also, you may scroll to some code, and then want to view how that affects the output. When switching back, you lose your position in the code window.

This PR adds a split view to the RadzenExample component. Not only can you review the code while viewing the output, but if you make a change and run your code, the output is updated and your code position remains.

I find it a much more pleasant experience.

What do you think?

BTW, if you do like the idea, there are some CSS issues that I did not know how to deal with. You will notice that the top of the CodeViewer component is trimmed. Not sure why placing it in a RadzenSplitterPane should do that.

Also, I assume that the CodeViewer or the Monaco component must have a fixed height, and cannot be dynamic?

Regards

Paul

_{🔄 This issue represents a GitHub Pull Request. It cannot be merged through Gitea due to API limitations.}

## 📋 Pull Request Information **Original PR:** https://github.com/radzenhq/radzen-blazor/pull/2397 **Author:** [@paulo-rico](https://github.com/paulo-rico) **Created:** 12/17/2025 **Status:** ❌ Closed **Base:** `master` ← **Head:** `master` --- ### 📝 Commits (1) - [`eee36c6`](https://github.com/radzenhq/radzen-blazor/commit/eee36c6b301978e2347b4942a28ca6866632c594) Radzen Examples Split View ### 📊 Changes **1 file changed** (+14 additions, -1 deletions) <details> <summary>View changed files</summary> 📝 `RadzenBlazorDemos/Shared/RadzenExample.razor` (+14 -1) </details> ### 📄 Description Hi guys Something that's niggled me a little when using the example site. I do like to scroll through the code of an example while being able to refer to the rendered output. Not too easy when switching tabs. Also, you may scroll to some code, and then want to view how that affects the output. When switching back, you lose your position in the code window. This PR adds a split view to the `RadzenExample` component. Not only can you review the code while viewing the output, but if you make a change and run your code, the output is updated and your code position remains. I find it a much more pleasant experience. What do you think? BTW, if you do like the idea, there are some CSS issues that I did not know how to deal with. You will notice that the top of the `CodeViewer` component is trimmed. Not sure why placing it in a `RadzenSplitterPane` should do that. Also, I assume that the `CodeViewer` or the `Monaco` component must have a fixed height, and cannot be dynamic? Regards Paul --- <sub>🔄 This issue represents a GitHub Pull Request. It cannot be merged through Gitea due to API limitations.</sub>

claunia added the pull-request label 2026-01-29 18:22:35 +00:00

Sign in to join this conversation.

Branches Tags

1 Participants

Notifications

Due Date

No due date set.

Dependencies

No dependencies set.

Reference: starred/radzen-blazor#3240