update logo

This commit is contained in:
2026-08-04 16:21:31 +07:00
parent 9b9c607fd1
commit ad80afbfdd
10 changed files with 40 additions and 21 deletions

Binary file not shown.

After

Width:  |  Height:  |  Size: 126 KiB

View File

@@ -4,6 +4,7 @@
<meta charset="UTF-8" /> <meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta name="color-scheme" content="light" /> <meta name="color-scheme" content="light" />
<link rel="icon" type="image/png" href="/image/logo_PNKX.png" />
<title>Robot Installer</title> <title>Robot Installer</title>
</head> </head>
<body> <body>

View File

@@ -5,7 +5,6 @@ import {
ArrowDownload20Regular as Download, ArrowDownload20Regular as Download,
ArrowSync20Regular as RefreshCcw, ArrowSync20Regular as RefreshCcw,
Board20Regular as Cpu, Board20Regular as Cpu,
Bot24Filled as PackageCheck,
Box20Regular as Box, Box20Regular as Box,
CheckmarkCircle20Filled as CheckCircle2, CheckmarkCircle20Filled as CheckCircle2,
Clipboard20Regular as Clipboard, Clipboard20Regular as Clipboard,
@@ -46,6 +45,7 @@ import {
queueRemove, queueRemove,
queueUpdate queueUpdate
} from './services/api.js'; } from './services/api.js';
import logoPnkx from '../image/logo_PNKX.png';
import './styles.css'; import './styles.css';
const SETTINGS_KEY = 'robot-installer-client-settings'; const SETTINGS_KEY = 'robot-installer-client-settings';
@@ -756,7 +756,7 @@ function App() {
<aside className="sidebar"> <aside className="sidebar">
<div className="brand-block"> <div className="brand-block">
<div className="brand-mark"> <div className="brand-mark">
<PackageCheck fontSize={20} aria-hidden="true" /> <img className="brand-logo" src={logoPnkx} alt="" />
</div> </div>
<div className="brand-copy"> <div className="brand-copy">
<strong>Robot Installer</strong> <strong>Robot Installer</strong>

View File

@@ -189,11 +189,17 @@ code {
} }
.brand-mark { .brand-mark {
background: var(--primary); background: transparent;
border-radius: var(--radius); flex: 0 0 auto;
color: var(--on-primary);
height: 38px; height: 38px;
width: 38px; width: 46px;
}
.brand-logo {
display: block;
height: 100%;
object-fit: contain;
width: 100%;
} }
.brand-copy { .brand-copy {
@@ -1556,12 +1562,10 @@ tbody tr.selected-row td.action-col {
} }
.brand-mark { .brand-mark {
background: var(--brand-accent); background: transparent;
border-radius: var(--radius-md);
box-shadow: none; box-shadow: none;
color: var(--neutral-0);
height: 40px; height: 40px;
width: 40px; width: 50px;
} }
.brand-copy strong, .brand-copy strong,

Binary file not shown.

After

Width:  |  Height:  |  Size: 126 KiB

View File

@@ -179,13 +179,19 @@ button:disabled {
.brand-mark { .brand-mark {
align-items: center; align-items: center;
background: var(--primary); background: transparent;
border-radius: var(--radius);
color: var(--on-primary);
display: inline-flex; display: inline-flex;
flex: 0 0 auto;
height: 38px; height: 38px;
justify-content: center; justify-content: center;
width: 38px; width: 46px;
}
.brand-logo {
display: block;
height: 100%;
object-fit: contain;
width: 100%;
} }
.brand-copy { .brand-copy {
@@ -2052,12 +2058,10 @@ tbody tr:hover td.action-col {
} }
.brand-mark { .brand-mark {
background: var(--brand-accent); background: transparent;
border-radius: var(--radius-md);
box-shadow: none; box-shadow: none;
color: var(--neutral-0);
height: 40px; height: 40px;
width: 40px; width: 50px;
} }
.brand-copy strong { .brand-copy strong {
@@ -2293,6 +2297,12 @@ tbody tr:hover {
padding: var(--space-lg); padding: var(--space-lg);
} }
.auth-brand .brand-mark {
background: var(--blue-900);
border-radius: var(--radius-md);
padding: 4px;
}
.auth-brand .brand-copy strong { .auth-brand .brand-copy strong {
color: var(--text-primary); color: var(--text-primary);
} }

View File

@@ -185,6 +185,7 @@ app.set('views', path.join(__dirname, 'views'));
app.use(express.urlencoded({ extended: true, limit: '32kb', parameterLimit: 100 })); app.use(express.urlencoded({ extended: true, limit: '32kb', parameterLimit: 100 }));
app.use(express.json({ limit: '32kb' })); app.use(express.json({ limit: '32kb' }));
app.use(express.static(path.join(__dirname, 'public'))); app.use(express.static(path.join(__dirname, 'public')));
app.use('/image', express.static(path.join(__dirname, 'image')));
app.use('/vendor/notiflix', express.static(path.join(__dirname, 'node_modules/notiflix/dist'))); app.use('/vendor/notiflix', express.static(path.join(__dirname, 'node_modules/notiflix/dist')));
app.use('/vendor/montserrat', express.static(path.join(__dirname, 'node_modules/@fontsource-variable/montserrat'))); app.use('/vendor/montserrat', express.static(path.join(__dirname, 'node_modules/@fontsource-variable/montserrat')));
app.use('/vendor/fluent-icons', express.static(path.join(__dirname, 'node_modules/@fluentui/svg-icons/icons'))); app.use('/vendor/fluent-icons', express.static(path.join(__dirname, 'node_modules/@fluentui/svg-icons/icons')));

View File

@@ -7,13 +7,14 @@
<link rel="stylesheet" href="/vendor/montserrat/index.css"> <link rel="stylesheet" href="/vendor/montserrat/index.css">
<link rel="stylesheet" href="/vendor/notiflix/notiflix-<%= notiflixVersion %>.min.css"> <link rel="stylesheet" href="/vendor/notiflix/notiflix-<%= notiflixVersion %>.min.css">
<link rel="stylesheet" href="/css/styles.css"> <link rel="stylesheet" href="/css/styles.css">
<link rel="icon" type="image/png" href="/image/logo_PNKX.png">
</head> </head>
<body class="auth-shell" <% if (notice) { %>data-notice-type="<%= notice.type %>" data-notice="<%= notice.message %>"<% } %>> <body class="auth-shell" <% if (notice) { %>data-notice-type="<%= notice.type %>" data-notice="<%= notice.message %>"<% } %>>
<main class="auth-page"> <main class="auth-page">
<section class="auth-panel"> <section class="auth-panel">
<div class="auth-brand"> <div class="auth-brand">
<div class="brand-mark"> <div class="brand-mark">
<span class="material-symbols-outlined">precision_manufacturing</span> <img class="brand-logo" src="/image/logo_PNKX.png" alt="">
</div> </div>
<div class="brand-copy"> <div class="brand-copy">
<strong>Robot Installer</strong> <strong>Robot Installer</strong>

View File

@@ -7,13 +7,14 @@
<link rel="stylesheet" href="/vendor/montserrat/index.css"> <link rel="stylesheet" href="/vendor/montserrat/index.css">
<link rel="stylesheet" href="/vendor/notiflix/notiflix-<%= notiflixVersion %>.min.css"> <link rel="stylesheet" href="/vendor/notiflix/notiflix-<%= notiflixVersion %>.min.css">
<link rel="stylesheet" href="/css/styles.css"> <link rel="stylesheet" href="/css/styles.css">
<link rel="icon" type="image/png" href="/image/logo_PNKX.png">
</head> </head>
<body class="auth-shell" <% if (notice) { %>data-notice-type="<%= notice.type %>" data-notice="<%= notice.message %>"<% } %>> <body class="auth-shell" <% if (notice) { %>data-notice-type="<%= notice.type %>" data-notice="<%= notice.message %>"<% } %>>
<main class="auth-page"> <main class="auth-page">
<section class="auth-panel"> <section class="auth-panel">
<div class="auth-brand"> <div class="auth-brand">
<div class="brand-mark"> <div class="brand-mark">
<span class="material-symbols-outlined">precision_manufacturing</span> <img class="brand-logo" src="/image/logo_PNKX.png" alt="">
</div> </div>
<div class="brand-copy"> <div class="brand-copy">
<strong>Robot Installer</strong> <strong>Robot Installer</strong>

View File

@@ -7,12 +7,13 @@
<link rel="stylesheet" href="/vendor/montserrat/index.css"> <link rel="stylesheet" href="/vendor/montserrat/index.css">
<link rel="stylesheet" href="/vendor/notiflix/notiflix-<%= notiflixVersion %>.min.css"> <link rel="stylesheet" href="/vendor/notiflix/notiflix-<%= notiflixVersion %>.min.css">
<link rel="stylesheet" href="/css/styles.css"> <link rel="stylesheet" href="/css/styles.css">
<link rel="icon" type="image/png" href="/image/logo_PNKX.png">
</head> </head>
<body class="app-shell" <% if (notice) { %>data-notice-type="<%= notice.type %>" data-notice="<%= notice.message %>"<% } %>> <body class="app-shell" <% if (notice) { %>data-notice-type="<%= notice.type %>" data-notice="<%= notice.message %>"<% } %>>
<aside id="appSidebar" class="sidebar" aria-label="Main navigation"> <aside id="appSidebar" class="sidebar" aria-label="Main navigation">
<div class="brand-block"> <div class="brand-block">
<div class="brand-mark"> <div class="brand-mark">
<span class="material-symbols-outlined">precision_manufacturing</span> <img class="brand-logo" src="/image/logo_PNKX.png" alt="">
</div> </div>
<div class="brand-copy"> <div class="brand-copy">
<strong>Robot Installer</strong> <strong>Robot Installer</strong>