Trello에서 목록의 열 너비를 어떻게 조정합니까?
답변
Trello의 현재 구현에서는이를 구성 할 수 없습니다. 사용 가능한 공간에 따라 목록의 너비는 300-210 픽셀 사이입니다.
그러나 약간의 해킹이 마음에 들지 않으면 JavaScript를 사용하여 직접 문제를 해결할 수 있습니다.
(function(w) {
$('.list').width(w);
$('.list-area').width($('.list').length * (w+12)); // 12px inter-list spacing
$('body').addClass('layout-horiz-scroll'); // force-enable horizontal scrolling
})(500)
(500을 원하는 픽셀 너비로 대체하십시오.)
브라우저 콘솔에서 이것을 실행하거나 다음 bookmarklet 으로 저장하여 너비를 더 원할 때마다 클릭 할 수 있습니다.
javascript:(function(w) { $('.list').width(w); $('.list-area').width($('.list').length * (w+12)); $('body').addClass('layout-horiz-scroll'); })(500)
편집 : Bookmarklet에서 실제 원하는 크기를 요청하는 또 다른 옵션은 다음과 같습니다.
javascript:(function(w) { $('.list').width(w); $('.list-area').width($('.list').length * (w+12)); $('body').addClass('layout-horiz-scroll'); })(prompt("List width?", 500))
답변의 유효성을 검사하지 않으므로 숫자가 아닌 것을 입력하면 작동하지 않습니다.
답변
하려면 카드 세부 사항을 더 넓은, 당신은이 책갈피 – 스크립트를 사용할 수 있습니다 :
javascript:(function(w) {
$('.window').css('width', w+'px');
$('.window-main-col').css('width', (w-184)+'px');
})(prompt("New Width? (default 730)", 1030))
나를 위해 Full-HD-Displays에서 300px를 추가하는 것이 훨씬 나아 보입니다.
답변
Trello는 이제 보드 목록 레이아웃을 display: flex
대신로 설정했기 때문에 약간 업데이트 된 답변 display: block
이므로 width
더 이상 꼬이지 않습니다.
또한 Trello 텐트는 생성 된 모든 새 카드에 스타일을 주입합니다. 따라서 관찰자를 만들고 페이지의 DOM 변경 사항을 모니터링하고 항상 스타일 변경을 적용하는 것이 좋습니다.
var newWidth = 400;
var cardNewHeight = 40;
function enforceNewWidth() {
(function(w) {
$('.list').css({flex: '0 0 ' + w + 'px'});
// updated 2015-04-01
$('.list').css('max-width', w + 'px');
$('.list-card').css('max-width', w + 'px');
$('.list-card').css('min-height', cardNewHeight + 'px');
// $('.list-area').width($('.list').length * (w+12)); // 12px inter-list spacing
$('textarea.list-card-composer-textarea').css({width: (w - 40) + 'px'});
})(newWidth);
}
enforceNewWidth();
var observer = new MutationObserver(function(mutations) {
enforceNewWidth();
});
observer.observe(document, {childList: true, subtree: true});
답변
현재 보드에 많은 것들이 있기 때문에 목록을 더 좁히려 고했습니다. 거의 모든 타일은 카드 너비의 약 75 %입니다 (사실, 세어도 여전히 대다수를 얻을 수 있다고 생각합니다 제목이 카드 너비의 50 % 미만인 경우).
여기에 제안 된 JS 스크립트 (최신 스크립트는 아님)를 시도했지만 실제로 목록을 좁히는 동안 새로 형성된 간격을 제거하지 못했습니다. 그래서 나는이 원시적을 생각해 냈지만 그것을 수행하는 ‘트릭을 수행’합니다.
- 원하는 목록 너비를 얻을 때까지 Ctrl + ‘-‘를 누르십시오 (모든 목록이 화면에 맞는 경우 일 수 있음).
- 이제 텍스트는 꽤 작을 것이므로 요소 관리자를 열고 .list-card-title에 대한 CSS를 편집하고 글꼴 크기를 늘리십시오 ( ‘font-size : large;’를 추가하면 충분합니다).
- (선택 사항) ‘g’가 표시되고 하단 부분이 누락되면 하단 픽셀 몇 픽셀을 추가 할 수 있습니다 (10을 추가했습니다).
목록 너비를 늘리려면 반대 (텍스트 확대 및 축소)가 작동 할 수 있습니다.
내가 전에 말했듯이, 이것은 아마도 물건을 다루는 ‘적절한’방법은 아니지만 내가 원하는 결과를 얻었고 빠르다.
답변
이것은 사용 가능한 옵션이 아니므로 Trello의 열 너비가 고정됩니다.
답변
웹 스토어에서 “Trello 용 슬림 목록”이라는 Chrome 용 추가 기능이 제공됩니다.
https://chrome.google.com/webstore/detail/slim-lists-for-trello/pjlejgbmijmafmobaofcgblpdbkaodod
답변
-
“사용자 정의 CSS 적용”을 선택하고 다음을 추가하십시오.
.list { width: 375px; } .list-wrapper { width: 375px; }