CSS Class
- matthewdavey
- OFFLINE
-
Platinum Member
- Posts: 350
- Thanks: 2
- Karma: 0
4 years 1 month ago #316879
by matthewdavey
CSS Class was created by matthewdavey
I see the CSS Class form-group-section in PROFILE_ADDRESS cb_address_header
Where is the CSS Class file located if I want to change the colour of the form-group-section from light grey to light blue?
Im dot a coder but I think I might be able to change the colour code of the form-group-section?
Also is it possible to change the colour the tabs see attached from light grey to light blue? Where is the file kept?
It would be great if I could change the colour with cb fields. If the user was a girl display light pink and if the user was a boy display light blue?
Thanks
Where is the CSS Class file located if I want to change the colour of the form-group-section from light grey to light blue?
Im dot a coder but I think I might be able to change the colour code of the form-group-section?
Also is it possible to change the colour the tabs see attached from light grey to light blue? Where is the file kept?
It would be great if I could change the colour with cb fields. If the user was a girl display light pink and if the user was a boy display light blue?
Thanks
Please Log in to join the conversation.
krileon
Team Member- OFFLINE
- Posts: 68482
- Thanks: 9076
- Karma: 1434
4 years 1 month ago #316892
by krileon
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.
Replied by krileon on topic CSS Class
You don't modify CBs CSS directly. You use CSS overrides and provide your own CSS to override it. See the below on how to use CSS Overrides.
www.joomlapolis.com/blog/kyle/18711-template-css-overrides-made-easy
Example override as follows.
www.joomlapolis.com/blog/kyle/18711-template-css-overrides-made-easy
Example override as follows.
.cb_template .form-group-section .col-form-label {
background-color: red;
}You'd have to dynamically generate the CSS, which I suppose you could do using CB Auto Actions and a Code action to add CSS to the header. Since substitutions are supported there I suppose you could condition the CSS based off a gender field. As for the trigger you'd need to use onAfterUserProfileDisplay and onAfterUserProfileEditDisplay.It would be great if I could change the colour with cb fields. If the user was a girl display light pink and if the user was a boy display light blue?
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.
Please Log in to join the conversation.
- matthewdavey
- OFFLINE
-
Platinum Member
- Posts: 350
- Thanks: 2
- Karma: 0
3 years 10 months ago - 3 years 10 months ago #319024
by matthewdavey
Replied by matthewdavey on topic CSS Class
I entered
.cb_template .form-group-section .col-form-label {
background-color: red;
}
To test what it would change In the default template css Overrides and it did nothing???
What would be the 2 css examples blue for male and pink for female
I have a gender field radio button male or female could you please explain the procedure in detail to achieve this
You said above You'd have to dynamically generate the CSS, which I suppose you could do using CB Auto Actions and a Code action to add CSS to the header.
As for the trigger you'd need to use onAfterUserProfileDisplay and onAfterUserProfileEditDisplay?
How do I do this?
Thanks
.cb_template .form-group-section .col-form-label {
background-color: red;
}
To test what it would change In the default template css Overrides and it did nothing???
What would be the 2 css examples blue for male and pink for female
I have a gender field radio button male or female could you please explain the procedure in detail to achieve this
You said above You'd have to dynamically generate the CSS, which I suppose you could do using CB Auto Actions and a Code action to add CSS to the header.
As for the trigger you'd need to use onAfterUserProfileDisplay and onAfterUserProfileEditDisplay?
How do I do this?
Thanks
Last edit: 3 years 10 months ago by matthewdavey.
Please Log in to join the conversation.
- krileon
- Team Member
- OFFLINE
- Posts: 68482
- Thanks: 9076
- Karma: 1434
3 years 10 months ago #319034
by krileon
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.
Replied by krileon on topic CSS Class
It changes the style of the section label added by CB Quickstart. Works perfectly fine in my tests. Try adding !important to the style so it has more focus. Example as follows.To test what it would change In the default template css Overrides and it did nothing???
.cb_template .form-group-section .col-form-label {
background-color: red !important;
}Yes, you'd have to use CB Auto Actions and yes those triggers are correct. A Code action can be used to insert CSS into the page. You should be able to leave User as Automatic and just condition for gender under the Conditions tab.You said above You'd have to dynamically generate the CSS, which I suppose you could do using CB Auto Actions and a Code action to add CSS to the header.
As for the trigger you'd need to use onAfterUserProfileDisplay and onAfterUserProfileEditDisplay?
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.
Please Log in to join the conversation.
- matthewdavey
- OFFLINE
-
Platinum Member
- Posts: 350
- Thanks: 2
- Karma: 0
3 years 10 months ago #319049
by matthewdavey
Replied by matthewdavey on topic CSS Class
You are an expert coder... No doubt...
I am a subscriber please can you explain in detail.
I have looked at autactions thats got a lot of configuring options.....
I cant understand your short talk.
No affence.
This is a big thing to me.
Please explain the exact procedure in detail please how to achive the resault.
Thanks
I am a subscriber please can you explain in detail.
I have looked at autactions thats got a lot of configuring options.....
I cant understand your short talk.
No affence.
This is a big thing to me.
Please explain the exact procedure in detail please how to achive the resault.
Thanks
Please Log in to join the conversation.
- krileon
- Team Member
- OFFLINE
- Posts: 68482
- Thanks: 9076
- Karma: 1434
3 years 10 months ago #319060
by krileon
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.
Replied by krileon on topic CSS Class
If you want to load custom CSS based off a gender field on profile display and profile edit you'd have the below for example.
Global
Triggers: onAfterUserProfileDisplay, onAfterUserProfileEditDisplay
Type: Code
User: Automatic
Access: Everybody
Conditions
Field: YOUR_GENDER_FIELD
Operator: Equal To
Value: GENDER
Action
Method: CSS (Inline)
Code:
For YOUR_GENDER_FIELD of course select whatever your gender field is and for GENDER input the gender you want this auto action to output CSS for. I can't help you with writing custom CSS; that will be for you to do, but the above will load whatever custom CSS you supply it.
Global
Triggers: onAfterUserProfileDisplay, onAfterUserProfileEditDisplay
Type: Code
User: Automatic
Access: Everybody
Conditions
Field: YOUR_GENDER_FIELD
Operator: Equal To
Value: GENDER
Action
Method: CSS (Inline)
Code:
.cb_template .form-group-section .col-form-label {
background-color: red !important;
}For YOUR_GENDER_FIELD of course select whatever your gender field is and for GENDER input the gender you want this auto action to output CSS for. I can't help you with writing custom CSS; that will be for you to do, but the above will load whatever custom CSS you supply it.
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.
Please Log in to join the conversation.
Moderators: beat, nant, krileon
Time to create page: 0.545 seconds
-
You are here:
- Home
- Forums
- Support and Presales
- Professional Members Support
- CSS Class