Chneemann/join
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

responsive

Browse source
This commit is contained in:
Chneemann 2024-04-25 11:30:55 +02:00
parent c09a3b7b56
commit 042c52ef80
4 changed files with 21 additions and 7 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

7
src/app/components/add-task/add-task.component.html
View file

@ -124,7 +124,12 @@
</div> </div>
<div class="middle-spacer"><div class="line"></div></div> <div class="middle-spacer"><div class="line"></div></div>
<div class="right-side"> <div class="right-side">
<div class="date"> <div
class="date"
[ngStyle]="{
'margin-top': overlayMobile ? '28px' : ''
}"
>
<p>Due date<span class="red-dot">*</span></p> <p>Due date<span class="red-dot">*</span></p>
<input <input
type="date" type="date"

9
src/app/components/add-task/add-task.component.scss
View file

@ -30,7 +30,7 @@ section {
} }
.edit-task-overlay-content-mobile { .edit-task-overlay-content-mobile {
height: calc(100% - 24px); height: 100%;
padding: 0 6px; padding: 0 6px;
overflow-y: auto; overflow-y: auto;
background-color: var(--very-light-gray); background-color: var(--very-light-gray);
@ -125,7 +125,8 @@ p {
.assigned-badget { .assigned-badget {
display: flex; display: flex;
margin-top: 6px; align-items: center;
margin: 6px;
height: 40px; height: 40px;
} }
@ -276,7 +277,7 @@ p {
.form-buttons { .form-buttons {
display: flex; display: flex;
justify-content: end; justify-content: end;
padding-top: 12px; padding: 12px 0;
} }
/*------------- RESPONSIVE -------------*/ /*------------- RESPONSIVE -------------*/
@ -289,7 +290,7 @@ p {
} }
} }
@media screen and (max-width: 750px) { @media screen and (max-width: 1050px) {
.btn-text { .btn-text {
span { span {
display: block; display: block;

10
src/app/shared/components/overlay/task-edit-overlay/task-edit-overlay.component.scss
View file

@ -7,7 +7,7 @@
} }
.overlay-mobile { .overlay-mobile {
height: calc(100% - 24px); height: 100%;
width: 100%; width: 100%;
} }
@ -15,3 +15,11 @@
display: flex; display: flex;
justify-content: right; justify-content: right;
} }
/*------------- RESPONSIVE -------------*/
@media screen and (max-width: 1050px) {
.overlay {
width: calc(100vw - 124px);
}
}

2
src/app/shared/components/overlay/task-overlay/task-overlay.component.scss
View file

@ -7,7 +7,7 @@
} }
.overlay-mobile { .overlay-mobile {
height: calc(100% - 24px); height: 100%;
} }
.header { .header {