Skip to content
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.

Sign up for GitHub

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

Jump to bottom

Sidebar compatibility #24

Merged
merged 11 commits into from
Nov 24, 2022
Merged

Sidebar compatibility #24

Changes from all commits
Commits
Show all changes
11 commits
Select commit Hold shift + click to select a range
4c8e15d
Tweaks to enable sidebar compatibility
nathan-nz Nov 18, 2022
b36304c
Tweak to align buttons
nathan-nz Nov 18, 2022
d34ce5e
Tweak width at which columns scroll
nathan-nz Nov 18, 2022
d663da4
Update common.scss
nathan-nz Nov 18, 2022
0acc8b7
Update common.scss
nathan-nz Nov 20, 2022
9a8da58
Update common.scss
nathan-nz Nov 20, 2022
5259df1
Update common.scss
nathan-nz Nov 20, 2022
f0461df
Remove fader from L
nathan-nz Nov 20, 2022
dbd8e8d
Further linting
nathan-nz Nov 23, 2022
deb709d
Prettier changes
nathan-nz Nov 24, 2022
8fc8c0b
Apply prettier with correct version
davidtaylorhq Nov 24, 2022
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
41 changes: 17 additions & 24 deletions common/common.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,8 +1,5 @@
.discourse-kanban {
width: 100vw;
position: relative;
margin-left: -50vw;
left: 50%;
display: flex;

&.fullscreen {
Expand All @@ -21,12 +18,15 @@
.discourse-kanban-container {
height: auto;
padding: 10px 0;
max-height: 100%;
}
}
}

.discourse-kanban-container {
width: 100%;
height: 70vh;
margin-left: 40px;
display: flex;
overflow-x: scroll;
padding: 10px 0 5px 0;
Expand All @@ -37,31 +37,20 @@
right: 0px;
width: 10px;
height: 100%;
background: linear-a(to right, transparent, var(--secondary, $secondary));
}
&:before {
z-index: 100;
content: "";
position: absolute;
left: 0px;
width: 10px;
height: 100%;
background: linear-gradient(
to left,
transparent,
var(--secondary, $secondary)
);
background: linear-gradient
(to right, transparent, var(--secondary, $secondary));
}

.kanban-spacer {
display: flex;
flex-direction: column;
align-items: flex-end;
min-width: 50px;
width: calc((100vw - #{$large-width}) / 2 - 4px);
width: 40px;
flex-shrink: 0;
padding: 0;
margin: 0;
position: absolute;
left: -3px;

button {
margin-bottom: 4px;
Expand All @@ -72,6 +61,7 @@
position: relative;
overflow: hidden;
background: var(--primary-low, $primary-low);

&.accept-drag {
background: var(--primary-medium, $primary-medium);
}
Expand All @@ -93,14 +83,15 @@
height: 10px;
}

width: calc(
(#{$large-width} - (8px * (#{$num-columns} - 1))) / #{$num-columns}
width: MAX(
calc((100% - 8px - (8px * (#{$num-columns} - 1))) / #{$num-columns}),
calc(
(#{$large-width} - 400px - (8px * (#{$num-columns} - 1))) / #{$num-columns}
)
);
flex-shrink: 0;
margin: 0 4px;

padding: 10px 0px 0px 0px;

border-radius: 3px;
display: flex;
flex-direction: column;
Expand All @@ -121,15 +112,16 @@
display: block;
color: var(--primary-medium, $primary-medium);
cursor: pointer;

&.topic-unseen {
color: var(--primary-medium, $primary-medium);
}

margin: 10px 0;

background: var(--secondary, $secondary);
border-radius: 3px;
padding: 5px;

box-shadow: 0 1px 0 var(--primary-medium, $primary-medium);

&.dragging {
Expand Down Expand Up @@ -170,6 +162,7 @@
}
}
}

.modal .kanban-modal {
width: 400px;

Expand Down