FamilySearch Wiki

MediaWiki:Common.css: Difference between revisions

m (updated landing page code - copied from beta)
No edit summary
 
(260 intermediate revisions by 5 users not shown)
Line 1: Line 1:
/* The following readjusts the popup box that appears when hovering over links in GuidedResearch.  */
/* Hiding Powered by Google Translate */
.tooltip .tooltiptext {
/* Removing for now
     left: unset;
.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;
}


.button-style {
/*
  background-color: #7897BA;
#global-footer {
  border:4px outset #B3D2F5;
    display: none;
  border-radius:.5rem;
}
  color: white !important;
.footer-left {
  padding: .2rem 1.5rem;
display:block !important;
  text-align: center;
}
  text-decoration: none;
.footer-right {
  display: inline-block;
display:block !important;
  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;
}
}
*/


/* Temp fix END */


/* Set width of search box to 70%, so 'go' button stays inline. */
/* Charles edit comment out
#bodySearchInputHomePageSearchBox {
.flex-container{
    width: 70%;
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;


/* change the box around the code feature */
code {
    color: #000;
    background-color: #f9f9f9;
    border: 1px solid #ddd;
}
}
pre, code, tt, kbd, samp, .mw-code {
.button2{
    font-family: monospace,Courier;
border-radius:10px;
background:#f16458;
color:#ffffff;
padding:5px;
width:230px;
text-align:center;
font-size:15px;
cursor:pointer;
width:230px;
}
}


/* make sure missing pages remain colored correctly after visiting */
 
a.new:visited, #p-personal a.new:visited {
 
    color: #a55858 !important;
/* Header stylying */
.red_online_button {
padding:5px;
}
.mw-body-content h2 {
font-weight:bold;
line-height:1.3 !important;
font-size:1.5rem !important;
}
}


/* change border on input forms to be 1pm, instead of 2px, and grey instead of black */
.mw-body-content h3 {
form input {
font-weight:bold;
/*    border: 1px solid !important;*/
line-height:1.6 !important;
    border-color: darkgrey !important;
font-size:1.4rem !important;
}
}


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


/* Define spacing and # of columns based on screen size */
.mw-body-content h5 {
@media screen and (min-width: 1400px) {
font-weight:normal;
.column-spacing-fullscreen{
line-height:1.6 !important;
  column-count: 6;
font-size:1.2rem !important;
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,
.mw-body-content h6 {
/* this section assumes that only half the screen is available for
font-weight:normal;
/* the columns. Even though the screen size may be 1400px, the
line-height:1.6 !important;
/* available space for the columns is half that, or 700px. */
font-size:1.1em !important;
font-style:italic;
}


@media screen and (min-width: 1400px) {
#mw-head .vector-menu-dropdown h3 {
.column-spacing-halfscreen{
font-size: 0.875em;
  column-count: 3;
line-height: 1.125em;
}}
}
@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;}


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


/* landing page */
#mw-head .vector-menu-dropdown .vector-menu-content-list {
/* The rest is for production */
    top: 38px;
}


/*  
/** Remove file upload links from edit menus (Source & VE) **/
https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Selectors
.wikiEditor-ui-toolbar .section-main .group-insert .oo-ui-widget[rel="file"] {
this is slow
  display: none !important;
[id$=list2] span {
color:#004d99;
}
}
so I inserted class="fakelink" for child spans
 
*/
.oo-ui-toolbar-popups .oo-ui-toolGroup-tools .oo-ui-tool-name-media {
.fakelink {
  display: none !important;
color:#004d99;
}
}


/*--------------------------main page coding-----------------*/
/* Remove the regular search bar from the Main Page */
#countries_list {
.page-Main_Page #mw-head #right-navigation #p-search {
    overflow-y:scroll;
display: none !important;
    height:540px;
    border:1px solid black;
    color:#aba8a0;
}
}
#countries_list ul li:hover {
 
    background-color:#ecebea;
 
/** Fix layout shift **/
 
.skiptranslate {
  margin-top: 0 !important;
}
}
.exit_menu {
#p-namespaces {
    width:20px;
  display: flex;
    height:20px;
  height: 42px;
    cursor:pointer;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:0.95vw;
    background-color:red;
}
}
.titleofmenu {
#ca-watch a span,
    display:flex;
#ca-unwatch a span {
    justify-content:space-between;
  display: none;
    font-size:0.95vw;
    position:sticky;
    top:0;
    background-color:#D9D9D4;
}
}
#countries_list > ul {
#ca-watch,
    list-style-type: none;
