Consumer Rights Wiki

Main Page.css: Difference between revisions

← Older edit
No edit summary
Tag: Reverted
No edit summary
 
(16 intermediate revisions by the same user not shown)
Line 13: Line 13:
   letter-spacing: 0.1em;
   letter-spacing: 0.1em;
   text-transform: uppercase;
   text-transform: uppercase;
   color: #b9dcff;
   color: #fff;
   margin-bottom: 16px;
   margin-bottom: 16px;
   display: block;
   display: block;
Line 50: Line 50:
   text-align: center;
   text-align: center;
   padding: 0 28px;
   padding: 0 28px;
  border-right: 1px solid #fff;
}
}


Line 72: Line 71:
.crw-hero-stat-label {
.crw-hero-stat-label {
   font-size: 12px;
   font-size: 12px;
   color: #99c0e0;
   color: #fff;
   text-transform: uppercase;
   text-transform: uppercase;
   letter-spacing: 0.08em;
   letter-spacing: 0.08em;
Line 190: Line 189:
.crw-panel-body {
.crw-panel-body {
   padding: 16px;
   padding: 16px;
  background: #fafafa;
}
}


.crw-article-grid {
.crw-article-grid {
   display: table;
   display: grid;
   width: 100%;
   grid-template-columns: repeat(3, 1fr);
  border-collapse: separate;
   gap: 12px;
   border-spacing: 12px;
  table-layout: fixed;
}
}


.crw-article-row {
.crw-article-row {
   display: table-row;
   display: contents;
}
}


.crw-article-card {
.crw-article-card {
   display: table-cell;
   display: flex;
   width: 33.33%;
   flex-direction: column;
  vertical-align: top;
  border: 1px solid #d0dce8;
   border-radius: 6px;
   border-radius: 6px;
   overflow: hidden;
   overflow: hidden;
Line 214: Line 210:
   color: #222222 !important;
   color: #222222 !important;
   background: #ffffff;
   background: #ffffff;
   padding: 0;
   box-shadow: 0 1px 4px rgba(0,0,0,0.10);
  transition: box-shadow 0.18s, transform 0.18s;
}
}


.crw-article-card:hover {
.crw-article-card:hover {
  border-color: #004080;
   box-shadow: 0 4px 16px rgba(0,0,0,0.16);
   box-shadow: 0 2px 10px rgba(0,64,128,0.12);
  transform: translateY(-2px);
}
}


.crw-article-img {
.crw-article-img {
   height: 130px;
   height: 180px;
   background: #e0ecf8;
   background: #fafafa;
   overflow: hidden;
   overflow: hidden;
   display: block;
   display: block;
   text-align: center;
   flex-shrink: 0;
  line-height: 130px;
  font-size: 36px;
}
}


.crw-article-img img {
.crw-article-img img {
   width: 100%;
   width: 100%;
   height: 130px;
   height: 180px;
  object-fit: cover;
   display: block;
   display: block;
}
}


.crw-article-info {
.crw-article-info {
   padding: 14px 14px 16px;
   padding: 14px 16px 18px;
  display: flex;
  flex-direction: column;
  flex: 1;
  text-align: left;
}
}


.crw-article-tag {
.crw-article-tag {
   display: inline-block;
   display: inline-block;
   background: #004080;
   background: none;
   color: #ffffff;
   color: #888888;
   font-size: 11px;
   font-size: 12px;
   font-weight: bold;
   font-weight: normal;
   padding: 3px 8px;
   padding: 0;
   border-radius: 3px;
   border-radius: 0;
   margin-bottom: 8px;
   margin-bottom: 5px;
   letter-spacing: 0.04em;
   letter-spacing: 0;
  text-transform: none;
}
}


.crw-article-title {
.crw-article-title {
   font-size: 15px;
   font-size: 18px;
   font-weight: bold;
   font-weight: bold;
   color: #004080;
   color: #111111;
   line-height: 1.3;
   line-height: 1.3;
   display: block;
   display: block;
Line 264: Line 265:


.crw-article-title a {
.crw-article-title a {
   color: #004080;
   color: #111111;
   text-decoration: none;
   text-decoration: none;
}
}
Line 273: Line 274:


.crw-article-desc {
.crw-article-desc {
   font-size: 13px;
   font-size: 14px;
   color: #444444;
   color: #555555;
   line-height: 1.5;
   line-height: 1.6;
   display: block;
   display: block;
}
}
Line 456: Line 457:
   display: inline-block;
   display: inline-block;
   margin-left: 10px;
   margin-left: 10px;
}
@media screen and (max-width: 900px) {
  .crw-article-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media screen and (max-width: 720px) {
  .crw-hero {
    padding: 32px 20px;
  }
  .crw-hero-title {
    font-size: 24px;
  }
  .crw-hero-sub {
    font-size: 15px;
  }
  .crw-hero-stat {
    padding: 0 14px;
  }
  .crw-hero-stat-num {
    font-size: 22px;
  }
  .crw-how-strip-table,
  .crw-how-strip-table tr,
  .crw-how-strip-table td {
    display: block !important;
    width: 100% !important;
    padding: 0 0 8px 0 !important;
  }
  .crw-main-grid,
  .crw-main-grid tr,
  .crw-main-grid td {
    display: block !important;
    width: 100% !important;
    padding: 0 !important;
  }
  .crw-article-grid {
    grid-template-columns: 1fr;
  }
  .crw-article-card {
    margin-bottom: 12px;
  }
  .crw-cta-bar {
    padding: 20px 16px;
  }
  .crw-cta-text {
    display: block;
    max-width: 100%;
    margin-bottom: 16px;
  }
  .crw-cta-actions {
    display: block;
    float: none;
    margin: 0;
  }
  .crw-cta-actions a {
    display: inline-block;
    margin: 4px 6px 4px 0;
  }
}
.crw-article-info {
  text-align: center;
}
}


Line 464: Line 543:
   html.skin-theme-clientpref-night .crw-panel { background: #0d1f35; border-color: #1e3a5f; }
   html.skin-theme-clientpref-night .crw-panel { background: #0d1f35; border-color: #1e3a5f; }
   html.skin-theme-clientpref-night .crw-panel-head { background: #002a5a; }
   html.skin-theme-clientpref-night .crw-panel-head { background: #002a5a; }
   html.skin-theme-clientpref-night .crw-panel-body { color: #d0e0f0; }
   html.skin-theme-clientpref-night .crw-panel-body { background: #0a1828; color: #d0e0f0; }
   html.skin-theme-clientpref-night .crw-how-card { background: #0d1f35; border-color: #1e3a5f; border-top-color: #004080; color: #d0e0f0 !important; }
   html.skin-theme-clientpref-night .crw-how-card { background: #0d1f35; border-color: #1e3a5f; border-top-color: #004080; color: #d0e0f0 !important; }
   html.skin-theme-clientpref-night .crw-how-title { color: #88bbee; }
   html.skin-theme-clientpref-night .crw-how-title { color: #88bbee; }
Line 470: Line 549:
   html.skin-theme-clientpref-night .crw-article-card { background: #0d1f35; border-color: #1e3a5f; color: #d0e0f0 !important; }
   html.skin-theme-clientpref-night .crw-article-card { background: #0d1f35; border-color: #1e3a5f; color: #d0e0f0 !important; }
   html.skin-theme-clientpref-night .crw-article-img { background: #0a1828; }
   html.skin-theme-clientpref-night .crw-article-img { background: #0a1828; }
   html.skin-theme-clientpref-night .crw-article-title { color: #88bbee; }
   html.skin-theme-clientpref-night .crw-article-title { color: #000; }
   html.skin-theme-clientpref-night .crw-article-title a { color: #88bbee; }
   html.skin-theme-clientpref-night .crw-article-title a { color: #000; }
   html.skin-theme-clientpref-night .crw-article-desc { color: #8aabcc; }
   html.skin-theme-clientpref-night .crw-article-desc { color: #8aabcc; }
  html.skin-theme-clientpref-night .crw-article-tag { color: #6a8aaa; }
   html.skin-theme-clientpref-night .crw-cat-item { background: #0a1828; border-color: #1e3a5f; color: #88bbee !important; }
   html.skin-theme-clientpref-night .crw-cat-item { background: #0a1828; border-color: #1e3a5f; color: #88bbee !important; }
   html.skin-theme-clientpref-night .crw-tool-item { background: #0a1828; border-color: #1e3a5f; color: #d0e0f0 !important; }
   html.skin-theme-clientpref-night .crw-tool-item { background: #0a1828; border-color: #1e3a5f; color: #d0e0f0 !important; }
Line 493: Line 573:
   html.skin-theme-clientpref-os .crw-panel { background: #0d1f35; border-color: #1e3a5f; }
   html.skin-theme-clientpref-os .crw-panel { background: #0d1f35; border-color: #1e3a5f; }
   html.skin-theme-clientpref-os .crw-panel-head { background: #002a5a; }
   html.skin-theme-clientpref-os .crw-panel-head { background: #002a5a; }
   html.skin-theme-clientpref-os .crw-panel-body { color: #d0e0f0; }
   html.skin-theme-clientpref-os .crw-panel-body { background: #0a1828; color: #d0e0f0; }
   html.skin-theme-clientpref-os .crw-how-card { background: #0d1f35; border-color: #1e3a5f; border-top-color: #004080; color: #d0e0f0 !important; }
   html.skin-theme-clientpref-os .crw-how-card { background: #0d1f35; border-color: #1e3a5f; border-top-color: #004080; color: #d0e0f0 !important; }
   html.skin-theme-clientpref-os .crw-how-title { color: #88bbee; }
   html.skin-theme-clientpref-os .crw-how-title { color: #88bbee; }
Line 499: Line 579:
   html.skin-theme-clientpref-os .crw-article-card { background: #0d1f35; border-color: #1e3a5f; color: #d0e0f0 !important; }
   html.skin-theme-clientpref-os .crw-article-card { background: #0d1f35; border-color: #1e3a5f; color: #d0e0f0 !important; }
   html.skin-theme-clientpref-os .crw-article-img { background: #0a1828; }
   html.skin-theme-clientpref-os .crw-article-img { background: #0a1828; }
   html.skin-theme-clientpref-os .crw-article-title { color: #88bbee; }
   html.skin-theme-clientpref-os .crw-article-title { color: #e0e0e0; }
   html.skin-theme-clientpref-os .crw-article-title a { color: #88bbee; }
   html.skin-theme-clientpref-os .crw-article-title a { color: #000!important; }
   html.skin-theme-clientpref-os .crw-article-desc { color: #8aabcc; }
   html.skin-theme-clientpref-os .crw-article-desc { color: #8aabcc; }
  html.skin-theme-clientpref-os .crw-article-tag { color: #6a8aaa; }
   html.skin-theme-clientpref-os .crw-cat-item { background: #0a1828; border-color: #1e3a5f; color: #88bbee !important; }
   html.skin-theme-clientpref-os .crw-cat-item { background: #0a1828; border-color: #1e3a5f; color: #88bbee !important; }
   html.skin-theme-clientpref-os .crw-tool-item { background: #0a1828; border-color: #1e3a5f; color: #d0e0f0 !important; }
   html.skin-theme-clientpref-os .crw-tool-item { background: #0a1828; border-color: #1e3a5f; color: #d0e0f0 !important; }
Line 514: Line 595:
   html.skin-theme-clientpref-os .cat-but { background: #0d1f35 !important; border-color: #1e3a5f !important; color: #88bbee !important; }
   html.skin-theme-clientpref-os .cat-but { background: #0d1f35 !important; border-color: #1e3a5f !important; color: #88bbee !important; }
   html.skin-theme-clientpref-os .cat-but:hover { background: #004080 !important; color: #ffffff !important; border-color: #004080 !important; }
   html.skin-theme-clientpref-os .cat-but:hover { background: #004080 !important; color: #ffffff !important; border-color: #004080 !important; }
}
/* Chrome button */
#p-Tools .mw-list-item a[href*="chromewebstore"] {
  display: inline-block;
  background: #1a73e8;
  color: #ffffff !important;
  padding: 6px 12px;
  border-radius: 6px;
  font-weight: bold;
  font-size: 13px;
  text-decoration: none !important;
  margin-bottom: 4px;
}
/* Firefox button */
#p-Tools .mw-list-item a[href*="addons.mozilla.org"] {
  display: inline-block;
  background: #ff6611;
  color: #ffffff !important;
  padding: 6px 12px;
  border-radius: 6px;
  font-weight: bold;
  font-size: 13px;
  text-decoration: none !important;
}
}
Retrieved from "https://consumerrights.wiki/w/Main_Page.css"