I am dealing with JSF calendar and I want to do my work in Turkish. But when I add TimePicker to my calendar the "now" and "done" buttons are shown and they are in English (like DateTime example on http://www.primefaces.org/showcase-labs/ui/calendarTime.jsf). I want to change the language of the buttons or remove them. Any idea how to do so?
Thanks in advance.
You can customize the labels by providing a locale and a localization javascript.
You can grab one of the localization javascripts from the primefaces wiki.
After that try the following:
<h:outputScript name=”path_to_your_translations.js” />
<p:calendar value="#{calendarBean.date1}" pattern="MM/dd/yyyy HH:mm" locale="tr" />
Related
I've just started learning react, so this question can be east, but thank you for help. Now I'm using Material UI in my project, and I need outlined phone number input with flag and label, which looks like enter image description here
But I can't find how to style any phone number picker to make it similar to this. Thnk you vey much for your help/
You probably want to grab InputBase from material-ui or just a regular html input tag and use className to style it. You could set the type="tel" or keep it as a string. You could add validation with yup to ensure that the right format is submitted.
I would like to have an input select with a choice of image as an option (would define a custom icon). I can put an image or an icon with Font awesome.
I tried putting
<select>
<option><i class='fas fa-shopping-bag'/></option>
<select>
or replace with an image but nothing work.
Font Awesome font is well imported, I tried with unicode it does not work either
Do you know how to do it ?
Thanks
if you are using reactjs you need to use className instead of class https://reactjs.org/docs/faq-styling.html
I'm working on some Salesforce lightning components and I need a nice DateTime control. The component reference lists the ui:inputDateTime control and this control supports the functionality, but it sure doesn't look like the control in Salesforce!
Here's what you get in SF experience:
And here's what you get out of the box with the ui:inputDateTime control:
The calendar itself is way too large and just isn't styled, and the Time control isn't even displaying the right icon. Here's my markup:
<div class="slds-form-element">
<div class="slds-form-element__control">
<ui:inputDateTime aura:id="encStart"
label="Start Time"
value="{!v.newEvent.startTime}"
displayDatePicker="true" />
</div>
</div>
Am I just missing or mis-applying a SLDS tag here? Any advice would be appreciated. Thanks.
while trying to change the background color of disabled dates to red, using disabledCellCls seems to have no effect on disabled dates. How to make this work..
Fiddle: https://fiddle.sencha.com/#fiddle/4io
Thanks
Since this a bug, one workaround is to use 'cls' config instead of 'disabledCellCls' and additional selectors in css .x-datepicker-disabled a.x-datepicker-date
Sample fiddle: https://fiddle.sencha.com/#fiddle/4ph
This question is specific to Adobe CQ5, so ExtJS answers by themselves won't be that helpful.
I have a custom text component with a menu option to change the background color. We're referencing a colorfield component in our dialog.xml, and so far everything works. The color menu appears with the default set of colors in the palette and can be clicked. So far so good.
I would now like to customize the palette and only show a select set of colors specific to our client. How do I achieve this?
Here's the relevant dialog.xml snippet so far:
<bgcolor
jcr:primaryType="cq:Widget"
fieldLabel="Background color"
name="./bgColor"
showHexValue="true"
xtype="colorfield"/>
For future reference, you could probably get by creating a custom ColorField to call a custom ColorMenu which sets a custom ColorPalette. If ColorField had configurable options, these would probably be mentioned in the Ext docs or found in the JS file itself in /libs/cq/ui/widgets/..
Found it on dev.day.com - http://dev.day.com/content/kb/home/cq5/Development/HowToCreateCustomClientLib.html
Simply put, override the ExtJS widget with your own. Not ideal but it'll do.