ojuso-map/assets/css/ojuso.css
Anna Sidwell acfbb513de Add points of interest
Do a bunch of refactoring in the process.  Current display on homepage
is a little shonky but that can be improved when there is something
using it.
2018-10-13 01:44:03 -04:00

200 lines
5.0 KiB
CSS

/* Make sure that the footer doesn't have space after it */
.container { min-height: 60vh; }
/* Get the header working OK */
.navbar-brand { padding: 5px 15px; }
.navbar-brand > img { height: 40px; }
.navbar-collapse {
z-index: 9999;
position: relative;
}
.dropdown-menu > li > a.no-hover:hover, .dropdown-menu > li > a.no-hover:focus {
background: red;
}
/*
* UTILITY CLASSES
*/
/* Colours */
.ojuso-red { color: #ea4639; }
.ojuso-green { color: #4ac95d; }
.ojuso-yellow { color: #f9db3c; }
.ojuso-blue { color: #008ad5; }
/*
* LAYOUT
*/
/* Narrow content area wrapper */
.content--narrow {
max-width: 50em;
margin: auto;
margin-top: 2em;
}
/* Subheading, designed to sit on a paragraph after h1 */
.subheading {
font-size: 120%;
margin-bottom: 2em;
}
/* Page footer */
.footer {
background-color: #444;
color: #ddd;
padding-top: 1em;
margin-top: 5em;
}
.footer-list {
list-style-type: none;
text-align: right;
margin-left: 0;
padding-left: 0;
}
.footer-list-item {
color: #ddd;
text-decoration: underline;
}
.footer-list-item:hover {
color: #bbb;
}
.footer-list-item--spacer {
margin-top: 1em;
}
/*
* FORMS
*/
/* Map widget - Minimum zoom help text */
.minzoomhelptext {
font-size: 14px;
background-color: rgba(255, 255, 255, 80%);
padding: 2px 10px;
border: 1px solid #ccc;
font-weight: bold;
}
/* Case study draft functionality */
.savebutton {
position: fixed;
bottom: 0;
padding: 8px 15px;
z-index: 9999;
background-color: hsla(111, 25%, 84%, 1);
border-top-right-radius: 5px;
border-top-left-radius: 5px;
}
.savebutton--icon { margin-left: 15px; margin-right: 2px; }
.savebutton--icon-failed { color: #d9534f; }
.savebutton--details { font-style: italic; }
.draftprompt { display: none; }
.draftprompt--delete { margin-left: 10px; }
.draftprompt--details { margin-left: 10px; font-weight: bold; }
/* File upload widget styles */
.filewidget--input { position: absolute; left: -1000px; }
.filewidget--list {
list-style-type: none;
padding-left: 0;
margin-left: 0;
margin-top: 12px;
}
.filewidget--file {
border: 1px solid #aaa;
display: inline-block;
padding: 4px 8px;
width: 34em;
background-color: #eee;
border-radius: 4px;
cursor: default;
}
.filewidget--file--icon {
margin-right: 8px;
}
.filewidget--file--actions {
float: right;
}
.filewidget--file--actions a {
color: black;
cursor: pointer;
}
.filewidget--file--actions a:hover {
color: red;
}
/*
* HOME PAGE
*/
/* This is the popup that you see when you first arrive on the site */
.hello {
position: fixed;
height: 100%;
width: 100%;
top: 0;
left: 0;
overflow: auto;
z-index: 1000;
background-color: rgba(0, 0, 0, 0.5);
background-image: url('data:image/svg+xml;charset=utf-8;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZlcnNpb249IjEiIHZpZXdCb3g9IjEwMCA1IDIwMCAyNTUiPg0KICA8cGF0aCBkPSJNMjM4IDEyN2g1M2wtMjYtMTUtMjcgMTUiIGZpbGw9InJnYmEoMjUyLCAyMTEsIDI5LCAwLjUpIi8+DQogIDxwYXRoIGQ9Ik0yOTQgMTIybC0yOS01MS0yOSA1MSAyOS0xNyAyOSAxNyIgZmlsbD0icmdiYSgxMDIsIDE5OCwgODcsIDAuNSkiLz4NCiAgPHBhdGggZD0iTTIyOCAxMjRsMzItNTZoLTY0bDMyIDU2IiBmaWxsPSJyZ2JhKDIyMSwgNjgsIDU4LCAwLjUpIi8+DQogIDxwYXRoIGQ9Ik0xODYgNjNMMTUzIDdsLTMyIDU2aDY1bTExMSAxOTNsLTMyLTU2LTMyIDU2aDY0IiBmaWxsPSJyZ2JhKDEwMiwgMTk4LCA4NywgMC41KSIvPg0KICA8cGF0aCBkPSJNMjIzIDEyN2wtMzItNTYtMzMgNTZoNjUiIGZpbGw9InJnYmEoMjUyLCAyMTEsIDI5LCAwLjUpIi8+DQogIDxwYXRoIGQ9Ik0yNjAgMTkxbC0zMi01Ni0zMiA1Nmg2NCIgZmlsbD0icmdiYSgyMjEsIDY4LCA1OCwgMC41KSIvPg0KICA8cGF0aCBkPSJNMTUzIDEyNGwzMy01NmgtNjVsMzIgNTYiIGZpbGw9InJnYmEoMzcsIDE0MCwgMjEyLCAwLjUpIi8+DQogIDxwYXRoIGQ9Ik0yMjggMjUzbDMyLTU2aC02NGwzMiA1NiIgZmlsbD0icmdiYSgyNTIsIDIxMSwgMjksIDAuNSkiLz4NCiAgDQogIA0KICA8cGF0aCBkPSJNMTg2IDE5MWwtMzMtNTUtMzIgNTVoNjUiIGZpbGw9InJnYmEoMzcsIDE0MCwgMjEyLCAwLjUpIi8+DQogIA0KICANCiAgPHBhdGggZD0iTTExOSAxODRsMjctNDYtMjcgMTV2MzEiIGZpbGw9InJnYmEoMTAyLCAxOTgsIDg3LCAwLjUpIi8+DQogIDxwYXRoIGQ9Ik0xOTMgMTg0bDI3LTQ2LTI3IDE1djMxIiBmaWxsPSJyZ2JhKDM3LCAxNDAsIDIxMiwgMC41KSIvPg0KICA8cGF0aCBkPSJNMjE3IDEzM2gtNTlsMzAgNTF2LTM0bDI5LTE3IiBmaWxsPSJyZ2JhKDEwMiwgMTk4LCA4NywgMC41KSIvPg0KICA8cGF0aCBkPSJNMTg4IDIwNWwtMjcgNDYgMjctMTZ2LTMwIiBmaWxsPSJyZ2JhKDM3LCAxNDAsIDIxMiwgMC41KSIvPg0KICA8cGF0aCBkPSJNMTY0IDI1Nmg1OWwtMzAtNTF2MzRsLTI5IDE3IiBmaWxsPSJyZ2JhKDIyMSwgNjgsIDU4LCAwLjUpIi8+DQogIDxwYXRoIGQ9Ik0yMjUgMTJsLTI2IDQ2IDI2LTE2VjEyIiBmaWxsPSJyZ2JhKDI1MiwgMjExLCAyOSwgMC41KSIvPg0KICA8cGF0aCBkPSJNMjAxIDYzaDU5bC0yOS01MXYzNGwtMzAgMTciIGZpbGw9InJnYmEoMzcsIDE0MCwgMjEyLCAwLjUpIi8+DQo8L3N2Zz4=');
background-position: center;
background-blend-mode: luminosity;
}
.hello--container {
max-width: 40em;
margin: 0 auto;
}
.hello--text {
background-color: white;
margin-top: 5em;
margin-left: 1em;
margin-right: 1em;
margin-bottom: 1em;
padding: 1em;
z-index: 1100;
}
/* Top margin on small screns should be same as the rest */
@media (max-width: 768px) {
.hello--text {
margin-top: 1em;
}
}
.hello--logo {
width: 200px;
margin-bottom: 16px;
}
.hello--logo, .hello--hide {
display: block;
margin-left: auto;
margin-right: auto;
}