Lost feature / feature request ? column fade

Beta
#6

Thanks for the update @kory I heard a rumour on custom attributes down the line :smile:

If the drop-in module for interactions is more longterm, it would be great to have custom attributes sooner to be on par with some lesser builders.

1 Like
#7

Would be nice! :fist:

1 Like
#8

Very nice @kory

#9

Very much interested in the progress of a drop in module

this maybe be better as a separate request but it would be great if the text options on button (esp secondary text) had the text editor view (ie bold, carriage returns etc) as this would open up greater display options for buttons

1 Like
#10

Hi Scot,

We are too! It’s going to be a great addition.

I don’t think we’ll add the full the full text editor there since buttons aren’t meant for larger amounts of copy. What you can do though is double click to inline edit and press shift+enter to make a line break. You’ll also have the ability to make things bold from there. Alternatively, linebreaks can be coded inline by adding <br /> in the text input.

#11

Thanks @alexander,

in the case that I needed to replicate, I had 2 lines of secondary text separated by a line break but the first of those lines was bold. (trying to replicate a site built on another theme)

#12

I gotcha! Yeah, that secondary text isn’t “inline editable”. Only thing you can do is handwrite in some HTML like:

<strong>Line 1</strong><br/>Line 2
#13

I did that in the left panel editor and it didn’t work, although will try the inline editor to see if that does the trick

thanks

Edit: actually, I can’t access the inline editor for the secondary text on a button. is that a bug?

#14

Yeah, that’s what I was saying above. Secondary text would need to be coded directly.

#15

Sorry I missed the obvious!

adding text doesn’t seem to work within the secondary text

#16

The only thing secondary text supports is that single line input, but it should accept pretty much any HTML you put in there.

#17

Thanks…

it looks like the renew.css is overriding the <strong> inline code

it looks like

<span style="font-weight:700 !important;">A complete suite of fully managed IT services</span> <br> Proactive approach to technology and infrastructure management

does the job though

#18

oh right! I’m sorry about that. Yeah we had to add that forced inherit styling primarily to make sure that icons inserted directly in text were not breaking out or getting restyled.

1 Like
#19

Update: We’ve corrected this so the inline editing works and you can visibly see the strong tag taking effect without extra CSS.

1 Like
#20

Hi @kory

Just a few quick follow up questions on this future interaction animation drop-in module.

  1. Shall be an optional module on the front-end, i.e. all JS and CSS related to the module can the disabled/dequeued for customers not wanting to use it?

  2. Could it allow user-defined delay, duration and ease?

  3. Are there any thoughts on whether the animations shall be ‘whole’ animations with a given name that perform as variety of actions. As with other themes and using Animate.css rotateIn for example which includes both a opacity and transform (rotate3d). OR could it go one better than other themes and have granular level actions that can be stacked on to the same single element? For example completely separate opacity and individual transforms (translateX, Y, Z, 3d; scaleX, Y, Z, 3d; rotateX, Y, Z, 3d, et cetera) actions which can be stacked on the same element with different delay, duration and ease - so an element fades in slower than it translates/scales/rotates at user defined settings. Hope this makes sense and appreciate there is a balance between user friendliness and something that is possibly a complex UI to CSS transform generation.

#21

@strobley,

Thanks for writing in!

  1. Just like all of our v2 Elements, nothing will be output if you’re not using the feature on the frontend. v2 Elements feature a very lean “static” CSS base that is always part of the global site styles, but the dynamic generation for most things on top of that is variable (e.g. if you’re not using a border on your Buttons, there is no border output). We take a similar approach with our scripts when possible having a simple static base and then variable output is handled by each instance of the Element.

  2. It’s still too early in the process of this module to say specifics on much of this, but we definitely want to make sure it’s as flexible as possible for the end-user. As we actually move into things a little further, we will definitely want to get a pulse from the community on what is most important, how they’d like it to behave, balance of power and simplicity, et cetera.

  3. Same as #2 :slight_smile:

Hopefully that helps for now!

1 Like
#22

Thanks @kory certainly helps and understand it is early days. :thumbsup:

Right now, like others I’m creating my own which is a pain. The custom HTML data-* attributes once released should help this.

I am hoping this interaction animation drop-in module shall save a ton of extra work and custom code which is currently an overhead.

#23

Hi @strobley,

I’ve got some good news for you; I’m actually working on custom attributes today. We’re planning on that being another addition to this smaller cycle with the Grid element. The interaction controls will most likely be in the following cycle.

2 Likes
#24

Words… lost for… :grin:

Cannot thank you enough @alexander, not only for the this but for all incredible work you do and still find the time to support this whole community. Sincerely, thank you Sir.

1 Like
#25

You’re most welcome! I hope you enjoy the new features and it helps empower you to build awesome stuff :slight_smile:

1 Like