מדיה ויקי:Vector.css
הערה: לאחר הפרסום, ייתכן שיהיה צורך לנקות את זיכרון המטמון (cache) של הדפדפן כדי להבחין בשינויים.
- פיירפוקס / ספארי: להחזיק את המקש Shift בעת לחיצה על טעינה מחדש (Reload) או ללחוץ על צירוף המקשים Ctrl-F5 או Ctrl-R (במחשב מק: ⌘-R).
- גוגל כרום: ללחוץ על צירוף המקשים Ctrl-Shift-R (במחשב מק: ⌘-Shift-R).
- אדג': להחזיק את המקש Ctrl בעת לחיצה על רענן (Refresh) או ללחוץ על צירוף המקשים Ctrl-F5.
/* All CSS here will be loaded for users of the Vector skin */
body {
background-color: #f5e6cc; /* צבע רקע חום בהיר למסגרת */
}
/* עיצוב גוף האתר */
#content {
background-color: #9b4433; /* צבע גוף האתר החדש */
color: #d1bf5d; /* צבע הטקסט */
padding: 20px;
border-radius: 10px; /* פינות מעוגלות */
box-shadow: inset 0 0 20px #6d3327, 0 10px 15px rgba(0, 0, 0, 0.2); /* כהות מתגברת עד לכהות מסביב לטקסט */
transition: box-shadow 0.3s ease, transform 0.3s ease; /* מעבר חלק */
width: 100%; /* שמירה על רוחב מלא של התוכן */
max-width: 1200px; /* רוחב מקסימלי */
margin: 50px auto; /* מרכז את גוף האתר */
}
/* עיצוב הטקסט עצמו */
#content p {
background: linear-gradient(180deg, #9b4433 0%, #6d3327 100%);
padding: 15px;
border-radius: 5px;
}
/* אפקט ריחוף על גוף האתר בלבד */
#content:hover {
box-shadow: inset 0 0 25px #6d3327, 0 12px 22px rgba(0, 0, 0, 0.25); /* צל חזק יותר */
transform: translateY(-5px); /* הרמת גוף האתר בריחוף */
}
/* עיצוב כותרות בגוף האתר */
#content h1, #content h2, #content h3 {
text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.1); /* צל קטן שמוסיף עומק לכותרות */
color: #d1bf5d; /* צבע הכותרות */
}
/* עיצוב קישורים */
a {
color: white; /* שינוי צבע הקישורים ללבן */
}
a:visited {
color: white; /* שינוי צבע הקישורים שביקרת בהם ללבן */
}
a:hover {
color: #d1bf5d; /* שינוי צבע הקישור בעת ריחוף ל-#d1bf5d */
}
a:active {
color: white; /* שינוי צבע הקישור כשהוא נלחץ ללבן */
}