[Template] Easy Mini-Profile Width Changer
Apr 6, 2015 16:06:53 GMT -8
Chris, Jen Parsons, and 3 more like this
Post by Brian on Apr 6, 2015 16:06:53 GMT -8
I've been looking into LESS (the language we use to generate the special things in style sheets on ProBoards such as variables and functions) and all the wonderful things it can do and have determined a much less painful way to change both the mini-profile width and the left panel width at the same time.
Just add this to the bottom of Themes > Advanced Styles & CSS > Style Sheet. Change the number in green to the width you want the mini-profile to be.
Note that if you have a heavily customized theme results may vary, as this was coded with the default ProBoards theme in mind.
But wait, there's more!
If you want it as part of your Visual Editor you can click on the Visual Editor Builder tab above the preview on the same page. Scroll down to the Mini-Profiles section and expand it. Hover your mouse over the Mini-Profiles section and click on the Add New Row button.
Fill in the information like so. If the @mini_width variable isn't available from the dropdown you'll need to save the earlier changes to your style sheet first, then click on the Style Sheet tab again to reload the page. It should show up the next time you reach this dropdown.
Click on the Create button to add the field. Now save your changes. Upon returning to the Visual Editor tab you should now have a fully working width field in your Mini-Profiles section.
Just add this to the bottom of Themes > Advanced Styles & CSS > Style Sheet. Change the number in green to the width you want the mini-profile to be.
@mini_width: 150px;
.mini-width(@a) { width: unit(unit(@arguments) + 22,px); }
.mini-profile { width: @mini_width; }
.posts .post .left-panel,
.messages .item .left-panel { .mini-width(@mini_width); }
.mini-width(@a) { width: unit(unit(@arguments) + 22,px); }
.mini-profile { width: @mini_width; }
.posts .post .left-panel,
.messages .item .left-panel { .mini-width(@mini_width); }
But wait, there's more!
If you want it as part of your Visual Editor you can click on the Visual Editor Builder tab above the preview on the same page. Scroll down to the Mini-Profiles section and expand it. Hover your mouse over the Mini-Profiles section and click on the Add New Row button.
Fill in the information like so. If the @mini_width variable isn't available from the dropdown you'll need to save the earlier changes to your style sheet first, then click on the Style Sheet tab again to reload the page. It should show up the next time you reach this dropdown.
Click on the Create button to add the field. Now save your changes. Upon returning to the Visual Editor tab you should now have a fully working width field in your Mini-Profiles section.
