diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/11-translations/Grid_Demo_01_Translations.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/11-translations/Grid_Demo_01_Translations.razor index 1af66a71d..e55abdadb 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/11-translations/Grid_Demo_01_Translations.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/11-translations/Grid_Demo_01_Translations.razor @@ -49,6 +49,7 @@ filtersTranslation.Add(new(">=", "Groter dan of gelijk aan", FilterOperator.GreaterThanOrEquals)); // string filtersTranslation.Add(new("*a*", "Bevat", FilterOperator.Contains)); + filtersTranslation.Add(new("!*a*", "Bevat niet", FilterOperator.DoesNotContain)); filtersTranslation.Add(new("a**", "Begint met", FilterOperator.StartsWith)); filtersTranslation.Add(new("**a", "Eindigt met", FilterOperator.EndsWith)); filtersTranslation.Add(new("=", "gelijk aan", FilterOperator.Equals)); diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Index.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Index.razor index e63d9fc44..6f3c55ce5 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Pages/Index.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Index.razor @@ -132,7 +132,7 @@
-

Markdown New

+

Markdown Preview
@@ -238,7 +238,7 @@
-
+@*

AI Components

@@ -250,7 +250,7 @@
- + *@
diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/MarkdownDocumentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/MarkdownDocumentation.razor index ca711ea73..8992bff13 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/MarkdownDocumentation.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/MarkdownDocumentation.razor @@ -4,39 +4,106 @@ -

Blazor Markdown

+

Blazor Markdown Preview

Use Blazor Bootstrap Markdown component to add formatting, tables, images, and more to your project pages.
-@* +
- *@ + -
+
+ Use headers to structure your content. Start a line with # for a heading. Add more # characters for subheadings, up to six levels. +
-
+
+ Break your text into paragraphs or line breaks for easier reading. +
-
+
+ Quote text with > before it. Use more > characters to nest quotes. For blocks of text, use > at the start of each line. +
-
+
+ Add a horizontal rule with a line of ---. +
-
+
+ Emphasize text with bold, italics, or strikethrough: +
    +
  • Italics: *text* or _text_
    • +
  • Bold: **text**
    • +
  • Strikethrough: ~~text~~
    • +
  • Combine for more emphasis.
    • +
+
+ +
+ Tables help organize structured data. +
    +
  • Use | to separate cells.
    • +
  • Escape | with \| if used within a cell.
    • +
  • Use <br /> for new lines within a cell.
    • +
  • End each row with a carriage return (CR) or line feed (LF).
    • +
+
+ +
+ + + +
+ Use lists to organize related items: +
    +
  • Ordered lists: start with a number followed by a period.
    • +
  • Unordered lists: start with a -.
    • +
  • Begin each list item on a new line.
    • +
