A website for producing interactive charts without writing a single line of code. Built with Common Lisp and Python.
https://charts.craigoates.net
You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
1087 lines
19 KiB
1087 lines
19 KiB
@charset "UTF-8"; |
|
|
|
/* FONTS STORED IN THE /CSS DIRECTORY. |
|
================================================================================ |
|
Fonts are stored in the /css directory. This is because of how Caveman controls |
|
the /static directory. It limits the routes from /static to /css, /images, /js, |
|
robot.txt and favicon.ico by default. Apparently to can change this in app.lisp |
|
but I couldn't work out how to get a /fonts directory to work. Because of this, |
|
I have reverted to putting the fonts directly in the /css so Caveman knows |
|
where/how to find them. |
|
*/ |
|
|
|
@font-face { |
|
font-family: "main"; |
|
src: url("avenir.otf") format("opentype"); |
|
} |
|
|
|
@font-face { |
|
font-family: "main-content"; |
|
src: url("avenir-book.ttf"); |
|
} |
|
|
|
@font-face { |
|
font-family: "code"; |
|
src: url("firacode-retina.ttf"); |
|
} |
|
|
|
/* COLOUR PALLET AND GENERALISED VALUES |
|
================================================================================ |
|
The values below are notes of commonly used values. I've put them here to make |
|
it easier to find/refer to them when this file gets to out of hand. |
|
|
|
Main: #0094ff |
|
Secondary: lightblue |
|
Warning: darkorange |
|
Warning Secondary: orangered |
|
Confirm/Add: lightseagreen |
|
Confirm/Add Sec: lightgreen |
|
Admin: darkviolet |
|
Admin Secondary: violet |
|
Error: salmon |
|
Danger: crimson |
|
*/ |
|
|
|
/* smartphones, iPhone, portrait 480x320 phones */ |
|
html { |
|
background: white; |
|
} |
|
|
|
body { |
|
font-family: 'main', sans-serif; |
|
} |
|
|
|
header { |
|
border-bottom: 2px solid black; |
|
display: flex; |
|
} |
|
|
|
nav form { |
|
display: inline-block; |
|
} |
|
|
|
nav { |
|
display: block; |
|
width: 100%; |
|
padding-top: 0px; |
|
height: 60px; |
|
display: flex; |
|
align-items: center; |
|
justify-content: space-between; |
|
font-size: 9px; |
|
} |
|
|
|
nav div { |
|
display: initial; |
|
} |
|
|
|
nav .nav-header { |
|
display: inline-flex; |
|
align-items: center; |
|
margin-left: 4px; |
|
font-size: 1.5em; |
|
} |
|
|
|
nav .nav-header img { |
|
display: initial; |
|
height: 45px; |
|
margin: 0px 4px 0px 0px; |
|
} |
|
|
|
nav .nav-header span { |
|
font-size: 1.5em; |
|
} |
|
|
|
nav a { |
|
margin: 0px 3px; |
|
} |
|
|
|
main { |
|
margin: 0px; |
|
padding: 0px; |
|
} |
|
|
|
article { |
|
max-width: 800px; |
|
} |
|
|
|
code { |
|
white-space: pre; |
|
margin: auto; |
|
max-width: 300px; |
|
width: 100%; |
|
display: block; |
|
white-space: pre; |
|
-webkit-overflow-scrolling: touch; |
|
overflow-x: scroll; |
|
padding: 12px; |
|
font-family: 'code', monospace; |
|
font-weight: bold; |
|
} |
|
|
|
a:link { |
|
color: #0094ff; |
|
} |
|
|
|
a:visited { |
|
color: purple; |
|
} |
|
|
|
a:hover { |
|
background: lightblue; |
|
color: #0094ff; |
|
text-decoration-thickness:4px; |
|
border-radius: 4px; |
|
} |
|
|
|
table { |
|
width: 100%; |
|
border-spacing: 0; |
|
} |
|
|
|
th { |
|
text-align: left; |
|
border-bottom: 2px solid black; |
|
padding: 12px; |
|
margin: 0px; |
|
} |
|
|
|
td { |
|
text-align: left; |
|
padding-left: 4px; |
|
} |
|
|
|
td img { |
|
margin: 0px 10px 0px 10px; |
|
} |
|
|
|
tbody td { |
|
border-bottom: 1px solid silver; |
|
padding: 4px; |
|
} |
|
|
|
tbody tr:last-child td { |
|
border-bottom: 2px solid black; |
|
} |
|
|
|
tbody tr:hover { |
|
background-color: silver; |
|
} |
|
|
|
legend { |
|
text-transform: uppercase; |
|
} |
|
|
|
.ui-form-add fieldset { |
|
border: 2px solid lightseagreen; |
|
} |
|
|
|
.ui-form-edit fieldset { |
|
border: 2px solid darkorange; |
|
} |
|
|
|
footer { |
|
border-top: 2px solid black; |
|
} |
|
|
|
footer p { |
|
margin-top: 20px; |
|
font-size: 9px; |
|
} |
|
|
|
input[type=button], input[type=submit], input[type=reset] { |
|
font-family: 'main', sans-serif; |
|
color: white; |
|
background-color: transparent; |
|
border-radius: 4px; |
|
padding: 10px; |
|
cursor: pointer; |
|
text-transform: uppercase; |
|
border: none; |
|
font-size: 9px; |
|
} |
|
|
|
.ui-h2 { |
|
padding: 60px 0px 0px 0px; |
|
border-top: 2px solid black; |
|
} |
|
|
|
.ui-message-success { |
|
font-size: 1.5em; |
|
color: black; |
|
padding: 6px; |
|
border-radius: 4px; |
|
background-size: 400% 100%; |
|
background-image: linear-gradient(270deg, lightgreen, white); |
|
animation: alert-message-animation 20s infinite linear; |
|
} |
|
|
|
.ui-message-warning { |
|
font-size: 1.5em; |
|
color: black; |
|
padding: 6px; |
|
border-radius: 4px; |
|
background-size: 400% 100%; |
|
background-image: linear-gradient(270deg, darkorange, white); |
|
animation: alert-message-animation 20s infinite linear; |
|
} |
|
|
|
.ui-message-error { |
|
font-size: 1.5em; |
|
color: black; |
|
padding: 6px; |
|
border-radius: 4px; |
|
background-size: 400% 100%; |
|
background-image: linear-gradient(270deg, salmon, white); |
|
animation: alert-message-animation 20s infinite linear; |
|
} |
|
|
|
.ui-message-danger { |
|
font-size: 1.5em; |
|
color: black; |
|
padding: 6px; |
|
border-radius: 4px; |
|
background-size: 400% 100%; |
|
background-image: linear-gradient(270deg, crimson, white); |
|
animation: alert-message-animation 20s infinite linear; |
|
} |
|
|
|
.ui-link:link { |
|
box-shadow: 2px 2px 1px black; |
|
background: #0094ff; |
|
color: white; |
|
padding: 10px; |
|
border-radius: 4px; |
|
text-transform: uppercase; |
|
text-decoration: none; |
|
} |
|
|
|
.pagination { |
|
font-size: 1em; |
|
} |
|
|
|
.ui-link:visited { |
|
color: white; |
|
} |
|
|
|
.ui-link:hover { |
|
box-shadow: none; |
|
background: lightblue; |
|
color: #0094ff; |
|
text-decoration: none; |
|
} |
|
|
|
.ui-link-add { |
|
background: lightseagreen; |
|
color: white; |
|
box-shadow: 2px 2px 1px black; |
|
padding: 10px; |
|
border-radius: 4px; |
|
text-transform: uppercase; |
|
text-decoration: none; |
|
} |
|
|
|
.ui-link-add:link { |
|
color: white; |
|
} |
|
|
|
.ui-link-add:visited { |
|
color: white; |
|
} |
|
|
|
.ui-link-add:hover { |
|
background: lightgreen; |
|
color: lightseagreen; |
|
box-shadow: none; |
|
text-decoration: none; |
|
} |
|
|
|
.ui-link-admin, |
|
.ui-button-admin[type=submit] { |
|
background: darkviolet; |
|
color: white; |
|
box-shadow: 2px 2px 1px black; |
|
padding: 10px; |
|
border-radius: 4px; |
|
text-transform: uppercase; |
|
text-decoration: none; |
|
} |
|
|
|
.ui-link-admin:link { |
|
color: white; |
|
} |
|
|
|
.ui-link-admin:visited { |
|
color: white; |
|
} |
|
|
|
.ui-link-admin:hover, |
|
.ui-button-admin[type=submit]:hover{ |
|
background: violet; |
|
box-shadow: none; |
|
color: white; |
|
text-decoration: none; |
|
} |
|
|
|
.ui-link-edit:link { |
|
background: darkorange; |
|
color: white; |
|
box-shadow: 2px 2px 1px black; |
|
padding: 10px; |
|
border-radius: 4px; |
|
text-transform: uppercase; |
|
text-decoration: none; |
|
} |
|
|
|
.ui-link-edit:visited { |
|
color: white; |
|
} |
|
|
|
.ui-link-edit:hover { |
|
background: orangered; |
|
border-top: none; |
|
text-decoration: none; |
|
} |
|
|
|
.ui-button-add[type=submit] { |
|
background: lightseagreen; |
|
box-shadow: 2px 2px 1px black; |
|
color: white; |
|
} |
|
|
|
.ui-button-add[type=submit]:visited { |
|
color:white; |
|
} |
|
|
|
.ui-button-add[type=submit]:hover { |
|
background: lightgreen; |
|
color: white; |
|
box-shadow: none; |
|
} |
|
|
|
.ui-button-edit[type=submit] { |
|
background: darkorange; |
|
box-shadow: 2px 2px 1px black; |
|
} |
|
|
|
.ui-button-edit[type=submit]:visited { |
|
color:white; |
|
} |
|
|
|
.ui-button-edit[type=submit]:hover { |
|
background: orangered; |
|
color: white; |
|
box-shadow: none; |
|
} |
|
|
|
.ui-button-danger[type=submit] { |
|
background: crimson; |
|
box-shadow: 2px 2px 1px black; |
|
} |
|
|
|
.ui-button-danger[type=submit]:visited { |
|
color:white; |
|
} |
|
|
|
.ui-button-danger[type=submit]:hover { |
|
background: salmon; |
|
color: crimson; |
|
box-shadow: none; |
|
} |
|
|
|
.ui-form, |
|
.ui-form-wrap { |
|
padding: 60px 0 0 0; |
|
margin: 60px 0 40px 0; |
|
display: flex; |
|
border-top: 2px solid black; |
|
} |
|
|
|
.ui-form { |
|
justify-content: center; |
|
} |
|
|
|
.ui-form-wrap { |
|
justify-content: center; |
|
flex-direction: column; |
|
} |
|
|
|
.ui-form h1, |
|
.ui-form-wrap h1 { |
|
|
|
padding-bottom: 60px; |
|
} |
|
|
|
.ui-form form, |
|
.ui-form-wrap form { |
|
max-width: 800px; |
|
width: 100%; |
|
margin: 0px; |
|
} |
|
|
|
.ui-form form fieldset, |
|
.ui-form-wrap form fieldset { |
|
border-radius: 4px; |
|
margin-bottom: 12px; |
|
} |
|
|
|
.ui-form label, |
|
.ui-form-wrap label { |
|
display: block; |
|
text-transform: uppercase; |
|
} |
|
|
|
.ui-form label em { |
|
text-transform: none; |
|
} |
|
|
|
.ui-form legend, |
|
.ui-form-wrap legend{ |
|
margin-bottom: 20px; |
|
font-size: 1.5em; |
|
} |
|
|
|
.ui-form form input[type=text], |
|
.ui-form form input[type=file], |
|
.ui-form form input[type=date], |
|
.ui-form form input[type=number], |
|
.ui-form form input[type=password], |
|
.ui-form form select, |
|
.ui-form-wrap form input[type=text], |
|
.ui-form-wrap form input[type=file], |
|
.ui-form-wrap form input[type=date], |
|
.ui-form-wrap form input[type=number], |
|
.ui-form-admin input[type=password], |
|
.ui-form-wrap form select { |
|
width: 98%; |
|
margin: 0px 0px 40px 0px; |
|
} |
|
|
|
.ui-form-add input[type=text], |
|
.ui-form-add input[type=date], |
|
.ui-form-add input[type=number], |
|
.ui-form-add input[type=password], |
|
.ui-form-add select { |
|
height: 40px; |
|
font-size: 16px; |
|
padding: 0px 0px 0px 4px; |
|
display: block; |
|
border-radius: 4px; |
|
border: 2px solid lightseagreen; |
|
} |
|
|
|
.ui-form-add input[type=file] { |
|
padding: 0px; |
|
border-bottom: 2px solid lightseagreen; |
|
} |
|
|
|
.ui-form-admin input[type=text], |
|
.ui-form-admin input[type=date], |
|
.ui-form-admin input[type=number], |
|
.ui-form-admin input[type=password], |
|
.ui-form-admin select { |
|
height: 40px; |
|
font-size: 16px; |
|
padmining: 0px 0px 0px 4px; |
|
display: block; |
|
border-radius: 4px; |
|
border: 2px solid darkviolet; |
|
} |
|
|
|
.ui-muted-text, |
|
td .ui-muted-text { |
|
color: silver; |
|
} |
|
|
|
.ui-form-checkbox-fieldset div { |
|
display: flex; |
|
align-items: center; |
|
} |
|
|
|
.ui-form-checkbox-fieldset label { |
|
display: inline; |
|
margin-left: 12px; |
|
text-transform: none; |
|
} |
|
|
|
.ui-form-checkbox-fieldset input[type=checkbox], |
|
.ui-form-add input[type=checkbox] { |
|
width: 40px; |
|
height: 40px; |
|
} |
|
|
|
|
|
.ui-form-edit input[type=text], |
|
.ui-form-edit input[type=date], |
|
.ui-form-edit input[type=number], |
|
.ui-form-edit input[type=password], |
|
.ui-form-edit select { |
|
height: 40px; |
|
font-size: 1em; |
|
padding: 0px 0px 0px 4px; |
|
display: block; |
|
border-radius: 4px; |
|
border: 2px solid darkorange; |
|
} |
|
|
|
.ui-form-edit input[type=file] { |
|
padding: 0px; |
|
border-bottom: 2px solid darkorange; |
|
} |
|
|
|
.ui-form-edit img, |
|
.ui-form-edit video { |
|
max-height: 200px; |
|
} |
|
|
|
.ui-form-edit video { |
|
max-width: 300px; |
|
} |
|
|
|
.ui-form-edit fieldset { |
|
display: block; |
|
} |
|
|
|
nav div { |
|
display: flex; |
|
justify-content: space-around; |
|
align-items: center; |
|
} |
|
|
|
nav div form { |
|
color: silver; |
|
font-size: 10px; |
|
text-align: right; |
|
padding: 0px; |
|
margin: 0px 4px 0px 0px; |
|
float:right; |
|
} |
|
|
|
nav div form input[type=submit] { |
|
border: 2px solid darkorange; |
|
color: black; |
|
box-shadow: 2px 2px 1px black; |
|
display: inline-block; |
|
background-color: white; |
|
} |
|
|
|
nav div form input[type=submit]:hover { |
|
background: darkorange; |
|
color: white; |
|
box-shadow: none; |
|
} |
|
|
|
.flex-center { |
|
display: flex; |
|
justify-content: center; |
|
} |
|
|
|
.flex-column { |
|
display: flex; |
|
flex-direction: column; |
|
} |
|
|
|
.flex-end { |
|
display: flex; |
|
justify-content: end; |
|
align-items: center; |
|
} |
|
|
|
.logged-in-info { |
|
padding: 0px; |
|
margin: 0px; |
|
text-align: end; |
|
} |
|
|
|
.logged-in-info span { |
|
color: silver; |
|
} |
|
|
|
.logged-in-options { |
|
padding: 20px 0px 20px 0px; |
|
} |
|
|
|
.ui-mobile-menu { |
|
text-transform: uppercase; |
|
width: 100%; |
|
display: flex; |
|
justify-content: space-between; |
|
padding-bottom: 10px; |
|
} |
|
|
|
.ui-mobile-menu div { |
|
display: flex; |
|
align-items: center; |
|
font-size: 1.5em; |
|
text-transform: initial; |
|
} |
|
|
|
.ui-mobile-menu img { |
|
height: 40px; |
|
margin-right: 4px; |
|
} |
|
|
|
.ui-card, |
|
.ui-card-other { |
|
box-shadow: 3px 3px 3px black; |
|
width: 350px; |
|
max-height: 100px; |
|
margin: 12px; |
|
border: 2px #0094ff solid; |
|
border-radius: 4px; |
|
overflow: hidden; |
|
} |
|
|
|
.ui-card-other { |
|
width: 100%; |
|
margin: 12px 0px 12px 0px; |
|
} |
|
|
|
.ui-link-card:link, |
|
.ui-link-card-other:link { |
|
text-decoration: none; |
|
} |
|
|
|
.ui-link-card:link div, |
|
.ui-link-card-other:link div { |
|
background: #0094ff; |
|
color: white; |
|
display: flex; |
|
justify-content: flex-start; |
|
} |
|
|
|
.ui-link-card:visited div, |
|
.ui-link-card:hover, |
|
.ui-link-card-other:visited div, |
|
.ui-link-card-other:hover { |
|
text-decoration: none; |
|
box-shadow: none; |
|
} |
|
|
|
.ui-card:hover, |
|
.ui-card-other:hover { |
|
border: 2px solid lightblue; |
|
box-shadow: none; |
|
} |
|
|
|
.ui-link-card:hover div, |
|
.ui-link-card-other:hover div { |
|
background: lightblue; |
|
color: #0094ff; |
|
box-shadow: none; |
|
} |
|
|
|
.ui-link-card:visited, |
|
.ui-link-card-other:visited { |
|
color: white; |
|
} |
|
|
|
.ui-link-card:link img, |
|
.ui-link-card-other:link img { |
|
width: 100px; |
|
display: inline-block; |
|
} |
|
|
|
.ui-card-text, |
|
.ui-card-text-other { |
|
display: flex; |
|
flex-direction: column; |
|
padding: 6px; |
|
} |
|
|
|
.ui-card-title, |
|
.ui-card-secondary { |
|
display: block; |
|
} |
|
|
|
.ui-card-title { |
|
margin-bottom: 6px; |
|
display: -webkit-box; |
|
-webkit-box-orient: vertical; |
|
-webkit-line-clamp: 2; |
|
overflow: hidden; |
|
} |
|
|
|
.ui-card-secondary, |
|
.ui-card-keywords { |
|
font-size: 9px; |
|
display: inline-block; |
|
overflow-wrap: break-word; |
|
} |
|
|
|
.ui-card-audio, |
|
.ui-card-audio audio { |
|
width: 100%; |
|
} |
|
|
|
.ui-file-edit-table { |
|
margin-bottom: 120px; |
|
} |
|
|
|
.ui-file-edit-table th:nth-child(2), |
|
.ui-file-edit-table tr td:nth-child(2) { |
|
display: none; |
|
} |
|
|
|
.ui-file-edit-table .ui-form-edit { |
|
display: flex; |
|
align-items: center; |
|
justify-content: space-between; |
|
flex-direction: row; |
|
} |
|
|
|
.ui-file-edit-table .ui-form-edit input[type=text] { |
|
margin-right: 4px; |
|
width: 100%; |
|
} |
|
|
|
.ui-table-column-small { |
|
width: 50px; |
|
} |
|
|
|
.ui-table-column-small img { |
|
max-width: 50px; |
|
max-height: 50px; |
|
} |
|
|
|
.mobile-nav { |
|
display: flex; |
|
flex-direction: column; |
|
align-items: stretch; |
|
text-align: center; |
|
margin: 0px 0px 40px 0px; |
|
padding-top: 40px; |
|
} |
|
|
|
.mobile-nav .ui-link { |
|
margin: 4px 0px 4px 0px; |
|
} |
|
|
|
.dashboard section { |
|
margin: 0px 0px 0px 0px; |
|
padding-bottom: 6em; |
|
} |
|
|
|
/* This should be the Account Settings. Try to keep the links/buttons away from |
|
other GUI elements to avoid clumsy button clicks.*/ |
|
.dashboard section:last-child { |
|
margin-bottom: 50px; |
|
} |
|
|
|
.dashboard section, |
|
.dashboard section input[type=submit]{ |
|
font-size: 9px; |
|
} |
|
|
|
.dashboard section div { |
|
display: flex; |
|
justify-content: space-between; |
|
align-items: center; |
|
margin: 10px 0; |
|
} |
|
|
|
.dashboard section div a { |
|
margin: 0px 4px 0px 0px; |
|
} |
|
|
|
.dashboard-header { |
|
border-bottom: 2px solid black; |
|
/* padding-bottom: 120px; */ |
|
} |
|
|
|
.dashboard h1, |
|
.dashboard h2 { |
|
text-align: left; |
|
} |
|
|
|
.dashboard h1 { |
|
font-size: 4em; |
|
margin-bottom: 0px; |
|
padding-top: 20px; |
|
} |
|
|
|
.dashboard h2 { |
|
font-size: 2em; |
|
margin: 0px 0px 8px 0px; |
|
color: silver; |
|
} |
|
|
|
.dashboard h3 { |
|
font-size: 2.2em; |
|
margin: 0; |
|
padding-right: 1em; |
|
} |
|
|
|
.dashboard-header ul { |
|
list-style: none; |
|
padding: 0px; |
|
margin: 0px; |
|
} |
|
|
|
.dashboard h1 span, |
|
.dashboard h3 span{ |
|
color: steelblue; |
|
} |
|
|
|
.dashboard img { |
|
width: 40px; |
|
} |
|
|
|
.storage-dashboard-table { |
|
border-top: 2px solid black; |
|
} |
|
|
|
.storage-dashboard-table thead tr th:nth-child(1) { |
|
width: 60px; |
|
} |
|
|
|
.storage-dashboard-table thead tr th:nth-child(3) { |
|
width: 100px; |
|
text-align: center; |
|
} |
|
|
|
.storage-dashboard-table tbody tr td:nth-child(3) { |
|
min-height: 45px; |
|
width: auto; |
|
} |
|
|
|
.storage-dashboard-table tbody tr td:nth-child(3) form { |
|
margin-left: 12px; |
|
} |
|
|
|
.storage-dashboard-table form { |
|
display: inline; |
|
} |
|
|
|
.storage-dashboard-table th { |
|
font-size: 15px; |
|
} |
|
|
|
|
|
|
|
.content-header, |
|
.content-image-header { |
|
border-bottom: 2px solid black; |
|
padding: 30px 0px 40px 0px; |
|
} |
|
|
|
.content-image-header { |
|
display: flex; |
|
align-items: center; |
|
} |
|
|
|
.content-image-header img { |
|
display: inline-block; |
|
width: 75px; |
|
border-radius: 36px; |
|
} |
|
|
|
.content-image-header div { |
|
display: flex; |
|
flex-direction: column; |
|
margin: 0px 0px 0px 12px; |
|
} |
|
|
|
.content-header h1, |
|
.content-image-header h1 { |
|
margin-bottom: 4px; |
|
} |
|
|
|
.content-header p, |
|
.content-image-header p { |
|
color: silver; |
|
margin: 0; |
|
padding: 0; |
|
font-size: 12px; |
|
} |
|
|
|
.article-stage article, |
|
.content-stage .sketchbook-content { |
|
margin-bottom: 60px; |
|
padding-top: 10px; |
|
} |
|
|
|
.article-stage figure { |
|
display: table; |
|
text-align: center; |
|
width: 100%; |
|
padding: 0px; |
|
margin: 0px; |
|
font-style: italic; |
|
} |
|
|
|
.article-stage figure img, |
|
.article-stage figure video{ |
|
width: 100%; |
|
max-width: 600px; |
|
} |
|
|
|
.article-stage div h2 { |
|
border-bottom: 2px solid black; |
|
padding: 60px 0px 60px 0px; |
|
margin: 0; |
|
} |
|
|
|
.article-stage div { |
|
/* border-top: 2px solid black; */ |
|
} |
|
|
|
.article-stage article { |
|
font-family: "main", sans-serif; |
|
} |
|
|
|
.article-stage div p { |
|
width: 100%; |
|
} |
|
|
|
.content-options { |
|
margin-top: 20px; |
|
} |
|
|
|
.article-stage div a:link { |
|
margin: 12px 0px 12px 0px; |
|
display: block; |
|
text-transform: initial; |
|
} |
|
|
|
.article-stage div .ui-link .ui-link-secondary { |
|
padding: 0; |
|
margin: 0; |
|
font-size:10px; |
|
} |
|
|
|
.article-stage div .ui-link h2 { |
|
margin: 0; |
|
padding: 0; |
|
border: none; |
|
} |
|
|
|
.content-stage { |
|
display: flex; |
|
justify-content: center; |
|
flex-direction: row; |
|
flex-wrap: wrap; |
|
margin-top: 40px; |
|
width: 100%; |
|
} |
|
|
|
.content-other-stage { |
|
width: 100%; |
|
} |
|
|
|
.content-other-stage h2 { |
|
padding: 70px 0px 70px 0px; |
|
border-bottom: 2px solid black; |
|
border-top: 2px solid black; |
|
} |
|
|
|
.index-dashboard { |
|
width: 100%; |
|
display: flex; |
|
justify-content: flex-start; |
|
flex-wrap: wrap; |
|
padding: 0px; |
|
margin: 0px; |
|
} |
|
|
|
.index-header { |
|
border-bottom: 2px solid black; |
|
padding: 40px 0px 60px 0px; |
|
} |
|
|
|
.ui-muted-text, |
|
td .ui-muted-text { |
|
color: silver; |
|
} |
|
|
|
.console-output { |
|
white-space: pre-wrap; |
|
color: salmon; |
|
} |
|
|
|
.pagination { |
|
display: block; |
|
margin-bottom: 20px; |
|
} |
|
|
|
.pagination-list { |
|
display: flex; |
|
flex-direction: column; |
|
} |
|
|
|
.pagination-list div { |
|
display: flex; |
|
justify-content: center; |
|
align-items: center; |
|
margin: 10px 0px 10px 0px; |
|
} |
|
|
|
.pagination-list div a { |
|
margin: 4px; |
|
} |
|
|
|
.ui-disabled { |
|
color: silver; |
|
text-align: center; |
|
padding: 8px 10px; |
|
margin: 4px; |
|
border: 2px solid silver; |
|
border-radius: 4px; |
|
text-transform: uppercase; |
|
} |
|
|
|
.pagination-list div div:nth-child(2){ |
|
display: none; |
|
} |
|
|
|
.ui-is-current, |
|
.ui-is-current:hover { |
|
background: silver; |
|
box-shadow: none !important; |
|
color: white; |
|
} |
|
|
|
@keyframes alert-message-animation { |
|
0% { background-position: 400% 0%} |
|
100% { background-position: 0% 0} |
|
} |
|
|
|
/* portrait e-readers (Nook/Kindle), smaller tablets @ 600 or @ 640 wide.*/ |
|
@media (min-width:481px) { |
|
} |
|
|
|
/* portrait tablets, portrait iPad, landscape e-readers, landscape 800x480 or |
|
854x480 phones */ |
|
@media (min-width:641px) { |
|
} |
|
|
|
/* tablet, landscape iPad, lo-res laptops ands desktops */ |
|
@media (min-width:961px) { |
|
|
|
} |
|
|
|
/* big landscape tablets, laptops, and desktops */ |
|
@media (min-width:1025px) { |
|
|
|
} |
|
|
|
/* hi-res laptops and desktops */ |
|
@media (min-width:1281px) { |
|
|
|
nav a, |
|
nav .nav-header { |
|
font-size: 1em; |
|
} |
|
|
|
nav, |
|
nav input[type=submit], |
|
footer p, |
|
.dashboard section, |
|
.dashboard section input[type=submit] { |
|
font-size: 1em; |
|
} |
|
} |
|
@media (min-width:2100px) { |
|
|
|
|
|
}
|
|
|