FamilySearch Wiki

MediaWiki:Common.css: Difference between revisions

m (removed GR coding and put into beta)
No edit summary
 
(215 intermediate revisions by 4 users not shown)
Line 1: Line 1:
/* The background container for Main_Page-GR */
/* Hiding Powered by Google Translate */
#GRContainer {
/* Removing for now
background-image: url(/wiki/en/img_auth.php/9/95/World_map_purplish.png);
.goog-logo-link {
background-size: cover;
    display:none !important;
}
}
/* the menu table on the Main_Page-GR */
.goog-te-gadget {
#GRMenu {
    color: transparent !important;
border:1px solid black;
width:max-content;
margin-left: auto;
margin-right: auto;
background-color: #ffffffd1; /* white with alpha transparency */
}
}
/* The callout for Main_Page-GR */
.goog-te-gadget div:first-child::after {
.callout2 {
     display:none !important;
    position: absolute;
    top: 1%;
    right: 80%;
    width: 160px;
    text-align: center;
    font-size: 1rem;
    cursor: pointer;
    border-radius: 5px;
    box-shadow: 5px 5px 2px #888888;
    color: #004d99;
    background-color: white;
    padding: 5px;
    border: 1px solid gray
}
/* The div containing the logo on Main Page-GR */
.GRLogo {
position: absolute;
    left: 80%;
     top: 1%;
}
}
*/




 
/* Temp fix START */
/* Create a class for GR Sidebar tables */
/* Need to incorporate this correctly into FsLookAndFeel */
.sidebar {
.vector-menu-tabs-legacy ul {
padding:2px;
    font-size: 18.8px;
width:max-content;
margin-left:10px;
margin-top: 47px;
border-spacing:0px;
border:1px solid gray;
position:relative;
background:white;
}
}
 
/*
.sidebar p {
.fullFooter {
line-height: 1em;
    float:left;
}
}
 
*/
.sidebar-heading {
#global-footer {
text-align:center;  
    all: unset;
background: #DCDAD1;  
    display: block;
font-size:12pt;
    padding: 17px 24px 18px 8px;
    box-sizing: border-box;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    -webkit-align-items: flex-end;
    align-items: flex-end;
    margin-left: 150px;
}
}


/* Create a blue gradient */
/*
.gradient {
#global-footer {
padding-left:20px;
    display: none;
padding-right:20px;
margin-left:-20px;
margin-right:-20px;
background: #d7e0ff;
}
}
 
.footer-left {
/* The following readjusts the popup box that appears when hovering over links in GuidedResearch.   */
display:block !important;
.tooltip .tooltiptext {
    left: unset;
    width: max-content;
}
}
 
.footer-right {
/* Override Bootstrap's definition of container for the FAQ Pages */
display:block !important;
#FAQPage.container {
margin-left: 0;
}
}
*/


/* Bootstrap overrides */
/* Temp fix END */
legend {
width: auto;
}
.tooltip {
opacity:100 !important;
}
table {
border-collapse: separate;
}
caption {
caption-side: top;
}
th {
text-align: center;
}
/* end Bootstrap overrides */


 
/* Charles edit comment out
.button-style {
.flex-container{
  background-color: #7897BA;
display:flex;
  border:4px outset #B3D2F5;
flex-wrap:wrap;
  border-radius:.5rem;
gap:20px
  color: white !important;
  padding: .2rem 1.5rem;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-weight:bold;
  font-family:Arial;
  position:absolute;
  font-size: 1.25rem;
  cursor: pointer;
}
.button-style > a, .button-style > a.visited, .button-style > a.external:visited , .button-style > a:hover {
  color:white !important;
text-decoration:none !important;
}
}
*/


.button1{
border-radius:10px;
background:#4d94ff;
color:#ffffff;
padding:5px;
width:230px;
text-align:center;
font-size:15px;
cursor:pointer;
width:230px;


/* Set width of search box to 70%, so 'go' button stays inline. */
#bodySearchInputHomePageSearchBox {
    width: 70%;
}
/* change the box around the code feature */
code {
    color: #000;
    background-color: #f9f9f9;
    border: 1px solid #ddd;
}
pre, code, tt, kbd, samp, .mw-code {
    font-family: monospace,Courier;
}
}
 
.button2{
/* make sure missing pages remain colored correctly after visiting */
border-radius:10px;
a.new:visited, #p-personal a.new:visited {
background:#f16458;
    color: #a55858 !important;
color:#ffffff;
padding:5px;
width:230px;
text-align:center;
font-size:15px;
cursor:pointer;
width:230px;
}
}


