forgejo/web_src/css/features/projects.css
Beowulf 853f005180
fixed overflow of projects column title
This fixes that titles of project columns can overflow and push the
action menu out of the card, so that interaction is no longer possible.

Fixes #3717
2024-05-17 23:11:11 +02:00

105 lines
1.9 KiB
CSS

.board {
display: flex;
flex-direction: row;
flex-wrap: nowrap;
overflow-x: auto;
margin: 0 0.5em;
}
.project-column {
background-color: var(--color-project-board-bg) !important;
border: 1px solid var(--color-secondary) !important;
margin: 0 0.5rem !important;
padding: 0.5rem !important;
width: 320px;
height: calc(100vh - 450px);
min-height: 60vh;
overflow-y: scroll;
flex: 0 0 auto;
overflow: visible;
display: flex;
flex-direction: column;
cursor: default;
}
.project-column .issue-card {
color: var(--color-text);
}
.project-column-header {
display: flex;
align-items: center;
justify-content: space-between;
}
.project-column-title {
background: none !important;
line-height: 1.25 !important;
color: inherit !important;
cursor: inherit;
}
.project-column-title-label {
overflow: hidden;
text-overflow: ellipsis;
}
.project-column-header > .dropdown {
flex-shrink: 0;
}
.project-column > .cards {
flex: 1;
display: flex;
align-content: baseline;
margin: 0 !important;
padding: 0 !important;
flex-wrap: nowrap !important;
flex-direction: column;
overflow-x: auto;
gap: .25rem;
}
.project-column > .divider {
margin: 5px 0;
border-color: currentcolor;
opacity: .5;
}
.project-column:first-child {
margin-left: auto !important;
}
.project-column:last-child {
margin-right: auto !important;
}
.card-attachment-images {
display: inline-block;
white-space: nowrap;
overflow: hidden;
text-align: center;
}
.card-attachment-images img {
display: inline-block;
max-height: 50px;
border-radius: var(--border-radius);
margin-right: 2px;
}
.card-attachment-images img:only-child {
max-height: 90px;
margin: auto;
}
.card-ghost {
border-color: var(--color-secondary-dark-4) !important;
border-style: dashed !important;
background: none !important;
}
.card-ghost * {
opacity: 0;
}