tailwind.config = {
prefix: 'ros-',
darkMode: ['selector', '.ros-dark'],
theme: {
extend: {
colors: {
bg: 'var(--c-bg)',
surface: 'var(--c-surface)',
text: 'var(--c-text)',
muted: 'var(--c-muted)',
border: 'var(--c-border)',
cyan: { 400: '#22d3ee', 500: '#06b6d4', 600: '#0891b2', 900: '#164e63' },
purple: { 400: '#c084fc', 500: '#a855f7', 600: '#9333ea', 900: '#581c87' },
},
fontFamily: {
sans: ['Inter', 'ui-sans-serif', 'system-ui', 'sans-serif'],
display: ['Montserrat', 'ui-sans-serif', 'system-ui', 'sans-serif'],
},
animation: {
'float': 'float 6s ease-in-out infinite',
},
keyframes: {
'float': {
'0%, 100%': { transform: 'translateY(0)' },
'50%': { transform: 'translateY(-10px)' },
}
}
}
}
}
.ros-immersive-container {
/* Light Mode Vars */
--c-bg: #f8fafc;
--c-surface: #ffffff;
--c-text: #0f172a;
--c-muted: #475569;
--c-border: rgba(0, 0, 0, 0.1);
--glass-bg: rgba(255, 255, 255, 0.8);
--glass-border: rgba(0, 0, 0, 0.05);
--glass-shadow: 0 4px 20px rgba(0, 0, 0, 0.05);
--blob-opacity: 0.1;
all: initial;
font-family: 'Inter', sans-serif;
background-color: var(--c-bg);
color: var(--c-text);
line-height: 1.6;
width: 100%;
display: block;
overflow-x: hidden;
position: relative;
box-sizing: border-box;
transition: background-color 0.5s ease, color 0.5s ease;
}.ros-immersive-container.ros-dark {
/* Dark Mode Vars */
--c-bg: #050510;
--c-surface: #0a0a1a;
--c-text: #e2e8f0;
--c-muted: #94a3b8;
--c-border: rgba(255, 255, 255, 0.1);
--glass-bg: rgba(255, 255, 255, 0.03);
--glass-border: rgba(255, 255, 255, 0.05);
--glass-shadow: 0 4px 30px rgba(0, 0, 0, 0.3);
--blob-opacity: 0.25;
}
.ros-immersive-container * { box-sizing: border-box; }
.ros-immersive-container h1, .ros-immersive-container h2 { font-family: 'Montserrat', sans-serif; }/* Glassmorphism */
.ros-glass-card {
background: var(--glass-bg);
backdrop-filter: blur(12px);
-webkit-backdrop-filter: blur(12px);
border: 1px solid var(--glass-border);
box-shadow: var(--glass-shadow);
transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}
.ros-glass-card:hover {
transform: translateY(-3px);
border-color: rgba(34, 211, 238, 0.4);
}/* Utils */
.ros-reveal { opacity: 0; transform: translateY(20px); transition: all 0.8s ease-out; }
.ros-reveal.active { opacity: 1; transform: translateY(0); }
/* Elements */
.ros-blob {
position: absolute; border-radius: 50%; z-index: 0; pointer-events: none;
filter: blur(80px); opacity: var(--blob-opacity);
transition: opacity 0.5s ease;
}
.ros-theme-toggle {
position: fixed; bottom: 20px; right: 20px; z-index: 100;
background: var(--c-surface); border: 1px solid var(--c-border);
color: var(--c-text); padding: 10px; border-radius: 50%;
cursor: pointer; box-shadow: 0 5px 15px rgba(0,0,0,0.1);
transition: all 0.3s ease;
}
.ros-theme-toggle:hover { transform: scale(1.1); }
Về Chúng Tôi
ABOUT ROS VIETNAM
"Một cộng đồng Robotics, không chỉ là ROS"
Chúng Tôi Là Ai?
ROS Vietnam là cộng đồng độc lập, phi lợi nhuận, hoạt động theo định hướng open-source.
ROS và ROS 2 là nền tảng cốt lõi, nhưng chúng tôi nhìn robotics như một hệ thống hoàn chỉnh — từ phần cứng, điều khiển đến AI và triển khai thực tế.
Vì Sao Tồn Tại?
"Robotics không thể phát triển chỉ bằng tutorial rời rạc hay demo ngắn hạn."
-
Kết nối: Tri thức – Con người – Dự án
-
Xây dựng năng lực robotics dài hạn
-
Đưa kiến thức open-source vào hệ thống thực
Chúng Tôi Tin Vào
Kỹ Thuật
Technical First. Nền tảng kỹ thuật vững chắc là ưu tiên.
Chất Lượng
Chất lượng hơn số lượng. Không chạy theo xu hướng.
Mở & Kỷ Luật
Open-source nhưng có quy trình và trách nhiệm.
Thực Tế
Học hỏi từ thực tế triển khai, không chỉ lý thuyết.
* ROS Vietnam không phải tổ chức thương mại & không đại diện cho bất kỳ công ty nào.
Phạm Vi Tập Trung
Full Robotics Stack
ROS 2 & Distributed
Hardware & Embedded
AI & Perception
Sim & Twin
Real-world Deployment
Cộng Đồng
ROS Vietnam được xây dựng bởi:
- • Kỹ sư Robotics
- • Nhà nghiên cứu & Giảng viên
- • Sinh viên & Maker
- • Startup & Doanh nghiệp
Độc Lập & Minh Bạch
-
Hoạt động độc lập, phi lợi nhuận.
-
Minh bạch trong quản trị.
-
Tuân thủ chuẩn mực Open-source.
Bạn Đã Sẵn Sàng?
Nếu bạn quan tâm đến robotics nghiêm túc — từ phần cứng đến phần mềm — ROS Vietnam là nơi bạn thuộc về.
"Cộng đồng mạnh không được xây dựng bằng công cụ.
Nó được xây dựng bằng con người và năng lực kỹ thuật."
© 2026 ROS Vietnam.
if (typeof lucide !== 'undefined') lucide.createIcons();// Toggle Logic
const root = document.getElementById('ros-about-root');
const btn = document.getElementById('ros-about-toggle');
const moonIcon = document.getElementById('ros-icon-moon');
const sunIcon = document.getElementById('ros-icon-sun');// Default Check
let isDark = root.classList.contains('ros-dark');
updateIcons();btn.addEventListener('click', () => {
isDark = !isDark;
if(isDark) root.classList.add('ros-dark');
else root.classList.remove('ros-dark');
updateIcons();
});function updateIcons() {
if(isDark) {
moonIcon.classList.add('ros-hidden');
sunIcon.classList.remove('ros-hidden');
} else {
moonIcon.classList.remove('ros-hidden');
sunIcon.classList.add('ros-hidden');
}
}// Reveal Animation
const observer = new IntersectionObserver((entries) => {
entries.forEach(entry => {
if (entry.isIntersecting) entry.target.classList.add('active');
});
}, { threshold: 0.1 });
document.querySelectorAll('.ros-reveal').forEach(el => observer.observe(el));