Files
Saxonite/SaxoniteCoreWebOnline/wwwroot/css/sax-main.css
T
2021-05-11 19:38:43 +01:00

346 lines
4.8 KiB
CSS

/*
Main stylesheet.
*/
/* Global variables */
:root
{
/*
#556B2F Dark Olive Green
Ref. https://www.crispedge.com/color/556B2F
Darker: #445525, #33401c. Lighter: #768858, #99a682, #a6c275, #b7ce90.
*/
--color-primary: #556B2F;
--color-primary-dark: #425324;
--color-primary-light: #a0ac8b;
--color-primary-pale: #eceee7;
/* Tetrad/Square colors */
--color-alt1: #2f6b63;
--color-alt2: #452f6b;
--color-alt3: #6b2f37;
/* Specific colours */
--color-dialog: var(--color-alt3);
}
/* Document */
html
{
font-size: 14px;
}
@media (min-width: 768px)
{
html
{
font-size: 16px;
}
}
body
{
font-family: Verdana, Helvetica, Arial, Lucida, sans-serif;
background-color: #e9edf6;
}
body > .container
{
padding:0 1%;
}
/* Sticky footer styles */
html
{
position: relative;
min-height: 100%;
}
body
{
/* Margin bottom by footer height */
/*margin-bottom: 60px;*/
}
.footer
{
position: absolute;
bottom: 0;
width: 100%;
white-space: nowrap;
/* Set the fixed height of the footer here */
height: 60px;
line-height: 60px; /* Vertically center the text there */
}
/* Header */
a.navbar-brand
{
white-space: normal;
text-align: center;
word-break: break-all;
}
.border-top
{
border-top: 1px solid #e5e5e5;
}
.border-bottom
{
border-bottom: 1px solid #e5e5e5;
}
.box-shadow
{
box-shadow: 0 .25rem .75rem rgba(0, 0, 0, .05);
}
button.accept-policy
{
font-size: 1rem;
line-height: inherit;
}
/* Actions */
a, a:hover
{
text-decoration: underline;
color: #606060;
color: var(--color-primary);
}
a:focus
{
outline-color: #b0b0b0;
outline-width: thin;
}
.sax-action
{
cursor: pointer;
}
.sax-action-link
{
display: inline-block;
font-size: 16px;
font-weight: bold;
color: #000;
cursor: pointer;
}
.sax-action-link:hover
{
opacity: .7;
transition: all .4s ease-in-out;
}
.sax-link-text
{
font-size: 18px;
font-weight: bold;
}
/* Buttons */
.sax-button-cta, .sax-button-action
{
display: inline-block;
padding: 12px 12px;
min-width: 100px;
color: #404040;
background-color: #b7ce90;
font-size: 16px;
font-weight: bold;
text-align: center;
border-radius: 12px;
cursor: pointer;
transition: all .5s ease-in-out;
outline: none;
}
.sax-button-action
{
}
.sax-button-action:hover
{
background-color: #a6c275;
}
.sax-button-cta:hover
{
background: #a6c275;
}
/* --- Notification --- */
#sax-notification
{
display: none;
position: fixed;
top: 0;
right: 0;
min-width: 180px;
margin-right: 12px;
z-index: 1000;
border: 1px solid #808080;
border-bottom-left-radius: 4px;
border-bottom-right-radius: 4px;
overflow: hidden;
}
#sax-notification .content
{
background-color: #fbfbfb;
overflow: hidden;
}
#sax-notification .heading
{
font-size: 16px;
font-weight: bold;
background-color: #f0f0f0;
border-bottom: 1px solid #808080;
}
#sax-notification .heading:after
{
content: "";
display: table;
clear: both;
}
#sax-notification .title
{
float: left;
padding: 4px 8px;
white-space: nowrap;
}
#sax-notification .close
{
float: right;
padding: 4px;
font-size: 14px;
font-weight: bold;
cursor: pointer;
}
#sax-notification .message
{
clear: both;
padding: 8px;
font-size: 14px;
}
/* --- Modal Please wait --- */
#sax-please-wait
{
display: none;
cursor: progress;
position: fixed;
z-index: 1001;
top: 0;
left: 0;
height: 100%;
width: 100%;
background: rgba(250,250,250,.25) url('../img/animated/InProgress-01.gif') 50% 50% no-repeat;
}
/* Dialogs */
.sax-dialog
{
display: none;
}
.ui-dialog
{
position: fixed;
padding: 4px 4px 0 4px;
background-color: #e9edf6;
}
.ui-dialog.ui-widget.ui-widget-content
{
border-width: 2px;
border-color: #606060;
border-color: var(--color-dialog);
-moz-box-shadow: 4px 4px 6px var(--color-dialog);
-webkit-box-shadow: 4px 4px 6px var(--color-dialog);
}
.ui-dialog.ui-widget.ui-widget-content.ui-corner-all
{
border-radius: 6px;
}
.ui-dialog.ui-widget .ui-widget-header
{
font-size: 1.1rem;
color: #fff;
background-color: #606060;
border-color: var(--color-dialog);
background-color: #606060;
background-color: var(--color-dialog);
}
.ui-dialog.ui-widget .ui-widget-content
{
font-size: 1rem;
color: #000;
}
.ui-dialog.ui-widget .ui-dialog-content
{
margin-bottom: 0;
padding: 8px 8px;
}
.ui-dialog.no-close .ui-dialog-titlebar-close
{
display: none;
}
.ui-dialog .ui-dialog-buttonpane
{
margin-top: 0;
padding: 4px 16px 4px 8px;
background-color: transparent;
border-color: #606060;
border-color: var(--color-dialog);
}
.ui-dialog .ui-dialog-buttonpane button
{
color: #fff;
background-color: #606060;
background-color: var(--color-dialog);
border-color: #606060;
border-color: var(--color-dialog);
outline: none;
}
.ui-widget-overlay
{
background-color: #b0b0b0;
opacity: 0.25;
}
/* Date Picker */
.ui-datepicker
{
}
.ui-datepicker .ui-datepicker-header
{
background-color: #fff;
border: 1px solid #606060;
border-color: var(--color-dialog);
}
/* The End */