"ഫലകം:Header4/styles.css" എന്ന താളിന്റെ പതിപ്പുകൾ തമ്മിലുള്ള വ്യത്യാസം

362 ബൈറ്റുകൾ നീക്കംചെയ്തിരിക്കുന്നു ,  30 സെപ്റ്റംബർ
തിരുത്തലിനു സംഗ്രഹമില്ല
No edit summary
No edit summary
വരി 1: വരി 1:
/* Container */
#mp-topbanner {
#mp-topbanner {
   width: 96%;
   width: 100%;
   background: linear-gradient(135deg, #f0f7ff, #ffffff); /* Light blue → white */
   background: linear-gradient(135deg, #fefefe, #eaf2ff);
  margin: 10px 0;
  padding: 20px 15px;
   border-radius: 12px;
   border-radius: 12px;
   text-align: center;
   box-shadow: 0 4px 12px rgba(0,0,0,0.1);
  padding: 15px;
  margin: 10px auto;
  box-sizing: border-box;
}
 
.banner-container {
   display: flex;
   display: flex;
  flex-direction: column;
   align-items: center;
   align-items: center;
   border: 3px solid #7BBCE5;  
   justify-content: center;
   box-shadow: 0 6px 12px rgba(0, 0, 0, 0.2);
   flex-wrap: wrap; /* Makes it responsive */
  gap: 20px;
}
}


/* Title */
.banner-image {
#mp-topbanner .banner-title {
   flex: 1 1 40%;
   font-size: 2rem;   /* ~32px desktop */
   display: flex;
   font-weight: bold;
   justify-content: center;
   color: #004EC3;
   align-items: center;
   margin: 10px 0 15px 0;
}
}


/* Single image centered */
.banner-text {
#mp-topbanner .banner-image {
   flex: 1 1 55%;
   margin: 15px 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
}
#mp-topbanner .banner-image img {
 
   max-width: 100% !important;
.banner-title {
   height: auto !important;
   font-size: 2em;
   display: block;
   font-weight: bold;
  margin: 0 auto;
   color: #004EC3;
   border-radius: 8px;
   text-align: left;
}
}


/* Description */
.banner-desc {
#mp-topbanner .banner-desc {
   font-size: 1.2em;
   font-size: 1.2rem; /* ~19px */
   line-height: 1.6;
   color: #333;
   text-align: left;
   margin: 10px 0;
  line-height: 1.6em;
}
}


/* Stats */
.banner-stats {
#mp-topbanner .banner-stats {
   font-size: 1em;
   font-size: 1rem;   /* ~16px */
   line-height: 1.6;
   color: #444;
   text-align: left;
  margin-top: 15px;
   line-height: 1.6em;
}
}


/* Responsive tweaks */
/* Responsive for mobile */
@media (max-width: 768px) {
@media (max-width: 768px) {
   #mp-topbanner .banner-title {
   .banner-container {
    font-size: 1.5rem; /* ~24px */
     flex-direction: column;
  }
     text-align: center;
  #mp-topbanner .banner-desc {
     font-size: 1rem;
  }
  #mp-topbanner .banner-stats {
     font-size: 0.9rem;
   }
   }
}
  .banner-title,
 
  .banner-desc,
@media (max-width: 480px) {
   .banner-stats {
   #mp-topbanner .banner-title {
     text-align: center;
     font-size: 1.2rem; /* ~20px */
   }
   }
   #mp-topbanner .banner-desc {
   .banner-image {
     font-size: 0.95rem;
     flex: 1 1 100%;
   }
   }
   #mp-topbanner .banner-stats {
   .banner-text {
     font-size: 0.85rem;
     flex: 1 1 100%;
   }
   }
}
}
"https://schoolwiki.in/പ്രത്യേകം:മൊബൈൽവ്യത്യാസം/2865988" എന്ന താളിൽനിന്ന് ശേഖരിച്ചത്