table { border-style: none; border-spacing: 0 $default-padding; padding: 0; font-size: inherit; width: 100%; } .list td, .list th { padding: $default-padding 2*$default-padding; vertical-align: top; line-height: 18px; border-right: 1px solid $medium-gray; &.wrap-text { white-space: normal !important; } } .list td:first-child, .list th:first-child { border-left: 1px solid $medium-gray } th { white-space: nowrap; text-align: left; vertical-align: top; @include background(linear-gradient(top, lighten($light-gray, 10) 0%, $light-gray 30%, $light-gray 90%, darken($light-gray, 10) 100%)); border-top: 1px solid $medium-gray; color: #666; font-weight: normal; i { font-style: normal; position: absolute; right: 2px; top: 4px; color: #999; @include text-shadow(1px 1px 0px #fff); } a { @include text-shadow(1px 1px 0px #fff); &.sortable { display: block; margin: -4px -8px; padding: 4px 18px 4px 8px; } &.sorted { position: relative; @include background(linear-gradient(top, lighten($light-gray, 10) 0%, $very-light-blue 50%, $light-gray 90%, darken($light-gray, 10) 100%)); } } } tr.odd td { background-color: #eaf3f9; } tr.even td { background-color: white; } .list tr .tools { width: 40px; background: $light-gray; border-top: 0 none; border-right: 0 none; white-space: nowrap; @extend .disable-user-select; a { width: 19px; height: 19px; margin-right: 2px; } &.long { width: 60px; } } td.label, td.input, td.submit, td.select, td.value, td.note { padding: 2px 0; vertical-align: top; input[type="text"], input[type="email"], input[type="password"], textarea { width: 100%; } } td.select { .selectboxit-container { @include box-sizing(border-box); width: 100%; } .selectboxit { @include box-sizing(border-box); width: 100% !important; height: 100%; } } td.submit { text-align: right } td.input { .autocomplete_tag_list { width: 100% } } td.label { white-space: nowrap; width: 60px; padding: 9px 4*$default-padding 0 0; line-height: 21px; &.mandatory:after { content: '*'; } &.long { width: 140px; } &.middle { padding-left: 2*$default-padding; } &.very_long { width: 230px; } } td.checkbox { padding-top: 10px; padding-left: 0; white-space: nowrap; } td.value { padding-top: 4px; overflow: hidden; p { @include inline-block; width: 214px; text-align: left; margin: $default-form-field-margin; line-height: 25px; } &.long { p { width: 244px; } } } td.heading { padding: $default-padding 0; font-weight: bold; text-decoration: underline; } .list td.icon, .list th.icon { background-color: $light-gray; background-image: none; border: 0 none; padding: 0; border-right: 1px solid $medium-gray; text-align: center; display: table-cell; // reset the .icon display: inline-block } .list .tools .icon, .list td.icon .icon { @include inline-block; width: 16px; height: 16px; @extend .disable-user-select; background-repeat: no-repeat; margin: 0 $default-margin; } .list td.icon .icon { margin: $default-margin 2*$default-margin 0; } .list tr:hover td { background-color: $light_yellow; } td.file_type { width: 130px; } td.file_size { width: 80px; } td.date { width: 150px; } td, th { &.center, &.boolean { text-align: center; } &.right { text-align: right; } } td.login { width: 100px; } td.email { width: 270px; } td.role { width: 10%; } th.count, td.count { width: 120px; text-align: right; padding-right: 16px; } td.rights { width: 60px; } table.window_form { width: 100%; } .list .login_status { width: 16px; } td#user_roles { padding: 9px 0; label { @include inline-block; white-space: nowrap; min-width: 40%; } }