Welcome to Assassin's Creed Wiki! Log in and join the community.

MediaWiki:Mainpage.css: Difference between revisions

From the Assassin's Creed Wiki
Jump to navigation Jump to search
imported>Cristophorus35
mNo edit summary
imported>ReverieCode
m Testing...
 
(11 intermediate revisions by 2 users not shown)
Line 1: Line 1:
/* =================================
/* =================================
   Mirage 2023 mainpage redesign
   Shadows 2024 mainpage redesign


   While most of the elements here affect
   While most of the elements here affect
   ONLY the mainpage, a few color choices
   ONLY the mainpage, a few color choices
   following Ubisoft's current Mirage
   following Ubisoft's current Shadows
   marketing campaign do appear on  
   marketing campaign do appear on  
   every page.
   every page, predominantly red and black.
    
   Some other colors also feature following
   Most obviously, the link color matches the
   our users' feedback.
  color palatte chosen for Mirage, based on the
  Islamic Golden Age as central theme,
  consisting in blue, tan, and dark gold.
    
    
   DARK THEME:
   DARK THEME:
   Link color: #e4b27c (Former #ffc383)
   Link color: #cc9800
   Header (Sticky nav) color: #142b3d
   Header (Sticky nav) color: #3d1d14
   Border color: #8c5229
   Border color: #cc9800
   Font color: #FFF
   Font color: #FFF
   Main background: #6786a3
   Mainpage Font and Border color: #cc0000
   Page background: #211714
  Page (Article background): #0d0101
   Buttons: #dcdcdc (Might change later)
   Main (Community background): #270505
   Buttons (Accent color): #dcdcdc


   LIGHT THEME:
   LIGHT THEME:
   Link color: #814709 (Former #763e03)
   Link color: #856300
   Header (Sticky nav) color: #e9d5b3
   Header (Sticky nav) color: #dd2929
   Border color: #8c5229
   Border color: #856300
   Font color: #FFF
   Font color: #000000
   Main background: #e2c59a
   Mainpage Font and Border color: #cc0000
   Page background: #fbf4e8
   Page (Article background): #f7f0f0
   Buttons: #dcdcdc (Might change later)
   Main (Community background): #b9010d
  Buttons (Accent color): #313131
    
    
   Also, the redlink color has to be changed
   The redlink color could be change eventually, but
  because this is a dark-themed wiki. Standard
   it remains to be discussed yet.
  red color would have very low contrast with
  the black background. A red (well, really, salmon)
   of #ffb7b7 makes things more readable on this wiki.
 
  Similarly, the general transparency of pages has
  been dialed back to about 45% for reasons of general
  legibility for those with different visual acuities.
  Now that the background is a lighter grey, it's
  transparency makes pages considerably lighter, so
  it needs to be turned down a bit to preserve the
  previous levels of legibility, given that the text
  is generally white.  
   =================================  */
   =================================  */


Line 62: Line 49:
.mainpage-wrap a.new:visited,
.mainpage-wrap a.new:visited,
.mainpage-wrap a:visited,
.mainpage-wrap a:visited,
.mainpage-wrap a:link {
.mainpage-wrap a:link,
     color:#e78e67!important;
.mainpage-box-visit .visit-body a {
     color:#cc0000!important;
}
}


Line 84: Line 72:
     font-family:cinzel;
     font-family:cinzel;
     padding:.3em .2em .3em .1em;
     padding:.3em .2em .3em .1em;
     color:#e78e67!important;
     color:#cc0000!important;
     font-size:14px;
     font-size:14px;
     /* background-color:#000; */
     /* background-color:#000; */
Line 94: Line 82:
}
}
/** Modules **/
/** Modules **/
/*.mainpage-box-about,
.mainpage-box-about,
.mainpage-box-visit,
.mainpage-box-visit,
.mainpage-box-welcome,
.mainpage-box-welcome,
Line 116: Line 104:
     margin:0 auto 20px;
     margin:0 auto 20px;
     /*height:300px;*/
     /*height:300px;*/
