├── Makefile
├── Plugin.php
├── README.md
└── skin.css


/Makefile:
--------------------------------------------------------------------------------
1 | PLUGIN_NAME = Css
2 | 
3 | all:
4 | 	@ git archive HEAD --prefix=${PLUGIN_NAME}/ --format=zip -o ${PLUGIN_NAME}.zip
5 | 


--------------------------------------------------------------------------------
/Plugin.php:
--------------------------------------------------------------------------------
 1 | <?php
 2 | 
 3 | namespace Kanboard\Plugin\Css;
 4 | 
 5 | use Kanboard\Core\Plugin\Base;
 6 | 
 7 | class Plugin extends Base
 8 | {
 9 |     public function initialize()
10 |     {
11 |         $this->hook->on("template:layout:css", array("template" => "plugins/Css/skin.css"));
12 |     }
13 | 
14 |     public function getPluginName()
15 |     {
16 |         return 'Css';
17 |     }
18 | 
19 |     public function getPluginDescription()
20 |     {
21 |         return t('This plugin add a new stylesheet and override default styles.');
22 |     }
23 | 
24 |     public function getPluginAuthor()
25 |     {
26 |         return 'Author';
27 |     }
28 | 
29 |     public function getPluginVersion()
30 |     {
31 |         return '0.0.1';
32 |     }
33 | 
34 |     public function getPluginHomepage()
35 |     {
36 |         return 'https://github.com/kanboard/plugin-example-css';
37 |     }
38 | }
39 | 


--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
 1 | Example of CSS plugin
 2 | =====================
 3 | 
 4 | This plugin add a new stylesheet and override default styles.
 5 | 
 6 | Installation
 7 | ------------
 8 | 
 9 | - Create a directory **Css** under the folder **plugins**
10 | - Copy all source files into this new directory
11 | 
12 | Author
13 | ------
14 | 
15 | The example stylesheet come from the [issue #1248](https://github.com/fguillot/kanboard/issues/1248) created by @oliverh72
16 | 
17 | Screenshot
18 | ----------
19 | 
20 | ![plugin-css](https://cloud.githubusercontent.com/assets/323546/10009045/ff659ec4-60a4-11e5-9af3-c63a1bef58d6.png)
21 | 


--------------------------------------------------------------------------------
/skin.css:
--------------------------------------------------------------------------------
  1 | div.task-board-recent {
  2 |     box-shadow: none;
  3 |     border-bottom: 6px solid rgba(0, 0, 0, 0.3);
  4 | }
  5 | 
  6 | div.ganttview-vtheader-series-name {
  7 |     padding: 0 6px;
  8 | }
  9 | 
 10 | th,
 11 | td {
 12 |     padding: 10px;
 13 | }
 14 | 
 15 | header {
 16 |     border-bottom: none;
 17 | }
 18 | 
 19 | label {
 20 |     font-weight: bold;
 21 |     margin-top: 18px;
 22 | }
 23 | 
 24 | .task-board {
 25 |     margin-bottom: 8px;
 26 |     padding: 12px;
 27 |     border-radius: 6px;
 28 | }
 29 | 
 30 | .task-board-title {
 31 |     font-size: 1.25em;
 32 |     font-weight: 600;
 33 | }
 34 | 
 35 | .task-show-details {
 36 |     border-radius: 10px;
 37 |     margin-bottom: 20px;
 38 | }
 39 | 
 40 | .task-show-details h2 {
 41 |     background-color: rgba(0, 0, 0, 0.3);
 42 |     padding: 20px;
 43 |     border-radius: 8px 8px 0 0;
 44 |     color: #fff;
 45 | }
 46 | 
 47 | .task-show-details ul {
 48 |     padding: 20px;
 49 | }
 50 | 
 51 | .table-small {
 52 |     font-size: 1em;
 53 | }
 54 | 
 55 | .sidebar {
 56 |     background-color: #f7f7f7;
 57 | }
 58 | 
 59 | .sidebar ul {
 60 |     padding-bottom: 20px;
 61 |     border-bottom: 1px solid #ddd;
 62 | }
 63 | 
 64 | .sidebar ul:last-of-type {
 65 |     border-bottom: none;
 66 | }
 67 | 
 68 | .sidebar-collapse i,
 69 | .sidebar-collapsed .sidebar {
 70 |     background-color: #999;
 71 |     border-radius: 24px;
 72 |     padding: 5px 10px 5px 8px;
 73 | }
 74 | 
 75 | .sidebar-collapse i,
 76 | .sidebar-collapsed .sidebar i {
 77 |     color: #fff;
 78 | }
 79 | 
 80 | .sidebar-collapse i:hover,
 81 | .sidebar-collapsed .sidebar:hover {
 82 |     background-color: #ccc;
 83 | }
 84 | 
 85 | .page-header {
 86 |     margin: 15px 0;
 87 |     background-color: #eee;
 88 |     padding: 6px 10px 10px 10px;
 89 |     border-bottom: 1px solid #ddd;
 90 |     border-top: 1px solid #ddd;
 91 | }
 92 | 
 93 | .page-header li {
 94 |     font-size: 1.1em;
 95 | }
 96 | 
 97 | .page-header h2 {
 98 |     border-bottom: none;
 99 | }
100 | 
101 | .listing {
102 |     border: none;
103 | }
104 | 
105 | .fa-play {
106 |     font-size: 1.2em;
107 |     background-color: #ddd;
108 |     border-radius: 100%;
109 |     width: 25px;
110 |     height: 28px;
111 |     padding: 8px 0 0 15px;
112 |     margin-right: 8px;
113 | }
114 | 
115 | .fa-play:hover {
116 |     background-color: #90;
117 |     color: #fff;
118 | }
119 | 
120 | .fc-event .fc-content {
121 |     padding: 4px 8px;
122 | }
123 | 
124 | .board-add-icon {
125 |     padding: 0;
126 |     margin-right: 12px;
127 | }
128 | 
129 | .board-add-icon a {
130 |     color: #90;
131 |     padding: 0px 6px 3px 6px;
132 |     margin-bottom: -4px;
133 | }
134 | 
135 | .board-add-icon a:hover {
136 |     border-radius: 100%;
137 |     background-color: #90;
138 |     color: #fff;
139 | }
140 | 
141 | .form-column select {
142 |     font-size: 1.2em;
143 |     margin: 10px 0 2px 0;
144 | }
145 | 
146 | .form-column:nth-of-type(2) {
147 |     padding: 10px 25px;
148 |     background-color: #f7f7f7;
149 | }
150 | 
151 | .form-actions {
152 |     font-size: 1.2em;
153 | }
154 | 
155 | .page-header ul.dropdown-submenu-open {
156 |     margin: 10px 0 0 -10px;
157 |     padding: 0;
158 | }
159 | 
160 | .dropdown-submenu-open li:nth-child(even) {
161 |     background-color: #f7f7f7;
162 | }
163 | 
164 | .dropdown-submenu-open li {
165 |     padding: 6px 10px;
166 | }
167 | 
168 | .dropdown-submenu-open li:hover {
169 |     background-color: #eee;
170 | }
171 | 
172 | .filters {
173 |     border: none;
174 | }
175 | 
176 | .filters ul.dropdown-submenu-open {
177 |     margin: 6px 0 0 8px;
178 | }
179 | 


--------------------------------------------------------------------------------