@@ -101,15 +101,15 @@ different formats. At the same time, it does not make sense to display all forma
101
101
be interested only in the variant he intends to use during integration. However, this posed a challenge due to various
102
102
obstacles, such as page indexing and print support.
103
103
104
- It all started with the ` <LanguageSpecific /> ` component. I believe that from its name and markup, you can already
104
+ It all started with the ` <LS /> ` component. I believe that from its name and markup, you can already
105
105
understand the purpose of this component.
106
106
107
107
##### Markup
108
108
109
109
``` md
110
- <LanguageSpecific to="evitaql,java ">
110
+ <LS to="e,j ">
111
111
// content specific to Java and EvitaQL
112
- </LanguageSpecific >
112
+ </LS >
113
113
```
114
114
115
115
Now, let's move on to the next step, which involves creating a user-friendly switch to allow users to easily switch
@@ -171,7 +171,7 @@ parameter `?codelang={preferredLanguage}`. This will preserve the correct preset
171
171
link to the clipboard and sends it to someone else. This person will then get the same page variant as the person who
172
172
sent the link.
173
173
174
- The component is now aware of preferred language. In case of ` <LanguageSpecific /> ` component, show the actual content
174
+ The component is now aware of preferred language. In case of ` <LS /> ` component, show the actual content
175
175
depending on your preferred programming language.
176
176
177
177
<Note type =" info " >
@@ -183,48 +183,48 @@ On smaller screens, you'll display the preferred language switch after clicking
183
183
##### Markup
184
184
185
185
``` md
186
- <LanguageSpecific to="evitaql,java ">
186
+ <LS to="e,j ">
187
187
188
188
---
189
189
> This block of text is specific to `evitaql` programming language.
190
190
>
191
191
> Go ahead and try to switch.
192
192
193
193
---
194
- </LanguageSpecific >
194
+ </LS >
195
195
```
196
196
197
197
##### Result
198
198
199
- <LanguageSpecific to =" evitaql,java " >
199
+ <LS to =" e,j " >
200
200
201
201
---
202
202
> This block of text is specific to ` evitaql ` and ` java ` programming language.
203
203
>
204
204
> Go ahead and try to switch.
205
205
206
206
---
207
- </LanguageSpecific >
207
+ </LS >
208
208
209
- <LanguageSpecific to =" rest " >
209
+ <LS to =" r " >
210
210
211
211
---
212
212
> This block of text is specific to ` Rest ` programming language.
213
213
>
214
214
> Go ahead and try to switch.
215
215
216
216
---
217
- </LanguageSpecific >
217
+ </LS >
218
218
219
- <LanguageSpecific to =" graphql " >
219
+ <LS to =" g " >
220
220
221
221
---
222
222
> This block of text is specific to ` GraphQL ` programming language.
223
223
>
224
224
> Go ahead and try to switch.
225
225
226
226
---
227
- </LanguageSpecific >
227
+ </LS >
228
228
229
229
230
230
Other Custom component aware of the user preferred language is [ above shown ` <SourceCodeTabs/> ` ] ( #result-1 ) .
@@ -236,11 +236,11 @@ prioritizing visual accessibility, even if it leads to layout shifting. Moreover
236
236
document, our component render function incorporates supplementary elements to enhance the visibility of this
237
237
functionality.
238
238
239
- So when you try to print this page, you'll see that the ` <LanguageSpecific /> ` examples shown above are available and
239
+ So when you try to print this page, you'll see that the ` <LS /> ` examples shown above are available and
240
240
ready to be printed. The print preview is similar to what you see on the Github itself, where all the content is visible
241
241
regardless.
242
242
243
- ![ ` <LanguageSpecific /> ` component print example] ( assets/images/07-print-example.png " `Custom <LanguageSpecific />` component print example. ")
243
+ ![ ` <LS /> ` component print example] ( assets/images/07-print-example.png " `Custom <LS />` component print example. ")
244
244
245
245
## What's next
246
246
0 commit comments