/*}*/
}
/*.mainpage-box-help .help-body {
.mainpage-box-help .help-body {
     font-size:14px;
     font-size:14px;
     line-height:140%;
     line-height:140%;
Line 129: Line 117:
.mainpage-box-help,
.mainpage-box-help,
.mainpage-box-featured-article {
.mainpage-box-featured-article {
     border:2px solid #bb7252;
     border:2px solid #cc0000;
     padding:20px;
     padding:20px;
}
}
.mainpage-box-other-wikis {
.mainpage-box-other-wikis {
border:2px solid #bb7252;
border:2px solid #cc0000;
     padding:1px;
     padding:1px;
}
}
Line 162: Line 150:
     margin:2px auto;
     margin:2px auto;
     /*text-align:center;*/
     /*text-align:center;*/
/*}
}
/* External template wrangling  
/* External template wrangling  
    
    
Line 170: Line 158:
     !importanting is required. */
     !importanting is required. */
      
      
/*.mainpage-box-other-wikis > div {  
.mainpage-box-other-wikis > div {  
     border-radius:0!important;
     border-radius:0!important;
     border:0!important;
     border:0!important;
Line 196: Line 184:
}
}
/*.mainpage-box-other-wikis .WikiaArticle p + p */
/*.mainpage-box-other-wikis .WikiaArticle p + p */
/*.mainpage-box-other-wikis p + p {
.mainpage-box-other-wikis p + p {
     font-size:13px!important;
     font-size:13px!important;
     line-height:160%!important;
     line-height:160%!important;
Line 202: Line 190:


/** Headers, in general **/
/** Headers, in general **/
/*.mainpage-box-about .header,
.mainpage-box-about .header,
.mainpage-box-visit .header,
.mainpage-box-visit .header,
.mainpage-box-characters .header,
.mainpage-box-characters .header,
Line 214: Line 202:
     letter-spacing:3px;
     letter-spacing:3px;
     margin:0 auto;
     margin:0 auto;
     color:#e78e67;
     color:#cc0000;
     padding-bottom:20px;
     padding-bottom:20px;
     padding-top:10px;
     padding-top:10px;
Line 244: Line 232:
     font-size:26px;
     font-size:26px;
     text-align:center;
     text-align:center;
     color:#e78e67;
     color:#cc0000;
     text-transform:uppercase;
     text-transform:uppercase;
     letter-spacing:2px;
     letter-spacing:2px;
Line 255: Line 243:
}
}
/* Forum module */
/* Forum module */
/*.mainpage .mw-content-ltr .forum-activity-module h2 {
.mainpage .mw-content-ltr .forum-activity-module h2 {
     display:none;
     display:none;
}
}
Line 272: Line 260:
.mainpage .embeddable-discussions-module .embeddable-discussions-post-actions a,
.mainpage .embeddable-discussions-module .embeddable-discussions-post-actions a,
.mainpage .embeddable-discussions-module .embeddable-discussions-post-actions {
.mainpage .embeddable-discussions-module .embeddable-discussions-post-actions {
     border-color:#bb7252;
     border-color:#cc0000;
     color:#e78e67;
     color:#cc0000;
}
}
.mainpage .embeddable-discussions-heading {
.mainpage .embeddable-discussions-heading {
Line 279: Line 267:
}
}
.mainpage .embeddable-discussions-show-all {
.mainpage .embeddable-discussions-show-all {
     color:#e78e67;
     color:#cc0000;
     display:none;
     display:none;
}
}
Line 286: Line 274:
.mainpage .embeddable-discussions-show-all a:link,
.mainpage .embeddable-discussions-show-all a:link,
.mainpage .embeddable-discussions-show-all a:visited {
.mainpage .embeddable-discussions-show-all a:visited {
     color:#e78e67!important;
     color:#cc0000!important;
}
}
.mainpage .embeddable-discussions-module .embeddable-discussions-post-detail {  
.mainpage .embeddable-discussions-module .embeddable-discussions-post-detail {  
     background-color:transparent;
     background-color:transparent;
     border-color:#bb7252;
     border-color:#cc0000;
}
}


Line 297: Line 285:
.mainpage .embeddable-discussions-module .embeddable-discussions-reply-icon path,
.mainpage .embeddable-discussions-module .embeddable-discussions-reply-icon path,
.mainpage .embeddable-discussions-module .embeddable-discussions-upvote-icon path {
.mainpage .embeddable-discussions-module .embeddable-discussions-upvote-icon path {
     fill: #e78e67;
     fill: #cc0000;
}
}
.mainpage .embeddable-box-discussions-module .embeddable-mainpage-box-discussions-post-actions a,
.mainpage .embeddable-box-discussions-module .embeddable-mainpage-box-discussions-post-actions a,
Line 305: Line 293:
.mainpage .embeddable-mainpage-box-discussions-module .embeddable-mainpage-box-discussions-timestamp,
.mainpage .embeddable-mainpage-box-discussions-module .embeddable-mainpage-box-discussions-timestamp,
.mainpage .embeddable-mainpage-box-discussions-module .embeddable-mainpage-box-discussions-forum {
.mainpage .embeddable-mainpage-box-discussions-module .embeddable-mainpage-box-discussions-forum {
     color:#e78e67;
     color:#cc0000;
}
}


Line 329: Line 317:
}
}
.mainpage .tabs .selected a {
.mainpage .tabs .selected a {
     border-color:#bb7252;
     border-color:#cc0000;
     border-radius:0;
     border-radius:0;
     color:#e78e67;
     color:#cc0000;
}
}
.mainpage ul.tabs {
.mainpage ul.tabs {
Line 339: Line 327:
input.createboxInput {
input.createboxInput {
     background:transparent;
     background:transparent;
     border-color:#bb7252;
     border-color:#cc0000;
     color:#e78e67;
     color:#cc0000;
     margin-left:0;  
     margin-left:0;  
}
}
Line 355: Line 343:
     text-transform:uppercase;
     text-transform:uppercase;
     background-color:transparent;
     background-color:transparent;
     border-color:#bb7252;
     border-color:#cc0000;
     color:#e78e67;
     color:#cc0000;
}
}



Latest revision as of 10:18, 22 May 2024

/* =================================
   Shadows 2024 mainpage redesign

   While most of the elements here affect
   ONLY the mainpage, a few color choices
   following Ubisoft's current Shadows
   marketing campaign do appear on 
   every page, predominantly red and black.
   Some other colors also feature following
   our users' feedback.
   
   DARK THEME:
   Link color: #cc9800
   Header (Sticky nav) color: #3d1d14
   Border color: #cc9800
   Font color: #FFF
   Mainpage Font and Border color: #cc0000
   Page (Article background): #0d0101
   Main (Community background): #270505
   Buttons (Accent color): #dcdcdc

   LIGHT THEME:
   Link color: #856300
   Header (Sticky nav) color: #dd2929
   Border color: #856300
   Font color: #000000
   Mainpage Font and Border color: #cc0000
   Page (Article background): #f7f0f0
   Main (Community background): #b9010d
   Buttons (Accent color): #313131
   
   The redlink color could be change eventually, but
   it remains to be discussed yet.
   =================================  */

