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

feature/FOUR-15039: The styles of the options in Welcome Screen are not the same as in figma #1573

Merged
merged 8 commits into from
Apr 18, 2024
Merged

feature/FOUR-15039: The styles of the options in Welcome Screen are not the same as in figma #1573

Changes from all commits
Commits
Show all changes
8 commits
Select commit Hold shift + click to select a range
ace8cdc
feature/FOUR-15039
luNunezProcessmaker Apr 16, 2024
5853607
feature/FOUR-15039
luNunezProcessmaker Apr 16, 2024
9031f49
feature/FOUR-15039
luNunezProcessmaker Apr 17, 2024
451a803
Merge branch 'next' of github.com:ProcessMaker/screen-builder into fe…
luNunezProcessmaker Apr 17, 2024
d31fe8b
feature/FOUR-15039
luNunezProcessmaker Apr 17, 2024
f7785f5
feature/FOUR-15039
luNunezProcessmaker Apr 17, 2024
a62b1ce
feature/FOUR-15039
luNunezProcessmaker Apr 17, 2024
0bd3ce5
feature/FOUR-15039
luNunezProcessmaker Apr 17, 2024
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
104 changes: 78 additions & 26 deletions src/components/renderer/form-list-table.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,19 +14,27 @@
{{ $t(title) }}
</p>
<template v-if="dataControl.dropdownShow === 'requests'">
<b-dropdown variant="outline-secondary" no-caret>
<b-dropdown
variant="outline-secondary"
right
no-caret
>
<template #button-content>
<i class="fas fa-caret-down" />
</template>
<b-dropdown-item
@click="handleDropdownSelection('requests_filter', 'by_me')"
>
{{ $t("As Requester") }}
<span class="item-text">
{{ $t("As Requester") }}
</span>
</b-dropdown-item>
<b-dropdown-item
@click="handleDropdownSelection('requests_filter', 'as_participant')"
>
{{ $t("As Participant") }}
<span class="item-text">
{{ $t("As Participant") }}
</span>
</b-dropdown-item>
</b-dropdown>
</template>
Expand All @@ -38,68 +46,92 @@
<div class="ml-auto d-flex align-items-center">
<template v-if="dataControl.dropdownShow === 'requests'">
<div class="mr-4">
<b-dropdown variant="outline-secondary" size="sm">
<b-dropdown
variant="outline-secondary"
size="sm"
>
<template #button-content>
<span class="text-capitalize">
<b-icon
v-if="showBadge"
icon="circle-fill"
class="mr-2"
:variant="badgeVariant"
/>
{{ $t(titleDropdown) }}
</span>
</template>
<b-dropdown-item
variant="success"
@click="
handleDropdownSelection('requests_dropdown', 'In Progress')
"
@click="handleDropdownSelection('requests_dropdown', 'all')"
>
<i class="fas fa-circle mr-2" />{{ $t("In Progress") }}
<span class="item-text">
{{ $t("View All") }}
</span>
</b-dropdown-item>
<b-dropdown-item
variant="primary"
@click="
handleDropdownSelection('requests_dropdown', 'Completed')
"
@click="handleDropdownSelection('requests_dropdown', 'Completed')"
>
<i class="fas fa-circle mr-2" />{{ $t("Completed") }}
<span class="item-text">
<i
class="fas fa-circle mr-2 text-primary"
/>
{{ $t("Completed") }}
</span>
</b-dropdown-item>
<b-dropdown-item
@click="handleDropdownSelection('requests_dropdown', 'all')"
@click="handleDropdownSelection('requests_dropdown', 'In Progress')"
>
{{ $t("View All") }}
<span class="item-text">
<i
class="fas fa-circle mr-2 text-success"
/>
{{ $t("In Progress") }}
</span>
</b-dropdown-item>
</b-dropdown>
</div>
</template>
<template v-if="dataControl.dropdownShow === 'tasks'">
<div class="mr-4">
<b-dropdown variant="outline-secondary" size="sm">
<b-dropdown
variant="outline-secondary"
size="sm"
>
<template #button-content>
<span class="text-capitalize">
<b-icon
v-if="showBadge"
icon="circle-fill"
class="mr-2"
:variant="badgeVariant"
/>
{{ $t(titleDropdown) }}
</span>
</template>
<b-dropdown-item
variant="warning"
@click="handleDropdownSelection('tasks', 'In Progress')"
>
<i class="fas fa-circle mr-2" />{{ $t("In Progress") }}
<b-dropdown-item @click="handleDropdownSelection('tasks', 'all')">
<span class="item-text">
{{ $t("View All") }}
</span>
</b-dropdown-item>
<b-dropdown-item
variant="danger"
@click="handleDropdownSelection('tasks', 'Overdue')"
>
<i class="fas fa-circle mr-2" />{{ $t("Overdue") }}
<span class="item-text">
<i
class="fas fa-circle mr-2 text-danger"
/>
{{ $t("Overdue") }}
</span>
</b-dropdown-item>
<b-dropdown-item @click="handleDropdownSelection('tasks', 'all')">
{{ $t("View All") }}
<b-dropdown-item
@click="handleDropdownSelection('tasks', 'In Progress')"
>
<span class="item-text">
<i
class="fas fa-circle mr-2 text-warning"
/>
{{ $t("In Progress") }}
</span>
</b-dropdown-item>
</b-dropdown>
</div>
Expand Down Expand Up @@ -327,4 +359,24 @@ export default {
.btn-outline-secondary {
border: none;
}

.item-text {
color: #42526E;
font-family: 'Open Sans', sans-serif;
font-size: 14px;
font-weight: 400;
line-height: 21px;
letter-spacing: -0.02em;
text-align: left;
}

.dropdown-menu {
padding: 10px;
width: 211px;
box-shadow: 0px 10px 20px 4px #00000021;
}

.dropdown-item {
padding: 10px 8px;
}
</style>
Loading