leaflet map - path not working
This commit is contained in:
Sander Roosendaal
38
static/suit/less/ui/actionlist.less
Normal file
38
static/suit/less/ui/actionlist.less
Normal file
@@ -0,0 +1,38 @@
|
||||
.actionlist {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
.border-radius(@border-radius);
|
||||
.grey-box-shadow;
|
||||
background: white;
|
||||
min-width: 200px;
|
||||
li {
|
||||
font-size: 11px;
|
||||
list-style: none;
|
||||
border-bottom: 1px solid lighten(@border-color-light, 3%);
|
||||
padding: 3px 10px;
|
||||
&:nth-child(2n) {
|
||||
background-color: @bgcolor-light;
|
||||
}
|
||||
&:first-child {
|
||||
padding-top: 5px;
|
||||
}
|
||||
&:last-child {
|
||||
padding-bottom: 5px;
|
||||
border: 0;
|
||||
.border-radius(null, null, @border-radius, @border-radius)
|
||||
}
|
||||
i {
|
||||
float: left;
|
||||
margin-right: 10px;
|
||||
}
|
||||
&.deletelink {
|
||||
.color-grey;
|
||||
}
|
||||
.deleted-entry {
|
||||
color: @text-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
.applist td:last-child {
|
||||
min-width: 40px;
|
||||
}
|
||||
70
static/suit/less/ui/box.less
Normal file
70
static/suit/less/ui/box.less
Normal file
@@ -0,0 +1,70 @@
|
||||
.box, .well {
|
||||
.grey-box-shadow;
|
||||
.border-radius(@border-radius);
|
||||
background: @bgcolor-light;
|
||||
padding: 10px 12px;
|
||||
border: 0;
|
||||
}
|
||||
.menu-box {
|
||||
margin: 0 0 10px 0;
|
||||
padding: 5px 0;
|
||||
background-color: white;
|
||||
li {
|
||||
list-style: none;
|
||||
line-height: 18px;
|
||||
a {
|
||||
text-decoration: none;
|
||||
line-height: 18px;
|
||||
display: block;
|
||||
padding: 5px 10px 5px 13px;
|
||||
color: #666;
|
||||
border-bottom: 1px solid #ededed;
|
||||
&:hover {
|
||||
background-color: @bgcolor-light;
|
||||
&:first-child {
|
||||
.border-radius(@border-radius, @border-radius, null, null)
|
||||
}
|
||||
&:last-child {
|
||||
.border-radius(null, null, @border-radius, @border-radius)
|
||||
}
|
||||
}
|
||||
i {
|
||||
margin-right: 7px;
|
||||
}
|
||||
}
|
||||
&.active a {
|
||||
.blue-gradient;
|
||||
color: #fff;
|
||||
}
|
||||
&:last-child a {
|
||||
border-bottom: 0;
|
||||
}
|
||||
}
|
||||
|
||||
&.menu-box-compact li a {
|
||||
padding-top: 2px;
|
||||
padding-bottom: 2px;
|
||||
}
|
||||
}
|
||||
|
||||
.save-box {
|
||||
text-align: center;
|
||||
margin-bottom: 20px;
|
||||
padding: 10px;
|
||||
.btn {
|
||||
width: (@right-column-width - 30px);
|
||||
margin-bottom: 10px;
|
||||
&:last-of-type {
|
||||
// margin-bottom: 20px;
|
||||
}
|
||||
&.btn-high {
|
||||
// margin-bottom: 20px;
|
||||
width: (@right-column-width - 30px);
|
||||
min-height: 40px;
|
||||
}
|
||||
}
|
||||
a.text-error:hover {
|
||||
color: white;
|
||||
background-color: @red;
|
||||
}
|
||||
}
|
||||
54
static/suit/less/ui/breadcrumb.less
Normal file
54
static/suit/less/ui/breadcrumb.less
Normal file
@@ -0,0 +1,54 @@
|
||||
/* Django admin original class - support for Admin original html structure */
|
||||
.breadcrumbs {
|
||||
font-size: 14px;
|
||||
padding: 8px 15px 8px 10px;
|
||||
margin: -5px 0 15px;
|
||||
background-color: #f5f5f5;
|
||||
.border-radius(4px);
|
||||
.white-shadow;
|
||||
color: #666;
|
||||
&>a {
|
||||
display: inline-block;
|
||||
padding: 0 3px;
|
||||
text-shadow: 0 1px 0 #ffffff;
|
||||
font-weight: normal;
|
||||
&>.divider {
|
||||
padding: 0 5px;
|
||||
color: #ccc;
|
||||
}
|
||||
&>.active {
|
||||
font-weight: bold;
|
||||
color: #666;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.breadcrumbs > a > .divider {
|
||||
}
|
||||
|
||||
.breadcrumbs > .active {
|
||||
color: #999999;
|
||||
}
|
||||
|
||||
/* NEW CLASS based on BS */
|
||||
.breadcrumb {
|
||||
margin: -5px 0 15px;
|
||||
font-size: 14px;
|
||||
.white-shadow;
|
||||
li {
|
||||
a {
|
||||
text-decoration: none;
|
||||
&:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
&.active, &.active a {
|
||||
font-weight: bold;
|
||||
color: #333;
|
||||
}
|
||||
}
|
||||
&.toplinks {
|
||||
font-size: 12px;
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
}
|
||||
172
static/suit/less/ui/calendar.less
Normal file
172
static/suit/less/ui/calendar.less
Normal file
@@ -0,0 +1,172 @@
|
||||
/* CALENDARS & CLOCKS */
|
||||
|
||||
.calendarbox, .clockbox {
|
||||
margin: 5px auto;
|
||||
font-size: 11px;
|
||||
width: 16em;
|
||||
text-align: center;
|
||||
background: white;
|
||||
position: relative;
|
||||
z-index: 100;
|
||||
.greyer-box-shadow;
|
||||
.border-radius(@border-radius);
|
||||
h2, caption {
|
||||
.border-radius(@border-radius, @border-radius, null, null);
|
||||
.vertical-gradient(#f3f3f3, #e5e5e5);
|
||||
.white-inset;
|
||||
.white-shadow;
|
||||
border-bottom: 1px solid #ddd;
|
||||
margin: 0;
|
||||
padding: 3px 15px;
|
||||
font-size: 12px;
|
||||
font-weight: bold;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
|
||||
.clockbox {
|
||||
width: auto;
|
||||
}
|
||||
|
||||
.calendar {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.calendar table {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
border-collapse: collapse;
|
||||
background: white;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.calendar th {
|
||||
font-size: 10px;
|
||||
color: #666;
|
||||
padding: 2px 3px;
|
||||
text-align: center;
|
||||
.vertical-gradient(#f3f3f3, #e5e5e5);
|
||||
border-bottom: 1px solid #ddd;
|
||||
.white-shadow;
|
||||
}
|
||||
|
||||
.calendar td {
|
||||
font-size: 11px;
|
||||
text-align: center;
|
||||
padding: 0;
|
||||
border-top: 1px solid #eee;
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
.calendar td.selected a {
|
||||
background: #C9DBED;
|
||||
}
|
||||
|
||||
.calendar td.nonday {
|
||||
background: #efefef;
|
||||
}
|
||||
|
||||
.calendar td.today a {
|
||||
background: #ffffaa;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.calendar td a, .timelist a {
|
||||
display: block;
|
||||
padding: 2px 4px;
|
||||
text-decoration: none;
|
||||
color: #444;
|
||||
}
|
||||
|
||||
.calendar td a:hover, .timelist a:hover {
|
||||
.vertical-gradient(#83b3c3, #5295b0);
|
||||
text-shadow: 0 1px #4f7f92;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.calendar td a:active, .timelist a:active {
|
||||
background: #5295b0;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.calendarnav {
|
||||
font-size: 10px;
|
||||
text-align: center;
|
||||
color: #ccc;
|
||||
margin: 0;
|
||||
padding: 1px 3px;
|
||||
}
|
||||
|
||||
.calendarnav a:link, #calendarnav a:visited, #calendarnav a:hover {
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.calendar-shortcuts {
|
||||
background: white;
|
||||
font-size: 11px;
|
||||
line-height: 11px;
|
||||
border-top: 1px solid #eee;
|
||||
padding: 3px 0 4px;
|
||||
color: #ccc;
|
||||
a {
|
||||
display: inline-block;
|
||||
padding: 2px 0;
|
||||
}
|
||||
}
|
||||
|
||||
.calendarbox .calendarnav-previous, .calendarbox .calendarnav-next {
|
||||
display: block;
|
||||
position: absolute;
|
||||
font-weight: bold;
|
||||
font-size: 14px;
|
||||
text-decoration: none;
|
||||
padding: 3px 8px 4px;
|
||||
.vertical-gradient(#83b3c3, #5295b0);
|
||||
text-shadow: 0 1px #4f7f92;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.calendarnav-previous:hover, .calendarnav-next:hover {
|
||||
background: #5295b0;
|
||||
}
|
||||
|
||||
.calendarnav-previous {
|
||||
top: 0;
|
||||
left: 0;
|
||||
.border-radius(@border-radius, 0, 0, 0);
|
||||
}
|
||||
|
||||
.calendarnav-next {
|
||||
top: 0;
|
||||
right: 0;
|
||||
.border-radius(0, @border-radius, 0, 0);
|
||||
}
|
||||
|
||||
.calendar-cancel {
|
||||
margin: 0 !important;
|
||||
padding: 2px 0 !important;
|
||||
font-size: 11px;
|
||||
.vertical-gradient(#efefef, #e2e2e2);
|
||||
.white-shadow;
|
||||
border-top: 1px solid #ddd;
|
||||
}
|
||||
|
||||
.calendar-cancel:hover {
|
||||
// background: #e1e1e1 url(../img/nav-bg-reverse.gif) 0 50% repeat-x;
|
||||
}
|
||||
|
||||
.calendar-cancel a {
|
||||
color: black;
|
||||
display: block;
|
||||
}
|
||||
|
||||
ul.timelist, .timelist li {
|
||||
list-style-type: none;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.timelist a {
|
||||
padding: 2px;
|
||||
}
|
||||
17
static/suit/less/ui/datepicker.less
Normal file
17
static/suit/less/ui/datepicker.less
Normal file
@@ -0,0 +1,17 @@
|
||||
.datepicker {
|
||||
div & {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
th, td {
|
||||
height: 16px !important;
|
||||
}
|
||||
input.input-small {
|
||||
width: 70px;
|
||||
}
|
||||
}
|
||||
.input-append.date .add-on i, .input-prepend.date .add-on i {
|
||||
width: 14px !important;
|
||||
height: 14px !important;
|
||||
display: inline-block !important;
|
||||
}
|
||||
704
static/suit/less/ui/form.less
Normal file
704
static/suit/less/ui/form.less
Normal file
@@ -0,0 +1,704 @@
|
||||
h2.legend, .form-horizontal fieldset .legend {
|
||||
font-weight: bold;
|
||||
font-size: 16px;
|
||||
line-height: 36px;
|
||||
.white-shadow;
|
||||
padding-left: 10px;
|
||||
}
|
||||
.form-horizontal {
|
||||
fieldset {
|
||||
display: table;
|
||||
width: 100%;
|
||||
margin-top: 35px;
|
||||
position: relative;
|
||||
.grey-box-shadow;
|
||||
.border-radius(@border-radius); // margin-bottom: 35px;
|
||||
&.first, .popup &:first-of-type {
|
||||
margin-top: 0;
|
||||
}
|
||||
&.first:not(:first-of-type) {
|
||||
margin-top: 5px;
|
||||
}
|
||||
.legend {
|
||||
border: 0;
|
||||
margin: -30px 0 0 0;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
width: 98%;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
margin-right: (@right-column-width + (@padding * 2));
|
||||
.description {
|
||||
font-weight: normal;
|
||||
font-size: 12px;
|
||||
display: inline-block;
|
||||
margin-left: 20px;
|
||||
.color-grey;
|
||||
}
|
||||
}
|
||||
|
||||
/* BS collapse override */
|
||||
&.collapse {
|
||||
overflow: visible;
|
||||
height: auto;
|
||||
}
|
||||
/* Position attr change for collapsed */
|
||||
&.collapsed {
|
||||
background-color: @bgcolor-light;
|
||||
.legend {
|
||||
position: static;
|
||||
font-size: 13px;
|
||||
font-weight: normal;
|
||||
}
|
||||
}
|
||||
&.full-width {
|
||||
box-shadow: none;
|
||||
.control-group {
|
||||
.border-radius(0);
|
||||
width: 100%;
|
||||
display: block;
|
||||
> div {
|
||||
display: block;
|
||||
}
|
||||
.control-label {
|
||||
display: none;
|
||||
width: 0;
|
||||
}
|
||||
.controls {
|
||||
display: block;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
border: 0;
|
||||
width: 100%;
|
||||
.border-radius(@border-radius);
|
||||
.html-widget {
|
||||
display: inline-block;
|
||||
margin: 10px;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
&.wide .control-label {
|
||||
min-width: 200px;
|
||||
}
|
||||
|
||||
/* COLLAPSE LOGIC */
|
||||
&.collapsed * {
|
||||
display: none;
|
||||
}
|
||||
&.collapsed .legend, &.collapsed .legend *, &.collapsed {
|
||||
display: block !important;
|
||||
}
|
||||
&.collapsed .collapse-toggle {
|
||||
background: transparent;
|
||||
display: inline !important;
|
||||
}
|
||||
}
|
||||
.submit-row-bottom {
|
||||
margin: 20px 0 0 200px;
|
||||
}
|
||||
.control-group {
|
||||
display: table-header-group;
|
||||
margin: 0;
|
||||
> div {
|
||||
display: table-row;
|
||||
width: 100%;
|
||||
}
|
||||
.control-label {
|
||||
background: white;
|
||||
display: table-cell;
|
||||
min-width: 150px;
|
||||
float: none;
|
||||
padding: 10px 20px 5px 10px;
|
||||
border-bottom: 1px solid @border-color-light;
|
||||
width: auto;
|
||||
label {
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
}
|
||||
.controls {
|
||||
display: table-cell;
|
||||
vertical-align: top;
|
||||
float: none;
|
||||
background-color: @bgcolor-light;
|
||||
border-left: 1px solid #ecedee;
|
||||
padding: 5px 15px;
|
||||
width: 100%;
|
||||
line-height: 26px;
|
||||
p {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
.readonly {
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
margin-right: 5px;
|
||||
}
|
||||
}
|
||||
|
||||
&:first-child, &:first-of-type {
|
||||
.control-label {
|
||||
padding-top: 15px;
|
||||
.border-radius(@border-radius, null, null, null);
|
||||
}
|
||||
.controls {
|
||||
padding-top: 10px;
|
||||
.border-radius(null, @border-radius, null, null);
|
||||
}
|
||||
}
|
||||
&:last-child, &:last-of-type {
|
||||
.control-label {
|
||||
padding-bottom: 10px;
|
||||
border: 0;
|
||||
.border-radius(null, null, null, @border-radius);
|
||||
}
|
||||
.controls {
|
||||
padding-bottom: 10px;
|
||||
.border-radius(null, null, @border-radius, null);
|
||||
}
|
||||
}
|
||||
|
||||
/* Some BS form global overrides */
|
||||
.help-block, .help-inline {
|
||||
font-size: 11px;
|
||||
color: #999;
|
||||
line-height: normal;
|
||||
}
|
||||
|
||||
.help-inline ul, .radiolist {
|
||||
margin: 0;
|
||||
li {
|
||||
list-style: none;
|
||||
padding: 0 10px 0 0;
|
||||
}
|
||||
}
|
||||
.help-icon {
|
||||
margin: 1px 0 0 5px;
|
||||
}
|
||||
|
||||
/* Inline forms fields */
|
||||
.field-box .controls {
|
||||
label {
|
||||
float: left;
|
||||
display: inline-block;
|
||||
margin: 5px 10px 0 0;
|
||||
&.required {
|
||||
margin-right: 15px;
|
||||
}
|
||||
}
|
||||
.multi-field-box {
|
||||
margin-top: 5px;
|
||||
float: left;
|
||||
margin-right: 15px;
|
||||
.multi-field-controls {
|
||||
float: left;
|
||||
}
|
||||
.help-block {
|
||||
display: block;
|
||||
margin: 3px 0 0 5px;
|
||||
}
|
||||
}
|
||||
.error {
|
||||
.control-label, .help-block, .help-inline, .help-inline ul li, &.multi-field-box label {
|
||||
color: @red;
|
||||
}
|
||||
input, select, textarea {
|
||||
border-color: @red;
|
||||
color: @red;
|
||||
}
|
||||
}
|
||||
&:not(:first-child) {
|
||||
.control-label {
|
||||
width: auto;
|
||||
margin-left: 10px;
|
||||
}
|
||||
.controls {
|
||||
float: left;
|
||||
margin-left: 10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
&.first-error .control-label {
|
||||
color: @red;
|
||||
}
|
||||
&.multi-field-row {
|
||||
.controls {
|
||||
padding-top: 0px;
|
||||
}
|
||||
&:first-child, &:first-of-type {
|
||||
.controls {
|
||||
padding-top: 5px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.popup {
|
||||
.form-horizontal {
|
||||
}
|
||||
.one-column {
|
||||
padding-top: 10px;
|
||||
}
|
||||
}
|
||||
.control-group, .inline-group {
|
||||
// Django < 1.8
|
||||
.add-another {
|
||||
text-decoration: none;
|
||||
display: inline-block;
|
||||
padding: 0 0 0 8px;
|
||||
}
|
||||
// Django 1.8+
|
||||
.related-widget-wrapper-link.change-related {
|
||||
&, &:hover {
|
||||
opacity: .2;
|
||||
}
|
||||
&:link {
|
||||
opacity: .6;
|
||||
&:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
.add-related, .related-lookup, .change-related {
|
||||
.bs-icon;
|
||||
display: inline-block;
|
||||
padding: 4px;
|
||||
border: 1px solid transparent;
|
||||
padding-left: 6px;
|
||||
vertical-align: middle;
|
||||
img {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
.add-related {
|
||||
background-position: 1px -92px;
|
||||
}
|
||||
.related-lookup {
|
||||
background-position: -42px 4px;
|
||||
}
|
||||
.change-related {
|
||||
background-position: 7px -68px;
|
||||
}
|
||||
.vForeignKeyRawIdAdminField {
|
||||
width: 90px;
|
||||
}
|
||||
}
|
||||
.alert {
|
||||
> ul {
|
||||
margin-top: 10px;
|
||||
ul {
|
||||
margin-top: 5px;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
}
|
||||
}
|
||||
/* Stacked & Tabular */
|
||||
.empty-form, tr.empty-form {
|
||||
display: none;
|
||||
}
|
||||
h3 {
|
||||
font-weight: bold;
|
||||
font-size: 16px;
|
||||
line-height: 36px;
|
||||
.white-shadow;
|
||||
padding-left: 10px;
|
||||
margin: 0;
|
||||
}
|
||||
/* STACKED */
|
||||
.form-horizontal {
|
||||
.inline-group {
|
||||
& > h2 {
|
||||
margin-top: 11px;
|
||||
}
|
||||
fieldset:first-of-type {
|
||||
margin: 0px;
|
||||
}
|
||||
.inline-related {
|
||||
z-index: 2;
|
||||
position: relative;
|
||||
border-bottom: 1px solid #eee;
|
||||
}
|
||||
.add-row {
|
||||
z-index: 1;
|
||||
position: relative;
|
||||
padding: 6px 0 4px 15px;
|
||||
margin: -1px -1px 0 -1px;
|
||||
.white-inset;
|
||||
.vertical-gradient(#efefef, #e2e2e2);
|
||||
.border-radius(0, 0, @border-radius, @border-radius);
|
||||
border: 1px solid #ddd;
|
||||
a {
|
||||
.white-shadow;
|
||||
}
|
||||
}
|
||||
}
|
||||
.inline-related {
|
||||
fieldset {
|
||||
.border-radius(0, 0, null, null);
|
||||
margin: 40px 0 0 0; // Remove rounded corners for first fieldset
|
||||
// First inline fieldset will always have grey header row
|
||||
&:first-of-type {
|
||||
.control-group {
|
||||
&:first-child, &:first-of-type {
|
||||
.border-radius(0);
|
||||
.control-label {
|
||||
.border-radius(0, null, null, null);
|
||||
}
|
||||
.controls {
|
||||
.border-radius(null, 0, null, null);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
&.first {
|
||||
margin-top: 0;
|
||||
}
|
||||
}
|
||||
h3 {
|
||||
font-size: 12px;
|
||||
overflow: auto;
|
||||
.grey-box-shadow;
|
||||
line-height: 34px;
|
||||
.vertical-gradient(#f3f3f3, #e5e5e5);
|
||||
.border-radius(@border-radius, @border-radius, 0, 0);
|
||||
b {
|
||||
display: inline-block;
|
||||
min-width: 180px;
|
||||
margin-right: 10px;
|
||||
}
|
||||
span {
|
||||
display: inline-block; // margin-left: 20px;
|
||||
&.delete, &:last-child {
|
||||
float: right;
|
||||
margin-right: 10px;
|
||||
font-weight: normal;
|
||||
}
|
||||
&.delete {
|
||||
input {
|
||||
margin: 0;
|
||||
}
|
||||
label {
|
||||
padding: 7px 0 0 5px;
|
||||
vertical-align: middle;
|
||||
margin: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
&:not(:first-of-type) {
|
||||
h3 {
|
||||
margin-top: 5px;
|
||||
}
|
||||
}
|
||||
&.tabular {
|
||||
margin-top: 15px;
|
||||
fieldset {
|
||||
.box-shadow(none);
|
||||
& > h2 {
|
||||
margin-top: -4px;
|
||||
}
|
||||
}
|
||||
table {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
table td .errorlist {
|
||||
margin-bottom: 5px;
|
||||
font-size: 11px;
|
||||
}
|
||||
table td.control-group {
|
||||
display: table-cell;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.form-horizontal .control-group .controls .selector {
|
||||
overflow: auto;
|
||||
.selector-available, .selector-chooser, .selector-chosen {
|
||||
float: left;
|
||||
h2 {
|
||||
margin-left: 5px;
|
||||
font-size: 12px;
|
||||
}
|
||||
> a {
|
||||
margin-left: 5px;
|
||||
}
|
||||
}
|
||||
&.stacked {
|
||||
// Filter vertical
|
||||
.selector-available, .selector-chosen {
|
||||
width: 100%;
|
||||
min-width: 150px;
|
||||
max-width: 100%;
|
||||
select, input {
|
||||
width: 100%;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
}
|
||||
.selector-available, .selector-chosen {
|
||||
width: 45%;
|
||||
min-width: 150px;
|
||||
max-width: 300px;
|
||||
select, input {
|
||||
width: 100%;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
.selector-chooser {
|
||||
list-style: none;
|
||||
margin: 70px 10px 0 10px;
|
||||
li {
|
||||
a {
|
||||
.bs-icon;
|
||||
display: block;
|
||||
padding: 4px;
|
||||
border: 1px solid transparent;
|
||||
background-position: -236px -92px;
|
||||
&:hover {
|
||||
background-color: white;
|
||||
.border-radius(@border-radius);
|
||||
border: 1px solid #ddd;
|
||||
}
|
||||
}
|
||||
&:first-child {
|
||||
a {
|
||||
background-position: -260px -92px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
&.stacked {
|
||||
// Filter vertical
|
||||
.selector-chooser {
|
||||
list-style: none;
|
||||
margin: 5px 0 0 0;
|
||||
width: 100%;
|
||||
li {
|
||||
display: inline-block;
|
||||
a {
|
||||
background-position: -284px -92px;
|
||||
}
|
||||
&:first-child {
|
||||
a {
|
||||
background-position: -308px -92px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.selector-available, .selector-chosen {
|
||||
a:not(.active) {
|
||||
.color-grey;
|
||||
text-decoration: none;
|
||||
}
|
||||
}
|
||||
.selector-available select {
|
||||
.border-radius(0, 0, null, null);
|
||||
}
|
||||
.selector-filter {
|
||||
margin-right: 14px;
|
||||
position: relative;
|
||||
margin-bottom: -1px;
|
||||
input {
|
||||
.border-radius(null, null, 0, 0);
|
||||
}
|
||||
label {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 4px;
|
||||
margin-right: -10px;
|
||||
opacity: .2;
|
||||
}
|
||||
}
|
||||
}
|
||||
.controls {
|
||||
/* Special styles for django auth app */
|
||||
#id_groups_from { min-height: 80px }
|
||||
#id_user_permissions_from { min-height: 184px }
|
||||
|
||||
/* File upload styles */
|
||||
.file-upload {
|
||||
.clearable-file-input {
|
||||
display: inline-block;
|
||||
margin: 0 0 0 30px;
|
||||
input {
|
||||
margin: 5px 7px 0 0;
|
||||
vertical-align: middle;
|
||||
float: left;
|
||||
}
|
||||
label {
|
||||
font-size: 11px;
|
||||
margin-top: 2px;
|
||||
vertical-align: middle;
|
||||
display: inline-block;
|
||||
color: @grey;
|
||||
&:hover {
|
||||
color: @red;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
/* SELECT2 OVERRIDE */
|
||||
.select2-container-multi .select2-choices {
|
||||
.border-radius(4px);
|
||||
}
|
||||
/* Set close on right size */
|
||||
.select2-container-multi .select2-choices .select2-search-choice {
|
||||
padding: 3px 20px 3px 5px !important;
|
||||
line-height: normal;
|
||||
}
|
||||
.select2-container-multi .select2-search-choice-close {
|
||||
top: 3px;
|
||||
left: auto !important;
|
||||
}
|
||||
.select2-search-choice .s2-size {
|
||||
float: right;
|
||||
}
|
||||
.select2-search-choice .s2-size em {
|
||||
font-style: normal;
|
||||
color: grey;
|
||||
font-size: 9px;
|
||||
text-shadow: 0 1px 0 #fff;
|
||||
}
|
||||
.datetimeshortcuts {
|
||||
font-size: 11px;
|
||||
margin-left: 5px;
|
||||
vertical-align: middle;
|
||||
color: transparent;
|
||||
a:first-child {
|
||||
margin-right: 4px;
|
||||
}
|
||||
a:last-child {
|
||||
margin-left: -6px;
|
||||
margin-right: 10px;
|
||||
}
|
||||
}
|
||||
// Original date widgets for Django 1.9+
|
||||
.datetime > div:not(.input-append) .datetimeshortcuts,
|
||||
.controls > .datetimeshortcuts,
|
||||
.controls > .datetime > .datetimeshortcuts {
|
||||
.date-icon, .clock-icon {
|
||||
.bs-icon;
|
||||
background-color: @bgcolor-light;
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
}
|
||||
.date-icon {
|
||||
background-position: -192px -120px;
|
||||
}
|
||||
.clock-icon {
|
||||
.bs-icon;
|
||||
background-position: -48px -24px;
|
||||
}
|
||||
}
|
||||
/* Fix original date/time fields */
|
||||
.vDateField, .vTimeField {
|
||||
width: auto;
|
||||
vertical-align: top;
|
||||
}
|
||||
/* DATETIME IMPROVEMENTS */
|
||||
@date-input-width: 80px;
|
||||
@time-input-width: 60px;
|
||||
@date-icon-offset: 20px;
|
||||
@date-input-offset: 14px;
|
||||
.suit-date {
|
||||
position: relative;
|
||||
.datetimeshortcuts {
|
||||
margin-left: 32px;
|
||||
color: #f6f7f8;
|
||||
a:last-child {
|
||||
padding: 0 5px;
|
||||
position: absolute;
|
||||
left: (@date-input-width + @date-icon-offset);
|
||||
z-index: 2;
|
||||
img {
|
||||
visibility: hidden;
|
||||
}
|
||||
}
|
||||
|
||||
// Original date widgets for Django 1.9+
|
||||
.date-icon, .clock-icon {
|
||||
display: inline-block;
|
||||
width: 26px;
|
||||
height: 26px;
|
||||
margin: 1px 0 0 -5px;
|
||||
}
|
||||
}
|
||||
input {
|
||||
vertical-align: middle;
|
||||
&.vDateField {
|
||||
width: @date-input-width;
|
||||
}
|
||||
&.vTimeField {
|
||||
width: @time-input-width;
|
||||
}
|
||||
}
|
||||
.add-on {
|
||||
position: absolute;
|
||||
left: (@date-input-width + @date-input-offset);
|
||||
}
|
||||
|
||||
&.suit-time {
|
||||
.add-on {
|
||||
left: (@time-input-width + @date-input-offset);
|
||||
}
|
||||
.datetimeshortcuts {
|
||||
a:last-child {
|
||||
position: absolute;
|
||||
left: (@time-input-width + @date-icon-offset);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.autosize {
|
||||
max-height: 150px;
|
||||
}
|
||||
.legend, h2 {
|
||||
.description {
|
||||
font-weight: normal;
|
||||
font-size: 12px;
|
||||
display: inline-block;
|
||||
margin-left: 20px;
|
||||
line-height: normal;
|
||||
.color-grey;
|
||||
}
|
||||
}
|
||||
/* Legend/H2 for suit_form_includes */
|
||||
.form-horizontal .suit-tab {
|
||||
visibility: hidden;
|
||||
&.show {
|
||||
visibility: inherit;
|
||||
}
|
||||
&.collapsed.hide {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
.suit-tab, .form-horizontal .suit-include {
|
||||
> h2 {
|
||||
margin-top: -10px;
|
||||
margin-bottom: -6px;
|
||||
line-height: 36px;
|
||||
padding: 0;
|
||||
}
|
||||
}
|
||||
.linked-select-link {
|
||||
font-size: 11px;
|
||||
margin-right: 5px;
|
||||
}
|
||||
/* StackedInline sortables */
|
||||
.stacked-inline-sortable {
|
||||
float: right;
|
||||
:first-child {
|
||||
padding-right: 1px;
|
||||
}
|
||||
&:nth-last-child(2) {
|
||||
margin-right: 10px;
|
||||
}
|
||||
}
|
||||
.inline-group > div:first-of-type .stacked-inline-sortable .sortable-up,
|
||||
.inline-group > div:nth-last-child(3) .stacked-inline-sortable .sortable-down {
|
||||
opacity: .15 !important;
|
||||
cursor: default;
|
||||
}
|
||||
140
static/suit/less/ui/left-nav.less
Normal file
140
static/suit/less/ui/left-nav.less
Normal file
@@ -0,0 +1,140 @@
|
||||
.left-nav {
|
||||
margin-top: 10px;
|
||||
&>ul {
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
padding: 5px 0;
|
||||
&>li {
|
||||
&>a {
|
||||
border-bottom: 1px solid #ededed;
|
||||
display: block;
|
||||
padding: 5px 10px 5px 13px;
|
||||
color: #666;
|
||||
text-decoration: none;
|
||||
position: relative;
|
||||
i {
|
||||
margin-right: 10px;
|
||||
opacity: .8;
|
||||
}
|
||||
em {
|
||||
float: right;
|
||||
font-style: normal;
|
||||
font-size: 11px;
|
||||
margin: 0;
|
||||
position: absolute;
|
||||
right: 10px;
|
||||
}
|
||||
}
|
||||
&:last-child > a {
|
||||
border: 0;
|
||||
}
|
||||
&.active {
|
||||
&>a {
|
||||
color: #fff;
|
||||
text-shadow: 0 1px #4f7f92;
|
||||
.vertical-gradient(#83b3c3, #5295b0);
|
||||
border-bottom-color: #ccc;
|
||||
i {
|
||||
background-image: url(../img/glyphicons-halflings-white-shadow.png);
|
||||
opacity: 1;
|
||||
}
|
||||
&:after {
|
||||
content: url('../img/cc_active_nav.png');
|
||||
display: inline-block;
|
||||
margin-right: -21px;
|
||||
float: right;
|
||||
margin-top: -5px;
|
||||
}
|
||||
}
|
||||
ul {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
&.separator, &.separator:hover {
|
||||
background: #f0f0f0 !important;
|
||||
height: 7px;
|
||||
display: block;
|
||||
}
|
||||
ul {
|
||||
display: none;
|
||||
border-bottom: 1px solid #ededed;
|
||||
background-color: #f6f7f8;
|
||||
margin: -1px 0 0 0;
|
||||
padding: 7px 0 7px 0;
|
||||
.box-shadow(inset 0px 3px 3px -2px rgba(0, 0, 0, 0.2));
|
||||
list-style: none;
|
||||
li {
|
||||
a {
|
||||
display: block;
|
||||
padding: 3px 0 4px 27px;
|
||||
text-decoration: none;
|
||||
&:hover {
|
||||
background-color: #f1f1f1;
|
||||
.white-shadow-max;
|
||||
}
|
||||
&.add { // margin-bottom: 5px;
|
||||
padding: 4px 0 4px 13px;
|
||||
i {
|
||||
margin-right: 5px;
|
||||
opacity: .7;
|
||||
}
|
||||
}
|
||||
i {
|
||||
margin-left: -20px;
|
||||
margin-right: 5px;
|
||||
opacity: .7;
|
||||
}
|
||||
}
|
||||
|
||||
&.active a { // background-color: white;
|
||||
color: #333;
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
}
|
||||
&:not(.active):hover {
|
||||
background: #f5f5f5;
|
||||
>ul {
|
||||
display: block;
|
||||
position: absolute;
|
||||
left: 180px;
|
||||
padding: 0;
|
||||
margin-top: -30px;
|
||||
margin-right: -250px; // offset out of left column
|
||||
.border-radius(@border-radius);
|
||||
.box-shadow(none);
|
||||
.greyer-box-shadow;
|
||||
z-index: 10;
|
||||
> li {
|
||||
border-bottom: 1px solid #e5e5e5;
|
||||
border-top: 1px solid white;
|
||||
background-color: transparent;
|
||||
a {
|
||||
padding: 3px 25px 3px 15px;
|
||||
&:hover { // background-color: transparent;
|
||||
}
|
||||
}
|
||||
&:hover {
|
||||
border-bottom: 1px solid #f1f1f1;
|
||||
border-top: 1px solid #f1f1f1;
|
||||
}
|
||||
&:first-child {
|
||||
border-top: 0;
|
||||
a {
|
||||
.border-radius(@border-radius, @border-radius, null, null);
|
||||
padding-top: 4px;
|
||||
}
|
||||
}
|
||||
&:last-child {
|
||||
border-bottom: 0;
|
||||
a {
|
||||
.border-radius(null, null, @border-radius, @border-radius);
|
||||
padding-bottom: 4px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
66
static/suit/less/ui/list.less
Normal file
66
static/suit/less/ui/list.less
Normal file
@@ -0,0 +1,66 @@
|
||||
.object-tools {
|
||||
float: right;
|
||||
margin-bottom: 10px;
|
||||
.btn {
|
||||
margin-left: 5px;
|
||||
}
|
||||
}
|
||||
|
||||
.actions {
|
||||
margin-bottom: 5px;
|
||||
label {
|
||||
display: inline;
|
||||
}
|
||||
}
|
||||
.below-actions .changelist-save {
|
||||
margin-top: -43px;
|
||||
}
|
||||
|
||||
/* CHANGELISTS */
|
||||
|
||||
.change-list .hiddenfields {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* ACTIONS */
|
||||
|
||||
#changelist .actions span.all,
|
||||
#changelist .actions span.action-counter,
|
||||
#changelist .actions span.clear,
|
||||
#changelist .actions span.question {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#changelist #action-toggle {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* Decided to hide action label */
|
||||
#changelist .actions span.action-label {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#toolbar form {
|
||||
margin: 0 0 15px 0;
|
||||
}
|
||||
|
||||
/* Search multi-line wrap top margin */
|
||||
.search-container {
|
||||
margin-top: -5px;
|
||||
input, select {
|
||||
margin-top: 5px;
|
||||
}
|
||||
input[type="radio"], input[type="checkbox"] {
|
||||
margin-top: 3px;
|
||||
}
|
||||
.result-count {
|
||||
display: inline-block;
|
||||
margin: 5px 0 0 5px;
|
||||
white-space: nowrap;
|
||||
vertical-align: middle;
|
||||
}
|
||||
.active {
|
||||
border-color: orange;
|
||||
box-shadow: 0 0 1px 0px orange;
|
||||
}
|
||||
}
|
||||
52
static/suit/less/ui/login.less
Normal file
52
static/suit/less/ui/login.less
Normal file
@@ -0,0 +1,52 @@
|
||||
.login {
|
||||
#wrap {
|
||||
background: none;
|
||||
}
|
||||
#content-main {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
.grey-box-shadow;
|
||||
border-radius: @border-radius;
|
||||
background: white;
|
||||
padding: 0;
|
||||
|
||||
/* Position hor/ver center */
|
||||
position: absolute;
|
||||
width: 340px;
|
||||
// height: 230px;
|
||||
left: 50%;
|
||||
top: 35%;
|
||||
margin-left: -170px; /* Half the width of the DIV tag */
|
||||
margin-top: -100px; /* Half the height of the DIV tag */
|
||||
h1 {
|
||||
font-size: 14px;
|
||||
font-weight: normal;
|
||||
.blue-gradient;
|
||||
color: #fff;
|
||||
text-shadow: 0 1px #4f7f92;
|
||||
padding: 0 15px;
|
||||
margin: 0;
|
||||
.border-radius(@border-radius, @border-radius, null, null);
|
||||
i {
|
||||
margin-right: 5px;
|
||||
}
|
||||
}
|
||||
form {
|
||||
margin: 15px 15px 0;
|
||||
input[type=text], input[type=password] {
|
||||
width: 90%;
|
||||
}
|
||||
}
|
||||
.submit-row {
|
||||
background: @bgcolor-light;
|
||||
margin: 10px -15px 0;
|
||||
padding: 10px 15px;
|
||||
border-top: 1px solid #eee;
|
||||
.white-inset;
|
||||
.border-radius(null, null, @border-radius, @border-radius);
|
||||
}
|
||||
.control-group {
|
||||
border: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
38
static/suit/less/ui/pagination.less
Normal file
38
static/suit/less/ui/pagination.less
Normal file
@@ -0,0 +1,38 @@
|
||||
.pagination-block {
|
||||
margin: 15px 0 15px 0;
|
||||
overflow: hidden;
|
||||
}
|
||||
.pagination {
|
||||
padding: 0;
|
||||
margin: 0 20px 0 0;
|
||||
float: left;
|
||||
ul {
|
||||
margin: 0;
|
||||
}
|
||||
ul li.active a, ul li.active span {
|
||||
color: #fff;
|
||||
font-weight: bold;
|
||||
text-align: center;
|
||||
text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
|
||||
vertical-align: middle;
|
||||
border: 1px solid #cccccc;
|
||||
-webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05); // -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
|
||||
// box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
|
||||
|
||||
.vertical-gradient(#5bc0de, #2f96b4);
|
||||
border-color: #2f96b4 #2f96b4 #1f6377;
|
||||
border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
|
||||
filter: progid:dximagetransform.microsoft.gradient(enabled = false);
|
||||
|
||||
}
|
||||
ul li a, ul li span {
|
||||
line-height: 26px;
|
||||
padding: 0 10px;
|
||||
}
|
||||
}
|
||||
|
||||
.pagination-info {
|
||||
display: block;
|
||||
float: left;
|
||||
margin: 5px 0 0 0;
|
||||
}
|
||||
341
static/suit/less/ui/table.less
Normal file
341
static/suit/less/ui/table.less
Normal file
@@ -0,0 +1,341 @@
|
||||
.table-overview {
|
||||
border-spacing: 0;
|
||||
margin-bottom: 18px;
|
||||
border-radius: @border-radius;
|
||||
background: #fff;
|
||||
width: auto;
|
||||
.grey-box-shadow;
|
||||
td, th {
|
||||
padding: 8px 20px 8px 15px;
|
||||
font-weight: normal;
|
||||
font-size: 12px;
|
||||
}
|
||||
th:first-child {
|
||||
min-width: 145px;
|
||||
}
|
||||
th {
|
||||
text-align: right;
|
||||
border-right: 1px solid #EDEDED;
|
||||
border-bottom: 1px solid #EDEDED;
|
||||
vertical-align: top;
|
||||
}
|
||||
td {
|
||||
background-color: #F6F7F8;
|
||||
border-bottom: 1px solid #f1f1f1;
|
||||
}
|
||||
tr:last-child {
|
||||
td, th {
|
||||
border-bottom: 0;
|
||||
}
|
||||
}
|
||||
tr:first-child td {
|
||||
border-top-right-radius: @border-radius;
|
||||
}
|
||||
tr:last-child td {
|
||||
border-bottom-right-radius: @border-radius;
|
||||
}
|
||||
tr:first-child th, tr:first-child td {
|
||||
padding-top: 10px;
|
||||
}
|
||||
tr:last-child th, tr:last-child td {
|
||||
padding-bottom: 10px;
|
||||
}
|
||||
caption {
|
||||
text-align: left;
|
||||
margin-bottom: 3px;
|
||||
a {
|
||||
.italic-title;
|
||||
text-decoration: none;
|
||||
}
|
||||
}
|
||||
tr.header-row {
|
||||
&:first-child th {
|
||||
border-top-left-radius: @border-radius;
|
||||
border-top-right-radius: @border-radius;
|
||||
border-top: 0;
|
||||
}
|
||||
th {
|
||||
text-align: center;
|
||||
font-weight: bold;
|
||||
.grey-gradient;
|
||||
box-shadow: inset 1px 1px 0 rgba(255, 255, 255, .3);
|
||||
border-bottom: 1px solid #ddd;
|
||||
border-top: 1px solid #ddd;
|
||||
.white-shadow;
|
||||
padding: 5px 10px;
|
||||
color: @text-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.table {
|
||||
th, td {
|
||||
background-color: white;
|
||||
.white-inset;
|
||||
.white-shadow;
|
||||
input {
|
||||
margin: 0;
|
||||
}
|
||||
a {
|
||||
text-decoration: none;
|
||||
&:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
p {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
tr:not(:first-child) {
|
||||
th, td {
|
||||
border-top: 1px solid #eee;
|
||||
}
|
||||
}
|
||||
thead {
|
||||
line-height: 18px;
|
||||
th, td {
|
||||
padding: 0;
|
||||
padding: 7px 10px 8px;
|
||||
font-weight: bold;
|
||||
.vertical-gradient(#f3f3f3, #e5e5e5);
|
||||
box-shadow: inset 1px 1px 0 rgba(255, 255, 255, .3);
|
||||
div {
|
||||
margin: 0;
|
||||
}
|
||||
.text {
|
||||
&>a, &>span {
|
||||
padding: 8px 10px;
|
||||
margin: -6px -10px;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
}
|
||||
th {
|
||||
vertical-align: middle;
|
||||
line-height: normal;
|
||||
.relative-wrapper {
|
||||
position: relative;
|
||||
display: inline;
|
||||
float: right;
|
||||
width: 55px;
|
||||
}
|
||||
.sortoptions {
|
||||
margin-top: 2px;
|
||||
right: -55px;
|
||||
position: absolute;
|
||||
a, span {
|
||||
display: inline-block;
|
||||
float: left;
|
||||
padding: 0 3px;
|
||||
}
|
||||
.sortpriority {
|
||||
color: #777;
|
||||
padding-right: 4px;
|
||||
}
|
||||
.sortremove, .toggle {
|
||||
display: block;
|
||||
width: 12px;
|
||||
height: 12px;
|
||||
opacity: .4;
|
||||
background-image: url("../bootstrap/img/glyphicons-halflings.png");
|
||||
background-position: -309px 0;
|
||||
&:hover {
|
||||
opacity: 0.8;
|
||||
}
|
||||
}
|
||||
.sortremove {
|
||||
margin-right: 4px;
|
||||
}
|
||||
.toggle {
|
||||
&.ascending {
|
||||
background-position: -310px -119px;
|
||||
}
|
||||
&.descending {
|
||||
background-position: -285px -120px;
|
||||
}
|
||||
}
|
||||
}
|
||||
&.sorted {
|
||||
padding-right: 55px;
|
||||
.vertical-gradient(#e7e7e7, #ddd);
|
||||
}
|
||||
}
|
||||
th.action-checkbox-column {
|
||||
width: 33px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.inline-group .tabular {
|
||||
table.table {
|
||||
tr.add-row td { // background-color: #eee;
|
||||
.vertical-gradient(#efefef, #e2e2e2);
|
||||
.white-shadow;
|
||||
padding-left: 10px;
|
||||
}
|
||||
td.delete {
|
||||
text-align: center;
|
||||
width: 40px;
|
||||
}
|
||||
td .help-block {
|
||||
margin: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.table .add-row a, .add-row a {
|
||||
font-size: 11px;
|
||||
text-decoration: underline;
|
||||
&:hover {
|
||||
text-decoration: none;
|
||||
}
|
||||
}
|
||||
|
||||
/* Fix BS row styles for TH cells */
|
||||
@bs-tr-error-color: #f2dede;
|
||||
@bs-tr-warning-color: #fcf8e3;
|
||||
@bs-tr-info-color: #d9edf7;
|
||||
@bs-tr-success-color: #dff0d8;
|
||||
.table tbody {
|
||||
>tr.error, >tr.warning, >tr.info, >tr.success {
|
||||
box-shadow: inset 1px 1px 0 rgba(255, 255, 255, .5);
|
||||
}
|
||||
>tr.error {
|
||||
>td, >th {
|
||||
background-color: @bs-tr-error-color;
|
||||
border-top: 1px solid darken(@bs-tr-error-color, 3%);
|
||||
}
|
||||
}
|
||||
>tr.warning {
|
||||
>td, >th {
|
||||
background-color: @bs-tr-warning-color;
|
||||
border-top: 1px solid darken(@bs-tr-warning-color, 8%);
|
||||
}
|
||||
}
|
||||
>tr.info {
|
||||
>td, >th {
|
||||
background-color: @bs-tr-info-color;
|
||||
border-top: 1px solid darken(@bs-tr-info-color, 5%);
|
||||
}
|
||||
}
|
||||
>tr.success {
|
||||
>td, >th {
|
||||
background-color: @bs-tr-success-color;
|
||||
border-top: 1px solid darken(@bs-tr-success-color, 5%);
|
||||
}
|
||||
}
|
||||
}
|
||||
.table-hover tbody {
|
||||
>tr.error:hover>th {
|
||||
background-color: darken(@bs-tr-error-color, 5%);
|
||||
}
|
||||
>tr.warning:hover>th {
|
||||
background-color: darken(@bs-tr-warning-color, 5%);
|
||||
}
|
||||
>tr.info:hover>th {
|
||||
background-color: darken(@bs-tr-info-color, 5%);
|
||||
}
|
||||
>tr.success:hover>th {
|
||||
background-color: darken(@bs-tr-success-color, 5%);
|
||||
}
|
||||
}
|
||||
|
||||
@tr-selected-color: #FCF8E3;
|
||||
@tr-selected-color: #83B3C3;
|
||||
.table-striped.table-hover tbody {
|
||||
// Striped and selected and hover
|
||||
&>tr.selected:hover {
|
||||
&>td, &>th {
|
||||
background-color: darken(@tr-selected-color, 6%);
|
||||
}
|
||||
}
|
||||
&>tr.selected:hover:nth-child(odd) {
|
||||
&>td, &>th {
|
||||
background-color: darken(@tr-selected-color, 6%);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* Fix text-alignment classes for tables */
|
||||
.table th, .table td {
|
||||
&.text-left {
|
||||
text-align: left;
|
||||
}
|
||||
&.text-center {
|
||||
text-align: center;
|
||||
}
|
||||
&.text-right {
|
||||
text-align: right;
|
||||
}
|
||||
}
|
||||
|
||||
.table-bordered {
|
||||
th:not(:first-child), td:not(:first-child) {
|
||||
border-left: 0;
|
||||
}
|
||||
th:not(:first-child), td:not(:first-child) {
|
||||
border-left: 0;
|
||||
}
|
||||
}
|
||||
.table.table-condensed tbody {
|
||||
th, td {
|
||||
font-weight: normal;
|
||||
padding: 5px 10px 4px 10px;
|
||||
}
|
||||
}
|
||||
|
||||
.table {
|
||||
tbody > tr.selected {
|
||||
&>th, &>td {
|
||||
background-color: @tr-selected-color;
|
||||
border-top: 1px solid darken(@tr-selected-color, 5%);
|
||||
box-shadow: inset 1px 1px 0 rgba(255, 255, 255, .2);
|
||||
color: white;
|
||||
text-shadow: none;
|
||||
a {
|
||||
color: white;
|
||||
text-decoration: underline;
|
||||
&:hover {
|
||||
text-decoration: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
tbody > tr.selected:nth-child(odd) {
|
||||
&>td, &>th {
|
||||
background-color: lighten(@tr-selected-color, 3%);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* TabularInlines Sortables */
|
||||
.inline-sortable {
|
||||
white-space: nowrap;
|
||||
a {
|
||||
display: inline-block;
|
||||
padding: 2px 6px 2px 2px;
|
||||
&:last-child {
|
||||
padding: 0;
|
||||
}
|
||||
&:hover {
|
||||
.icon-alpha5 {
|
||||
opacity: .5;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.selected td {
|
||||
.inline-sortable a i, .inline-sortable a:hover i {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
tr:first-child td .inline-sortable .sortable-up {
|
||||
opacity: .15;
|
||||
cursor: default;
|
||||
}
|
||||
tr.form-row:nth-last-child(3), #result_list tr:last-child {
|
||||
td .inline-sortable .sortable-down {
|
||||
opacity: .15;
|
||||
cursor: default;
|
||||
}
|
||||
}
|
||||
50
static/suit/less/ui/tabs.less
Normal file
50
static/suit/less/ui/tabs.less
Normal file
@@ -0,0 +1,50 @@
|
||||
.nav-tabs-suit {
|
||||
list-style: none;
|
||||
margin: 0px 4px 15px 4px;
|
||||
li {
|
||||
display: inline-block;
|
||||
float: none;
|
||||
vertical-align: bottom;
|
||||
&:first-child {
|
||||
margin-left: 10px;
|
||||
}
|
||||
a {
|
||||
display: inline-block;
|
||||
padding: 8px 20px 7px;
|
||||
.border-radius(@border-radius+1, @border-radius+1, null, null);
|
||||
.white-inset;
|
||||
text-decoration: none;
|
||||
color: #08c;
|
||||
font-size: 13px;
|
||||
&:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
&.error {
|
||||
color: @red !important;
|
||||
}
|
||||
}
|
||||
a, a:hover {
|
||||
background-color: @bgcolor-light;
|
||||
border: 1px solid #ddd;
|
||||
}
|
||||
&.active {
|
||||
a {
|
||||
font-weight: bold;
|
||||
color: @text-color;
|
||||
.white-shadow;
|
||||
.box-shadow(none);
|
||||
}
|
||||
a, a:hover {
|
||||
text-decoration: none;
|
||||
background-color: @bgcolor;
|
||||
border-bottom-color: @bgcolor;
|
||||
}
|
||||
}
|
||||
}
|
||||
&:after, &:before {
|
||||
display: inline;
|
||||
content: normal;
|
||||
clear: none;
|
||||
}
|
||||
|
||||
}
|
||||
Reference in New Issue
Block a user