admin/nahodka-front
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

added logo and bagFix

Browse Source
This commit is contained in:
SlimusMinus
2026-08-31 01:03:41 +03:00
parent 4287a5731b
commit 7e33552993
10 changed files with 319 additions and 39 deletions
Download Patch File Download Diff File Expand all files Collapse all files

BIN
src/assets/main name.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 184 KiB

268
src/components/NahodkaLogo.jsx Normal file
View File

@@ -0,0 +1,268 @@
import React from "react";
export default function NahodkaLogo({
width = 760,
height = 360,
className,
}) {
return (
<svg
className={className}
width={width}
height={height}
viewBox="-40 100 760 200"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<defs>
{/* ========================= */}
{/* ЦВЕТ БУКВ */}
{/* ========================= */}
<linearGradient
id="coral"
x1="0"
y1="0"
x2="0"
y2="1"
>
<stop offset="0%" stopColor="#E99A78" />
<stop offset="100%" stopColor="#D97956" />
</linearGradient>
{/* ========================= */}
{/* РАМКА ЛУПЫ */}
{/* ========================= */}
<linearGradient
id="magnifier"
x1="0"
y1="0"
x2="0"
y2="1"
>
<stop offset="0%" stopColor="#EA9B78" />
<stop offset="100%" stopColor="#D57250" />
</linearGradient>
{/* ========================= */}
{/* СТЕКЛО */}
{/* ========================= */}
<radialGradient id="glass">
<stop offset="0%" stopColor="#FFFDF8" />
<stop offset="100%" stopColor="#F3E9DA" />
</radialGradient>
{/* ========================= */}
{/* РУЧКА */}
{/* ========================= */}
<linearGradient
id="handle"
x1="0"
y1="0"
x2="1"
y2="1"
>
<stop offset="0%" stopColor="#86A383" />
<stop offset="100%" stopColor="#617D68" />
</linearGradient>
{/* ========================= */}
{/* ТЕНЬ */}
{/* ========================= */}
<filter
id="shadow"
x="-30%"
y="-30%"
width="160%"
height="180%"
>
<feDropShadow
dx="0"
dy="5"
stdDeviation="5"
floodColor="#8F4938"
floodOpacity="0.25"
/>
</filter>
<filter
id="magnifierShadow"
x="-40%"
y="-40%"
width="180%"
height="200%"
>
<feDropShadow
dx="0"
dy="5"
stdDeviation="4"
floodColor="#8F4938"
floodOpacity="0.3"
/>
</filter>
</defs>
{/* ===================================================== */}
{/* ЛЕВАЯ ЧАСТЬ — "НАХ" */}
{/* ===================================================== */}
<g
fill="url(#coral)"
filter="url(#shadow)"
fontFamily="Nunito, Arial Rounded MT Bold, Arial, sans-serif"
fontSize="135"
fontWeight="800"
>
<text
x="30"
y="225"
letterSpacing="1"
>
Нах
</text>
</g>
{/* ===================================================== */}
{/* ЛУПА — "О" */}
{/* ===================================================== */}
<g
transform="translate(352 190)"
filter="url(#magnifierShadow)"
>
{/* Ручка */}
<rect
x="34"
y="70"
width="28"
height="105"
rx="14"
transform="rotate(-43 34 70)"
fill="url(#handle)"
stroke="#D97956"
strokeWidth="6"
/>
{/* Внешняя рамка */}
<circle
cx="0"
cy="0"
r="70"
fill="url(#magnifier)"
/>
{/* Внутренняя рамка */}
<circle
cx="0"
cy="0"
r="58"
fill="#F7EEDF"
/>
{/* Стекло */}
<circle
cx="0"
cy="0"
r="53"
fill="url(#glass)"
/>
{/* Блик */}
<ellipse
cx="-22"
cy="-25"
rx="8"
ry="15"
transform="rotate(35 -22 -25)"
fill="white"
opacity="0.65"
/>
{/* ================================================= */}
{/* ЛАПКА */}
{/* ================================================= */}
<g transform="translate(0 15)">
<path
d="
M 0 25
C -8 18 -25 12 -25 -2
C -25 -13 -14 -18 -5 -12
L 0 -8
L 5 -12
C 14 -18 25 -13 25 -2
C 25 12 8 18 0 25
Z
"
fill="#E8D3B0"
/>
<ellipse
cx="-22"
cy="-20"
rx="7"
ry="10"
fill="#E8D3B0"
transform="rotate(-25 -22 -20)"
/>
<ellipse
cx="-7"
cy="-29"
rx="7"
ry="11"
fill="#E8D3B0"
/>
<ellipse
cx="9"
cy="-29"
rx="7"
ry="11"
fill="#E8D3B0"
/>
<ellipse
cx="23"
cy="-20"
rx="7"
ry="10"
fill="#E8D3B0"
transform="rotate(25 23 -20)"
/>
</g>
</g>
{/* ===================================================== */}
{/* ПРАВАЯ ЧАСТЬ — "ДКА" */}
{/* ===================================================== */}
{/* ПРАВАЯ ЧАСТЬ — "ДКА" */}
<g
fill="url(#coral)"
filter="url(#shadow)"
fontFamily="Nunito, Arial Rounded MT Bold, Arial, sans-serif"
fontSize="135"
fontWeight="800"
>
<text
x="436"
y="225"
letterSpacing="1"
>
дка
</text>
</g>
</svg>
);
}

3
src/components/Sidebar.jsx
View File

@@ -1,5 +1,4 @@
import { useState } from "react";
import LogoIcon from "./icons/LogoIcon";
import GlobeIcon from "./icons/GlobeIcon";
import SunIcon from "./icons/SunIcon";
import MoonIcon from "./icons/MoonIcon";
@@ -67,8 +66,6 @@ export default function Sidebar({
<div className={`f-overlay${open ? " show" : ""}`} onClick={onClose} />
<div className={`f-sidebar${open ? " open" : ""}`}>
<div className="f-sb-head">
<div className="f-sb-logo"><LogoIcon /></div>
<span className="f-sb-name">{t('app.name')}</span>
</div>
<nav className="f-sb-nav">
{NAV_ITEMS.map(({ icon, key: itemKey, labelKey }) => {

3
src/components/feed/FeedTopBar.jsx
View File

@@ -2,6 +2,7 @@ import { useState, useRef, useEffect } from "react";
import { motion, AnimatePresence } from "framer-motion";
import AppTopBar from "../layout/AppTopBar";
import { useTranslation } from "react-i18next";
import NahodkaLogo from "../NahodkaLogo";
export default function FeedTopBar({ onMenuClick, typeFilter, onTypeFilterChange }) {
const { t } = useTranslation();
@@ -46,7 +47,7 @@ export default function FeedTopBar({ onMenuClick, typeFilter, onTypeFilterChange
className="f-topbar-dropdown-btn"
onClick={() => setOpen((v) => !v)}
>
<span>{t("app.name")}</span>
<NahodkaLogo className="f-topbar-logo" width={100} height={40} />
<svg
className={`f-topbar-chevron${open ? " open" : ""}`}
viewBox="0 0 24 24"

5
src/components/landing/Navbar.jsx
View File

@@ -1,4 +1,5 @@
import { useTranslation } from 'react-i18next';
import NahodkaLogo from "../NahodkaLogo";
import GlobeIcon from "../icons/GlobeIcon";
import MoonIcon from "../icons/MoonIcon";
import SunIcon from "../icons/SunIcon";
@@ -12,7 +13,9 @@ export default function Navbar({ onLoginClick }) {
return (
<nav className="nk-nav">
<span className="nk-logo">{t('app.name')}</span>
<div className="nk-logo">
<NahodkaLogo />
</div>
<div className="nk-nav-right">
<button className="nk-theme-btn" onClick={toggleTheme} title={theme === 'dark' ? t('sidebar.lightTheme') : t('sidebar.darkTheme')}>

37
src/styles/NakhodkaLanding.css
View File

@@ -132,26 +132,33 @@
position: relative;
z-index: 2;
display: flex;
justify-content: space-between;
align-items: center;
padding: 8px 10px 8px 4px;
flex-wrap: nowrap;
width: 100%;
padding: 8px 12px;
border-radius: 999px;
background: rgba(var(--nk-signal-rgb), 0.02);
border: 1px solid transparent;
}
.nk-logo {
font-family: 'Fraunces', serif;
font-size: 21px;
font-weight: 600;
letter-spacing: -0.01em;
color: var(--text-primary);
display: flex;
align-items: center;
flex-shrink: 0;
}
.nk-logo svg {
height: 80px;
width: auto;
display: block;
}
.nk-nav-right {
display: flex;
align-items: center;
gap: 8px;
flex-shrink: 0;
margin-left: auto;
}
.nk-lang-btn,
@@ -286,16 +293,6 @@
font-weight: 600;
}
.nk-eyebrow::before {
content: '';
width: 7px;
height: 7px;
border-radius: 50%;
background: var(--nk-signal);
box-shadow: 0 0 0 3px rgba(var(--nk-signal-rgb), 0.18);
flex-shrink: 0;
}
.nk-h1 {
font-family: 'Fraunces', serif;
font-weight: 600;
@@ -453,12 +450,12 @@
}
.nk-nav {
padding: 4px;
padding: 0;
background: none;
}
.nk-logo {
font-size: 19px;
.nk-logo svg {
height: 64px;
}
.nk-hero-text {

14
src/styles/card.css
View File

@@ -219,13 +219,11 @@
/* ── Footer (phone + owner actions) ── */
.f-card-foot {
display: flex; flex-direction: row; align-items: center; justify-content: center;
display: flex; flex-direction: row; align-items: center; justify-content: space-between;
gap: 10px; padding: 10px 16px 12px;
}
.f-card-foot-left { display: flex; align-items: center; }
.f-card-foot-right { display: flex; align-items: center; }
.f-card-phone {
color: var(--teal); font-size: .75rem; font-weight: 700;
color: var(--teal); font-size: .85rem; font-weight: 700;
text-decoration: none; display: flex; align-items: center; gap: 4px;
white-space: nowrap;
}
@@ -235,9 +233,9 @@
display: flex; align-items: center; gap: 5px;
background: rgba(var(--teal-rgb), .1);
border: 1px solid rgba(var(--teal-rgb), .3);
border-radius: 999px; padding: 6px 20px;
border-radius: 999px; padding: 12px 34px;
cursor: pointer; font-family: var(--font);
font-size: .75rem; font-weight: 700;
font-size: .95rem; font-weight: 700;
color: var(--teal); transition: all .2s;
white-space: nowrap;
}
@@ -390,7 +388,7 @@
@media (max-width: 600px) {
.f-card-contact {
padding: 5px 16px;
font-size: .7rem;
padding: 12px 34px;
font-size: .95rem;
}
}

3
src/styles/layout.css
View File

@@ -129,7 +129,7 @@
z-index: 10;
}
.f-topbar-dropdown-btn {
display: inline-flex; align-items: center; gap: 4px;
display: inline-flex; align-items: center; justify-content: center; gap: 4px;
background: none; border: none; cursor: pointer;
color: var(--text-primary);
font-family: var(--font); font-weight: 900; font-size: 1.25rem;
@@ -138,6 +138,7 @@
transition: background .15s;
}
.f-topbar-dropdown-btn:hover { background: var(--hover-bg); }
.f-topbar-logo { height: auto; display: block; min-width: 0; max-width: 100%; flex-shrink: 1; }
.f-topbar-chevron {
width: 18px; height: 18px; flex-shrink: 0;

23
src/styles/modal.css
View File

@@ -284,16 +284,24 @@
.f-modal:not(.auth-modal) {
width: 100%;
max-height: 92vh;
max-height: calc(100dvh - env(safe-area-inset-top, 0px) - 8px);
border-radius: 20px 20px 0 0;
padding: 20px 16px 32px; /* 32px снизу — отступ от home indicator */
padding: calc(20px + env(safe-area-inset-top, 0px)) 16px calc(32px + env(safe-area-inset-bottom, 0px));
}
.auth-modal {
width: 100%;
max-height: 80vh;
max-height: calc(80dvh - env(safe-area-inset-top, 0px));
border-radius: 20px;
padding: 20px 16px 32px;
padding: calc(20px + env(safe-area-inset-top, 0px)) 16px calc(32px + env(safe-area-inset-bottom, 0px));
}
}
/* Safe-area: не даём верху модалки уходить под вырез/браузерную панель на iOS */
@supports (padding-top: env(safe-area-inset-top)) {
.f-modal-bg {
padding-top: env(safe-area-inset-top, 0px);
padding-bottom: env(safe-area-inset-bottom, 0px);
}
}
@@ -430,6 +438,13 @@
.f-post-detail-modal .f-card-foot {
padding: 8px 14px;
}
.f-app.f-map-view .f-card-foot .f-card-phone {
font-size: .75rem;
}
.f-app.f-map-view .f-card-contact {
padding: 8px 20px;
font-size: .75rem;
}
.f-post-detail-close {
position: absolute;
top: 12px;

2
src/styles/sidebar.css
View File

@@ -1,7 +1,7 @@
/* ── Left Navigation (Instagram-style) ── */
.f-sb-head {
padding: 16px 20px 20px;
padding: 0;
display: flex; align-items: center; gap: 11px;
}
.f-sb-logo {