Use Chrome browser? Want to edit 7.0 design?

[Madelene Gilbert]

OK thanks anyway Madelene

I can get the weather preferences from the horse page.

It still looks better.

Robbie

Robbie I think I figured out what's going on...

(and Admin, please step in and correct me if I'm wrong)

Weather Preferences are titled "Condition" in the Manage Barn page, which threw me for a loop for a second. So yes, it IS there.

But what's going on is that the table is pushing the overflow columns into the dropdown arrow on both the Manage Barn and the individual barns pages. For example:
- on the Manage Barns page, the extra columns "Flat Rating", "Chase Rating", "Stats", etc are hidden under the arrow
- on a custom Racing Barn page, the extra columns past the initial 9-10 or so end up hidden under the arrow by the horse's name

Note this has NOTHING to do with my CSS edits. There is probably a setting in the server side code to limit the number of columns shown before they get pushed into the dropdown. So if you want Weather to show up, you'll probably have to hide one of the previous columns until it shows up. Unfortunately, we can't choose which columns take precedence, which means hiding columns after Condition will have no effect; you'll have to get rid of "Breed" through "Soundness".

Make sense?

[Ali Hedgestone]

So I don't think the issue here is limiting the overall size/scalability. I think it's in the width of the columns, which make it difficult to read across. I think if the columns auto-sized to the data in them, then it would make it easier to read on large screens and not affect players with smaller screens.

Here is my large screen at full screen


Here is it when I shrink it down to a better readability

[The Steward]

What I learned from this post is that you should weather check your horseys

[Ali Hedgestone]

What I learned from this post is that you should weather check your horseys

Can we get a pre-season sale on weather checking?

[Madelene Gilbert]

Ok, I lied. Stylebot's styles work slightly differently than if I input the styles directly into Chrome's Developer Tools. So the wrapping of columns IS a result of Stylebot, but the CSS isn't necessarily "bad". I'm getting different effects with the same code depending on where I insert it.

However, given the choice between extremely small font sizes (which are bad design practice) or columns that wrap into a drop down, I'll take the dropdown.

[Alleyne Torres]

Thank you so much Madelene.

As someone who intentionally opens my browser too wide, this is extremely helpful.

[Robbie Dee]

Thanks Madelene I'll wait and see what happens next

Robbie

[Alleyne Torres]

Code: Select all

.w3-container {
    max-width: 1290px;
    margin: 0 auto;
}

.TabbedPanels {
    float: none;
    max-width: 1290px;
    margin: 30px auto 0;
}

table.dataTable td, table.supertable td {
    font-size: 14px;
    padding-left: 5px;
    padding-right: 5px;
    padding-top: 2px;
    padding-bottom: 0px;
}

.w3-tiny {
    font-size: 13px;
}

a:hover {
    color: #C21443;
}

.w3-dropdown-content a:hover {
    background-color: #666666;
}

.header a {
    color: #FFFFFF;
}

.w3-card-4, .formbig {
    background: #ffffff;
    box-shadow: 0 0 2px rgba(0,0,0,0.12),0 0 4px rgba(0,0,0,0.24);
    border-radius: 7px;
}

.w3-dropdown-hover .w3-card-4 {
    background: #5E0A21;
}

.w3-dropdown-content {
    display: block;
    visibility: hidden;
    transition-delay: 0.0s;
    transition-duration: 0.0s;
}

.w3-dropdown-hover:hover .w3-dropdown-content {
    visibility: visible;
}

body {
    background: #FAFAFA;
    font-size: 12px;
    font-family: verdana;
}

div.stallion-ad {
    background: #9D9A92;
    width: 200px;
    font-size: 10px;
}

.sim-color-alt {
    margin: 10 auto 10px;
    background: #9D9A92;
    padding-top: 5px;
    padding-right: 10px;
    padding-bottom: 5px;
    padding-left: 40px;
}

span.nowrap label {
    width: 85px;
}

h1.center {
    font-size: 16px;
}

tbody tr td {
    padding-left: 5px;
    padding-right: 0;
    padding-top: 0;
    padding-bottom: 0;
}

form.formbig {
    padding-top: 0;
    padding-bottom: 0;
    padding-left: 10pxpx;
    padding-right: 10px;
}

form.formbig h4 {
    font-size: 12px;
}

form.formbig textarea {
    height: 100px;
    font-weight: bold;
    font-size: 16px;
    font-color: #FF4040;
    padding-left: 5px;
}

div.w3-container {
    padding-top: 10px;
}

img.w3-margin-top {
    height: 200px;
}

html body footer {
    display: none;
}

div.w3-col.w3-center.w3-container.m3.s12 {
    height: 275px;
}

img.w3-round {
    height: 50px;
}

For posterity, this is how I fiddled with mine. It's a little rough around the edges but I reduced a lot of padding and returned my eye-caressing queen of fonts, Verdana. I increased the font size in the notes box to help catch my eye when it says something important, but couldn't figure out how to change the font color there.

[Alleyne Torres]

double post :/

[Madelene Gilbert]

Fiddled around a bit for my own sake, and shrunk down the footer (thanks for the idea Alleyne!). I won't include that in my first page code though.

Alleyne, you can change the font color in the notes section, but it would effect ALL of the textboxes across the site. And it's not possible to, say, have one line in red and the rest in grey. But if you want to just for the fun of it, you can try:

Code: Select all

textarea{
	color:#ff0000;
}

[Alleyne Torres]

Alleyne, you can change the font color in the notes section, but it would effect ALL of the textboxes across the site. And it's not possible to, say, have one line in red and the rest in grey. But if you want to just for the fun of it, you can try:

Code: Select all

textarea{
	color:#ff0000;
}

Thanks, I went with a dusty salmon color for the font, we'll see how it goes