2,664
edits
m
code for main page added
(Change tooltip class in order to move the popup box to the middle of the 'hover word') |
m (code for main page added) |
||
| Line 100: | Line 100: | ||
}} | }} | ||
.column-spacing-halfscreen li, .column-spacing-fullscreen li {padding-right:5px;} | .column-spacing-halfscreen li, .column-spacing-fullscreen li {padding-right:5px;} | ||
/* landing page */ | |||
/* The rest is for production */ | |||
/* | |||
https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Selectors | |||
this is slow | |||
[id$=list2] span { | |||
color:#004d99; | |||
} | |||
so I inserted class="fakelink" for child spans | |||
*/ | |||
.fakelink { | |||
color:#004d99; | |||
} | |||
/*--------------------------main page coding-----------------*/ | |||
#countries_list { | |||
overflow-y:scroll; | |||
height:540px; | |||
border:1px solid black; | |||
color:#aba8a0; | |||
} | |||
#countries_list ul li:hover { | |||
background-color:#ecebea; | |||
} | |||
.exit_menu { | |||
width:20px; | |||
height:20px; | |||
cursor:pointer; | |||
display:flex; | |||
align-items:center; | |||
justify-content:center; | |||
font-size:0.95vw; | |||
background-color:red; | |||
} | |||
.titleofmenu { | |||
display:flex; | |||
justify-content:space-between; | |||
font-size:0.95vw; | |||
position:sticky; | |||
top:0; | |||
background-color:#D9D9D4; | |||
} | |||
#countries_list > ul { | |||
list-style-type: none; | |||
padding: 0; | |||
margin-left: 20px; | |||
} | |||
.overflow > ul { | |||
list-style-type: none; | |||
padding: 0; | |||
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{ | |||
position:absolute; | |||
width:240px; | |||
display:none; | |||
top:90px; | |||
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; | |||
width:240px; | |||
display:none; | |||
top:90px; | |||
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; | |||
border:1px solid black; | |||
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{ | |||
border:1px solid black; | |||
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 { | |||
background-color:white; | |||
color:blue; | |||
} | |||
.overflow { | |||
overflow-y:scroll; | |||
height:500px; | |||
z-index:10; | |||
} | |||
.overflow ul li:hover { | |||
background-color:#ecebea; | |||
} | |||
/* 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 */ | |||
form input { | |||
/* border: 1px solid !important; | |||
*/ | |||
border-color: darkgrey !important; | |||
} | |||