[SOLVED] Can I do this with CB Conditionals (or, somehow?)

Paladin Brewer
OFFLINE
Posts: 43
Thanks: 2
Karma: 0

8 years 3 weeks ago #287434 by Paladin Brewer

Replied by Paladin Brewer on topic Can I do this with CB Conditionals (or, somehow?)

Nevermind, I found I have to use userfield, not userdata. Huzzah!

The following user(s) said Thank You: krileon

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

Paladin Brewer
OFFLINE
Posts: 43
Thanks: 2
Karma: 0

8 years 3 weeks ago #287519 by Paladin Brewer

Replied by Paladin Brewer on topic Can I do this with CB Conditionals (or, somehow?)

Hey there. So I know this isn't a problem with CB persay, but I'm hoping you can help me out a little bit with the CSS

Right now, it's looking like this:

This is my custom html:

Code:

<div id="mainchar">
	<h4>MAIN CHARACTER</h4>
	[cb:userfield field="cb_main_char_name" formatting="div" /]<br />[cb:userfield field="cb_main_char_race" formatting="div" /]<br />[cb:userfield field="cb_main_char_class" formatting="div" /]</div>
<div id="altchar">
	<h4>ALTERNATIVE CHARACTERS</h4>
	Alt One:<br />[cb:userfield field="cb_alt_one_name" formatting="div" /]<br />[cb:userfield field="cb_alt_one_race" formatting="div" /]<br />[cb:userfield field="cb_alt_one_class" formatting="div" /]</div>

And this is my CSS so far for mainchar/altchar:

Code:

#mainchar {
	width: 33%;
	height: 100%;
	min-height:100%;
	vertical-align: top;
	position: static;
	display: inline-block;
	left: 0px;
}

#altchar {
	width: 33%;
	height: 100% !important;
	min-height:100% !important;
	vertical-align: top;
	position: absolute;
	display: inline-block;
	right: 0px;
}

So here are the problems I'm still having:
1) I don't care for the large spacing between each field like "Name" and "race" on both the Main and Alt chars. I'd like to bring those closer together.
2) I don't know why the scroll par is there, I guess height: 100% is wrong? How do I correct this.
3) On the "Alternative Characters" the fields are showing as if they are 2 line with title, but I have them set as 1 line. I assume there is a width issue there but I don't understand why?

Ultimately (after I put in the other Alt char fields), I want it to look like this:

Any help is super appreciated!

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

krileon
ONLINE
Posts: 48548
Thanks: 8290
Karma: 1445

8 years 3 weeks ago #287532 by krileon

Replied by krileon on topic Can I do this with CB Conditionals (or, somehow?)

1) I don't care for the large spacing between each field like "Name" and "race" on both the Main and Alt chars. I'd like to bring those closer together.

The spacing isn't that large for standard Bootstrap. My guess is your template has a margin or padding being applied to Bootstrap rows or to the labels (Name, Race, etc..).

2) I don't know why the scroll par is there, I guess height: 100% is wrong? How do I correct this.

It's a problem with your template, so I don't know. You'd have to provide a URL to a profile showing the issue so I can check the CSS.

3) On the "Alternative Characters" the fields are showing as if they are 2 line with title, but I have them set as 1 line. I assume there is a width issue there but I don't understand why?

There's not enough width available. Your main characters width is set to 33% and so is your alt, but that doesn't equal 100% so you've some lost width somewhere. I highly recommend you use Bootstrap grid classes. Example as follows.

Code:

<div class="row">
	<div class="col-sm-6">
		<h4>MAIN CHARACTER</h4>
		[cb:userfield field="cb_main_char_name" formatting="div" /]
		[cb:userfield field="cb_main_char_race" formatting="div" /]
		[cb:userfield field="cb_main_char_class" formatting="div" /]
	</div>
	<div class="col-sm-6">
		<h4>ALTERNATIVE CHARACTERS</h4>
		<h4>ALT ONE</h4>
		[cb:userfield field="cb_alt_one_name" formatting="div" /]
		[cb:userfield field="cb_alt_one_race" formatting="div" /]
		[cb:userfield field="cb_alt_one_class" formatting="div" /]
	</div>
</div>

Note you do not need the linebreaks as those substitutions are already going to render div rows for each field.

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: Paladin Brewer

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

Paladin Brewer
OFFLINE
Posts: 43
Thanks: 2
Karma: 0

8 years 3 weeks ago - 8 years 3 weeks ago #287605 by Paladin Brewer

Replied by Paladin Brewer on topic Can I do this with CB Conditionals (or, somehow?)

1) Found the margin spacing issue, it is:

Code:

.cb_template .form-group {
    margin-bottom: 15px ;
}

The problem is, if I change it, it screws up my edit fields and smooches them together:

To compensate, I tried adding bottom-padding to .cb_template .col-sm-9 and .cb_template .col-sm-12, but then this adds padding to the "Views" on the main page.

Argh. Any suggestions there? A direct link to a profile is swordofthedragon.org/your-profile/userprofile/Paladin%20Brewer

2) Using your div code seems to have gotten rid of the scroll bar for now, we'll see if it comes back after I add the other Alts in.

3) I figured out the problem, it's not the spacing. It's because those fields are using the custom CSS "myFieldRows" we set previously. Which brings me to the next question....how do we use that custom CSS for the profile edit, but not for the profile display?

Last edit: 8 years 3 weeks ago by Paladin Brewer.

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

krileon
ONLINE
Posts: 48548
Thanks: 8290
Karma: 1445

8 years 3 weeks ago #287617 by krileon

Replied by krileon on topic Can I do this with CB Conditionals (or, somehow?)

3) I figured out the problem, it's not the spacing. It's because those fields are using the custom CSS "myFieldRows" we set previously. Which brings me to the next question....how do we use that custom CSS for the profile edit, but not for the profile display?

Each view is surrounded by a unique CSS class. So for profile edit and registration displays only you could use the below selectors to style only those views.

Code:

.cb_template .cbRegistration .myFieldRows,
.cb_template .cbEditProfile .myFieldRows {
	CSS HERE
}

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

Paladin Brewer
OFFLINE
Posts: 43
Thanks: 2
Karma: 0

8 years 3 weeks ago #287627 by Paladin Brewer

Replied by Paladin Brewer on topic Can I do this with CB Conditionals (or, somehow?)

I'm guessing I can also do this to fix my first problem? Some sort of ".cb_template .form-group .cbProfile {" So it only effects the spacing on the profile and not the field spacing in the edit? I'm not home to test right now which is why I ask. Is it .cbProfile for the profile info?

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

Moderators: beat, nant, krileon