/* change border on input forms to be 1pm, instead of 2px, and grey instead of black */
form input {
/*    border: 1px solid !important;*/
    border-color: darkgrey !important;
}
#newHeading {
margin-top:0;}
/* Define spacing and # of columns based on screen size */
@media screen and (min-width: 1400px) {
.column-spacing-fullscreen{
  column-count: 6;
padding-right: 9% !important;
}}
@media screen and (min-width: 1200px) and (max-width: 1399px) {
.column-spacing-fullscreen{
  column-count: 5;
}}
@media screen and (min-width: 900px) and (max-width:1199px) {
.column-spacing-fullscreen{
  column-count: 4;
}}
@media screen and (min-width: 600px) and (max-width:899px) {
.column-spacing-fullscreen{
  column-count: 3;
}}
@media screen and (max-width:745px) {
.column-spacing-fullscreen{
  column-count: 2;
}}
@media screen and (max-width:500px) {
.column-spacing-fullscreen{
  column-count: 1;
}}
/* Define spacing and # of columns based on screen size - however,
/* this section assumes that only half the screen is available for
/* the columns.  Even though the screen size may be 1400px, the
/* available space for the columns is half that, or 700px. */
@media screen and (min-width: 1400px) {
.column-spacing-halfscreen{
  column-count: 3;
}}
@media screen and (min-width: 1200px) and (max-width: 1399px) {
.column-spacing-halfscreen{
  column-count: 2;
}}
@media screen and (min-width: 900px) and (max-width:1199px) {
.column-spacing-halfscreen{
  column-count: 1;
}}
.column-spacing-halfscreen li, .column-spacing-fullscreen li {padding-right:5px;}
/* landing page */
.fakelink {
    color:#004d99;
    display:block;
}


/*--------------------------main page coding-----------------*/
/* ------------------new CSS -------------------*/


/* ------------------containers / elements -------------------*/
/* Header stylying */
#map {
.red_online_button {
    position: relative;
padding:5px;
    width: 100%;
    padding-top: 40px;
    margin-left: 0;
}
}
 
.mw-body-content h2 {
.sectionTitle {
font-weight:bold;
text-align:center;  
line-height:1.3 !important;
margin-bottom:5px;  
font-size:1.5rem !important;
font-size:1.2rem;  
}
}


.subTitle {
.mw-body-content h3 {
text-align:center;  
font-weight:bold;
font-size:1rem;  
line-height:1.6 !important;
font-size:1.4rem !important;
}
}


#statsline {
.mw-body-content h4 {
text-align:center;  
font-weight:bold;
margin-top:5px;
line-height: 1.6 !important;
margin-bottom:16px;
font-size:1.3rem !important;
}
}


.menuTitle {
.mw-body-content h5 {
    color:black;
font-weight:normal;
    justify-content:space-between;
line-height:1.6 !important;
    font-size:1rem;
font-size:1.2rem !important;
    position:sticky;
    top:0;
    background-color:#D9D9D4;
    text-align:center;
}
}


.search-mobile {
.mw-body-content h6 {
  display:none !important;
font-weight:normal;
  }
line-height:1.6 !important;
.map-mobile {
font-size:1.1em !important;
  display:none;
font-style:italic;
  }
 
/* use id="mobileonly" in order to remove items that
  should not be visible in mobile view. 
  Note: id="nomobile" is defined in
  Mobile.css - use this eliminate mobile items. */
  .mobileonly {
    display:none;
  }
 
.searchboxContainer {
  display:flex;  
  justify-content:center;
  align-items: center; /* removed from mobile */
  font-size:1rem;
  margin-top:10px; /* removed from mobile */
}
}


.tips {
#mw-head .vector-menu-dropdown h3 {
  text-align:right;  
font-size: 0.875em;
  font-size:1rem;
line-height: 1.125em;
}
}


.buttonContainer {
#mw-head .vector-menu-dropdown .vector-menu-content-list {
font-size: 1.6em;
}
}


/* any element with id ending in '_button' */
#mw-head .vector-menu-dropdown .vector-menu-content-list {
[id$="_button"] {
     top: 38px;
    background-color:#e1ebee96;
    position:absolute;
    border:1px solid black;
    text-align:center;
    font-size:1rem;
    padding:5px;
    cursor:pointer;
    border-radius:5px;
    box-shadow:2px 2px 2px #888888;
     color:#004d99;
}
}


