FamilySearch Wiki

MediaWiki:Common.css: Difference between revisions

Message Talk

MediaWiki:Common.css (view source)

Revision as of 20:15, 27 July 2020

338 bytes removed ,  27 July 2020
m
Updated to latest common.css, with code for new landing page
m (took out that the buttons on the main page disappear when screen gets too small)
m (Updated to latest common.css, with code for new landing page)
Line 107: Line 107:


/*--------------------------main page coding-----------------*/
/*--------------------------main page coding-----------------*/
#countries_list {
/* ------------------new CSS -------------------*/
     overflow-y:scroll;
 
     height:540px;
/* ------------------containers / elements -------------------*/
     border:1px solid black;
#map {
     color:#aba8a0;
     position: relative;  
     width: 100%;  
     padding-top: 40px;
     margin-left: 0;
}
 
.sectionTitle {
text-align:center;
margin-bottom:5px;
font-size:1.2rem;
margin-top:-10px;
}
}
#countries_list ul li:hover {
 
    background-color:#ecebea;
.subTitle {
text-align:center;
font-size:1rem;  
}
}
.exit_menu {
 
    width:20px;
#statsline {
    height:20px;
text-align:center;  
    cursor:pointer;
margin-top:5px;
    display:flex;
margin-bottom:16px;
    align-items:center;
    justify-content:center;
    font-size:0.95vw;
    background-color:red;
}
}
.titleofmenu {
 
     display:flex;
.menuTitle {
     color:black;
     justify-content:space-between;
     justify-content:space-between;
     font-size:0.95vw;
     font-size:1rem;
     position:sticky;
     position:sticky;
     top:0;
     top:0;
     background-color:#D9D9D4;
     background-color:#D9D9D4;
    text-align:center;
}
}
#countries_list > ul {
 
    list-style-type: none;
.search-mobile {
    padding: 0;
  display:none !important;
    margin-left: 20px;
  }
.map-mobile {
  display:none;
  }
 
.searchboxContainer {
  display:flex;
  justify-content:center;
  align-items: center; /* removed from mobile */
  font-size:1rem;
  margin-top:10px; /* removed from mobile */
}
}
.overflow > ul {
 
    list-style-type: none;
.tips {
    padding: 0;
  text-align:right;  
    margin-left: 20px;
  font-size:1rem;
}
}
#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{
 
    position:absolute;
.buttonContainer {
    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 {
 
    position:absolute;
/* any element with id ending in '_button' */
    width:240px;
[id$="_button"] {
    display:none;
     background-color:#e1ebee96;
    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 {
    width:20px;
    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 {
     background-color:#e1ebee;
     position:absolute;
     position:absolute;
     border:1px solid black;
     border:1px solid black;
     text-align:center;
     text-align:center;
     font-size:0.95vw;
     font-size:1rem;
     padding:5px;
     padding:5px;
    ;
     cursor:pointer;
     cursor:pointer;
     border-radius:5px;
     border-radius:5px;
Line 187: Line 182:
     color:#004d99;
     color:#004d99;
}
}
/* @todo verify that this is used */
 
#all_countries_list{
[id$="_button"]:hover {
    background-color:white;
    color:blue;
}
 
#all_countries_button:hover {
    background-color:white;
    color:blue;
}
 
/* special extra rules for all_countries button */
#all_countries_button {
     background-color:#0f5ba9;
     background-color:#0f5ba9;
    position:absolute;
     font-size:1.2rem;
    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;
     color:white;
     width:220px;
     width:220px;
}
}


/* button placement */
#all_countries_button {top:25%; left:40%;}
#africa_button {top:65%; left:51%;}
#asia_button {top:45%; left:73%;}
#british_isles_button {top:42%; left:38%;}
#caribbean_button {top:60%; left:29%;}
#central_america_button {top:63%; left:17%;}
#europe_button {top:44%; left: 52%;}
#middle_east_button {top:56%; left:57%;}
#north_america_button {top:40%; left:22%;}
#pacific_button {top:82%; left:85%;}
#south_america_button {top:73%; left:27%;}


  #all_countries_countries {
/* Callout is the 'Guided Research' element */
  display: block!important;
.callout {
  }
position:absolute;
 
top:15%;
#guided_research{
left:80%;
     border:1px solid black;
     width:160px;
     text-align:center;
     text-align:center;
     font-size:0.95vw;
     font-size:1rem;
     cursor:pointer;
     cursor:pointer;
     border-radius:5px;
     border-radius:5px;
     box-shadow:2px 2px 2px #888888;
     box-shadow:5px 5px 2px #888888;
     color:#004d99;
     color:#004d99;
     width:150px;
     background-color:white;
    padding:5px;
    border:1px solid gray;
}
 
.calloutHeading {
color:orange;
font-size:1.3rem;
font-family:museo;
}
 
.guided_research_link {
  border:1px solid black;
  text-align:center;
  font-size:1rem;
  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 {
 
/* ------------------menus -------------------*/
#menu {
    position:absolute;
    top:125px;
    left:0;
    width:210px;
    height:500px;
    overflow-y:scroll;
    display:block;
    color:#aba8a0;
     background-color:white;
     background-color:white;
     color:blue;
    border:1px solid black;
    z-index: 10;
}
 
.exit {
     color: red;
    cursor: pointer;
    float: right;
}
 
.exit:hover {
    font-weight: bold;
}
 
/** This hack is to eliminate shifting due to :hover */
span.exit::before {
    display: block;
    content: "foo";
    font-weight: bold;
    height: 0;
    overflow: hidden;
    visibility: hidden;
}
}
.overflow {
 
     overflow-y:scroll;
#menu > ul {
     height:500px;
     list-style-type: none;
     z-index:10;
     padding: 0;
     margin-left: 20px;
}
}
.overflow ul li:hover {
 
#menu ul li:hover {
     background-color:#ecebea;
     background-color:#ecebea;
}
}
/* There are two separate classes, but we don't differentiate their styles */
.countrymenu, .statemenu {
padding:3px;
top:0;
background-color:#D9D9D4;
color:black
}
/* color menu spans to look like a link */
.fakelink {
color:#004d99;
}
.menulink {
    font-size: 1rem;
    cursor: pointer;
    margin-left:-1.2rem;
}
.menulink::before {
content: "> ";
}
.menulink:hover {
background-color: white;
}
/*--------------------------main page coding-----------------*/
/* make sure missing pages remain colored correctly after visiting */
/* make sure missing pages remain colored correctly after visiting */
a.new:visited, #p-personal a.new:visited {
a.new:visited, #p-personal a.new:visited {
Ahancey
2,664

edits

Retrieved from "https://integration-ru.familysearch.org/en/wiki/Special:MobileDiff/4048951"