מדיה ויקי:Common.css: הבדלים בין גרסאות בדף
מראה
Omergamliel (שיחה | תרומות) אין תקציר עריכה |
Omergamliel (שיחה | תרומות) אין תקציר עריכה |
||
| שורה 7: | שורה 7: | ||
} | } | ||
/* באנר | /* 🎨 באנר עליון לעמוד הראשי - עיצוב מודרני עם אפקט זכוכית */ | ||
.main-page-banner { | .main-page-banner { | ||
background-image: url('https://i.imagesup.co/images2/590771adcf5588bca7bb1c17b7ebc4238461dcec.png'); | background-image: url('https://i.imagesup.co/images2/590771adcf5588bca7bb1c17b7ebc4238461dcec.png'); | ||
| שורה 15: | שורה 15: | ||
color: white; | color: white; | ||
text-align: center; | text-align: center; | ||
border-radius: | border-radius: 18px; | ||
margin-bottom: 30px; | margin-bottom: 30px; | ||
font-family: "Segoe UI", "Rubik", sans-serif; | |||
font-family: "Segoe UI", sans-serif; | position: relative; | ||
box-shadow: 0 | overflow: hidden; | ||
animation: fadeInUp 1s ease-out; | |||
box-shadow: 0 6px 20px rgba(0,0,0,0.25); | |||
} | } | ||
/* שכבת זכוכית רכה על הבאנר */ | |||
.main-page-banner::before { | |||
content: ""; | |||
position: absolute; | |||
top: 0; right: 0; bottom: 0; left: 0; | |||
background: rgba(255, 255, 255, 0.15); | |||
backdrop-filter: blur(10px); | |||
-webkit-backdrop-filter: blur(10px); | |||
z-index: 1; | |||
border-radius: 18px; | |||
} | |||
/* תוכן הבאנר מעל הזכוכית */ | |||
.main-page-banner > * { | |||
position: relative; | |||
z-index: 2; | |||
} | |||
/* כותרת ראשית */ | |||
.main-page-banner h1 { | |||
font-size: 2.8em; | |||
font-weight: bold; | |||
margin: 0 0 10px; | |||
text-shadow: 1px 1px 4px rgba(0,0,0,0.5); | |||
} | |||
/* טקסט משני */ | |||
.main-page-banner p { | |||
font-size: 1.2em; | |||
margin: 0 0 20px; | |||
color: #f0f0f0; | |||
} | |||
/* כפתור התחלה */ | |||
.main-page-banner .start-button { | |||
display: inline-block; | |||
background: rgba(255,255,255,0.95); | |||
color: #333; | |||
font-weight: bold; | |||
padding: 10px 20px; | |||
border-radius: 10px; | |||
text-decoration: none; | |||
font-size: 1em; | |||
box-shadow: 0 2px 6px rgba(0,0,0,0.15); | |||
transition: all 0.25s ease; | |||
} | |||
.main-page-banner .start-button:hover { | |||
background: #ffe082; | |||
color: #000; | |||
} | |||
/* אנימציית כניסה */ | |||
@keyframes fadeInUp { | |||
from { opacity: 0; transform: translateY(30px); } | |||
to { opacity: 1; transform: translateY(0); } | |||
} | |||
/* רספונסיביות */ | |||
@media screen and (max-width: 600px) { | |||
.main-page-banner { | |||
padding: 50px 20px; | |||
} | |||
.main-page-banner h1 { | |||
font-size: 2em; | |||
} | |||
.main-page-banner p { | |||
font-size: 1em; | |||
} | |||
} | |||
גרסה מ־22:16, 28 ביוני 2025
/* ✅ פונט אחיד לכל הדף */
body, input, select, textarea, .mw-body, .mw-content-ltr, .mw-content-rtl,
h1, h2, h3, h4, h5, h6,
.vector-page-titlebar h1,
#content h1, #firstHeading {
font-family: 'Calibri', sans-serif !important;
}
/* 🎨 באנר עליון לעמוד הראשי - עיצוב מודרני עם אפקט זכוכית */
.main-page-banner {
background-image: url('https://i.imagesup.co/images2/590771adcf5588bca7bb1c17b7ebc4238461dcec.png');
background-size: cover;
background-position: center;
padding: 80px 30px;
color: white;
text-align: center;
border-radius: 18px;
margin-bottom: 30px;
font-family: "Segoe UI", "Rubik", sans-serif;
position: relative;
overflow: hidden;
animation: fadeInUp 1s ease-out;
box-shadow: 0 6px 20px rgba(0,0,0,0.25);
}
/* שכבת זכוכית רכה על הבאנר */
.main-page-banner::before {
content: "";
position: absolute;
top: 0; right: 0; bottom: 0; left: 0;
background: rgba(255, 255, 255, 0.15);
backdrop-filter: blur(10px);
-webkit-backdrop-filter: blur(10px);
z-index: 1;
border-radius: 18px;
}
/* תוכן הבאנר מעל הזכוכית */
.main-page-banner > * {
position: relative;
z-index: 2;
}
/* כותרת ראשית */
.main-page-banner h1 {
font-size: 2.8em;
font-weight: bold;
margin: 0 0 10px;
text-shadow: 1px 1px 4px rgba(0,0,0,0.5);
}
/* טקסט משני */
.main-page-banner p {
font-size: 1.2em;
margin: 0 0 20px;
color: #f0f0f0;
}
/* כפתור התחלה */
.main-page-banner .start-button {
display: inline-block;
background: rgba(255,255,255,0.95);
color: #333;
font-weight: bold;
padding: 10px 20px;
border-radius: 10px;
text-decoration: none;
font-size: 1em;
box-shadow: 0 2px 6px rgba(0,0,0,0.15);
transition: all 0.25s ease;
}
.main-page-banner .start-button:hover {
background: #ffe082;
color: #000;
}
/* אנימציית כניסה */
@keyframes fadeInUp {
from { opacity: 0; transform: translateY(30px); }
to { opacity: 1; transform: translateY(0); }
}
/* רספונסיביות */
@media screen and (max-width: 600px) {
.main-page-banner {
padding: 50px 20px;
}
.main-page-banner h1 {
font-size: 2em;
}
.main-page-banner p {
font-size: 1em;
}
}
/* ✅ רקע כללי יפה */
body {
background-image: url("https://i.imagesup.co/images2/590771adcf5588bca7bb1c17b7ebc4238461dcec.png");
background-size: cover;
background-position: center;
background-attachment: fixed;
background-repeat: no-repeat;
margin: 0;
padding: 0;
}
/* ✅ מסגרת תוכן לבנה עם הצללה */
#content, .mw-body {
background-color: rgba(255, 255, 255, 0.95) !important;
padding: 30px;
border-radius: 12px;
box-shadow: 0 0 25px rgba(0, 0, 0, 0.15);
}
/* ✅ תפריט צד עם אפקט זכוכית חלבית */
#mw-panel {
background-color: rgba(255, 255, 255, 0.6) !important;
border-radius: 8px;
padding: 10px;
box-shadow: 0 0 10px rgba(0,0,0,0.1);
backdrop-filter: blur(6px);
-webkit-backdrop-filter: blur(6px);
}
/* ✅ תפריט עליון שקוף / עם אפקט */
#mw-head, #mw-head-base {
background: linear-gradient(to bottom, rgba(255,255,255,0.8), rgba(255,255,255,0)) !important;
border: none !important;
box-shadow: none !important;
backdrop-filter: blur(4px);
-webkit-backdrop-filter: blur(4px);
}
/* ✅ כותרות בצבע כחול */
h1, h2, h3, h4, h5 {
color: #0466c8 !important;
}
/* ✅ קישורים בצבעים נעימים עם מעבר */
a, a:visited {
color: #004080 !important;
text-decoration: none;
transition: all 0.2s ease-in-out;
}
a:hover {
color: #0466c8 !important;
text-decoration: underline;
transform: scale(1.03);
}
/* ✅ קו מפריד אלגנטי */
hr {
border: none;
border-top: 1px solid #ccc;
margin: 2em 0;
}
/* ✅ יישור הלוגו למרכז והגדלתו */
.mw-logo-container {
justify-content: center;
}
.mw-logo-icon {
height: 80px;
width: auto;
}
.mw-logo-container .mw-logo-wordmark {
display: none !important;
}
/* עיצוב כולל לתיבת החיפוש */
#p-search form {
display: flex;
align-items: center;
background-color: #fff;
border: 1px solid #ccc;
border-radius: 999px;
overflow: hidden;
box-shadow: 0 0 5px rgba(0,0,0,0.1);
transition: box-shadow 0.3s ease-in-out;
}
/* אפקט בעת ריחוף או מיקוד */
#p-search form:hover,
#p-search form:focus-within {
box-shadow: 0 0 8px rgba(4, 102, 200, 0.3);
}
/* שדה הטקסט */
#searchInput {
flex: 1;
border: none;
padding: 8px 16px;
font-size: 16px;
border-radius: 0;
background: transparent;
outline: none;
font-family: 'Calibri', sans-serif;
}
/* כפתור החיפוש */
#searchButton {
background-color: transparent;
border: none;
padding: 8px 16px;
cursor: pointer;
font-weight: bold;
font-family: 'Calibri', sans-serif;
transition: background-color 0.2s ease-in-out;
}
/* כפתור חיפוש בעת ריחוף */
#searchButton:hover {
background-color: #f0f0f0;
}