[Chrome extension] 使用 Stylish 改變 Jira 的 Scrum board 大小

[Chrome extension] 使用 Stylish 改變 Jira 的 Scrum board 大小

最近公司的專案開始改用 Jira 來管理,

嗯…其實目前來說並沒有之前的 Trello 方便,

不過之後如果跟 bug tracking system 也整合起來的話,也許是會好一點…

 

但目前使用起來,發現一個蠻麻煩的問題,

就是 scrum board 的寬度沒辦法調整,所有的 task 都會限縮在小小的寬度內,

雖然這樣是可以看到大部分的 task,但別說細節了,

連問題的大略敘述都無法完整顯示出來…

jira1  

 

這件事情在我們的 stand-up meeting 時特別的明顯,

因為我們會將 scrum board 投影出來看,但投出來時每個 task 小小的,

就算把字型放大,也無法看到每個 task 的完整文字,

只看得到每個 task 的前面幾個字,大家都得在那邊猜是在說什麼…

網路上也有人在抱怨一樣的問題,不過好像還沒有什麼解法…

再說我也不是系統管理者,沒辦法對它的顯示作出什麼根本的改變…

 

不過最近剛好發現了一個好用的 chrome plugin:stylish

可以用來將網頁的 CSS 改掉,正好可以拿來改 Jira 的 CSS 看看~

像是下面的範例中,就是把整個 body 的寬度改成兩倍寬,

這樣大部分的 task 內容都可以直接看到了: 

body
{
width: 200% !important;
overflow: scroll !important;
}
body.ghx-scroll-columns,
#ghx-plan,
#ghx-report,
#ghx-work
{
overflow:scroll !important;
}
#ghx-column-header-group
{
position: relative !important;
top: auto !important;
left: auto !important;
}

 

改完後的效果就像下面這樣,所有的 task 寬度都變成兩倍,

如果有 task 沒顯示出來的,會出現捲軸讓你可以捲:

jira2  


 

後註:後來發現上面的改法在我們的 stand-up meeting 還是不太足夠,

因為上面的那個標題列和 Quick filters 占據了不少顯示空間,

因此後來我又改了一版,把 task 以外的東西都拿掉,

不過缺點是在操作一些功能時會出錯(找不到元素),

因此這個改版就只有在 stand-up meeting 時使用,開完會後就會把它 disable 掉囉~

body
{
width: 200% !important;
overflow: scroll !important;
}
body.ghx-scroll-columns,
#ghx-plan,
#ghx-report,
#ghx-work
{
overflow:scroll !important;
}
#announcement-banner,
#ghx-header,
#ghx-operations
{
display: none !important;
}
.aui-header
{
height: 0px !important;
}
#ghx-column-header-group
{
position: relative !important;
top: auto !important;
left: auto !important;
}
#ghx-pool
{
padding-top: 0px !important;
}

 

 

(本頁面已被瀏覽過 57 次)

發佈留言

發佈留言必須填寫的電子郵件地址不會公開。

這個網站採用 Akismet 服務減少垃圾留言。進一步瞭解 Akismet 如何處理網站訪客的留言資料