Square focus color - square-connect

Using the Square payment form (sqPaymentForm) in context with the API how do I set the color property for text for the focus state? I have been vaguely able to emulate a background-color property in a hackish fashion though would appreciate being able to apply the background-color property for the iframe/form field focus state in a more proper approach too.

Please read the documentation, that page describes all styling options that are available.

Related

Animation by Scroll

can someone tell me how do this this kind of by Scroll Animation?
https://radix.bio/
Would be so happy if someone can help
Best
Jeffrey
Check the source of that page and observe data-slide-id="0" to data-slide-id="4".
Check the position of this attribute using JavaScript and change the background of page accordingly. Change background of absolutely positioned DIV based on element have these attributes (Observe Top of each element and change image). Hope you got logic behind it.

Does the react-virtualized Masonry component support setting the scrollTop or scrollToIndex values?

I've implemented a Masonry layout that adjusts dynamically to the window size and it all works very well. I calculate its height and width and reset the cell measurements when any outside dimensions change.
I just need to be able to programmatically slide into view a specific item while it is being edited as well as scroll back to top programatically. Is this possible? I've tried to set scrollTop or scrollToIndex but it has no effect (unlike List). I have the feeling that I'm missing something obvious.
Thank you!
Unfortunately, the Masonry component does not currently support a scrollTop prop (other than a partial support required to work with WindowScroller). I would be willing to review a PR adding this functionality, but whether it landed would depend on the complexity. :)

KendoUI Combobox responsivenes

I am working with the Kendo UI beta (v. 2013.1.226) and I found that there are some glitches when you change the font size of a combobox.
The drpodown arrow doesn't seem right - it is a bit up while it shouold perfectly position itself in the center of the dropdown button.
To illistrate - I am attaching a screenshot.
Anyone know if there's a way to fix this?
I am thinking of somehow change the x and y position of the background to be relative.
Any help will be appreciated.
Update: Not quite sure if it's only me but found another problem changing the font size, the list seems to overlap the input field as shown in the second image:
I am using IE 9. Anyone have those problems or is it just me?
As far as I know Kendo shouldn't be interfering with other styles on the page (the styles start with k- prefix) so I am wondering if the issues only occur for me or are common.
The KendoUI Combobox is made up of multiple components and has its own styling for all the parts including the arrow. The arrow is actually two nested spans in the version I am using (2013.1.514).
I changed my textbox heights and got different alignment problems:
I would not expect the supplied KendoUI CSS to survive a font-size change as they are tweaked to look good at its own default font size. Your best bet is to use Chrome's F12 tools to determine what CSS styles are affected and tweak the Kendo styles (or your overrides) to match your requirements.

Displaying an image when hovering a label

I'm wondering if there is a simple and quick way of displaying an image when the user hovers a QLabel...
Since QLabel can be used to display QPixmap, I would like to display some kind of "preview" when hovering a QLabel...
Do you guys know how I could manage this ?
Thanks in advance !
You can set the tooltip to use html, including <img> tags. Will that do what you need?
As described in the docs, you can override the object's event handler if you need to do something fancier in a tooltip than can be done by default. (such as selecting a particular area of an image to put in the tooltip)
As long as you set the button size large enough, you should be able to capture the mouse-over events and display on mouse-over... but this seems like a somewhat strange way to go about things. Why not display all the images at first?
For those who are interested in the result proposed by jkerian :
Simply :
MyLabel->setToolTip("<html><img src="+MyImagePathAsString+"/></html>");
Will result in :
Thanks again to jkerian.
I don't know what kind of layout your QLabel is in, but I'm guessing it will cause weird layout changes if you just set the pixmap on the label when mouseovering it. Rather use a tooltip or just display a pixmap freely on the canvas.

Non-traditional input using CSS sprites and JavaScript: opinions sought

My client is very invested in using a bunch of non-traditional inputs in a form we are developing for him. The image below represents various states of the interface with the last indicated it is disabled in the current context. The end users will be trained in how to interact with the inputs.
alt text http://www.nolaflash.com/interface.gif
My idea is that we will develop an image map representing the clickable zones of the image and let the onclick event set a hidden field and change the CSS for the element to move the background sprite to the appropriate coordinates.
What do folks think of this? Obvious flaws other than folks with JavaScript disabled?
I want the end solution to be iPhone/other device friendly.
Your thoughts will be appreciated.
let the onclick event set a hidden field and
change the CSS for the element to move
the background sprite
sounds reasonable
Here is my solution using CSS Sprites and JS
http://egolfplan.com/testform.html

Resources