diff --git a/css/styles.css b/css/styles.css
index ad06417..47c5bfa 100644
--- a/css/styles.css
+++ b/css/styles.css
@@ -1,1032 +1,401 @@
-/* ========================================
- Paraguay LLC & SRL — Community Site
- Vibrant, fun, modern design
- ======================================== */
-
+/* Facebook Style — Blue social network */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
-
-:root {
- --black: #0f172a;
- --white: #ffffff;
- --blue: #2563eb;
- --blue-light: #3b82f6;
- --blue-dark: #1d4ed8;
- --teal: #0d9488;
- --green: #16a34a;
- --orange: #ea580c;
- --purple: #7c3aed;
- --pink: #db2777;
- --yellow: #eab308;
- --gray-50: #f8fafc;
- --gray-100: #f1f5f9;
- --gray-200: #e2e8f0;
- --gray-300: #cbd5e1;
- --gray-400: #94a3b8;
- --gray-500: #64748b;
- --gray-600: #475569;
- --gray-700: #334155;
- --gray-800: #1e293b;
- --shadow-sm: 0 1px 2px rgba(0,0,0,0.05);
- --shadow: 0 4px 6px -1px rgba(0,0,0,0.1), 0 2px 4px -2px rgba(0,0,0,0.1);
- --shadow-md: 0 10px 15px -3px rgba(0,0,0,0.1), 0 4px 6px -4px rgba(0,0,0,0.1);
- --shadow-lg: 0 20px 25px -5px rgba(0,0,0,0.1), 0 8px 10px -6px rgba(0,0,0,0.1);
- --shadow-xl: 0 25px 50px -12px rgba(0,0,0,0.25);
- --radius: 12px;
- --radius-lg: 16px;
- --radius-xl: 24px;
-}
-
-html { scroll-behavior: smooth; }
body {
- font-family: 'Inter', system-ui, sans-serif;
- background: var(--gray-50);
- color: var(--black);
- line-height: 1.6;
- overflow-x: hidden;
+ font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
+ background: #f0f2f5;
+ color: #1c1e21;
+ line-height: 1.33;
+ font-size: 15px;
}
-/* ========================================
- NAVIGATION
- ======================================== */
+/* Navigation */
.nav {
- position: fixed;
+ background: #fff;
+ box-shadow: 0 2px 4px rgba(0,0,0,0.1);
+ height: 56px;
+ position: sticky;
top: 0;
- left: 0;
- right: 0;
z-index: 1000;
- background: rgba(255,255,255,0.85);
- backdrop-filter: blur(12px);
- -webkit-backdrop-filter: blur(12px);
- border-bottom: 1px solid var(--gray-200);
- transition: all 0.3s ease;
-}
-.nav.scrolled {
- background: rgba(255,255,255,0.95);
- box-shadow: var(--shadow);
+ padding: 0 16px;
}
.nav-container {
max-width: 1200px;
margin: 0 auto;
- padding: 0 24px;
display: flex;
align-items: center;
justify-content: space-between;
- height: 64px;
+ height: 100%;
}
.nav-brand {
display: flex;
align-items: center;
gap: 10px;
text-decoration: none;
- color: var(--black);
-}
-.nav-logo { font-size: 1.5rem; }
-.nav-title {
- font-weight: 800;
- font-size: 1.1rem;
- background: linear-gradient(135deg, var(--blue), var(--teal));
- -webkit-background-clip: text;
- -webkit-text-fill-color: transparent;
- background-clip: text;
-}
-.nav-menu {
- display: flex;
- align-items: center;
- gap: 8px;
+ color: #1877f2;
+ font-size: 24px;
+ font-weight: 700;
}
+.nav-logo { font-size: 28px; }
+.nav-menu { display: flex; gap: 8px; align-items: center; }
.nav-link {
+ color: #65676b;
text-decoration: none;
- color: var(--gray-600);
+ font-size: 15px;
font-weight: 500;
- font-size: 0.9rem;
- padding: 8px 14px;
- border-radius: 8px;
- transition: all 0.2s ease;
-}
-.nav-link:hover {
- color: var(--blue);
- background: rgba(37,99,235,0.08);
-}
-.nav-actions {
- display: flex;
- align-items: center;
- gap: 8px;
- margin-left: 16px;
- padding-left: 16px;
- border-left: 1px solid var(--gray-200);
-}
-.nav-toggle {
- display: none;
- flex-direction: column;
- gap: 5px;
- background: none;
- border: none;
- cursor: pointer;
- padding: 4px;
-}
-.nav-toggle span {
- display: block;
- width: 22px;
- height: 2px;
- background: var(--gray-700);
- border-radius: 2px;
- transition: all 0.3s ease;
-}
-.lang-select {
- display: flex;
- gap: 4px;
- background: var(--gray-100);
- padding: 3px;
+ padding: 8px 16px;
border-radius: 8px;
+ transition: background 0.2s;
}
+.nav-link:hover { background: #f0f2f5; }
+.nav-actions { display: flex; gap: 8px; align-items: center; }
+.lang-select { display: flex; gap: 4px; }
.lang-btn {
+ background: #f0f2f5;
+ border: none;
padding: 6px 12px;
- font-size: 0.8rem;
- font-weight: 600;
- border: none;
+ font-size: 13px;
+ cursor: pointer;
border-radius: 6px;
- background: transparent;
- cursor: pointer;
- color: var(--gray-500);
- transition: all 0.2s;
-}
-.lang-btn.active {
- background: var(--white);
- color: var(--blue);
- box-shadow: var(--shadow-sm);
+ font-weight: 500;
}
+.lang-btn.active { background: #e7f3ff; color: #1877f2; }
+.lang-btn:hover { background: #e4e6eb; }
-/* ========================================
- BUTTONS
- ======================================== */
+/* Buttons */
.btn {
- display: inline-flex;
- align-items: center;
- gap: 6px;
- padding: 10px 20px;
- border: none;
- border-radius: 8px;
- font-size: 0.9rem;
+ padding: 8px 16px;
+ font-size: 15px;
font-weight: 600;
+ border-radius: 6px;
cursor: pointer;
- transition: all 0.2s ease;
text-decoration: none;
- font-family: inherit;
-}
-.btn-primary {
- background: linear-gradient(135deg, var(--blue), var(--blue-dark));
- color: var(--white);
- box-shadow: 0 2px 8px rgba(37,99,235,0.3);
-}
-.btn-primary:hover {
- transform: translateY(-1px);
- box-shadow: 0 4px 12px rgba(37,99,235,0.4);
+ display: inline-block;
+ border: none;
+ transition: background 0.2s;
}
+.btn-primary { background: #1877f2; color: #fff; }
+.btn-primary:hover { background: #166fe5; }
.btn-outline {
- background: transparent;
- color: var(--gray-700);
- border: 1.5px solid var(--gray-300);
+ background: #f0f2f5;
+ color: #1c1e21;
+ border: none;
}
-.btn-outline:hover {
- border-color: var(--blue);
- color: var(--blue);
-}
-.btn-telegram {
- background: linear-gradient(135deg, #0088cc, #0077b5);
- color: var(--white);
- box-shadow: 0 2px 8px rgba(0,136,204,0.3);
- display: inline-flex;
- align-items: center;
- gap: 8px;
- padding: 10px 20px;
- border-radius: 8px;
- text-decoration: none;
- font-weight: 600;
- font-size: 0.9rem;
-}
-.btn-telegram:hover {
- transform: translateY(-1px);
- box-shadow: 0 4px 12px rgba(0,136,204,0.4);
-}
-.btn-block { width: 100%; justify-content: center; }
+.btn-outline:hover { background: #e4e6eb; }
+.btn-block { display: block; width: 100%; text-align: center; }
+.btn-telegram { background: #0088cc; color: #fff; }
-/* ========================================
- HERO SECTION
- ======================================== */
+/* Hero */
.hero {
- min-height: 100vh;
- display: flex;
- flex-direction: column;
- align-items: center;
- justify-content: center;
+ background: linear-gradient(135deg, #1877f2 0%, #42b0ff 100%);
+ color: #fff;
text-align: center;
- background: linear-gradient(160deg, #0f172a 0%, #1e3a5f 40%, #0d9488 100%);
- position: relative;
- overflow: hidden;
- padding: 80px 24px 40px;
-}
-.hero-particles {
- position: absolute;
- inset: 0;
- overflow: hidden;
- pointer-events: none;
-}
-.particle {
- position: absolute;
- border-radius: 50%;
- background: rgba(255,255,255,0.08);
- animation: float-particle linear infinite;
-}
-@keyframes float-particle {
- 0% { transform: translateY(100vh) scale(0); opacity: 0; }
- 10% { opacity: 1; }
- 90% { opacity: 1; }
- 100% { transform: translateY(-100px) scale(1); opacity: 0; }
-}
-.hero-content {
- position: relative;
- z-index: 1;
- max-width: 700px;
+ padding: 60px 20px 40px;
}
.hero-title {
- font-size: clamp(2rem, 5vw, 3.5rem);
- font-weight: 900;
- color: var(--white);
- line-height: 1.1;
- margin-bottom: 16px;
- text-shadow: 0 4px 20px rgba(0,0,0,0.3);
+ font-size: 42px;
+ font-weight: 700;
+ margin-bottom: 12px;
+ text-shadow: 0 2px 4px rgba(0,0,0,0.1);
}
.hero-subtitle {
- font-size: clamp(1rem, 2.5vw, 1.3rem);
- color: rgba(255,255,255,0.8);
- margin-bottom: 40px;
- font-weight: 400;
-}
-.hero-stats {
- display: flex;
- justify-content: center;
- gap: 48px;
- margin-top: 24px;
-}
-.stat {
- text-align: center;
- color: var(--white);
+ font-size: 18px;
+ opacity: 0.9;
+ margin-bottom: 30px;
+ max-width: 600px;
+ margin-left: auto;
+ margin-right: auto;
}
+.hero-stats { display: flex; justify-content: center; gap: 60px; }
+.stat { text-align: center; }
.stat-number {
display: block;
- font-size: 2.5rem;
- font-weight: 800;
- line-height: 1;
- background: linear-gradient(135deg, #ffffff, #94a3b8);
- -webkit-background-clip: text;
- -webkit-text-fill-color: transparent;
- background-clip: text;
-}
-.stat:not(:last-child) {
- border-right: 1px solid rgba(255,255,255,0.2);
-}
-.stat span:last-child {
- font-size: 0.85rem;
- color: rgba(255,255,255,0.6);
- display: block;
- margin-top: 4px;
-}
-.hero-scroll-indicator {
- position: absolute;
- bottom: 32px;
- left: 50%;
- transform: translateX(-50%);
- z-index: 1;
-}
-.scroll-arrow {
- width: 24px;
- height: 40px;
- border: 2px solid rgba(255,255,255,0.4);
- border-radius: 12px;
- position: relative;
- animation: scroll-bounce 2s ease-in-out infinite;
-}
-.scroll-arrow::before {
- content: '';
- position: absolute;
- top: 6px;
- left: 50%;
- transform: translateX(-50%);
- width: 4px;
- height: 8px;
- background: rgba(255,255,255,0.6);
- border-radius: 2px;
- animation: scroll-dot 2s ease-in-out infinite;
-}
-@keyframes scroll-bounce {
- 0%, 100% { transform: translateY(0); }
- 50% { transform: translateY(8px); }
-}
-@keyframes scroll-dot {
- 0%, 100% { opacity: 1; top: 6px; }
- 50% { opacity: 0.3; top: 16px; }
+ font-size: 36px;
+ font-weight: 700;
}
-/* ========================================
- TELEGRAM BANNER
- ======================================== */
-.telegram-banner {
- background: linear-gradient(135deg, #0088cc, #00a8e8);
- padding: 20px 24px;
-}
-.banner-content {
- max-width: 1200px;
- margin: 0 auto;
- display: flex;
- align-items: center;
- justify-content: center;
- gap: 20px;
- flex-wrap: wrap;
- color: var(--white);
-}
-.banner-icon { font-size: 1.5rem; }
-.banner-text { font-size: 0.95rem; }
-
-/* ========================================
- MAIN CONTENT
- ======================================== */
-.main-content {
- min-height: 50vh;
-}
-
-/* ========================================
- SECTIONS
- ======================================== */
+/* Sections */
.section {
- padding: 80px 24px;
-}
-.section-alt {
- background: var(--gray-100);
-}
-.container {
+ background: #fff;
+ border-radius: 8px;
+ padding: 24px;
+ margin: 16px auto;
max-width: 1200px;
- margin: 0 auto;
+ box-shadow: 0 1px 2px rgba(0,0,0,0.1);
}
+.section-alt { background: #fff; border-radius: 8px; padding: 24px; margin: 16px auto; max-width: 1200px; box-shadow: 0 1px 2px rgba(0,0,0,0.1); }
.section-title {
- font-size: 2rem;
- font-weight: 800;
- text-align: center;
- margin-bottom: 48px;
- background: linear-gradient(135deg, var(--black), var(--gray-600));
- -webkit-background-clip: text;
- -webkit-text-fill-color: transparent;
- background-clip: text;
+ font-size: 20px;
+ font-weight: 700;
+ margin-bottom: 20px;
+ color: #1c1e21;
}
+.container { max-width: 100%; }
-/* ========================================
- ABOUT CARDS
- ======================================== */
+/* About */
.about-grid {
display: grid;
- grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
- gap: 24px;
+ grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
+ gap: 16px;
}
.about-card {
- background: var(--white);
- padding: 32px;
- border-radius: var(--radius-lg);
- box-shadow: var(--shadow);
- transition: all 0.3s ease;
- border: 1px solid var(--gray-200);
- cursor: default;
-}
-.about-card:hover {
- transform: translateY(-4px);
- box-shadow: var(--shadow-lg);
- border-color: var(--blue-light);
-}
-.about-icon {
- font-size: 2.5rem;
- margin-bottom: 16px;
- display: block;
-}
-.about-card h3 {
- font-size: 1.15rem;
- font-weight: 700;
- margin-bottom: 10px;
- color: var(--black);
-}
-.about-card p {
- font-size: 0.9rem;
- color: var(--gray-500);
- line-height: 1.6;
+ padding: 20px;
+ border-radius: 8px;
+ background: #f0f2f5;
+ transition: transform 0.2s, box-shadow 0.2s;
}
+.about-card:hover { transform: translateY(-2px); box-shadow: 0 4px 12px rgba(0,0,0,0.1); }
+.about-icon { font-size: 2.5rem; margin-bottom: 12px; }
+.about-card h3 { font-size: 16px; font-weight: 600; color: #1c1e21; margin-bottom: 8px; }
+.about-card p { font-size: 14px; color: #65676b; line-height: 1.4; }
-/* ========================================
- SEARCH BAR
- ======================================== */
+/* Search */
.search-bar {
- position: relative;
- margin-bottom: 32px;
+ display: flex;
max-width: 400px;
+ margin-bottom: 20px;
+ position: relative;
}
.search-icon {
position: absolute;
- left: 14px;
+ left: 12px;
top: 50%;
transform: translateY(-50%);
- width: 20px;
- height: 20px;
- color: var(--gray-400);
- pointer-events: none;
+ width: 16px;
+ height: 16px;
+ color: #65676b;
}
.search-input {
width: 100%;
- padding: 12px 16px 12px 44px;
- border: 2px solid var(--gray-200);
- border-radius: var(--radius);
- font-size: 0.95rem;
- font-family: inherit;
- outline: none;
- transition: all 0.2s ease;
- background: var(--white);
-}
-.search-input:focus {
- border-color: var(--blue);
- box-shadow: 0 0 0 4px rgba(37,99,235,0.1);
-}
-.search-input::placeholder {
- color: var(--gray-400);
+ padding: 10px 12px 10px 36px;
+ border: none;
+ border-radius: 20px;
+ background: #f0f2f5;
+ font-size: 15px;
}
+.search-input:focus { outline: 2px solid #1877f2; outline-offset: 0; }
-/* ========================================
- MEMBERS GRID
- ======================================== */
+/* Members Grid */
.members-grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
- gap: 20px;
+ gap: 12px;
}
.member-card {
- background: var(--white);
- border-radius: var(--radius-lg);
- padding: 24px;
display: flex;
- align-items: flex-start;
- gap: 16px;
- box-shadow: var(--shadow-sm);
- border: 1px solid var(--gray-200);
+ align-items: center;
+ gap: 12px;
+ padding: 12px;
+ border-radius: 8px;
+ background: #f0f2f5;
cursor: pointer;
- transition: all 0.3s ease;
+ transition: background 0.2s;
}
-.member-card:hover {
- transform: translateY(-2px);
- box-shadow: var(--shadow-md);
- border-color: var(--blue-light);
-}
-.member-card .user-avatar {
- width: 52px;
- height: 52px;
+.member-card:hover { background: #e4e6eb; }
+.user-avatar {
+ width: 48px;
+ height: 48px;
border-radius: 50%;
- background: linear-gradient(135deg, var(--blue), var(--teal));
- color: var(--white);
+ object-fit: cover;
+}
+.user-avatar-text {
+ width: 48px;
+ height: 48px;
+ border-radius: 50%;
+ background: #1877f2;
+ color: #fff;
display: flex;
align-items: center;
justify-content: center;
- font-weight: 700;
- font-size: 1.3rem;
- flex-shrink: 0;
- overflow: hidden;
-}
-.member-card .user-avatar img {
- width: 100%;
- height: 100%;
- object-fit: cover;
-}
-.member-info h4 {
- font-size: 1rem;
+ font-size: 20px;
font-weight: 600;
- margin-bottom: 4px;
- color: var(--black);
-}
-.member-info .member-company {
- font-size: 0.85rem;
- color: var(--gray-500);
- margin-bottom: 4px;
-}
-.member-info .member-location {
- font-size: 0.8rem;
- color: var(--gray-400);
- margin-bottom: 6px;
-}
-.member-info .member-posts {
- font-size: 0.75rem;
- color: var(--gray-400);
}
+.member-info h4 { font-size: 15px; font-weight: 600; color: #1c1e21; margin-bottom: 2px; }
+.member-company { font-size: 13px; color: #65676b; }
+.member-location, .member-posts { font-size: 13px; color: #65676b; }
.rank-badge {
- font-size: 0.65rem;
- font-weight: 700;
+ font-size: 11px;
padding: 3px 8px;
- border-radius: 6px;
+ border-radius: 12px;
position: absolute;
- top: 12px;
- right: 12px;
- white-space: nowrap;
+ top: -4px;
+ right: 0;
+ font-weight: 500;
}
-.rank-rookie { background: var(--gray-100); color: var(--gray-600); }
-.rank-beginner { background: #d1fae5; color: #065f46; }
-.rank-member { background: #dbeafe; color: #1e40af; }
-.rank-contributor { background: #fef3c7; color: #92400e; }
-.rank-veteran { background: #ede9fe; color: #5b21b6; }
-.rank-expert { background: #fce7f3; color: #9d174d; }
-.rank-legend { background: #fef08a; color: #854d0e; }
+.rank-badge.rank-rookie { background: #e4e6eb; color: #65676b; }
+.rank-badge.rank-beginner { background: #e7f3e9; color: #0a832c; }
+.rank-badge.rank-member { background: #e7f0ff; color: #1877f2; }
+.rank-badge.rank-contributor { background: #e0f7fa; color: #00838f; }
+.rank-badge.rank-veteran { background: #f3e5f5; color: #8e24aa; }
+.rank-badge.rank-expert { background: #fff3e0; color: #e65100; }
+.rank-badge.rank-legend { background: #fce4ec; color: #c62828; }
-/* ========================================
- WIKI GRID
- ======================================== */
+/* Wiki Cards */
.wiki-grid {
display: grid;
- grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
- gap: 20px;
+ grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
+ gap: 12px;
}
.wiki-card {
- background: var(--white);
- border-radius: var(--radius-lg);
- padding: 24px;
- box-shadow: var(--shadow-sm);
- border: 1px solid var(--gray-200);
+ padding: 16px;
+ border-radius: 8px;
+ background: #f0f2f5;
cursor: pointer;
- transition: all 0.3s ease;
- display: flex;
- flex-direction: column;
- height: 100%;
- min-height: 160px;
- position: relative;
- overflow: hidden;
+ transition: all 0.2s;
+ border-left: 4px solid #1877f2;
}
-.wiki-card::before {
- content: '';
- position: absolute;
+.wiki-card:hover { background: #e4e6eb; }
+.wiki-card-title { font-size: 15px; font-weight: 600; color: #1c1e21; margin-bottom: 6px; }
+.wiki-card-excerpt { font-size: 13px; color: #65676b; margin-bottom: 8px; }
+.wiki-card-footer { display: flex; justify-content: space-between; font-size: 13px; color: #65676b; }
+.wiki-card-subtopic { color: #1877f2; }
+.no-results { padding: 20px; text-align: center; color: #65676b; }
+.loading-text { padding: 20px; text-align: center; color: #65676b; font-style: italic; }
+
+/* Modal */
+.modal-overlay {
+ position: fixed;
top: 0;
left: 0;
right: 0;
- height: 4px;
-}
-.wiki-card[data-color="blue"]::before { background: linear-gradient(90deg, var(--blue), var(--blue-light)); }
-.wiki-card[data-color="teal"]::before { background: linear-gradient(90deg, var(--teal), #14b8a6); }
-.wiki-card[data-color="green"]::before { background: linear-gradient(90deg, var(--green), #22c55e); }
-.wiki-card[data-color="orange"]::before { background: linear-gradient(90deg, var(--orange), #fb923c); }
-.wiki-card[data-color="purple"]::before { background: linear-gradient(90deg, var(--purple), #a78bfa); }
-.wiki-card[data-color="pink"]::before { background: linear-gradient(90deg, var(--pink), #f472b6); }
-.wiki-card[data-color="yellow"]::before { background: linear-gradient(90deg, var(--yellow), #fbbf24); }
-.wiki-card:hover {
- transform: translateY(-4px);
- box-shadow: var(--shadow-lg);
- border-color: var(--blue-light);
-}
-.wiki-card-title {
- font-size: 1.05rem;
- font-weight: 700;
- color: var(--black);
- margin-bottom: 8px;
-}
-.wiki-card-excerpt {
- font-size: 0.85rem;
- color: var(--gray-500);
- line-height: 1.6;
- flex-grow: 1;
- display: -webkit-box;
- -webkit-line-clamp: 4;
- -webkit-box-orient: vertical;
- overflow: hidden;
-}
-.wiki-card-footer {
- margin-top: 16px;
- padding-top: 12px;
- border-top: 1px solid var(--gray-200);
- font-size: 0.8rem;
- color: var(--gray-400);
- display: flex;
- justify-content: space-between;
-}
-.wiki-card-subtopic {
- font-size: 0.75rem;
- color: var(--blue);
- font-weight: 600;
- text-transform: uppercase;
- letter-spacing: 0.05em;
-}
-
-/* ========================================
- MODAL
- ======================================== */
-.modal-overlay {
- position: fixed;
- inset: 0;
- background: rgba(0,0,0,0.5);
- backdrop-filter: blur(4px);
- -webkit-backdrop-filter: blur(4px);
+ bottom: 0;
+ background: rgba(255,255,255,0.8);
z-index: 2000;
- display: flex;
+ display: none;
align-items: center;
justify-content: center;
- padding: 24px;
- opacity: 0;
- pointer-events: none;
- transition: opacity 0.3s ease;
-}
-.modal-overlay.active {
- opacity: 1;
- pointer-events: auto;
}
+.modal-overlay.active { display: flex; }
.modal {
- background: var(--white);
- border-radius: var(--radius-xl);
- padding: 40px;
- width: 100%;
- max-width: 560px;
+ background: #fff;
+ border-radius: 8px;
+ padding: 24px;
+ max-width: 440px;
+ width: 90%;
+ box-shadow: 0 8px 30px rgba(0,0,0,0.2);
position: relative;
- box-shadow: var(--shadow-xl);
- max-height: 90vh;
- overflow-y: auto;
- transform: translateY(20px) scale(0.97);
- transition: transform 0.3s ease;
-}
-.modal-overlay.active .modal {
- transform: translateY(0) scale(1);
}
.modal-close {
position: absolute;
- top: 16px;
+ top: 12px;
right: 16px;
- width: 36px;
- height: 36px;
- border-radius: 50%;
+ background: none;
border: none;
- background: var(--gray-100);
+ font-size: 24px;
cursor: pointer;
- font-size: 1.2rem;
- display: flex;
- align-items: center;
- justify-content: center;
- color: var(--gray-500);
- transition: all 0.2s;
-}
-.modal-close:hover {
- background: var(--gray-200);
- color: var(--black);
-}
-
-/* ========================================
- LOGIN MODAL
- ======================================== */
-.login-steps {
- text-align: center;
-}
-.login-icon {
- font-size: 3rem;
- margin-bottom: 16px;
-}
-.login-step {
- display: none;
-}
-.login-step.active {
- display: block;
-}
-.login-hint {
- font-size: 0.9rem;
- color: var(--gray-500);
- margin-bottom: 24px;
-}
-
-/* ========================================
- PROFILE MODAL
- ======================================== */
-.profile-username {
- font-size: 1.2rem;
- font-weight: 700;
- margin-bottom: 8px;
-}
-.profile-rank {
- margin-bottom: 24px;
-}
-.profile-edit-fields {
- text-align: left;
-}
-.checkbox-group {
- display: flex;
- align-items: center;
- gap: 10px;
- margin-bottom: 20px;
-}
-.checkbox-group .checkbox {
- width: 18px;
- height: 18px;
- cursor: pointer;
-}
-.checkbox-group label {
- font-size: 0.9rem;
- font-weight: 600;
- color: var(--gray-700);
-}
-
-/* ========================================
- USER DETAIL MODAL
- ======================================== */
-.user-detail-modal {
- max-width: 560px;
-}
-.user-detail-content {
- text-align: center;
-}
-.user-detail-avatar {
- width: 80px;
- height: 80px;
- border-radius: 50%;
- margin: 0 auto 16px;
- background: linear-gradient(135deg, var(--blue), var(--teal));
- display: flex;
- align-items: center;
- justify-content: center;
- overflow: hidden;
-}
-.user-detail-avatar img {
- width: 100%;
- height: 100%;
- object-fit: cover;
-}
-.user-detail-header {
- margin-bottom: 24px;
-}
-.user-detail-name-rank {
- display: flex;
- align-items: center;
- justify-content: center;
- gap: 10px;
-}
-.user-detail-name-rank h2 {
- font-size: 1.3rem;
- font-weight: 700;
- margin: 0;
-}
-.user-detail-company {
- font-size: 0.9rem;
- color: var(--gray-500);
-}
-.user-detail-fields {
- text-align: left;
- border-top: 1px solid var(--gray-200);
- padding-top: 20px;
-}
-.detail-field {
- display: flex;
- justify-content: space-between;
- align-items: flex-start;
- padding: 10px 0;
- border-bottom: 1px solid var(--gray-100);
-}
-.detail-field:last-child {
- border-bottom: none;
-}
-.detail-label {
- font-size: 0.85rem;
- font-weight: 600;
- color: var(--gray-500);
-}
-.detail-value {
- font-size: 0.85rem;
- color: var(--gray-800);
- max-width: 60%;
- text-align: right;
- word-break: break-word;
-}
-.user-desc-value {
- text-align: left;
- max-width: 100%;
- line-height: 1.6;
-}
-
-/* ========================================
- FORM ELEMENTS
- ======================================== */
-.form-group {
- margin-bottom: 16px;
- text-align: left;
-}
-.form-group label {
- display: block;
- font-size: 0.85rem;
- font-weight: 600;
- color: var(--gray-700);
- margin-bottom: 6px;
+ color: #65676b;
}
+.login-icon { font-size: 3rem; text-align: center; margin-bottom: 16px; }
+.login-hint { color: #65676b; text-align: center; margin-bottom: 20px; font-size: 15px; }
+.form-group { margin-bottom: 14px; }
.form-input {
width: 100%;
- padding: 12px 16px;
- border: 2px solid var(--gray-200);
- border-radius: var(--radius);
- font-size: 0.95rem;
- font-family: inherit;
- outline: none;
- transition: all 0.2s ease;
- background: var(--white);
-}
-.form-input:focus {
- border-color: var(--blue);
- box-shadow: 0 0 0 4px rgba(37,99,235,0.1);
+ padding: 12px 14px;
+ border: 1px solid #dddfe2;
+ border-radius: 6px;
+ font-size: 15px;
}
+.form-input:focus { border-color: #1877f2; outline: 2px solid #1877f2; outline-offset: -2px; }
+.login-step { display: none; }
+.login-step.active { display: block; }
-/* ========================================
- NEWSLETTER SECTION
- ======================================== */
-.newsletter-card {
- background: var(--white);
- padding: 48px;
- border-radius: var(--radius-xl);
- text-align: center;
- box-shadow: var(--shadow);
- max-width: 500px;
- margin: 0 auto;
+/* Profile & Detail */
+.profile-username { font-size: 1.2rem; font-weight: 600; margin-bottom: 8px; }
+.profile-rank { margin-bottom: 16px; }
+.user-detail-modal { max-width: 520px; }
+.user-detail-content { padding: 16px; }
+.user-detail-avatar {
+ width: 64px;
+ height: 64px;
+ border-radius: 50%;
+ margin: 0 auto 16px;
+ overflow: hidden;
}
-.newsletter-icon {
- font-size: 3rem;
- margin-bottom: 16px;
-}
-.newsletter-card h2 {
- font-size: 1.5rem;
- font-weight: 700;
- margin-bottom: 8px;
-}
-.newsletter-hint {
- font-size: 0.9rem;
- color: var(--gray-500);
- margin-bottom: 24px;
-}
-.success-message {
- padding: 16px;
- background: #d1fae5;
- border-radius: var(--radius);
- color: #065f46;
- font-weight: 600;
- margin-top: 16px;
-}
-.hidden { display: none !important; }
+.user-detail-header { text-align: center; margin-bottom: 16px; }
+.user-detail-name-rank { display: flex; align-items: center; justify-content: center; gap: 10px; margin-bottom: 8px; }
+.user-detail-name-rank h2 { font-size: 1.2rem; font-weight: 600; }
+.user-detail-fields { display: grid; gap: 10px; }
+.detail-field { display: flex; justify-content: space-between; padding: 10px 0; border-bottom: 1px solid #e4e6eb; }
+.detail-label { color: #65676b; font-size: 14px; }
+.detail-value { color: #1c1e21; font-size: 14px; text-align: right; }
+.user-detail-company { color: #65676b; text-align: center; }
-/* ========================================
- WIKI MODAL
- ======================================== */
-.wiki-modal {
- max-width: 720px;
-}
-.wiki-modal-content {
- text-align: left;
-}
-.wiki-modal-title {
- font-size: 1.4rem;
- font-weight: 800;
- margin-bottom: 8px;
- line-height: 1.3;
-}
-.wiki-modal-subtitle {
- font-size: 0.85rem;
- color: var(--blue);
- font-weight: 600;
- text-transform: uppercase;
- letter-spacing: 0.05em;
- margin-bottom: 20px;
- padding-bottom: 16px;
- border-bottom: 1px solid var(--gray-200);
-}
-.wiki-modal-text {
- font-size: 0.95rem;
- color: var(--gray-700);
- line-height: 1.8;
- white-space: pre-wrap;
-}
-
-/* ========================================
- FOOTER
- ======================================== */
-.footer {
- background: var(--black);
- color: rgba(255,255,255,0.6);
- padding: 48px 24px 32px;
-}
-.footer-brand {
+/* Telegram Banner */
+.telegram-banner {
+ background: #e7f3ff;
+ padding: 16px 24px;
+ margin: 16px auto;
+ max-width: 1200px;
+ border-radius: 8px;
display: flex;
align-items: center;
- justify-content: center;
- gap: 10px;
- margin-bottom: 24px;
+ gap: 16px;
}
+.banner-icon { font-size: 2rem; }
+.banner-text strong { color: #1c1e21; }
+
+/* Newsletter */
+.newsletter-card { text-align: center; max-width: 400px; margin: 0 auto; }
+.newsletter-icon { font-size: 2.5rem; margin-bottom: 16px; }
+.newsletter-hint { color: #65676b; margin-bottom: 16px; font-size: 15px; }
+
+/* Footer */
+.footer {
+ background: #fff;
+ padding: 24px 16px;
+ text-align: center;
+ border-top: 1px solid #e4e6eb;
+ margin-top: 32px;
+}
+.footer-brand { margin-bottom: 12px; }
.footer-logo { font-size: 1.5rem; }
-.footer-title {
- font-weight: 700;
- color: var(--white);
- font-size: 1.1rem;
-}
-.footer-links {
- display: flex;
- justify-content: center;
- gap: 24px;
- margin-bottom: 32px;
- flex-wrap: wrap;
-}
-.footer-links a {
- color: rgba(255,255,255,0.5);
- text-decoration: none;
- font-size: 0.9rem;
- font-weight: 500;
- transition: color 0.2s;
-}
-.footer-links a:hover {
- color: var(--white);
-}
-.footer-bottom {
- text-align: center;
- border-top: 1px solid rgba(255,255,255,0.1);
- padding-top: 24px;
-}
-.footer-bottom a {
- color: var(--white);
- text-decoration: none;
- font-weight: 600;
-}
-.footer-copy {
- margin-top: 8px;
- font-size: 0.8rem;
-}
+.footer-title { color: #1c1e21; margin-left: 10px; font-size: 14px; font-weight: 600; }
+.footer-links { display: flex; justify-content: center; gap: 20px; margin-bottom: 12px; flex-wrap: wrap; }
+.footer-links a { color: #65676b; text-decoration: none; font-size: 13px; }
+.footer-links a:hover { text-decoration: underline; }
+.footer-bottom p { color: #65676b; margin: 4px 0; font-size: 12px; }
+.footer-bottom a { color: #1877f2; }
+.footer-copy { font-size: 12px; }
-/* ========================================
- LOADING / EMPTY STATES
- ======================================== */
-.loading-text {
- text-align: center;
- color: var(--gray-400);
- font-size: 0.9rem;
- padding: 40px;
- grid-column: 1 / -1;
-}
-.no-results {
- text-align: center;
- color: var(--gray-400);
- font-size: 0.9rem;
- padding: 40px;
- grid-column: 1 / -1;
-}
+/* Hide/Show */
+.hide-en { display: none; }
+body[data-lang="en"] .hide-en { display: inline; }
+body[data-lang="en"] .hide-de { display: none; }
+.hidden { display: none !important; }
-/* ========================================
- RESPONSIVE
- ======================================== */
+/* Responsive */
@media (max-width: 768px) {
- .nav-toggle { display: flex; }
- .nav-menu {
- position: fixed;
- top: 64px;
+ .nav-menu { display: none; }
+ .nav-menu.open {
+ display: flex;
+ position: absolute;
+ top: 100%;
left: 0;
right: 0;
- background: var(--white);
+ background: #fff;
flex-direction: column;
- padding: 16px;
- border-bottom: 1px solid var(--gray-200);
- box-shadow: var(--shadow-md);
- transform: translateY(-110%);
- transition: transform 0.3s ease;
- gap: 4px;
+ padding: 12px;
+ gap: 8px;
+ border-top: 1px solid #e4e6eb;
+ box-shadow: 0 4px 12px rgba(0,0,0,0.1);
}
- .nav-menu.open { transform: translateY(0); }
- .nav-actions {
- margin-left: 0;
- padding-left: 0;
- border-left: none;
- width: 100%;
- justify-content: center;
- padding: 12px 0;
- border-top: 1px solid var(--gray-200);
- }
- .nav-link { width: 100%; text-align: center; }
- .hero-stats { gap: 24px; }
- .stat-number { font-size: 1.8rem; }
- .section { padding: 48px 16px; }
- .section-title { font-size: 1.5rem; margin-bottom: 32px; }
- .modal { padding: 24px; max-width: 100%; }
- .about-grid,
- .members-grid,
- .wiki-grid {
- grid-template-columns: 1fr;
- }
- .banner-content {
+ .nav-toggle {
+ display: flex;
flex-direction: column;
- text-align: center;
- gap: 12px;
+ gap: 3px;
+ background: none;
+ border: none;
+ cursor: pointer;
+ padding: 4px;
}
- .newsletter-card { padding: 32px 24px; }
- .footer-links { gap: 16px; }
+ .nav-toggle span { display: block; width: 20px; height: 2px; background: #65676b; }
+ .hero-title { font-size: 28px; }
+ .hero-subtitle { font-size: 16px; }
+ .hero-stats { gap: 30px; flex-wrap: wrap; }
+ .stat-number { font-size: 28px; }
+ .about-grid { grid-template-columns: 1fr; }
+ .wiki-grid { grid-template-columns: 1fr; }
+ .members-grid { grid-template-columns: 1fr; }
}
-
-/* ========================================
- LANGUAGE TOGGLE
- ======================================== */
-.hide-de { display: none; }
-.hide-en { display: none; }
-[data-lang="de"] .hide-de { display: block; }
-[data-lang="en"] .hide-en { display: block; }
-[data-lang="de"] .hide-en { display: none; }
-[data-lang="en"] .hide-de { display: none; }
-[data-lang="de"] .nav-link .hide-de,
-[data-lang="en"] .nav-link .hide-en { display: inline; }
\ No newline at end of file
+@media (min-width: 769px) {
+ .nav-toggle { display: none; }
+}
\ No newline at end of file
diff --git a/index_variations.html b/index_variations.html
deleted file mode 100644
index e650067..0000000
--- a/index_variations.html
+++ /dev/null
@@ -1,364 +0,0 @@
-
-
-
-
-
- Paraguay LLC & SRL — Design-Variationen
-
-
-
-
-
-
\ No newline at end of file
diff --git a/js/main.js b/js/main.js
index 7ae5273..667dad7 100644
--- a/js/main.js
+++ b/js/main.js
@@ -127,11 +127,8 @@ async function loadCommunityStats() {
if (data.users !== undefined) {
animateCounter('stat-members', data.users);
}
- if (data.posts !== undefined) {
- animateCounter('stat-posts', data.posts);
- }
if (data.topics !== undefined) {
- animateCounter('stat-wiki', data.topics);
+ document.getElementById('stat-wiki').textContent = data.topics;
}
} catch (error) {
console.error('Failed to load community stats:', error);
diff --git a/variations/facebook/index.html b/variations/facebook/index.html
deleted file mode 100644
index 8f904ba..0000000
--- a/variations/facebook/index.html
+++ /dev/null
@@ -1,467 +0,0 @@
-
-
-
-
-
- Paraguay SRL LLC — Community
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
×
-
-
-
-
💬
-
Telegram Username eingeben
-
Enter Telegram Username
-
- Geben Sie Ihren Telegram-Nutzernamen ein, um einen Login-Link per Nachricht zu erhalten.
- Enter your Telegram username to receive a login link via message.
-
-
-
-
-
- Login-Link senden
- Send Login Link
-
-
-
-
-
🔐
-
Verifizierungscode
-
Verification Code
-
- Der Code wurde an Ihren Telegram-Account gesendet.
- The code has been sent to your Telegram account.
-
-
-
-
-
- Verifizieren
- Verify
-
-
-
-
-
🎉
-
Registrierung abschließen
-
Complete Registration
-
-
-
-
-
-
-
- Registrieren
- Register
-
-
-
-
-
-
-
-
-
-
×
-
Dein Profil
-
Your Profile
-
-
-
-
-
-
-
-
-
-
×
-
-
- ?
-
-
-
-
-
- E-Mail
- Email
-
- -
-
-
-
- Homepage
- Homepage
-
- -
-
-
-
- Standort
- Location
-
- -
-
-
-
- Beschreibung
- Description
-
- -
-
-
-
-
-
-
-
-
-
-
-
- Paraguay LLC & SRL Community
- Paraguay LLC & SRL Community
-
-
- Der Erfahrungsaustausch für deutsche und amerikanische Expats in Paraguay
- The experience exchange for German and American expats in Paraguay
-
-
-
- --
- Mitglieder
- Members
-
-
- --
- Beiträge
- Posts
-
-
- --
- Wiki-Artikel
- Wiki Articles
-
-
-
-
-
-
-
-
-
-
📱
-
-
- Noch nicht angemeldet?
- Not logged in yet?
-
- Tritt unserer Telegram-Gruppe bei und erhalte einen Login-Link!
- Join our Telegram group and receive a login link!
-
-
-
- Telegram beitreten
- Join Telegram
-
-
-
-
-
-
-
-
-
-
-
- Über die Community
- About the Community
-
-
-
-
🏦
-
- Banken & Zahlungsverkehr
- Banking & Payments
-
-
- Erfahrungen mit paraguayischen und internationalen Banken, Konten, Überweisungen und Kreditkarten.
- Experiences with Paraguayan and international banks, accounts, transfers and credit cards.
-
-
-
-
⚖️
-
- Rechtliches
- Legal Matters
-
-
- Gesellschaftsrecht, Verträge, Steuern, Compliance und Rechtsprechung in Paraguay.
- Corporate law, contracts, taxes, compliance and jurisprudence in Paraguay.
-
-
-
-
📊
-
- Steuern & Buchhaltung
- Taxes & Accounting
-
-
- Steuerberatung, Buchhaltungssysteme, Jahresabschlüsse und internationale Steuerplanung.
- Tax advice, accounting systems, annual statements and international tax planning.
-
-
-
-
💻
-
- ERP-Systeme
- ERP Systems
-
-
- Erfahrungen mit verschiedenen ERP-Systemen, Software-Lösungen und digitalem Management.
- Experiences with various ERP systems, software solutions and digital management.
-
-
-
-
-
-
-
-
-
-
- Mitglieder
- Members
-
-
-
-
- Lade Mitglieder...
- Loading members...
-
-
-
-
-
-
-
-
-
- Wiki
- Wiki
-
-
-
-
- Lade Wiki...
- Loading wiki...
-
-
-
-
-
-
-
-
-
-
✉️
-
- Newsletter
- Newsletter
-
-
- Erhalten Sie Updates und wichtige Informationen direkt in Ihr Postfach.
- Receive updates and important information directly in your inbox.
-
-
-
-
- Danke! Bitte prüfen Sie Ihre E-Mails.
- Thank you! Please check your emails.
-
-
-
-
-
-
-
-
-
-
-
-
-
-
diff --git a/variations/facebook/main.js b/variations/facebook/main.js
deleted file mode 100644
index 667dad7..0000000
--- a/variations/facebook/main.js
+++ /dev/null
@@ -1,637 +0,0 @@
-// ========================================
-// Paraguay LLC & SRL — Main JS
-// ========================================
-
-const API_URL = 'https://n8n.odoo4projects.com/webhook/paraguay/login';
-const NEWSLETTER_URL = 'https://n8n.odoo4projects.com/webhook/paraguay/newsletter';
-const USER_URL = 'https://n8n.odoo4projects.com/webhook/paraguay/user';
-const PROFILE_URL = 'https://n8n.odoo4projects.com/webhook/paraguay/profile';
-const WIKI_URL = 'https://n8n.odoo4projects.com/webhook/paraguay/wiki';
-const COMMUNITY_URL = 'https://n8n.odoo4projects.com/webhook/paraguay/community';
-
-let currentLang = 'de';
-
-document.addEventListener('DOMContentLoaded', () => {
- currentLang = document.body.dataset.lang || 'de';
- checkSession();
- loadCommunityStats();
-
- // Smooth scroll nav links
- document.querySelectorAll('.nav-link').forEach(link => {
- link.addEventListener('click', (e) => {
- e.preventDefault();
- const target = document.querySelector(link.getAttribute('href'));
- if (target) {
- target.scrollIntoView({ behavior: 'smooth' });
- }
- // Close mobile nav
- document.getElementById('nav-menu').classList.remove('open');
- });
- });
-
- // Mobile nav toggle
- const navToggle = document.getElementById('nav-toggle');
- const navMenu = document.getElementById('nav-menu');
- if (navToggle) {
- navToggle.addEventListener('click', () => {
- navMenu.classList.toggle('open');
- });
- }
-
- // Navbar scroll effect
- window.addEventListener('scroll', () => {
- const nav = document.getElementById('main-nav');
- if (nav) {
- nav.classList.toggle('scrolled', window.scrollY > 20);
- }
- });
-
- // Language toggle
- document.querySelectorAll('.lang-btn').forEach(btn => {
- btn.addEventListener('click', () => {
- const lang = btn.dataset.lang;
- setLanguage(lang);
- // Reload content in new language
- if (isLoggedIn) {
- if (document.querySelector('.notebook') || document.getElementById('members-list')) loadUsers();
- if (document.getElementById('wiki-grid')) loadWiki();
- }
- });
- });
-
- // Member search
- const memberSearch = document.getElementById('member-search');
- if (memberSearch) {
- memberSearch.addEventListener('input', (e) => {
- filterMembers(e.target.value);
- });
- }
-
- // Wiki search
- const wikiSearch = document.getElementById('wiki-search');
- if (wikiSearch) {
- wikiSearch.addEventListener('input', (e) => {
- searchWiki(e.target.value);
- });
- }
-
- // Close modals on overlay click
- document.querySelectorAll('.modal-overlay').forEach(overlay => {
- overlay.addEventListener('click', (e) => {
- if (e.target === overlay) {
- overlay.classList.remove('active');
- }
- });
- });
-
- // Close modals on Escape
- document.addEventListener('keydown', (e) => {
- if (e.key === 'Escape') {
- document.querySelectorAll('.modal-overlay.active').forEach(m => m.classList.remove('active'));
- }
- });
-
- // Login button
- const loginBtn = document.getElementById('login-btn');
- if (loginBtn) {
- loginBtn.addEventListener('click', () => {
- openLoginModal();
- });
- }
-});
-
-// ========================================
-// LANGUAGE
-// ========================================
-function setLanguage(lang) {
- currentLang = lang;
- document.body.dataset.lang = lang;
- document.querySelectorAll('.lang-btn').forEach(b => {
- b.classList.toggle('active', b.dataset.lang === lang);
- });
-}
-
-function isDE() {
- return currentLang !== 'en';
-}
-
-// ========================================
-// COMMUNITY STATS
-// ========================================
-async function loadCommunityStats() {
- try {
- const response = await fetch(COMMUNITY_URL);
- if (!response.ok) throw new Error('Failed to fetch');
- const data = await response.json();
-
- if (data.users !== undefined) {
- animateCounter('stat-members', data.users);
- }
- if (data.topics !== undefined) {
- document.getElementById('stat-wiki').textContent = data.topics;
- }
- } catch (error) {
- console.error('Failed to load community stats:', error);
- }
-}
-
-function animateCounter(elementId, targetNumber) {
- const element = document.getElementById(elementId);
- if (!element) return;
-
- let current = 0;
- const duration = 1500; // ms
- const steps = 40;
- const increment = targetNumber / steps;
- const stepTime = duration / steps;
-
- const timer = setInterval(() => {
- current += increment;
- if (current >= targetNumber) {
- element.textContent = targetNumber;
- clearInterval(timer);
- } else {
- element.textContent = Math.floor(current);
- }
- }, stepTime);
-}
-
-// ========================================
-// AUTH / SESSION
-// ========================================
-let isLoggedIn = false;
-
-function isSessionValid() {
- const sid = getCookie('sessionid');
- return sid.length > 0;
-}
-
-function checkSession() {
- isLoggedIn = isSessionValid();
-
- if (isLoggedIn) {
- document.body.dataset.loggedIn = 'true';
- document.getElementById('login-btn').style.display = 'none';
- document.getElementById('logout-btn').style.display = 'inline-flex';
- document.getElementById('profile-btn').style.display = 'inline-flex';
- document.getElementById('telegram-banner').style.display = 'none';
- document.getElementById('main-content').style.display = 'block';
- document.getElementById('newsletter-section').style.display = 'block';
- loadUsers();
- loadWiki();
- } else {
- document.body.dataset.loggedIn = 'false';
- document.getElementById('login-btn').style.display = 'inline-flex';
- document.getElementById('logout-btn').style.display = 'none';
- document.getElementById('profile-btn').style.display = 'none';
- document.getElementById('telegram-banner').style.display = 'block';
- document.getElementById('main-content').style.display = 'none';
- document.getElementById('newsletter-section').style.display = 'none';
- }
-}
-
-// ========================================
-// LOGIN MODAL
-// ========================================
-function openLoginModal() {
- document.getElementById('login-modal-overlay').classList.add('active');
- // Reset to step 1
- document.querySelectorAll('.login-step').forEach(s => s.classList.remove('active'));
- document.getElementById('login-step-1').classList.add('active');
- document.getElementById('telegram-user').value = '';
- document.getElementById('verification-code').value = '';
-}
-
-function closeLoginModal() {
- document.getElementById('login-modal-overlay').classList.remove('active');
-}
-
-// ========================================
-// PROFILE MODAL
-// ========================================
-function openProfileModal() {
- const sid = getCookie('sessionid');
- if (!sid) { alert('Bitte anmelden.'); return; }
-
- fetch(PROFILE_URL + '?sessionid=' + encodeURIComponent(sid))
- .then(r => r.json())
- .then(user => {
- document.getElementById('profile-username-display').textContent = user.username || '';
- const rank = getRank(user.posts || 0);
- const badge = document.getElementById('profile-rank-badge');
- badge.innerHTML = `${rank.emoji} ${rank.title} `;
-
- document.getElementById('profile-company').value = user.company || '';
- document.getElementById('profile-email').value = user.email || '';
- document.getElementById('profile-homepage').value = user.homepage || '';
- document.getElementById('profile-image').value = user.image || '';
- document.getElementById('profile-location').value = user.location || '';
- document.getElementById('profile-description').value = user.Description || '';
- document.getElementById('profile-publish').checked = true;
-
- document.getElementById('profile-modal-overlay').classList.add('active');
- })
- .catch(() => alert('Fehler beim Laden des Profils.'));
-}
-
-function closeProfileModal() {
- document.getElementById('profile-modal-overlay').classList.remove('active');
-}
-
-function saveProfile() {
- const sid = getCookie('sessionid');
- fetch(PROFILE_URL, {
- method: 'POST',
- headers: { 'Content-Type': 'application/json' },
- body: JSON.stringify({
- username: document.getElementById('profile-username-display').textContent,
- company: document.getElementById('profile-company').value.trim(),
- email: document.getElementById('profile-email').value,
- homepage: document.getElementById('profile-homepage').value,
- image: document.getElementById('profile-image').value,
- location: document.getElementById('profile-location').value,
- Description: document.getElementById('profile-description').value,
- sessionid: sid,
- publish: document.getElementById('profile-publish').checked
- })
- })
- .then(r => r.ok ? alert('Profil gespeichert!') : alert('Fehler beim Speichern.'))
- .catch(() => alert('Fehler bei der Verbindung.'));
-}
-
-// ========================================
-// USER DETAIL MODAL
-// ========================================
-function openUserDetailModal(user) {
- const avatar = document.getElementById('user-detail-avatar');
- if (user.image) {
- avatar.innerHTML = ` `;
- } else {
- avatar.innerHTML = `${(user.username || '?').charAt(0).toUpperCase()} `;
- }
-
- document.getElementById('user-detail-initial').textContent = '';
- document.getElementById('user-detail-username').textContent = '@' + (user.username || 'Unknown');
-
- const rank = getRank(user.posts || 0);
- document.getElementById('user-detail-rank-badge').className = `rank-badge rank-${rank.level}`;
- document.getElementById('user-detail-rank-badge').textContent = rank.emoji + ' ' + rank.title;
-
- document.getElementById('user-detail-company').textContent = user.company || '';
-
- const emailEl = document.getElementById('user-detail-email');
- emailEl.innerHTML = user.email ? `${user.email} ` : '-';
-
- const hpEl = document.getElementById('user-detail-homepage');
- const hp = user.homepage || '';
- hpEl.innerHTML = hp ? `${hp} ` : '-';
-
- document.getElementById('user-detail-location').textContent = user.location || '-';
- document.getElementById('user-detail-description').innerHTML = (user.Description || '-').replace(/\n/g, ' ');
-
- document.getElementById('user-detail-modal-overlay').classList.add('active');
-}
-
-function closeUserDetailModal() {
- document.getElementById('user-detail-modal-overlay').classList.remove('active');
-}
-
-// ========================================
-// LOGIN FLOW
-// ========================================
-function sendTelegramUser() {
- const user = document.getElementById('telegram-user').value.trim();
- if (!user) { alert('Bitte geben Sie einen Telegram-Nutzernamen ein.'); return; }
-
- const btn = event.target;
- btn.disabled = true;
- btn.textContent = isDE() ? 'Sende...' : 'Sending...';
-
- fetch(API_URL, {
- method: 'POST',
- headers: { 'Content-Type': 'application/json' },
- body: JSON.stringify({ username: user })
- })
- .then(r => r.json())
- .then(data => {
- if (data.sessionid) {
- setCookie('sessionid', data.sessionid, 1);
- document.getElementById('login-step-1').classList.remove('active');
- document.getElementById('login-step-3').classList.add('active');
- } else if (data.status === 'code send') {
- document.getElementById('login-step-1').classList.remove('active');
- document.getElementById('login-step-2').classList.add('active');
- } else {
- alert(isDE() ? 'Benutzername nicht gefunden. Bitte über Telegram Bot anmelden.' : 'Username not found. Please sign up via Telegram bot.');
- }
- })
- .catch(() => {
- btn.disabled = false;
- alert(isDE() ? 'Verbindungsfehler' : 'Connection error');
- });
-}
-
-function verifyCode() {
- const code = document.getElementById('verification-code').value.trim();
- if (!code) { alert('Bitte geben Sie den Code ein.'); return; }
-
- fetch(API_URL, {
- method: 'POST',
- headers: { 'Content-Type': 'application/json' },
- body: JSON.stringify({
- username: document.getElementById('telegram-user').value,
- code: code,
- sessionid: getCookie('sessionid')
- })
- })
- .then(r => r.json())
- .then(data => {
- if (data.sessionid) {
- setCookie('sessionid', data.sessionid, 1);
- checkSession();
- closeLoginModal();
- } else {
- alert(isDE() ? 'Ungültiger Code' : 'Invalid code');
- }
- })
- .catch(() => alert(isDE() ? 'Verbindungsfehler' : 'Connection error'));
-}
-
-function submitLoginData() {
- const name = document.getElementById('full-name').value.trim();
- const llc = document.getElementById('llc-name').value.trim();
- if (!name || !llc) { alert(isDE() ? 'Bitte Name und LLC eintragen' : 'Please enter name and LLC'); return; }
-
- fetch(API_URL, {
- method: 'POST',
- headers: { 'Content-Type': 'application/json' },
- body: JSON.stringify({
- username: document.getElementById('telegram-user').value,
- name: name,
- llc: llc
- })
- })
- .then(r => r.json())
- .then(data => {
- if (data.sessionid) {
- setCookie('sessionid', data.sessionid, 1);
- checkSession();
- closeLoginModal();
- } else {
- alert(isDE() ? 'Registrierung fehlgeschlagen' : 'Registration failed');
- }
- })
- .catch(() => alert(isDE() ? 'Verbindungsfehler' : 'Connection error'));
-}
-
-function logout() {
- setCookie('sessionid', '', -1);
- checkSession();
-}
-
-// ========================================
-// NEWSLETTER
-// ========================================
-function subscribeNewsletter() {
- const email = document.getElementById('newsletter-email').value.trim();
- if (!email) { alert(isDE() ? 'Bitte E-Mail eingeben' : 'Please enter email'); return; }
-
- fetch(NEWSLETTER_URL, {
- method: 'POST',
- headers: { 'Content-Type': 'application/json' },
- body: JSON.stringify({ email: email })
- })
- .then(r => {
- if (r.ok) {
- document.getElementById('newsletter-form').classList.add('hidden');
- document.getElementById('newsletter-success').classList.remove('hidden');
- } else {
- alert(isDE() ? 'Fehler beim Abonnieren' : 'Error subscribing');
- }
- })
- .catch(() => alert(isDE() ? 'Verbindungsfehler' : 'Connection error'));
-}
-
-// ========================================
-// USERS / MEMBERS
-// ========================================
-async function loadUsers() {
- try {
- const response = await fetch(USER_URL);
- if (!response.ok) throw new Error('Failed to fetch');
- const data = await response.json();
- const container = document.getElementById('members-list');
-
- if (data.data && Array.isArray(data.data)) {
- container.innerHTML = '';
- container.style.display = 'grid';
-
- data.data.forEach(user => {
- const card = createMemberCard(user);
- container.appendChild(card);
- });
-
- // Update stats will be handled by loadCommunityStats
- } else {
- container.innerHTML = '' + (isDE() ? 'Keine Mitglieder gefunden' : 'No members found') + '
';
- }
- } catch (error) {
- const container = document.getElementById('members-list');
- container.innerHTML = '' + (isDE() ? 'Fehler beim Laden' : 'Error loading') + '
';
- }
-}
-
-function createMemberCard(user) {
- const card = document.createElement('div');
- card.className = 'member-card';
-
- const rank = getRank(user.posts || 0);
- const avatarContent = user.image
- ? ` `
- : (user.username || '?').charAt(0).toUpperCase();
-
- card.innerHTML = `
- ${avatarContent}
-
-
${user.username || 'N/A'}
-
${user.company || ''}
- ${user.location ? `
📍 ${user.location}
` : ''}
- ${user.posts ? `
${user.posts} ${isDE() ? 'Beiträge' : 'posts'}
` : ''}
-
${rank.emoji} ${rank.title}
-
- `;
-
- card.addEventListener('click', () => openUserDetailModal(user));
- return card;
-}
-
-function filterMembers(term) {
- const cards = document.querySelectorAll('.member-card');
- const t = term.toLowerCase();
- cards.forEach(card => {
- const text = card.textContent.toLowerCase();
- card.style.display = text.includes(t) ? 'flex' : 'none';
- });
-}
-
-// ========================================
-// RANKS
-// ========================================
-function getRank(posts) {
- if (posts >= 500) return { level: 'legend', title: isDE() ? 'Legende' : 'Legend', emoji: '👑' };
- if (posts >= 200) return { level: 'expert', title: isDE() ? 'Experte' : 'Expert', emoji: '🏆' };
- if (posts >= 100) return { level: 'veteran', title: isDE() ? 'Veteran' : 'Veteran', emoji: '💎' };
- if (posts >= 50) return { level: 'contributor', title: isDE() ? 'Mitwirkender' : 'Contributor', emoji: '⭐' };
- if (posts >= 30) return { level: 'member', title: isDE() ? 'Mitglied' : 'Member', emoji: '🌳' };
- if (posts >= 5) return { level: 'beginner', title: isDE() ? 'Einsteiger' : 'Beginner', emoji: '🌿' };
- return { level: 'rookie', title: isDE() ? 'Anfänger' : 'Rookie', emoji: '🌱' };
-}
-
-// ========================================
-// WIKI
-// ========================================
-let wikiData = [];
-
-async function loadWiki() {
- try {
- const response = await fetch(WIKI_URL);
- if (!response.ok) throw new Error('Failed to fetch');
- const result = await response.json();
-
- if (result.data && Array.isArray(result.data)) {
- wikiData = result.data;
- renderWikiCards(wikiData);
-
- // Wiki count will be loaded from community webhook
- } else {
- document.getElementById('wiki-grid').innerHTML = '' + (isDE() ? 'Keine Wiki-Daten' : 'No wiki data') + '
';
- }
- } catch (error) {
- document.getElementById('wiki-grid').innerHTML = '' + (isDE() ? 'Fehler beim Laden' : 'Error loading') + '
';
- }
-}
-
-function renderWikiCards(data) {
- const grid = document.getElementById('wiki-grid');
- grid.innerHTML = '';
-
- if (data.length === 0) {
- grid.innerHTML = '' + (isDE() ? 'Keine Ergebnisse gefunden' : 'No results found') + '
';
- return;
- }
-
- // Group by topic
- const topics = {};
- data.forEach(item => {
- const topicKey = (item.topic_en && currentLang === 'en') ? item.topic_en : (item.topic || 'Unknown');
- if (!topics[topicKey]) topics[topicKey] = [];
- topics[topicKey].push(item);
- });
-
- const colors = ['blue', 'teal', 'green', 'orange', 'purple', 'pink', 'yellow'];
-
- Object.entries(topics).forEach(([topicName, subtopics], idx) => {
- const card = document.createElement('div');
- card.className = 'wiki-card';
- card.dataset.color = colors[idx % colors.length];
-
- // Get excerpt from first subtopic
- const firstSub = subtopics[0];
- const excerpt = currentLang === 'en' && firstSub.wiki_en ? firstSub.wiki_en : (firstSub.wiki || '');
- const subtopicTitle = currentLang === 'en' && firstSub.subtopic_en ? firstSub.subtopic_en : (firstSub.subtopic || '');
-
- card.innerHTML = `
- ${escapeHtml(topicName)}
- ${escapeHtml(excerpt.substring(0, 150))}${excerpt.length > 150 ? '...' : ''}
-
- `;
-
- // Open modal on click
- card.addEventListener('click', () => openWikiModal(topicName, subtopics));
-
- grid.appendChild(card);
- });
-}
-
-function openWikiModal(topicName, subtopics) {
- // Create modal if not exists
- let modalOverlay = document.getElementById('wiki-modal-overlay');
- if (!modalOverlay) {
- modalOverlay = document.createElement('div');
- modalOverlay.id = 'wiki-modal-overlay';
- modalOverlay.className = 'modal-overlay';
- document.body.appendChild(modalOverlay);
- }
-
- let html = '× ';
- html += '
';
- html += `
${escapeHtml(topicName)} `;
-
- subtopics.forEach(sub => {
- const title = currentLang === 'en' && sub.subtopic_en ? sub.subtopic_en : (sub.subtopic || '');
- const content = currentLang === 'en' && sub.wiki_en ? sub.wiki_en : (sub.wiki || '');
- html += `
${escapeHtml(title)} `;
- html += `
${escapeHtml(content)}
`;
- });
-
- html += '
';
- modalOverlay.innerHTML = html;
- modalOverlay.classList.add('active');
-}
-
-function closeWikiModal() {
- const overlay = document.getElementById('wiki-modal-overlay');
- if (overlay) overlay.classList.remove('active');
-}
-
-function searchWiki(term) {
- if (!term.trim()) {
- renderWikiCards(wikiData);
- return;
- }
-
- const t = term.toLowerCase();
- const filtered = wikiData.filter(item => {
- const topic = ((item.topic_en && currentLang === 'en') ? item.topic_en : (item.topic || '')) +
- ' ' + ((item.subtopic_en && currentLang === 'en') ? item.subtopic_en : (item.subtopic || '')) +
- ' ' + ((item.wiki_en && currentLang === 'en') ? item.wiki_en : (item.wiki || ''));
- return topic.toLowerCase().includes(t);
- });
-
- renderWikiCards(filtered);
-}
-
-// ========================================
-// COOKIES
-// ========================================
-function getCookie(name) {
- const localVal = localStorage.getItem('paraguay_' + name);
- if (localVal) return localVal;
-
- const value = `; ${document.cookie}`;
- const parts = value.split(`; ${name}=`);
- if (parts.length === 2) {
- return parts.pop().split(';').shift().replace(/^"|"$/g, '');
- }
- return '';
-}
-
-function setCookie(name, value, days) {
- const expires = new Date();
- expires.setTime(expires.getTime() + days * 24 * 60 * 60 * 1000);
- document.cookie = name + '=' + encodeURIComponent(value) + ';expires=' + expires.toUTCString() + ';path=/';
- localStorage.setItem('paraguay_' + name, value);
-}
-
-// ========================================
-// UTILS
-// ========================================
-function escapeHtml(text) {
- if (!text) return '';
- const div = document.createElement('div');
- div.textContent = text;
- return div.innerHTML;
-}
diff --git a/variations/facebook/style.css b/variations/facebook/style.css
deleted file mode 100644
index 47c5bfa..0000000
--- a/variations/facebook/style.css
+++ /dev/null
@@ -1,401 +0,0 @@
-/* Facebook Style — Blue social network */
-*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
-body {
- font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
- background: #f0f2f5;
- color: #1c1e21;
- line-height: 1.33;
- font-size: 15px;
-}
-
-/* Navigation */
-.nav {
- background: #fff;
- box-shadow: 0 2px 4px rgba(0,0,0,0.1);
- height: 56px;
- position: sticky;
- top: 0;
- z-index: 1000;
- padding: 0 16px;
-}
-.nav-container {
- max-width: 1200px;
- margin: 0 auto;
- display: flex;
- align-items: center;
- justify-content: space-between;
- height: 100%;
-}
-.nav-brand {
- display: flex;
- align-items: center;
- gap: 10px;
- text-decoration: none;
- color: #1877f2;
- font-size: 24px;
- font-weight: 700;
-}
-.nav-logo { font-size: 28px; }
-.nav-menu { display: flex; gap: 8px; align-items: center; }
-.nav-link {
- color: #65676b;
- text-decoration: none;
- font-size: 15px;
- font-weight: 500;
- padding: 8px 16px;
- border-radius: 8px;
- transition: background 0.2s;
-}
-.nav-link:hover { background: #f0f2f5; }
-.nav-actions { display: flex; gap: 8px; align-items: center; }
-.lang-select { display: flex; gap: 4px; }
-.lang-btn {
- background: #f0f2f5;
- border: none;
- padding: 6px 12px;
- font-size: 13px;
- cursor: pointer;
- border-radius: 6px;
- font-weight: 500;
-}
-.lang-btn.active { background: #e7f3ff; color: #1877f2; }
-.lang-btn:hover { background: #e4e6eb; }
-
-/* Buttons */
-.btn {
- padding: 8px 16px;
- font-size: 15px;
- font-weight: 600;
- border-radius: 6px;
- cursor: pointer;
- text-decoration: none;
- display: inline-block;
- border: none;
- transition: background 0.2s;
-}
-.btn-primary { background: #1877f2; color: #fff; }
-.btn-primary:hover { background: #166fe5; }
-.btn-outline {
- background: #f0f2f5;
- color: #1c1e21;
- border: none;
-}
-.btn-outline:hover { background: #e4e6eb; }
-.btn-block { display: block; width: 100%; text-align: center; }
-.btn-telegram { background: #0088cc; color: #fff; }
-
-/* Hero */
-.hero {
- background: linear-gradient(135deg, #1877f2 0%, #42b0ff 100%);
- color: #fff;
- text-align: center;
- padding: 60px 20px 40px;
-}
-.hero-title {
- font-size: 42px;
- font-weight: 700;
- margin-bottom: 12px;
- text-shadow: 0 2px 4px rgba(0,0,0,0.1);
-}
-.hero-subtitle {
- font-size: 18px;
- opacity: 0.9;
- margin-bottom: 30px;
- max-width: 600px;
- margin-left: auto;
- margin-right: auto;
-}
-.hero-stats { display: flex; justify-content: center; gap: 60px; }
-.stat { text-align: center; }
-.stat-number {
- display: block;
- font-size: 36px;
- font-weight: 700;
-}
-
-/* Sections */
-.section {
- background: #fff;
- border-radius: 8px;
- padding: 24px;
- margin: 16px auto;
- max-width: 1200px;
- box-shadow: 0 1px 2px rgba(0,0,0,0.1);
-}
-.section-alt { background: #fff; border-radius: 8px; padding: 24px; margin: 16px auto; max-width: 1200px; box-shadow: 0 1px 2px rgba(0,0,0,0.1); }
-.section-title {
- font-size: 20px;
- font-weight: 700;
- margin-bottom: 20px;
- color: #1c1e21;
-}
-.container { max-width: 100%; }
-
-/* About */
-.about-grid {
- display: grid;
- grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
- gap: 16px;
-}
-.about-card {
- padding: 20px;
- border-radius: 8px;
- background: #f0f2f5;
- transition: transform 0.2s, box-shadow 0.2s;
-}
-.about-card:hover { transform: translateY(-2px); box-shadow: 0 4px 12px rgba(0,0,0,0.1); }
-.about-icon { font-size: 2.5rem; margin-bottom: 12px; }
-.about-card h3 { font-size: 16px; font-weight: 600; color: #1c1e21; margin-bottom: 8px; }
-.about-card p { font-size: 14px; color: #65676b; line-height: 1.4; }
-
-/* Search */
-.search-bar {
- display: flex;
- max-width: 400px;
- margin-bottom: 20px;
- position: relative;
-}
-.search-icon {
- position: absolute;
- left: 12px;
- top: 50%;
- transform: translateY(-50%);
- width: 16px;
- height: 16px;
- color: #65676b;
-}
-.search-input {
- width: 100%;
- padding: 10px 12px 10px 36px;
- border: none;
- border-radius: 20px;
- background: #f0f2f5;
- font-size: 15px;
-}
-.search-input:focus { outline: 2px solid #1877f2; outline-offset: 0; }
-
-/* Members Grid */
-.members-grid {
- display: grid;
- grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
- gap: 12px;
-}
-.member-card {
- display: flex;
- align-items: center;
- gap: 12px;
- padding: 12px;
- border-radius: 8px;
- background: #f0f2f5;
- cursor: pointer;
- transition: background 0.2s;
-}
-.member-card:hover { background: #e4e6eb; }
-.user-avatar {
- width: 48px;
- height: 48px;
- border-radius: 50%;
- object-fit: cover;
-}
-.user-avatar-text {
- width: 48px;
- height: 48px;
- border-radius: 50%;
- background: #1877f2;
- color: #fff;
- display: flex;
- align-items: center;
- justify-content: center;
- font-size: 20px;
- font-weight: 600;
-}
-.member-info h4 { font-size: 15px; font-weight: 600; color: #1c1e21; margin-bottom: 2px; }
-.member-company { font-size: 13px; color: #65676b; }
-.member-location, .member-posts { font-size: 13px; color: #65676b; }
-.rank-badge {
- font-size: 11px;
- padding: 3px 8px;
- border-radius: 12px;
- position: absolute;
- top: -4px;
- right: 0;
- font-weight: 500;
-}
-.rank-badge.rank-rookie { background: #e4e6eb; color: #65676b; }
-.rank-badge.rank-beginner { background: #e7f3e9; color: #0a832c; }
-.rank-badge.rank-member { background: #e7f0ff; color: #1877f2; }
-.rank-badge.rank-contributor { background: #e0f7fa; color: #00838f; }
-.rank-badge.rank-veteran { background: #f3e5f5; color: #8e24aa; }
-.rank-badge.rank-expert { background: #fff3e0; color: #e65100; }
-.rank-badge.rank-legend { background: #fce4ec; color: #c62828; }
-
-/* Wiki Cards */
-.wiki-grid {
- display: grid;
- grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
- gap: 12px;
-}
-.wiki-card {
- padding: 16px;
- border-radius: 8px;
- background: #f0f2f5;
- cursor: pointer;
- transition: all 0.2s;
- border-left: 4px solid #1877f2;
-}
-.wiki-card:hover { background: #e4e6eb; }
-.wiki-card-title { font-size: 15px; font-weight: 600; color: #1c1e21; margin-bottom: 6px; }
-.wiki-card-excerpt { font-size: 13px; color: #65676b; margin-bottom: 8px; }
-.wiki-card-footer { display: flex; justify-content: space-between; font-size: 13px; color: #65676b; }
-.wiki-card-subtopic { color: #1877f2; }
-.no-results { padding: 20px; text-align: center; color: #65676b; }
-.loading-text { padding: 20px; text-align: center; color: #65676b; font-style: italic; }
-
-/* Modal */
-.modal-overlay {
- position: fixed;
- top: 0;
- left: 0;
- right: 0;
- bottom: 0;
- background: rgba(255,255,255,0.8);
- z-index: 2000;
- display: none;
- align-items: center;
- justify-content: center;
-}
-.modal-overlay.active { display: flex; }
-.modal {
- background: #fff;
- border-radius: 8px;
- padding: 24px;
- max-width: 440px;
- width: 90%;
- box-shadow: 0 8px 30px rgba(0,0,0,0.2);
- position: relative;
-}
-.modal-close {
- position: absolute;
- top: 12px;
- right: 16px;
- background: none;
- border: none;
- font-size: 24px;
- cursor: pointer;
- color: #65676b;
-}
-.login-icon { font-size: 3rem; text-align: center; margin-bottom: 16px; }
-.login-hint { color: #65676b; text-align: center; margin-bottom: 20px; font-size: 15px; }
-.form-group { margin-bottom: 14px; }
-.form-input {
- width: 100%;
- padding: 12px 14px;
- border: 1px solid #dddfe2;
- border-radius: 6px;
- font-size: 15px;
-}
-.form-input:focus { border-color: #1877f2; outline: 2px solid #1877f2; outline-offset: -2px; }
-.login-step { display: none; }
-.login-step.active { display: block; }
-
-/* Profile & Detail */
-.profile-username { font-size: 1.2rem; font-weight: 600; margin-bottom: 8px; }
-.profile-rank { margin-bottom: 16px; }
-.user-detail-modal { max-width: 520px; }
-.user-detail-content { padding: 16px; }
-.user-detail-avatar {
- width: 64px;
- height: 64px;
- border-radius: 50%;
- margin: 0 auto 16px;
- overflow: hidden;
-}
-.user-detail-header { text-align: center; margin-bottom: 16px; }
-.user-detail-name-rank { display: flex; align-items: center; justify-content: center; gap: 10px; margin-bottom: 8px; }
-.user-detail-name-rank h2 { font-size: 1.2rem; font-weight: 600; }
-.user-detail-fields { display: grid; gap: 10px; }
-.detail-field { display: flex; justify-content: space-between; padding: 10px 0; border-bottom: 1px solid #e4e6eb; }
-.detail-label { color: #65676b; font-size: 14px; }
-.detail-value { color: #1c1e21; font-size: 14px; text-align: right; }
-.user-detail-company { color: #65676b; text-align: center; }
-
-/* Telegram Banner */
-.telegram-banner {
- background: #e7f3ff;
- padding: 16px 24px;
- margin: 16px auto;
- max-width: 1200px;
- border-radius: 8px;
- display: flex;
- align-items: center;
- gap: 16px;
-}
-.banner-icon { font-size: 2rem; }
-.banner-text strong { color: #1c1e21; }
-
-/* Newsletter */
-.newsletter-card { text-align: center; max-width: 400px; margin: 0 auto; }
-.newsletter-icon { font-size: 2.5rem; margin-bottom: 16px; }
-.newsletter-hint { color: #65676b; margin-bottom: 16px; font-size: 15px; }
-
-/* Footer */
-.footer {
- background: #fff;
- padding: 24px 16px;
- text-align: center;
- border-top: 1px solid #e4e6eb;
- margin-top: 32px;
-}
-.footer-brand { margin-bottom: 12px; }
-.footer-logo { font-size: 1.5rem; }
-.footer-title { color: #1c1e21; margin-left: 10px; font-size: 14px; font-weight: 600; }
-.footer-links { display: flex; justify-content: center; gap: 20px; margin-bottom: 12px; flex-wrap: wrap; }
-.footer-links a { color: #65676b; text-decoration: none; font-size: 13px; }
-.footer-links a:hover { text-decoration: underline; }
-.footer-bottom p { color: #65676b; margin: 4px 0; font-size: 12px; }
-.footer-bottom a { color: #1877f2; }
-.footer-copy { font-size: 12px; }
-
-/* Hide/Show */
-.hide-en { display: none; }
-body[data-lang="en"] .hide-en { display: inline; }
-body[data-lang="en"] .hide-de { display: none; }
-.hidden { display: none !important; }
-
-/* Responsive */
-@media (max-width: 768px) {
- .nav-menu { display: none; }
- .nav-menu.open {
- display: flex;
- position: absolute;
- top: 100%;
- left: 0;
- right: 0;
- background: #fff;
- flex-direction: column;
- padding: 12px;
- gap: 8px;
- border-top: 1px solid #e4e6eb;
- box-shadow: 0 4px 12px rgba(0,0,0,0.1);
- }
- .nav-toggle {
- display: flex;
- flex-direction: column;
- gap: 3px;
- background: none;
- border: none;
- cursor: pointer;
- padding: 4px;
- }
- .nav-toggle span { display: block; width: 20px; height: 2px; background: #65676b; }
- .hero-title { font-size: 28px; }
- .hero-subtitle { font-size: 16px; }
- .hero-stats { gap: 30px; flex-wrap: wrap; }
- .stat-number { font-size: 28px; }
- .about-grid { grid-template-columns: 1fr; }
- .wiki-grid { grid-template-columns: 1fr; }
- .members-grid { grid-template-columns: 1fr; }
-}
-@media (min-width: 769px) {
- .nav-toggle { display: none; }
-}
\ No newline at end of file
diff --git a/variations/neo-mirai/index.html b/variations/neo-mirai/index.html
deleted file mode 100644
index 554a0cf..0000000
--- a/variations/neo-mirai/index.html
+++ /dev/null
@@ -1,462 +0,0 @@
-
-
-
-
-
- Paraguay SRL LLC — Community
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
×
-
-
-
💬
-
Telegram Username
-
Telegram Username
-
- Geben Sie Ihren Telegram-Nutzernamen ein, um einen Login-Link per Nachricht zu erhalten.
- Enter your Telegram username to receive a login link via message.
-
-
-
-
-
- Login-Link senden
- Send Login Link
-
-
-
-
🔐
-
Verifizierungscode
-
Verification Code
-
- Der Code wurde an Ihren Telegram-Account gesendet.
- The code has been sent to your Telegram account.
-
-
-
-
-
- Verifizieren
- Verify
-
-
-
-
🎉
-
Registrierung abschließen
-
Complete Registration
-
-
-
-
-
-
-
- Registrieren
- Register
-
-
-
-
-
-
-
-
-
-
×
-
Dein Profil
-
Your Profile
-
-
-
-
-
-
-
-
-
-
×
-
-
- ?
-
-
-
-
-
- E-Mail
- Email
-
- -
-
-
-
- Homepage
- Homepage
-
- -
-
-
-
- Standort
- Location
-
- -
-
-
-
- Beschreibung
- Description
-
- -
-
-
-
-
-
-
-
-
-
-
-
- Paraguay LLC & SRL
- Paraguay LLC & SRL
- COMMUNITY
-
-
- Der Erfahrungsaustausch für deutsche und amerikanische Expats in Paraguay
- The experience exchange for German and American expats in Paraguay
-
-
-
- --
- Mitglieder
- Members
-
-
- --
- Beiträge
- Posts
-
-
- --
- Wiki-Artikel
- Wiki Articles
-
-
-
-
-
-
-
-
-
📱
-
-
- Noch nicht angemeldet?
- Not logged in yet?
-
- Tritt unserer Telegram-Gruppe bei und erhalte einen Login-Link!
- Join our Telegram group and receive a login link!
-
-
-
- Telegram beitreten
- Join Telegram
-
-
-
-
-
-
-
-
-
-
-
- Über die Community
- About the Community
-
-
-
-
🏦
-
- Banken & Zahlungsverkehr
- Banking & Payments
-
-
- Erfahrungen mit paraguayischen und internationalen Banken, Konten, Überweisungen und Kreditkarten.
- Experiences with Paraguayan and international banks, accounts, transfers and credit cards.
-
-
-
-
⚖️
-
- Rechtliches
- Legal Matters
-
-
- Gesellschaftsrecht, Verträge, Steuern, Compliance und Rechtsprechung in Paraguay.
- Corporate law, contracts, taxes, compliance and jurisprudence in Paraguay.
-
-
-
-
📊
-
- Steuern & Buchhaltung
- Taxes & Accounting
-
-
- Steuerberatung, Buchhaltungssysteme, Jahresabschlüsse und internationale Steuerplanung.
- Tax advice, accounting systems, annual statements and international tax planning.
-
-
-
-
💻
-
- ERP-Systeme
- ERP Systems
-
-
- Erfahrungen mit verschiedenen ERP-Systemen, Software-Lösungen und digitalem Management.
- Experiences with various ERP systems, software solutions and digital management.
-
-
-
-
-
-
-
-
-
-
- Mitglieder
- Members
-
-
-
-
- Lade Mitglieder...
- Loading members...
-
-
-
-
-
-
-
-
-
- Wiki
- Wiki
-
-
-
-
- Lade Wiki...
- Loading wiki...
-
-
-
-
-
-
-
-
-
-
✉️
-
- Newsletter
- Newsletter
-
-
- Erhalten Sie Updates und wichtige Informationen direkt in Ihr Postfach.
- Receive updates and important information directly in your inbox.
-
-
-
-
- Danke! Bitte prüfen Sie Ihre E-Mails.
- Thank you! Please check your emails.
-
-
-
-
-
-
-
-
-
-
-
-
-
-
\ No newline at end of file
diff --git a/variations/neo-mirai/main.js b/variations/neo-mirai/main.js
deleted file mode 100644
index 667dad7..0000000
--- a/variations/neo-mirai/main.js
+++ /dev/null
@@ -1,637 +0,0 @@
-// ========================================
-// Paraguay LLC & SRL — Main JS
-// ========================================
-
-const API_URL = 'https://n8n.odoo4projects.com/webhook/paraguay/login';
-const NEWSLETTER_URL = 'https://n8n.odoo4projects.com/webhook/paraguay/newsletter';
-const USER_URL = 'https://n8n.odoo4projects.com/webhook/paraguay/user';
-const PROFILE_URL = 'https://n8n.odoo4projects.com/webhook/paraguay/profile';
-const WIKI_URL = 'https://n8n.odoo4projects.com/webhook/paraguay/wiki';
-const COMMUNITY_URL = 'https://n8n.odoo4projects.com/webhook/paraguay/community';
-
-let currentLang = 'de';
-
-document.addEventListener('DOMContentLoaded', () => {
- currentLang = document.body.dataset.lang || 'de';
- checkSession();
- loadCommunityStats();
-
- // Smooth scroll nav links
- document.querySelectorAll('.nav-link').forEach(link => {
- link.addEventListener('click', (e) => {
- e.preventDefault();
- const target = document.querySelector(link.getAttribute('href'));
- if (target) {
- target.scrollIntoView({ behavior: 'smooth' });
- }
- // Close mobile nav
- document.getElementById('nav-menu').classList.remove('open');
- });
- });
-
- // Mobile nav toggle
- const navToggle = document.getElementById('nav-toggle');
- const navMenu = document.getElementById('nav-menu');
- if (navToggle) {
- navToggle.addEventListener('click', () => {
- navMenu.classList.toggle('open');
- });
- }
-
- // Navbar scroll effect
- window.addEventListener('scroll', () => {
- const nav = document.getElementById('main-nav');
- if (nav) {
- nav.classList.toggle('scrolled', window.scrollY > 20);
- }
- });
-
- // Language toggle
- document.querySelectorAll('.lang-btn').forEach(btn => {
- btn.addEventListener('click', () => {
- const lang = btn.dataset.lang;
- setLanguage(lang);
- // Reload content in new language
- if (isLoggedIn) {
- if (document.querySelector('.notebook') || document.getElementById('members-list')) loadUsers();
- if (document.getElementById('wiki-grid')) loadWiki();
- }
- });
- });
-
- // Member search
- const memberSearch = document.getElementById('member-search');
- if (memberSearch) {
- memberSearch.addEventListener('input', (e) => {
- filterMembers(e.target.value);
- });
- }
-
- // Wiki search
- const wikiSearch = document.getElementById('wiki-search');
- if (wikiSearch) {
- wikiSearch.addEventListener('input', (e) => {
- searchWiki(e.target.value);
- });
- }
-
- // Close modals on overlay click
- document.querySelectorAll('.modal-overlay').forEach(overlay => {
- overlay.addEventListener('click', (e) => {
- if (e.target === overlay) {
- overlay.classList.remove('active');
- }
- });
- });
-
- // Close modals on Escape
- document.addEventListener('keydown', (e) => {
- if (e.key === 'Escape') {
- document.querySelectorAll('.modal-overlay.active').forEach(m => m.classList.remove('active'));
- }
- });
-
- // Login button
- const loginBtn = document.getElementById('login-btn');
- if (loginBtn) {
- loginBtn.addEventListener('click', () => {
- openLoginModal();
- });
- }
-});
-
-// ========================================
-// LANGUAGE
-// ========================================
-function setLanguage(lang) {
- currentLang = lang;
- document.body.dataset.lang = lang;
- document.querySelectorAll('.lang-btn').forEach(b => {
- b.classList.toggle('active', b.dataset.lang === lang);
- });
-}
-
-function isDE() {
- return currentLang !== 'en';
-}
-
-// ========================================
-// COMMUNITY STATS
-// ========================================
-async function loadCommunityStats() {
- try {
- const response = await fetch(COMMUNITY_URL);
- if (!response.ok) throw new Error('Failed to fetch');
- const data = await response.json();
-
- if (data.users !== undefined) {
- animateCounter('stat-members', data.users);
- }
- if (data.topics !== undefined) {
- document.getElementById('stat-wiki').textContent = data.topics;
- }
- } catch (error) {
- console.error('Failed to load community stats:', error);
- }
-}
-
-function animateCounter(elementId, targetNumber) {
- const element = document.getElementById(elementId);
- if (!element) return;
-
- let current = 0;
- const duration = 1500; // ms
- const steps = 40;
- const increment = targetNumber / steps;
- const stepTime = duration / steps;
-
- const timer = setInterval(() => {
- current += increment;
- if (current >= targetNumber) {
- element.textContent = targetNumber;
- clearInterval(timer);
- } else {
- element.textContent = Math.floor(current);
- }
- }, stepTime);
-}
-
-// ========================================
-// AUTH / SESSION
-// ========================================
-let isLoggedIn = false;
-
-function isSessionValid() {
- const sid = getCookie('sessionid');
- return sid.length > 0;
-}
-
-function checkSession() {
- isLoggedIn = isSessionValid();
-
- if (isLoggedIn) {
- document.body.dataset.loggedIn = 'true';
- document.getElementById('login-btn').style.display = 'none';
- document.getElementById('logout-btn').style.display = 'inline-flex';
- document.getElementById('profile-btn').style.display = 'inline-flex';
- document.getElementById('telegram-banner').style.display = 'none';
- document.getElementById('main-content').style.display = 'block';
- document.getElementById('newsletter-section').style.display = 'block';
- loadUsers();
- loadWiki();
- } else {
- document.body.dataset.loggedIn = 'false';
- document.getElementById('login-btn').style.display = 'inline-flex';
- document.getElementById('logout-btn').style.display = 'none';
- document.getElementById('profile-btn').style.display = 'none';
- document.getElementById('telegram-banner').style.display = 'block';
- document.getElementById('main-content').style.display = 'none';
- document.getElementById('newsletter-section').style.display = 'none';
- }
-}
-
-// ========================================
-// LOGIN MODAL
-// ========================================
-function openLoginModal() {
- document.getElementById('login-modal-overlay').classList.add('active');
- // Reset to step 1
- document.querySelectorAll('.login-step').forEach(s => s.classList.remove('active'));
- document.getElementById('login-step-1').classList.add('active');
- document.getElementById('telegram-user').value = '';
- document.getElementById('verification-code').value = '';
-}
-
-function closeLoginModal() {
- document.getElementById('login-modal-overlay').classList.remove('active');
-}
-
-// ========================================
-// PROFILE MODAL
-// ========================================
-function openProfileModal() {
- const sid = getCookie('sessionid');
- if (!sid) { alert('Bitte anmelden.'); return; }
-
- fetch(PROFILE_URL + '?sessionid=' + encodeURIComponent(sid))
- .then(r => r.json())
- .then(user => {
- document.getElementById('profile-username-display').textContent = user.username || '';
- const rank = getRank(user.posts || 0);
- const badge = document.getElementById('profile-rank-badge');
- badge.innerHTML = `${rank.emoji} ${rank.title} `;
-
- document.getElementById('profile-company').value = user.company || '';
- document.getElementById('profile-email').value = user.email || '';
- document.getElementById('profile-homepage').value = user.homepage || '';
- document.getElementById('profile-image').value = user.image || '';
- document.getElementById('profile-location').value = user.location || '';
- document.getElementById('profile-description').value = user.Description || '';
- document.getElementById('profile-publish').checked = true;
-
- document.getElementById('profile-modal-overlay').classList.add('active');
- })
- .catch(() => alert('Fehler beim Laden des Profils.'));
-}
-
-function closeProfileModal() {
- document.getElementById('profile-modal-overlay').classList.remove('active');
-}
-
-function saveProfile() {
- const sid = getCookie('sessionid');
- fetch(PROFILE_URL, {
- method: 'POST',
- headers: { 'Content-Type': 'application/json' },
- body: JSON.stringify({
- username: document.getElementById('profile-username-display').textContent,
- company: document.getElementById('profile-company').value.trim(),
- email: document.getElementById('profile-email').value,
- homepage: document.getElementById('profile-homepage').value,
- image: document.getElementById('profile-image').value,
- location: document.getElementById('profile-location').value,
- Description: document.getElementById('profile-description').value,
- sessionid: sid,
- publish: document.getElementById('profile-publish').checked
- })
- })
- .then(r => r.ok ? alert('Profil gespeichert!') : alert('Fehler beim Speichern.'))
- .catch(() => alert('Fehler bei der Verbindung.'));
-}
-
-// ========================================
-// USER DETAIL MODAL
-// ========================================
-function openUserDetailModal(user) {
- const avatar = document.getElementById('user-detail-avatar');
- if (user.image) {
- avatar.innerHTML = ` `;
- } else {
- avatar.innerHTML = `${(user.username || '?').charAt(0).toUpperCase()} `;
- }
-
- document.getElementById('user-detail-initial').textContent = '';
- document.getElementById('user-detail-username').textContent = '@' + (user.username || 'Unknown');
-
- const rank = getRank(user.posts || 0);
- document.getElementById('user-detail-rank-badge').className = `rank-badge rank-${rank.level}`;
- document.getElementById('user-detail-rank-badge').textContent = rank.emoji + ' ' + rank.title;
-
- document.getElementById('user-detail-company').textContent = user.company || '';
-
- const emailEl = document.getElementById('user-detail-email');
- emailEl.innerHTML = user.email ? `${user.email} ` : '-';
-
- const hpEl = document.getElementById('user-detail-homepage');
- const hp = user.homepage || '';
- hpEl.innerHTML = hp ? `${hp} ` : '-';
-
- document.getElementById('user-detail-location').textContent = user.location || '-';
- document.getElementById('user-detail-description').innerHTML = (user.Description || '-').replace(/\n/g, ' ');
-
- document.getElementById('user-detail-modal-overlay').classList.add('active');
-}
-
-function closeUserDetailModal() {
- document.getElementById('user-detail-modal-overlay').classList.remove('active');
-}
-
-// ========================================
-// LOGIN FLOW
-// ========================================
-function sendTelegramUser() {
- const user = document.getElementById('telegram-user').value.trim();
- if (!user) { alert('Bitte geben Sie einen Telegram-Nutzernamen ein.'); return; }
-
- const btn = event.target;
- btn.disabled = true;
- btn.textContent = isDE() ? 'Sende...' : 'Sending...';
-
- fetch(API_URL, {
- method: 'POST',
- headers: { 'Content-Type': 'application/json' },
- body: JSON.stringify({ username: user })
- })
- .then(r => r.json())
- .then(data => {
- if (data.sessionid) {
- setCookie('sessionid', data.sessionid, 1);
- document.getElementById('login-step-1').classList.remove('active');
- document.getElementById('login-step-3').classList.add('active');
- } else if (data.status === 'code send') {
- document.getElementById('login-step-1').classList.remove('active');
- document.getElementById('login-step-2').classList.add('active');
- } else {
- alert(isDE() ? 'Benutzername nicht gefunden. Bitte über Telegram Bot anmelden.' : 'Username not found. Please sign up via Telegram bot.');
- }
- })
- .catch(() => {
- btn.disabled = false;
- alert(isDE() ? 'Verbindungsfehler' : 'Connection error');
- });
-}
-
-function verifyCode() {
- const code = document.getElementById('verification-code').value.trim();
- if (!code) { alert('Bitte geben Sie den Code ein.'); return; }
-
- fetch(API_URL, {
- method: 'POST',
- headers: { 'Content-Type': 'application/json' },
- body: JSON.stringify({
- username: document.getElementById('telegram-user').value,
- code: code,
- sessionid: getCookie('sessionid')
- })
- })
- .then(r => r.json())
- .then(data => {
- if (data.sessionid) {
- setCookie('sessionid', data.sessionid, 1);
- checkSession();
- closeLoginModal();
- } else {
- alert(isDE() ? 'Ungültiger Code' : 'Invalid code');
- }
- })
- .catch(() => alert(isDE() ? 'Verbindungsfehler' : 'Connection error'));
-}
-
-function submitLoginData() {
- const name = document.getElementById('full-name').value.trim();
- const llc = document.getElementById('llc-name').value.trim();
- if (!name || !llc) { alert(isDE() ? 'Bitte Name und LLC eintragen' : 'Please enter name and LLC'); return; }
-
- fetch(API_URL, {
- method: 'POST',
- headers: { 'Content-Type': 'application/json' },
- body: JSON.stringify({
- username: document.getElementById('telegram-user').value,
- name: name,
- llc: llc
- })
- })
- .then(r => r.json())
- .then(data => {
- if (data.sessionid) {
- setCookie('sessionid', data.sessionid, 1);
- checkSession();
- closeLoginModal();
- } else {
- alert(isDE() ? 'Registrierung fehlgeschlagen' : 'Registration failed');
- }
- })
- .catch(() => alert(isDE() ? 'Verbindungsfehler' : 'Connection error'));
-}
-
-function logout() {
- setCookie('sessionid', '', -1);
- checkSession();
-}
-
-// ========================================
-// NEWSLETTER
-// ========================================
-function subscribeNewsletter() {
- const email = document.getElementById('newsletter-email').value.trim();
- if (!email) { alert(isDE() ? 'Bitte E-Mail eingeben' : 'Please enter email'); return; }
-
- fetch(NEWSLETTER_URL, {
- method: 'POST',
- headers: { 'Content-Type': 'application/json' },
- body: JSON.stringify({ email: email })
- })
- .then(r => {
- if (r.ok) {
- document.getElementById('newsletter-form').classList.add('hidden');
- document.getElementById('newsletter-success').classList.remove('hidden');
- } else {
- alert(isDE() ? 'Fehler beim Abonnieren' : 'Error subscribing');
- }
- })
- .catch(() => alert(isDE() ? 'Verbindungsfehler' : 'Connection error'));
-}
-
-// ========================================
-// USERS / MEMBERS
-// ========================================
-async function loadUsers() {
- try {
- const response = await fetch(USER_URL);
- if (!response.ok) throw new Error('Failed to fetch');
- const data = await response.json();
- const container = document.getElementById('members-list');
-
- if (data.data && Array.isArray(data.data)) {
- container.innerHTML = '';
- container.style.display = 'grid';
-
- data.data.forEach(user => {
- const card = createMemberCard(user);
- container.appendChild(card);
- });
-
- // Update stats will be handled by loadCommunityStats
- } else {
- container.innerHTML = '' + (isDE() ? 'Keine Mitglieder gefunden' : 'No members found') + '
';
- }
- } catch (error) {
- const container = document.getElementById('members-list');
- container.innerHTML = '' + (isDE() ? 'Fehler beim Laden' : 'Error loading') + '
';
- }
-}
-
-function createMemberCard(user) {
- const card = document.createElement('div');
- card.className = 'member-card';
-
- const rank = getRank(user.posts || 0);
- const avatarContent = user.image
- ? ` `
- : (user.username || '?').charAt(0).toUpperCase();
-
- card.innerHTML = `
- ${avatarContent}
-
-
${user.username || 'N/A'}
-
${user.company || ''}
- ${user.location ? `
📍 ${user.location}
` : ''}
- ${user.posts ? `
${user.posts} ${isDE() ? 'Beiträge' : 'posts'}
` : ''}
-
${rank.emoji} ${rank.title}
-
- `;
-
- card.addEventListener('click', () => openUserDetailModal(user));
- return card;
-}
-
-function filterMembers(term) {
- const cards = document.querySelectorAll('.member-card');
- const t = term.toLowerCase();
- cards.forEach(card => {
- const text = card.textContent.toLowerCase();
- card.style.display = text.includes(t) ? 'flex' : 'none';
- });
-}
-
-// ========================================
-// RANKS
-// ========================================
-function getRank(posts) {
- if (posts >= 500) return { level: 'legend', title: isDE() ? 'Legende' : 'Legend', emoji: '👑' };
- if (posts >= 200) return { level: 'expert', title: isDE() ? 'Experte' : 'Expert', emoji: '🏆' };
- if (posts >= 100) return { level: 'veteran', title: isDE() ? 'Veteran' : 'Veteran', emoji: '💎' };
- if (posts >= 50) return { level: 'contributor', title: isDE() ? 'Mitwirkender' : 'Contributor', emoji: '⭐' };
- if (posts >= 30) return { level: 'member', title: isDE() ? 'Mitglied' : 'Member', emoji: '🌳' };
- if (posts >= 5) return { level: 'beginner', title: isDE() ? 'Einsteiger' : 'Beginner', emoji: '🌿' };
- return { level: 'rookie', title: isDE() ? 'Anfänger' : 'Rookie', emoji: '🌱' };
-}
-
-// ========================================
-// WIKI
-// ========================================
-let wikiData = [];
-
-async function loadWiki() {
- try {
- const response = await fetch(WIKI_URL);
- if (!response.ok) throw new Error('Failed to fetch');
- const result = await response.json();
-
- if (result.data && Array.isArray(result.data)) {
- wikiData = result.data;
- renderWikiCards(wikiData);
-
- // Wiki count will be loaded from community webhook
- } else {
- document.getElementById('wiki-grid').innerHTML = '' + (isDE() ? 'Keine Wiki-Daten' : 'No wiki data') + '
';
- }
- } catch (error) {
- document.getElementById('wiki-grid').innerHTML = '' + (isDE() ? 'Fehler beim Laden' : 'Error loading') + '
';
- }
-}
-
-function renderWikiCards(data) {
- const grid = document.getElementById('wiki-grid');
- grid.innerHTML = '';
-
- if (data.length === 0) {
- grid.innerHTML = '' + (isDE() ? 'Keine Ergebnisse gefunden' : 'No results found') + '
';
- return;
- }
-
- // Group by topic
- const topics = {};
- data.forEach(item => {
- const topicKey = (item.topic_en && currentLang === 'en') ? item.topic_en : (item.topic || 'Unknown');
- if (!topics[topicKey]) topics[topicKey] = [];
- topics[topicKey].push(item);
- });
-
- const colors = ['blue', 'teal', 'green', 'orange', 'purple', 'pink', 'yellow'];
-
- Object.entries(topics).forEach(([topicName, subtopics], idx) => {
- const card = document.createElement('div');
- card.className = 'wiki-card';
- card.dataset.color = colors[idx % colors.length];
-
- // Get excerpt from first subtopic
- const firstSub = subtopics[0];
- const excerpt = currentLang === 'en' && firstSub.wiki_en ? firstSub.wiki_en : (firstSub.wiki || '');
- const subtopicTitle = currentLang === 'en' && firstSub.subtopic_en ? firstSub.subtopic_en : (firstSub.subtopic || '');
-
- card.innerHTML = `
- ${escapeHtml(topicName)}
- ${escapeHtml(excerpt.substring(0, 150))}${excerpt.length > 150 ? '...' : ''}
-
- `;
-
- // Open modal on click
- card.addEventListener('click', () => openWikiModal(topicName, subtopics));
-
- grid.appendChild(card);
- });
-}
-
-function openWikiModal(topicName, subtopics) {
- // Create modal if not exists
- let modalOverlay = document.getElementById('wiki-modal-overlay');
- if (!modalOverlay) {
- modalOverlay = document.createElement('div');
- modalOverlay.id = 'wiki-modal-overlay';
- modalOverlay.className = 'modal-overlay';
- document.body.appendChild(modalOverlay);
- }
-
- let html = '× ';
- html += '
';
- html += `
${escapeHtml(topicName)} `;
-
- subtopics.forEach(sub => {
- const title = currentLang === 'en' && sub.subtopic_en ? sub.subtopic_en : (sub.subtopic || '');
- const content = currentLang === 'en' && sub.wiki_en ? sub.wiki_en : (sub.wiki || '');
- html += `
${escapeHtml(title)} `;
- html += `
${escapeHtml(content)}
`;
- });
-
- html += '
';
- modalOverlay.innerHTML = html;
- modalOverlay.classList.add('active');
-}
-
-function closeWikiModal() {
- const overlay = document.getElementById('wiki-modal-overlay');
- if (overlay) overlay.classList.remove('active');
-}
-
-function searchWiki(term) {
- if (!term.trim()) {
- renderWikiCards(wikiData);
- return;
- }
-
- const t = term.toLowerCase();
- const filtered = wikiData.filter(item => {
- const topic = ((item.topic_en && currentLang === 'en') ? item.topic_en : (item.topic || '')) +
- ' ' + ((item.subtopic_en && currentLang === 'en') ? item.subtopic_en : (item.subtopic || '')) +
- ' ' + ((item.wiki_en && currentLang === 'en') ? item.wiki_en : (item.wiki || ''));
- return topic.toLowerCase().includes(t);
- });
-
- renderWikiCards(filtered);
-}
-
-// ========================================
-// COOKIES
-// ========================================
-function getCookie(name) {
- const localVal = localStorage.getItem('paraguay_' + name);
- if (localVal) return localVal;
-
- const value = `; ${document.cookie}`;
- const parts = value.split(`; ${name}=`);
- if (parts.length === 2) {
- return parts.pop().split(';').shift().replace(/^"|"$/g, '');
- }
- return '';
-}
-
-function setCookie(name, value, days) {
- const expires = new Date();
- expires.setTime(expires.getTime() + days * 24 * 60 * 60 * 1000);
- document.cookie = name + '=' + encodeURIComponent(value) + ';expires=' + expires.toUTCString() + ';path=/';
- localStorage.setItem('paraguay_' + name, value);
-}
-
-// ========================================
-// UTILS
-// ========================================
-function escapeHtml(text) {
- if (!text) return '';
- const div = document.createElement('div');
- div.textContent = text;
- return div.innerHTML;
-}
diff --git a/variations/neo-mirai/style.css b/variations/neo-mirai/style.css
deleted file mode 100644
index cdf9cd8..0000000
--- a/variations/neo-mirai/style.css
+++ /dev/null
@@ -1,319 +0,0 @@
-/* Neo-Mirai — Cyberpunk/Futuristic Design */
-*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
-body {
- font-family: 'Rajdhani', sans-serif;
- background: #0a0a1a;
- color: #e0e0e0;
- overflow-x: hidden;
- line-height: 1.6;
-}
-
-/* Neon Grid Background */
-.neon-grid-bg {
- position: fixed; top: 0; left: 0; width: 100%; height: 100%;
- background-image:
- linear-gradient(rgba(0,255,255,0.03) 1px, transparent 1px),
- linear-gradient(90deg, rgba(0,255,255,0.03) 1px, transparent 1px);
- background-size: 50px 50px;
- pointer-events: none; z-index: 0;
-}
-
-/* Scanline Effect */
-.scanline {
- position: fixed; top: 0; left: 0; width: 100%; height: 100%;
- background: repeating-linear-gradient(
- 0deg, transparent, transparent 2px, rgba(0,0,0,0.1) 2px, rgba(0,0,0,0.1) 4px
- );
- pointer-events: none; z-index: 9999; opacity: 0.4;
-}
-
-/* Navigation */
-.nav {
- position: fixed; top: 0; left: 0; right: 0; z-index: 1000;
- background: rgba(10,10,26,0.95);
- border-bottom: 1px solid rgba(0,255,255,0.2);
- backdrop-filter: blur(10px);
-}
-.nav-container {
- max-width: 1200px; margin: 0 auto; padding: 0 20px;
- display: flex; align-items: center; justify-content: space-between; height: 70px;
-}
-.nav-brand {
- display: flex; align-items: center; gap: 10px; text-decoration: none;
- font-family: 'Orbitron', sans-serif; font-weight: 700; font-size: 1.2rem; color: #0ff;
- text-shadow: 0 0 10px rgba(0,255,255,0.5);
-}
-.nav-title { letter-spacing: 2px; }
-.accent { color: #f0f; text-shadow: 0 0 10px rgba(255,0,255,0.5); }
-.nav-logo { font-size: 1.5rem; }
-
-/* Nav Links */
-.nav-menu { display: flex; align-items: center; gap: 25px; }
-.nav-link {
- color: #888; text-decoration: none; font-size: 1rem; font-weight: 500;
- letter-spacing: 1px; transition: color 0.3s, text-shadow 0.3s;
-}
-.nav-link:hover { color: #0ff; text-shadow: 0 0 10px rgba(0,255,255,0.5); }
-
-/* Nav Actions */
-.nav-actions { display: flex; align-items: center; gap: 15px; }
-.lang-select { display: flex; gap: 5px; }
-.lang-btn {
- background: none; border: 1px solid rgba(0,255,255,0.3); color: #888;
- padding: 5px 12px; font-family: 'Orbitron', sans-serif; font-size: 0.8rem;
- cursor: pointer; transition: all 0.3s; letter-spacing: 1px;
-}
-.lang-btn.active, .lang-btn:hover { color: #0ff; border-color: #0ff; box-shadow: 0 0 10px rgba(0,255,255,0.3); }
-
-/* Buttons */
-.btn { padding: 8px 20px; font-family: 'Rajdhani', sans-serif; font-weight: 600; font-size: 1rem; cursor: pointer; transition: all 0.3s; letter-spacing: 1px; text-decoration: none; display: inline-flex; align-items: center; gap: 8px; border: none; }
-.btn-neon {
- background: transparent; border: 1px solid #0ff; color: #0ff;
- box-shadow: 0 0 5px rgba(0,255,255,0.3), inset 0 0 5px rgba(0,255,255,0.1);
-}
-.btn-neon:hover {
- background: rgba(0,255,255,0.1);
- box-shadow: 0 0 20px rgba(0,255,255,0.5), inset 0 0 10px rgba(0,255,255,0.2);
- text-shadow: 0 0 10px #0ff;
-}
-.btn-neon-outline { background: transparent; border: 1px solid rgba(0,255,255,0.3); color: #0ff; }
-.btn-neon-outline:hover { border-color: #0ff; background: rgba(0,255,255,0.1); }
-.btn-telegram { background: #0088cc; border: none; color: white; padding: 8px 20px; font-family: 'Rajdhani', sans-serif; font-weight: 600; }
-.btn-telegram:hover { background: #0099dd; }
-.btn-block { display: block; width: 100%; text-align: center; }
-
-/* Hero */
-.hero {
- min-height: 100vh; display: flex; align-items: center; justify-content: center;
- text-align: center; position: relative; padding: 100px 20px 60px;
- background: radial-gradient(ellipse at center, rgba(0,255,255,0.05) 0%, transparent 70%);
-}
-.hero-content { position: relative; z-index: 2; }
-.neo-title {
- font-family: 'Orbitron', sans-serif; font-size: 3.5rem; font-weight: 900;
- color: #fff; letter-spacing: 4px; margin-bottom: 20px;
- text-shadow: 0 0 20px rgba(0,255,255,0.5), 0 0 40px rgba(0,255,255,0.3);
-}
-.hero-subtitle {
- font-size: 1.3rem; color: #aaa; max-width: 600px; margin: 0 auto 40px;
- letter-spacing: 2px;
-}
-.neo-stats { display: flex; justify-content: center; gap: 60px; }
-.neo-stat {
- text-align: center; padding: 20px;
- border: 1px solid rgba(0,255,255,0.2); border-radius: 10px;
- background: rgba(0,255,255,0.02);
- backdrop-filter: blur(5px);
-}
-.stat-number {
- display: block; font-family: 'Orbitron', sans-serif; font-size: 2.5rem;
- font-weight: 900; color: #0ff; text-shadow: 0 0 10px rgba(0,255,255,0.5);
-}
-
-/* Sections */
-.section { padding: 80px 20px; position: relative; z-index: 1; }
-.section-alt { background: rgba(0,255,255,0.02); }
-.section-title {
- font-family: 'Orbitron', sans-serif; font-size: 2rem; font-weight: 700;
- color: #0ff; text-align: center; margin-bottom: 50px; letter-spacing: 3px;
- text-shadow: 0 0 10px rgba(0,255,255,0.3);
-}
-.container { max-width: 1200px; margin: 0 auto; }
-
-/* About Cards */
-.about-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 25px; }
-.neo-card {
- background: rgba(0,255,255,0.02); border: 1px solid rgba(0,255,255,0.15);
- border-radius: 15px; padding: 30px; transition: all 0.3s;
- backdrop-filter: blur(5px);
-}
-.neo-card:hover {
- border-color: #0ff; box-shadow: 0 0 20px rgba(0,255,255,0.2);
- transform: translateY(-5px);
-}
-.about-icon { font-size: 2.5rem; margin-bottom: 15px; }
-.about-card h3 {
- font-family: 'Orbitron', sans-serif; font-size: 1.1rem; color: #0ff;
- margin-bottom: 10px; letter-spacing: 1px;
-}
-.about-card p { color: #aaa; font-size: 0.95rem; }
-
-/* Members */
-.search-bar { display: flex; align-items: center; max-width: 400px; margin: 0 auto 30px; position: relative; }
-.search-icon { position: absolute; left: 15px; width: 20px; height: 20px; color: #555; }
-.search-input {
- width: 100%; padding: 12px 15px 12px 45px; background: rgba(0,255,255,0.05);
- border: 1px solid rgba(0,255,255,0.2); border-radius: 8px;
- color: #fff; font-family: 'Rajdhani', sans-serif; font-size: 1rem;
-}
-.search-input:focus { outline: none; border-color: #0ff; box-shadow: 0 0 10px rgba(0,255,255,0.3); }
-
-.members-grid {
- display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
- gap: 20px;
-}
-.member-card {
- display: flex; align-items: center; gap: 15px; padding: 20px;
- background: rgba(0,255,255,0.02); border: 1px solid rgba(0,255,255,0.1);
- border-radius: 10px; cursor: pointer; transition: all 0.3s;
-}
-.member-card:hover { border-color: #0ff; box-shadow: 0 0 15px rgba(0,255,255,0.2); }
-.user-avatar {
- width: 50px; height: 50px; border-radius: 50%; object-fit: cover;
- border: 2px solid rgba(0,255,255,0.3);
-}
-.user-avatar-text {
- width: 50px; height: 50px; border-radius: 50%;
- background: rgba(0,255,255,0.1); color: #0ff;
- display: flex; align-items: center; justify-content: center;
- font-family: 'Orbitron', sans-serif; font-size: 1.5rem; font-weight: 700;
-}
-.member-info h4 { color: #0ff; font-family: 'Orbitron', sans-serif; font-size: 1rem; }
-.member-company { color: #888; font-size: 0.85rem; }
-.member-location, .member-posts { color: #aaa; font-size: 0.85rem; }
-.rank-badge {
- position: absolute; top: -8px; right: 0; font-size: 0.7rem; padding: 2px 8px;
- border-radius: 10px; font-weight: 600; letter-spacing: 1px;
-}
-.rank-badge.rank-rookie { background: rgba(128,128,128,0.2); color: #888; }
-.rank-badge.rank-beginner { background: rgba(0,255,0,0.2); color: #0f0; }
-.rank-badge.rank-member { background: rgba(0,128,255,0.2); color: #08f; }
-.rank-badge.rank-contributor { background: rgba(0,255,255,0.2); color: #0ff; }
-.rank-badge.rank-veteran { background: rgba(255,0,255,0.2); color: #f0f; }
-.rank-badge.rank-expert { background: rgba(255,200,0,0.2); color: #fc0; }
-.rank-badge.rank-legend { background: rgba(255,0,0,0.2); color: #f44; }
-
-/* Wiki Grid */
-.wiki-grid {
- display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
- gap: 20px;
-}
-.wiki-card {
- padding: 25px; border-radius: 12px; cursor: pointer;
- transition: all 0.3s; position: relative; overflow: hidden;
-}
-.wiki-card::before {
- content: ''; position: absolute; top: 0; left: 0; right: 0; height: 3px;
-}
-.wiki-card[data-color="blue"] { background: rgba(0,100,255,0.05); border: 1px solid rgba(0,100,255,0.2); }
-.wiki-card[data-color="blue"]::before { background: #0064ff; }
-.wiki-card[data-color="teal"] { background: rgba(0,200,200,0.05); border: 1px solid rgba(0,200,200,0.2); }
-.wiki-card[data-color="teal"]::before { background: #00c8c8; }
-.wiki-card[data-color="green"] { background: rgba(0,200,0,0.05); border: 1px solid rgba(0,200,0,0.2); }
-.wiki-card[data-color="green"]::before { background: #00c800; }
-.wiki-card[data-color="orange"] { background: rgba(255,150,0,0.05); border: 1px solid rgba(255,150,0,0.2); }
-.wiki-card[data-color="orange"]::before { background: #ff9600; }
-.wiki-card[data-color="purple"] { background: rgba(150,0,255,0.05); border: 1px solid rgba(150,0,255,0.2); }
-.wiki-card[data-color="purple"]::before { background: #9600ff; }
-.wiki-card[data-color="pink"] { background: rgba(255,0,150,0.05); border: 1px solid rgba(255,0,150,0.2); }
-.wiki-card[data-color="pink"]::before { background: #ff0096; }
-.wiki-card:hover { transform: translateY(-5px); box-shadow: 0 10px 30px rgba(0,0,0,0.3); }
-.wiki-card-title { font-family: 'Orbitron', sans-serif; font-size: 1.1rem; color: #fff; margin-bottom: 10px; }
-.wiki-card-excerpt { color: #888; font-size: 0.9rem; margin-bottom: 15px; }
-.wiki-card-footer { display: flex; justify-content: space-between; font-size: 0.85rem; color: #aaa; }
-.wiki-card-subtopic { color: #0ff; }
-.no-results { color: #888; text-align: center; padding: 40px; }
-.loading-text { color: #555; text-align: center; padding: 40px; font-style: italic; }
-
-/* Modal */
-.modal-overlay {
- position: fixed; top: 0; left: 0; width: 100%; height: 100%;
- background: rgba(0,0,0,0.8); backdrop-filter: blur(5px);
- z-index: 2000; display: none; align-items: center; justify-content: center;
-}
-.modal-overlay.active { display: flex; }
-.modal {
- background: rgba(10,10,26,0.95); border: 1px solid rgba(0,255,255,0.3);
- border-radius: 15px; padding: 40px; max-width: 500px; width: 90%;
- box-shadow: 0 0 30px rgba(0,255,255,0.2); position: relative;
-}
-.modal-close {
- position: absolute; top: 15px; right: 20px; background: none; border: none;
- color: #0ff; font-size: 1.5rem; cursor: pointer;
-}
-.login-icon { font-size: 3rem; text-align: center; margin-bottom: 20px; }
-.login-hint { color: #888; text-align: center; margin-bottom: 25px; font-size: 0.95rem; }
-.form-group { margin-bottom: 15px; }
-.form-input {
- width: 100%; padding: 12px; background: rgba(0,255,255,0.05);
- border: 1px solid rgba(0,255,255,0.2); border-radius: 8px;
- color: #fff; font-family: 'Rajdhani', sans-serif; font-size: 1rem;
-}
-.form-input:focus { outline: none; border-color: #0ff; box-shadow: 0 0 10px rgba(0,255,255,0.3); }
-.login-steps { display: none; }
-.login-step.active { display: block; }
-.login-step { display: none; }
-.login-step.active { display: block; }
-
-/* Profile Modal */
-.profile-username { font-family: 'Orbitron', sans-serif; font-size: 1.3rem; color: #0ff; margin-bottom: 10px; }
-.profile-rank { margin-bottom: 20px; }
-.profile-edit-fields { max-height: 500px; overflow-y: auto; }
-
-/* User Detail Modal */
-.user-detail-modal { max-width: 600px; }
-.user-detail-content { padding: 20px; }
-.user-detail-avatar {
- width: 80px; height: 80px; border-radius: 50%; margin: 0 auto 20px;
- border: 2px solid #0ff; overflow: hidden;
-}
-.user-detail-header { text-align: center; margin-bottom: 20px; }
-.user-detail-name-rank { display: flex; align-items: center; justify-content: center; gap: 10px; margin-bottom: 10px; }
-.user-detail-name-rank h2 { color: #0ff; font-family: 'Orbitron', sans-serif; }
-.user-detail-fields { display: grid; gap: 10px; }
-.detail-field { display: flex; justify-content: space-between; padding: 8px 0; border-bottom: 1px solid rgba(0,255,255,0.1); }
-.detail-label { color: #888; font-size: 0.9rem; }
-.detail-value { color: #0ff; font-size: 0.9rem; text-align: right; }
-.user-detail-company { color: #aaa; }
-
-/* Telegram Banner */
-.telegram-banner {
- background: rgba(0,136,204,0.1); border: 1px solid rgba(0,136,204,0.3);
- padding: 20px; margin: 20px; border-radius: 10px;
- display: flex; align-items: center; gap: 20px; flex-wrap: wrap;
-}
-.banner-icon { font-size: 2rem; }
-.banner-text { flex: 1; }
-.banner-text strong { color: #fff; }
-
-/* Newsletter */
-.newsletter-card { text-align: center; max-width: 400px; margin: 0 auto; }
-.newsletter-icon { font-size: 3rem; margin-bottom: 20px; }
-.newsletter-hint { color: #aaa; margin-bottom: 20px; }
-
-/* Footer */
-.footer {
- background: rgba(0,0,0,0.3); border-top: 1px solid rgba(0,255,255,0.1);
- padding: 40px 20px; text-align: center; position: relative; z-index: 1;
-}
-.footer-brand { margin-bottom: 20px; }
-.footer-logo { font-size: 2rem; }
-.footer-title { color: #0ff; font-family: 'Orbitron', sans-serif; margin-left: 10px; }
-.footer-links { display: flex; justify-content: center; gap: 30px; margin-bottom: 20px; flex-wrap: wrap; }
-.footer-links a { color: #888; text-decoration: none; transition: color 0.3s; letter-spacing: 1px; }
-.footer-links a:hover { color: #0ff; }
-.footer-bottom p { color: #555; margin: 5px 0; }
-.footer-bottom a { color: #0ff; text-decoration: none; }
-.footer-copy { font-size: 0.85rem; }
-
-/* Hide/Show */
-.hide-en { display: none; }
-body[data-lang="en"] .hide-en { display: inline; }
-body[data-lang="en"] .hide-de { display: none; }
-.hidden { display: none !important; }
-
-/* Responsive */
-@media (max-width: 768px) {
- .nav-menu { display: none; }
- .nav-menu.open { display: flex; position: absolute; top: 70px; left: 0; right: 0; background: rgba(10,10,26,0.98); flex-direction: column; padding: 20px; gap: 15px; border-bottom: 1px solid rgba(0,255,255,0.2); }
- .nav-toggle { display: block; background: none; border: none; cursor: pointer; display: flex; flex-direction: column; gap: 5px; }
- .nav-toggle span { display: block; width: 25px; height: 2px; background: #0ff; }
- .neo-title { font-size: 2rem; }
- .neo-stats { gap: 15px; flex-wrap: wrap; }
- .neo-stat { flex: 1; min-width: 120px; }
- .stat-number { font-size: 1.5rem; }
- .section-title { font-size: 1.5rem; }
-}
-@media (min-width: 769px) {
- .nav-toggle { display: none; }
-}
\ No newline at end of file
diff --git a/variations/wikipedia/index.html b/variations/wikipedia/index.html
deleted file mode 100644
index 8f904ba..0000000
--- a/variations/wikipedia/index.html
+++ /dev/null
@@ -1,467 +0,0 @@
-
-
-
-
-
- Paraguay SRL LLC — Community
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
×
-
-
-
-
💬
-
Telegram Username eingeben
-
Enter Telegram Username
-
- Geben Sie Ihren Telegram-Nutzernamen ein, um einen Login-Link per Nachricht zu erhalten.
- Enter your Telegram username to receive a login link via message.
-
-
-
-
-
- Login-Link senden
- Send Login Link
-
-
-
-
-
🔐
-
Verifizierungscode
-
Verification Code
-
- Der Code wurde an Ihren Telegram-Account gesendet.
- The code has been sent to your Telegram account.
-
-
-
-
-
- Verifizieren
- Verify
-
-
-
-
-
🎉
-
Registrierung abschließen
-
Complete Registration
-
-
-
-
-
-
-
- Registrieren
- Register
-
-
-
-
-
-
-
-
-
-
×
-
Dein Profil
-
Your Profile
-
-
-
-
-
-
-
-
-
-
×
-
-
- ?
-
-
-
-
-
- E-Mail
- Email
-
- -
-
-
-
- Homepage
- Homepage
-
- -
-
-
-
- Standort
- Location
-
- -
-
-
-
- Beschreibung
- Description
-
- -
-
-
-
-
-
-
-
-
-
-
-
- Paraguay LLC & SRL Community
- Paraguay LLC & SRL Community
-
-
- Der Erfahrungsaustausch für deutsche und amerikanische Expats in Paraguay
- The experience exchange for German and American expats in Paraguay
-
-
-
- --
- Mitglieder
- Members
-
-
- --
- Beiträge
- Posts
-
-
- --
- Wiki-Artikel
- Wiki Articles
-
-
-
-
-
-
-
-
-
-
📱
-
-
- Noch nicht angemeldet?
- Not logged in yet?
-
- Tritt unserer Telegram-Gruppe bei und erhalte einen Login-Link!
- Join our Telegram group and receive a login link!
-
-
-
- Telegram beitreten
- Join Telegram
-
-
-
-
-
-
-
-
-
-
-
- Über die Community
- About the Community
-
-
-
-
🏦
-
- Banken & Zahlungsverkehr
- Banking & Payments
-
-
- Erfahrungen mit paraguayischen und internationalen Banken, Konten, Überweisungen und Kreditkarten.
- Experiences with Paraguayan and international banks, accounts, transfers and credit cards.
-
-
-
-
⚖️
-
- Rechtliches
- Legal Matters
-
-
- Gesellschaftsrecht, Verträge, Steuern, Compliance und Rechtsprechung in Paraguay.
- Corporate law, contracts, taxes, compliance and jurisprudence in Paraguay.
-
-
-
-
📊
-
- Steuern & Buchhaltung
- Taxes & Accounting
-
-
- Steuerberatung, Buchhaltungssysteme, Jahresabschlüsse und internationale Steuerplanung.
- Tax advice, accounting systems, annual statements and international tax planning.
-
-
-
-
💻
-
- ERP-Systeme
- ERP Systems
-
-
- Erfahrungen mit verschiedenen ERP-Systemen, Software-Lösungen und digitalem Management.
- Experiences with various ERP systems, software solutions and digital management.
-
-
-
-
-
-
-
-
-
-
- Mitglieder
- Members
-
-
-
-
- Lade Mitglieder...
- Loading members...
-
-
-
-
-
-
-
-
-
- Wiki
- Wiki
-
-
-
-
- Lade Wiki...
- Loading wiki...
-
-
-
-
-
-
-
-
-
-
✉️
-
- Newsletter
- Newsletter
-
-
- Erhalten Sie Updates und wichtige Informationen direkt in Ihr Postfach.
- Receive updates and important information directly in your inbox.
-
-
-
-
- Danke! Bitte prüfen Sie Ihre E-Mails.
- Thank you! Please check your emails.
-
-
-
-
-
-
-
-
-
-
-
-
-
-
diff --git a/variations/wikipedia/main.js b/variations/wikipedia/main.js
deleted file mode 100644
index 667dad7..0000000
--- a/variations/wikipedia/main.js
+++ /dev/null
@@ -1,637 +0,0 @@
-// ========================================
-// Paraguay LLC & SRL — Main JS
-// ========================================
-
-const API_URL = 'https://n8n.odoo4projects.com/webhook/paraguay/login';
-const NEWSLETTER_URL = 'https://n8n.odoo4projects.com/webhook/paraguay/newsletter';
-const USER_URL = 'https://n8n.odoo4projects.com/webhook/paraguay/user';
-const PROFILE_URL = 'https://n8n.odoo4projects.com/webhook/paraguay/profile';
-const WIKI_URL = 'https://n8n.odoo4projects.com/webhook/paraguay/wiki';
-const COMMUNITY_URL = 'https://n8n.odoo4projects.com/webhook/paraguay/community';
-
-let currentLang = 'de';
-
-document.addEventListener('DOMContentLoaded', () => {
- currentLang = document.body.dataset.lang || 'de';
- checkSession();
- loadCommunityStats();
-
- // Smooth scroll nav links
- document.querySelectorAll('.nav-link').forEach(link => {
- link.addEventListener('click', (e) => {
- e.preventDefault();
- const target = document.querySelector(link.getAttribute('href'));
- if (target) {
- target.scrollIntoView({ behavior: 'smooth' });
- }
- // Close mobile nav
- document.getElementById('nav-menu').classList.remove('open');
- });
- });
-
- // Mobile nav toggle
- const navToggle = document.getElementById('nav-toggle');
- const navMenu = document.getElementById('nav-menu');
- if (navToggle) {
- navToggle.addEventListener('click', () => {
- navMenu.classList.toggle('open');
- });
- }
-
- // Navbar scroll effect
- window.addEventListener('scroll', () => {
- const nav = document.getElementById('main-nav');
- if (nav) {
- nav.classList.toggle('scrolled', window.scrollY > 20);
- }
- });
-
- // Language toggle
- document.querySelectorAll('.lang-btn').forEach(btn => {
- btn.addEventListener('click', () => {
- const lang = btn.dataset.lang;
- setLanguage(lang);
- // Reload content in new language
- if (isLoggedIn) {
- if (document.querySelector('.notebook') || document.getElementById('members-list')) loadUsers();
- if (document.getElementById('wiki-grid')) loadWiki();
- }
- });
- });
-
- // Member search
- const memberSearch = document.getElementById('member-search');
- if (memberSearch) {
- memberSearch.addEventListener('input', (e) => {
- filterMembers(e.target.value);
- });
- }
-
- // Wiki search
- const wikiSearch = document.getElementById('wiki-search');
- if (wikiSearch) {
- wikiSearch.addEventListener('input', (e) => {
- searchWiki(e.target.value);
- });
- }
-
- // Close modals on overlay click
- document.querySelectorAll('.modal-overlay').forEach(overlay => {
- overlay.addEventListener('click', (e) => {
- if (e.target === overlay) {
- overlay.classList.remove('active');
- }
- });
- });
-
- // Close modals on Escape
- document.addEventListener('keydown', (e) => {
- if (e.key === 'Escape') {
- document.querySelectorAll('.modal-overlay.active').forEach(m => m.classList.remove('active'));
- }
- });
-
- // Login button
- const loginBtn = document.getElementById('login-btn');
- if (loginBtn) {
- loginBtn.addEventListener('click', () => {
- openLoginModal();
- });
- }
-});
-
-// ========================================
-// LANGUAGE
-// ========================================
-function setLanguage(lang) {
- currentLang = lang;
- document.body.dataset.lang = lang;
- document.querySelectorAll('.lang-btn').forEach(b => {
- b.classList.toggle('active', b.dataset.lang === lang);
- });
-}
-
-function isDE() {
- return currentLang !== 'en';
-}
-
-// ========================================
-// COMMUNITY STATS
-// ========================================
-async function loadCommunityStats() {
- try {
- const response = await fetch(COMMUNITY_URL);
- if (!response.ok) throw new Error('Failed to fetch');
- const data = await response.json();
-
- if (data.users !== undefined) {
- animateCounter('stat-members', data.users);
- }
- if (data.topics !== undefined) {
- document.getElementById('stat-wiki').textContent = data.topics;
- }
- } catch (error) {
- console.error('Failed to load community stats:', error);
- }
-}
-
-function animateCounter(elementId, targetNumber) {
- const element = document.getElementById(elementId);
- if (!element) return;
-
- let current = 0;
- const duration = 1500; // ms
- const steps = 40;
- const increment = targetNumber / steps;
- const stepTime = duration / steps;
-
- const timer = setInterval(() => {
- current += increment;
- if (current >= targetNumber) {
- element.textContent = targetNumber;
- clearInterval(timer);
- } else {
- element.textContent = Math.floor(current);
- }
- }, stepTime);
-}
-
-// ========================================
-// AUTH / SESSION
-// ========================================
-let isLoggedIn = false;
-
-function isSessionValid() {
- const sid = getCookie('sessionid');
- return sid.length > 0;
-}
-
-function checkSession() {
- isLoggedIn = isSessionValid();
-
- if (isLoggedIn) {
- document.body.dataset.loggedIn = 'true';
- document.getElementById('login-btn').style.display = 'none';
- document.getElementById('logout-btn').style.display = 'inline-flex';
- document.getElementById('profile-btn').style.display = 'inline-flex';
- document.getElementById('telegram-banner').style.display = 'none';
- document.getElementById('main-content').style.display = 'block';
- document.getElementById('newsletter-section').style.display = 'block';
- loadUsers();
- loadWiki();
- } else {
- document.body.dataset.loggedIn = 'false';
- document.getElementById('login-btn').style.display = 'inline-flex';
- document.getElementById('logout-btn').style.display = 'none';
- document.getElementById('profile-btn').style.display = 'none';
- document.getElementById('telegram-banner').style.display = 'block';
- document.getElementById('main-content').style.display = 'none';
- document.getElementById('newsletter-section').style.display = 'none';
- }
-}
-
-// ========================================
-// LOGIN MODAL
-// ========================================
-function openLoginModal() {
- document.getElementById('login-modal-overlay').classList.add('active');
- // Reset to step 1
- document.querySelectorAll('.login-step').forEach(s => s.classList.remove('active'));
- document.getElementById('login-step-1').classList.add('active');
- document.getElementById('telegram-user').value = '';
- document.getElementById('verification-code').value = '';
-}
-
-function closeLoginModal() {
- document.getElementById('login-modal-overlay').classList.remove('active');
-}
-
-// ========================================
-// PROFILE MODAL
-// ========================================
-function openProfileModal() {
- const sid = getCookie('sessionid');
- if (!sid) { alert('Bitte anmelden.'); return; }
-
- fetch(PROFILE_URL + '?sessionid=' + encodeURIComponent(sid))
- .then(r => r.json())
- .then(user => {
- document.getElementById('profile-username-display').textContent = user.username || '';
- const rank = getRank(user.posts || 0);
- const badge = document.getElementById('profile-rank-badge');
- badge.innerHTML = `${rank.emoji} ${rank.title} `;
-
- document.getElementById('profile-company').value = user.company || '';
- document.getElementById('profile-email').value = user.email || '';
- document.getElementById('profile-homepage').value = user.homepage || '';
- document.getElementById('profile-image').value = user.image || '';
- document.getElementById('profile-location').value = user.location || '';
- document.getElementById('profile-description').value = user.Description || '';
- document.getElementById('profile-publish').checked = true;
-
- document.getElementById('profile-modal-overlay').classList.add('active');
- })
- .catch(() => alert('Fehler beim Laden des Profils.'));
-}
-
-function closeProfileModal() {
- document.getElementById('profile-modal-overlay').classList.remove('active');
-}
-
-function saveProfile() {
- const sid = getCookie('sessionid');
- fetch(PROFILE_URL, {
- method: 'POST',
- headers: { 'Content-Type': 'application/json' },
- body: JSON.stringify({
- username: document.getElementById('profile-username-display').textContent,
- company: document.getElementById('profile-company').value.trim(),
- email: document.getElementById('profile-email').value,
- homepage: document.getElementById('profile-homepage').value,
- image: document.getElementById('profile-image').value,
- location: document.getElementById('profile-location').value,
- Description: document.getElementById('profile-description').value,
- sessionid: sid,
- publish: document.getElementById('profile-publish').checked
- })
- })
- .then(r => r.ok ? alert('Profil gespeichert!') : alert('Fehler beim Speichern.'))
- .catch(() => alert('Fehler bei der Verbindung.'));
-}
-
-// ========================================
-// USER DETAIL MODAL
-// ========================================
-function openUserDetailModal(user) {
- const avatar = document.getElementById('user-detail-avatar');
- if (user.image) {
- avatar.innerHTML = ` `;
- } else {
- avatar.innerHTML = `${(user.username || '?').charAt(0).toUpperCase()} `;
- }
-
- document.getElementById('user-detail-initial').textContent = '';
- document.getElementById('user-detail-username').textContent = '@' + (user.username || 'Unknown');
-
- const rank = getRank(user.posts || 0);
- document.getElementById('user-detail-rank-badge').className = `rank-badge rank-${rank.level}`;
- document.getElementById('user-detail-rank-badge').textContent = rank.emoji + ' ' + rank.title;
-
- document.getElementById('user-detail-company').textContent = user.company || '';
-
- const emailEl = document.getElementById('user-detail-email');
- emailEl.innerHTML = user.email ? `${user.email} ` : '-';
-
- const hpEl = document.getElementById('user-detail-homepage');
- const hp = user.homepage || '';
- hpEl.innerHTML = hp ? `${hp} ` : '-';
-
- document.getElementById('user-detail-location').textContent = user.location || '-';
- document.getElementById('user-detail-description').innerHTML = (user.Description || '-').replace(/\n/g, ' ');
-
- document.getElementById('user-detail-modal-overlay').classList.add('active');
-}
-
-function closeUserDetailModal() {
- document.getElementById('user-detail-modal-overlay').classList.remove('active');
-}
-
-// ========================================
-// LOGIN FLOW
-// ========================================
-function sendTelegramUser() {
- const user = document.getElementById('telegram-user').value.trim();
- if (!user) { alert('Bitte geben Sie einen Telegram-Nutzernamen ein.'); return; }
-
- const btn = event.target;
- btn.disabled = true;
- btn.textContent = isDE() ? 'Sende...' : 'Sending...';
-
- fetch(API_URL, {
- method: 'POST',
- headers: { 'Content-Type': 'application/json' },
- body: JSON.stringify({ username: user })
- })
- .then(r => r.json())
- .then(data => {
- if (data.sessionid) {
- setCookie('sessionid', data.sessionid, 1);
- document.getElementById('login-step-1').classList.remove('active');
- document.getElementById('login-step-3').classList.add('active');
- } else if (data.status === 'code send') {
- document.getElementById('login-step-1').classList.remove('active');
- document.getElementById('login-step-2').classList.add('active');
- } else {
- alert(isDE() ? 'Benutzername nicht gefunden. Bitte über Telegram Bot anmelden.' : 'Username not found. Please sign up via Telegram bot.');
- }
- })
- .catch(() => {
- btn.disabled = false;
- alert(isDE() ? 'Verbindungsfehler' : 'Connection error');
- });
-}
-
-function verifyCode() {
- const code = document.getElementById('verification-code').value.trim();
- if (!code) { alert('Bitte geben Sie den Code ein.'); return; }
-
- fetch(API_URL, {
- method: 'POST',
- headers: { 'Content-Type': 'application/json' },
- body: JSON.stringify({
- username: document.getElementById('telegram-user').value,
- code: code,
- sessionid: getCookie('sessionid')
- })
- })
- .then(r => r.json())
- .then(data => {
- if (data.sessionid) {
- setCookie('sessionid', data.sessionid, 1);
- checkSession();
- closeLoginModal();
- } else {
- alert(isDE() ? 'Ungültiger Code' : 'Invalid code');
- }
- })
- .catch(() => alert(isDE() ? 'Verbindungsfehler' : 'Connection error'));
-}
-
-function submitLoginData() {
- const name = document.getElementById('full-name').value.trim();
- const llc = document.getElementById('llc-name').value.trim();
- if (!name || !llc) { alert(isDE() ? 'Bitte Name und LLC eintragen' : 'Please enter name and LLC'); return; }
-
- fetch(API_URL, {
- method: 'POST',
- headers: { 'Content-Type': 'application/json' },
- body: JSON.stringify({
- username: document.getElementById('telegram-user').value,
- name: name,
- llc: llc
- })
- })
- .then(r => r.json())
- .then(data => {
- if (data.sessionid) {
- setCookie('sessionid', data.sessionid, 1);
- checkSession();
- closeLoginModal();
- } else {
- alert(isDE() ? 'Registrierung fehlgeschlagen' : 'Registration failed');
- }
- })
- .catch(() => alert(isDE() ? 'Verbindungsfehler' : 'Connection error'));
-}
-
-function logout() {
- setCookie('sessionid', '', -1);
- checkSession();
-}
-
-// ========================================
-// NEWSLETTER
-// ========================================
-function subscribeNewsletter() {
- const email = document.getElementById('newsletter-email').value.trim();
- if (!email) { alert(isDE() ? 'Bitte E-Mail eingeben' : 'Please enter email'); return; }
-
- fetch(NEWSLETTER_URL, {
- method: 'POST',
- headers: { 'Content-Type': 'application/json' },
- body: JSON.stringify({ email: email })
- })
- .then(r => {
- if (r.ok) {
- document.getElementById('newsletter-form').classList.add('hidden');
- document.getElementById('newsletter-success').classList.remove('hidden');
- } else {
- alert(isDE() ? 'Fehler beim Abonnieren' : 'Error subscribing');
- }
- })
- .catch(() => alert(isDE() ? 'Verbindungsfehler' : 'Connection error'));
-}
-
-// ========================================
-// USERS / MEMBERS
-// ========================================
-async function loadUsers() {
- try {
- const response = await fetch(USER_URL);
- if (!response.ok) throw new Error('Failed to fetch');
- const data = await response.json();
- const container = document.getElementById('members-list');
-
- if (data.data && Array.isArray(data.data)) {
- container.innerHTML = '';
- container.style.display = 'grid';
-
- data.data.forEach(user => {
- const card = createMemberCard(user);
- container.appendChild(card);
- });
-
- // Update stats will be handled by loadCommunityStats
- } else {
- container.innerHTML = '' + (isDE() ? 'Keine Mitglieder gefunden' : 'No members found') + '
';
- }
- } catch (error) {
- const container = document.getElementById('members-list');
- container.innerHTML = '' + (isDE() ? 'Fehler beim Laden' : 'Error loading') + '
';
- }
-}
-
-function createMemberCard(user) {
- const card = document.createElement('div');
- card.className = 'member-card';
-
- const rank = getRank(user.posts || 0);
- const avatarContent = user.image
- ? ` `
- : (user.username || '?').charAt(0).toUpperCase();
-
- card.innerHTML = `
- ${avatarContent}
-
-
${user.username || 'N/A'}
-
${user.company || ''}
- ${user.location ? `
📍 ${user.location}
` : ''}
- ${user.posts ? `
${user.posts} ${isDE() ? 'Beiträge' : 'posts'}
` : ''}
-
${rank.emoji} ${rank.title}
-
- `;
-
- card.addEventListener('click', () => openUserDetailModal(user));
- return card;
-}
-
-function filterMembers(term) {
- const cards = document.querySelectorAll('.member-card');
- const t = term.toLowerCase();
- cards.forEach(card => {
- const text = card.textContent.toLowerCase();
- card.style.display = text.includes(t) ? 'flex' : 'none';
- });
-}
-
-// ========================================
-// RANKS
-// ========================================
-function getRank(posts) {
- if (posts >= 500) return { level: 'legend', title: isDE() ? 'Legende' : 'Legend', emoji: '👑' };
- if (posts >= 200) return { level: 'expert', title: isDE() ? 'Experte' : 'Expert', emoji: '🏆' };
- if (posts >= 100) return { level: 'veteran', title: isDE() ? 'Veteran' : 'Veteran', emoji: '💎' };
- if (posts >= 50) return { level: 'contributor', title: isDE() ? 'Mitwirkender' : 'Contributor', emoji: '⭐' };
- if (posts >= 30) return { level: 'member', title: isDE() ? 'Mitglied' : 'Member', emoji: '🌳' };
- if (posts >= 5) return { level: 'beginner', title: isDE() ? 'Einsteiger' : 'Beginner', emoji: '🌿' };
- return { level: 'rookie', title: isDE() ? 'Anfänger' : 'Rookie', emoji: '🌱' };
-}
-
-// ========================================
-// WIKI
-// ========================================
-let wikiData = [];
-
-async function loadWiki() {
- try {
- const response = await fetch(WIKI_URL);
- if (!response.ok) throw new Error('Failed to fetch');
- const result = await response.json();
-
- if (result.data && Array.isArray(result.data)) {
- wikiData = result.data;
- renderWikiCards(wikiData);
-
- // Wiki count will be loaded from community webhook
- } else {
- document.getElementById('wiki-grid').innerHTML = '' + (isDE() ? 'Keine Wiki-Daten' : 'No wiki data') + '
';
- }
- } catch (error) {
- document.getElementById('wiki-grid').innerHTML = '' + (isDE() ? 'Fehler beim Laden' : 'Error loading') + '
';
- }
-}
-
-function renderWikiCards(data) {
- const grid = document.getElementById('wiki-grid');
- grid.innerHTML = '';
-
- if (data.length === 0) {
- grid.innerHTML = '' + (isDE() ? 'Keine Ergebnisse gefunden' : 'No results found') + '
';
- return;
- }
-
- // Group by topic
- const topics = {};
- data.forEach(item => {
- const topicKey = (item.topic_en && currentLang === 'en') ? item.topic_en : (item.topic || 'Unknown');
- if (!topics[topicKey]) topics[topicKey] = [];
- topics[topicKey].push(item);
- });
-
- const colors = ['blue', 'teal', 'green', 'orange', 'purple', 'pink', 'yellow'];
-
- Object.entries(topics).forEach(([topicName, subtopics], idx) => {
- const card = document.createElement('div');
- card.className = 'wiki-card';
- card.dataset.color = colors[idx % colors.length];
-
- // Get excerpt from first subtopic
- const firstSub = subtopics[0];
- const excerpt = currentLang === 'en' && firstSub.wiki_en ? firstSub.wiki_en : (firstSub.wiki || '');
- const subtopicTitle = currentLang === 'en' && firstSub.subtopic_en ? firstSub.subtopic_en : (firstSub.subtopic || '');
-
- card.innerHTML = `
- ${escapeHtml(topicName)}
- ${escapeHtml(excerpt.substring(0, 150))}${excerpt.length > 150 ? '...' : ''}
-
- `;
-
- // Open modal on click
- card.addEventListener('click', () => openWikiModal(topicName, subtopics));
-
- grid.appendChild(card);
- });
-}
-
-function openWikiModal(topicName, subtopics) {
- // Create modal if not exists
- let modalOverlay = document.getElementById('wiki-modal-overlay');
- if (!modalOverlay) {
- modalOverlay = document.createElement('div');
- modalOverlay.id = 'wiki-modal-overlay';
- modalOverlay.className = 'modal-overlay';
- document.body.appendChild(modalOverlay);
- }
-
- let html = '× ';
- html += '
';
- html += `
${escapeHtml(topicName)} `;
-
- subtopics.forEach(sub => {
- const title = currentLang === 'en' && sub.subtopic_en ? sub.subtopic_en : (sub.subtopic || '');
- const content = currentLang === 'en' && sub.wiki_en ? sub.wiki_en : (sub.wiki || '');
- html += `
${escapeHtml(title)} `;
- html += `
${escapeHtml(content)}
`;
- });
-
- html += '
';
- modalOverlay.innerHTML = html;
- modalOverlay.classList.add('active');
-}
-
-function closeWikiModal() {
- const overlay = document.getElementById('wiki-modal-overlay');
- if (overlay) overlay.classList.remove('active');
-}
-
-function searchWiki(term) {
- if (!term.trim()) {
- renderWikiCards(wikiData);
- return;
- }
-
- const t = term.toLowerCase();
- const filtered = wikiData.filter(item => {
- const topic = ((item.topic_en && currentLang === 'en') ? item.topic_en : (item.topic || '')) +
- ' ' + ((item.subtopic_en && currentLang === 'en') ? item.subtopic_en : (item.subtopic || '')) +
- ' ' + ((item.wiki_en && currentLang === 'en') ? item.wiki_en : (item.wiki || ''));
- return topic.toLowerCase().includes(t);
- });
-
- renderWikiCards(filtered);
-}
-
-// ========================================
-// COOKIES
-// ========================================
-function getCookie(name) {
- const localVal = localStorage.getItem('paraguay_' + name);
- if (localVal) return localVal;
-
- const value = `; ${document.cookie}`;
- const parts = value.split(`; ${name}=`);
- if (parts.length === 2) {
- return parts.pop().split(';').shift().replace(/^"|"$/g, '');
- }
- return '';
-}
-
-function setCookie(name, value, days) {
- const expires = new Date();
- expires.setTime(expires.getTime() + days * 24 * 60 * 60 * 1000);
- document.cookie = name + '=' + encodeURIComponent(value) + ';expires=' + expires.toUTCString() + ';path=/';
- localStorage.setItem('paraguay_' + name, value);
-}
-
-// ========================================
-// UTILS
-// ========================================
-function escapeHtml(text) {
- if (!text) return '';
- const div = document.createElement('div');
- div.textContent = text;
- return div.innerHTML;
-}
diff --git a/variations/wikipedia/style.css b/variations/wikipedia/style.css
deleted file mode 100644
index 0ffb0c9..0000000
--- a/variations/wikipedia/style.css
+++ /dev/null
@@ -1,396 +0,0 @@
-/* Wikipedia Style — Clean, Content-First */
-*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
-body {
- font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
- background: #f8f9fa;
- color: #202122;
- line-height: 1.6;
- font-size: 14px;
-}
-
-/* Navigation */
-.nav {
- background: #fff;
- border-bottom: 1px solid #a2a9b1;
- padding: 10px 20px;
- position: sticky;
- top: 0;
- z-index: 1000;
-}
-.nav-container {
- max-width: 1200px;
- margin: 0 auto;
- display: flex;
- align-items: center;
- justify-content: space-between;
-}
-.nav-brand {
- display: flex;
- align-items: center;
- gap: 10px;
- text-decoration: none;
- color: #202122;
- font-size: 1.1rem;
- font-weight: 600;
-}
-.nav-logo { font-size: 1.8rem; }
-.nav-menu { display: flex; gap: 20px; align-items: center; }
-.nav-link {
- color: #0645ad;
- text-decoration: none;
- font-size: 14px;
- padding: 5px 10px;
-}
-.nav-link:hover { text-decoration: underline; }
-.nav-actions { display: flex; gap: 10px; align-items: center; }
-.lang-select { display: flex; gap: 5px; }
-.lang-btn {
- background: #f8f9fa;
- border: 1px solid #a2a9b1;
- padding: 4px 12px;
- font-size: 12px;
- cursor: pointer;
- border-radius: 3px;
-}
-.lang-btn.active { background: #36c; color: #fff; border-color: #36c; }
-
-/* Buttons */
-.btn {
- padding: 6px 16px;
- font-size: 13px;
- border-radius: 3px;
- cursor: pointer;
- text-decoration: none;
- display: inline-block;
- font-weight: 500;
- border: 1px solid;
-}
-.btn-primary { background: #36c; color: #fff; border-color: #36c; }
-.btn-primary:hover { background: #2a4b8d; }
-.btn-outline {
- background: #f8f9fa;
- color: #202122;
- border-color: #a2a9b1;
-}
-.btn-outline:hover { background: #eaecf0; }
-.btn-block { display: block; width: 100%; text-align: center; }
-.btn-telegram {
- background: #0088cc;
- color: #fff;
- border-color: #0088cc;
-}
-
-/* Hero */
-.hero {
- background: #fff;
- border-bottom: 1px solid #a2a9b1;
- padding: 40px 20px;
- text-align: center;
-}
-.hero-title {
- font-size: 2rem;
- font-weight: 400;
- margin-bottom: 10px;
- color: #202122;
-}
-.hero-subtitle {
- color: #72777d;
- margin-bottom: 30px;
- font-size: 15px;
-}
-.hero-stats { display: flex; justify-content: center; gap: 40px; }
-.stat { text-align: center; }
-.stat-number {
- display: block;
- font-size: 1.8rem;
- font-weight: 600;
- color: #36c;
-}
-
-/* Sections */
-.section {
- background: #fff;
- border: 1px solid #a2a9b1;
- border-radius: 4px;
- padding: 25px;
- margin: 20px auto;
- max-width: 1200px;
-}
-.section-alt { background: #f8f9fa; border: none; }
-.section-title {
- font-size: 1.5rem;
- font-weight: 400;
- border-bottom: 1px solid #a2a9b1;
- padding-bottom: 10px;
- margin-bottom: 20px;
- color: #202122;
-}
-.container { max-width: 100%; }
-
-/* About */
-.about-grid {
- display: grid;
- grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
- gap: 20px;
-}
-.about-card {
- padding: 15px;
- border: 1px solid #eaecf0;
- border-radius: 4px;
- background: #fff;
-}
-.about-icon { font-size: 2rem; margin-bottom: 10px; }
-.about-card h3 {
- font-size: 1rem;
- margin-bottom: 8px;
- color: #0645ad;
-}
-.about-card p { font-size: 13px; color: #555; }
-
-/* Search */
-.search-bar {
- display: flex;
- max-width: 400px;
- margin-bottom: 20px;
-}
-.search-icon {
- position: absolute;
- left: 10px;
- width: 16px;
- height: 16px;
- color: #72777d;
-}
-.search-input {
- width: 100%;
- padding: 8px 10px;
- border: 1px solid #a2a9b1;
- border-radius: 2px;
- font-size: 14px;
-}
-.search-input:focus { border-color: #36c; outline: none; }
-
-/* Members Grid */
-.members-grid {
- display: grid;
- grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
- gap: 10px;
-}
-.member-card {
- display: flex;
- align-items: center;
- gap: 10px;
- padding: 10px;
- border: 1px solid #eaecf0;
- border-radius: 3px;
- cursor: pointer;
- background: #fff;
- transition: background 0.2s;
-}
-.member-card:hover { background: #eaecf0; }
-.user-avatar {
- width: 40px;
- height: 40px;
- border-radius: 50%;
- object-fit: cover;
- border: 1px solid #eaecf0;
-}
-.user-avatar-text {
- width: 40px;
- height: 40px;
- border-radius: 50%;
- background: #eaecf0;
- color: #72777d;
- display: flex;
- align-items: center;
- justify-content: center;
- font-size: 1.2rem;
-}
-.member-info h4 { font-size: 14px; color: #0645ad; }
-.member-company { font-size: 12px; color: #72777d; }
-.member-location, .member-posts { font-size: 12px; color: #555; }
-.rank-badge {
- font-size: 11px;
- padding: 2px 8px;
- border-radius: 10px;
- position: absolute;
- top: -5px;
- right: 0;
-}
-.rank-badge.rank-rookie { background: #eee; color: #666; }
-.rank-badge.rank-beginner { background: #e6f3e6; color: #0a0; }
-.rank-badge.rank-member { background: #e6f0ff; color: #0066cc; }
-.rank-badge.rank-contributor { background: #e6f9f9; color: #009999; }
-.rank-badge.rank-veteran { background: #f9e6ff; color: #990099; }
-.rank-badge.rank-expert { background: #fff3e6; color: #cc8800; }
-.rank-badge.rank-legend { background: #ffe6e6; color: #cc0000; }
-
-/* Wiki Cards */
-.wiki-grid {
- display: grid;
- grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
- gap: 10px;
-}
-.wiki-card {
- padding: 15px;
- border: 1px solid #eaecf0;
- border-left: 4px solid #36c;
- background: #fff;
- cursor: pointer;
- transition: background 0.2s;
- border-radius: 0 3px 3px 0;
-}
-.wiki-card:hover { background: #eaecf0; }
-.wiki-card-title { font-size: 15px; color: #0645ad; margin-bottom: 5px; }
-.wiki-card-excerpt { font-size: 13px; color: #72777d; margin-bottom: 8px; }
-.wiki-card-footer { display: flex; justify-content: space-between; font-size: 12px; color: #555; }
-.wiki-card-subtopic { color: #0645ad; }
-.no-results { padding: 20px; text-align: center; color: #72777d; }
-.loading-text { padding: 20px; text-align: center; color: #72777d; font-style: italic; }
-
-/* Modal */
-.modal-overlay {
- position: fixed;
- top: 0;
- left: 0;
- right: 0;
- bottom: 0;
- background: rgba(255,255,255,0.95);
- z-index: 2000;
- display: none;
- align-items: center;
- justify-content: center;
-}
-.modal-overlay.active { display: flex; }
-.modal {
- background: #fff;
- border: 1px solid #a2a9b1;
- border-radius: 4px;
- padding: 25px;
- max-width: 500px;
- width: 90%;
- box-shadow: 0 2px 10px rgba(0,0,0,0.1);
- position: relative;
-}
-.modal-close {
- position: absolute;
- top: 10px;
- right: 15px;
- background: none;
- border: none;
- font-size: 20px;
- cursor: pointer;
- color: #72777d;
-}
-.login-icon { font-size: 3rem; text-align: center; margin-bottom: 15px; }
-.login-hint { color: #72777d; text-align: center; margin-bottom: 15px; font-size: 13px; }
-.form-group { margin-bottom: 12px; }
-.form-input {
- width: 100%;
- padding: 8px;
- border: 1px solid #a2a9b1;
- border-radius: 2px;
- font-size: 14px;
- box-sizing: border-box;
-}
-.form-input:focus { border-color: #36c; outline: none; }
-.login-step { display: none; }
-.login-step.active { display: block; }
-
-/* Profile & Detail Modals */
-.profile-username { font-size: 1.2rem; margin-bottom: 10px; }
-.profile-rank { margin-bottom: 15px; }
-.user-detail-modal { max-width: 600px; }
-.user-detail-content { padding: 15px; }
-.user-detail-avatar {
- width: 60px;
- height: 60px;
- border-radius: 50%;
- margin: 0 auto 15px;
- border: 1px solid #a2a9b1;
- overflow: hidden;
-}
-.user-detail-header { text-align: center; margin-bottom: 15px; }
-.user-detail-name-rank { display: flex; align-items: center; justify-content: center; gap: 10px; margin-bottom: 10px; }
-.user-detail-name-rank h2 { font-size: 1.2rem; }
-.user-detail-fields { display: grid; gap: 8px; }
-.detail-field { display: flex; justify-content: space-between; padding: 8px 0; border-bottom: 1px solid #eaecf0; }
-.detail-label { color: #72777d; font-size: 13px; }
-.detail-value { color: #202122; font-size: 13px; text-align: right; }
-.user-detail-company { color: #555; text-align: center; }
-
-/* Telegram Banner */
-.telegram-banner {
- background: #f0f8ff;
- border: 1px solid #a2a9b1;
- padding: 15px 20px;
- margin: 20px auto;
- max-width: 1200px;
- border-radius: 4px;
- display: flex;
- align-items: center;
- gap: 15px;
-}
-.banner-icon { font-size: 1.5rem; }
-.banner-text strong { color: #202122; }
-
-/* Newsletter */
-.newsletter-card { text-align: center; max-width: 400px; margin: 0 auto; }
-.newsletter-icon { font-size: 2.5rem; margin-bottom: 15px; }
-.newsletter-hint { color: #72777d; margin-bottom: 15px; font-size: 13px; }
-
-/* Footer */
-.footer {
- background: #f8f9fa;
- border-top: 1px solid #a2a9b1;
- padding: 25px 20px;
- text-align: center;
- margin-top: 40px;
-}
-.footer-brand { margin-bottom: 15px; }
-.footer-logo { font-size: 1.5rem; }
-.footer-title { color: #202122; margin-left: 10px; font-size: 1rem; }
-.footer-links { display: flex; justify-content: center; gap: 20px; margin-bottom: 15px; flex-wrap: wrap; }
-.footer-links a { color: #0645ad; text-decoration: none; font-size: 13px; }
-.footer-links a:hover { text-decoration: underline; }
-.footer-bottom p { color: #72777d; margin: 5px 0; font-size: 12px; }
-.footer-bottom a { color: #0645ad; }
-.footer-copy { font-size: 12px; }
-
-/* Hide/Show */
-.hide-en { display: none; }
-body[data-lang="en"] .hide-en { display: inline; }
-body[data-lang="en"] .hide-de { display: none; }
-.hidden { display: none !important; }
-
-/* Responsive */
-@media (max-width: 768px) {
- .nav-menu { display: none; }
- .nav-menu.open {
- display: flex;
- position: absolute;
- top: 100%;
- left: 0;
- right: 0;
- background: #fff;
- flex-direction: column;
- padding: 15px;
- gap: 10px;
- border-bottom: 1px solid #a2a9b1;
- }
- .nav-toggle {
- display: flex;
- flex-direction: column;
- gap: 4px;
- background: none;
- border: none;
- cursor: pointer;
- }
- .nav-toggle span { display: block; width: 20px; height: 2px; background: #202122; }
- .hero-stats { gap: 20px; flex-wrap: wrap; }
- .stat-number { font-size: 1.5rem; }
- .about-grid { grid-template-columns: 1fr; }
- .wiki-grid { grid-template-columns: 1fr; }
-}
-@media (min-width: 769px) {
- .nav-toggle { display: none; }
-}
\ No newline at end of file