+
+ +
+ + + +
+ + + +
+ +
+ +
+ + + +
+ + + +
+ + + +
+ + @code{ private string pageUrl = "/markdown"; private string title = "Blazor Markdown Component"; diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_01_Examples.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_01_Examples.razor deleted file mode 100644 index 1a0d708d7..000000000 --- a/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_01_Examples.razor +++ /dev/null @@ -1,15 +0,0 @@ - - Test - # Heading level 1 - ## Heading level 2 - ### Heading level 3 - #### Heading level 4 - ##### Heading level 5 - ###### Heading level 6 - - - __bold text__ - **bold text** - _italic text_ - *italic text* - \ No newline at end of file diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_01_Preview.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_01_Preview.razor new file mode 100644 index 000000000..28d12daee --- /dev/null +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_01_Preview.razor @@ -0,0 +1,21 @@ +
+
Markdown
+
Preview
+
+
+
+ +
+
+ @markdown +
+
+ +@code { + private string markdown = "# Heading 1\n## Heading 2\n\n![BlazorBootstrap](https://demos.blazorbootstrap.com/images/logo/logo-color.svg =50)"; +} \ No newline at end of file diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_02_Headers.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_02_Headers.razor index 9792ee11e..def554bb8 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_02_Headers.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_02_Headers.razor @@ -1,7 +1,8 @@  - # This is a H1 header - ## This is a H2 header - ### This is a H3 header - #### This is a H4 header - ##### This is a H5 header +# This is a H1 header +## This is a H2 header +### This is a H3 header +#### This is a H4 header +##### This is a H5 header +###### This is a H6 header \ No newline at end of file diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_03_Paragraphs_and_Line_Breaks.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_03_Paragraphs_and_Line_Breaks.razor index 24b026e26..d1966b31f 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_03_Paragraphs_and_Line_Breaks.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_03_Paragraphs_and_Line_Breaks.razor @@ -1,8 +1,8 @@  - Add lines between your text with the **Enter** key. - Your text gets better spaced and makes it easier to read. +Add lines between your text with the **Enter** key. +Your text gets better spaced and makes it easier to read. - Add lines between your text with the **Enter** key. - Your text gets better spaced and makes it easier to read. +Add lines between your text with the **Enter** key. +Your text gets better spaced and makes it easier to read. \ No newline at end of file diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_04_Blockquotes.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_04_Blockquotes.razor index 8e065dd41..d8bfe956c 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_04_Blockquotes.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_04_Blockquotes.razor @@ -1,6 +1,10 @@  - > Single line quote - >> Nested quote - >> multiple line - >> quote +> A well-known quote, contained in a blockquote element. + + + +> Single line quote +>> Nested quote +>> multiple line +>> quote \ No newline at end of file diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_05_Horizontal_Rules.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_05_Horizontal_Rules.razor index e7d9c79e5..c7fa6a522 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_05_Horizontal_Rules.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_05_Horizontal_Rules.razor @@ -1,6 +1,5 @@  - above - - ---- - below +above +--- +below \ No newline at end of file diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_06_Emphasis_bold_italics_strikethrough.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_06_Emphasis_bold_italics_strikethrough.razor index 9ab8f7c56..d505bfb94 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_06_Emphasis_bold_italics_strikethrough.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_06_Emphasis_bold_italics_strikethrough.razor @@ -1,5 +1,5 @@  - Use _emphasis_ in comments to express **strong** opinions and point out ~~corrections~~ - **_Bold, italicized text_** - **~~Bold, strike-through text~~** +Use _emphasis_ in comments to express **strong** opinions and point out ~~corrections~~ +**_Bold, italicized text_** +**~~Bold, strike-through text~~** \ No newline at end of file diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_07_Code_Highlighting.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_07_Code_Highlighting.razor index 137c1352d..aede08f0d 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_07_Code_Highlighting.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_07_Code_Highlighting.razor @@ -1,11 +1,53 @@  - ```js - const count = records.length; - ``` +```js +const count = records.length; +``` - ```csharp - Console.WriteLine("Hello, World!"); - ``` +```csharp +Console.WriteLine("Hello, World!"); +``` + + + +```csharp +var countdown = new TimerRemaining() +{ + buffer = + { + [^1] = 0, + [^2] = 1, + [^3] = 2, + [^4] = 3, + [^5] = 4, + [^6] = 5, + [^7] = 6, + [^8] = 7, + [^9] = 8, + [^10] = 9 + } +}; +``` + + + +```csharp +public partial class C +{ + // Declaring declaration + public partial string Name { get; set; } +} + +public partial class C +{ + // implementation declaration: + private string _name; + public partial string Name + { + get => _name; + set => _name = value; + } +} +``` \ No newline at end of file diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_08_Tables_A_Example.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_08_Tables_A_Example.razor new file mode 100644 index 000000000..a7b8594f4 --- /dev/null +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_08_Tables_A_Example.razor @@ -0,0 +1,6 @@ + +| Heading 1 | Heading 2 | Heading 3 | +|--|--|--| +| Cell A1 | Cell A2 | Cell A3 | +| Cell B1 | Cell B2 | Cell B3
second line of text | + \ No newline at end of file diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_08_Tables_B_Custom_CssClass.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_08_Tables_B_Custom_CssClass.razor new file mode 100644 index 000000000..042de172d --- /dev/null +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_08_Tables_B_Custom_CssClass.razor @@ -0,0 +1,9 @@ + +| Heading 1 | Heading 2 | Heading 3 | +|--|--|--| +| Cell A1 | Cell A2 | Cell A3 | +| Cell B1 | Cell B2 | Cell B3 | +| Cell C1 | Cell C2 | Cell C3 | +| Cell D1 | Cell D2 | Cell D3 | +| Cell E1 | Cell E2 | Cell E3 | + \ No newline at end of file diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_09_Lists_A_Ordered.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_09_Lists_A_Ordered.razor new file mode 100644 index 000000000..0bbfa42e6 --- /dev/null +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_09_Lists_A_Ordered.razor @@ -0,0 +1,5 @@ + +1. First item +1. Second item +1. Third item + \ No newline at end of file diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_09_Lists_B_Unordered.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_09_Lists_B_Unordered.razor new file mode 100644 index 000000000..bb863021f --- /dev/null +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_09_Lists_B_Unordered.razor @@ -0,0 +1,5 @@ + +- Item 1 +- Item 2 +- Item 3 + \ No newline at end of file diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_09_Lists_C_Nested.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_09_Lists_C_Nested.razor new file mode 100644 index 000000000..7d926118c --- /dev/null +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_09_Lists_C_Nested.razor @@ -0,0 +1,14 @@ + +1. First item + - Item 1 + - Item 2 + - Item 3 +1. Second item + - Nested item 1 + - Further nested item 1 + - Further nested item 2 + - Further nested item 3 + - Nested item 2 + - Nested item 3 +1. Third item + \ No newline at end of file diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_09_Lists_D_Nested.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_09_Lists_D_Nested.razor new file mode 100644 index 000000000..db2e27c2a --- /dev/null +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_09_Lists_D_Nested.razor @@ -0,0 +1,14 @@ + +1. First item + 1. Item 1 + 1. Item 2 + 1. Item 3 +1. Second item + 1. Nested item 1 + 1. Further nested item 1 + 1. Further nested item 2 + 1. Further nested item 3 + 1. Nested item 2 + 1. Nested item 3 +1. Third item + \ No newline at end of file diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_09_Lists_E_Nested.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_09_Lists_E_Nested.razor new file mode 100644 index 000000000..2a2511f0e --- /dev/null +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_09_Lists_E_Nested.razor @@ -0,0 +1,14 @@ + +- First item + - Item 1 + - Item 2 + - Item 3 +- Second item + - Nested item 1 + - Further nested item 1 + - Further nested item 2 + - Further nested item 3 + - Nested item 2 + - Nested item 3 +- Third item + \ No newline at end of file diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_10_Links.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_10_Links.razor new file mode 100644 index 000000000..0b820c373 --- /dev/null +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_10_Links.razor @@ -0,0 +1,4 @@ + +[BlazorBootstrap - Docs](https://docs.blazorbootstrap.com/) +[BlazorBootstrap - Demos](https://demos.blazorbootstrap.com/) + \ No newline at end of file diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_11_Images.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_11_Images.razor new file mode 100644 index 000000000..a42123e61 --- /dev/null +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_11_Images.razor @@ -0,0 +1,11 @@ + +![BlazorBootstrap](https://demos.blazorbootstrap.com/images/logo/logo-color.svg) + + + +![BlazorBootstrap](https://demos.blazorbootstrap.com/images/logo/logo-color.svg =200x200) + + + +![BlazorBootstrap](https://demos.blazorbootstrap.com/images/logo/logo-color.svg =50) + \ No newline at end of file diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_12_Checklist_or_Task_List.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_12_Checklist_or_Task_List.razor new file mode 100644 index 000000000..2776263a9 --- /dev/null +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_12_Checklist_or_Task_List.razor @@ -0,0 +1,8 @@ + +- [ ] A +- [ ] B +- [ ] C +- [x] A +- [x] B +- [x] C + \ No newline at end of file diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_13_Emoji.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_13_Emoji.razor new file mode 100644 index 000000000..7941007cc --- /dev/null +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_13_Emoji.razor @@ -0,0 +1,3 @@ + +Emoji + \ No newline at end of file diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_14_Attachments.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_14_Attachments.razor new file mode 100644 index 000000000..0a9d3c4ec --- /dev/null +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_14_Attachments.razor @@ -0,0 +1,3 @@ + +Attachments + \ No newline at end of file diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_15_Mathematical_Notations_and_Characters.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_15_Mathematical_Notations_and_Characters.razor new file mode 100644 index 000000000..d24bb252d --- /dev/null +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_15_Mathematical_Notations_and_Characters.razor @@ -0,0 +1,3 @@ + +Mathematical notation and characters + \ No newline at end of file diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_99_Examples.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_99_Examples.razor new file mode 100644 index 000000000..cf3ed4ad1 --- /dev/null +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_99_Examples.razor @@ -0,0 +1,69 @@ + +# Markdown syntax guide + +## Headers + +# This is a Heading h1 +## This is a Heading h2 +###### This is a Heading h6 + +## Emphasis + +*This text will be italic* +_This will also be italic_ + +**This text will be bold** +__This will also be bold__ + +_You **can** combine them_ + +## Lists + +### Unordered + +* Item 1 +* Item 2 +* Item 2a +* Item 2b + +### Ordered + +1. Item 1 +2. Item 2 +3. Item 3 + 1. Item 3a + 2. Item 3b + +## Images + +![This is an alt text.](https://demos.blazorbootstrap.com/images/logo/logo-color.svg =50) + +## Links + +[BlazorBootstrap Demos](https://demos.blazorbootstrap.com/). + +## Blockquotes + +> Markdown is a lightweight markup language with plain-text-formatting syntax, created in 2004 by John Gruber with Aaron Swartz. +>> Markdown is often used to format readme files, for writing messages in online discussion forums, and to create rich text using a plain text editor. + +## Tables + +| Left columns | Right columns | +|--|--| +| left foo | right foo | +| left bar | right bar | +| left baz | right baz | + +## Blocks of code + +``` +let message = 'Hello world'; +alert(message); +``` + +## Inline code + +This web site is using `markedjs/marked`. + + \ No newline at end of file diff --git a/BlazorBootstrap.Demo.RCL/wwwroot/css/blazorbootstrap.demo.rcl.css b/BlazorBootstrap.Demo.RCL/wwwroot/css/blazorbootstrap.demo.rcl.css index 05be8dea8..2a6ff1fc8 100644 --- a/BlazorBootstrap.Demo.RCL/wwwroot/css/blazorbootstrap.demo.rcl.css +++ b/BlazorBootstrap.Demo.RCL/wwwroot/css/blazorbootstrap.demo.rcl.css @@ -19,6 +19,7 @@ --bd-violet-rgb: 112.520718,44.062154,249.437846; --docsearch-primary-color: var(--bd-violet); --docsearch-logo-color: var(--bd-violet); + --bb-example-pre-background: #f5f2f0; } h1:focus-visible { @@ -346,6 +347,10 @@ h1:focus-visible { word-wrap: normal } +pre[class*=language-] { + background: var(--bb-example-pre-background) !important; +} + .tab-pane.fade.active.show .highlight { border: 1px solid #dee2e6; border-top-width: 0; @@ -453,4 +458,5 @@ h1:focus-visible { --bs-tertiary-color-rgb: 222, 226, 230; --bs-tertiary-bg: #2b3035; --bs-tertiary-bg-rgb: 43, 48, 53; -} \ No newline at end of file + --bb-example-pre-background: #1e1e1e; +} diff --git a/blazorbootstrap/Components/Markdown/Markdown.razor b/blazorbootstrap/Components/Markdown/Markdown.razor index 0a5a86345..341c0f65c 100644 --- a/blazorbootstrap/Components/Markdown/Markdown.razor +++ b/blazorbootstrap/Components/Markdown/Markdown.razor @@ -1,6 +1,6 @@ @namespace BlazorBootstrap @inherits BlazorBootstrapComponentBase -