Alignment and overflow around node links

Ezra,

I don't think your patch will actually solve the problem of the item text wrapping, it just happens to solve the symptom in this one particular case (i.e. items with different lengths of characters are going to wrap at different places, so adjusting the padding will only solve the issue in some cases where the breaks between items happent to fall in the right place).

Anyhoo, I don't have a set up of Commons handy to be able to roll a patch, but here is basically the fix for all three issues:

/*commons_origins-style.css at line 87*/

.item-list ul li,
.node .inner ul li,
.panel-pane .inner ul li,
.block .content ul li {
-  background: transparent url(../images/gray-arrow-right.png) no-repeat 0 4px;
+  background: transparent url(../images/gray-arrow-right.png) no-repeat left center;
  list-style-image: none;
  list-style: none;
  margin-bottom: 8px;
  padding-left: 22px;
  text-indent: 0;
}


/*commons_origins-style.css at line 896*/

.node .inner ul.menu li a,
.block .content ul.menu li a,
-.panel-pane .inner ul.menu li aa {
+.panel-pane .inner ul.menu li a {
-  background: transparent url(../images/gray-arrow-right.png) no-repeat 0 1px;
+  background: transparent url(../images/gray-arrow-right.png) no-repeat left center;
	list-style-image: none;
	list-style: none;
	margin: 0 0 8px 0;
	padding: 0 0 0 22px;
	text-indent: 0;
+  whitespace: no-wrap;
}

+.node .inner ul.menu,
+.block .content ul.menu,
+.panel-pane .inner ul.menu {
+  margin-left: 0;
+}

Also, there's an extra typo fix in there :)

Just tested in Firebug, so may need more review.

Just installed commons, I will roll this as a patch momentarily.

Here is a patch for the above code. whitespace should actually be white-space (fixed in patch_

too fast for me!

i will check out the other issues

just checking now, I just re-rolled the patch and fixed the whitespace, but didn't actually check the site.

Where can i access these node link menus in the origins theme? I haven't used commons before. :p

re-rolled patch with fixes for all issues. give it a try now.

PS noticed a white space bug where your icons are occasionally mashing up against separator pipes. looking into that one.

k, so the icons mashing up against the pipes is definitely the "Extra Whitespace in List Links bug". it's one that's not usually noticed with inline links unless you are doing tight pixel sensitive designs.. and especially with icon links. There are some negative text-indent hacks that can fix this, etc.. but i prefer floated left list items in most cases.

Changing the menus over to floated left menus will actually cause another problem though, the pipes will become the same size as the line-height, which doesn't improve the design very much in this case.

As a quick fix, I just left changed the location of the icon in the list to be moved over to the right by 3px.

last patch re-roll unless you notice any other issues.

Excellent work, guys! Very much in need of this. Confirming that the patch in #11 works great.