RossF1984 0 Posted April 24, 2020 Share Posted April 24, 2020 Hi all, I have made a change to a text string within 'Languages > Phrases within the customers account' The string I changed is: "register_terms_agree_link" The problem I am having is now that the string is longer it drops the text down from beside the box (See attached *.jpg) as it should be. I assume that this is due the column size being fixed on this form? Could anyone advise as to how to make it wider so that the text does not drop down? I have attempted to use the Inspect feature on Firefox but am unable to fathom it out. Kind regards, Ross Quote Link to post Share on other sites
Al Brookbanks 201 Posted April 24, 2020 Share Posted April 24, 2020 Maybe float it right at the end so it shows to the right of the page at the end if the text. Just add a class "right" to the input checkbox. That should do it. Quote Link to post Share on other sites
RossF1984 0 Posted April 24, 2020 Author Share Posted April 24, 2020 (edited) Thanks @Al Brookbanks for the rapid repsonse. Sorry for sounding thick but do you know which file would I need to make this edit to? Would it be content.register.php. I have found this in there: <div class="row"> <div class="small-12 large-8 columns"><span id="error_terms_agree"><input type="checkbox" id="terms" name="terms_agree" value="1" {$TERMS_CONDITIONS_CHECKED} rel="error_terms_agree"><label for="terms">{$LANG.account.register_terms_agree_link|replace:'%s':{$TERMS_CONDITIONS}}</label></span></div> </div> I added right to the class after the word columns (so class="small-12 large-8 columns right) and the attached was the result. Apologies, I am attempting to learn as I go which involves a lot of questions and guess work! Edited April 24, 2020 by RossF1984 Quote Link to post Share on other sites
Al Brookbanks 201 Posted April 24, 2020 Share Posted April 24, 2020 Well... This is exactly how I learned. If you are interested you'll nail it. Quote Link to post Share on other sites
bsmither 1,463 Posted April 24, 2020 Share Posted April 24, 2020 Please try this: In the Foundation template content.register.php, near line 45, find: <div class="small-12 large-8 columns"><span id="error_terms_agree"><input type="checkbox" id="terms" name="terms_agree" value="1" {$TERMS_CONDITIONS_CHECKED} rel="error_terms_agree"><label for="terms">{$LANG.account.register_terms_agree_link|replace:'%s':{$TERMS_CONDITIONS}}</label></span></div> Change to: <div class="small-12 large-8 columns" id="error_terms_agree" style="display:flex; align-items:baseline;"><input type="checkbox" id="terms" name="terms_agree" value="1" {$TERMS_CONDITIONS_CHECKED} rel="error_terms_agree"><label for="terms">{$LANG.account.register_terms_agree_link|replace:'%s':{$TERMS_CONDITIONS}}</label></div> This may affect validation. Please verify. A similar edit may be applicable in the checkout process. Quote Link to post Share on other sites
RossF1984 0 Posted April 24, 2020 Author Share Posted April 24, 2020 (edited) Thanks! I will give this a go. I managed to create a temporary solution that looks a little better than it did previously. But this involves putting the text string back to the original and then placing a statement below the Terms & Conditions statement. What do you mean by "may affect validation"? That the registration process may not complete correctly? Edited April 24, 2020 by RossF1984 Quote Link to post Share on other sites
bsmither 1,463 Posted April 24, 2020 Share Posted April 24, 2020 (edited) The form elements are passed through a "form validator". The validator checks for things like: something was entered, if entered, does it look like it is supposed to-- -- phone numbers - only digits -- email - proper syntax and does it already exist (ajax call) -- password must meet complexity level -- confirm password must match password -- T&C box checked The validator, if something fails the validation rules, will tell the browser where to show an error banner. The original HTML statement said: for the T&C checkbox, find the HTML with the same id as the this tag's rel attribute. The tag with the matching id attribute was the <span> tag just removed. The <span> tag was causing an inability to properly identify the box's children within the contents of the flex box. So, now that the <div columns> tag has this id attribute, where would the error banner get shown? I haven't tested that. Edited April 24, 2020 by bsmither 1 Quote Link to post Share on other sites
RossF1984 0 Posted April 24, 2020 Author Share Posted April 24, 2020 Thanks for the explanation. Quote Link to post Share on other sites
bsmither 1,463 Posted April 24, 2020 Share Posted April 24, 2020 (edited) Actually, I'm now finding that applying the flex style to the span works just as well. Oh well. But, since there isn't a matching span on the following checkbox, probably better to apply the flex style to the <div columns> for all the checkboxes. Edited April 24, 2020 by bsmither Quote Link to post Share on other sites
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.