Docker/portainer
Docker/portainer
1
0
Fork 0
mirror of https://github.com/portainer/portainer.git synced 2025-07-23 07:19:41 +02:00
Code Issues Releases Activity

fix(home): EE-4874 homepage ui issues (#8319)

Browse source
This commit is contained in:
cmeng 2023-01-23 09:14:06 +13:00 • committed by GitHub
parent 07dd6bbe84
commit d04747b309
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
6 changed files with 26 additions and 6 deletions
Download patch file Download diff file Expand all files Collapse all files

4
app/assets/ico/heartbeat-down.svg Normal file
View file

@ -0,0 +1,4 @@
<svg width="16" height="15" viewBox="0 0 16 15" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M7.91895 2.19267C6.33456 0.34043 3.69255 -0.157821 1.70745 1.53828C-0.277637 3.23438 -0.557105 6.0702 1.0018 8.07617C2.17927 9.59131 5.52429 12.6331 7.0907 14.0309C7.37867 14.2878 7.52266 14.4164 7.69121 14.4669C7.83757 14.5108 8.00026 14.5108 8.14662 14.4669C8.31517 14.4164 8.45916 14.2878 8.74713 14.0309C10.3135 12.6331 13.6586 9.59131 14.836 8.07617C16.3949 6.0702 16.1496 3.21655 14.1304 1.53828C12.1112 -0.139975 9.50327 0.34043 7.91895 2.19267Z" fill="#D92D20"/>
<path d="M8.03754 9.71338L8.03754 4.94044M8.03754 9.71338L5.90125 7.57709M8.03754 9.71338L10.1738 7.57709" stroke="white" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 754 B

4
app/assets/ico/heartbeat-up.svg Normal file
View file

@ -0,0 +1,4 @@
<svg width="16" height="15" viewBox="0 0 16 15" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M7.91895 2.19267C6.33456 0.34043 3.69255 -0.157821 1.70745 1.53828C-0.277637 3.23438 -0.557105 6.0702 1.0018 8.07617C2.17927 9.59131 5.52429 12.6331 7.0907 14.0309C7.37867 14.2878 7.52266 14.4164 7.69121 14.4669C7.83757 14.5108 8.00026 14.5108 8.14662 14.4669C8.31517 14.4164 8.45916 14.2878 8.74713 14.0309C10.3135 12.6331 13.6586 9.59131 14.836 8.07617C16.3949 6.0702 16.1496 3.21655 14.1304 1.53828C12.1112 -0.139975 9.50327 0.34043 7.91895 2.19267Z" fill="#039855"/>
<path d="M8.03754 4.94043L8.03754 9.71337M8.03754 4.94043L10.1738 7.07672M8.03754 4.94043L5.90125 7.07672" stroke="white" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 754 B

3
app/react/components/EdgeIndicator.tsx
View file

@ -27,7 +27,7 @@ export function EdgeIndicator({
return ( return (
<span role="status" aria-label="edge-status"> <span role="status" aria-label="edge-status">
<EnvironmentStatusBadgeItem aria-label="unassociated"> <EnvironmentStatusBadgeItem aria-label="unassociated">
<s>associated</s> <span className="whitespace-nowrap">Not associated</span>
</EnvironmentStatusBadgeItem> </EnvironmentStatusBadgeItem>
</span> </span>
); );
@ -41,6 +41,7 @@ export function EdgeIndicator({
> >
<EnvironmentStatusBadgeItem <EnvironmentStatusBadgeItem
color={isValid ? 'success' : 'danger'} color={isValid ? 'success' : 'danger'}
icon={isValid ? 'svg-heartbeatup' : 'svg-heartbeatdown'}
aria-label="edge-heartbeat" aria-label="edge-heartbeat"
> >
heartbeat heartbeat

4
app/react/components/Svg.tsx
View file

@ -4,6 +4,8 @@ import darkmode from '@/assets/ico/theme/darkmode.svg?c';
import lightmode from '@/assets/ico/theme/lightmode.svg?c'; import lightmode from '@/assets/ico/theme/lightmode.svg?c';
import highcontrastmode from '@/assets/ico/theme/highcontrastmode.svg?c'; import highcontrastmode from '@/assets/ico/theme/highcontrastmode.svg?c';
// general icons // general icons
import heartbeatup from '@/assets/ico/heartbeat-up.svg?c';
import heartbeatdown from '@/assets/ico/heartbeat-down.svg?c';
import checked from '@/assets/ico/checked.svg?c'; import checked from '@/assets/ico/checked.svg?c';
import dataflow from '@/assets/ico/dataflow-1.svg?c'; import dataflow from '@/assets/ico/dataflow-1.svg?c';
import git from '@/assets/ico/git.svg?c'; import git from '@/assets/ico/git.svg?c';
@ -44,6 +46,8 @@ import quay from '@/assets/ico/vendor/quay.svg?c';
const placeholder = Placeholder; const placeholder = Placeholder;
export const SvgIcons = { export const SvgIcons = {
heartbeatup,
heartbeatdown,
automode, automode,
darkmode, darkmode,
lightmode, lightmode,

2
app/react/components/datatables/SearchBar.tsx
View file

@ -32,7 +32,7 @@ export function SearchBar({
return ( return (
<div <div
className={clsx('searchBar items-center flex min-w-[90px]', className)} className={clsx('searchBar items-center flex min-w-[350px]', className)}
> >
<Search className="searchIcon lucide shrink-0" /> <Search className="searchIcon lucide shrink-0" />
<input <input

15
app/react/portainer/environments/wizard/EnvironmentsCreationView/WizardEndpointsList/WizardEndpointsList.module.css
View file

@ -1,10 +1,10 @@
.wizard-list-wrapper { .wizard-list-wrapper {
display: grid; display: grid;
grid-template-columns: 50px 1fr; grid-template-columns: 50px 1fr 70px;
grid-template-areas: grid-template-areas:
'image title' 'image title title'
'image subtitle' 'image subtitle edgeStatus'
'image type'; 'image type type';
border: 1px solid rgb(221, 221, 221); border: 1px solid rgb(221, 221, 221);
border-radius: 5px; border-radius: 5px;
margin-bottom: 10px; margin-bottom: 10px;
@ -13,6 +13,13 @@
box-shadow: 0 3px 10px -2px rgb(161 170 166 / 20%); box-shadow: 0 3px 10px -2px rgb(161 170 166 / 20%);
} }
.wizard-list-edge-status {
grid-area: edgeStatus;
display: flex;
justify-content: flex-end;
align-items: center;
}
.wizard-list-image { .wizard-list-image {
grid-area: image; grid-area: image;
font-size: 35px; font-size: 35px;