[id$="_button"]:hover {
/** Remove file upload links from edit menus (Source & VE) **/
    background-color:white;
.wikiEditor-ui-toolbar .section-main .group-insert .oo-ui-widget[rel="file"] {
    color:blue;
  display: none !important;
}
}


#all_countries_button:hover {
.oo-ui-toolbar-popups .oo-ui-toolGroup-tools .oo-ui-tool-name-media {
    background-color:white;
  display: none !important;
    color:blue;
}
}


/* special extra rules for all_countries button */
/* Remove the regular search bar from the Main Page */
#all_countries_button {
.page-Main_Page #mw-head #right-navigation #p-search {
    background-color:#0f5ba9;
display: none !important;
    font-size:1.2rem;
    color:white;
    width:220px;
}
}


/* button placement */
#all_countries_button {top:22%; left:40%;}
#africa_button {top:60%; left:49%;}
#asia_button {top:40%; left:73%;}
#europe_button {top:39%; left: 52%;}
#middle_east_button {top:56%; left:57%;}
#north_america_button {top:35%; left:22%;}
#pacific_button {top:73%; left:85%;}/* Australia/Oceania button*/
#south_america_button {top:70%; left:27%;}


/* Callout is the 'Guided Research' element */
/** Fix layout shift **/
.callout {
position:absolute;
top:15%;
left:80%;
    width:160px;
    text-align:center;
    font-size:1rem;
    cursor:pointer;
    border-radius:5px;
    box-shadow:5px 5px 2px #888888;
    color:#004d99;
    background-color:white;
    padding:5px;
    border:1px solid gray;
}


.calloutHeading {
.skiptranslate {
color:orange;
  margin-top: 0 !important;
font-size:1.3rem;
font-family:museo;
}
}
 
#p-namespaces {
.guided_research_link {
  display: flex;
  border:1px solid black;
  height: 42px;
  text-align:center;
  font-size:1rem;
  cursor:pointer;
  border-radius:5px;
  box-shadow:2px 2px 2px #888888;
  color:#004d99;
  width:150px
}
}
 
#ca-watch a span,
/* ------------------menus -------------------*/
#ca-unwatch a span {
#menu {
  display: none;
    position:absolute;
    top:125px;
    left:0;
    width:210px;
    height:25vw;
    overflow-y:scroll;
    display:block;
    color:#aba8a0;
    background-color:white;
    border:1px solid black;
    z-index: 10;
}
}
 
#ca-watch,
.exit {
#ca-unwatch {
    color: red;
  display: flex;
    cursor: pointer;
  width: 24px;
    float: right;
}
}
 
#p-namespaces .vector-menu-content-list li,
.exit:hover {
#p-views .vector-menu-content-list li {
    font-weight: bold;
  font-size:.8rem !important;
}
}
 
#mw-head-base {
/** This hack is to eliminate shifting due to :hover */
  height: unset !important;
span.exit::before {
    display: block;
    content: "foo";
    font-weight: bold;
    height: 0;
    overflow: hidden;
    visibility: hidden;
}
}
 
.mw-body {
#menu > ul {
  margin-top: unset !important;
    list-style-type: none;
    padding: 0;
    margin-left: 20px;
}
}
 
.vector-menu-tabs #ca-watch.icon a::before {
#menu ul li:hover {
  margin-top: 6px;
    background-color:#ecebea;
}
}
 
.vector-menu-tabs-legacy li a {
/* There are two separate classes, but we don't differentiate their styles */
  float: left;
.countrymenu, .statemenu {
  height: 100% !important;
padding:3px;
  padding-top: 1.5em;
top:0;  
background-color:#D9D9D4;  
color:black
}
}
 
.vector-menu-tabs-legacy {
/* color menu spans to look like a link */
  height: 2.8em;
.fakelink {
color:#004d99;
}
}
 
#right-navigation {
.menulink {
  margin-top: 2.5em;
    font-size: 1rem;
    cursor: pointer;
    margin-left:-1.2rem;
}
}
 
#left-navigation {
.menulink::before {
  margin-top: 2.5em;
content: "> ";
  margin-bottom: -2.5em;
}
}
 
#mw-page-base {
.menulink:hover {
  height: 5.2rem;
background-color: #ecebea;
}
}
 
#mw-head-base {
 
  margin-top: unset !important;
 
  height: unset !important;
/*--------------------------main page coding-----------------*/
 
/* make sure missing pages remain colored correctly after visiting */
a.new:visited, #p-personal a.new:visited {
    color: #a55858 !important;
}
}
/* change border on input forms to be 1pm, instead of 2px, and grey instead of black */
#p-views .vector-menu-content {
form input {
  display: flex;
  /* border: 1px solid !important;
  align-items: end;
  */
  height: 42px;
    border-color: darkgrey !important;
}
}