/* General redlink color  */
 
.WikiaMainContent a.new,
.WikiaMainContent a.new:visited {
      color:#ffb7b7!important;
}
/** General mainpage qualities **/

.mainpage-wrap {
    font-family:rubik,sans-serif;
}
.mainpage-wrap a,
.mainpage-wrap a.new,
.mainpage-wrap a.new:visited,
.mainpage-wrap a:visited,
.mainpage-wrap a:link,
.mainpage-box-visit .visit-body a {
    color:#cc0000!important;
}

.mainpage ficaption p.title,
.mainpage .article-thumb figcaption {
     display:none;
     margin-left:10px;
}
.mainpage-wrap .wikia-gallery-caption-within .lightbox-caption a.new:visited,
.mainpage-wrap .wikia-gallery-caption-within .lightbox-caption a.new,
.mainpage-wrap .wikia-gallery-caption-within .lightbox-caption a:visited,
.mainpage-wrap .wikia-gallery-caption-within .lightbox-caption a:link,
.mainpage-wrap .wikia-gallery-caption-within .lightbox-caption,
.mainpage-wrap .wikia-gallery-caption-below .lightbox-caption a:visited,
.mainpage-wrap .wikia-gallery-caption-below .lightbox-caption a:link,
.mainpage-wrap .wikia-gallery-caption-below .lightbox-caption {
    letter-spacing:1px;
    font-weight:600;
    line-height:150%;
    font-family:cinzel;
    padding:.3em .2em .3em .1em;
    color:#cc0000!important;
    font-size:14px;
    /* background-color:#000; */
}
.mainpage .lightbox-caption {
} 
.mainpage .WikiaArticle a.external:after {
    display:none;
}
/** Modules **/
.mainpage-box-about,
.mainpage-box-visit,
.mainpage-box-welcome,
.mainpage-box-characters,
.mainpage-box-help,
.mainpage-box-featured-videos,
.mainpage-box-featured-article {
    width:700px;
    margin:5px auto;
}
.mainpage-box-featured-videos {
    width:670px;
}
.mainpage-box-about {
    margin-top:0px;
}
.mainpage-box-visit .visit-body {
    line-height:200%;
    font-size:14px;
    width:80%;
    margin:0 auto 20px;
    /*height:300px;*/
}
.mainpage-box-help .help-body {
    font-size:14px;
    line-height:140%;
}
.mainpage-box-characters,
.mainpage-box-visit,
.mainpage-box-forum,
.mainpage-box-discussions,
.mainpage-box-news,
.mainpage-box-poll,
.mainpage-box-help,
.mainpage-box-featured-article {
    border:2px solid #cc0000;
    padding:20px;
}
.mainpage-box-other-wikis {
	border:2px solid #cc0000;
    padding:1px;
}
.mainpage-box-characters img {
    margin-top:0!important;
}
.mainpage-box-countdown{
	width:285px;
}
.mainpage-box-buy,
.mainpage-box-discord {
    margin-bottom:20px;
    margin-top:20px;
}
.mainpage-box-discussions {
    margin:20px 0;
    padding-left: 5px;
    padding-right: 5px;
}
.mainpage-box-forum,
.mainpage-box-discussions,
.mainpage-box-news,
.mainpage-box-poll  {
    margin-bottom:20px;
    max-width:285px;
}
.mainpage-box-other-wikis {
    margin:2px auto;
    /*text-align:center;*/
}
/* External template wrangling 
   
    Because the Action-Adventure Games
    template resides on Community Central
    and not this wiki, a whole lot of
    !importanting is required. */
    
