modified: begushiybashkir/bbvue/src/views/About.vue

about add getUrl method
This commit is contained in:
2025-10-07 04:16:22 +05:00
parent 400a95786d
commit e2fe264657
+66 -61
View File
@@ -15,19 +15,21 @@
<div class="info-content">
<h2>Наша философия</h2>
<p class="lead">
Мы верим, что бег это не просто спорт, а образ жизни, который объединяет людей,
Мы верим, что бег это не просто спорт, а образ жизни, который объединяет людей,
укрепляет здоровье и открывает новые горизонты.
</p>
<div class="mission-vision">
<div class="mission-card">
<h3>🎯 Наша миссия</h3>
<p>Сделать бег доступным и enjoyable для каждого жителя Уфы, независимо от возраста и уровня подготовки.</p>
<p>Сделать бег доступным и enjoyable для каждого жителя Уфы, независимо от возраста и уровня подготовки.
</p>
</div>
<div class="mission-card">
<h3>👁 Наше видение</h3>
<p>Стать крупнейшим беговым сообществом в Башкортостане, которое вдохновляет на здоровый образ жизни.</p>
<p>Стать крупнейшим беговым сообществом в Башкортостане, которое вдохновляет на здоровый образ жизни.
</p>
</div>
</div>
@@ -50,13 +52,9 @@
</div>
</div>
</div>
<div class="info-image">
<img
src="../assets/images/UMM2025.png"
alt="Команда бегового клуба Бегущий Башкир"
class="club-image"
>
<img src="../../public/images/UMM2025.png" alt="Команда бегового клуба Бегущий Башкир" class="club-image">
</div>
</div>
</div>
@@ -72,19 +70,19 @@
<h3>Поддержка</h3>
<p>Мы поддерживаем друг друга на каждом километре, как на тренировках, так и на соревнованиях.</p>
</div>
<div class="value-card">
<div class="value-icon">📈</div>
<h3>Развитие</h3>
<p>Помогаем каждому участнику прогрессировать и достигать личных рекордов.</p>
</div>
<div class="value-card">
<div class="value-icon">🌿</div>
<h3>Единение с природой</h3>
<p>Тренируемся в парках и на природе, наслаждаясь свежим воздухом Уфы.</p>
</div>
<div class="value-card">
<div class="value-icon">🏆</div>
<h3>Спортивный дух</h3>
@@ -98,25 +96,22 @@
<section class="section coach-section">
<div class="container">
<h2 class="section-title">Наш тренер</h2>
<div class="coach-profile">
<div class="coach-image">
<img
src="../assets/images/ZagirTrainer3.jpg"
alt="Аминев Загир - тренер бегового клуба Бегущий Башкир"
class="coach-photo"
>
<img :src="getImageUrl('/images/ZagirTrainer3.jpg')" alt="Аминев Загир - тренер бегового клуба Бегущий Башкир"
class="coach-photo">
<div class="coach-badges">
<span class="badge">Мастер спорта</span>
<span class="badge">КМС</span>
<span class="badge">Опыт 10+ лет</span>
</div>
</div>
<div class="coach-details">
<h3>Аминев Загир Рамилевич</h3>
<p class="coach-title">Основатель и главный тренер клуба</p>
<div class="coach-achievements">
<h4>Спортивные достижения:</h4>
<ul class="achievements-list">
@@ -127,16 +122,16 @@
<li>📚 Сертифицированный тренер по бегу</li>
</ul>
</div>
<div class="coach-philosophy">
<h4>Философия тренировок:</h4>
<blockquote>
"Бег должен приносить радость! Я помогаю каждому найти свой темп,
полюбить процесс и безопасно достигать целей. От первых 5 км до марафона —
"Бег должен приносить радость! Я помогаю каждому найти свой темп,
полюбить процесс и безопасно достигать целей. От первых 5 км до марафона —
мы пройдем этот путь вместе!"
</blockquote>
</div>
<div class="coach-stats">
<div class="coach-stat">
<div class="stat-value">500+</div>
@@ -160,14 +155,12 @@
<section class="section locations-section">
<div class="container">
<h2 class="section-title">Наши тренировочные базы</h2>
<div class="locations-grid">
<div class="location-card">
<div class="location-image">
<img
src="../assets/images/UfaWhiteRiver.jpg"
alt="Уфимская набережная (ост. Монумент) - основная тренировочная площадка"
>
<img src="../assets/images/UfaWhiteRiver.jpg"
alt="Уфимская набережная (ост. Монумент) - основная тренировочная площадка">
</div>
<div class="location-info">
<h3>🏞 Набережная </h3>
@@ -180,13 +173,10 @@
</div>
</div>
</div>
<div class="location-card">
<div class="location-image">
<img
src="../assets/images/dinamo.jpg"
alt="Стадион Динамо - для интервальных тренировок"
>
<img src="../assets/images/dinamo.jpg" alt="Стадион Динамо - для интервальных тренировок">
</div>
<div class="location-info">
<h3>🏟 Стадион "Динамо"</h3>
@@ -199,13 +189,10 @@
</div>
</div>
</div>
<div class="location-card">
<div class="location-image">
<img
src="../assets/images/i.webp"
alt="Лесопарковая зона - для длительных кроссов. Уфимское ожерелье"
>
<img src="../assets/images/i.webp" alt="Лесопарковая зона - для длительных кроссов. Уфимское ожерелье">
</div>
<div class="location-info">
<h3>🌲 Лесопарковая зона</h3>
@@ -267,14 +254,15 @@
Уфа, Республика Башкортостан
</div>
</div>
<div class="social-links">
<h3>📱 Мы в соцсетях</h3>
<div class="social-buttons">
<a href="https://www.instagram.com/begushiybashkir/" target="_blank" class="social-btn instagram">
📷 Instagram
</a>
<a href="https://www.youtube.com/channel/UCV45f8q172917848k05q6gA" target="_blank" class="social-btn youtube">
<a href="https://www.youtube.com/channel/UCV45f8q172917848k05q6gA" target="_blank"
class="social-btn youtube">
🎥 YouTube
</a>
<a href="https://t.me/begushiybashkir" target="_blank" class="social-btn telegram">
@@ -304,6 +292,15 @@ export default {
content: 'беговой клуб Уфа, тренер по бегу Уфа, Аминев Загир, тренировки бег Уфа, марафон Уфа, бег в Башкортостане'
}
]
},
methods: {
getImageUrl(path) {
// В продакшене замените на правильный путь
const baseUrl = import.meta.env.BASE_URL
// Путь от корня public/
console.log(`${baseUrl}images/${path}`)
return `${baseUrl}images/${path}`
},
}
}
</script>
@@ -380,7 +377,7 @@ export default {
background: white;
padding: 1.5rem;
border-radius: 10px;
box-shadow: 0 5px 15px rgba(0,0,0,0.1);
box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
border-left: 4px solid #2e8b57;
}
@@ -416,7 +413,7 @@ export default {
.club-image {
width: 100%;
border-radius: 15px;
box-shadow: 0 10px 30px rgba(0,0,0,0.2);
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2);
}
/* Ценности */
@@ -431,7 +428,7 @@ export default {
padding: 2rem;
border-radius: 15px;
text-align: center;
box-shadow: 0 5px 20px rgba(0,0,0,0.1);
box-shadow: 0 5px 20px rgba(0, 0, 0, 0.1);
transition: transform 0.3s ease;
}
@@ -468,7 +465,7 @@ export default {
.coach-photo {
width: 100%;
border-radius: 15px;
box-shadow: 0 10px 30px rgba(0,0,0,0.2);
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2);
}
.coach-badges {
@@ -487,7 +484,7 @@ export default {
border-radius: 20px;
font-size: 0.8rem;
font-weight: bold;
box-shadow: 0 3px 10px rgba(0,0,0,0.2);
box-shadow: 0 3px 10px rgba(0, 0, 0, 0.2);
}
.coach-details h3 {
@@ -546,7 +543,7 @@ blockquote {
padding: 1rem;
background: white;
border-radius: 10px;
box-shadow: 0 3px 10px rgba(0,0,0,0.1);
box-shadow: 0 3px 10px rgba(0, 0, 0, 0.1);
}
.stat-value {
@@ -571,7 +568,7 @@ blockquote {
background: white;
border-radius: 15px;
overflow: hidden;
box-shadow: 0 5px 20px rgba(0,0,0,0.1);
box-shadow: 0 5px 20px rgba(0, 0, 0, 0.1);
transition: transform 0.3s ease;
}
@@ -721,46 +718,54 @@ blockquote {
transform: translateY(-2px);
}
.instagram { background: #E4405F; }
.youtube { background: #CD201F; }
.telegram { background: #0088cc; }
.instagram {
background: #E4405F;
}
.youtube {
background: #CD201F;
}
.telegram {
background: #0088cc;
}
/* Адаптивность */
@media (max-width: 768px) {
.hero-title {
font-size: 2rem;
}
.info-grid {
grid-template-columns: 1fr;
gap: 2rem;
}
.stats-grid {
grid-template-columns: repeat(2, 1fr);
}
.coach-profile {
grid-template-columns: 1fr;
}
.coach-stats {
grid-template-columns: 1fr;
}
.locations-grid {
grid-template-columns: 1fr;
}
.contact-grid {
grid-template-columns: 1fr;
}
.cta-buttons {
flex-direction: column;
align-items: center;
}
.btn {
width: 100%;
max-width: 300px;