Khác biệt giữa các bản “Bản mẫu:Biến đổi khí hậu/styles.css”
 
(Không hiển thị 50 phiên bản của cùng người dùng ở giữa)
Dòng 1: Dòng 1:
 
#content { padding:0;margin:0;border:none;box-shadow:none }
 
#content { padding:0;margin:0;border:none;box-shadow:none }
 
.mw-indicators { padding: 48px 40px }
 
.mw-indicators { padding: 48px 40px }
#contentSub { background:#e1e1e6;padding-left:20px }
+
#sidebar-button, .mw-portlet li::before { background-color:#9e499e }
 +
.mw-portlet h3 { border-bottom-color:#9e499e }
 +
#contentSub { background:#f0f0f5;padding-left:20px }
 
.page-title {  
 
.page-title {  
 
   padding: 40px;
 
   padding: 40px;
Dòng 12: Dòng 14:
 
   background-position: left;
 
   background-position: left;
 
   font-weight: 300;
 
   font-weight: 300;
 +
}
 +
@media (min-width: 1581px) {
 +
  .page-title { padding: 40px calc(50% - 750px) }
 +
  .mw-indicators { padding: 48px calc(50% - 750px) 0 0 }
 
}
 
}
 
.page-title::before {
 
.page-title::before {
 
   content: '';
 
   content: '';
 
   position: absolute;
 
   position: absolute;
  top: 80px;
 
  left: 40px;
 
  height: 1px;
 
 
   width: calc(100% - 80px);
 
   width: calc(100% - 80px);
   background: white;   
+
   border-top: 1px solid;   
 +
  max-width:1500px;
 
}
 
}
 
.page-title::after {
 
.page-title::after {
Dòng 33: Dòng 37:
 
#mw-content-text { font-weight:300;text-align:justify }
 
#mw-content-text { font-weight:300;text-align:justify }
 
.toc {  
 
.toc {  
   background-image: linear-gradient(110deg,#ed4aed 10%,#ff5a28 60%,#ed4aed);
+
   background-image: linear-gradient(110deg,#9e499e 10%,#ed4aed 60%,#964cf0);
 
   background-clip: text;
 
   background-clip: text;
 
   -webkit-background-clip: text; /* chrome */
 
   -webkit-background-clip: text; /* chrome */
 
   color: transparent;
 
   color: transparent;
  font-weight:bold;
 
 
   border:none;
 
   border:none;
 
   box-shadow:none;
 
   box-shadow:none;
Dòng 44: Dòng 47:
 
   letter-spacing: 2px;
 
   letter-spacing: 2px;
 
   line-height:1.5;
 
   line-height:1.5;
 +
  font-weight:400;
 
}
 
}
 
.toc a { color:inherit !important }
 
.toc a { color:inherit !important }
Dòng 49: Dòng 53:
 
.toc li { display:inline }
 
.toc li { display:inline }
 
.toc .toclevel-3, .toctitle { display: none }
 
.toc .toclevel-3, .toctitle { display: none }
.top a, .sec a { border:1.5px solid; border-image:linear-gradient(0.25turn,#ff5a28 35%,#ffaa20 70%,#ff5a28) 1;border-bottom-width:1.5px;border-top-width:0;border-right-width:0;border-left-width:0;color:inherit !important;}
+
.top a, .mid a { border:2px solid; border-image:linear-gradient(0.25turn,#9e499e 35%,#ed4aed 70%,#964cf0) 1;border-bottom-width:2px;border-top-width:0;border-right-width:0;border-left-width:0;color:inherit !important}
.top sup a, .sec sup a, .top .toc a, a.mw-tmh-play, a.image, a.internal { border:none; }
+
.top sup a, .mid sup a, .top .toc a, a.mw-tmh-play, a.image, a.internal, a.oo-ui-buttonElement-button { border:none; }
.top a.new, .sec a.new { border:1px solid; border-image:linear-gradient(0.25turn,#964cf0 35%,#ed4aed 70%,#964cf0) 1;border-bottom-width:1px;border-top-width:0;border-right-width:0;border-left-width:0;color:inherit !important;}
+
.top a.new, .mid a.new { border-bottom-width:1px }
.top { font-size:large;background:#f0f0f5;padding:10px 40px 20px }
+
.top { font-size:large;padding:10px 40px 20px;max-width:1500px;margin-left:auto;margin-right:auto; }
h2 { max-width:1240px;margin-left:auto;margin-right:auto;padding:0 20px }
+
.top1 { background:#f0f0f5 }
@media (min-width: 851px) {
+
.top .mw-gallery-slideshow, .top .mw-gallery-slideshow .mw-gallery-slideshow-buttons, .top .oo-ui-layout.oo-ui-panelLayout p { margin:0;padding:0 }
   .sec {
+
h2 { max-width:1500px;margin-left:auto;margin-right:auto;padding:20px 40px 0;color:#9e499e;border:none }
     column-count: 3;
+
#contentSub a, h2 a { color:#ed4aed }
     padding: 20px;
+
@media (max-width: 600px) {
 +
  .mid, .top { padding:10px }
 +
}
 +
@media (min-width: 601px) {
 +
   .mid {
 +
     column-count: 2;
 +
     padding: 5px 40px 20px;
 
     column-gap: 40px;
 
     column-gap: 40px;
    column-rule: 1px solid #c8ccd1;
+
     max-width: 1500px;
     max-width: 1280px;
 
 
     margin-left:auto;
 
     margin-left:auto;
 
     margin-right:auto;
 
     margin-right:auto;
 
   }
 
   }
   .sec .thumb { break-inside:avoid }
+
   .mid .thumb { break-inside:avoid;margin:0 0 20px;padding:0 }
   .sec .thumbinner { width:calc(100% - 40px) !important;text-align:center }
+
   .mid .thumbinner { width:calc(100% - 40px) !important;text-align:center }
   .sec .thumbinner img { width:100%;height:auto;max-width:450px }
+
   .mid .thumbinner img { width:100%;height:auto;max-width:450px }
   .sec .tright, .sec .tleft { margin:10px 0;padding:0 }
+
   .mid p { margin: 0 0 20px }
 +
}
 +
@media (min-width: 1200px) {
 +
  .mid {
 +
    column-count: 3;
 +
  }
 +
}
 +
.mid2 { background:#f0f0f5;padding-bottom:20px }
 +
.mid2 h2 { text-align:right;padding-top:40px }
 +
.mw-body h2::after { border:none }
 +
h2::before { content:'';border-top:1px solid;display:block;margin-bottom:10px }
 +
.B {
 +
  font-weight:bold;
 +
  padding:0 10px 0 0;
 +
  line-height:1;
 +
  font-size:54px;
 +
  color:#9e499e;
 +
  float:left;
 
}
 
}
.sec2 { background:#f0f0f5; }
+
.color { color:#9e499e }
.sec2 h2 { text-align:right;padding-top:20px }
 

Bản hiện tại lúc 18:44, ngày 9 tháng 6 năm 2021

#content { padding:0;margin:0;border:none;box-shadow:none }
.mw-indicators { padding: 48px 40px }
#sidebar-button, .mw-portlet li::before { background-color:#9e499e }
.mw-portlet h3 { border-bottom-color:#9e499e }
#contentSub { background:#f0f0f5;padding-left:20px }
.page-title { 
  padding: 40px;
  border: none;
  background: url(https://upload.wikimedia.org/wikipedia/commons/thumb/1/1a/Endangered_arctic_-_starving_polar_bear.jpg/640px-Endangered_arctic_-_starving_polar_bear.jpg);
  background-size: cover;
  height: 250px; 
  color: white;
  font-size: 32px;
  background-position: left;
  font-weight: 300;
}
@media (min-width: 1581px) {
  .page-title { padding: 40px calc(50% - 750px) }
  .mw-indicators { padding: 48px calc(50% - 750px) 0 0 }
}
.page-title::before {
  content: '';
  position: absolute;
  width: calc(100% - 80px);
  border-top: 1px solid;  
  max-width:1500px;
}
.page-title::after {
  content: '';
  position: absolute;
  top: 173px;
  height: 200px;
  left: 0;
  width: 100%;
  background: linear-gradient(0,rgba(240,240,245,1),rgba(240,240,245,0));
}
#mw-content-text { font-weight:300;text-align:justify }
.toc { 
  background-image: linear-gradient(110deg,#9e499e 10%,#ed4aed 60%,#964cf0);
  background-clip: text;	
  -webkit-background-clip: text; /* chrome */	
  color: transparent;
  border:none;
  box-shadow:none;
  margin:0;
  padding:20px 0;
  letter-spacing: 2px;
  line-height:1.5;
  font-weight:400;
}
.toc a { color:inherit !important }
.toc ul, .toc ul ul { list-style-type:none;margin:0;padding:0;display:inline }
.toc li { display:inline }
.toc .toclevel-3, .toctitle { display: none }
.top a, .mid a { border:2px solid; border-image:linear-gradient(0.25turn,#9e499e 35%,#ed4aed 70%,#964cf0) 1;border-bottom-width:2px;border-top-width:0;border-right-width:0;border-left-width:0;color:inherit !important}
.top sup a, .mid sup a, .top .toc a, a.mw-tmh-play, a.image, a.internal, a.oo-ui-buttonElement-button { border:none; }
.top a.new, .mid a.new { border-bottom-width:1px }
.top { font-size:large;padding:10px 40px 20px;max-width:1500px;margin-left:auto;margin-right:auto; }
.top1 { background:#f0f0f5 }
.top .mw-gallery-slideshow, .top .mw-gallery-slideshow .mw-gallery-slideshow-buttons, .top .oo-ui-layout.oo-ui-panelLayout p { margin:0;padding:0 }
h2 { max-width:1500px;margin-left:auto;margin-right:auto;padding:20px 40px 0;color:#9e499e;border:none }
#contentSub a, h2 a { color:#ed4aed }
@media (max-width: 600px) {
  .mid, .top { padding:10px }
}
@media (min-width: 601px) {
  .mid {
    column-count: 2;
    padding: 5px 40px 20px;
    column-gap: 40px;
    max-width: 1500px;
    margin-left:auto;
    margin-right:auto;
  }
  .mid .thumb { break-inside:avoid;margin:0 0 20px;padding:0 }
  .mid .thumbinner { width:calc(100% - 40px) !important;text-align:center }
  .mid .thumbinner img { width:100%;height:auto;max-width:450px }
  .mid p { margin: 0 0 20px }
}
@media (min-width: 1200px) {
  .mid {
    column-count: 3;
  }
}
.mid2 { background:#f0f0f5;padding-bottom:20px }
.mid2 h2 { text-align:right;padding-top:40px }
.mw-body h2::after { border:none }
h2::before { content:'';border-top:1px solid;display:block;margin-bottom:10px }
.B {
  font-weight:bold;
  padding:0 10px 0 0;
  line-height:1;
  font-size:54px;
  color:#9e499e;
  float:left;
}
.color { color:#9e499e }