refactoring allStyles styleStyle -> style-style

This commit is contained in:
2024-02-09 18:17:15 +03:00
parent 81d2ee4098
commit af07631abe
93 changed files with 751 additions and 703 deletions

View File

@ -236,12 +236,12 @@ export const Tracker = () => {
<div
className={
tab === 2
? "tracker__tabs__content__allTasks taskList tasks active__content"
? "tracker__tabs__content__all-tasks task-list tasks active__content"
: "tracker__tabs__content__projects"
}
>
<div className="taskList__head">
<div className="taskList__tasks-period">
<div className="task-list__head">
<div className="task-list__tasks-period">
<div className="month-period">
<p>
{25} - {35}
@ -260,7 +260,7 @@ export const Tracker = () => {
</div>
</div>
<div className="taskList__head__search">
<div className="task-list__head__search">
<img src={search} alt="search" />
<input
type="text"
@ -269,12 +269,12 @@ export const Tracker = () => {
/>
</div>
<div className="taskList__filters">
<BaseButton styles={"taskList__filters-filter"}>
<div className="task-list__filters">
<BaseButton styles={"task-list__filters-filter"}>
<img src={filterIcon} alt="#" />
<p>Фильтр</p>
</BaseButton>
<BaseButton styles={"taskList__filters-clear"}>
<BaseButton styles={"task-list__filters-clear"}>
<p> Очистить фильтр</p>
</BaseButton>
</div>
@ -288,18 +288,18 @@ export const Tracker = () => {
projects={projects}
/>
<div className="taskList__time">
<div className="taskList__time-compited">
<div className="task-list__time">
<div className="task-list__time-compited">
<h4>Учет моего рабочего времени за день</h4>
<h3>
Задач выполнено: <p>{2}</p>
</h3>
</div>
<div className="taskList__time-all">
<div className="task-list__time-all">
<h3>Общее время:</h3>
<p>{"4 ч 34 мин"}</p>
</div>
<div className="taskList__time-status">
<div className="task-list__time-status">
<div>
<img src={statusTimeTask} alt="#" />
<p>Сверка пройдена</p>
@ -311,7 +311,7 @@ export const Tracker = () => {
</div>
</div>
<div className="taskList__end">
<div className="task-list__end">
<BaseButton styles={"close-day"}>
Закрыть сегодняшний день
</BaseButton>
@ -381,23 +381,23 @@ export const Tracker = () => {
)}`}
</p>
</div>
<div className="archive__tasksWrapper">
<div className="archive__tasks-wrapper">
{Boolean(
projects?.filter((project) => project.status === 10).length
) ? (
projects?.map((project, index) => {
return project.status === 10 ? (
<div
className="archive__completeTask-project"
className="archive__complete-task-project"
key={index}
>
<div className="archive__completeTask__description">
<div className="archive__complete-task__description">
<p className="project-title-archive">
{project.name}
</p>
<p className="date">{project.date}</p>
</div>
<div className="archive__completeTask__creator">
<div className="archive__complete-task__creator">
<img src={mockAvatar} alt="#" />
<div className="creator-title">
<h4>Создатель проекта:</h4>
@ -410,7 +410,7 @@ export const Tracker = () => {
);
})
) : (
<div className="archive__noItem-project">
<div className="archive__no-item-project">
<img src={archiveTrackerProjects} alt="#" />
<p>В архиве проектов нет</p>
</div>

View File

@ -367,7 +367,7 @@
border-color: gray;
}
&Selected {
&-selected {
display: flex;
align-items: center;
border-radius: 8px;
@ -428,7 +428,7 @@
transform: rotate(180deg);
}
&Dropdown {
&-dropdown {
position: absolute;
top: 33px;
left: 0;
@ -441,7 +441,7 @@
row-gap: 7px;
width: 100%;
.executorDropdown__person {
.executor-dropdown__person {
display: flex;
justify-content: space-between;
align-items: center;
@ -565,7 +565,7 @@
margin-top: 8px;
padding: 0 8px 8px;
.tagItem {
.tag-item {
display: flex;
align-items: center;
flex-direction: row;
@ -620,7 +620,7 @@
}
}
.addNewTag {
.add-new-tag {
display: flex;
align-items: center;
column-gap: 15px;
@ -649,7 +649,7 @@
}
}
.formTag {
.form-tag {
display: flex;
flex-direction: column;
padding: 8px;
@ -750,7 +750,7 @@
transform: scaleX(1);
}
.tasksContainer {
.tasks-container {
display: flex;
flex-direction: column;
row-gap: 8px;
@ -923,7 +923,7 @@
}
}
&__deadLine {
&__dead-line {
display: flex;
align-items: center;
column-gap: 5px;
@ -969,7 +969,7 @@
row-gap: 3px;
margin: 5px 0 8px;
.tagItem {
.tag-item {
padding: 3px 10px;
border-radius: 10px;
color: white;
@ -978,7 +978,7 @@
}
}
.openItems {
.open-items {
cursor: pointer;
border-radius: 44px;
width: 33px;
@ -993,11 +993,11 @@
color: white;
}
.moreItems {
.more-items {
background: #8bcc60;
}
.lessItems {
.less-items {
background: #f92828;
}
@ -1036,7 +1036,7 @@
}
}
&__noItems {
&__no-items {
font-weight: 500;
font-size: 25px;
transform: scaleY(-1);
@ -1046,12 +1046,12 @@
}
}
&__noTasks {
&__no-tasks {
display: flex;
flex-direction: column;
transform: scaleY(-1);
&Info {
&-info {
display: flex;
align-items: center;
margin-bottom: 15px;
@ -1068,7 +1068,7 @@
}
}
&More {
&-more {
font-size: 14px;
line-height: 22px;
}
@ -1138,14 +1138,14 @@
display: flex;
}
&__allTasks {
&__all-tasks {
max-width: 1160px;
padding: 0 20px;
margin: 0 auto;
display: flex;
flex-direction: column;
.taskList {
.task-list {
&__head {
display: flex;
justify-content: space-between;
@ -1548,7 +1548,7 @@
}
}
&__tasksWrapper {
&__tasks-wrapper {
margin-top: 20px;
display: flex;
flex-direction: column;
@ -1580,7 +1580,7 @@
}
}
&__completeTask {
&__complete-task {
display: flex;
justify-content: space-between;
align-items: center;
@ -1598,7 +1598,7 @@
color: #111112;
}
.completeTask__title {
.complete-task__title {
font-weight: 700;
font-size: 18px;
line-height: 32px;
@ -1857,7 +1857,7 @@
}
}
&__noItem {
&__no-item {
padding: 23px 0 19px;
color: #6f6f6f;