.mainpage-box-other-wikis > div { 
    border-radius:0!important;
    border:0!important;
    width:inherit!important;
    box-shadow:none!important;
    background-color:transparent!important;
    margin:0!important;
    padding:0!important;
}
.mainpage-box-other-wikis > div a,
.mainpage-box-other-wikis > div a:visited {
    color:#fff;
}
.mainpage-box-other-wikis div {
    width:265px!important;
    text-align:left!important;
}
.mainpage-box-other-wikis > img {
    display:block!important;
}
.mainpage-box-other-wikis p + div,
.mainpage-box-other-wikis p > div,
.mainpage-box-other-wikis .image .image-thumbnail .link-external {
    display:none;
}
/*.mainpage-box-other-wikis .WikiaArticle p + p */
.mainpage-box-other-wikis p + p {
    font-size:13px!important;
    line-height:160%!important;
}

/** Headers, in general **/
.mainpage-box-about .header,
.mainpage-box-visit .header,
.mainpage-box-characters .header,
.mainpage-box-help .header,
.mainpage-box-featured-article .header,
.mainpage-box-featured-videos .header {
     text-align:center;
     font-size:38px;
     text-transform:uppercase;
     font-family: "Cinzel";
     letter-spacing:3px;
     margin:0 auto;
     color:#cc0000;
     padding-bottom:20px;
     padding-top:10px;
     line-height:130%;
}
.mainpage-box-about .header {
    padding:0;
}
.mainpage-box-about .subheader {
    font-size:16px;
    line-height:150%;
    width:600px;
    margin:0 auto;
    text-align:center;
    font-family:cinzel;
}
.mainpage-box-about .description {
    width:600px;
    padding:20px 0 20px 0;
    line-height:150%;
    margin:0 auto;
    text-align:center;
    font-family:cinzel;
}
.mainpage-box-discussions .header,
.mainpage-box-news .header,
.mainpage-box-poll .main-header,
.mainpage-box-forum .header {
     font-size:26px;
     text-align:center;
     color:#cc0000;
     text-transform:uppercase;
     letter-spacing:2px;
     font-family: "Cinzel";
     line-height:130%;
}
.mainpage-box-forum .header,
.mainpage-box-news .header {
    margin-bottom:20px;
}
/* Forum module */
.mainpage .mw-content-ltr .forum-activity-module h2 {
    display:none;
}
/* Discussions module */
.mainpage .discussion-module { 
     display:none /* Turns off standard module to give deference to the bespoke one here */
}
.mainpage .embeddable-discussions-module { 
     border:none;
     padding:5px;
}
.mainpage .embeddable-discussions-module .embeddable-discussions-post-detail {
     /*background-color:#bac3cd;*/
}

