-
Notifications
You must be signed in to change notification settings - Fork 1.8k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
UI Improvement via Css plugin (trello like board) #2690
Comments
Nice design . I am willing to collaborate for that goal ( time permitting ) but that would require to touch almost each file that produces an output ... Large task . |
How do we get the CSS plugin? If I paste the code in my CSS settings of kanboard then it generates an SQL error. |
You can use this: https://github.com/kanboard/plugin-example-css |
Just a UI improvement Css code. Not sure if its OK to share share code here.
Preview
NOTE: Need the Css plugin.
`header {
background: #755287;
padding: 10px 10px 15px 10px;
margin-left: 0px;
margin-right: 0px;
margin-top: 0px;
border: 0px !important;
}
h1 {
font-weight: normal;
color: #FFFFFF;
}
body {
margin-left: 0px;
margin-right: 0px;
margin-top: 0px;
padding-bottom: 0px;
padding-top: 0px;
/* background: #89609e;*/
color: #4d4d4d;
font: 14px "Helvetica Neue", Arial, Helvetica, sans-serif;
text-rendering: optimizeLegibility;
-webkit-font-smoothing: antialiased;
line-height: 18px;
}
.page {
/background: #89609e;/
padding: 10px 10px 15px 10px;
margin-left: 0px;
margin-right: 0px;
clear: both;
}
.ui-sortable {
background: #e2e4e6;
padding: 5px 5px 5px 5px;
border-top-left-radius: 0px !important;
border-top-right-radius: 0px !important;
border-bottom-left-radius: 3px;
border-bottom-right-radius: 3px;
}
.task-board {
border-radius: 3px;
margin-bottom: 6px;
padding: 4px 4px 4px 6px;
}
div.task-board-recent {
border-width: 0px;
}
.task-board-title {
font-size: 1.15em;
margin-top: 0px;
margin-bottom: 4px;
}
th {
background: none; */
}
td, th {
border: 0px solid #eee;
padding: 0px .5em;
}
.board-column-expanded {
background: #e2e4e6;
padding: 5px 5px 5px 5px;
border-top-left-radius: 3px;
border-top-right-radius: 3px;
}
.table-small {
font-size: 1em;
}
.filter-box input[type=text] {
font-size: 14px;
padding: 0px 6px;
margin: 0px;
}
.filter-box {
margin: 3px;
}
/* unvisited link */
a:link {
color: #4d4d4d;
}
/* visited link */
a:visited {
color: #4d4d4d;
}
/* mouse over link */
a:hover {
color: #1d1d1d;
text-decoration: none;
}
/* selected link */
a:active {
color: #1d1d1d;
}
a:link {
text-decoration: none;
}
a:visited {
text-decoration: none;
}
a:hover {
text-decoration: none;
}
a:active {
text-decoration: none;
}
td.color-white, div.color-white {
border-color: #ffffff;
border-left-width: 5px;
background-color: white;
}
td.color-yellow, div.color-yellow {
border-color: #f2d600;
border-left-width: 5px;
background-color: white;
}
td.color-blue, div.color-blue {
border-color: #0079bf;
border-left-width: 5px;
background-color: white;
}
td.color-green, div.color-green {
border-color: #61bd4f;
border-left-width: 5px;
background-color: white;
}
td.color-purple, div.color-purple {
border-color: #c377e0;
border-left-width: 5px;
background-color: white;
}
td.color-red, div.color-red {
border-color: #eb5a46;
border-left-width: 5px;
background-color: white;
}
td.color-orange, div.color-orange {
border-color: #ffab4a;
border-left-width: 5px;
background-color: white;
}
td.color-grey, div.color-grey {
border-color: #b6bbbf;
border-left-width: 5px;
background-color: white;
}
`
The text was updated successfully, but these errors were encountered: