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

Merge pull request #58 from SlimusMinus/add-logo

Browse Source 
added logo and bagFix
This commit is contained in:
SlimusMinus
2026-08-31 01:04:26 +03:00
committed by GitHub
parent 4287a5731b 7e33552993
commit b28ae651b3
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 {