Forum Activity for @john-bizley

My Activity Box Input Design Change On Timeline Mentions

Design and Skin Customization

Thought the activity update box looked a little plain so decided to adjust it a little. This is on the slate skin but could be adjusted for any by editing the colours etc. The CSS I added to the Profile Page CSS and here is the little code I used but stopped the styling for smaller screens so not to hinder bandwidth downloading the styles.

/* This is for the timeline status box on the profile pages but the styles only come into affect above the media query */

@media only screen and ( min-width:800px){

#new_action.item{ background-color: rgba(0, 0, 0, 0.19);
background-image: linear-gradient(#FDF5E6, rgba(227, 225, 225, 0.81)); }


form#action_form{ background-color: rgba(0, 0, 0, 0.44);
background-image: linear-gradient(rgba(11, 7, 0, 0.47), rgba(227, 225, 225, 0.56)); }

.mentions-input-box{ padding: 4px;
background: rgba(0, 0, 0, 0.23); }

form#action_form .form_button{ background-color: #24C0EB;
background-image: linear-gradient(#24C0EB, rgba(0, 0, 0, 0.16));
color: #FFF;border-radius:20px; box-shadow: 2px 4px 7px rgba(69, 38, 38, 0.99);border:none;
margin-bottom: 6px;
margin-left: 6px; }

form#action_form .form_button:hover{ background-color: #2F4F4F;background-image: linear-gradient(#24C0EB, rgba(0, 0, 0, 0.12)); }
}

Added an image showing the box which I added twice so you can see the button when hovered over which is the bottom of the two.

John

updated by @john-bizley: 01/01/15 09:00:42PM

Form Designer - Checkbox validation

Installation and Configuration

I agree Brian as most would include those terms within the main site terms and conditions on signing up so there would be no need to have another somewhere else.

Form Designer - Checkbox validation

Installation and Configuration

@Brian how about if the buttons to enable the uploads where hidden unless the tick box value is true then hide the tick box so it cannot be changed and reveal the upload buttons for the songs and album cover. By hiding the tick box after selection of agreeing to the terms it means they cannot just tick it to add the songs then un-tick after. If some details where also added like the terms this could also be hidden once terms are agreed upon.

Can you add more than one instance of a module ?

Using Jamroom

Cool thanks Brian

Can you add more than one instance of a module ?

Using Jamroom

If you have lets say the forum module and maybe photo galleries can these modules be cloned so you have more than one forum module or photo galleries module ? If so what's the best way to do this ?
updated by @john-bizley: 01/01/15 05:34:50AM

Here is a little forum adjustment I did for smaller screens

Design and Skin Customization

Hi Douglas, yes it is. I just added my code above the mobile-core css. I added mine with a media querie so to keep mone seperate but there is no need to do that as it could be just added into the mobile css media query.
Here is a screenshot showing where I added the code

updated by @john-bizley: 11/25/14 08:35:16AM

Here is a little forum adjustment I did for smaller screens

Design and Skin Customization

So here is the Jamroom forum after I added my code in Firefox, much easier to read

updated by @john-bizley: 11/24/14 03:00:17PM

Here is a little forum adjustment I did for smaller screens

Design and Skin Customization

Here is an image of a before image on Jamroom when I was using my phone earlier, and as you can see it's difficult to read with a lot of text

updated by @john-bizley: 11/24/14 02:58:53PM

Here is a little forum adjustment I did for smaller screens

Design and Skin Customization

Here is the after image

updated by @john-bizley: 11/24/14 02:56:52PM

Here is a little forum adjustment I did for smaller screens

Design and Skin Customization

This I noticed today as was using my phone a lot to use the Jamroom forum. We had a similar thing on Ning where the members details where to the side of the conversations which squished the text over to the side. The code I added below I added to the mobile core css. I have added an image showing the change

Here is the little bit of code I used

@media only screen and ( max-width:767px){
.forum_post_image { width:100%!important;float:left;}
.forum_post_text{ display:inline-block; }
.forum_post_image .normal{ float:left!important;text-align:left}
.forum_post_image .action_item_user_img {display:inline-block!important}

}
updated by @john-bizley: 01/01/15 03:36:57AM