Latest revision as of 16:49, 5 December 2024

/* Hiding Powered by Google Translate */
/* Removing for now
.goog-logo-link {
    display:none !important;
}
.goog-te-gadget {
    color: transparent !important;
}
.goog-te-gadget div:first-child::after {
    display:none !important;
}
*/


/* Temp fix START */
/* Need to incorporate this correctly into FsLookAndFeel */
.vector-menu-tabs-legacy ul {
    font-size: 18.8px;
}
/*
.fullFooter {
    float:left;
}
*/
#global-footer {
    all: unset;
    display: block;
    padding: 17px 24px 18px 8px;
    box-sizing: border-box;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    -webkit-align-items: flex-end;
    align-items: flex-end;
    margin-left: 150px;
}

/*
#global-footer {
    display: none;
}
.footer-left {
	display:block !important;
}
.footer-right {
	display:block !important;
}
*/

/* Temp fix END */

/* Charles edit comment out
.flex-container{
	display:flex;
	flex-wrap:wrap;
	gap:20px
}
*/

.button1{
	border-radius:10px;
	background:#4d94ff; 
	color:#ffffff;
	padding:5px;
	width:230px;
	text-align:center;
	font-size:15px;
	cursor:pointer;
	width:230px;

}
.button2{
	border-radius:10px;
	background:#f16458; 
	color:#ffffff;
	padding:5px;
	width:230px;
	text-align:center;
	font-size:15px;
	cursor:pointer;
	width:230px;
}



/* Header stylying */
.red_online_button {
	padding:5px;
}
.mw-body-content h2 {
	font-weight:bold;
	line-height:1.3 !important;
	font-size:1.5rem !important;
}

.mw-body-content h3 {
	font-weight:bold;
	line-height:1.6 !important;
	font-size:1.4rem !important;
}

.mw-body-content h4 {
	font-weight:bold;
	line-height: 1.6 !important;
	font-size:1.3rem !important;
}

.mw-body-content h5 {
	font-weight:normal;
	line-height:1.6 !important;
	font-size:1.2rem !important;
}

.mw-body-content h6 {
	font-weight:normal;
	line-height:1.6 !important;
	font-size:1.1em !important;
	font-style:italic;
}

#mw-head .vector-menu-dropdown h3 {
	font-size: 0.875em;
	line-height: 1.125em;
}

#mw-head .vector-menu-dropdown .vector-menu-content-list {
	font-size: 1.6em;
}

#mw-head .vector-menu-dropdown .vector-menu-content-list {
    top: 38px;
}

/** Remove file upload links from edit menus (Source & VE) **/
.wikiEditor-ui-toolbar .section-main .group-insert .oo-ui-widget[rel="file"] {
  display: none !important;
}

.oo-ui-toolbar-popups .oo-ui-toolGroup-tools .oo-ui-tool-name-media {
  display: none !important;
}

/* Remove the regular search bar from the Main Page */
.page-Main_Page #mw-head #right-navigation #p-search {
	display: none !important;
}


/** Fix layout shift **/

.skiptranslate {
   margin-top: 0 !important;
}
#p-namespaces {
   display: flex;
   height: 42px;
}
#ca-watch a span,
#ca-unwatch a span {
   display: none;
}
#ca-watch,
#ca-unwatch {
   display: flex;
   width: 24px;
}
#p-namespaces .vector-menu-content-list li, 
#p-views .vector-menu-content-list li {
   font-size:.8rem !important;
}
#mw-head-base {
   height: unset !important;
}
.mw-body {
   margin-top: unset !important;
}
.vector-menu-tabs #ca-watch.icon a::before {
   margin-top: 6px;
}
.vector-menu-tabs-legacy li a {
   float: left;
   height: 100% !important;
   padding-top: 1.5em;
}
.vector-menu-tabs-legacy {
   height: 2.8em;
}
#right-navigation {
   margin-top: 2.5em;
}
#left-navigation {
   margin-top: 2.5em;
   margin-bottom: -2.5em;
}
#mw-page-base {
   height: 5.2rem;
}
#mw-head-base {
   margin-top: unset !important;
   height: unset !important;
}
#p-views .vector-menu-content {
  display: flex;
  align-items: end;
  height: 42px;
}
Retrieved from "https://integration-ru.familysearch.org/en/wiki/index.php?title=MediaWiki:Common.css&oldid=5768584"