Making Package to Project Tracking a Little Easier

One of the issues we’ve had since using Octopus is keeping track of which packages are where in an at-a-glance fashion. We started putting a list of packages in the project descriptions. However, the display of the projects screen is a bit stingy for all these to display neatly.

I use Chrome exclusively, and setup a couple Stylish css scripts to make this a bit more pretty.

For the /app#/projects page:

.project-list .project .project-description {
    display: block;
    text-align: left;
    overflow: visible;
    max-height: inherit;
    word-wrap: break-word;
}
.project-list .project {
    width: 280px;
    height: auto;
    margin-right: 20px;
    border-radius: 3px;
    border: 1px solid transparent;
    display: block;
    padding: 18px;
}
markdown.project-description ul{
    padding-left: 16px;
}
markdown.project-description li{
    display: list-item;
}

And for a project detail

markdown.project-description ul{
    padding-left: 16px;
	word-wrap: break-word;
}

Enjoy.

Hi Michael,

Thanks for reaching out!

Can you give us an example how your package strings look like, along with a screenshot of how it looks on your project description without your css tweak?

Thanks,
Dalmiro

Sure. My actual packages can be some like Organization.[Project Grouping].ApplicationName. Mind you, Project Grouping isn’t anything Octopus related. These can be as long as 40 characters or so.

I’ve attached both before and after shots. For the Sample Project, the raw description text is such.

- Package #1
- Package #2
- Package #3
- Package #4
- Package #5

Sample_Project_No_Script.png

Sample_Project_With_Script.png

Hi Michael,

Thanks for the screenshots. I’ve passed this to our designer, whose gathering all these tiny UI things to make an overall UI refresh/consistency check in the future.

Best regards,
Dalmiro