.mainpage .embeddable-discussions-module .embeddable-discussions-post-actions a,
.mainpage .embeddable-discussions-module .embeddable-discussions-post-actions {
    border-color:#cc0000;
    color:#cc0000;
}
.mainpage .embeddable-discussions-heading {
     display:none;
}
.mainpage .embeddable-discussions-show-all {
     color:#cc0000;
     display:none;
}

.mainpage .embeddable-discussions-show-all a,
.mainpage .embeddable-discussions-show-all a:link,
.mainpage .embeddable-discussions-show-all a:visited {
     color:#cc0000!important;
}
.mainpage .embeddable-discussions-module .embeddable-discussions-post-detail { 
     background-color:transparent;
     border-color:#cc0000;
}

.mainpage .embeddable-discussions-module .embeddable-discussions-reply-icon-tiny path,
.mainpage .embeddable-discussions-module .embeddable-discussions-upvote-icon-tiny path,
.mainpage .embeddable-discussions-module .embeddable-discussions-reply-icon path,
.mainpage .embeddable-discussions-module .embeddable-discussions-upvote-icon path {
    fill: #cc0000;
}
.mainpage .embeddable-box-discussions-module .embeddable-mainpage-box-discussions-post-actions a,
.mainpage .embeddable-mainpage-box-discussions-module .embeddable-mainpage-box-discussions-post-counters,
.mainpage .embeddable-mainpage-box-discussions-module .avatar-details,
.mainpage a.avatar-username,
.mainpage .embeddable-mainpage-box-discussions-module .embeddable-mainpage-box-discussions-timestamp,
.mainpage .embeddable-mainpage-box-discussions-module .embeddable-mainpage-box-discussions-forum {
    color:#cc0000;
}

/* Poll stuff */
div#ajax-poll-area {
    text-align:center;
}
div.ajax-poll div.header {
    text-align:center;
}
.mainpage .ajax-poll input[type="submit"] {
    margin-left:85px;
}
/* Blog stuff */
.mainpage .WikiaBlogListingBox .wikia-button,
.mainpage a.more,
.mainpage .WikiaBlogListingBox h2 {
    display:none;
}
.mainpage .tabs li a {
    padding:5px;
    margin-right:10px;
}
.mainpage .tabs .selected a {
    border-color:#cc0000;
    border-radius:0;
    color:#cc0000;
}
.mainpage ul.tabs {
    border:none;
}
/* Help stuff */
input.createboxInput {
    background:transparent;
    border-color:#cc0000;
    color:#cc0000;
    margin-left:0; 
}
/* Category Tree stuff */
.mainpage .CategoryTreeBullet {
    display:none;
}
/* Button stuff */
.mainpage input[type="submit"],
.mainpage input[type="button"],
.mainpage button {
    background-image:none;
    border-radius:0;
    text-transform:uppercase;
    background-color:transparent;
    border-color:#cc0000;
    color:#cc0000;
}


/* Footer */

.mainpage .recirculation-horizontal.recirculation-footer h3,
.mainpage .recirculation-horizontal .item a,
.mainpage .WikiaFooter .recirculation-impact-footer h2,
.mainpage .WikiaFooter .recirculation-impact-footer .items h4 {
    color:#fff
}

/* Portability */
@media (max-width: 1023px) {
      .mainpage-box-discussions,
      .mainpage-box-forum,
      .mainpage-box-news,
      .mainpage-box-poll {
          border:none!important;
          width:285px!important;
      }
     .mainpage-box-news,
     .mainpage-box-forum,
     .mainpage-box-discussions {
          display:inline-block;
          margin:0 auto 20px auto;
          background-color:transparent;
          border:none;
     }
     .main-page-tag-rcs .module,
     .main-page-tag-rcs .forum-activity-module {
          width:285px;
     }

}