Skip to Content Skip to Menu

🎃 Happy Halloween! Treat yourself with an awesome discount on memberships! Get 20% off now with code SPOOKY-2024!

[SOLVED] Make input boxes bigger in login module

8 years 7 months ago - 8 years 7 months ago #279543 by panayiotis96
Hi all,
Because when using the default login module the placeholders in the input boxes are not fully visible, I want to make them bigger (increase their width). Does anyone have an idea in how to do it?
Many thanks!
Last edit: 8 years 7 months ago by krileon.

Please Log in or Create an account to join the conversation.

  • lousyfool
  • lousyfool
  • OFFLINE
  • Posts: 141
  • Thanks: 46
  • Karma: 5
8 years 7 months ago #279544 by lousyfool
Replied by lousyfool on topic Make input boxes bigger in login module
Basic CSS: use the "width" property on the input element.
www.w3schools.com/cssref/pr_dim_width.asp

Please Log in or Create an account to join the conversation.

8 years 7 months ago #279545 by panayiotis96
Replied by panayiotis96 on topic Make input boxes bigger in login module
Thanks for your response.
Where should I apply this CSS rule?

Please Log in or Create an account to join the conversation.

  • lousyfool
  • lousyfool
  • OFFLINE
  • Posts: 141
  • Thanks: 46
  • Karma: 5
8 years 7 months ago #279546 by lousyfool
Replied by lousyfool on topic Make input boxes bigger in login module
Typically Joomla templates offer a way to apply CSS overrides.

Please Log in or Create an account to join the conversation.

  • krileon
  • krileon
  • ONLINE
  • Posts: 48460
  • Thanks: 8280
  • Karma: 1443
8 years 7 months ago #279583 by krileon
Replied by krileon on topic Make input boxes bigger in login module
If your template is Boostrap compatible it's typically best to do this with Bootstrap classes and at this time the best way to do this is a module layout override within your Joomla template.

You can override it by navigating to Extensions > Templates > Templates (from Styles on the left menu) then click the "TEMPLATE_NAME Details and Files" link. From here you can click the "Create Overrides" tab followed by clicking "mod_cblogin".

You now should have layout overrides for CBs login module within the below folder.

templates/YOUR_TEMPLATE/html/mod_cblogin/

From there you can customize CBs layouts HTML directly and add the necessary Bootstrap classes (e.g. input-xs, input-sm, input-lg, etc..).

The alternative is as suggested above to use width CSS style to change it entirely with CSS.

The next CB release will include parameters for adding custom CSS classes to the inputs, buttons, and links in our module though so this will also make it easier as you won't have to override the layout anymore.


Kyle (Krileon)
Community Builder Team Member
Before posting on forums: Read FAQ thoroughly + Read our Documentation + Search the forums
CB links: Documentation - Localization - CB Quickstart - CB Paid Subscriptions - Add-Ons - Forge
--
If you are a Professional, Developer, or CB Paid Subscriptions subscriber and have a support issue please always post in your respective support forums for best results!
--
If I've missed your support post with a delay of 3 days or greater and are a Professional, Developer, or CBSubs subscriber please send me a private message with your thread and will reply when possible!
--
Please note I am available Monday - Friday from 8:00 AM CST to 4:00 PM CST. I am away on weekends (Saturday and Sunday) and if I've missed your post on or before a weekend after business hours please wait for the next following business day (Monday) and will get to your issue as soon as possible, thank you.
--
My role here is to provide guidance and assistance. I cannot provide custom code for each custom requirement. Please do not inquire me about custom development.
The following user(s) said Thank You: panayiotis96

Please Log in or Create an account to join the conversation.

8 years 7 months ago #279592 by panayiotis96
Replied by panayiotis96 on topic Make input boxes bigger in login module
Perfect. I managed to fix it. Thanks for your valuable help.
The following user(s) said Thank You: krileon

Please Log in or Create an account to join the conversation.

Moderators: beatnantkrileon
Powered by Kunena Forum