valitovgaziz/tp
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

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

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