fix adaptive layout in project list
This commit is contained in:
parent
4a81441d35
commit
3cc306bbc3
@ -167,12 +167,8 @@
|
||||
top: -20px;
|
||||
|
||||
@media (max-width: 900px) {
|
||||
order: 1;
|
||||
position: inherit;
|
||||
right: inherit;
|
||||
top: inherit;
|
||||
top: 100px;
|
||||
max-width: 115px;
|
||||
margin-bottom: 35px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -133,7 +133,7 @@
|
||||
.edit-project,
|
||||
.add-worker,
|
||||
.edit-column {
|
||||
background: linear-gradient(180deg, #fff 0%, #ebebeb 37.29%);
|
||||
// background: linear-gradient(180deg, #fff 0%, #ebebeb 37.29%);
|
||||
.title-project {
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
@ -1,8 +1,8 @@
|
||||
.error-login {
|
||||
position: relative;
|
||||
padding: 54px 76px;
|
||||
padding: 30px;
|
||||
background: linear-gradient(180deg, #ffffff 0%, #ebebeb 100%);
|
||||
border-radius: 40px;
|
||||
border-radius: 20px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
@ -15,9 +15,7 @@
|
||||
}
|
||||
|
||||
p {
|
||||
font-size: 12px;
|
||||
line-height: 14px;
|
||||
width: 176px;
|
||||
font-size: 15px;
|
||||
text-align: center;
|
||||
font-weight: 300;
|
||||
margin-bottom: 30px;
|
||||
|
@ -75,8 +75,6 @@ export const ProjectTicket = ({ project, index }) => {
|
||||
setModalDelete(false);
|
||||
}
|
||||
|
||||
function linkProject() {}
|
||||
|
||||
return (
|
||||
<div className={`project project-${project.id}`} key={index}>
|
||||
<Link
|
||||
|
@ -2,13 +2,11 @@
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
position: relative;
|
||||
width: 322px;
|
||||
|
||||
width: 300px;
|
||||
background: #f1f1f1;
|
||||
border-radius: 12px;
|
||||
|
||||
cursor: pointer;
|
||||
max-width: 440px;
|
||||
transition: 0.4s;
|
||||
|
||||
&:hover {
|
||||
@ -26,15 +24,12 @@
|
||||
|
||||
&__link {
|
||||
font-weight: 700;
|
||||
width: 194px;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
font-size: 18px;
|
||||
line-height: 32px;
|
||||
color: #111112;
|
||||
margin-bottom: 22px;
|
||||
max-width: 380px;
|
||||
margin-bottom: 10px;
|
||||
|
||||
&:hover {
|
||||
color: black;
|
||||
@ -45,7 +40,7 @@
|
||||
display: flex;
|
||||
align-items: center;
|
||||
position: relative;
|
||||
margin-bottom: 45px;
|
||||
margin-bottom: 30px;
|
||||
|
||||
p {
|
||||
color: #6f6f6f;
|
||||
@ -53,7 +48,6 @@
|
||||
font-size: 12px;
|
||||
font-weight: 500;
|
||||
line-height: 17px;
|
||||
width: 60px;
|
||||
}
|
||||
|
||||
.count {
|
||||
@ -97,13 +91,13 @@
|
||||
}
|
||||
|
||||
&__open-tracker {
|
||||
padding: 17px 26px 16px;
|
||||
padding: 10px 15px;
|
||||
}
|
||||
|
||||
&__statistics {
|
||||
position: absolute;
|
||||
bottom: 18px;
|
||||
left: 26px;
|
||||
bottom: 13px;
|
||||
left: 15px;
|
||||
color: #0042b4;
|
||||
text-decoration: underline;
|
||||
font-size: 14px;
|
||||
|
@ -201,7 +201,7 @@ export const Tracker = () => {
|
||||
)) &&
|
||||
!loader && (
|
||||
<div className="no-projects">
|
||||
<div className="no-projects__createNew">
|
||||
<div className="no-projects__create-new">
|
||||
<div>
|
||||
<img src={noProjects} alt="noProjectImg" />
|
||||
<p>Создайте свой первый проект</p>
|
||||
@ -251,7 +251,7 @@ export const Tracker = () => {
|
||||
<p>
|
||||
{25} - {35}
|
||||
</p>
|
||||
<h2>Сентября,</h2>
|
||||
<h3>Сентября,</h3>
|
||||
<h3>2023</h3>
|
||||
</div>
|
||||
|
||||
|
@ -145,10 +145,10 @@
|
||||
row-gap: 30px;
|
||||
display: none;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
@media (max-width: 785px) {
|
||||
row-gap: 25px;
|
||||
justify-content: center;
|
||||
padding: 0 15px 20px;
|
||||
}
|
||||
|
||||
@ -158,7 +158,7 @@
|
||||
padding: 20px;
|
||||
width: 100%;
|
||||
|
||||
&__createNew {
|
||||
&__create-new {
|
||||
display: flex;
|
||||
div {
|
||||
display: flex;
|
||||
@ -177,14 +177,11 @@
|
||||
}
|
||||
|
||||
.create-project-btn {
|
||||
max-width: 322px;
|
||||
width: 322px;
|
||||
height: 166px;
|
||||
width: 300px;
|
||||
height: 113px;
|
||||
border-radius: 12px;
|
||||
background: #ecf8e5;
|
||||
color: #000000;
|
||||
font-weight: 400;
|
||||
font-size: 15px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
@ -192,10 +189,9 @@
|
||||
|
||||
&__text {
|
||||
text-align: left;
|
||||
font-size: 14px;
|
||||
font-weight: 250;
|
||||
width: 190px;
|
||||
margin-left: 25px;
|
||||
font-weight: 400;
|
||||
font-size: 18px;
|
||||
margin-left: 15px;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
@ -203,10 +199,13 @@
|
||||
box-shadow: 4px 4px 8px 0px rgba(34, 60, 80, 0.11);
|
||||
}
|
||||
|
||||
@media (max-width: 650px) {
|
||||
height: 40px;
|
||||
font-size: 12px;
|
||||
height: 166px;
|
||||
@media (max-width: 1068px) {
|
||||
width: 47%;
|
||||
}
|
||||
|
||||
@media (max-width: 785px) {
|
||||
max-width: 394px;
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -94,13 +94,8 @@
|
||||
top: -100px;
|
||||
right: 58px;
|
||||
|
||||
@media (max-width: 1000px) {
|
||||
position: inherit;
|
||||
order: 1;
|
||||
top: inherit;
|
||||
right: inherit;
|
||||
max-width: 115px;
|
||||
margin-bottom: 25px;
|
||||
@media (max-width: 900px) {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
Loading…
Reference in New Issue
Block a user