#ca-unwatch {
    padding: 0;
  display: flex;
    margin-left: 20px;
  width: 24px;
}
}
.overflow > ul {
#p-namespaces .vector-menu-content-list li,
    list-style-type: none;
#p-views .vector-menu-content-list li {
    padding: 0;
  font-size:.8rem !important;
    margin-left: 20px;
}
}
#argentina_states, #australia_states, #austria_states, #belgium_states, #belgium_states, #bolivia_states, #brazil_states, #canada_states, #chile_states, #costa_rica_states, #denmark_states, #dominican_republic_states, #england_states, #finland_states, #france_states, #french_polynesia_states, #germany_states, #guatemala_states, #honduras_states, #hungary_states, #ireland_states, #isle_of_man_states, #italy_states, #liechtenstein_states, #luxembourg_states, #mexico_states, #montserrat_states, #netherlands_states, #netherlands_antilles_states, #nigeria_states, #northern_ireland_states, #norway_states, #panama_states, #paraguay_states, #peru_states, #philippines_states, #poland_states, #portugal_states, #puerto_rico_states, #saint_kitts_and_nevis_states, #scotland_states, #slovakia_states, #south_africa_states, #spain_states, #sweden_states, #switzerland_states, #united_states_states, #uruguay_states, #venezuela_states, #wales_states{
#mw-head-base {
    position:absolute;
  height: unset !important;
    width:240px;
    display:none;
    top:130px;
    left:0;
    background-color:white;
    height:540px;
    border:1px solid black;
}
}
#all_countries_countries, #africa_countries, #asia_countries, #british_isles_countries, #caribbean_countries, #central_america_countries, #europe_countries, #middle_east_countries, #north_america_countries, #pacific_countries, #south_america_countries {
.mw-body {
    position:absolute;
  margin-top: unset !important;
    width:240px;
    display:none;
    top:130px;
    background-color:white;
    height:540px;
    left:0;
    border:1px solid black;
}
}
#exit_menu_africa_countries, #exit_menu_asia_countries, #exit_menu_british_isles_countries, #exit_menu_caribbean_countries, #exit_menu_central_america_countries, #exit_menu_europe_countries, #exit_menu_middle_east_countries, #exit_menu_north_america_countries, #exit_menu_pacific_countries, #exit_menu_south_america_countries {
.vector-menu-tabs #ca-watch.icon a::before {
    width:20px;
  margin-top: 6px;
    height:20px;
    cursor:pointer;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:0.95vw;
    background-color:red;
}
}
#africa_list, #asia_list, #british_isles_list, #caribbean_list, #central_america_list, #europe_list, #middle_east_list, #north_america_list, #pacific_list, #south_america_list {
.vector-menu-tabs-legacy li a {
    background-color:#e1ebee;
  float: left;
    position:absolute;
  height: 100% !important;
    border:1px solid black;
  padding-top: 1.5em;
    text-align:center;
    font-size:0.95vw;
    padding:5px;
    ;
    cursor:pointer;
    border-radius:5px;
    box-shadow:2px 2px 2px #888888;
    color:#004d99;
}
/* @todo verify that this is used */
#all_countries_list{
    background-color:#0f5ba9;
    position:absolute;
    border:1px solid black;
    text-align:center;
    font-size:1.2vw;
    padding:5px;
    cursor:pointer;
    border-radius:5px;
    box-shadow:2px 2px 2px #888888;
    color:white;
    width:220px;
}
/* If screen size is < 1200px, do not display the buttons on the page.*/
@media screen and (max-width: 1199px) {
  #all_countries_list,
  #africa_list, #asia_list, #british_isles_list, #caribbean_list, #central_america_list, #europe_list, #middle_east_list, #north_america_list, #pacific_list, #south_america_list {
    display: none;
  }
  #all_countries_countries {
  display: block!important;
  }
}
}
#guided_research{
.vector-menu-tabs-legacy {
    border:1px solid black;
  height: 2.8em;
    text-align:center;
    font-size:0.95vw;
    cursor:pointer;
    border-radius:5px;
    box-shadow:2px 2px 2px #888888;
    color:#004d99;
    width:150px;
}
}
#all_countries_list:hover, #asia_list:hover, #british_isles_list:hover, #caribbean_list:hover, #central_america_list:hover, #europe_list:hover, #africa_list:hover, #middle_east_list:hover, #north_america_list:hover, #pacific_list:hover, #south_america_list:hover, #guided_research:hover {
#right-navigation {
    background-color:white;
  margin-top: 2.5em;
    color:blue;
}
}
.overflow {
#left-navigation {
    overflow-y:scroll;
  margin-top: 2.5em;
    height:500px;
  margin-bottom: -2.5em;
    z-index:10;
}
}
.overflow ul li:hover {
#mw-page-base {
    background-color:#ecebea;
  height: 5.2rem;
}
}
/* make sure missing pages remain colored correctly after visiting */
#mw-head-base {
a.new:visited, #p-personal a.new:visited {
  margin-top: unset !important;
    color: #a55858 !important;
  height: unset !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"