How to render static text in material ui to match textbox format? - material-ui

I have a form that has a combination of fields of various types.
But it also has some static text intermixed.
I would like to render all the fields (static text and interactive) using the same visual layout.
I, essentially, want <TextField variant='standard' disabled={true}/> but not greyed out, and not disabled.
I could just use a pair of <Typography> tags, but I'd rather not duplicate the implementation that's already available in material UI.

Related

How do I underline some text in a label using ZK framework?

I am using ZK framework. I have a static line of text in a label:
<label
value="If you have already submitted a leave application or need to modify
an existing leave, do not submit an online application. " />
I need to underline only some parts of this sentence. I've tried putting <u> </u> around the text I wish to underline, but this is not allowed in ZK.
I've also tried creating separate labels, with style="text-decoration: underline;" which does underline the specified text. However this way of underlining makes each label display on it's own line.
Is there some way that I can underline only certain parts of my label?
There is no way you could append style to certain parts of a label.
Like #Link already commented you could use multiple labels and set the sclass different of each label.
If you have real HTML in your text, you could use the following :
HtmlNativeComponent n = new HtmlNativeComponent("html", "<h2>title</h2>","<p>your text</p>");
Explication of constructor :
"html" => the element where all your text is between. (wrapper element)
"<h2>title</h2>" => the first part. If you append more children to the native component, its after this they will come.
"<p>your text</p>" => the second part. If you append more children to the native component, its before this they will come.

TinyMCE: tags inside a-tag

I use TinyMCE 4.1.10 and have a problem with tags inside <a>-tags:
I need to insert code in the following markup inside the code viewer:
<a><h3>something</h3></a>
Generally I want every tag to be possible inside the <a>-tag (besides another <a>-tag).
But TinyMCE does a ridiculous cleanup:
<p><a></a></p>
<h3><a>something</a></h3>
<p></p>
I've already made following modifications in the setup:
extended_valid_elements : "a[*]",//allow empty <a>-tag
valid_children : "+a[div|h1|h2|h3|h4|h5|h6|p|#text]",//allow some children in the <a>-tag
verify_html: false,
It doesn't make any sense at all what TinyMCE is doing here.
The TinyMCE-website is telling me it uses html5-specification by default:
The schema option enables you to switch between the HTML4 and HTML5
schema. This controls the valid elements and attributes that can be
placed in the HTML. This value can either be the default html5, html4
or html5-strict.
And in the HTML5-Specifiations you can read:
The a element may be wrapped around entire paragraphs, lists, tables,
and so forth, even entire sections, so long as there is no interactive
content within (e.g. buttons or other links).
And now I don't get anything despite HTML5 valid markup AND extra valid-children setting in TinyMCE.

User selectable widgets in Umbraco 7

We are looking at Umbraco as a possible alternative to our current CMS which was developed in house and which although powerful, is dated now and becoming more difficult to maintain.
One really good feature which we would be loth to lose is the widget feature. Using this, we can build a widget by defining a number of inputs (eg text fields, media picker, links etc) together with the html required to output the results (using placeholders to substitute in the content entered by the web content editors).
On the page, content editors can select which (if any) widget(s) to use, enter content into the inputs defined in the widget, and the page outputs this accordingly.
In other words, without resorting to programming, we can create widgets just by defining inputs and the output html in minutes.
Users can select widgets and their input is controlled and formatted.
Simple and effective.
Is anything like this available in Umbraco without having to develop new C# code for each widget? I have looked into using macros in a rich text field, but I can't see how they can be made editable using complex data entry as described above.
Beside the Macro in richtext,
In Umbraco you can use a picker/list view data type to select some "component/widget items" and for rendering it requires some code if more than one document type is allowed, if document type is x1 do code a1.
Use (Partial view) Macro Files for reuse.
This is the closest to the "widget" function you want.
A other relatively new datatype in Umbraco is the Grid layouts, allow editors to create a Complex data, column structure with multiple data types. I suspect not comparable/useful for your "widget" function.

How to make drop-down values to be easily authorable content in CQ

I was trying to understand how can we make drop-down values in dialog box easily authorable?
Select lists in dialogs can load their options dynamically from anywhere, so long as they are provided as an array of values in JSON format (from the docs):
[
{
value: "pink",
text: "Pink",
qtip: "Real Pink"
}
]
So one solution would be to:
Create a new template that would allow an editor to add/remove values from a list — make this editable for content authors as per any other content (e.g. using the page properties, or components that you can drag onto that template).
Create a Servlet that will parse those values & output them in the expected JSON.
Register that servlet, e.g. via a path (/bin/selectvalues).
Using the cqinclude xtype to load in your values:
i.e.
<select
type="select"
xtype="selection"
options="/bin/selectvalues"/>
If you are looking for a drop-in solution for this, take a look at http://adobe-consulting-services.github.io/acs-aem-commons/features/generic-lists.html. This supports easily authorable lists of name/value pairs which can be used (without writing additional code) in:
Classic UI Dialogs
Touch UI Dialogs
Touch UI Asset Metadata Editor

Jasper Reports - How to get JRXML components with mixed styles or dynamic widths on text boxes?

When buliding jasper reports JRXML files I want to be able to have a row of dynamically width'd text boxes of mixing styles. It does not seem like Jasper supports that so I'm stuck with this:
Notice how I used two static text boxes for this display with fixed widths. This is because I cannot mix the bold + normal font styles inside a component.
I would rather something like this:
Where the NOW() and $P{name} will automatically stretch out and look real nice.
Note: I cannot use the HTML component due to this issue http://community.jaspersoft.com/questions/540569/html-component-font and https://community.jaspersoft.com/jasperreports-library/issues/4411-0
Is there a way to code JRXML files with dynamically width'd Textboxes?
Actually, you can mix styles using markup in a single text box. Jasper supports (simple) HTML, RTF and a custom jasper-styling.
Check the "markup" property.
But I am not aware that you could insert artificial borders around the values when using a single textbox.