mirror of
https://gitlab.ub.uni-bielefeld.de/sfb1288inf/nopaque.git
synced 2024-12-25 10:54:18 +00:00
style and compatibility update
This commit is contained in:
Patrick Jentsch
parent
c68286e010
commit
cbd0a41bce
@ -18,7 +18,9 @@ def before_request():
|
|||||||
Checks if a user is unconfirmed when visiting specific sites. Redirects to
|
Checks if a user is unconfirmed when visiting specific sites. Redirects to
|
||||||
unconfirmed view if user is unconfirmed.
|
unconfirmed view if user is unconfirmed.
|
||||||
"""
|
"""
|
||||||
if current_user.is_authenticated:
|
if not current_user.is_authenticated:
|
||||||
|
return
|
||||||
|
|
||||||
current_user.ping()
|
current_user.ping()
|
||||||
db.session.commit()
|
db.session.commit()
|
||||||
if (not current_user.confirmed
|
if (not current_user.confirmed
|
||||||
@ -26,6 +28,8 @@ def before_request():
|
|||||||
and request.blueprint != 'auth'
|
and request.blueprint != 'auth'
|
||||||
and request.endpoint != 'static'):
|
and request.endpoint != 'static'):
|
||||||
return redirect(url_for('auth.unconfirmed'))
|
return redirect(url_for('auth.unconfirmed'))
|
||||||
|
if not current_user.terms_of_use_accepted:
|
||||||
|
return redirect(url_for('main.terms_of_use'))
|
||||||
|
|
||||||
|
|
||||||
@bp.route('/register', methods=['GET', 'POST'])
|
@bp.route('/register', methods=['GET', 'POST'])
|
||||||
|
|||||||
@ -40,6 +40,14 @@ def dashboard():
|
|||||||
)
|
)
|
||||||
|
|
||||||
|
|
||||||
|
@bp.route('/manual')
|
||||||
|
def manual():
|
||||||
|
return render_template(
|
||||||
|
'main/manual.html.j2',
|
||||||
|
title='Manual'
|
||||||
|
)
|
||||||
|
|
||||||
|
|
||||||
@bp.route('/news')
|
@bp.route('/news')
|
||||||
def news():
|
def news():
|
||||||
return render_template(
|
return render_template(
|
||||||
|
|||||||
@ -1,290 +0,0 @@
|
|||||||
/// Map deep get
|
|
||||||
/// @author Kitty Giraudel
|
|
||||||
/// @access public
|
|
||||||
/// @param {Map} $map - Map
|
|
||||||
/// @param {Arglist} $keys - Key chain
|
|
||||||
/// @return {*} - Desired value
|
|
||||||
@function map-deep-get($map, $keys...) {
|
|
||||||
@each $key in $keys {
|
|
||||||
$map: map-get($map, $key);
|
|
||||||
}
|
|
||||||
@return $map;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
$color: (
|
|
||||||
"baseline": (
|
|
||||||
"primary": #00426f,
|
|
||||||
"primary-variant": #1a5c89,
|
|
||||||
"secondary": #00426f,
|
|
||||||
"secondary-variant": #1a5c89,
|
|
||||||
"background": #ffffff,
|
|
||||||
"surface": #ffffff,
|
|
||||||
"error": #b00020
|
|
||||||
),
|
|
||||||
"social-area": (
|
|
||||||
"base": #d6ae86,
|
|
||||||
"darken": #C98536,
|
|
||||||
"lighten": #EAE2DB
|
|
||||||
),
|
|
||||||
"service": (
|
|
||||||
"corpus-analysis": (
|
|
||||||
"base": #aa9cc9,
|
|
||||||
"darken": #6b3f89,
|
|
||||||
"lighten": #ebe8f6
|
|
||||||
),
|
|
||||||
"file-setup-pipeline": (
|
|
||||||
"base": #d5dc95,
|
|
||||||
"darken": #a1b300,
|
|
||||||
"lighten": #f2f3e1
|
|
||||||
),
|
|
||||||
"spacy-nlp-pipeline": (
|
|
||||||
"base": #98acd2,
|
|
||||||
"darken": #0064a3,
|
|
||||||
"lighten": #e5e8f5
|
|
||||||
),
|
|
||||||
"tesseract-ocr-pipeline": (
|
|
||||||
"base": #a9d8c8,
|
|
||||||
"darken": #00a58b,
|
|
||||||
"lighten": #e7f4f1
|
|
||||||
),
|
|
||||||
"transkribus-htr-pipeline": (
|
|
||||||
"base": #607d8b,
|
|
||||||
"darken": #37474f,
|
|
||||||
"lighten": #cfd8dc
|
|
||||||
)
|
|
||||||
),
|
|
||||||
"status": (
|
|
||||||
"corpus": (
|
|
||||||
"UNPREPARED": #9e9e9e,
|
|
||||||
"QUEUED": #2196f3,
|
|
||||||
"BUILDING": #ffc107,
|
|
||||||
"BUILT": #4caf50,
|
|
||||||
"FAILED": #f44336,
|
|
||||||
"STARTING_ANALYSIS_SESSION": #2196f3,
|
|
||||||
"RUNNING_ANALYSIS_SESSION": #4caf50,
|
|
||||||
"CANCELING_ANALYSIS_SESSION": #ff5722
|
|
||||||
),
|
|
||||||
"job": (
|
|
||||||
"INITIALIZING": #9e9e9e,
|
|
||||||
"SUBMITTED": #9e9e9e,
|
|
||||||
"QUEUED": #2196f3,
|
|
||||||
"RUNNING": #ffc107,
|
|
||||||
"CANCELING": #ff5722,
|
|
||||||
"CANCELED": #ff5722,
|
|
||||||
"COMPLETED": #4caf50,
|
|
||||||
"FAILED": #f44336
|
|
||||||
)
|
|
||||||
),
|
|
||||||
"s-attr": (
|
|
||||||
"PERSON": #a6e22d,
|
|
||||||
"PER": #a6e22d,
|
|
||||||
"NORP": #ef60b4,
|
|
||||||
"FACILITY": #43c6fc,
|
|
||||||
"ORG": #43c6fc,
|
|
||||||
"GPE": #fd9720,
|
|
||||||
"LOC": #fd9720,
|
|
||||||
"PRODUCT": #a99dfb,
|
|
||||||
"MISC": #a99dfb,
|
|
||||||
"EVENT": #fc0,
|
|
||||||
"WORK_OF_ART": #fc0,
|
|
||||||
"LANGUAGE": #fc0,
|
|
||||||
"DATE": #2fbbab,
|
|
||||||
"TIME": #2fbbab,
|
|
||||||
"PERCENT": #bbb,
|
|
||||||
"MONEY": #bbb,
|
|
||||||
"QUANTITY": #bbb,
|
|
||||||
"ORDINAL": #bbb,
|
|
||||||
"CARDINAL": #bbb
|
|
||||||
)
|
|
||||||
);
|
|
||||||
|
|
||||||
@each $key, $color-code in map-get($color, "baseline") {
|
|
||||||
.#{$key}-color {
|
|
||||||
background-color: $color-code !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.#{$key}-color-border {
|
|
||||||
border-color: $color-code !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.#{$key}-color-text {
|
|
||||||
color: $color-code !important;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@each $key, $color-code in map-get($color, "social-area") {
|
|
||||||
.social-area-color-#{$key} {
|
|
||||||
background-color: $color-code !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.social-area-color-border-#{$key} {
|
|
||||||
border-color: $color-code !important;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@each $service-name, $color-palette in map-get($color, "service") {
|
|
||||||
.service-color[data-service="#{$service-name}"] {
|
|
||||||
background-color: map-get($color-palette, "base") !important;
|
|
||||||
|
|
||||||
&.darken {
|
|
||||||
background-color: map-get($color-palette, "darken") !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
&.lighten {
|
|
||||||
background-color: map-get($color-palette, "lighten") !important;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.service-color-border[data-service="#{$service-name}"] {
|
|
||||||
border-color: map-get($color-palette, "base") !important;
|
|
||||||
|
|
||||||
&.border-darken {
|
|
||||||
border-color: map-get($color-palette, "darken") !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
&.border-lighten {
|
|
||||||
border-color: map-get($color-palette, "lighten") !important;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.service-color-text[data-service="#{$service-name}"] {
|
|
||||||
color: map-get($color-palette, "base") !important;
|
|
||||||
|
|
||||||
&.text-darken {
|
|
||||||
color: map-get($color-palette, "darken") !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
&.text-lighten {
|
|
||||||
color: map-get($color-palette, "lighten") !important;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.service-scheme[data-service="#{$service-name}"] {
|
|
||||||
background-color: map-get($color-palette, "lighten");
|
|
||||||
|
|
||||||
.btn, .btn-small, .btn-large, .btn-floating {
|
|
||||||
background-color: map-get($color-palette, "darken");
|
|
||||||
|
|
||||||
&:hover {
|
|
||||||
background-color: map-get($color-palette, "base");
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.pagination {
|
|
||||||
li.active {
|
|
||||||
background-color: map-get($color-palette, "darken");
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.table-of-contents {
|
|
||||||
a.active, a:hover {
|
|
||||||
border-color: map-get($color-palette, "darken");
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.tabs {
|
|
||||||
.tab {
|
|
||||||
&.disabled {
|
|
||||||
a {
|
|
||||||
color: inherit;
|
|
||||||
|
|
||||||
&:hover {
|
|
||||||
color: change-color(map-get($color-palette, "darken"), $alpha: 0.15);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
a {
|
|
||||||
color: inherit;
|
|
||||||
|
|
||||||
&:focus, &:hover, &.active {
|
|
||||||
color: map-get($color-palette, "darken");
|
|
||||||
}
|
|
||||||
|
|
||||||
&:focus, &.active, &.active:focus {
|
|
||||||
background-color: change-color(map-get($color-palette, "darken"), $alpha: 0.15);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.indicator {
|
|
||||||
background-color: map-get($color-palette, "darken");
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@each $ressource-name, $color-palette in map-get($color, "status") {
|
|
||||||
@each $key, $color-code in $color-palette {
|
|
||||||
.#{$ressource-name}-status-color[data-status="#{$key}"] {
|
|
||||||
background-color: $color-code !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.#{$ressource-name}-status-color-border[data-status="#{$key}"] {
|
|
||||||
border-color: $color-code !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.#{$ressource-name}-status-color-text[data-status="#{$key}"] {
|
|
||||||
color: $color-code !important;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
@each $key, $color-code in map-get($color, "s-attr") {
|
|
||||||
.chip.s-attr[data-s-attr-type="ent"][data-s-attr-ent-type="#{$key}"] {
|
|
||||||
background-color: $color-code !important;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
main {
|
|
||||||
.btn, .btn-small, .btn-large, .btn-floating {
|
|
||||||
background-color: map-deep-get($color, "baseline", "secondary");
|
|
||||||
|
|
||||||
&:hover {
|
|
||||||
background-color: map-deep-get($color, "baseline", "secondary-variant");
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.pagination {
|
|
||||||
li.active {
|
|
||||||
background-color: map-deep-get($color, "baseline", "secondary");
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.table-of-contents {
|
|
||||||
a.active, a:hover {
|
|
||||||
border-color: map-deep-get($color, "baseline", "secondary");
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.tabs {
|
|
||||||
.tab {
|
|
||||||
&.disabled {
|
|
||||||
a {
|
|
||||||
color: inherit;
|
|
||||||
|
|
||||||
&:hover {
|
|
||||||
color: change-color(map-deep-get($color, "baseline", "secondary"), $alpha: 0.15);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
a {
|
|
||||||
color: inherit;
|
|
||||||
|
|
||||||
&:focus, &:hover, &.active {
|
|
||||||
color: map-deep-get($color, "baseline", "secondary");
|
|
||||||
}
|
|
||||||
|
|
||||||
&:focus, &.active, &.active:focus {
|
|
||||||
background-color: change-color(map-deep-get($color, "baseline", "secondary"), $alpha: 0.15);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.indicator {
|
|
||||||
background-color: map-deep-get($color, "baseline", "secondary");
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@ -1,8 +0,0 @@
|
|||||||
.parallax-container .parallax {
|
|
||||||
z-index: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.autocomplete-content {
|
|
||||||
width: 100% !important;
|
|
||||||
left: 0 !important;
|
|
||||||
}
|
|
||||||
@ -1,70 +0,0 @@
|
|||||||
.scroll {overflow: auto;}
|
|
||||||
|
|
||||||
.clearfix::after {
|
|
||||||
display: block;
|
|
||||||
content: "";
|
|
||||||
clear: both;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Change placholdertext color of file uplaod fields */
|
|
||||||
::placeholder {
|
|
||||||
color: #9e9e9e;
|
|
||||||
opacity: 1;
|
|
||||||
}
|
|
||||||
|
|
||||||
/*
|
|
||||||
* changes preoloader size etc. to fit visually better with the chip status
|
|
||||||
* indicator of jobs
|
|
||||||
*/
|
|
||||||
.status-spinner {
|
|
||||||
margin-bottom: -10px;
|
|
||||||
width: 30px !important;
|
|
||||||
height: 30px !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
#manual-modal .manual-chapter-title {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.show-if-only-child:not(:only-child) {
|
|
||||||
display: none !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.btn-scale-x2 {
|
|
||||||
transform: scale(2);
|
|
||||||
}
|
|
||||||
|
|
||||||
.btn-scale-x2 .nopaque-icons.service-icons {
|
|
||||||
font-size: 2.5rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Fix material icon vertical alignment when nested in various elements */
|
|
||||||
h1 .nopaque-icons, h2 .nopaque-icons, h3 .nopaque-icons, h4 .nopaque-icons, .tab .nopaque-icons, .tab .material-icons {
|
|
||||||
line-height: inherit;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
.corpus-status-text, .job-status-text {text-transform: lowercase;}
|
|
||||||
.corpus-status-text[data-status]:empty::before, .job-status-text[data-status]:empty::before {content: attr(data-status);}
|
|
||||||
|
|
||||||
.service-scheme[data-service="file-setup-pipeline"] .nopaque-icons.service-icons[data-service="inherit"]:empty::before {content: "E";}
|
|
||||||
.service-scheme[data-service="tesseract-ocr-pipeline"] .nopaque-icons.service-icons[data-service="inherit"]:empty::before {content: "F";}
|
|
||||||
.service-scheme[data-service="transkribus-htr-pipeline"] .nopaque-icons.service-icons[data-service="inherit"]:empty::before {content: "F";}
|
|
||||||
.service-scheme[data-service="spacy-nlp-pipeline"] .nopaque-icons.service-icons[data-service="inherit"]:empty::before {content: "G";}
|
|
||||||
.service-scheme[data-service="corpus-analysis"] .nopaque-icons.service-icons[data-service="inherit"]:empty::before {content: "H";}
|
|
||||||
|
|
||||||
.nopaque-icons.service-icons[data-service="file-setup-pipeline"]:empty::before {content: "E";}
|
|
||||||
.nopaque-icons.service-icons[data-service="tesseract-ocr-pipeline"]:empty::before {content: "F";}
|
|
||||||
.nopaque-icons.service-icons[data-service="transkribus-htr-pipeline"]:empty::before {content: "F";}
|
|
||||||
.nopaque-icons.service-icons[data-service="spacy-nlp-pipeline"]:empty::before {content: "G";}
|
|
||||||
.nopaque-icons.service-icons[data-service="corpus-analysis"]:empty::before {content: "H";}
|
|
||||||
|
|
||||||
[draggable="true"] {cursor: move !important;}
|
|
||||||
.clickable {cursor: pointer !important;}
|
|
||||||
.chip.s-attr .chip.p-attr {background-color: inherit;}
|
|
||||||
|
|
||||||
|
|
||||||
.width-25 {width: 25%;}
|
|
||||||
.width-50 {width: 50%;}
|
|
||||||
.width-75 {width: 75%;}
|
|
||||||
.width-100 {width: 100%;}
|
|
||||||
55
app/static/external/materialize/sass/components/_badges.scss
vendored
Normal file
55
app/static/external/materialize/sass/components/_badges.scss
vendored
Normal file
@ -0,0 +1,55 @@
|
|||||||
|
// Badges
|
||||||
|
span.badge {
|
||||||
|
min-width: 3rem;
|
||||||
|
padding: 0 6px;
|
||||||
|
margin-left: 14px;
|
||||||
|
text-align: center;
|
||||||
|
font-size: 1rem;
|
||||||
|
line-height: $badge-height;
|
||||||
|
height: $badge-height;
|
||||||
|
color: color('grey', 'darken-1');
|
||||||
|
float: right;
|
||||||
|
box-sizing: border-box;
|
||||||
|
|
||||||
|
&.new {
|
||||||
|
font-weight: 300;
|
||||||
|
font-size: 0.8rem;
|
||||||
|
color: #fff;
|
||||||
|
background-color: $badge-bg-color;
|
||||||
|
border-radius: 2px;
|
||||||
|
}
|
||||||
|
&.new:after {
|
||||||
|
content: " new";
|
||||||
|
}
|
||||||
|
|
||||||
|
&[data-badge-caption]::after {
|
||||||
|
content: " " attr(data-badge-caption);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Special cases
|
||||||
|
nav ul a span.badge {
|
||||||
|
display: inline-block;
|
||||||
|
float: none;
|
||||||
|
margin-left: 4px;
|
||||||
|
line-height: $badge-height;
|
||||||
|
height: $badge-height;
|
||||||
|
-webkit-font-smoothing: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Line height centering
|
||||||
|
.collection-item span.badge {
|
||||||
|
margin-top: calc(#{$collection-line-height / 2} - #{$badge-height / 2});
|
||||||
|
}
|
||||||
|
.collapsible span.badge {
|
||||||
|
margin-left: auto;
|
||||||
|
}
|
||||||
|
.sidenav span.badge {
|
||||||
|
margin-top: calc(#{$sidenav-line-height / 2} - #{$badge-height / 2});
|
||||||
|
}
|
||||||
|
|
||||||
|
table span.badge {
|
||||||
|
display: inline-block;
|
||||||
|
float: none;
|
||||||
|
margin-left: auto;
|
||||||
|
}
|
||||||
322
app/static/external/materialize/sass/components/_buttons.scss
vendored
Normal file
322
app/static/external/materialize/sass/components/_buttons.scss
vendored
Normal file
@ -0,0 +1,322 @@
|
|||||||
|
// shared styles
|
||||||
|
.btn,
|
||||||
|
.btn-flat {
|
||||||
|
border: $button-border;
|
||||||
|
border-radius: $button-radius;
|
||||||
|
display: inline-block;
|
||||||
|
height: $button-height;
|
||||||
|
line-height: $button-height;
|
||||||
|
padding: $button-padding;
|
||||||
|
text-transform: uppercase;
|
||||||
|
vertical-align: middle;
|
||||||
|
-webkit-tap-highlight-color: transparent; // Gets rid of tap active state
|
||||||
|
}
|
||||||
|
|
||||||
|
// Disabled shared style
|
||||||
|
.btn.disabled,
|
||||||
|
.btn-floating.disabled,
|
||||||
|
.btn-large.disabled,
|
||||||
|
.btn-small.disabled,
|
||||||
|
.btn-flat.disabled,
|
||||||
|
.btn:disabled,
|
||||||
|
.btn-floating:disabled,
|
||||||
|
.btn-large:disabled,
|
||||||
|
.btn-small:disabled,
|
||||||
|
.btn-flat:disabled,
|
||||||
|
.btn[disabled],
|
||||||
|
.btn-floating[disabled],
|
||||||
|
.btn-large[disabled],
|
||||||
|
.btn-small[disabled],
|
||||||
|
.btn-flat[disabled] {
|
||||||
|
pointer-events: none;
|
||||||
|
background-color: $button-disabled-background !important;
|
||||||
|
box-shadow: none;
|
||||||
|
color: $button-disabled-color !important;
|
||||||
|
cursor: default;
|
||||||
|
&:hover {
|
||||||
|
background-color: $button-disabled-background !important;
|
||||||
|
color: $button-disabled-color !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Shared icon styles
|
||||||
|
.btn,
|
||||||
|
.btn-floating,
|
||||||
|
.btn-large,
|
||||||
|
.btn-small,
|
||||||
|
.btn-flat {
|
||||||
|
font-size: $button-font-size;
|
||||||
|
outline: 0;
|
||||||
|
i {
|
||||||
|
font-size: $button-icon-font-size;
|
||||||
|
line-height: inherit;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Shared focus button style
|
||||||
|
.btn,
|
||||||
|
.btn-floating {
|
||||||
|
&:focus {
|
||||||
|
background-color: darken($button-raised-background, 10%);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Raised Button
|
||||||
|
.btn {
|
||||||
|
text-decoration: none;
|
||||||
|
color: $button-raised-color;
|
||||||
|
background-color: $button-raised-background;
|
||||||
|
text-align: center;
|
||||||
|
letter-spacing: .5px;
|
||||||
|
@extend .z-depth-1;
|
||||||
|
transition: background-color .2s ease-out;
|
||||||
|
cursor: pointer;
|
||||||
|
&:hover {
|
||||||
|
background-color: $button-raised-background-hover;
|
||||||
|
@extend .z-depth-1-half;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Floating button
|
||||||
|
.btn-floating {
|
||||||
|
&:hover {
|
||||||
|
background-color: $button-floating-background-hover;
|
||||||
|
@extend .z-depth-1-half;
|
||||||
|
}
|
||||||
|
&:before {
|
||||||
|
border-radius: 0;
|
||||||
|
}
|
||||||
|
&.btn-large {
|
||||||
|
&.halfway-fab {
|
||||||
|
bottom: -$button-floating-large-size / 2;
|
||||||
|
}
|
||||||
|
width: $button-floating-large-size;
|
||||||
|
height: $button-floating-large-size;
|
||||||
|
padding: 0;
|
||||||
|
i {
|
||||||
|
line-height: $button-floating-large-size;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&.btn-small {
|
||||||
|
&.halfway-fab {
|
||||||
|
bottom: -$button-floating-small-size / 2;
|
||||||
|
}
|
||||||
|
width: $button-floating-small-size;
|
||||||
|
height: $button-floating-small-size;
|
||||||
|
i {
|
||||||
|
line-height: $button-floating-small-size;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&.halfway-fab {
|
||||||
|
&.left {
|
||||||
|
right: auto;
|
||||||
|
left: 24px;
|
||||||
|
}
|
||||||
|
position: absolute;
|
||||||
|
right: 24px;
|
||||||
|
bottom: -$button-floating-size / 2;
|
||||||
|
}
|
||||||
|
display: inline-block;
|
||||||
|
color: $button-floating-color;
|
||||||
|
position: relative;
|
||||||
|
overflow: hidden;
|
||||||
|
z-index: 1;
|
||||||
|
width: $button-floating-size;
|
||||||
|
height: $button-floating-size;
|
||||||
|
line-height: $button-floating-size;
|
||||||
|
padding: 0;
|
||||||
|
background-color: $button-floating-background;
|
||||||
|
border-radius: $button-floating-radius;
|
||||||
|
@extend .z-depth-1;
|
||||||
|
transition: background-color .3s;
|
||||||
|
cursor: pointer;
|
||||||
|
vertical-align: middle;
|
||||||
|
i {
|
||||||
|
width: inherit;
|
||||||
|
display: inline-block;
|
||||||
|
text-align: center;
|
||||||
|
color: $button-floating-color;
|
||||||
|
font-size: $button-large-icon-font-size;
|
||||||
|
line-height: $button-floating-size;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// button fix
|
||||||
|
button.btn-floating {
|
||||||
|
border: $button-border;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Fixed Action Button
|
||||||
|
.fixed-action-btn {
|
||||||
|
&.active {
|
||||||
|
ul {
|
||||||
|
visibility: visible;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Directions
|
||||||
|
&.direction-left,
|
||||||
|
&.direction-right {
|
||||||
|
padding: 0 0 0 15px;
|
||||||
|
ul {
|
||||||
|
text-align: right;
|
||||||
|
right: 64px;
|
||||||
|
top: 50%;
|
||||||
|
transform: translateY(-50%);
|
||||||
|
height: 100%;
|
||||||
|
left: auto;
|
||||||
|
/*width 100% only goes to width of button container */
|
||||||
|
width: 500px;
|
||||||
|
li {
|
||||||
|
display: inline-block;
|
||||||
|
margin: 7.5px 15px 0 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
&.direction-right {
|
||||||
|
padding: 0 15px 0 0;
|
||||||
|
ul {
|
||||||
|
text-align: left;
|
||||||
|
direction: rtl;
|
||||||
|
left: 64px;
|
||||||
|
right: auto;
|
||||||
|
li {
|
||||||
|
margin: 7.5px 0 0 15px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
&.direction-bottom {
|
||||||
|
padding: 0 0 15px 0;
|
||||||
|
ul {
|
||||||
|
top: 64px;
|
||||||
|
bottom: auto;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column-reverse;
|
||||||
|
li {
|
||||||
|
margin: 15px 0 0 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
&.toolbar {
|
||||||
|
&.active {
|
||||||
|
&>a i {
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
padding: 0;
|
||||||
|
height: $button-floating-large-size;
|
||||||
|
ul {
|
||||||
|
display: flex;
|
||||||
|
top: 0;
|
||||||
|
bottom: 0;
|
||||||
|
z-index: 1;
|
||||||
|
li {
|
||||||
|
flex: 1;
|
||||||
|
display: inline-block;
|
||||||
|
margin: 0;
|
||||||
|
height: 100%;
|
||||||
|
transition: none;
|
||||||
|
a {
|
||||||
|
display: block;
|
||||||
|
overflow: hidden;
|
||||||
|
position: relative;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
background-color: transparent;
|
||||||
|
box-shadow: none;
|
||||||
|
color: #fff;
|
||||||
|
line-height: $button-floating-large-size;
|
||||||
|
z-index: 1;
|
||||||
|
i {
|
||||||
|
line-height: inherit;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
position: fixed;
|
||||||
|
right: 23px;
|
||||||
|
bottom: 23px;
|
||||||
|
padding-top: 15px;
|
||||||
|
margin-bottom: 0;
|
||||||
|
z-index: 997;
|
||||||
|
ul {
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
text-align: center;
|
||||||
|
position: absolute;
|
||||||
|
bottom: 64px;
|
||||||
|
margin: 0;
|
||||||
|
visibility: hidden;
|
||||||
|
li {
|
||||||
|
margin-bottom: 15px;
|
||||||
|
}
|
||||||
|
a.btn-floating {
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.fab-backdrop {
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
z-index: -1;
|
||||||
|
width: $button-floating-size;
|
||||||
|
height: $button-floating-size;
|
||||||
|
background-color: $button-floating-background;
|
||||||
|
border-radius: $button-floating-radius;
|
||||||
|
transform: scale(0);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Flat button
|
||||||
|
.btn-flat {
|
||||||
|
box-shadow: none;
|
||||||
|
background-color: transparent;
|
||||||
|
color: $button-flat-color;
|
||||||
|
cursor: pointer;
|
||||||
|
transition: background-color .2s;
|
||||||
|
&:focus,
|
||||||
|
&:hover {
|
||||||
|
box-shadow: none;
|
||||||
|
}
|
||||||
|
&:focus {
|
||||||
|
background-color: rgba(0, 0, 0, .1);
|
||||||
|
}
|
||||||
|
&.disabled,
|
||||||
|
&.btn-flat[disabled] {
|
||||||
|
background-color: transparent !important;
|
||||||
|
color: $button-flat-disabled-color !important;
|
||||||
|
cursor: default;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Large button
|
||||||
|
.btn-large {
|
||||||
|
@extend .btn;
|
||||||
|
height: $button-large-height;
|
||||||
|
line-height: $button-large-height;
|
||||||
|
font-size: $button-large-font-size;
|
||||||
|
padding: 0 28px;
|
||||||
|
|
||||||
|
i {
|
||||||
|
font-size: $button-large-icon-font-size;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Small button
|
||||||
|
.btn-small {
|
||||||
|
@extend .btn;
|
||||||
|
height: $button-small-height;
|
||||||
|
line-height: $button-small-height;
|
||||||
|
font-size: $button-small-font-size;
|
||||||
|
i {
|
||||||
|
font-size: $button-small-icon-font-size;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Block button
|
||||||
|
.btn-block {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
195
app/static/external/materialize/sass/components/_cards.scss
vendored
Normal file
195
app/static/external/materialize/sass/components/_cards.scss
vendored
Normal file
@ -0,0 +1,195 @@
|
|||||||
|
|
||||||
|
|
||||||
|
.card-panel {
|
||||||
|
transition: box-shadow .25s;
|
||||||
|
padding: $card-padding;
|
||||||
|
margin: $element-top-margin 0 $element-bottom-margin 0;
|
||||||
|
border-radius: 2px;
|
||||||
|
@extend .z-depth-1;
|
||||||
|
background-color: $card-bg-color;
|
||||||
|
}
|
||||||
|
|
||||||
|
.card {
|
||||||
|
position: relative;
|
||||||
|
margin: $element-top-margin 0 $element-bottom-margin 0;
|
||||||
|
background-color: $card-bg-color;
|
||||||
|
transition: box-shadow .25s;
|
||||||
|
border-radius: 2px;
|
||||||
|
@extend .z-depth-1;
|
||||||
|
|
||||||
|
|
||||||
|
.card-title {
|
||||||
|
font-size: 24px;
|
||||||
|
font-weight: 300;
|
||||||
|
&.activator {
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Card Sizes
|
||||||
|
&.small, &.medium, &.large {
|
||||||
|
position: relative;
|
||||||
|
|
||||||
|
.card-image {
|
||||||
|
max-height: 60%;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
.card-image + .card-content {
|
||||||
|
max-height: 40%;
|
||||||
|
}
|
||||||
|
.card-content {
|
||||||
|
max-height: 100%;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
.card-action {
|
||||||
|
position: absolute;
|
||||||
|
bottom: 0;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&.small {
|
||||||
|
height: 300px;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.medium {
|
||||||
|
height: 400px;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.large {
|
||||||
|
height: 500px;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Horizontal Cards
|
||||||
|
&.horizontal {
|
||||||
|
&.small, &.medium, &.large {
|
||||||
|
.card-image {
|
||||||
|
height: 100%;
|
||||||
|
max-height: none;
|
||||||
|
overflow: visible;
|
||||||
|
|
||||||
|
img {
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
display: flex;
|
||||||
|
|
||||||
|
.card-image {
|
||||||
|
max-width: 50%;
|
||||||
|
img {
|
||||||
|
border-radius: 2px 0 0 2px;
|
||||||
|
max-width: 100%;
|
||||||
|
width: auto;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.card-stacked {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
flex: 1;
|
||||||
|
position: relative;
|
||||||
|
|
||||||
|
.card-content {
|
||||||
|
flex-grow: 1;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Sticky Action Section
|
||||||
|
&.sticky-action {
|
||||||
|
.card-action {
|
||||||
|
z-index: 2;
|
||||||
|
}
|
||||||
|
|
||||||
|
.card-reveal {
|
||||||
|
z-index: 1;
|
||||||
|
padding-bottom: 64px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
.card-image {
|
||||||
|
position: relative;
|
||||||
|
|
||||||
|
// Image background for content
|
||||||
|
img {
|
||||||
|
display: block;
|
||||||
|
border-radius: 2px 2px 0 0;
|
||||||
|
position: relative;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
top: 0;
|
||||||
|
bottom: 0;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.card-title {
|
||||||
|
color: $card-bg-color;
|
||||||
|
position: absolute;
|
||||||
|
bottom: 0;
|
||||||
|
left: 0;
|
||||||
|
max-width: 100%;
|
||||||
|
padding: $card-padding;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.card-content {
|
||||||
|
padding: $card-padding;
|
||||||
|
border-radius: 0 0 2px 2px;
|
||||||
|
|
||||||
|
p {
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
.card-title {
|
||||||
|
display: block;
|
||||||
|
line-height: 32px;
|
||||||
|
margin-bottom: 8px;
|
||||||
|
|
||||||
|
i {
|
||||||
|
line-height: 32px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.card-action {
|
||||||
|
&:last-child {
|
||||||
|
border-radius: 0 0 2px 2px;
|
||||||
|
}
|
||||||
|
background-color: inherit; // Use inherit to inherit color classes
|
||||||
|
border-top: 1px solid rgba(160,160,160,.2);
|
||||||
|
position: relative;
|
||||||
|
padding: 16px $card-padding;
|
||||||
|
|
||||||
|
a:not(.btn):not(.btn-large):not(.btn-floating) {
|
||||||
|
color: $card-link-color;
|
||||||
|
margin-right: $card-padding;
|
||||||
|
transition: color .3s ease;
|
||||||
|
text-transform: uppercase;
|
||||||
|
|
||||||
|
&:hover { color: $card-link-color-light; }
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.card-reveal {
|
||||||
|
padding: $card-padding;
|
||||||
|
position: absolute;
|
||||||
|
background-color: $card-bg-color;
|
||||||
|
width: 100%;
|
||||||
|
overflow-y: auto;
|
||||||
|
left: 0;
|
||||||
|
top: 100%;
|
||||||
|
height: 100%;
|
||||||
|
z-index: 3;
|
||||||
|
display: none;
|
||||||
|
|
||||||
|
.card-title {
|
||||||
|
cursor: pointer;
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
90
app/static/external/materialize/sass/components/_carousel.scss
vendored
Normal file
90
app/static/external/materialize/sass/components/_carousel.scss
vendored
Normal file
@ -0,0 +1,90 @@
|
|||||||
|
.carousel {
|
||||||
|
&.carousel-slider {
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
|
||||||
|
.carousel-fixed-item {
|
||||||
|
&.with-indicators {
|
||||||
|
bottom: 68px;
|
||||||
|
}
|
||||||
|
|
||||||
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
bottom: 20px;
|
||||||
|
z-index: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
.carousel-item {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
min-height: $carousel-height;
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
|
||||||
|
h2 {
|
||||||
|
font-size: 24px;
|
||||||
|
font-weight: 500;
|
||||||
|
line-height: 32px;
|
||||||
|
}
|
||||||
|
|
||||||
|
p {
|
||||||
|
font-size: 15px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
overflow: hidden;
|
||||||
|
position: relative;
|
||||||
|
width: 100%;
|
||||||
|
height: $carousel-height;
|
||||||
|
perspective: 500px;
|
||||||
|
transform-style: preserve-3d;
|
||||||
|
transform-origin: 0% 50%;
|
||||||
|
|
||||||
|
.carousel-item {
|
||||||
|
visibility: hidden;
|
||||||
|
width: $carousel-item-width;
|
||||||
|
height: $carousel-item-height;
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
|
||||||
|
& > img {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.indicators {
|
||||||
|
position: absolute;
|
||||||
|
text-align: center;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
bottom: 0;
|
||||||
|
margin: 0;
|
||||||
|
|
||||||
|
.indicator-item {
|
||||||
|
&.active {
|
||||||
|
background-color: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
display: inline-block;
|
||||||
|
position: relative;
|
||||||
|
cursor: pointer;
|
||||||
|
height: 8px;
|
||||||
|
width: 8px;
|
||||||
|
margin: 24px 4px;
|
||||||
|
background-color: rgba(255,255,255,.5);
|
||||||
|
|
||||||
|
transition: background-color .3s;
|
||||||
|
border-radius: 50%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Materialbox compatibility
|
||||||
|
&.scrolling .carousel-item .materialboxed,
|
||||||
|
.carousel-item:not(.active) .materialboxed {
|
||||||
|
pointer-events: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
90
app/static/external/materialize/sass/components/_chips.scss
vendored
Normal file
90
app/static/external/materialize/sass/components/_chips.scss
vendored
Normal file
@ -0,0 +1,90 @@
|
|||||||
|
.chip {
|
||||||
|
&:focus {
|
||||||
|
outline: none;
|
||||||
|
background-color: $chip-selected-color;
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
display: inline-block;
|
||||||
|
height: 32px;
|
||||||
|
font-size: 13px;
|
||||||
|
font-weight: 500;
|
||||||
|
color: rgba(0,0,0,.6);
|
||||||
|
line-height: 32px;
|
||||||
|
padding: 0 12px;
|
||||||
|
border-radius: 16px;
|
||||||
|
background-color: $chip-bg-color;
|
||||||
|
margin-bottom: $chip-margin;
|
||||||
|
margin-right: $chip-margin;
|
||||||
|
|
||||||
|
> img {
|
||||||
|
float: left;
|
||||||
|
margin: 0 8px 0 -12px;
|
||||||
|
height: 32px;
|
||||||
|
width: 32px;
|
||||||
|
border-radius: 50%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.close {
|
||||||
|
cursor: pointer;
|
||||||
|
float: right;
|
||||||
|
font-size: 16px;
|
||||||
|
line-height: 32px;
|
||||||
|
padding-left: 8px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.chips {
|
||||||
|
border: none;
|
||||||
|
border-bottom: 1px solid $chip-border-color;
|
||||||
|
box-shadow: none;
|
||||||
|
margin: $input-margin;
|
||||||
|
min-height: 45px;
|
||||||
|
outline: none;
|
||||||
|
transition: all .3s;
|
||||||
|
|
||||||
|
&.focus {
|
||||||
|
border-bottom: 1px solid $chip-selected-color;
|
||||||
|
box-shadow: 0 1px 0 0 $chip-selected-color;
|
||||||
|
}
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
cursor: text;
|
||||||
|
}
|
||||||
|
|
||||||
|
.input {
|
||||||
|
background: none;
|
||||||
|
border: 0;
|
||||||
|
color: rgba(0,0,0,.6);
|
||||||
|
display: inline-block;
|
||||||
|
font-size: $input-font-size;
|
||||||
|
height: $input-height;
|
||||||
|
line-height: 32px;
|
||||||
|
outline: 0;
|
||||||
|
margin: 0;
|
||||||
|
padding: 0 !important;
|
||||||
|
width: 120px !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.input:focus {
|
||||||
|
border: 0 !important;
|
||||||
|
box-shadow: none !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Autocomplete
|
||||||
|
.autocomplete-content {
|
||||||
|
margin-top: 0;
|
||||||
|
margin-bottom: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Form prefix
|
||||||
|
.prefix ~ .chips {
|
||||||
|
margin-left: 3rem;
|
||||||
|
width: 92%;
|
||||||
|
width: calc(100% - 3rem);
|
||||||
|
}
|
||||||
|
.chips:empty ~ label {
|
||||||
|
font-size: 0.8rem;
|
||||||
|
transform: translateY(-140%);
|
||||||
|
}
|
||||||
91
app/static/external/materialize/sass/components/_collapsible.scss
vendored
Normal file
91
app/static/external/materialize/sass/components/_collapsible.scss
vendored
Normal file
@ -0,0 +1,91 @@
|
|||||||
|
.collapsible {
|
||||||
|
border-top: 1px solid $collapsible-border-color;
|
||||||
|
border-right: 1px solid $collapsible-border-color;
|
||||||
|
border-left: 1px solid $collapsible-border-color;
|
||||||
|
margin: $element-top-margin 0 $element-bottom-margin 0;
|
||||||
|
@extend .z-depth-1;
|
||||||
|
}
|
||||||
|
|
||||||
|
.collapsible-header {
|
||||||
|
&:focus {
|
||||||
|
outline: 0
|
||||||
|
}
|
||||||
|
|
||||||
|
display: flex;
|
||||||
|
cursor: pointer;
|
||||||
|
-webkit-tap-highlight-color: transparent;
|
||||||
|
line-height: 1.5;
|
||||||
|
padding: 1rem;
|
||||||
|
background-color: $collapsible-header-color;
|
||||||
|
border-bottom: 1px solid $collapsible-border-color;
|
||||||
|
|
||||||
|
i {
|
||||||
|
width: 2rem;
|
||||||
|
font-size: 1.6rem;
|
||||||
|
display: inline-block;
|
||||||
|
text-align: center;
|
||||||
|
margin-right: 1rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.keyboard-focused .collapsible-header:focus {
|
||||||
|
background-color: #eee;
|
||||||
|
}
|
||||||
|
|
||||||
|
.collapsible-body {
|
||||||
|
display: none;
|
||||||
|
border-bottom: 1px solid $collapsible-border-color;
|
||||||
|
box-sizing: border-box;
|
||||||
|
padding: 2rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Sidenav collapsible styling
|
||||||
|
.sidenav,
|
||||||
|
.sidenav.fixed {
|
||||||
|
|
||||||
|
.collapsible {
|
||||||
|
border: none;
|
||||||
|
box-shadow: none;
|
||||||
|
|
||||||
|
li { padding: 0; }
|
||||||
|
}
|
||||||
|
|
||||||
|
.collapsible-header {
|
||||||
|
background-color: transparent;
|
||||||
|
border: none;
|
||||||
|
line-height: inherit;
|
||||||
|
height: inherit;
|
||||||
|
padding: 0 $sidenav-padding;
|
||||||
|
|
||||||
|
&:hover { background-color: rgba(0,0,0,.05); }
|
||||||
|
i { line-height: inherit; }
|
||||||
|
}
|
||||||
|
|
||||||
|
.collapsible-body {
|
||||||
|
border: 0;
|
||||||
|
background-color: $collapsible-header-color;
|
||||||
|
|
||||||
|
li a {
|
||||||
|
padding: 0 (7.5px + $sidenav-padding)
|
||||||
|
0 (15px + $sidenav-padding);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
// Popout Collapsible
|
||||||
|
|
||||||
|
.collapsible.popout {
|
||||||
|
border: none;
|
||||||
|
box-shadow: none;
|
||||||
|
> li {
|
||||||
|
box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
|
||||||
|
// transform: scaleX(.92);
|
||||||
|
margin: 0 24px;
|
||||||
|
transition: margin .35s cubic-bezier(0.250, 0.460, 0.450, 0.940);
|
||||||
|
}
|
||||||
|
> li.active {
|
||||||
|
box-shadow: 0 5px 11px 0 rgba(0, 0, 0, 0.18), 0 4px 15px 0 rgba(0, 0, 0, 0.15);
|
||||||
|
margin: 16px 0;
|
||||||
|
// transform: scaleX(1);
|
||||||
|
}
|
||||||
|
}
|
||||||
32
app/static/external/materialize/sass/components/_color-classes.scss
vendored
Normal file
32
app/static/external/materialize/sass/components/_color-classes.scss
vendored
Normal file
@ -0,0 +1,32 @@
|
|||||||
|
// Color Classes
|
||||||
|
|
||||||
|
@each $color_name, $color in $colors {
|
||||||
|
@each $color_type, $color_value in $color {
|
||||||
|
@if $color_type == "base" {
|
||||||
|
.#{$color_name} {
|
||||||
|
background-color: $color_value !important;
|
||||||
|
}
|
||||||
|
.#{$color_name}-text {
|
||||||
|
color: $color_value !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@else if $color_name != "shades" {
|
||||||
|
.#{$color_name}.#{$color_type} {
|
||||||
|
background-color: $color_value !important;
|
||||||
|
}
|
||||||
|
.#{$color_name}-text.text-#{$color_type} {
|
||||||
|
color: $color_value !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Shade classes
|
||||||
|
@each $color, $color_value in $shades {
|
||||||
|
.#{$color} {
|
||||||
|
background-color: $color_value !important;
|
||||||
|
}
|
||||||
|
.#{$color}-text {
|
||||||
|
color: $color_value !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
370
app/static/external/materialize/sass/components/_color-variables.scss
vendored
Normal file
370
app/static/external/materialize/sass/components/_color-variables.scss
vendored
Normal file
@ -0,0 +1,370 @@
|
|||||||
|
// Google Color Palette defined: http://www.google.com/design/spec/style/color.html
|
||||||
|
|
||||||
|
$materialize-red: (
|
||||||
|
"base": #e51c23,
|
||||||
|
"lighten-5": #fdeaeb,
|
||||||
|
"lighten-4": #f8c1c3,
|
||||||
|
"lighten-3": #f3989b,
|
||||||
|
"lighten-2": #ee6e73,
|
||||||
|
"lighten-1": #ea454b,
|
||||||
|
"darken-1": #d0181e,
|
||||||
|
"darken-2": #b9151b,
|
||||||
|
"darken-3": #a21318,
|
||||||
|
"darken-4": #8b1014,
|
||||||
|
);
|
||||||
|
|
||||||
|
$red: (
|
||||||
|
"base": #F44336,
|
||||||
|
"lighten-5": #FFEBEE,
|
||||||
|
"lighten-4": #FFCDD2,
|
||||||
|
"lighten-3": #EF9A9A,
|
||||||
|
"lighten-2": #E57373,
|
||||||
|
"lighten-1": #EF5350,
|
||||||
|
"darken-1": #E53935,
|
||||||
|
"darken-2": #D32F2F,
|
||||||
|
"darken-3": #C62828,
|
||||||
|
"darken-4": #B71C1C,
|
||||||
|
"accent-1": #FF8A80,
|
||||||
|
"accent-2": #FF5252,
|
||||||
|
"accent-3": #FF1744,
|
||||||
|
"accent-4": #D50000
|
||||||
|
);
|
||||||
|
|
||||||
|
$pink: (
|
||||||
|
"base": #e91e63,
|
||||||
|
"lighten-5": #fce4ec,
|
||||||
|
"lighten-4": #f8bbd0,
|
||||||
|
"lighten-3": #f48fb1,
|
||||||
|
"lighten-2": #f06292,
|
||||||
|
"lighten-1": #ec407a,
|
||||||
|
"darken-1": #d81b60,
|
||||||
|
"darken-2": #c2185b,
|
||||||
|
"darken-3": #ad1457,
|
||||||
|
"darken-4": #880e4f,
|
||||||
|
"accent-1": #ff80ab,
|
||||||
|
"accent-2": #ff4081,
|
||||||
|
"accent-3": #f50057,
|
||||||
|
"accent-4": #c51162
|
||||||
|
);
|
||||||
|
|
||||||
|
$purple: (
|
||||||
|
"base": #9c27b0,
|
||||||
|
"lighten-5": #f3e5f5,
|
||||||
|
"lighten-4": #e1bee7,
|
||||||
|
"lighten-3": #ce93d8,
|
||||||
|
"lighten-2": #ba68c8,
|
||||||
|
"lighten-1": #ab47bc,
|
||||||
|
"darken-1": #8e24aa,
|
||||||
|
"darken-2": #7b1fa2,
|
||||||
|
"darken-3": #6a1b9a,
|
||||||
|
"darken-4": #4a148c,
|
||||||
|
"accent-1": #ea80fc,
|
||||||
|
"accent-2": #e040fb,
|
||||||
|
"accent-3": #d500f9,
|
||||||
|
"accent-4": #aa00ff
|
||||||
|
);
|
||||||
|
|
||||||
|
$deep-purple: (
|
||||||
|
"base": #673ab7,
|
||||||
|
"lighten-5": #ede7f6,
|
||||||
|
"lighten-4": #d1c4e9,
|
||||||
|
"lighten-3": #b39ddb,
|
||||||
|
"lighten-2": #9575cd,
|
||||||
|
"lighten-1": #7e57c2,
|
||||||
|
"darken-1": #5e35b1,
|
||||||
|
"darken-2": #512da8,
|
||||||
|
"darken-3": #4527a0,
|
||||||
|
"darken-4": #311b92,
|
||||||
|
"accent-1": #b388ff,
|
||||||
|
"accent-2": #7c4dff,
|
||||||
|
"accent-3": #651fff,
|
||||||
|
"accent-4": #6200ea
|
||||||
|
);
|
||||||
|
|
||||||
|
$indigo: (
|
||||||
|
"base": #3f51b5,
|
||||||
|
"lighten-5": #e8eaf6,
|
||||||
|
"lighten-4": #c5cae9,
|
||||||
|
"lighten-3": #9fa8da,
|
||||||
|
"lighten-2": #7986cb,
|
||||||
|
"lighten-1": #5c6bc0,
|
||||||
|
"darken-1": #3949ab,
|
||||||
|
"darken-2": #303f9f,
|
||||||
|
"darken-3": #283593,
|
||||||
|
"darken-4": #1a237e,
|
||||||
|
"accent-1": #8c9eff,
|
||||||
|
"accent-2": #536dfe,
|
||||||
|
"accent-3": #3d5afe,
|
||||||
|
"accent-4": #304ffe
|
||||||
|
);
|
||||||
|
|
||||||
|
$blue: (
|
||||||
|
"base": #2196F3,
|
||||||
|
"lighten-5": #E3F2FD,
|
||||||
|
"lighten-4": #BBDEFB,
|
||||||
|
"lighten-3": #90CAF9,
|
||||||
|
"lighten-2": #64B5F6,
|
||||||
|
"lighten-1": #42A5F5,
|
||||||
|
"darken-1": #1E88E5,
|
||||||
|
"darken-2": #1976D2,
|
||||||
|
"darken-3": #1565C0,
|
||||||
|
"darken-4": #0D47A1,
|
||||||
|
"accent-1": #82B1FF,
|
||||||
|
"accent-2": #448AFF,
|
||||||
|
"accent-3": #2979FF,
|
||||||
|
"accent-4": #2962FF
|
||||||
|
);
|
||||||
|
|
||||||
|
$light-blue: (
|
||||||
|
"base": #03a9f4,
|
||||||
|
"lighten-5": #e1f5fe,
|
||||||
|
"lighten-4": #b3e5fc,
|
||||||
|
"lighten-3": #81d4fa,
|
||||||
|
"lighten-2": #4fc3f7,
|
||||||
|
"lighten-1": #29b6f6,
|
||||||
|
"darken-1": #039be5,
|
||||||
|
"darken-2": #0288d1,
|
||||||
|
"darken-3": #0277bd,
|
||||||
|
"darken-4": #01579b,
|
||||||
|
"accent-1": #80d8ff,
|
||||||
|
"accent-2": #40c4ff,
|
||||||
|
"accent-3": #00b0ff,
|
||||||
|
"accent-4": #0091ea
|
||||||
|
);
|
||||||
|
|
||||||
|
$cyan: (
|
||||||
|
"base": #00bcd4,
|
||||||
|
"lighten-5": #e0f7fa,
|
||||||
|
"lighten-4": #b2ebf2,
|
||||||
|
"lighten-3": #80deea,
|
||||||
|
"lighten-2": #4dd0e1,
|
||||||
|
"lighten-1": #26c6da,
|
||||||
|
"darken-1": #00acc1,
|
||||||
|
"darken-2": #0097a7,
|
||||||
|
"darken-3": #00838f,
|
||||||
|
"darken-4": #006064,
|
||||||
|
"accent-1": #84ffff,
|
||||||
|
"accent-2": #18ffff,
|
||||||
|
"accent-3": #00e5ff,
|
||||||
|
"accent-4": #00b8d4
|
||||||
|
);
|
||||||
|
|
||||||
|
$teal: (
|
||||||
|
"base": #009688,
|
||||||
|
"lighten-5": #e0f2f1,
|
||||||
|
"lighten-4": #b2dfdb,
|
||||||
|
"lighten-3": #80cbc4,
|
||||||
|
"lighten-2": #4db6ac,
|
||||||
|
"lighten-1": #26a69a,
|
||||||
|
"darken-1": #00897b,
|
||||||
|
"darken-2": #00796b,
|
||||||
|
"darken-3": #00695c,
|
||||||
|
"darken-4": #004d40,
|
||||||
|
"accent-1": #a7ffeb,
|
||||||
|
"accent-2": #64ffda,
|
||||||
|
"accent-3": #1de9b6,
|
||||||
|
"accent-4": #00bfa5
|
||||||
|
);
|
||||||
|
|
||||||
|
$green: (
|
||||||
|
"base": #4CAF50,
|
||||||
|
"lighten-5": #E8F5E9,
|
||||||
|
"lighten-4": #C8E6C9,
|
||||||
|
"lighten-3": #A5D6A7,
|
||||||
|
"lighten-2": #81C784,
|
||||||
|
"lighten-1": #66BB6A,
|
||||||
|
"darken-1": #43A047,
|
||||||
|
"darken-2": #388E3C,
|
||||||
|
"darken-3": #2E7D32,
|
||||||
|
"darken-4": #1B5E20,
|
||||||
|
"accent-1": #B9F6CA,
|
||||||
|
"accent-2": #69F0AE,
|
||||||
|
"accent-3": #00E676,
|
||||||
|
"accent-4": #00C853
|
||||||
|
);
|
||||||
|
|
||||||
|
$light-green: (
|
||||||
|
"base": #8bc34a,
|
||||||
|
"lighten-5": #f1f8e9,
|
||||||
|
"lighten-4": #dcedc8,
|
||||||
|
"lighten-3": #c5e1a5,
|
||||||
|
"lighten-2": #aed581,
|
||||||
|
"lighten-1": #9ccc65,
|
||||||
|
"darken-1": #7cb342,
|
||||||
|
"darken-2": #689f38,
|
||||||
|
"darken-3": #558b2f,
|
||||||
|
"darken-4": #33691e,
|
||||||
|
"accent-1": #ccff90,
|
||||||
|
"accent-2": #b2ff59,
|
||||||
|
"accent-3": #76ff03,
|
||||||
|
"accent-4": #64dd17
|
||||||
|
);
|
||||||
|
|
||||||
|
$lime: (
|
||||||
|
"base": #cddc39,
|
||||||
|
"lighten-5": #f9fbe7,
|
||||||
|
"lighten-4": #f0f4c3,
|
||||||
|
"lighten-3": #e6ee9c,
|
||||||
|
"lighten-2": #dce775,
|
||||||
|
"lighten-1": #d4e157,
|
||||||
|
"darken-1": #c0ca33,
|
||||||
|
"darken-2": #afb42b,
|
||||||
|
"darken-3": #9e9d24,
|
||||||
|
"darken-4": #827717,
|
||||||
|
"accent-1": #f4ff81,
|
||||||
|
"accent-2": #eeff41,
|
||||||
|
"accent-3": #c6ff00,
|
||||||
|
"accent-4": #aeea00
|
||||||
|
);
|
||||||
|
|
||||||
|
$yellow: (
|
||||||
|
"base": #ffeb3b,
|
||||||
|
"lighten-5": #fffde7,
|
||||||
|
"lighten-4": #fff9c4,
|
||||||
|
"lighten-3": #fff59d,
|
||||||
|
"lighten-2": #fff176,
|
||||||
|
"lighten-1": #ffee58,
|
||||||
|
"darken-1": #fdd835,
|
||||||
|
"darken-2": #fbc02d,
|
||||||
|
"darken-3": #f9a825,
|
||||||
|
"darken-4": #f57f17,
|
||||||
|
"accent-1": #ffff8d,
|
||||||
|
"accent-2": #ffff00,
|
||||||
|
"accent-3": #ffea00,
|
||||||
|
"accent-4": #ffd600
|
||||||
|
);
|
||||||
|
|
||||||
|
$amber: (
|
||||||
|
"base": #ffc107,
|
||||||
|
"lighten-5": #fff8e1,
|
||||||
|
"lighten-4": #ffecb3,
|
||||||
|
"lighten-3": #ffe082,
|
||||||
|
"lighten-2": #ffd54f,
|
||||||
|
"lighten-1": #ffca28,
|
||||||
|
"darken-1": #ffb300,
|
||||||
|
"darken-2": #ffa000,
|
||||||
|
"darken-3": #ff8f00,
|
||||||
|
"darken-4": #ff6f00,
|
||||||
|
"accent-1": #ffe57f,
|
||||||
|
"accent-2": #ffd740,
|
||||||
|
"accent-3": #ffc400,
|
||||||
|
"accent-4": #ffab00
|
||||||
|
);
|
||||||
|
|
||||||
|
$orange: (
|
||||||
|
"base": #ff9800,
|
||||||
|
"lighten-5": #fff3e0,
|
||||||
|
"lighten-4": #ffe0b2,
|
||||||
|
"lighten-3": #ffcc80,
|
||||||
|
"lighten-2": #ffb74d,
|
||||||
|
"lighten-1": #ffa726,
|
||||||
|
"darken-1": #fb8c00,
|
||||||
|
"darken-2": #f57c00,
|
||||||
|
"darken-3": #ef6c00,
|
||||||
|
"darken-4": #e65100,
|
||||||
|
"accent-1": #ffd180,
|
||||||
|
"accent-2": #ffab40,
|
||||||
|
"accent-3": #ff9100,
|
||||||
|
"accent-4": #ff6d00
|
||||||
|
);
|
||||||
|
|
||||||
|
$deep-orange: (
|
||||||
|
"base": #ff5722,
|
||||||
|
"lighten-5": #fbe9e7,
|
||||||
|
"lighten-4": #ffccbc,
|
||||||
|
"lighten-3": #ffab91,
|
||||||
|
"lighten-2": #ff8a65,
|
||||||
|
"lighten-1": #ff7043,
|
||||||
|
"darken-1": #f4511e,
|
||||||
|
"darken-2": #e64a19,
|
||||||
|
"darken-3": #d84315,
|
||||||
|
"darken-4": #bf360c,
|
||||||
|
"accent-1": #ff9e80,
|
||||||
|
"accent-2": #ff6e40,
|
||||||
|
"accent-3": #ff3d00,
|
||||||
|
"accent-4": #dd2c00
|
||||||
|
);
|
||||||
|
|
||||||
|
$brown: (
|
||||||
|
"base": #795548,
|
||||||
|
"lighten-5": #efebe9,
|
||||||
|
"lighten-4": #d7ccc8,
|
||||||
|
"lighten-3": #bcaaa4,
|
||||||
|
"lighten-2": #a1887f,
|
||||||
|
"lighten-1": #8d6e63,
|
||||||
|
"darken-1": #6d4c41,
|
||||||
|
"darken-2": #5d4037,
|
||||||
|
"darken-3": #4e342e,
|
||||||
|
"darken-4": #3e2723
|
||||||
|
);
|
||||||
|
|
||||||
|
$blue-grey: (
|
||||||
|
"base": #607d8b,
|
||||||
|
"lighten-5": #eceff1,
|
||||||
|
"lighten-4": #cfd8dc,
|
||||||
|
"lighten-3": #b0bec5,
|
||||||
|
"lighten-2": #90a4ae,
|
||||||
|
"lighten-1": #78909c,
|
||||||
|
"darken-1": #546e7a,
|
||||||
|
"darken-2": #455a64,
|
||||||
|
"darken-3": #37474f,
|
||||||
|
"darken-4": #263238
|
||||||
|
);
|
||||||
|
|
||||||
|
$grey: (
|
||||||
|
"base": #9e9e9e,
|
||||||
|
"lighten-5": #fafafa,
|
||||||
|
"lighten-4": #f5f5f5,
|
||||||
|
"lighten-3": #eeeeee,
|
||||||
|
"lighten-2": #e0e0e0,
|
||||||
|
"lighten-1": #bdbdbd,
|
||||||
|
"darken-1": #757575,
|
||||||
|
"darken-2": #616161,
|
||||||
|
"darken-3": #424242,
|
||||||
|
"darken-4": #212121
|
||||||
|
);
|
||||||
|
|
||||||
|
$shades: (
|
||||||
|
"black": #000000,
|
||||||
|
"white": #FFFFFF,
|
||||||
|
"transparent": transparent
|
||||||
|
);
|
||||||
|
|
||||||
|
$colors: (
|
||||||
|
"materialize-red": $materialize-red,
|
||||||
|
"red": $red,
|
||||||
|
"pink": $pink,
|
||||||
|
"purple": $purple,
|
||||||
|
"deep-purple": $deep-purple,
|
||||||
|
"indigo": $indigo,
|
||||||
|
"blue": $blue,
|
||||||
|
"light-blue": $light-blue,
|
||||||
|
"cyan": $cyan,
|
||||||
|
"teal": $teal,
|
||||||
|
"green": $green,
|
||||||
|
"light-green": $light-green,
|
||||||
|
"lime": $lime,
|
||||||
|
"yellow": $yellow,
|
||||||
|
"amber": $amber,
|
||||||
|
"orange": $orange,
|
||||||
|
"deep-orange": $deep-orange,
|
||||||
|
"brown": $brown,
|
||||||
|
"blue-grey": $blue-grey,
|
||||||
|
"grey": $grey,
|
||||||
|
"shades": $shades
|
||||||
|
) !default;
|
||||||
|
|
||||||
|
|
||||||
|
// usage: color("name_of_color", "type_of_color")
|
||||||
|
// to avoid to repeating map-get($colors, ...)
|
||||||
|
|
||||||
|
@function color($color, $type) {
|
||||||
|
@if map-has-key($colors, $color) {
|
||||||
|
$curr_color: map-get($colors, $color);
|
||||||
|
@if map-has-key($curr_color, $type) {
|
||||||
|
@return map-get($curr_color, $type);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@warn "Unknown `#{$color}` - `#{$type}` in $colors.";
|
||||||
|
@return null;
|
||||||
|
}
|
||||||
191
app/static/external/materialize/sass/components/_datepicker.scss
vendored
Normal file
191
app/static/external/materialize/sass/components/_datepicker.scss
vendored
Normal file
@ -0,0 +1,191 @@
|
|||||||
|
/* Modal */
|
||||||
|
.datepicker-modal {
|
||||||
|
max-width: 325px;
|
||||||
|
min-width: 300px;
|
||||||
|
max-height: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.datepicker-container.modal-content {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.datepicker-controls {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
width: 280px;
|
||||||
|
margin: 0 auto;
|
||||||
|
|
||||||
|
.selects-container {
|
||||||
|
display: flex;
|
||||||
|
}
|
||||||
|
|
||||||
|
.select-wrapper {
|
||||||
|
input {
|
||||||
|
&:focus {
|
||||||
|
border-bottom: none;
|
||||||
|
}
|
||||||
|
border-bottom: none;
|
||||||
|
text-align: center;
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.caret {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.select-year input {
|
||||||
|
width: 50px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.select-month input {
|
||||||
|
width: 70px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.month-prev, .month-next {
|
||||||
|
margin-top: 4px;
|
||||||
|
cursor: pointer;
|
||||||
|
background-color: transparent;
|
||||||
|
border: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
/* Date Display */
|
||||||
|
.datepicker-date-display {
|
||||||
|
flex: 1 auto;
|
||||||
|
background-color: $secondary-color;
|
||||||
|
color: #fff;
|
||||||
|
padding: 20px 22px;
|
||||||
|
font-weight: 500;
|
||||||
|
|
||||||
|
.year-text {
|
||||||
|
display: block;
|
||||||
|
font-size: 1.5rem;
|
||||||
|
line-height: 25px;
|
||||||
|
color: $datepicker-year;
|
||||||
|
}
|
||||||
|
|
||||||
|
.date-text {
|
||||||
|
display: block;
|
||||||
|
font-size: 2.8rem;
|
||||||
|
line-height: 47px;
|
||||||
|
font-weight: 500;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
/* Calendar */
|
||||||
|
.datepicker-calendar-container {
|
||||||
|
flex: 2.5 auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.datepicker-table {
|
||||||
|
width: 280px;
|
||||||
|
font-size: 1rem;
|
||||||
|
margin: 0 auto;
|
||||||
|
|
||||||
|
thead {
|
||||||
|
border-bottom: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
th {
|
||||||
|
padding: 10px 5px;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
tr {
|
||||||
|
border: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
abbr {
|
||||||
|
text-decoration: none;
|
||||||
|
color: $datepicker-calendar-header-color;
|
||||||
|
}
|
||||||
|
|
||||||
|
td {
|
||||||
|
&.is-today {
|
||||||
|
color: $secondary-color;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.is-selected {
|
||||||
|
background-color: $secondary-color;
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.is-outside-current-month,
|
||||||
|
&.is-disabled {
|
||||||
|
color: $datepicker-disabled-day-color;
|
||||||
|
pointer-events: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
border-radius: 50%;
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.datepicker-day-button {
|
||||||
|
&:focus {
|
||||||
|
background-color: $datepicker-day-focus;
|
||||||
|
}
|
||||||
|
|
||||||
|
background-color: transparent;
|
||||||
|
border: none;
|
||||||
|
line-height: 38px;
|
||||||
|
display: block;
|
||||||
|
width: 100%;
|
||||||
|
border-radius: 50%;
|
||||||
|
padding: 0 5px;
|
||||||
|
cursor: pointer;
|
||||||
|
color: inherit;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
/* Footer */
|
||||||
|
.datepicker-footer {
|
||||||
|
width: 280px;
|
||||||
|
margin: 0 auto;
|
||||||
|
padding-bottom: 5px;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
}
|
||||||
|
|
||||||
|
.datepicker-cancel,
|
||||||
|
.datepicker-clear,
|
||||||
|
.datepicker-today,
|
||||||
|
.datepicker-done {
|
||||||
|
color: $secondary-color;
|
||||||
|
padding: 0 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.datepicker-clear {
|
||||||
|
color: $error-color;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
/* Media Queries */
|
||||||
|
@media #{$medium-and-up} {
|
||||||
|
.datepicker-modal {
|
||||||
|
max-width: 625px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.datepicker-container.modal-content {
|
||||||
|
flex-direction: row;
|
||||||
|
}
|
||||||
|
|
||||||
|
.datepicker-date-display {
|
||||||
|
flex: 0 1 270px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.datepicker-controls,
|
||||||
|
.datepicker-table,
|
||||||
|
.datepicker-footer {
|
||||||
|
width: 320px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.datepicker-day-button {
|
||||||
|
line-height: 44px;
|
||||||
|
}
|
||||||
|
}
|
||||||
85
app/static/external/materialize/sass/components/_dropdown.scss
vendored
Normal file
85
app/static/external/materialize/sass/components/_dropdown.scss
vendored
Normal file
@ -0,0 +1,85 @@
|
|||||||
|
.dropdown-content {
|
||||||
|
&:focus {
|
||||||
|
outline: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
@extend .z-depth-1;
|
||||||
|
background-color: $dropdown-bg-color;
|
||||||
|
margin: 0;
|
||||||
|
display: none;
|
||||||
|
min-width: 100px;
|
||||||
|
overflow-y: auto;
|
||||||
|
opacity: 0;
|
||||||
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
|
top: 0;
|
||||||
|
z-index: 9999; // TODO: Check if this doesn't break other things
|
||||||
|
transform-origin: 0 0;
|
||||||
|
|
||||||
|
|
||||||
|
li {
|
||||||
|
&:hover, &.active {
|
||||||
|
background-color: $dropdown-hover-bg-color;
|
||||||
|
}
|
||||||
|
|
||||||
|
&:focus {
|
||||||
|
outline: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.divider {
|
||||||
|
min-height: 0;
|
||||||
|
height: 1px;
|
||||||
|
}
|
||||||
|
|
||||||
|
& > a, & > span {
|
||||||
|
font-size: 16px;
|
||||||
|
color: $dropdown-color;
|
||||||
|
display: block;
|
||||||
|
line-height: 22px;
|
||||||
|
padding: (($dropdown-item-height - 22) / 2) 16px;
|
||||||
|
}
|
||||||
|
|
||||||
|
& > span > label {
|
||||||
|
top: 1px;
|
||||||
|
left: 0;
|
||||||
|
height: 18px;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Icon alignment override
|
||||||
|
& > a > i {
|
||||||
|
height: inherit;
|
||||||
|
line-height: inherit;
|
||||||
|
float: left;
|
||||||
|
margin: 0 24px 0 0;
|
||||||
|
width: 24px;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
clear: both;
|
||||||
|
color: $off-black;
|
||||||
|
cursor: pointer;
|
||||||
|
min-height: $dropdown-item-height;
|
||||||
|
line-height: 1.5rem;
|
||||||
|
width: 100%;
|
||||||
|
text-align: left;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
body.keyboard-focused {
|
||||||
|
.dropdown-content li:focus {
|
||||||
|
background-color: darken($dropdown-hover-bg-color, 8%);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Input field specificity bugfix
|
||||||
|
.input-field.col .dropdown-content [type="checkbox"] + label {
|
||||||
|
top: 1px;
|
||||||
|
left: 0;
|
||||||
|
height: 18px;
|
||||||
|
transform: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dropdown-trigger {
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
769
app/static/external/materialize/sass/components/_global.scss
vendored
Normal file
769
app/static/external/materialize/sass/components/_global.scss
vendored
Normal file
@ -0,0 +1,769 @@
|
|||||||
|
//Default styles
|
||||||
|
|
||||||
|
html {
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
*, *:before, *:after {
|
||||||
|
box-sizing: inherit;
|
||||||
|
}
|
||||||
|
|
||||||
|
body {
|
||||||
|
// display: flex;
|
||||||
|
// min-height: 100vh;
|
||||||
|
// flex-direction: column;
|
||||||
|
}
|
||||||
|
|
||||||
|
main {
|
||||||
|
// flex: 1 0 auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
button,
|
||||||
|
input,
|
||||||
|
optgroup,
|
||||||
|
select,
|
||||||
|
textarea {
|
||||||
|
font-family: $font-stack;
|
||||||
|
}
|
||||||
|
|
||||||
|
ul {
|
||||||
|
&:not(.browser-default) {
|
||||||
|
padding-left: 0;
|
||||||
|
list-style-type: none;
|
||||||
|
|
||||||
|
& > li {
|
||||||
|
list-style-type: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
a {
|
||||||
|
color: $link-color;
|
||||||
|
text-decoration: none;
|
||||||
|
|
||||||
|
// Gets rid of tap active state
|
||||||
|
-webkit-tap-highlight-color: transparent;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
// Positioning
|
||||||
|
.valign-wrapper {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
// classic clearfix
|
||||||
|
.clearfix {
|
||||||
|
clear: both;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
// Z-levels
|
||||||
|
.z-depth-0 {
|
||||||
|
box-shadow: none !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 2dp elevation modified*/
|
||||||
|
.z-depth-1 {
|
||||||
|
box-shadow: 0 2px 2px 0 rgba(0,0,0,0.14),
|
||||||
|
0 3px 1px -2px rgba(0,0,0,0.12),
|
||||||
|
0 1px 5px 0 rgba(0,0,0,0.2);
|
||||||
|
}
|
||||||
|
.z-depth-1-half {
|
||||||
|
box-shadow: 0 3px 3px 0 rgba(0, 0, 0, 0.14), 0 1px 7px 0 rgba(0, 0, 0, 0.12), 0 3px 1px -1px rgba(0, 0, 0, 0.2);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 6dp elevation modified*/
|
||||||
|
.z-depth-2 {
|
||||||
|
box-shadow: 0 4px 5px 0 rgba(0,0,0,0.14),
|
||||||
|
0 1px 10px 0 rgba(0,0,0,0.12),
|
||||||
|
0 2px 4px -1px rgba(0,0,0,0.3);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 12dp elevation modified*/
|
||||||
|
.z-depth-3 {
|
||||||
|
box-shadow: 0 8px 17px 2px rgba(0,0,0,0.14),
|
||||||
|
0 3px 14px 2px rgba(0,0,0,0.12),
|
||||||
|
0 5px 5px -3px rgba(0, 0, 0, 0.2);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 16dp elevation */
|
||||||
|
.z-depth-4 {
|
||||||
|
box-shadow: 0 16px 24px 2px rgba(0,0,0,0.14),
|
||||||
|
0 6px 30px 5px rgba(0,0,0,0.12),
|
||||||
|
0 8px 10px -7px rgba(0,0,0,0.2);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 24dp elevation */
|
||||||
|
.z-depth-5 {
|
||||||
|
box-shadow: 0 24px 38px 3px rgba(0,0,0,0.14),
|
||||||
|
0 9px 46px 8px rgba(0,0,0,0.12),
|
||||||
|
0 11px 15px -7px rgba(0,0,0,0.2);
|
||||||
|
}
|
||||||
|
|
||||||
|
.hoverable {
|
||||||
|
transition: box-shadow .25s;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
box-shadow: 0 8px 17px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Dividers
|
||||||
|
|
||||||
|
.divider {
|
||||||
|
height: 1px;
|
||||||
|
overflow: hidden;
|
||||||
|
background-color: color("grey", "lighten-2");
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
// Blockquote
|
||||||
|
|
||||||
|
blockquote {
|
||||||
|
margin: 20px 0;
|
||||||
|
padding-left: 1.5rem;
|
||||||
|
border-left: 5px solid $primary-color;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Icon Styles
|
||||||
|
|
||||||
|
i {
|
||||||
|
line-height: inherit;
|
||||||
|
|
||||||
|
&.left {
|
||||||
|
float: left;
|
||||||
|
margin-right: 15px;
|
||||||
|
}
|
||||||
|
&.right {
|
||||||
|
float: right;
|
||||||
|
margin-left: 15px;
|
||||||
|
}
|
||||||
|
&.tiny {
|
||||||
|
font-size: 1rem;
|
||||||
|
}
|
||||||
|
&.small {
|
||||||
|
font-size: 2rem;
|
||||||
|
}
|
||||||
|
&.medium {
|
||||||
|
font-size: 4rem;
|
||||||
|
}
|
||||||
|
&.large {
|
||||||
|
font-size: 6rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Images
|
||||||
|
img.responsive-img,
|
||||||
|
video.responsive-video {
|
||||||
|
max-width: 100%;
|
||||||
|
height: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
// Pagination
|
||||||
|
|
||||||
|
.pagination {
|
||||||
|
|
||||||
|
li {
|
||||||
|
display: inline-block;
|
||||||
|
border-radius: 2px;
|
||||||
|
text-align: center;
|
||||||
|
vertical-align: top;
|
||||||
|
height: 30px;
|
||||||
|
|
||||||
|
a {
|
||||||
|
color: #444;
|
||||||
|
display: inline-block;
|
||||||
|
font-size: 1.2rem;
|
||||||
|
padding: 0 10px;
|
||||||
|
line-height: 30px;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.active a { color: #fff; }
|
||||||
|
|
||||||
|
&.active { background-color: $primary-color; }
|
||||||
|
|
||||||
|
&.disabled a {
|
||||||
|
cursor: default;
|
||||||
|
color: #999;
|
||||||
|
}
|
||||||
|
|
||||||
|
i {
|
||||||
|
font-size: 2rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
li.pages ul li {
|
||||||
|
display: inline-block;
|
||||||
|
float: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@media #{$medium-and-down} {
|
||||||
|
.pagination {
|
||||||
|
width: 100%;
|
||||||
|
|
||||||
|
li.prev,
|
||||||
|
li.next {
|
||||||
|
width: 10%;
|
||||||
|
}
|
||||||
|
|
||||||
|
li.pages {
|
||||||
|
width: 80%;
|
||||||
|
overflow: hidden;
|
||||||
|
white-space: nowrap;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Breadcrumbs
|
||||||
|
.breadcrumb {
|
||||||
|
font-size: 18px;
|
||||||
|
color: rgba(255,255,255, .7);
|
||||||
|
|
||||||
|
i,
|
||||||
|
[class^="mdi-"], [class*="mdi-"],
|
||||||
|
i.material-icons {
|
||||||
|
display: inline-block;
|
||||||
|
float: left;
|
||||||
|
font-size: 24px;
|
||||||
|
}
|
||||||
|
|
||||||
|
&:before {
|
||||||
|
content: '\E5CC';
|
||||||
|
color: rgba(255,255,255, .7);
|
||||||
|
vertical-align: top;
|
||||||
|
display: inline-block;
|
||||||
|
font-family: 'Material Icons';
|
||||||
|
font-weight: normal;
|
||||||
|
font-style: normal;
|
||||||
|
font-size: 25px;
|
||||||
|
margin: 0 10px 0 8px;
|
||||||
|
-webkit-font-smoothing: antialiased;
|
||||||
|
}
|
||||||
|
|
||||||
|
&:first-child:before {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
&:last-child {
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Parallax
|
||||||
|
.parallax-container {
|
||||||
|
position: relative;
|
||||||
|
overflow: hidden;
|
||||||
|
height: 500px;
|
||||||
|
|
||||||
|
.parallax {
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
bottom: 0;
|
||||||
|
z-index: -1;
|
||||||
|
|
||||||
|
img {
|
||||||
|
opacity: 0;
|
||||||
|
position: absolute;
|
||||||
|
left: 50%;
|
||||||
|
bottom: 0;
|
||||||
|
min-width: 100%;
|
||||||
|
min-height: 100%;
|
||||||
|
transform: translate3d(0,0,0);
|
||||||
|
transform: translateX(-50%);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Pushpin
|
||||||
|
.pin-top, .pin-bottom {
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
.pinned {
|
||||||
|
position: fixed !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
/*********************
|
||||||
|
Transition Classes
|
||||||
|
**********************/
|
||||||
|
|
||||||
|
ul.staggered-list li {
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.fade-in {
|
||||||
|
opacity: 0;
|
||||||
|
transform-origin: 0 50%;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
/*********************
|
||||||
|
Media Query Classes
|
||||||
|
**********************/
|
||||||
|
.hide-on-small-only, .hide-on-small-and-down {
|
||||||
|
@media #{$small-and-down} {
|
||||||
|
display: none !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.hide-on-med-and-down {
|
||||||
|
@media #{$medium-and-down} {
|
||||||
|
display: none !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.hide-on-med-and-up {
|
||||||
|
@media #{$medium-and-up} {
|
||||||
|
display: none !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.hide-on-med-only {
|
||||||
|
@media only screen and (min-width: $small-screen) and (max-width: $medium-screen) {
|
||||||
|
display: none !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.hide-on-large-only {
|
||||||
|
@media #{$large-and-up} {
|
||||||
|
display: none !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.hide-on-extra-large-only {
|
||||||
|
@media #{$extra-large-and-up} {
|
||||||
|
display: none !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.show-on-extra-large {
|
||||||
|
@media #{$extra-large-and-up} {
|
||||||
|
display: block !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.show-on-large {
|
||||||
|
@media #{$large-and-up} {
|
||||||
|
display: block !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.show-on-medium {
|
||||||
|
@media only screen and (min-width: $small-screen) and (max-width: $medium-screen) {
|
||||||
|
display: block !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.show-on-small {
|
||||||
|
@media #{$small-and-down} {
|
||||||
|
display: block !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.show-on-medium-and-up {
|
||||||
|
@media #{$medium-and-up} {
|
||||||
|
display: block !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.show-on-medium-and-down {
|
||||||
|
@media #{$medium-and-down} {
|
||||||
|
display: block !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
// Center text on mobile
|
||||||
|
.center-on-small-only {
|
||||||
|
@media #{$small-and-down} {
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Footer
|
||||||
|
.page-footer {
|
||||||
|
padding-top: 20px;
|
||||||
|
color: $footer-font-color;
|
||||||
|
background-color: $footer-bg-color;
|
||||||
|
|
||||||
|
.footer-copyright {
|
||||||
|
overflow: hidden;
|
||||||
|
min-height: 50px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
padding: 10px 0px;
|
||||||
|
color: $footer-copyright-font-color;
|
||||||
|
background-color: $footer-copyright-bg-color;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Tables
|
||||||
|
table, th, td {
|
||||||
|
border: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
table {
|
||||||
|
width:100%;
|
||||||
|
display: table;
|
||||||
|
border-collapse: collapse;
|
||||||
|
border-spacing: 0;
|
||||||
|
|
||||||
|
&.striped {
|
||||||
|
tr {
|
||||||
|
border-bottom: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
> tbody {
|
||||||
|
> tr:nth-child(odd) {
|
||||||
|
background-color: $table-striped-color;
|
||||||
|
}
|
||||||
|
|
||||||
|
> tr > td {
|
||||||
|
border-radius: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&.highlight > tbody > tr {
|
||||||
|
transition: background-color .25s ease;
|
||||||
|
&:hover {
|
||||||
|
background-color: $table-striped-color;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&.centered {
|
||||||
|
thead tr th, tbody tr td {
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
tr {
|
||||||
|
border-bottom: 1px solid $table-border-color;
|
||||||
|
}
|
||||||
|
|
||||||
|
td, th{
|
||||||
|
padding: 15px 5px;
|
||||||
|
display: table-cell;
|
||||||
|
text-align: left;
|
||||||
|
vertical-align: middle;
|
||||||
|
border-radius: 2px;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Responsive Table
|
||||||
|
@media #{$medium-and-down} {
|
||||||
|
|
||||||
|
table.responsive-table {
|
||||||
|
width: 100%;
|
||||||
|
border-collapse: collapse;
|
||||||
|
border-spacing: 0;
|
||||||
|
display: block;
|
||||||
|
position: relative;
|
||||||
|
|
||||||
|
td:empty:before {
|
||||||
|
content: '\00a0';
|
||||||
|
}
|
||||||
|
|
||||||
|
th,
|
||||||
|
td {
|
||||||
|
margin: 0;
|
||||||
|
vertical-align: top;
|
||||||
|
}
|
||||||
|
|
||||||
|
th { text-align: left; }
|
||||||
|
thead {
|
||||||
|
display: block;
|
||||||
|
float: left;
|
||||||
|
|
||||||
|
tr {
|
||||||
|
display: block;
|
||||||
|
padding: 0 10px 0 0;
|
||||||
|
|
||||||
|
th::before {
|
||||||
|
content: "\00a0";
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
tbody {
|
||||||
|
display: block;
|
||||||
|
width: auto;
|
||||||
|
position: relative;
|
||||||
|
overflow-x: auto;
|
||||||
|
white-space: nowrap;
|
||||||
|
|
||||||
|
tr {
|
||||||
|
display: inline-block;
|
||||||
|
vertical-align: top;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
th {
|
||||||
|
display: block;
|
||||||
|
text-align: right;
|
||||||
|
}
|
||||||
|
td {
|
||||||
|
display: block;
|
||||||
|
min-height: 1.25em;
|
||||||
|
text-align: left;
|
||||||
|
}
|
||||||
|
tr {
|
||||||
|
border-bottom: none;
|
||||||
|
padding: 0 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* sort out borders */
|
||||||
|
thead {
|
||||||
|
border: 0;
|
||||||
|
border-right: 1px solid $table-border-color;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
// Collections
|
||||||
|
.collection {
|
||||||
|
margin: $element-top-margin 0 $element-bottom-margin 0;
|
||||||
|
border: 1px solid $collection-border-color;
|
||||||
|
border-radius: 2px;
|
||||||
|
overflow: hidden;
|
||||||
|
position: relative;
|
||||||
|
|
||||||
|
.collection-item {
|
||||||
|
background-color: $collection-bg-color;
|
||||||
|
line-height: $collection-line-height;
|
||||||
|
padding: 10px 20px;
|
||||||
|
margin: 0;
|
||||||
|
border-bottom: 1px solid $collection-border-color;
|
||||||
|
|
||||||
|
// Avatar Collection
|
||||||
|
&.avatar {
|
||||||
|
min-height: 84px;
|
||||||
|
padding-left: 72px;
|
||||||
|
position: relative;
|
||||||
|
|
||||||
|
// Don't style circles inside preloader classes.
|
||||||
|
&:not(.circle-clipper) > .circle,
|
||||||
|
:not(.circle-clipper) > .circle {
|
||||||
|
position: absolute;
|
||||||
|
width: 42px;
|
||||||
|
height: 42px;
|
||||||
|
overflow: hidden;
|
||||||
|
left: 15px;
|
||||||
|
display: inline-block;
|
||||||
|
vertical-align: middle;
|
||||||
|
}
|
||||||
|
i.circle {
|
||||||
|
font-size: 18px;
|
||||||
|
line-height: 42px;
|
||||||
|
color: #fff;
|
||||||
|
background-color: #999;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.title {
|
||||||
|
font-size: 16px;
|
||||||
|
}
|
||||||
|
|
||||||
|
p {
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.secondary-content {
|
||||||
|
position: absolute;
|
||||||
|
top: 16px;
|
||||||
|
right: 16px;
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
&:last-child {
|
||||||
|
border-bottom: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.active {
|
||||||
|
background-color: $collection-active-bg-color;
|
||||||
|
color: $collection-active-color;
|
||||||
|
|
||||||
|
.secondary-content {
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
a.collection-item{
|
||||||
|
display: block;
|
||||||
|
transition: .25s;
|
||||||
|
color: $collection-link-color;
|
||||||
|
&:not(.active) {
|
||||||
|
&:hover {
|
||||||
|
background-color: $collection-hover-bg-color;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&.with-header {
|
||||||
|
.collection-header {
|
||||||
|
background-color: $collection-bg-color;
|
||||||
|
border-bottom: 1px solid $collection-border-color;
|
||||||
|
padding: 10px 20px;
|
||||||
|
}
|
||||||
|
.collection-item {
|
||||||
|
padding-left: 30px;
|
||||||
|
}
|
||||||
|
.collection-item.avatar {
|
||||||
|
padding-left: 72px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
// Made less specific to allow easier overriding
|
||||||
|
.secondary-content {
|
||||||
|
float: right;
|
||||||
|
color: $secondary-color;
|
||||||
|
}
|
||||||
|
.collapsible .collection {
|
||||||
|
margin: 0;
|
||||||
|
border: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
// Responsive Videos
|
||||||
|
.video-container {
|
||||||
|
position: relative;
|
||||||
|
padding-bottom: 56.25%;
|
||||||
|
height: 0;
|
||||||
|
overflow: hidden;
|
||||||
|
|
||||||
|
iframe, object, embed {
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Progress Bar
|
||||||
|
.progress {
|
||||||
|
position: relative;
|
||||||
|
height: 4px;
|
||||||
|
display: block;
|
||||||
|
width: 100%;
|
||||||
|
background-color: lighten($progress-bar-color, 40%);
|
||||||
|
border-radius: 2px;
|
||||||
|
margin: $element-top-margin 0 $element-bottom-margin 0;
|
||||||
|
overflow: hidden;
|
||||||
|
.determinate {
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
bottom: 0;
|
||||||
|
background-color: $progress-bar-color;
|
||||||
|
transition: width .3s linear;
|
||||||
|
}
|
||||||
|
.indeterminate {
|
||||||
|
background-color: $progress-bar-color;
|
||||||
|
&:before {
|
||||||
|
content: '';
|
||||||
|
position: absolute;
|
||||||
|
background-color: inherit;
|
||||||
|
top: 0;
|
||||||
|
left:0;
|
||||||
|
bottom: 0;
|
||||||
|
will-change: left, right;
|
||||||
|
// Custom bezier
|
||||||
|
animation: indeterminate 2.1s cubic-bezier(0.650, 0.815, 0.735, 0.395) infinite;
|
||||||
|
|
||||||
|
}
|
||||||
|
&:after {
|
||||||
|
content: '';
|
||||||
|
position: absolute;
|
||||||
|
background-color: inherit;
|
||||||
|
top: 0;
|
||||||
|
left:0;
|
||||||
|
bottom: 0;
|
||||||
|
will-change: left, right;
|
||||||
|
// Custom bezier
|
||||||
|
animation: indeterminate-short 2.1s cubic-bezier(0.165, 0.840, 0.440, 1.000) infinite;
|
||||||
|
animation-delay: 1.15s;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@keyframes indeterminate {
|
||||||
|
0% {
|
||||||
|
left: -35%;
|
||||||
|
right:100%;
|
||||||
|
}
|
||||||
|
60% {
|
||||||
|
left: 100%;
|
||||||
|
right: -90%;
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
left: 100%;
|
||||||
|
right: -90%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes indeterminate-short {
|
||||||
|
0% {
|
||||||
|
left: -200%;
|
||||||
|
right: 100%;
|
||||||
|
}
|
||||||
|
60% {
|
||||||
|
left: 107%;
|
||||||
|
right: -8%;
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
left: 107%;
|
||||||
|
right: -8%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
/*******************
|
||||||
|
Utility Classes
|
||||||
|
*******************/
|
||||||
|
|
||||||
|
.hide {
|
||||||
|
display: none !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Text Align
|
||||||
|
.left-align {
|
||||||
|
text-align: left;
|
||||||
|
}
|
||||||
|
.right-align {
|
||||||
|
text-align: right
|
||||||
|
}
|
||||||
|
.center, .center-align {
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.left {
|
||||||
|
float: left !important;
|
||||||
|
}
|
||||||
|
.right {
|
||||||
|
float: right !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
// No Text Select
|
||||||
|
.no-select {
|
||||||
|
user-select: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.circle {
|
||||||
|
border-radius: 50%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.center-block {
|
||||||
|
display: block;
|
||||||
|
margin-left: auto;
|
||||||
|
margin-right: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.truncate {
|
||||||
|
display: block;
|
||||||
|
white-space: nowrap;
|
||||||
|
overflow: hidden;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
}
|
||||||
|
|
||||||
|
.no-padding {
|
||||||
|
padding: 0 !important;
|
||||||
|
}
|
||||||
156
app/static/external/materialize/sass/components/_grid.scss
vendored
Normal file
156
app/static/external/materialize/sass/components/_grid.scss
vendored
Normal file
@ -0,0 +1,156 @@
|
|||||||
|
.container {
|
||||||
|
margin: 0 auto;
|
||||||
|
max-width: 1280px;
|
||||||
|
width: 90%;
|
||||||
|
}
|
||||||
|
@media #{$medium-and-up} {
|
||||||
|
.container {
|
||||||
|
width: 85%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@media #{$large-and-up} {
|
||||||
|
.container {
|
||||||
|
width: 70%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.col .row {
|
||||||
|
margin-left: (-1 * $gutter-width / 2);
|
||||||
|
margin-right: (-1 * $gutter-width / 2);
|
||||||
|
}
|
||||||
|
|
||||||
|
.section {
|
||||||
|
padding-top: 1rem;
|
||||||
|
padding-bottom: 1rem;
|
||||||
|
|
||||||
|
&.no-pad {
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
&.no-pad-bot {
|
||||||
|
padding-bottom: 0;
|
||||||
|
}
|
||||||
|
&.no-pad-top {
|
||||||
|
padding-top: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
// Mixins to eliminate code repitition
|
||||||
|
@mixin reset-offset {
|
||||||
|
margin-left: auto;
|
||||||
|
left: auto;
|
||||||
|
right: auto;
|
||||||
|
}
|
||||||
|
@mixin grid-classes($size, $i, $perc) {
|
||||||
|
&.offset-#{$size}#{$i} {
|
||||||
|
margin-left: $perc;
|
||||||
|
}
|
||||||
|
&.pull-#{$size}#{$i} {
|
||||||
|
right: $perc;
|
||||||
|
}
|
||||||
|
&.push-#{$size}#{$i} {
|
||||||
|
left: $perc;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.row {
|
||||||
|
margin-left: auto;
|
||||||
|
margin-right: auto;
|
||||||
|
margin-bottom: 20px;
|
||||||
|
|
||||||
|
// Clear floating children
|
||||||
|
&:after {
|
||||||
|
content: "";
|
||||||
|
display: table;
|
||||||
|
clear: both;
|
||||||
|
}
|
||||||
|
|
||||||
|
.col {
|
||||||
|
float: left;
|
||||||
|
box-sizing: border-box;
|
||||||
|
padding: 0 $gutter-width / 2;
|
||||||
|
min-height: 1px;
|
||||||
|
|
||||||
|
&[class*="push-"],
|
||||||
|
&[class*="pull-"] {
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
$i: 1;
|
||||||
|
@while $i <= $num-cols {
|
||||||
|
$perc: unquote((100 / ($num-cols / $i)) + "%");
|
||||||
|
&.s#{$i} {
|
||||||
|
width: $perc;
|
||||||
|
@include reset-offset;
|
||||||
|
}
|
||||||
|
$i: $i + 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
$i: 1;
|
||||||
|
@while $i <= $num-cols {
|
||||||
|
$perc: unquote((100 / ($num-cols / $i)) + "%");
|
||||||
|
@include grid-classes("s", $i, $perc);
|
||||||
|
$i: $i + 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media #{$medium-and-up} {
|
||||||
|
|
||||||
|
$i: 1;
|
||||||
|
@while $i <= $num-cols {
|
||||||
|
$perc: unquote((100 / ($num-cols / $i)) + "%");
|
||||||
|
&.m#{$i} {
|
||||||
|
width: $perc;
|
||||||
|
@include reset-offset;
|
||||||
|
}
|
||||||
|
$i: $i + 1
|
||||||
|
}
|
||||||
|
|
||||||
|
$i: 1;
|
||||||
|
@while $i <= $num-cols {
|
||||||
|
$perc: unquote((100 / ($num-cols / $i)) + "%");
|
||||||
|
@include grid-classes("m", $i, $perc);
|
||||||
|
$i: $i + 1;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media #{$large-and-up} {
|
||||||
|
|
||||||
|
$i: 1;
|
||||||
|
@while $i <= $num-cols {
|
||||||
|
$perc: unquote((100 / ($num-cols / $i)) + "%");
|
||||||
|
&.l#{$i} {
|
||||||
|
width: $perc;
|
||||||
|
@include reset-offset;
|
||||||
|
}
|
||||||
|
$i: $i + 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
$i: 1;
|
||||||
|
@while $i <= $num-cols {
|
||||||
|
$perc: unquote((100 / ($num-cols / $i)) + "%");
|
||||||
|
@include grid-classes("l", $i, $perc);
|
||||||
|
$i: $i + 1;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media #{$extra-large-and-up} {
|
||||||
|
|
||||||
|
$i: 1;
|
||||||
|
@while $i <= $num-cols {
|
||||||
|
$perc: unquote((100 / ($num-cols / $i)) + "%");
|
||||||
|
&.xl#{$i} {
|
||||||
|
width: $perc;
|
||||||
|
@include reset-offset;
|
||||||
|
}
|
||||||
|
$i: $i + 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
$i: 1;
|
||||||
|
@while $i <= $num-cols {
|
||||||
|
$perc: unquote((100 / ($num-cols / $i)) + "%");
|
||||||
|
@include grid-classes("xl", $i, $perc);
|
||||||
|
$i: $i + 1;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
5
app/static/external/materialize/sass/components/_icons-material-design.scss
vendored
Normal file
5
app/static/external/materialize/sass/components/_icons-material-design.scss
vendored
Normal file
@ -0,0 +1,5 @@
|
|||||||
|
/* This is needed for some mobile phones to display the Google Icon font properly */
|
||||||
|
.material-icons {
|
||||||
|
text-rendering: optimizeLegibility;
|
||||||
|
font-feature-settings: 'liga';
|
||||||
|
}
|
||||||
43
app/static/external/materialize/sass/components/_materialbox.scss
vendored
Normal file
43
app/static/external/materialize/sass/components/_materialbox.scss
vendored
Normal file
@ -0,0 +1,43 @@
|
|||||||
|
.materialboxed {
|
||||||
|
&:hover {
|
||||||
|
&:not(.active) {
|
||||||
|
opacity: .8;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
display: block;
|
||||||
|
cursor: zoom-in;
|
||||||
|
position: relative;
|
||||||
|
transition: opacity .4s;
|
||||||
|
-webkit-backface-visibility: hidden;
|
||||||
|
|
||||||
|
&.active {
|
||||||
|
cursor: zoom-out;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
#materialbox-overlay {
|
||||||
|
position:fixed;
|
||||||
|
top: 0;
|
||||||
|
right: 0;
|
||||||
|
bottom: 0;
|
||||||
|
left: 0;
|
||||||
|
background-color: #292929;
|
||||||
|
z-index: 1000;
|
||||||
|
will-change: opacity;
|
||||||
|
}
|
||||||
|
|
||||||
|
.materialbox-caption {
|
||||||
|
position: fixed;
|
||||||
|
display: none;
|
||||||
|
color: #fff;
|
||||||
|
line-height: 50px;
|
||||||
|
bottom: 0;
|
||||||
|
left: 0;
|
||||||
|
width: 100%;
|
||||||
|
text-align: center;
|
||||||
|
padding: 0% 15%;
|
||||||
|
height: 50px;
|
||||||
|
z-index: 1000;
|
||||||
|
-webkit-font-smoothing: antialiased;
|
||||||
|
}
|
||||||
94
app/static/external/materialize/sass/components/_modal.scss
vendored
Normal file
94
app/static/external/materialize/sass/components/_modal.scss
vendored
Normal file
@ -0,0 +1,94 @@
|
|||||||
|
.modal {
|
||||||
|
&:focus {
|
||||||
|
outline: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
@extend .z-depth-5;
|
||||||
|
|
||||||
|
display: none;
|
||||||
|
position: fixed;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
background-color: #fafafa;
|
||||||
|
padding: 0;
|
||||||
|
max-height: 70%;
|
||||||
|
width: 55%;
|
||||||
|
margin: auto;
|
||||||
|
overflow-y: auto;
|
||||||
|
|
||||||
|
border-radius: 2px;
|
||||||
|
will-change: top, opacity;
|
||||||
|
|
||||||
|
@media #{$medium-and-down} {
|
||||||
|
width: 80%;
|
||||||
|
}
|
||||||
|
|
||||||
|
h1,h2,h3,h4 {
|
||||||
|
margin-top: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.modal-content {
|
||||||
|
padding: 24px;
|
||||||
|
}
|
||||||
|
.modal-close {
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
.modal-footer {
|
||||||
|
border-radius: 0 0 2px 2px;
|
||||||
|
background-color: #fafafa;
|
||||||
|
padding: 4px 6px;
|
||||||
|
height: 56px;
|
||||||
|
width: 100%;
|
||||||
|
text-align: right;
|
||||||
|
|
||||||
|
.btn, .btn-flat {
|
||||||
|
margin: 6px 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.modal-overlay {
|
||||||
|
position: fixed;
|
||||||
|
z-index: 999;
|
||||||
|
top: -25%;
|
||||||
|
left: 0;
|
||||||
|
bottom: 0;
|
||||||
|
right: 0;
|
||||||
|
height: 125%;
|
||||||
|
width: 100%;
|
||||||
|
background: #000;
|
||||||
|
display: none;
|
||||||
|
|
||||||
|
will-change: opacity;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Modal with fixed action footer
|
||||||
|
.modal.modal-fixed-footer {
|
||||||
|
padding: 0;
|
||||||
|
height: 70%;
|
||||||
|
|
||||||
|
.modal-content {
|
||||||
|
position: absolute;
|
||||||
|
height: calc(100% - 56px);
|
||||||
|
max-height: 100%;
|
||||||
|
width: 100%;
|
||||||
|
overflow-y: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.modal-footer {
|
||||||
|
border-top: 1px solid rgba(0,0,0,.1);
|
||||||
|
position: absolute;
|
||||||
|
bottom: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Modal Bottom Sheet Style
|
||||||
|
.modal.bottom-sheet {
|
||||||
|
top: auto;
|
||||||
|
bottom: -100%;
|
||||||
|
margin: 0;
|
||||||
|
width: 100%;
|
||||||
|
max-height: 45%;
|
||||||
|
border-radius: 0;
|
||||||
|
will-change: bottom, opacity;
|
||||||
|
}
|
||||||
208
app/static/external/materialize/sass/components/_navbar.scss
vendored
Normal file
208
app/static/external/materialize/sass/components/_navbar.scss
vendored
Normal file
@ -0,0 +1,208 @@
|
|||||||
|
nav {
|
||||||
|
&.nav-extended {
|
||||||
|
height: auto;
|
||||||
|
|
||||||
|
.nav-wrapper {
|
||||||
|
min-height: $navbar-height-mobile;
|
||||||
|
height: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav-content {
|
||||||
|
position: relative;
|
||||||
|
line-height: normal;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
color: $navbar-font-color;
|
||||||
|
@extend .z-depth-1;
|
||||||
|
background-color: $primary-color;
|
||||||
|
width: 100%;
|
||||||
|
height: $navbar-height-mobile;
|
||||||
|
line-height: $navbar-line-height-mobile;
|
||||||
|
|
||||||
|
a { color: $navbar-font-color; }
|
||||||
|
|
||||||
|
i,
|
||||||
|
[class^="mdi-"], [class*="mdi-"],
|
||||||
|
i.material-icons {
|
||||||
|
display: block;
|
||||||
|
font-size: 24px;
|
||||||
|
height: $navbar-height-mobile;
|
||||||
|
line-height: $navbar-line-height-mobile;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav-wrapper {
|
||||||
|
position: relative;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media #{$large-and-up} {
|
||||||
|
a.sidenav-trigger { display: none; }
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
// Collapse button
|
||||||
|
.sidenav-trigger {
|
||||||
|
float: left;
|
||||||
|
position: relative;
|
||||||
|
z-index: 1;
|
||||||
|
height: $navbar-height-mobile;
|
||||||
|
margin: 0 18px;
|
||||||
|
|
||||||
|
i {
|
||||||
|
height: $navbar-height-mobile;
|
||||||
|
line-height: $navbar-line-height-mobile;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
// Logo
|
||||||
|
.brand-logo {
|
||||||
|
position: absolute;
|
||||||
|
color: $navbar-font-color;
|
||||||
|
display: inline-block;
|
||||||
|
font-size: $navbar-brand-font-size;
|
||||||
|
padding: 0;
|
||||||
|
|
||||||
|
&.center {
|
||||||
|
left: 50%;
|
||||||
|
transform: translateX(-50%);
|
||||||
|
}
|
||||||
|
|
||||||
|
@media #{$medium-and-down} {
|
||||||
|
left: 50%;
|
||||||
|
transform: translateX(-50%);
|
||||||
|
|
||||||
|
&.left, &.right {
|
||||||
|
padding: 0;
|
||||||
|
transform: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.left { left: 0.5rem; }
|
||||||
|
&.right {
|
||||||
|
right: 0.5rem;
|
||||||
|
left: auto;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&.right {
|
||||||
|
right: 0.5rem;
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
i,
|
||||||
|
[class^="mdi-"], [class*="mdi-"],
|
||||||
|
i.material-icons {
|
||||||
|
float: left;
|
||||||
|
margin-right: 15px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
// Title
|
||||||
|
.nav-title {
|
||||||
|
display: inline-block;
|
||||||
|
font-size: 32px;
|
||||||
|
padding: 28px 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
// Navbar Links
|
||||||
|
ul {
|
||||||
|
margin: 0;
|
||||||
|
|
||||||
|
li {
|
||||||
|
transition: background-color .3s;
|
||||||
|
float: left;
|
||||||
|
padding: 0;
|
||||||
|
|
||||||
|
&.active {
|
||||||
|
background-color: rgba(0,0,0,.1);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
a {
|
||||||
|
transition: background-color .3s;
|
||||||
|
font-size: $navbar-font-size;
|
||||||
|
color: $navbar-font-color;
|
||||||
|
display: block;
|
||||||
|
padding: 0 15px;
|
||||||
|
cursor: pointer;
|
||||||
|
|
||||||
|
&.btn, &.btn-large, &.btn-flat, &.btn-floating {
|
||||||
|
margin-top: -2px;
|
||||||
|
margin-left: 15px;
|
||||||
|
margin-right: 15px;
|
||||||
|
|
||||||
|
& > .material-icons {
|
||||||
|
height: inherit;
|
||||||
|
line-height: inherit;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
background-color: rgba(0,0,0,.1);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&.left {
|
||||||
|
float: left;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Navbar Search Form
|
||||||
|
form {
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.input-field {
|
||||||
|
margin: 0;
|
||||||
|
height: 100%;
|
||||||
|
|
||||||
|
input {
|
||||||
|
height: 100%;
|
||||||
|
font-size: 1.2rem;
|
||||||
|
border: none;
|
||||||
|
padding-left: 2rem;
|
||||||
|
|
||||||
|
&:focus, &[type=text]:valid, &[type=password]:valid,
|
||||||
|
&[type=email]:valid, &[type=url]:valid, &[type=date]:valid {
|
||||||
|
border: none;
|
||||||
|
box-shadow: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
label {
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
|
||||||
|
i {
|
||||||
|
color: rgba(255,255,255,.7);
|
||||||
|
transition: color .3s;
|
||||||
|
}
|
||||||
|
&.active i { color: $navbar-font-color; }
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Fixed Navbar
|
||||||
|
.navbar-fixed {
|
||||||
|
position: relative;
|
||||||
|
height: $navbar-height-mobile;
|
||||||
|
z-index: 997;
|
||||||
|
|
||||||
|
nav {
|
||||||
|
position: fixed;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@media #{$medium-and-up} {
|
||||||
|
nav.nav-extended .nav-wrapper {
|
||||||
|
min-height: $navbar-height;
|
||||||
|
}
|
||||||
|
nav, nav .nav-wrapper i, nav a.sidenav-trigger, nav a.sidenav-trigger i {
|
||||||
|
height: $navbar-height;
|
||||||
|
line-height: $navbar-line-height;
|
||||||
|
}
|
||||||
|
.navbar-fixed {
|
||||||
|
height: $navbar-height;
|
||||||
|
}
|
||||||
|
}
|
||||||
447
app/static/external/materialize/sass/components/_normalize.scss
vendored
Normal file
447
app/static/external/materialize/sass/components/_normalize.scss
vendored
Normal file
@ -0,0 +1,447 @@
|
|||||||
|
/*! normalize.css v7.0.0 | MIT License | github.com/necolas/normalize.css */
|
||||||
|
|
||||||
|
/* Document
|
||||||
|
========================================================================== */
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 1. Correct the line height in all browsers.
|
||||||
|
* 2. Prevent adjustments of font size after orientation changes in
|
||||||
|
* IE on Windows Phone and in iOS.
|
||||||
|
*/
|
||||||
|
|
||||||
|
html {
|
||||||
|
line-height: 1.15; /* 1 */
|
||||||
|
-ms-text-size-adjust: 100%; /* 2 */
|
||||||
|
-webkit-text-size-adjust: 100%; /* 2 */
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Sections
|
||||||
|
========================================================================== */
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Remove the margin in all browsers (opinionated).
|
||||||
|
*/
|
||||||
|
|
||||||
|
body {
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Add the correct display in IE 9-.
|
||||||
|
*/
|
||||||
|
|
||||||
|
article,
|
||||||
|
aside,
|
||||||
|
footer,
|
||||||
|
header,
|
||||||
|
nav,
|
||||||
|
section {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Correct the font size and margin on `h1` elements within `section` and
|
||||||
|
* `article` contexts in Chrome, Firefox, and Safari.
|
||||||
|
*/
|
||||||
|
|
||||||
|
h1 {
|
||||||
|
font-size: 2em;
|
||||||
|
margin: 0.67em 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Grouping content
|
||||||
|
========================================================================== */
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Add the correct display in IE 9-.
|
||||||
|
* 1. Add the correct display in IE.
|
||||||
|
*/
|
||||||
|
|
||||||
|
figcaption,
|
||||||
|
figure,
|
||||||
|
main { /* 1 */
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Add the correct margin in IE 8.
|
||||||
|
*/
|
||||||
|
|
||||||
|
figure {
|
||||||
|
margin: 1em 40px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 1. Add the correct box sizing in Firefox.
|
||||||
|
* 2. Show the overflow in Edge and IE.
|
||||||
|
*/
|
||||||
|
|
||||||
|
hr {
|
||||||
|
box-sizing: content-box; /* 1 */
|
||||||
|
height: 0; /* 1 */
|
||||||
|
overflow: visible; /* 2 */
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 1. Correct the inheritance and scaling of font size in all browsers.
|
||||||
|
* 2. Correct the odd `em` font sizing in all browsers.
|
||||||
|
*/
|
||||||
|
|
||||||
|
pre {
|
||||||
|
font-family: monospace, monospace; /* 1 */
|
||||||
|
font-size: 1em; /* 2 */
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Text-level semantics
|
||||||
|
========================================================================== */
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 1. Remove the gray background on active links in IE 10.
|
||||||
|
* 2. Remove gaps in links underline in iOS 8+ and Safari 8+.
|
||||||
|
*/
|
||||||
|
|
||||||
|
a {
|
||||||
|
background-color: transparent; /* 1 */
|
||||||
|
-webkit-text-decoration-skip: objects; /* 2 */
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 1. Remove the bottom border in Chrome 57- and Firefox 39-.
|
||||||
|
* 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
|
||||||
|
*/
|
||||||
|
|
||||||
|
abbr[title] {
|
||||||
|
border-bottom: none; /* 1 */
|
||||||
|
text-decoration: underline; /* 2 */
|
||||||
|
text-decoration: underline dotted; /* 2 */
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Prevent the duplicate application of `bolder` by the next rule in Safari 6.
|
||||||
|
*/
|
||||||
|
|
||||||
|
b,
|
||||||
|
strong {
|
||||||
|
font-weight: inherit;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Add the correct font weight in Chrome, Edge, and Safari.
|
||||||
|
*/
|
||||||
|
|
||||||
|
b,
|
||||||
|
strong {
|
||||||
|
font-weight: bolder;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 1. Correct the inheritance and scaling of font size in all browsers.
|
||||||
|
* 2. Correct the odd `em` font sizing in all browsers.
|
||||||
|
*/
|
||||||
|
|
||||||
|
code,
|
||||||
|
kbd,
|
||||||
|
samp {
|
||||||
|
font-family: monospace, monospace; /* 1 */
|
||||||
|
font-size: 1em; /* 2 */
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Add the correct font style in Android 4.3-.
|
||||||
|
*/
|
||||||
|
|
||||||
|
dfn {
|
||||||
|
font-style: italic;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Add the correct background and color in IE 9-.
|
||||||
|
*/
|
||||||
|
|
||||||
|
mark {
|
||||||
|
background-color: #ff0;
|
||||||
|
color: #000;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Add the correct font size in all browsers.
|
||||||
|
*/
|
||||||
|
|
||||||
|
small {
|
||||||
|
font-size: 80%;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Prevent `sub` and `sup` elements from affecting the line height in
|
||||||
|
* all browsers.
|
||||||
|
*/
|
||||||
|
|
||||||
|
sub,
|
||||||
|
sup {
|
||||||
|
font-size: 75%;
|
||||||
|
line-height: 0;
|
||||||
|
position: relative;
|
||||||
|
vertical-align: baseline;
|
||||||
|
}
|
||||||
|
|
||||||
|
sub {
|
||||||
|
bottom: -0.25em;
|
||||||
|
}
|
||||||
|
|
||||||
|
sup {
|
||||||
|
top: -0.5em;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Embedded content
|
||||||
|
========================================================================== */
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Add the correct display in IE 9-.
|
||||||
|
*/
|
||||||
|
|
||||||
|
audio,
|
||||||
|
video {
|
||||||
|
display: inline-block;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Add the correct display in iOS 4-7.
|
||||||
|
*/
|
||||||
|
|
||||||
|
audio:not([controls]) {
|
||||||
|
display: none;
|
||||||
|
height: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Remove the border on images inside links in IE 10-.
|
||||||
|
*/
|
||||||
|
|
||||||
|
img {
|
||||||
|
border-style: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Hide the overflow in IE.
|
||||||
|
*/
|
||||||
|
|
||||||
|
svg:not(:root) {
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Forms
|
||||||
|
========================================================================== */
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 1. Change the font styles in all browsers (opinionated).
|
||||||
|
* 2. Remove the margin in Firefox and Safari.
|
||||||
|
*/
|
||||||
|
|
||||||
|
button,
|
||||||
|
input,
|
||||||
|
optgroup,
|
||||||
|
select,
|
||||||
|
textarea {
|
||||||
|
font-family: sans-serif; /* 1 */
|
||||||
|
font-size: 100%; /* 1 */
|
||||||
|
line-height: 1.15; /* 1 */
|
||||||
|
margin: 0; /* 2 */
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Show the overflow in IE.
|
||||||
|
* 1. Show the overflow in Edge.
|
||||||
|
*/
|
||||||
|
|
||||||
|
button,
|
||||||
|
input { /* 1 */
|
||||||
|
overflow: visible;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Remove the inheritance of text transform in Edge, Firefox, and IE.
|
||||||
|
* 1. Remove the inheritance of text transform in Firefox.
|
||||||
|
*/
|
||||||
|
|
||||||
|
button,
|
||||||
|
select { /* 1 */
|
||||||
|
text-transform: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 1. Prevent a WebKit bug where (2) destroys native `audio` and `video`
|
||||||
|
* controls in Android 4.
|
||||||
|
* 2. Correct the inability to style clickable types in iOS and Safari.
|
||||||
|
*/
|
||||||
|
|
||||||
|
button,
|
||||||
|
html [type="button"], /* 1 */
|
||||||
|
[type="reset"],
|
||||||
|
[type="submit"] {
|
||||||
|
-webkit-appearance: button; /* 2 */
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Remove the inner border and padding in Firefox.
|
||||||
|
*/
|
||||||
|
|
||||||
|
button::-moz-focus-inner,
|
||||||
|
[type="button"]::-moz-focus-inner,
|
||||||
|
[type="reset"]::-moz-focus-inner,
|
||||||
|
[type="submit"]::-moz-focus-inner {
|
||||||
|
border-style: none;
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Restore the focus styles unset by the previous rule.
|
||||||
|
*/
|
||||||
|
|
||||||
|
button:-moz-focusring,
|
||||||
|
[type="button"]:-moz-focusring,
|
||||||
|
[type="reset"]:-moz-focusring,
|
||||||
|
[type="submit"]:-moz-focusring {
|
||||||
|
outline: 1px dotted ButtonText;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Correct the padding in Firefox.
|
||||||
|
*/
|
||||||
|
|
||||||
|
fieldset {
|
||||||
|
padding: 0.35em 0.75em 0.625em;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 1. Correct the text wrapping in Edge and IE.
|
||||||
|
* 2. Correct the color inheritance from `fieldset` elements in IE.
|
||||||
|
* 3. Remove the padding so developers are not caught out when they zero out
|
||||||
|
* `fieldset` elements in all browsers.
|
||||||
|
*/
|
||||||
|
|
||||||
|
legend {
|
||||||
|
box-sizing: border-box; /* 1 */
|
||||||
|
color: inherit; /* 2 */
|
||||||
|
display: table; /* 1 */
|
||||||
|
max-width: 100%; /* 1 */
|
||||||
|
padding: 0; /* 3 */
|
||||||
|
white-space: normal; /* 1 */
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 1. Add the correct display in IE 9-.
|
||||||
|
* 2. Add the correct vertical alignment in Chrome, Firefox, and Opera.
|
||||||
|
*/
|
||||||
|
|
||||||
|
progress {
|
||||||
|
display: inline-block; /* 1 */
|
||||||
|
vertical-align: baseline; /* 2 */
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Remove the default vertical scrollbar in IE.
|
||||||
|
*/
|
||||||
|
|
||||||
|
textarea {
|
||||||
|
overflow: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 1. Add the correct box sizing in IE 10-.
|
||||||
|
* 2. Remove the padding in IE 10-.
|
||||||
|
*/
|
||||||
|
|
||||||
|
[type="checkbox"],
|
||||||
|
[type="radio"] {
|
||||||
|
box-sizing: border-box; /* 1 */
|
||||||
|
padding: 0; /* 2 */
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Correct the cursor style of increment and decrement buttons in Chrome.
|
||||||
|
*/
|
||||||
|
|
||||||
|
[type="number"]::-webkit-inner-spin-button,
|
||||||
|
[type="number"]::-webkit-outer-spin-button {
|
||||||
|
height: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 1. Correct the odd appearance in Chrome and Safari.
|
||||||
|
* 2. Correct the outline style in Safari.
|
||||||
|
*/
|
||||||
|
|
||||||
|
[type="search"] {
|
||||||
|
-webkit-appearance: textfield; /* 1 */
|
||||||
|
outline-offset: -2px; /* 2 */
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Remove the inner padding and cancel buttons in Chrome and Safari on macOS.
|
||||||
|
*/
|
||||||
|
|
||||||
|
[type="search"]::-webkit-search-cancel-button,
|
||||||
|
[type="search"]::-webkit-search-decoration {
|
||||||
|
-webkit-appearance: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 1. Correct the inability to style clickable types in iOS and Safari.
|
||||||
|
* 2. Change font properties to `inherit` in Safari.
|
||||||
|
*/
|
||||||
|
|
||||||
|
::-webkit-file-upload-button {
|
||||||
|
-webkit-appearance: button; /* 1 */
|
||||||
|
font: inherit; /* 2 */
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Interactive
|
||||||
|
========================================================================== */
|
||||||
|
|
||||||
|
/*
|
||||||
|
* Add the correct display in IE 9-.
|
||||||
|
* 1. Add the correct display in Edge, IE, and Firefox.
|
||||||
|
*/
|
||||||
|
|
||||||
|
details, /* 1 */
|
||||||
|
menu {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
|
||||||
|
/*
|
||||||
|
* Add the correct display in all browsers.
|
||||||
|
*/
|
||||||
|
|
||||||
|
summary {
|
||||||
|
display: list-item;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Scripting
|
||||||
|
========================================================================== */
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Add the correct display in IE 9-.
|
||||||
|
*/
|
||||||
|
|
||||||
|
canvas {
|
||||||
|
display: inline-block;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Add the correct display in IE.
|
||||||
|
*/
|
||||||
|
|
||||||
|
template {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Hidden
|
||||||
|
========================================================================== */
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Add the correct display in IE 10-.
|
||||||
|
*/
|
||||||
|
|
||||||
|
[hidden] {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
334
app/static/external/materialize/sass/components/_preloader.scss
vendored
Normal file
334
app/static/external/materialize/sass/components/_preloader.scss
vendored
Normal file
@ -0,0 +1,334 @@
|
|||||||
|
/*
|
||||||
|
@license
|
||||||
|
Copyright (c) 2014 The Polymer Project Authors. All rights reserved.
|
||||||
|
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
|
||||||
|
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
|
||||||
|
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
|
||||||
|
Code distributed by Google as part of the polymer project is also
|
||||||
|
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
|
||||||
|
*/
|
||||||
|
|
||||||
|
/**************************/
|
||||||
|
/* STYLES FOR THE SPINNER */
|
||||||
|
/**************************/
|
||||||
|
|
||||||
|
/*
|
||||||
|
* Constants:
|
||||||
|
* STROKEWIDTH = 3px
|
||||||
|
* ARCSIZE = 270 degrees (amount of circle the arc takes up)
|
||||||
|
* ARCTIME = 1333ms (time it takes to expand and contract arc)
|
||||||
|
* ARCSTARTROT = 216 degrees (how much the start location of the arc
|
||||||
|
* should rotate each time, 216 gives us a
|
||||||
|
* 5 pointed star shape (it's 360/5 * 3).
|
||||||
|
* For a 7 pointed star, we might do
|
||||||
|
* 360/7 * 3 = 154.286)
|
||||||
|
* CONTAINERWIDTH = 28px
|
||||||
|
* SHRINK_TIME = 400ms
|
||||||
|
*/
|
||||||
|
|
||||||
|
|
||||||
|
.preloader-wrapper {
|
||||||
|
display: inline-block;
|
||||||
|
position: relative;
|
||||||
|
width: 50px;
|
||||||
|
height: 50px;
|
||||||
|
|
||||||
|
&.small {
|
||||||
|
width: 36px;
|
||||||
|
height: 36px;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.big {
|
||||||
|
width: 64px;
|
||||||
|
height: 64px;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.active {
|
||||||
|
/* duration: 360 * ARCTIME / (ARCSTARTROT + (360-ARCSIZE)) */
|
||||||
|
-webkit-animation: container-rotate 1568ms linear infinite;
|
||||||
|
animation: container-rotate 1568ms linear infinite;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@-webkit-keyframes container-rotate {
|
||||||
|
to { -webkit-transform: rotate(360deg) }
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes container-rotate {
|
||||||
|
to { transform: rotate(360deg) }
|
||||||
|
}
|
||||||
|
|
||||||
|
.spinner-layer {
|
||||||
|
position: absolute;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
opacity: 0;
|
||||||
|
border-color: $spinner-default-color;
|
||||||
|
}
|
||||||
|
|
||||||
|
.spinner-blue,
|
||||||
|
.spinner-blue-only {
|
||||||
|
border-color: #4285f4;
|
||||||
|
}
|
||||||
|
|
||||||
|
.spinner-red,
|
||||||
|
.spinner-red-only {
|
||||||
|
border-color: #db4437;
|
||||||
|
}
|
||||||
|
|
||||||
|
.spinner-yellow,
|
||||||
|
.spinner-yellow-only {
|
||||||
|
border-color: #f4b400;
|
||||||
|
}
|
||||||
|
|
||||||
|
.spinner-green,
|
||||||
|
.spinner-green-only {
|
||||||
|
border-color: #0f9d58;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* IMPORTANT NOTE ABOUT CSS ANIMATION PROPERTIES (keanulee):
|
||||||
|
*
|
||||||
|
* iOS Safari (tested on iOS 8.1) does not handle animation-delay very well - it doesn't
|
||||||
|
* guarantee that the animation will start _exactly_ after that value. So we avoid using
|
||||||
|
* animation-delay and instead set custom keyframes for each color (as redundant as it
|
||||||
|
* seems).
|
||||||
|
*
|
||||||
|
* We write out each animation in full (instead of separating animation-name,
|
||||||
|
* animation-duration, etc.) because under the polyfill, Safari does not recognize those
|
||||||
|
* specific properties properly, treats them as -webkit-animation, and overrides the
|
||||||
|
* other animation rules. See https://github.com/Polymer/platform/issues/53.
|
||||||
|
*/
|
||||||
|
.active .spinner-layer.spinner-blue {
|
||||||
|
/* durations: 4 * ARCTIME */
|
||||||
|
-webkit-animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both, blue-fade-in-out 5332ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both;
|
||||||
|
animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both, blue-fade-in-out 5332ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both;
|
||||||
|
}
|
||||||
|
|
||||||
|
.active .spinner-layer.spinner-red {
|
||||||
|
/* durations: 4 * ARCTIME */
|
||||||
|
-webkit-animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both, red-fade-in-out 5332ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both;
|
||||||
|
animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both, red-fade-in-out 5332ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both;
|
||||||
|
}
|
||||||
|
|
||||||
|
.active .spinner-layer.spinner-yellow {
|
||||||
|
/* durations: 4 * ARCTIME */
|
||||||
|
-webkit-animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both, yellow-fade-in-out 5332ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both;
|
||||||
|
animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both, yellow-fade-in-out 5332ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both;
|
||||||
|
}
|
||||||
|
|
||||||
|
.active .spinner-layer.spinner-green {
|
||||||
|
/* durations: 4 * ARCTIME */
|
||||||
|
-webkit-animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both, green-fade-in-out 5332ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both;
|
||||||
|
animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both, green-fade-in-out 5332ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both;
|
||||||
|
}
|
||||||
|
|
||||||
|
.active .spinner-layer,
|
||||||
|
.active .spinner-layer.spinner-blue-only,
|
||||||
|
.active .spinner-layer.spinner-red-only,
|
||||||
|
.active .spinner-layer.spinner-yellow-only,
|
||||||
|
.active .spinner-layer.spinner-green-only {
|
||||||
|
/* durations: 4 * ARCTIME */
|
||||||
|
opacity: 1;
|
||||||
|
-webkit-animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both;
|
||||||
|
animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both;
|
||||||
|
}
|
||||||
|
|
||||||
|
@-webkit-keyframes fill-unfill-rotate {
|
||||||
|
12.5% { -webkit-transform: rotate(135deg); } /* 0.5 * ARCSIZE */
|
||||||
|
25% { -webkit-transform: rotate(270deg); } /* 1 * ARCSIZE */
|
||||||
|
37.5% { -webkit-transform: rotate(405deg); } /* 1.5 * ARCSIZE */
|
||||||
|
50% { -webkit-transform: rotate(540deg); } /* 2 * ARCSIZE */
|
||||||
|
62.5% { -webkit-transform: rotate(675deg); } /* 2.5 * ARCSIZE */
|
||||||
|
75% { -webkit-transform: rotate(810deg); } /* 3 * ARCSIZE */
|
||||||
|
87.5% { -webkit-transform: rotate(945deg); } /* 3.5 * ARCSIZE */
|
||||||
|
to { -webkit-transform: rotate(1080deg); } /* 4 * ARCSIZE */
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes fill-unfill-rotate {
|
||||||
|
12.5% { transform: rotate(135deg); } /* 0.5 * ARCSIZE */
|
||||||
|
25% { transform: rotate(270deg); } /* 1 * ARCSIZE */
|
||||||
|
37.5% { transform: rotate(405deg); } /* 1.5 * ARCSIZE */
|
||||||
|
50% { transform: rotate(540deg); } /* 2 * ARCSIZE */
|
||||||
|
62.5% { transform: rotate(675deg); } /* 2.5 * ARCSIZE */
|
||||||
|
75% { transform: rotate(810deg); } /* 3 * ARCSIZE */
|
||||||
|
87.5% { transform: rotate(945deg); } /* 3.5 * ARCSIZE */
|
||||||
|
to { transform: rotate(1080deg); } /* 4 * ARCSIZE */
|
||||||
|
}
|
||||||
|
|
||||||
|
@-webkit-keyframes blue-fade-in-out {
|
||||||
|
from { opacity: 1; }
|
||||||
|
25% { opacity: 1; }
|
||||||
|
26% { opacity: 0; }
|
||||||
|
89% { opacity: 0; }
|
||||||
|
90% { opacity: 1; }
|
||||||
|
100% { opacity: 1; }
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes blue-fade-in-out {
|
||||||
|
from { opacity: 1; }
|
||||||
|
25% { opacity: 1; }
|
||||||
|
26% { opacity: 0; }
|
||||||
|
89% { opacity: 0; }
|
||||||
|
90% { opacity: 1; }
|
||||||
|
100% { opacity: 1; }
|
||||||
|
}
|
||||||
|
|
||||||
|
@-webkit-keyframes red-fade-in-out {
|
||||||
|
from { opacity: 0; }
|
||||||
|
15% { opacity: 0; }
|
||||||
|
25% { opacity: 1; }
|
||||||
|
50% { opacity: 1; }
|
||||||
|
51% { opacity: 0; }
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes red-fade-in-out {
|
||||||
|
from { opacity: 0; }
|
||||||
|
15% { opacity: 0; }
|
||||||
|
25% { opacity: 1; }
|
||||||
|
50% { opacity: 1; }
|
||||||
|
51% { opacity: 0; }
|
||||||
|
}
|
||||||
|
|
||||||
|
@-webkit-keyframes yellow-fade-in-out {
|
||||||
|
from { opacity: 0; }
|
||||||
|
40% { opacity: 0; }
|
||||||
|
50% { opacity: 1; }
|
||||||
|
75% { opacity: 1; }
|
||||||
|
76% { opacity: 0; }
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes yellow-fade-in-out {
|
||||||
|
from { opacity: 0; }
|
||||||
|
40% { opacity: 0; }
|
||||||
|
50% { opacity: 1; }
|
||||||
|
75% { opacity: 1; }
|
||||||
|
76% { opacity: 0; }
|
||||||
|
}
|
||||||
|
|
||||||
|
@-webkit-keyframes green-fade-in-out {
|
||||||
|
from { opacity: 0; }
|
||||||
|
65% { opacity: 0; }
|
||||||
|
75% { opacity: 1; }
|
||||||
|
90% { opacity: 1; }
|
||||||
|
100% { opacity: 0; }
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes green-fade-in-out {
|
||||||
|
from { opacity: 0; }
|
||||||
|
65% { opacity: 0; }
|
||||||
|
75% { opacity: 1; }
|
||||||
|
90% { opacity: 1; }
|
||||||
|
100% { opacity: 0; }
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Patch the gap that appear between the two adjacent div.circle-clipper while the
|
||||||
|
* spinner is rotating (appears on Chrome 38, Safari 7.1, and IE 11).
|
||||||
|
*/
|
||||||
|
.gap-patch {
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 45%;
|
||||||
|
width: 10%;
|
||||||
|
height: 100%;
|
||||||
|
overflow: hidden;
|
||||||
|
border-color: inherit;
|
||||||
|
}
|
||||||
|
|
||||||
|
.gap-patch .circle {
|
||||||
|
width: 1000%;
|
||||||
|
left: -450%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.circle-clipper {
|
||||||
|
display: inline-block;
|
||||||
|
position: relative;
|
||||||
|
width: 50%;
|
||||||
|
height: 100%;
|
||||||
|
overflow: hidden;
|
||||||
|
border-color: inherit;
|
||||||
|
|
||||||
|
.circle {
|
||||||
|
width: 200%;
|
||||||
|
height: 100%;
|
||||||
|
border-width: 3px; /* STROKEWIDTH */
|
||||||
|
border-style: solid;
|
||||||
|
border-color: inherit;
|
||||||
|
border-bottom-color: transparent !important;
|
||||||
|
border-radius: 50%;
|
||||||
|
-webkit-animation: none;
|
||||||
|
animation: none;
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
right: 0;
|
||||||
|
bottom: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.left .circle {
|
||||||
|
left: 0;
|
||||||
|
border-right-color: transparent !important;
|
||||||
|
-webkit-transform: rotate(129deg);
|
||||||
|
transform: rotate(129deg);
|
||||||
|
}
|
||||||
|
&.right .circle {
|
||||||
|
left: -100%;
|
||||||
|
border-left-color: transparent !important;
|
||||||
|
-webkit-transform: rotate(-129deg);
|
||||||
|
transform: rotate(-129deg);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
.active .circle-clipper.left .circle {
|
||||||
|
/* duration: ARCTIME */
|
||||||
|
-webkit-animation: left-spin 1333ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both;
|
||||||
|
animation: left-spin 1333ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both;
|
||||||
|
}
|
||||||
|
|
||||||
|
.active .circle-clipper.right .circle {
|
||||||
|
/* duration: ARCTIME */
|
||||||
|
-webkit-animation: right-spin 1333ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both;
|
||||||
|
animation: right-spin 1333ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both;
|
||||||
|
}
|
||||||
|
|
||||||
|
@-webkit-keyframes left-spin {
|
||||||
|
from { -webkit-transform: rotate(130deg); }
|
||||||
|
50% { -webkit-transform: rotate(-5deg); }
|
||||||
|
to { -webkit-transform: rotate(130deg); }
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes left-spin {
|
||||||
|
from { transform: rotate(130deg); }
|
||||||
|
50% { transform: rotate(-5deg); }
|
||||||
|
to { transform: rotate(130deg); }
|
||||||
|
}
|
||||||
|
|
||||||
|
@-webkit-keyframes right-spin {
|
||||||
|
from { -webkit-transform: rotate(-130deg); }
|
||||||
|
50% { -webkit-transform: rotate(5deg); }
|
||||||
|
to { -webkit-transform: rotate(-130deg); }
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes right-spin {
|
||||||
|
from { transform: rotate(-130deg); }
|
||||||
|
50% { transform: rotate(5deg); }
|
||||||
|
to { transform: rotate(-130deg); }
|
||||||
|
}
|
||||||
|
|
||||||
|
#spinnerContainer.cooldown {
|
||||||
|
/* duration: SHRINK_TIME */
|
||||||
|
-webkit-animation: container-rotate 1568ms linear infinite, fade-out 400ms cubic-bezier(0.4, 0.0, 0.2, 1);
|
||||||
|
animation: container-rotate 1568ms linear infinite, fade-out 400ms cubic-bezier(0.4, 0.0, 0.2, 1);
|
||||||
|
}
|
||||||
|
|
||||||
|
@-webkit-keyframes fade-out {
|
||||||
|
from { opacity: 1; }
|
||||||
|
to { opacity: 0; }
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes fade-out {
|
||||||
|
from { opacity: 1; }
|
||||||
|
to { opacity: 0; }
|
||||||
|
}
|
||||||
34
app/static/external/materialize/sass/components/_pulse.scss
vendored
Normal file
34
app/static/external/materialize/sass/components/_pulse.scss
vendored
Normal file
@ -0,0 +1,34 @@
|
|||||||
|
.pulse {
|
||||||
|
&::before {
|
||||||
|
content: '';
|
||||||
|
display: block;
|
||||||
|
position: absolute;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
background-color: inherit;
|
||||||
|
border-radius: inherit;
|
||||||
|
transition: opacity .3s, transform .3s;
|
||||||
|
animation: pulse-animation 1s cubic-bezier(0.24, 0, 0.38, 1) infinite;
|
||||||
|
z-index: -1;
|
||||||
|
}
|
||||||
|
|
||||||
|
overflow: visible;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes pulse-animation {
|
||||||
|
0% {
|
||||||
|
opacity: 1;
|
||||||
|
transform: scale(1);
|
||||||
|
}
|
||||||
|
50% {
|
||||||
|
opacity: 0;
|
||||||
|
transform: scale(1.5);
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
opacity: 0;
|
||||||
|
transform: scale(1.5);
|
||||||
|
}
|
||||||
|
}
|
||||||
216
app/static/external/materialize/sass/components/_sidenav.scss
vendored
Normal file
216
app/static/external/materialize/sass/components/_sidenav.scss
vendored
Normal file
@ -0,0 +1,216 @@
|
|||||||
|
.sidenav {
|
||||||
|
position: fixed;
|
||||||
|
width: $sidenav-width;
|
||||||
|
left: 0;
|
||||||
|
top: 0;
|
||||||
|
margin: 0;
|
||||||
|
transform: translateX(-100%);
|
||||||
|
height: 100%;
|
||||||
|
height: calc(100% + 60px);
|
||||||
|
height: -moz-calc(100%); //Temporary Firefox Fix
|
||||||
|
padding-bottom: 60px;
|
||||||
|
background-color: $sidenav-bg-color;
|
||||||
|
z-index: 999;
|
||||||
|
overflow-y: auto;
|
||||||
|
will-change: transform;
|
||||||
|
backface-visibility: hidden;
|
||||||
|
transform: translateX(-105%);
|
||||||
|
|
||||||
|
@extend .z-depth-1;
|
||||||
|
|
||||||
|
// Right Align
|
||||||
|
&.right-aligned {
|
||||||
|
right: 0;
|
||||||
|
transform: translateX(105%);
|
||||||
|
left: auto;
|
||||||
|
transform: translateX(100%);
|
||||||
|
}
|
||||||
|
|
||||||
|
.collapsible {
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
li {
|
||||||
|
float: none;
|
||||||
|
line-height: $sidenav-line-height;
|
||||||
|
|
||||||
|
&.active { background-color: rgba(0,0,0,.05); }
|
||||||
|
}
|
||||||
|
|
||||||
|
li > a {
|
||||||
|
color: $sidenav-font-color;
|
||||||
|
display: block;
|
||||||
|
font-size: $sidenav-font-size;
|
||||||
|
font-weight: 500;
|
||||||
|
height: $sidenav-item-height;
|
||||||
|
line-height: $sidenav-line-height;
|
||||||
|
padding: 0 ($sidenav-padding * 2);
|
||||||
|
|
||||||
|
&:hover { background-color: rgba(0,0,0,.05);}
|
||||||
|
|
||||||
|
&.btn, &.btn-large, &.btn-flat, &.btn-floating {
|
||||||
|
margin: 10px 15px;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.btn,
|
||||||
|
&.btn-large,
|
||||||
|
&.btn-floating { color: $button-raised-color; }
|
||||||
|
&.btn-flat { color: $button-flat-color; }
|
||||||
|
|
||||||
|
&.btn:hover,
|
||||||
|
&.btn-large:hover { background-color: lighten($button-raised-background, 5%); }
|
||||||
|
&.btn-floating:hover { background-color: $button-raised-background; }
|
||||||
|
|
||||||
|
& > i,
|
||||||
|
& > [class^="mdi-"], li > a > [class*="mdi-"],
|
||||||
|
& > i.material-icons {
|
||||||
|
float: left;
|
||||||
|
height: $sidenav-item-height;
|
||||||
|
line-height: $sidenav-line-height;
|
||||||
|
margin: 0 ($sidenav-padding * 2) 0 0;
|
||||||
|
width: $sidenav-item-height / 2;
|
||||||
|
color: rgba(0,0,0,.54);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.divider {
|
||||||
|
margin: ($sidenav-padding / 2) 0 0 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.subheader {
|
||||||
|
&:hover {
|
||||||
|
background-color: transparent;
|
||||||
|
}
|
||||||
|
|
||||||
|
cursor: initial;
|
||||||
|
pointer-events: none;
|
||||||
|
color: rgba(0,0,0,.54);
|
||||||
|
font-size: $sidenav-font-size;
|
||||||
|
font-weight: 500;
|
||||||
|
line-height: $sidenav-line-height;
|
||||||
|
}
|
||||||
|
|
||||||
|
.user-view {
|
||||||
|
position: relative;
|
||||||
|
padding: ($sidenav-padding * 2) ($sidenav-padding * 2) 0;
|
||||||
|
margin-bottom: $sidenav-padding / 2;
|
||||||
|
|
||||||
|
& > a {
|
||||||
|
&:hover { background-color: transparent; }
|
||||||
|
height: auto;
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.background {
|
||||||
|
overflow: hidden;
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
right: 0;
|
||||||
|
bottom: 0;
|
||||||
|
left: 0;
|
||||||
|
z-index: -1;
|
||||||
|
}
|
||||||
|
|
||||||
|
.circle, .name, .email {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
|
||||||
|
.circle {
|
||||||
|
height: 64px;
|
||||||
|
width: 64px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.name,
|
||||||
|
.email {
|
||||||
|
font-size: $sidenav-font-size;
|
||||||
|
line-height: $sidenav-line-height / 2;
|
||||||
|
}
|
||||||
|
|
||||||
|
.name {
|
||||||
|
margin-top: 16px;
|
||||||
|
font-weight: 500;
|
||||||
|
}
|
||||||
|
|
||||||
|
.email {
|
||||||
|
padding-bottom: 16px;
|
||||||
|
font-weight: 400;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
// Touch interaction
|
||||||
|
.drag-target {
|
||||||
|
// Right Align
|
||||||
|
&.right-aligned {
|
||||||
|
right: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
height: 100%;
|
||||||
|
width: 10px;
|
||||||
|
position: fixed;
|
||||||
|
top: 0;
|
||||||
|
z-index: 998;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
// Fixed Sidenav shown
|
||||||
|
.sidenav.sidenav-fixed {
|
||||||
|
// Right Align
|
||||||
|
&.right-aligned {
|
||||||
|
right: 0;
|
||||||
|
left: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
left: 0;
|
||||||
|
transform: translateX(0);
|
||||||
|
position: fixed;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Fixed Sidenav hide on smaller
|
||||||
|
@media #{$medium-and-down} {
|
||||||
|
.sidenav {
|
||||||
|
&.sidenav-fixed {
|
||||||
|
transform: translateX(-105%);
|
||||||
|
|
||||||
|
&.right-aligned {
|
||||||
|
transform: translateX(105%);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
> a {
|
||||||
|
padding: 0 $sidenav-padding;
|
||||||
|
}
|
||||||
|
|
||||||
|
.user-view {
|
||||||
|
padding: $sidenav-padding $sidenav-padding 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.sidenav .collapsible-body > ul:not(.collapsible) > li.active,
|
||||||
|
.sidenav.sidenav-fixed .collapsible-body > ul:not(.collapsible) > li.active {
|
||||||
|
background-color: $primary-color;
|
||||||
|
a {
|
||||||
|
color: $sidenav-bg-color;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.sidenav .collapsible-body {
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.sidenav-overlay {
|
||||||
|
position: fixed;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
opacity: 0;
|
||||||
|
height: 120vh;
|
||||||
|
background-color: rgba(0,0,0,.5);
|
||||||
|
z-index: 997;
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
92
app/static/external/materialize/sass/components/_slider.scss
vendored
Normal file
92
app/static/external/materialize/sass/components/_slider.scss
vendored
Normal file
@ -0,0 +1,92 @@
|
|||||||
|
.slider {
|
||||||
|
position: relative;
|
||||||
|
height: 400px;
|
||||||
|
width: 100%;
|
||||||
|
|
||||||
|
// Fullscreen slider
|
||||||
|
&.fullscreen {
|
||||||
|
height: 100%;
|
||||||
|
width: 100%;
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
bottom: 0;
|
||||||
|
|
||||||
|
ul.slides {
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
ul.indicators {
|
||||||
|
z-index: 2;
|
||||||
|
bottom: 30px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.slides {
|
||||||
|
background-color: $slider-bg-color;
|
||||||
|
margin: 0;
|
||||||
|
height: 400px;
|
||||||
|
|
||||||
|
li {
|
||||||
|
opacity: 0;
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
z-index: 1;
|
||||||
|
width: 100%;
|
||||||
|
height: inherit;
|
||||||
|
overflow: hidden;
|
||||||
|
|
||||||
|
img {
|
||||||
|
height: 100%;
|
||||||
|
width: 100%;
|
||||||
|
background-size: cover;
|
||||||
|
background-position: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.caption {
|
||||||
|
color: #fff;
|
||||||
|
position: absolute;
|
||||||
|
top: 15%;
|
||||||
|
left: 15%;
|
||||||
|
width: 70%;
|
||||||
|
opacity: 0;
|
||||||
|
|
||||||
|
p { color: $slider-bg-color-light; }
|
||||||
|
}
|
||||||
|
|
||||||
|
&.active {
|
||||||
|
z-index: 2;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.indicators {
|
||||||
|
position: absolute;
|
||||||
|
text-align: center;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
bottom: 0;
|
||||||
|
margin: 0;
|
||||||
|
|
||||||
|
.indicator-item {
|
||||||
|
display: inline-block;
|
||||||
|
position: relative;
|
||||||
|
cursor: pointer;
|
||||||
|
height: 16px;
|
||||||
|
width: 16px;
|
||||||
|
margin: 0 12px;
|
||||||
|
background-color: $slider-bg-color-light;
|
||||||
|
|
||||||
|
transition: background-color .3s;
|
||||||
|
border-radius: 50%;
|
||||||
|
|
||||||
|
&.active {
|
||||||
|
background-color: $slider-indicator-color;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
33
app/static/external/materialize/sass/components/_table_of_contents.scss
vendored
Normal file
33
app/static/external/materialize/sass/components/_table_of_contents.scss
vendored
Normal file
@ -0,0 +1,33 @@
|
|||||||
|
/***************
|
||||||
|
Nav List
|
||||||
|
***************/
|
||||||
|
.table-of-contents {
|
||||||
|
&.fixed {
|
||||||
|
position: fixed;
|
||||||
|
}
|
||||||
|
|
||||||
|
li {
|
||||||
|
padding: 2px 0;
|
||||||
|
}
|
||||||
|
a {
|
||||||
|
display: inline-block;
|
||||||
|
font-weight: 300;
|
||||||
|
color: #757575;
|
||||||
|
padding-left: 16px;
|
||||||
|
height: 1.5rem;
|
||||||
|
line-height: 1.5rem;
|
||||||
|
letter-spacing: .4;
|
||||||
|
display: inline-block;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
color: lighten(#757575, 20%);
|
||||||
|
padding-left: 15px;
|
||||||
|
border-left: 1px solid $primary-color;
|
||||||
|
}
|
||||||
|
&.active {
|
||||||
|
font-weight: 500;
|
||||||
|
padding-left: 14px;
|
||||||
|
border-left: 2px solid $primary-color;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
99
app/static/external/materialize/sass/components/_tabs.scss
vendored
Normal file
99
app/static/external/materialize/sass/components/_tabs.scss
vendored
Normal file
@ -0,0 +1,99 @@
|
|||||||
|
.tabs {
|
||||||
|
&.tabs-transparent {
|
||||||
|
background-color: transparent;
|
||||||
|
|
||||||
|
.tab a,
|
||||||
|
.tab.disabled a,
|
||||||
|
.tab.disabled a:hover {
|
||||||
|
color: rgba(255,255,255,0.7);
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab a:hover,
|
||||||
|
.tab a.active {
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.indicator {
|
||||||
|
background-color: #fff;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&.tabs-fixed-width {
|
||||||
|
display: flex;
|
||||||
|
|
||||||
|
.tab {
|
||||||
|
flex-grow: 1;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
position: relative;
|
||||||
|
overflow-x: auto;
|
||||||
|
overflow-y: hidden;
|
||||||
|
height: 48px;
|
||||||
|
width: 100%;
|
||||||
|
background-color: $tabs-bg-color;
|
||||||
|
margin: 0 auto;
|
||||||
|
white-space: nowrap;
|
||||||
|
|
||||||
|
.tab {
|
||||||
|
display: inline-block;
|
||||||
|
text-align: center;
|
||||||
|
line-height: 48px;
|
||||||
|
height: 48px;
|
||||||
|
padding: 0;
|
||||||
|
margin: 0;
|
||||||
|
text-transform: uppercase;
|
||||||
|
|
||||||
|
a {
|
||||||
|
&:focus,
|
||||||
|
&:focus.active {
|
||||||
|
background-color: transparentize($tabs-underline-color, .8);
|
||||||
|
outline: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
&:hover,
|
||||||
|
&.active {
|
||||||
|
background-color: transparent;
|
||||||
|
color: $tabs-text-color;
|
||||||
|
}
|
||||||
|
|
||||||
|
color: rgba($tabs-text-color, .7);
|
||||||
|
display: block;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
padding: 0 24px;
|
||||||
|
font-size: 14px;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
overflow: hidden;
|
||||||
|
transition: color .28s ease, background-color .28s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.disabled a,
|
||||||
|
&.disabled a:hover {
|
||||||
|
color: rgba($tabs-text-color, .4);
|
||||||
|
cursor: default;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.indicator {
|
||||||
|
position: absolute;
|
||||||
|
bottom: 0;
|
||||||
|
height: 2px;
|
||||||
|
background-color: $tabs-underline-color;
|
||||||
|
will-change: left, right;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Fixed Sidenav hide on smaller
|
||||||
|
@media #{$medium-and-down} {
|
||||||
|
.tabs {
|
||||||
|
display: flex;
|
||||||
|
|
||||||
|
.tab {
|
||||||
|
flex-grow: 1;
|
||||||
|
|
||||||
|
a {
|
||||||
|
padding: 0 12px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
103
app/static/external/materialize/sass/components/_tapTarget.scss
vendored
Normal file
103
app/static/external/materialize/sass/components/_tapTarget.scss
vendored
Normal file
@ -0,0 +1,103 @@
|
|||||||
|
.tap-target-wrapper {
|
||||||
|
width: 800px;
|
||||||
|
height: 800px;
|
||||||
|
position: fixed;
|
||||||
|
z-index: 1000;
|
||||||
|
visibility: hidden;
|
||||||
|
transition: visibility 0s .3s;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tap-target-wrapper.open {
|
||||||
|
visibility: visible;
|
||||||
|
transition: visibility 0s;
|
||||||
|
|
||||||
|
.tap-target {
|
||||||
|
transform: scale(1);
|
||||||
|
opacity: .95;
|
||||||
|
transition:
|
||||||
|
transform .3s cubic-bezier(.42,0,.58,1),
|
||||||
|
opacity .3s cubic-bezier(.42,0,.58,1);
|
||||||
|
}
|
||||||
|
|
||||||
|
.tap-target-wave::before {
|
||||||
|
transform: scale(1);
|
||||||
|
}
|
||||||
|
.tap-target-wave::after {
|
||||||
|
visibility: visible;
|
||||||
|
animation: pulse-animation 1s cubic-bezier(0.24, 0, 0.38, 1) infinite;
|
||||||
|
transition:
|
||||||
|
opacity .3s,
|
||||||
|
transform .3s,
|
||||||
|
visibility 0s 1s;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.tap-target {
|
||||||
|
position: absolute;
|
||||||
|
font-size: 1rem;
|
||||||
|
border-radius: 50%;
|
||||||
|
background-color: $primary-color;
|
||||||
|
box-shadow: 0 20px 20px 0 rgba(0,0,0,0.14), 0 10px 50px 0 rgba(0,0,0,0.12), 0 30px 10px -20px rgba(0,0,0,0.2);
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
opacity: 0;
|
||||||
|
transform: scale(0);
|
||||||
|
transition:
|
||||||
|
transform .3s cubic-bezier(.42,0,.58,1),
|
||||||
|
opacity .3s cubic-bezier(.42,0,.58,1);
|
||||||
|
}
|
||||||
|
|
||||||
|
.tap-target-content {
|
||||||
|
position: relative;
|
||||||
|
display: table-cell;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tap-target-wave {
|
||||||
|
&::before,
|
||||||
|
&::after {
|
||||||
|
content: '';
|
||||||
|
display: block;
|
||||||
|
position: absolute;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
border-radius: 50%;
|
||||||
|
background-color: #ffffff;
|
||||||
|
}
|
||||||
|
&::before {
|
||||||
|
transform: scale(0);
|
||||||
|
transition: transform .3s;
|
||||||
|
}
|
||||||
|
&::after {
|
||||||
|
visibility: hidden;
|
||||||
|
transition:
|
||||||
|
opacity .3s,
|
||||||
|
transform .3s,
|
||||||
|
visibility 0s;
|
||||||
|
z-index: -1;
|
||||||
|
}
|
||||||
|
|
||||||
|
position: absolute;
|
||||||
|
border-radius: 50%;
|
||||||
|
z-index: 10001;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tap-target-origin {
|
||||||
|
&:not(.btn),
|
||||||
|
&:not(.btn):hover {
|
||||||
|
background: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
top: 50%;
|
||||||
|
left: 50%;
|
||||||
|
transform: translate(-50%,-50%);
|
||||||
|
|
||||||
|
z-index: 10002;
|
||||||
|
position: absolute !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media only screen and (max-width: 600px) {
|
||||||
|
.tap-target, .tap-target-wrapper {
|
||||||
|
width: 600px;
|
||||||
|
height: 600px;
|
||||||
|
}
|
||||||
|
}
|
||||||
183
app/static/external/materialize/sass/components/_timepicker.scss
vendored
Normal file
183
app/static/external/materialize/sass/components/_timepicker.scss
vendored
Normal file
@ -0,0 +1,183 @@
|
|||||||
|
/* Timepicker Containers */
|
||||||
|
.timepicker-modal {
|
||||||
|
max-width: 325px;
|
||||||
|
max-height: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.timepicker-container.modal-content {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.text-primary {
|
||||||
|
color: rgba(255, 255, 255, 1);
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
/* Clock Digital Display */
|
||||||
|
.timepicker-digital-display {
|
||||||
|
flex: 1 auto;
|
||||||
|
background-color: $secondary-color;
|
||||||
|
padding: 10px;
|
||||||
|
font-weight: 300;
|
||||||
|
}
|
||||||
|
|
||||||
|
.timepicker-text-container {
|
||||||
|
font-size: 4rem;
|
||||||
|
font-weight: bold;
|
||||||
|
text-align: center;
|
||||||
|
color: rgba(255, 255, 255, 0.6);
|
||||||
|
font-weight: 400;
|
||||||
|
position: relative;
|
||||||
|
user-select: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.timepicker-span-hours,
|
||||||
|
.timepicker-span-minutes,
|
||||||
|
.timepicker-span-am-pm div {
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
.timepicker-span-hours {
|
||||||
|
margin-right: 3px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.timepicker-span-minutes {
|
||||||
|
margin-left: 3px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.timepicker-display-am-pm {
|
||||||
|
font-size: 1.3rem;
|
||||||
|
position: absolute;
|
||||||
|
right: 1rem;
|
||||||
|
bottom: 1rem;
|
||||||
|
font-weight: 400;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
/* Analog Clock Display */
|
||||||
|
.timepicker-analog-display {
|
||||||
|
flex: 2.5 auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.timepicker-plate {
|
||||||
|
background-color: $timepicker-clock-plate-bg;
|
||||||
|
border-radius: 50%;
|
||||||
|
width: 270px;
|
||||||
|
height: 270px;
|
||||||
|
overflow: visible;
|
||||||
|
position: relative;
|
||||||
|
margin: auto;
|
||||||
|
margin-top: 25px;
|
||||||
|
margin-bottom: 5px;
|
||||||
|
user-select: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.timepicker-canvas,
|
||||||
|
.timepicker-dial {
|
||||||
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
top: 0;
|
||||||
|
bottom: 0;
|
||||||
|
}
|
||||||
|
.timepicker-minutes {
|
||||||
|
visibility: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
.timepicker-tick {
|
||||||
|
border-radius: 50%;
|
||||||
|
color: $timepicker-clock-color;
|
||||||
|
line-height: 40px;
|
||||||
|
text-align: center;
|
||||||
|
width: 40px;
|
||||||
|
height: 40px;
|
||||||
|
position: absolute;
|
||||||
|
cursor: pointer;
|
||||||
|
font-size: 15px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.timepicker-tick.active,
|
||||||
|
.timepicker-tick:hover {
|
||||||
|
background-color: transparentize($secondary-color, .75);
|
||||||
|
}
|
||||||
|
.timepicker-dial {
|
||||||
|
transition: transform 350ms, opacity 350ms;
|
||||||
|
}
|
||||||
|
.timepicker-dial-out {
|
||||||
|
&.timepicker-hours {
|
||||||
|
transform: scale(1.1, 1.1);
|
||||||
|
}
|
||||||
|
|
||||||
|
&.timepicker-minutes {
|
||||||
|
transform: scale(.8, .8);
|
||||||
|
}
|
||||||
|
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
.timepicker-canvas {
|
||||||
|
transition: opacity 175ms;
|
||||||
|
|
||||||
|
line {
|
||||||
|
stroke: $secondary-color;
|
||||||
|
stroke-width: 4;
|
||||||
|
stroke-linecap: round;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.timepicker-canvas-out {
|
||||||
|
opacity: 0.25;
|
||||||
|
}
|
||||||
|
.timepicker-canvas-bearing {
|
||||||
|
stroke: none;
|
||||||
|
fill: $secondary-color;
|
||||||
|
}
|
||||||
|
.timepicker-canvas-bg {
|
||||||
|
stroke: none;
|
||||||
|
fill: $secondary-color;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
/* Footer */
|
||||||
|
.timepicker-footer {
|
||||||
|
margin: 0 auto;
|
||||||
|
padding: 5px 1rem;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
}
|
||||||
|
|
||||||
|
.timepicker-clear {
|
||||||
|
color: $error-color;
|
||||||
|
}
|
||||||
|
|
||||||
|
.timepicker-close {
|
||||||
|
color: $secondary-color;
|
||||||
|
}
|
||||||
|
|
||||||
|
.timepicker-clear,
|
||||||
|
.timepicker-close {
|
||||||
|
padding: 0 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Media Queries */
|
||||||
|
@media #{$medium-and-up} {
|
||||||
|
.timepicker-modal {
|
||||||
|
max-width: 600px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.timepicker-container.modal-content {
|
||||||
|
flex-direction: row;
|
||||||
|
}
|
||||||
|
|
||||||
|
.timepicker-text-container {
|
||||||
|
top: 32%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.timepicker-display-am-pm {
|
||||||
|
position: relative;
|
||||||
|
right: auto;
|
||||||
|
bottom: auto;
|
||||||
|
text-align: center;
|
||||||
|
margin-top: 1.2rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
58
app/static/external/materialize/sass/components/_toast.scss
vendored
Normal file
58
app/static/external/materialize/sass/components/_toast.scss
vendored
Normal file
@ -0,0 +1,58 @@
|
|||||||
|
#toast-container {
|
||||||
|
display:block;
|
||||||
|
position: fixed;
|
||||||
|
z-index: 10000;
|
||||||
|
|
||||||
|
@media #{$small-and-down} {
|
||||||
|
min-width: 100%;
|
||||||
|
bottom: 0%;
|
||||||
|
}
|
||||||
|
@media #{$medium-only} {
|
||||||
|
left: 5%;
|
||||||
|
bottom: 7%;
|
||||||
|
max-width: 90%;
|
||||||
|
}
|
||||||
|
@media #{$large-and-up} {
|
||||||
|
top: 10%;
|
||||||
|
right: 7%;
|
||||||
|
max-width: 86%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.toast {
|
||||||
|
@extend .z-depth-1;
|
||||||
|
border-radius: 2px;
|
||||||
|
top: 35px;
|
||||||
|
width: auto;
|
||||||
|
margin-top: 10px;
|
||||||
|
position: relative;
|
||||||
|
max-width:100%;
|
||||||
|
height: auto;
|
||||||
|
min-height: $toast-height;
|
||||||
|
line-height: 1.5em;
|
||||||
|
background-color: $toast-color;
|
||||||
|
padding: 10px 25px;
|
||||||
|
font-size: 1.1rem;
|
||||||
|
font-weight: 300;
|
||||||
|
color: $toast-text-color;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
cursor: default;
|
||||||
|
|
||||||
|
.toast-action {
|
||||||
|
color: $toast-action-color;
|
||||||
|
font-weight: 500;
|
||||||
|
margin-right: -25px;
|
||||||
|
margin-left: 3rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.rounded{
|
||||||
|
border-radius: 24px;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media #{$small-and-down} {
|
||||||
|
width: 100%;
|
||||||
|
border-radius: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
32
app/static/external/materialize/sass/components/_tooltip.scss
vendored
Normal file
32
app/static/external/materialize/sass/components/_tooltip.scss
vendored
Normal file
@ -0,0 +1,32 @@
|
|||||||
|
.material-tooltip {
|
||||||
|
padding: 10px 8px;
|
||||||
|
font-size: 1rem;
|
||||||
|
z-index: 2000;
|
||||||
|
background-color: transparent;
|
||||||
|
border-radius: 2px;
|
||||||
|
color: #fff;
|
||||||
|
min-height: 36px;
|
||||||
|
line-height: 120%;
|
||||||
|
opacity: 0;
|
||||||
|
position: absolute;
|
||||||
|
text-align: center;
|
||||||
|
max-width: calc(100% - 4px);
|
||||||
|
overflow: hidden;
|
||||||
|
left: 0;
|
||||||
|
top: 0;
|
||||||
|
pointer-events: none;
|
||||||
|
visibility: hidden;
|
||||||
|
background-color: #323232;
|
||||||
|
}
|
||||||
|
|
||||||
|
.backdrop {
|
||||||
|
position: absolute;
|
||||||
|
opacity: 0;
|
||||||
|
height: 7px;
|
||||||
|
width: 14px;
|
||||||
|
border-radius: 0 0 50% 50%;
|
||||||
|
background-color: #323232;
|
||||||
|
z-index: -1;
|
||||||
|
transform-origin: 50% 0%;
|
||||||
|
visibility: hidden;
|
||||||
|
}
|
||||||
13
app/static/external/materialize/sass/components/_transitions.scss
vendored
Normal file
13
app/static/external/materialize/sass/components/_transitions.scss
vendored
Normal file
@ -0,0 +1,13 @@
|
|||||||
|
// Scale transition
|
||||||
|
.scale-transition {
|
||||||
|
&.scale-out {
|
||||||
|
transform: scale(0);
|
||||||
|
transition: transform .2s !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.scale-in {
|
||||||
|
transform: scale(1);
|
||||||
|
}
|
||||||
|
|
||||||
|
transition: transform .3s cubic-bezier(0.53, 0.01, 0.36, 1.63) !important;
|
||||||
|
}
|
||||||
60
app/static/external/materialize/sass/components/_typography.scss
vendored
Normal file
60
app/static/external/materialize/sass/components/_typography.scss
vendored
Normal file
@ -0,0 +1,60 @@
|
|||||||
|
|
||||||
|
a {
|
||||||
|
text-decoration: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
html{
|
||||||
|
line-height: 1.5;
|
||||||
|
|
||||||
|
@media only screen and (min-width: 0) {
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media only screen and (min-width: $medium-screen) {
|
||||||
|
font-size: 14.5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media only screen and (min-width: $large-screen) {
|
||||||
|
font-size: 15px;
|
||||||
|
}
|
||||||
|
|
||||||
|
font-family: $font-stack;
|
||||||
|
font-weight: normal;
|
||||||
|
color: $off-black;
|
||||||
|
}
|
||||||
|
h1, h2, h3, h4, h5, h6 {
|
||||||
|
font-weight: 400;
|
||||||
|
line-height: 1.3;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Header Styles
|
||||||
|
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { font-weight: inherit; }
|
||||||
|
h1 { font-size: $h1-fontsize; line-height: 110%; margin: ($h1-fontsize / 1.5) 0 ($h1-fontsize / 2.5) 0;}
|
||||||
|
h2 { font-size: $h2-fontsize; line-height: 110%; margin: ($h2-fontsize / 1.5) 0 ($h2-fontsize / 2.5) 0;}
|
||||||
|
h3 { font-size: $h3-fontsize; line-height: 110%; margin: ($h3-fontsize / 1.5) 0 ($h3-fontsize / 2.5) 0;}
|
||||||
|
h4 { font-size: $h4-fontsize; line-height: 110%; margin: ($h4-fontsize / 1.5) 0 ($h4-fontsize / 2.5) 0;}
|
||||||
|
h5 { font-size: $h5-fontsize; line-height: 110%; margin: ($h5-fontsize / 1.5) 0 ($h5-fontsize / 2.5) 0;}
|
||||||
|
h6 { font-size: $h6-fontsize; line-height: 110%; margin: ($h6-fontsize / 1.5) 0 ($h6-fontsize / 2.5) 0;}
|
||||||
|
|
||||||
|
// Text Styles
|
||||||
|
em { font-style: italic; }
|
||||||
|
strong { font-weight: 500; }
|
||||||
|
small { font-size: 75%; }
|
||||||
|
.light { font-weight: 300; }
|
||||||
|
.thin { font-weight: 200; }
|
||||||
|
|
||||||
|
|
||||||
|
.flow-text{
|
||||||
|
$i: 0;
|
||||||
|
@while $i <= $intervals {
|
||||||
|
@media only screen and (min-width : 360 + ($i * $interval-size)) {
|
||||||
|
font-size: 1.2rem * (1 + (.02 * $i));
|
||||||
|
}
|
||||||
|
$i: $i + 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Handle below 360px screen
|
||||||
|
@media only screen and (max-width: 360px) {
|
||||||
|
font-size: 1.2rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
349
app/static/external/materialize/sass/components/_variables.scss
vendored
Normal file
349
app/static/external/materialize/sass/components/_variables.scss
vendored
Normal file
@ -0,0 +1,349 @@
|
|||||||
|
// ==========================================================================
|
||||||
|
// Materialize variables
|
||||||
|
// ==========================================================================
|
||||||
|
//
|
||||||
|
// Table of Contents:
|
||||||
|
//
|
||||||
|
// 1. Colors
|
||||||
|
// 2. Badges
|
||||||
|
// 3. Buttons
|
||||||
|
// 4. Cards
|
||||||
|
// 5. Carousel
|
||||||
|
// 6. Collapsible
|
||||||
|
// 7. Chips
|
||||||
|
// 8. Date + Time Picker
|
||||||
|
// 9. Dropdown
|
||||||
|
// 10. Forms
|
||||||
|
// 11. Global
|
||||||
|
// 12. Grid
|
||||||
|
// 13. Navigation Bar
|
||||||
|
// 14. Side Navigation
|
||||||
|
// 15. Photo Slider
|
||||||
|
// 16. Spinners | Loaders
|
||||||
|
// 17. Tabs
|
||||||
|
// 18. Tables
|
||||||
|
// 19. Toasts
|
||||||
|
// 20. Typography
|
||||||
|
// 21. Footer
|
||||||
|
// 22. Flow Text
|
||||||
|
// 23. Collections
|
||||||
|
// 24. Progress Bar
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
// 1. Colors
|
||||||
|
// ==========================================================================
|
||||||
|
|
||||||
|
$primary-color: color("materialize-red", "lighten-2") !default;
|
||||||
|
$primary-color-light: lighten($primary-color, 15%) !default;
|
||||||
|
$primary-color-dark: darken($primary-color, 15%) !default;
|
||||||
|
|
||||||
|
$secondary-color: color("teal", "lighten-1") !default;
|
||||||
|
$success-color: color("green", "base") !default;
|
||||||
|
$error-color: color("red", "base") !default;
|
||||||
|
$link-color: color("light-blue", "darken-1") !default;
|
||||||
|
|
||||||
|
|
||||||
|
// 2. Badges
|
||||||
|
// ==========================================================================
|
||||||
|
|
||||||
|
$badge-bg-color: $secondary-color !default;
|
||||||
|
$badge-height: 22px !default;
|
||||||
|
|
||||||
|
|
||||||
|
// 3. Buttons
|
||||||
|
// ==========================================================================
|
||||||
|
|
||||||
|
// Shared styles
|
||||||
|
$button-border: none !default;
|
||||||
|
$button-background-focus: lighten($secondary-color, 4%) !default;
|
||||||
|
$button-font-size: 14px !default;
|
||||||
|
$button-icon-font-size: 1.3rem !default;
|
||||||
|
$button-height: 36px !default;
|
||||||
|
$button-padding: 0 16px !default;
|
||||||
|
$button-radius: 2px !default;
|
||||||
|
|
||||||
|
// Disabled styles
|
||||||
|
$button-disabled-background: #DFDFDF !default;
|
||||||
|
$button-disabled-color: #9F9F9F !default;
|
||||||
|
|
||||||
|
// Raised buttons
|
||||||
|
$button-raised-background: $secondary-color !default;
|
||||||
|
$button-raised-background-hover: lighten($button-raised-background, 5%) !default;
|
||||||
|
$button-raised-color: #fff !default;
|
||||||
|
|
||||||
|
// Large buttons
|
||||||
|
$button-large-font-size: 15px !default;
|
||||||
|
$button-large-icon-font-size: 1.6rem !default;
|
||||||
|
$button-large-height: $button-height * 1.5 !default;
|
||||||
|
$button-floating-large-size: 56px !default;
|
||||||
|
|
||||||
|
// Small buttons
|
||||||
|
$button-small-font-size: 13px !default;
|
||||||
|
$button-small-icon-font-size: 1.2rem !default;
|
||||||
|
$button-small-height: $button-height * .9 !default;
|
||||||
|
$button-floating-small-size: $button-height * .9 !default;
|
||||||
|
|
||||||
|
// Flat buttons
|
||||||
|
$button-flat-color: #343434 !default;
|
||||||
|
$button-flat-disabled-color: lighten(#999, 10%) !default;
|
||||||
|
|
||||||
|
// Floating buttons
|
||||||
|
$button-floating-background: $secondary-color !default;
|
||||||
|
$button-floating-background-hover: $button-floating-background !default;
|
||||||
|
$button-floating-color: #fff !default;
|
||||||
|
$button-floating-size: 40px !default;
|
||||||
|
$button-floating-radius: 50% !default;
|
||||||
|
|
||||||
|
|
||||||
|
// 4. Cards
|
||||||
|
// ==========================================================================
|
||||||
|
|
||||||
|
$card-padding: 24px !default;
|
||||||
|
$card-bg-color: #fff !default;
|
||||||
|
$card-link-color: color("orange", "accent-2") !default;
|
||||||
|
$card-link-color-light: lighten($card-link-color, 20%) !default;
|
||||||
|
|
||||||
|
|
||||||
|
// 5. Carousel
|
||||||
|
// ==========================================================================
|
||||||
|
|
||||||
|
$carousel-height: 400px !default;
|
||||||
|
$carousel-item-height: $carousel-height / 2 !default;
|
||||||
|
$carousel-item-width: $carousel-item-height !default;
|
||||||
|
|
||||||
|
|
||||||
|
// 6. Collapsible
|
||||||
|
// ==========================================================================
|
||||||
|
|
||||||
|
$collapsible-height: 3rem !default;
|
||||||
|
$collapsible-line-height: $collapsible-height !default;
|
||||||
|
$collapsible-header-color: #fff !default;
|
||||||
|
$collapsible-border-color: #ddd !default;
|
||||||
|
|
||||||
|
|
||||||
|
// 7. Chips
|
||||||
|
// ==========================================================================
|
||||||
|
|
||||||
|
$chip-bg-color: #e4e4e4 !default;
|
||||||
|
$chip-border-color: #9e9e9e !default;
|
||||||
|
$chip-selected-color: #26a69a !default;
|
||||||
|
$chip-margin: 5px !default;
|
||||||
|
|
||||||
|
|
||||||
|
// 8. Date + Time Picker
|
||||||
|
// ==========================================================================
|
||||||
|
|
||||||
|
$datepicker-display-font-size: 2.8rem;
|
||||||
|
$datepicker-calendar-header-color: #999;
|
||||||
|
$datepicker-weekday-color: rgba(0, 0, 0, .87) !default;
|
||||||
|
$datepicker-weekday-bg: darken($secondary-color, 7%) !default;
|
||||||
|
$datepicker-date-bg: $secondary-color !default;
|
||||||
|
$datepicker-year: rgba(255, 255, 255, .7) !default;
|
||||||
|
$datepicker-focus: rgba(0,0,0, .05) !default;
|
||||||
|
$datepicker-selected: $secondary-color !default;
|
||||||
|
$datepicker-selected-outfocus: desaturate(lighten($secondary-color, 35%), 15%) !default;
|
||||||
|
$datepicker-day-focus: transparentize(desaturate($secondary-color, 5%), .75) !default;
|
||||||
|
$datepicker-disabled-day-color: rgba(0, 0, 0, .3) !default;
|
||||||
|
|
||||||
|
$timepicker-clock-color: rgba(0, 0, 0, .87) !default;
|
||||||
|
$timepicker-clock-plate-bg: #eee !default;
|
||||||
|
|
||||||
|
|
||||||
|
// 9. Dropdown
|
||||||
|
// ==========================================================================
|
||||||
|
|
||||||
|
$dropdown-bg-color: #fff !default;
|
||||||
|
$dropdown-hover-bg-color: #eee !default;
|
||||||
|
$dropdown-color: $secondary-color !default;
|
||||||
|
$dropdown-item-height: 50px !default;
|
||||||
|
|
||||||
|
|
||||||
|
// 10. Forms
|
||||||
|
// ==========================================================================
|
||||||
|
|
||||||
|
// Text Inputs + Textarea
|
||||||
|
$input-height: 3rem !default;
|
||||||
|
$input-border-color: color("grey", "base") !default;
|
||||||
|
$input-border: 1px solid $input-border-color !default;
|
||||||
|
$input-background: #fff !default;
|
||||||
|
$input-error-color: $error-color !default;
|
||||||
|
$input-success-color: $success-color !default;
|
||||||
|
$input-focus-color: $secondary-color !default;
|
||||||
|
$input-font-size: 16px !default;
|
||||||
|
$input-margin-bottom: 8px;
|
||||||
|
$input-margin: 0 0 $input-margin-bottom 0 !default;
|
||||||
|
$input-padding: 0 !default;
|
||||||
|
$label-font-size: .8rem !default;
|
||||||
|
$input-disabled-color: rgba(0,0,0, .42) !default;
|
||||||
|
$input-disabled-solid-color: #949494 !default;
|
||||||
|
$input-disabled-border: 1px dotted $input-disabled-color !default;
|
||||||
|
$input-invalid-border: 1px solid $input-error-color !default;
|
||||||
|
$input-icon-size: 2rem;
|
||||||
|
$placeholder-text-color: lighten($input-border-color, 20%) !default;
|
||||||
|
|
||||||
|
// Radio Buttons
|
||||||
|
$radio-fill-color: $secondary-color !default;
|
||||||
|
$radio-empty-color: #5a5a5a !default;
|
||||||
|
$radio-border: 2px solid $radio-fill-color !default;
|
||||||
|
|
||||||
|
// Range
|
||||||
|
$range-height: 14px !default;
|
||||||
|
$range-width: 14px !default;
|
||||||
|
$track-height: 3px !default;
|
||||||
|
|
||||||
|
// Select
|
||||||
|
$select-border: 1px solid #f2f2f2 !default;
|
||||||
|
$select-background: rgba(255, 255, 255, 0.90) !default;
|
||||||
|
$select-focus: 1px solid lighten($secondary-color, 47%) !default;
|
||||||
|
$select-option-hover: rgba(0,0,0,.08) !default;
|
||||||
|
$select-option-focus: rgba(0,0,0,.08) !default;
|
||||||
|
$select-option-selected: rgba(0,0,0,.03) !default;
|
||||||
|
$select-padding: 5px !default;
|
||||||
|
$select-radius: 2px !default;
|
||||||
|
$select-disabled-color: rgba(0,0,0,.3) !default;
|
||||||
|
|
||||||
|
// Switches
|
||||||
|
$switch-bg-color: $secondary-color !default;
|
||||||
|
$switch-checked-lever-bg: desaturate(lighten($switch-bg-color, 25%), 25%) !default;
|
||||||
|
$switch-unchecked-bg: #F1F1F1 !default;
|
||||||
|
$switch-unchecked-lever-bg: rgba(0,0,0,.38) !default;
|
||||||
|
$switch-radius: 15px !default;
|
||||||
|
|
||||||
|
|
||||||
|
// 11. Global
|
||||||
|
// ==========================================================================
|
||||||
|
|
||||||
|
// Media Query Ranges
|
||||||
|
$small-screen-up: 601px !default;
|
||||||
|
$medium-screen-up: 993px !default;
|
||||||
|
$large-screen-up: 1201px !default;
|
||||||
|
$small-screen: 600px !default;
|
||||||
|
$medium-screen: 992px !default;
|
||||||
|
$large-screen: 1200px !default;
|
||||||
|
|
||||||
|
$medium-and-up: "only screen and (min-width : #{$small-screen-up})" !default;
|
||||||
|
$large-and-up: "only screen and (min-width : #{$medium-screen-up})" !default;
|
||||||
|
$extra-large-and-up: "only screen and (min-width : #{$large-screen-up})" !default;
|
||||||
|
$small-and-down: "only screen and (max-width : #{$small-screen})" !default;
|
||||||
|
$medium-and-down: "only screen and (max-width : #{$medium-screen})" !default;
|
||||||
|
$medium-only: "only screen and (min-width : #{$small-screen-up}) and (max-width : #{$medium-screen})" !default;
|
||||||
|
|
||||||
|
|
||||||
|
// 12. Grid
|
||||||
|
// ==========================================================================
|
||||||
|
|
||||||
|
$num-cols: 12 !default;
|
||||||
|
$gutter-width: 1.5rem !default;
|
||||||
|
$element-top-margin: $gutter-width/3 !default;
|
||||||
|
$element-bottom-margin: ($gutter-width*2)/3 !default;
|
||||||
|
|
||||||
|
|
||||||
|
// 13. Navigation Bar
|
||||||
|
// ==========================================================================
|
||||||
|
|
||||||
|
$navbar-height: 64px !default;
|
||||||
|
$navbar-line-height: $navbar-height !default;
|
||||||
|
$navbar-height-mobile: 56px !default;
|
||||||
|
$navbar-line-height-mobile: $navbar-height-mobile !default;
|
||||||
|
$navbar-font-size: 1rem !default;
|
||||||
|
$navbar-font-color: #fff !default;
|
||||||
|
$navbar-brand-font-size: 2.1rem !default;
|
||||||
|
|
||||||
|
// 14. Side Navigation
|
||||||
|
// ==========================================================================
|
||||||
|
|
||||||
|
$sidenav-width: 300px !default;
|
||||||
|
$sidenav-font-size: 14px !default;
|
||||||
|
$sidenav-font-color: rgba(0,0,0,.87) !default;
|
||||||
|
$sidenav-bg-color: #fff !default;
|
||||||
|
$sidenav-padding: 16px !default;
|
||||||
|
$sidenav-item-height: 48px !default;
|
||||||
|
$sidenav-line-height: $sidenav-item-height !default;
|
||||||
|
|
||||||
|
|
||||||
|
// 15. Photo Slider
|
||||||
|
// ==========================================================================
|
||||||
|
|
||||||
|
$slider-bg-color: color('grey', 'base') !default;
|
||||||
|
$slider-bg-color-light: color('grey', 'lighten-2') !default;
|
||||||
|
$slider-indicator-color: color('green', 'base') !default;
|
||||||
|
|
||||||
|
|
||||||
|
// 16. Spinners | Loaders
|
||||||
|
// ==========================================================================
|
||||||
|
|
||||||
|
$spinner-default-color: $secondary-color !default;
|
||||||
|
|
||||||
|
|
||||||
|
// 17. Tabs
|
||||||
|
// ==========================================================================
|
||||||
|
|
||||||
|
$tabs-underline-color: $primary-color-light !default;
|
||||||
|
$tabs-text-color: $primary-color !default;
|
||||||
|
$tabs-bg-color: #fff !default;
|
||||||
|
|
||||||
|
|
||||||
|
// 18. Tables
|
||||||
|
// ==========================================================================
|
||||||
|
|
||||||
|
$table-border-color: rgba(0,0,0,.12) !default;
|
||||||
|
$table-striped-color: rgba(242, 242, 242, 0.5) !default;
|
||||||
|
|
||||||
|
|
||||||
|
// 19. Toasts
|
||||||
|
// ==========================================================================
|
||||||
|
|
||||||
|
$toast-height: 48px !default;
|
||||||
|
$toast-color: #323232 !default;
|
||||||
|
$toast-text-color: #fff !default;
|
||||||
|
$toast-action-color: #eeff41;
|
||||||
|
|
||||||
|
|
||||||
|
// 20. Typography
|
||||||
|
// ==========================================================================
|
||||||
|
|
||||||
|
$font-stack: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif !default;
|
||||||
|
$off-black: rgba(0, 0, 0, 0.87) !default;
|
||||||
|
// Header Styles
|
||||||
|
$h1-fontsize: 4.2rem !default;
|
||||||
|
$h2-fontsize: 3.56rem !default;
|
||||||
|
$h3-fontsize: 2.92rem !default;
|
||||||
|
$h4-fontsize: 2.28rem !default;
|
||||||
|
$h5-fontsize: 1.64rem !default;
|
||||||
|
$h6-fontsize: 1.15rem !default;
|
||||||
|
|
||||||
|
|
||||||
|
// 21. Footer
|
||||||
|
// ==========================================================================
|
||||||
|
|
||||||
|
$footer-font-color: #fff !default;
|
||||||
|
$footer-bg-color: $primary-color !default;
|
||||||
|
$footer-copyright-font-color: rgba(255,255,255,.8) !default;
|
||||||
|
$footer-copyright-bg-color: rgba(51,51,51,.08) !default;
|
||||||
|
|
||||||
|
|
||||||
|
// 22. Flow Text
|
||||||
|
// ==========================================================================
|
||||||
|
|
||||||
|
$range : $large-screen - $small-screen !default;
|
||||||
|
$intervals: 20 !default;
|
||||||
|
$interval-size: $range / $intervals !default;
|
||||||
|
|
||||||
|
|
||||||
|
// 23. Collections
|
||||||
|
// ==========================================================================
|
||||||
|
|
||||||
|
$collection-border-color: #e0e0e0 !default;
|
||||||
|
$collection-bg-color: #fff !default;
|
||||||
|
$collection-active-bg-color: $secondary-color !default;
|
||||||
|
$collection-active-color: lighten($secondary-color, 55%) !default;
|
||||||
|
$collection-hover-bg-color: #ddd !default;
|
||||||
|
$collection-link-color: $secondary-color !default;
|
||||||
|
$collection-line-height: 1.5rem !default;
|
||||||
|
|
||||||
|
|
||||||
|
// 24. Progress Bar
|
||||||
|
// ==========================================================================
|
||||||
|
|
||||||
|
$progress-bar-color: $secondary-color !default;
|
||||||
114
app/static/external/materialize/sass/components/_waves.scss
vendored
Normal file
114
app/static/external/materialize/sass/components/_waves.scss
vendored
Normal file
@ -0,0 +1,114 @@
|
|||||||
|
|
||||||
|
/*!
|
||||||
|
* Waves v0.6.0
|
||||||
|
* http://fian.my.id/Waves
|
||||||
|
*
|
||||||
|
* Copyright 2014 Alfiana E. Sibuea and other contributors
|
||||||
|
* Released under the MIT license
|
||||||
|
* https://github.com/fians/Waves/blob/master/LICENSE
|
||||||
|
*/
|
||||||
|
|
||||||
|
|
||||||
|
.waves-effect {
|
||||||
|
position: relative;
|
||||||
|
cursor: pointer;
|
||||||
|
display: inline-block;
|
||||||
|
overflow: hidden;
|
||||||
|
user-select: none;
|
||||||
|
-webkit-tap-highlight-color: transparent;
|
||||||
|
vertical-align: middle;
|
||||||
|
z-index: 1;
|
||||||
|
transition: .3s ease-out;
|
||||||
|
|
||||||
|
.waves-ripple {
|
||||||
|
position: absolute;
|
||||||
|
border-radius: 50%;
|
||||||
|
width: 20px;
|
||||||
|
height: 20px;
|
||||||
|
margin-top:-10px;
|
||||||
|
margin-left:-10px;
|
||||||
|
opacity: 0;
|
||||||
|
|
||||||
|
background: rgba(0,0,0,0.2);
|
||||||
|
transition: all 0.7s ease-out;
|
||||||
|
transition-property: transform, opacity;
|
||||||
|
transform: scale(0);
|
||||||
|
pointer-events: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Waves Colors
|
||||||
|
&.waves-light .waves-ripple {
|
||||||
|
background-color: rgba(255, 255, 255, 0.45);
|
||||||
|
}
|
||||||
|
&.waves-red .waves-ripple {
|
||||||
|
background-color: rgba(244, 67, 54, .70);
|
||||||
|
}
|
||||||
|
&.waves-yellow .waves-ripple {
|
||||||
|
background-color: rgba(255, 235, 59, .70);
|
||||||
|
}
|
||||||
|
&.waves-orange .waves-ripple {
|
||||||
|
background-color: rgba(255, 152, 0, .70);
|
||||||
|
}
|
||||||
|
&.waves-purple .waves-ripple {
|
||||||
|
background-color: rgba(156, 39, 176, 0.70);
|
||||||
|
}
|
||||||
|
&.waves-green .waves-ripple {
|
||||||
|
background-color: rgba(76, 175, 80, 0.70);
|
||||||
|
}
|
||||||
|
&.waves-teal .waves-ripple {
|
||||||
|
background-color: rgba(0, 150, 136, 0.70);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Style input button bug.
|
||||||
|
input[type="button"], input[type="reset"], input[type="submit"] {
|
||||||
|
border: 0;
|
||||||
|
font-style: normal;
|
||||||
|
font-size: inherit;
|
||||||
|
text-transform: inherit;
|
||||||
|
background: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
img {
|
||||||
|
position: relative;
|
||||||
|
z-index: -1;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.waves-notransition {
|
||||||
|
transition: none #{"!important"};
|
||||||
|
}
|
||||||
|
|
||||||
|
.waves-circle {
|
||||||
|
transform: translateZ(0);
|
||||||
|
-webkit-mask-image: -webkit-radial-gradient(circle, white 100%, black 100%);
|
||||||
|
}
|
||||||
|
|
||||||
|
.waves-input-wrapper {
|
||||||
|
border-radius: 0.2em;
|
||||||
|
vertical-align: bottom;
|
||||||
|
|
||||||
|
.waves-button-input {
|
||||||
|
position: relative;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
z-index: 1;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.waves-circle {
|
||||||
|
text-align: center;
|
||||||
|
width: 2.5em;
|
||||||
|
height: 2.5em;
|
||||||
|
line-height: 2.5em;
|
||||||
|
border-radius: 50%;
|
||||||
|
-webkit-mask-image: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.waves-block {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Firefox Bug: link not triggered */
|
||||||
|
.waves-effect .waves-ripple {
|
||||||
|
z-index: -1;
|
||||||
|
}
|
||||||
200
app/static/external/materialize/sass/components/forms/_checkboxes.scss
vendored
Normal file
200
app/static/external/materialize/sass/components/forms/_checkboxes.scss
vendored
Normal file
@ -0,0 +1,200 @@
|
|||||||
|
/* Checkboxes
|
||||||
|
========================================================================== */
|
||||||
|
|
||||||
|
/* Remove default checkbox */
|
||||||
|
[type="checkbox"]:not(:checked),
|
||||||
|
[type="checkbox"]:checked {
|
||||||
|
position: absolute;
|
||||||
|
opacity: 0;
|
||||||
|
pointer-events: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Checkbox Styles
|
||||||
|
[type="checkbox"] {
|
||||||
|
// Text Label Style
|
||||||
|
+ span:not(.lever) {
|
||||||
|
position: relative;
|
||||||
|
padding-left: 35px;
|
||||||
|
cursor: pointer;
|
||||||
|
display: inline-block;
|
||||||
|
height: 25px;
|
||||||
|
line-height: 25px;
|
||||||
|
font-size: 1rem;
|
||||||
|
user-select: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* checkbox aspect */
|
||||||
|
+ span:not(.lever):before,
|
||||||
|
&:not(.filled-in) + span:not(.lever):after {
|
||||||
|
content: '';
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
width: 18px;
|
||||||
|
height: 18px;
|
||||||
|
z-index: 0;
|
||||||
|
border: 2px solid $radio-empty-color;
|
||||||
|
border-radius: 1px;
|
||||||
|
margin-top: 3px;
|
||||||
|
transition: .2s;
|
||||||
|
}
|
||||||
|
|
||||||
|
&:not(.filled-in) + span:not(.lever):after {
|
||||||
|
border: 0;
|
||||||
|
transform: scale(0);
|
||||||
|
}
|
||||||
|
|
||||||
|
&:not(:checked):disabled + span:not(.lever):before {
|
||||||
|
border: none;
|
||||||
|
background-color: $input-disabled-color;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Focused styles
|
||||||
|
&.tabbed:focus + span:not(.lever):after {
|
||||||
|
transform: scale(1);
|
||||||
|
border: 0;
|
||||||
|
border-radius: 50%;
|
||||||
|
box-shadow: 0 0 0 10px rgba(0,0,0,.1);
|
||||||
|
background-color: rgba(0,0,0,.1);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
[type="checkbox"]:checked {
|
||||||
|
+ span:not(.lever):before {
|
||||||
|
top: -4px;
|
||||||
|
left: -5px;
|
||||||
|
width: 12px;
|
||||||
|
height: 22px;
|
||||||
|
border-top: 2px solid transparent;
|
||||||
|
border-left: 2px solid transparent;
|
||||||
|
border-right: $radio-border;
|
||||||
|
border-bottom: $radio-border;
|
||||||
|
transform: rotate(40deg);
|
||||||
|
backface-visibility: hidden;
|
||||||
|
transform-origin: 100% 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
&:disabled + span:before {
|
||||||
|
border-right: 2px solid $input-disabled-color;
|
||||||
|
border-bottom: 2px solid $input-disabled-color;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Indeterminate checkbox */
|
||||||
|
[type="checkbox"]:indeterminate {
|
||||||
|
+ span:not(.lever):before {
|
||||||
|
top: -11px;
|
||||||
|
left: -12px;
|
||||||
|
width: 10px;
|
||||||
|
height: 22px;
|
||||||
|
border-top: none;
|
||||||
|
border-left: none;
|
||||||
|
border-right: $radio-border;
|
||||||
|
border-bottom: none;
|
||||||
|
transform: rotate(90deg);
|
||||||
|
backface-visibility: hidden;
|
||||||
|
transform-origin: 100% 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Disabled indeterminate
|
||||||
|
&:disabled + span:not(.lever):before {
|
||||||
|
border-right: 2px solid $input-disabled-color;
|
||||||
|
background-color: transparent;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Filled in Style
|
||||||
|
[type="checkbox"].filled-in {
|
||||||
|
// General
|
||||||
|
+ span:not(.lever):after {
|
||||||
|
border-radius: 2px;
|
||||||
|
}
|
||||||
|
|
||||||
|
+ span:not(.lever):before,
|
||||||
|
+ span:not(.lever):after {
|
||||||
|
content: '';
|
||||||
|
left: 0;
|
||||||
|
position: absolute;
|
||||||
|
/* .1s delay is for check animation */
|
||||||
|
transition: border .25s, background-color .25s, width .20s .1s, height .20s .1s, top .20s .1s, left .20s .1s;
|
||||||
|
z-index: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Unchecked style
|
||||||
|
&:not(:checked) + span:not(.lever):before {
|
||||||
|
width: 0;
|
||||||
|
height: 0;
|
||||||
|
border: 3px solid transparent;
|
||||||
|
left: 6px;
|
||||||
|
top: 10px;
|
||||||
|
transform: rotateZ(37deg);
|
||||||
|
transform-origin: 100% 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
&:not(:checked) + span:not(.lever):after {
|
||||||
|
height: 20px;
|
||||||
|
width: 20px;
|
||||||
|
background-color: transparent;
|
||||||
|
border: 2px solid $radio-empty-color;
|
||||||
|
top: 0px;
|
||||||
|
z-index: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Checked style
|
||||||
|
&:checked {
|
||||||
|
+ span:not(.lever):before {
|
||||||
|
top: 0;
|
||||||
|
left: 1px;
|
||||||
|
width: 8px;
|
||||||
|
height: 13px;
|
||||||
|
border-top: 2px solid transparent;
|
||||||
|
border-left: 2px solid transparent;
|
||||||
|
border-right: 2px solid $input-background;
|
||||||
|
border-bottom: 2px solid $input-background;
|
||||||
|
transform: rotateZ(37deg);
|
||||||
|
transform-origin: 100% 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
+ span:not(.lever):after {
|
||||||
|
top: 0;
|
||||||
|
width: 20px;
|
||||||
|
height: 20px;
|
||||||
|
border: 2px solid $secondary-color;
|
||||||
|
background-color: $secondary-color;
|
||||||
|
z-index: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Focused styles
|
||||||
|
&.tabbed:focus + span:not(.lever):after {
|
||||||
|
border-radius: 2px;
|
||||||
|
border-color: $radio-empty-color;
|
||||||
|
background-color: rgba(0,0,0,.1);
|
||||||
|
}
|
||||||
|
|
||||||
|
&.tabbed:checked:focus + span:not(.lever):after {
|
||||||
|
border-radius: 2px;
|
||||||
|
background-color: $secondary-color;
|
||||||
|
border-color: $secondary-color;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Disabled style
|
||||||
|
&:disabled:not(:checked) + span:not(.lever):before {
|
||||||
|
background-color: transparent;
|
||||||
|
border: 2px solid transparent;
|
||||||
|
}
|
||||||
|
|
||||||
|
&:disabled:not(:checked) + span:not(.lever):after {
|
||||||
|
border-color: transparent;
|
||||||
|
background-color: $input-disabled-solid-color;
|
||||||
|
}
|
||||||
|
|
||||||
|
&:disabled:checked + span:not(.lever):before {
|
||||||
|
background-color: transparent;
|
||||||
|
}
|
||||||
|
|
||||||
|
&:disabled:checked + span:not(.lever):after {
|
||||||
|
background-color: $input-disabled-solid-color;
|
||||||
|
border-color: $input-disabled-solid-color;
|
||||||
|
}
|
||||||
|
}
|
||||||
44
app/static/external/materialize/sass/components/forms/_file-input.scss
vendored
Normal file
44
app/static/external/materialize/sass/components/forms/_file-input.scss
vendored
Normal file
@ -0,0 +1,44 @@
|
|||||||
|
/* File Input
|
||||||
|
========================================================================== */
|
||||||
|
|
||||||
|
.file-field {
|
||||||
|
position: relative;
|
||||||
|
|
||||||
|
.file-path-wrapper {
|
||||||
|
overflow: hidden;
|
||||||
|
padding-left: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
input.file-path { width: 100%; }
|
||||||
|
|
||||||
|
.btn {
|
||||||
|
float: left;
|
||||||
|
height: $input-height;
|
||||||
|
line-height: $input-height;
|
||||||
|
}
|
||||||
|
|
||||||
|
span {
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
input[type=file] {
|
||||||
|
|
||||||
|
// Needed to override webkit button
|
||||||
|
&::-webkit-file-upload-button {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
right: 0;
|
||||||
|
left: 0;
|
||||||
|
bottom: 0;
|
||||||
|
width: 100%;
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
font-size: 20px;
|
||||||
|
cursor: pointer;
|
||||||
|
opacity: 0;
|
||||||
|
filter: alpha(opacity=0);
|
||||||
|
}
|
||||||
|
}
|
||||||
22
app/static/external/materialize/sass/components/forms/_forms.scss
vendored
Normal file
22
app/static/external/materialize/sass/components/forms/_forms.scss
vendored
Normal file
@ -0,0 +1,22 @@
|
|||||||
|
// Remove Focus Boxes
|
||||||
|
select:focus {
|
||||||
|
outline: $select-focus;
|
||||||
|
}
|
||||||
|
|
||||||
|
button:focus {
|
||||||
|
outline: none;
|
||||||
|
background-color: $button-background-focus;
|
||||||
|
}
|
||||||
|
|
||||||
|
label {
|
||||||
|
font-size: $label-font-size;
|
||||||
|
color: $input-border-color;
|
||||||
|
}
|
||||||
|
|
||||||
|
@import 'input-fields';
|
||||||
|
@import 'radio-buttons';
|
||||||
|
@import 'checkboxes';
|
||||||
|
@import 'switches';
|
||||||
|
@import 'select';
|
||||||
|
@import 'file-input';
|
||||||
|
@import 'range';
|
||||||
354
app/static/external/materialize/sass/components/forms/_input-fields.scss
vendored
Normal file
354
app/static/external/materialize/sass/components/forms/_input-fields.scss
vendored
Normal file
@ -0,0 +1,354 @@
|
|||||||
|
/* Text Inputs + Textarea
|
||||||
|
========================================================================== */
|
||||||
|
|
||||||
|
/* Style Placeholders */
|
||||||
|
|
||||||
|
::placeholder {
|
||||||
|
color: $placeholder-text-color;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Text inputs */
|
||||||
|
|
||||||
|
input:not([type]),
|
||||||
|
input[type=text]:not(.browser-default),
|
||||||
|
input[type=password]:not(.browser-default),
|
||||||
|
input[type=email]:not(.browser-default),
|
||||||
|
input[type=url]:not(.browser-default),
|
||||||
|
input[type=time]:not(.browser-default),
|
||||||
|
input[type=date]:not(.browser-default),
|
||||||
|
input[type=datetime]:not(.browser-default),
|
||||||
|
input[type=datetime-local]:not(.browser-default),
|
||||||
|
input[type=tel]:not(.browser-default),
|
||||||
|
input[type=number]:not(.browser-default),
|
||||||
|
input[type=search]:not(.browser-default),
|
||||||
|
textarea.materialize-textarea {
|
||||||
|
|
||||||
|
// General Styles
|
||||||
|
background-color: transparent;
|
||||||
|
border: none;
|
||||||
|
border-bottom: $input-border;
|
||||||
|
border-radius: 0;
|
||||||
|
outline: none;
|
||||||
|
height: $input-height;
|
||||||
|
width: 100%;
|
||||||
|
font-size: $input-font-size;
|
||||||
|
margin: $input-margin;
|
||||||
|
padding: $input-padding;
|
||||||
|
box-shadow: none;
|
||||||
|
box-sizing: content-box;
|
||||||
|
transition: box-shadow .3s, border .3s;
|
||||||
|
|
||||||
|
// Disabled input style
|
||||||
|
&:disabled,
|
||||||
|
&[readonly="readonly"] {
|
||||||
|
color: $input-disabled-color;
|
||||||
|
border-bottom: $input-disabled-border;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Disabled label style
|
||||||
|
&:disabled+label,
|
||||||
|
&[readonly="readonly"]+label {
|
||||||
|
color: $input-disabled-color;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Focused input style
|
||||||
|
&:focus:not([readonly]) {
|
||||||
|
border-bottom: 1px solid $input-focus-color;
|
||||||
|
box-shadow: 0 1px 0 0 $input-focus-color;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Focused label style
|
||||||
|
&:focus:not([readonly])+label {
|
||||||
|
color: $input-focus-color;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Hide helper text on data message
|
||||||
|
&.valid ~ .helper-text[data-success],
|
||||||
|
&:focus.valid ~ .helper-text[data-success],
|
||||||
|
&.invalid ~ .helper-text[data-error],
|
||||||
|
&:focus.invalid ~ .helper-text[data-error] {
|
||||||
|
@extend %hidden-text;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Valid Input Style
|
||||||
|
&.valid,
|
||||||
|
&:focus.valid {
|
||||||
|
@extend %valid-input-style;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Custom Success Message
|
||||||
|
&.valid ~ .helper-text:after,
|
||||||
|
&:focus.valid ~ .helper-text:after {
|
||||||
|
@extend %custom-success-message;
|
||||||
|
}
|
||||||
|
&:focus.valid ~ label {
|
||||||
|
color: $input-success-color;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Invalid Input Style
|
||||||
|
&.invalid,
|
||||||
|
&:focus.invalid {
|
||||||
|
@extend %invalid-input-style;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Custom Error message
|
||||||
|
&.invalid ~ .helper-text:after,
|
||||||
|
&:focus.invalid ~ .helper-text:after {
|
||||||
|
@extend %custom-error-message;
|
||||||
|
}
|
||||||
|
&:focus.invalid ~ label {
|
||||||
|
color: $input-error-color;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Full width label when using validate for error messages
|
||||||
|
&.validate + label {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Form Message Shared Styles
|
||||||
|
& + label:after {
|
||||||
|
@extend %input-after-style;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
/* Validation Sass Placeholders */
|
||||||
|
%valid-input-style {
|
||||||
|
border-bottom: 1px solid $input-success-color;
|
||||||
|
box-shadow: 0 1px 0 0 $input-success-color;
|
||||||
|
}
|
||||||
|
%invalid-input-style {
|
||||||
|
border-bottom: $input-invalid-border;
|
||||||
|
box-shadow: 0 1px 0 0 $input-error-color;
|
||||||
|
}
|
||||||
|
%hidden-text {
|
||||||
|
color: transparent;
|
||||||
|
user-select: none;
|
||||||
|
pointer-events: none;
|
||||||
|
}
|
||||||
|
%custom-success-message {
|
||||||
|
content: attr(data-success);
|
||||||
|
color: $input-success-color;
|
||||||
|
}
|
||||||
|
%custom-error-message {
|
||||||
|
content: attr(data-error);
|
||||||
|
color: $input-error-color;
|
||||||
|
}
|
||||||
|
%input-after-style {
|
||||||
|
display: block;
|
||||||
|
content: "";
|
||||||
|
position: absolute;
|
||||||
|
top: 100%;
|
||||||
|
left: 0;
|
||||||
|
opacity: 0;
|
||||||
|
transition: .2s opacity ease-out, .2s color ease-out;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
// Styling for input field wrapper
|
||||||
|
.input-field {
|
||||||
|
// Inline styles
|
||||||
|
&.inline {
|
||||||
|
display: inline-block;
|
||||||
|
vertical-align: middle;
|
||||||
|
margin-left: 5px;
|
||||||
|
|
||||||
|
input,
|
||||||
|
.select-dropdown {
|
||||||
|
margin-bottom: 1rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Gutter spacing
|
||||||
|
&.col {
|
||||||
|
label {
|
||||||
|
left: $gutter-width / 2;
|
||||||
|
}
|
||||||
|
|
||||||
|
.prefix ~ label,
|
||||||
|
.prefix ~ .validate ~ label {
|
||||||
|
width: calc(100% - 3rem - #{$gutter-width});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
position: relative;
|
||||||
|
margin-top: 1rem;
|
||||||
|
margin-bottom: 1rem;
|
||||||
|
|
||||||
|
& > label {
|
||||||
|
color: $input-border-color;
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
font-size: 1rem;
|
||||||
|
cursor: text;
|
||||||
|
transition: transform .2s ease-out, color .2s ease-out;
|
||||||
|
transform-origin: 0% 100%;
|
||||||
|
text-align: initial;
|
||||||
|
transform: translateY(12px);
|
||||||
|
|
||||||
|
&:not(.label-icon).active {
|
||||||
|
transform: translateY(-14px) scale(.8);
|
||||||
|
transform-origin: 0 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Autofill + date + time inputs
|
||||||
|
& > input[type]:-webkit-autofill:not(.browser-default):not([type="search"]) + label,
|
||||||
|
& > input[type=date]:not(.browser-default) + label,
|
||||||
|
& > input[type=time]:not(.browser-default) + label {
|
||||||
|
transform: translateY(-14px) scale(.8);
|
||||||
|
transform-origin: 0 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.helper-text {
|
||||||
|
&::after {
|
||||||
|
opacity: 1;
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
position: relative;
|
||||||
|
min-height: 18px;
|
||||||
|
display: block;
|
||||||
|
font-size: 12px;
|
||||||
|
color: rgba(0,0,0,.54);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Prefix Icons
|
||||||
|
.prefix {
|
||||||
|
position: absolute;
|
||||||
|
width: $input-height;
|
||||||
|
font-size: $input-icon-size;
|
||||||
|
transition: color .2s;
|
||||||
|
top: ($input-height - $input-icon-size) / 2;
|
||||||
|
|
||||||
|
&.active { color: $input-focus-color; }
|
||||||
|
}
|
||||||
|
|
||||||
|
.prefix ~ input,
|
||||||
|
.prefix ~ textarea,
|
||||||
|
.prefix ~ label,
|
||||||
|
.prefix ~ .validate ~ label,
|
||||||
|
.prefix ~ .helper-text,
|
||||||
|
.prefix ~ .autocomplete-content {
|
||||||
|
margin-left: 3rem;
|
||||||
|
width: 92%;
|
||||||
|
width: calc(100% - 3rem);
|
||||||
|
}
|
||||||
|
|
||||||
|
.prefix ~ label { margin-left: 3rem; }
|
||||||
|
|
||||||
|
@media #{$medium-and-down} {
|
||||||
|
.prefix ~ input {
|
||||||
|
width: 86%;
|
||||||
|
width: calc(100% - 3rem);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media #{$small-and-down} {
|
||||||
|
.prefix ~ input {
|
||||||
|
width: 80%;
|
||||||
|
width: calc(100% - 3rem);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
/* Search Field */
|
||||||
|
|
||||||
|
.input-field input[type=search] {
|
||||||
|
display: block;
|
||||||
|
line-height: inherit;
|
||||||
|
transition: .3s background-color;
|
||||||
|
|
||||||
|
.nav-wrapper & {
|
||||||
|
height: inherit;
|
||||||
|
padding-left: 4rem;
|
||||||
|
width: calc(100% - 4rem);
|
||||||
|
border: 0;
|
||||||
|
box-shadow: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
&:focus:not(.browser-default) {
|
||||||
|
background-color: $input-background;
|
||||||
|
border: 0;
|
||||||
|
box-shadow: none;
|
||||||
|
color: #444;
|
||||||
|
|
||||||
|
& + label i,
|
||||||
|
& ~ .mdi-navigation-close,
|
||||||
|
& ~ .material-icons {
|
||||||
|
color: #444;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
& + .label-icon {
|
||||||
|
transform: none;
|
||||||
|
left: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
& ~ .mdi-navigation-close,
|
||||||
|
& ~ .material-icons {
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
right: 1rem;
|
||||||
|
color: transparent;
|
||||||
|
cursor: pointer;
|
||||||
|
font-size: $input-icon-size;
|
||||||
|
transition: .3s color;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
/* Textarea */
|
||||||
|
|
||||||
|
// Default textarea
|
||||||
|
textarea {
|
||||||
|
width: 100%;
|
||||||
|
height: $input-height;
|
||||||
|
background-color: transparent;
|
||||||
|
|
||||||
|
&.materialize-textarea {
|
||||||
|
line-height: normal;
|
||||||
|
overflow-y: hidden; /* prevents scroll bar flash */
|
||||||
|
padding: .8rem 0 .8rem 0; /* prevents text jump on Enter keypress */
|
||||||
|
resize: none;
|
||||||
|
min-height: $input-height;
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// For textarea autoresize
|
||||||
|
.hiddendiv {
|
||||||
|
visibility: hidden;
|
||||||
|
white-space: pre-wrap;
|
||||||
|
word-wrap: break-word;
|
||||||
|
overflow-wrap: break-word; /* future version of deprecated 'word-wrap' */
|
||||||
|
padding-top: 1.2rem; /* prevents text jump on Enter keypress */
|
||||||
|
|
||||||
|
// Reduces repaints
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
z-index: -1;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
/* Autocomplete */
|
||||||
|
.autocomplete-content {
|
||||||
|
li {
|
||||||
|
.highlight { color: #444; }
|
||||||
|
|
||||||
|
img {
|
||||||
|
height: $dropdown-item-height - 10;
|
||||||
|
width: $dropdown-item-height - 10;
|
||||||
|
margin: 5px 15px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Character Counter */
|
||||||
|
.character-counter {
|
||||||
|
min-height: 18px;
|
||||||
|
}
|
||||||
115
app/static/external/materialize/sass/components/forms/_radio-buttons.scss
vendored
Normal file
115
app/static/external/materialize/sass/components/forms/_radio-buttons.scss
vendored
Normal file
@ -0,0 +1,115 @@
|
|||||||
|
/* Radio Buttons
|
||||||
|
========================================================================== */
|
||||||
|
|
||||||
|
// Remove default Radio Buttons
|
||||||
|
[type="radio"]:not(:checked),
|
||||||
|
[type="radio"]:checked {
|
||||||
|
position: absolute;
|
||||||
|
opacity: 0;
|
||||||
|
pointer-events: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
[type="radio"]:not(:checked) + span,
|
||||||
|
[type="radio"]:checked + span {
|
||||||
|
position: relative;
|
||||||
|
padding-left: 35px;
|
||||||
|
cursor: pointer;
|
||||||
|
display: inline-block;
|
||||||
|
height: 25px;
|
||||||
|
line-height: 25px;
|
||||||
|
font-size: 1rem;
|
||||||
|
transition: .28s ease;
|
||||||
|
user-select: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
[type="radio"] + span:before,
|
||||||
|
[type="radio"] + span:after {
|
||||||
|
content: '';
|
||||||
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
|
top: 0;
|
||||||
|
margin: 4px;
|
||||||
|
width: 16px;
|
||||||
|
height: 16px;
|
||||||
|
z-index: 0;
|
||||||
|
transition: .28s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Unchecked styles */
|
||||||
|
[type="radio"]:not(:checked) + span:before,
|
||||||
|
[type="radio"]:not(:checked) + span:after,
|
||||||
|
[type="radio"]:checked + span:before,
|
||||||
|
[type="radio"]:checked + span:after,
|
||||||
|
[type="radio"].with-gap:checked + span:before,
|
||||||
|
[type="radio"].with-gap:checked + span:after {
|
||||||
|
border-radius: 50%;
|
||||||
|
}
|
||||||
|
|
||||||
|
[type="radio"]:not(:checked) + span:before,
|
||||||
|
[type="radio"]:not(:checked) + span:after {
|
||||||
|
border: 2px solid $radio-empty-color;
|
||||||
|
}
|
||||||
|
|
||||||
|
[type="radio"]:not(:checked) + span:after {
|
||||||
|
transform: scale(0);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Checked styles */
|
||||||
|
[type="radio"]:checked + span:before {
|
||||||
|
border: 2px solid transparent;
|
||||||
|
}
|
||||||
|
|
||||||
|
[type="radio"]:checked + span:after,
|
||||||
|
[type="radio"].with-gap:checked + span:before,
|
||||||
|
[type="radio"].with-gap:checked + span:after {
|
||||||
|
border: $radio-border;
|
||||||
|
}
|
||||||
|
|
||||||
|
[type="radio"]:checked + span:after,
|
||||||
|
[type="radio"].with-gap:checked + span:after {
|
||||||
|
background-color: $radio-fill-color;
|
||||||
|
}
|
||||||
|
|
||||||
|
[type="radio"]:checked + span:after {
|
||||||
|
transform: scale(1.02);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Radio With gap */
|
||||||
|
[type="radio"].with-gap:checked + span:after {
|
||||||
|
transform: scale(.5);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Focused styles */
|
||||||
|
[type="radio"].tabbed:focus + span:before {
|
||||||
|
box-shadow: 0 0 0 10px rgba(0,0,0,.1);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Disabled Radio With gap */
|
||||||
|
[type="radio"].with-gap:disabled:checked + span:before {
|
||||||
|
border: 2px solid $input-disabled-color;
|
||||||
|
}
|
||||||
|
|
||||||
|
[type="radio"].with-gap:disabled:checked + span:after {
|
||||||
|
border: none;
|
||||||
|
background-color: $input-disabled-color;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Disabled style */
|
||||||
|
[type="radio"]:disabled:not(:checked) + span:before,
|
||||||
|
[type="radio"]:disabled:checked + span:before {
|
||||||
|
background-color: transparent;
|
||||||
|
border-color: $input-disabled-color;
|
||||||
|
}
|
||||||
|
|
||||||
|
[type="radio"]:disabled + span {
|
||||||
|
color: $input-disabled-color;
|
||||||
|
}
|
||||||
|
|
||||||
|
[type="radio"]:disabled:not(:checked) + span:before {
|
||||||
|
border-color: $input-disabled-color;
|
||||||
|
}
|
||||||
|
|
||||||
|
[type="radio"]:disabled:checked + span:after {
|
||||||
|
background-color: $input-disabled-color;
|
||||||
|
border-color: $input-disabled-solid-color;
|
||||||
|
}
|
||||||
161
app/static/external/materialize/sass/components/forms/_range.scss
vendored
Normal file
161
app/static/external/materialize/sass/components/forms/_range.scss
vendored
Normal file
@ -0,0 +1,161 @@
|
|||||||
|
/* Range
|
||||||
|
========================================================================== */
|
||||||
|
|
||||||
|
.range-field {
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
input[type=range],
|
||||||
|
input[type=range] + .thumb {
|
||||||
|
@extend .no-select;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
input[type=range] {
|
||||||
|
position: relative;
|
||||||
|
background-color: transparent;
|
||||||
|
border: none;
|
||||||
|
outline: none;
|
||||||
|
width: 100%;
|
||||||
|
margin: 15px 0;
|
||||||
|
padding: 0;
|
||||||
|
|
||||||
|
&:focus {
|
||||||
|
outline: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
input[type=range] + .thumb {
|
||||||
|
position: absolute;
|
||||||
|
top: 10px;
|
||||||
|
left: 0;
|
||||||
|
border: none;
|
||||||
|
height: 0;
|
||||||
|
width: 0;
|
||||||
|
border-radius: 50%;
|
||||||
|
background-color: $radio-fill-color;
|
||||||
|
margin-left: 7px;
|
||||||
|
|
||||||
|
transform-origin: 50% 50%;
|
||||||
|
transform: rotate(-45deg);
|
||||||
|
|
||||||
|
.value {
|
||||||
|
display: block;
|
||||||
|
width: 30px;
|
||||||
|
text-align: center;
|
||||||
|
color: $radio-fill-color;
|
||||||
|
font-size: 0;
|
||||||
|
transform: rotate(45deg);
|
||||||
|
}
|
||||||
|
|
||||||
|
&.active {
|
||||||
|
border-radius: 50% 50% 50% 0;
|
||||||
|
|
||||||
|
.value {
|
||||||
|
color: $input-background;
|
||||||
|
margin-left: -1px;
|
||||||
|
margin-top: 8px;
|
||||||
|
font-size: 10px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Shared
|
||||||
|
@mixin range-track {
|
||||||
|
height: $track-height;
|
||||||
|
background: #c2c0c2;
|
||||||
|
border: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
@mixin range-thumb {
|
||||||
|
border: none;
|
||||||
|
height: $range-height;
|
||||||
|
width: $range-width;
|
||||||
|
border-radius: 50%;
|
||||||
|
background: $radio-fill-color;
|
||||||
|
transition: box-shadow .3s;
|
||||||
|
}
|
||||||
|
|
||||||
|
// WebKit
|
||||||
|
input[type=range] {
|
||||||
|
-webkit-appearance: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
input[type=range]::-webkit-slider-runnable-track {
|
||||||
|
@include range-track;
|
||||||
|
}
|
||||||
|
|
||||||
|
input[type=range]::-webkit-slider-thumb {
|
||||||
|
@include range-thumb;
|
||||||
|
-webkit-appearance: none;
|
||||||
|
background-color: $radio-fill-color;
|
||||||
|
transform-origin: 50% 50%;
|
||||||
|
margin: -5px 0 0 0;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.keyboard-focused input[type=range]:focus:not(.active)::-webkit-slider-thumb {
|
||||||
|
box-shadow: 0 0 0 10px rgba($radio-fill-color, .26);
|
||||||
|
}
|
||||||
|
|
||||||
|
// FireFox
|
||||||
|
input[type=range] {
|
||||||
|
/* fix for FF unable to apply focus style bug */
|
||||||
|
border: 1px solid white;
|
||||||
|
|
||||||
|
/*required for proper track sizing in FF*/
|
||||||
|
}
|
||||||
|
|
||||||
|
input[type=range]::-moz-range-track {
|
||||||
|
@include range-track;
|
||||||
|
}
|
||||||
|
|
||||||
|
input[type=range]::-moz-focus-inner {
|
||||||
|
border: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
input[type=range]::-moz-range-thumb {
|
||||||
|
@include range-thumb;
|
||||||
|
margin-top: -5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
// hide the outline behind the border
|
||||||
|
input[type=range]:-moz-focusring {
|
||||||
|
outline: 1px solid #fff;
|
||||||
|
outline-offset: -1px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.keyboard-focused input[type=range]:focus:not(.active)::-moz-range-thumb {
|
||||||
|
box-shadow: 0 0 0 10px rgba($radio-fill-color, .26);
|
||||||
|
}
|
||||||
|
|
||||||
|
// IE 10+
|
||||||
|
input[type=range]::-ms-track {
|
||||||
|
height: $track-height;
|
||||||
|
|
||||||
|
// remove bg colour from the track, we'll use ms-fill-lower and ms-fill-upper instead
|
||||||
|
background: transparent;
|
||||||
|
|
||||||
|
// leave room for the larger thumb to overflow with a transparent border */
|
||||||
|
border-color: transparent;
|
||||||
|
border-width: 6px 0;
|
||||||
|
|
||||||
|
/*remove default tick marks*/
|
||||||
|
color: transparent;
|
||||||
|
}
|
||||||
|
|
||||||
|
input[type=range]::-ms-fill-lower {
|
||||||
|
background: #777;
|
||||||
|
}
|
||||||
|
|
||||||
|
input[type=range]::-ms-fill-upper {
|
||||||
|
background: #ddd;
|
||||||
|
}
|
||||||
|
|
||||||
|
input[type=range]::-ms-thumb {
|
||||||
|
@include range-thumb;
|
||||||
|
}
|
||||||
|
|
||||||
|
.keyboard-focused input[type=range]:focus:not(.active)::-ms-thumb {
|
||||||
|
box-shadow: 0 0 0 10px rgba($radio-fill-color, .26);
|
||||||
|
}
|
||||||
180
app/static/external/materialize/sass/components/forms/_select.scss
vendored
Normal file
180
app/static/external/materialize/sass/components/forms/_select.scss
vendored
Normal file
@ -0,0 +1,180 @@
|
|||||||
|
/* Select Field
|
||||||
|
========================================================================== */
|
||||||
|
|
||||||
|
select { display: none; }
|
||||||
|
select.browser-default { display: block; }
|
||||||
|
|
||||||
|
select {
|
||||||
|
background-color: $select-background;
|
||||||
|
width: 100%;
|
||||||
|
padding: $select-padding;
|
||||||
|
border: $select-border;
|
||||||
|
border-radius: $select-radius;
|
||||||
|
height: $input-height;
|
||||||
|
}
|
||||||
|
|
||||||
|
.select-label {
|
||||||
|
position: absolute;
|
||||||
|
}
|
||||||
|
|
||||||
|
.select-wrapper {
|
||||||
|
&.valid .helper-text[data-success],
|
||||||
|
&.invalid ~ .helper-text[data-error] {
|
||||||
|
@extend %hidden-text;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.valid {
|
||||||
|
& > input.select-dropdown {
|
||||||
|
@extend %valid-input-style;
|
||||||
|
}
|
||||||
|
|
||||||
|
& ~ .helper-text:after {
|
||||||
|
@extend %custom-success-message;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&.invalid {
|
||||||
|
& > input.select-dropdown,
|
||||||
|
& > input.select-dropdown:focus {
|
||||||
|
@extend %invalid-input-style;
|
||||||
|
}
|
||||||
|
|
||||||
|
& ~ .helper-text:after {
|
||||||
|
@extend %custom-error-message;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&.valid + label,
|
||||||
|
&.invalid + label {
|
||||||
|
width: 100%;
|
||||||
|
pointer-events: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
& + label:after {
|
||||||
|
@extend %input-after-style;
|
||||||
|
}
|
||||||
|
|
||||||
|
position: relative;
|
||||||
|
|
||||||
|
input.select-dropdown {
|
||||||
|
&:focus {
|
||||||
|
border-bottom: 1px solid $input-focus-color;
|
||||||
|
}
|
||||||
|
position: relative;
|
||||||
|
cursor: pointer;
|
||||||
|
background-color: transparent;
|
||||||
|
border: none;
|
||||||
|
border-bottom: $input-border;
|
||||||
|
outline: none;
|
||||||
|
height: $input-height;
|
||||||
|
line-height: $input-height;
|
||||||
|
width: 100%;
|
||||||
|
font-size: $input-font-size;
|
||||||
|
margin: $input-margin;
|
||||||
|
padding: 0;
|
||||||
|
display: block;
|
||||||
|
user-select:none;
|
||||||
|
z-index: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
.caret {
|
||||||
|
position: absolute;
|
||||||
|
right: 0;
|
||||||
|
top: 0;
|
||||||
|
bottom: 0;
|
||||||
|
margin: auto 0;
|
||||||
|
z-index: 0;
|
||||||
|
fill: rgba(0,0,0,.87);
|
||||||
|
}
|
||||||
|
|
||||||
|
& + label {
|
||||||
|
position: absolute;
|
||||||
|
top: -26px;
|
||||||
|
font-size: $label-font-size;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Disabled styles
|
||||||
|
select:disabled {
|
||||||
|
color: $input-disabled-color;
|
||||||
|
}
|
||||||
|
|
||||||
|
.select-wrapper.disabled {
|
||||||
|
+ label {
|
||||||
|
color: $input-disabled-color;
|
||||||
|
}
|
||||||
|
.caret {
|
||||||
|
fill: $input-disabled-color;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.select-wrapper input.select-dropdown:disabled {
|
||||||
|
color: $input-disabled-color;
|
||||||
|
cursor: default;
|
||||||
|
user-select: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.select-wrapper i {
|
||||||
|
color: $select-disabled-color;
|
||||||
|
}
|
||||||
|
|
||||||
|
.select-dropdown li.disabled,
|
||||||
|
.select-dropdown li.disabled > span,
|
||||||
|
.select-dropdown li.optgroup {
|
||||||
|
color: $select-disabled-color;
|
||||||
|
background-color: transparent;
|
||||||
|
}
|
||||||
|
|
||||||
|
body.keyboard-focused {
|
||||||
|
.select-dropdown.dropdown-content li:focus {
|
||||||
|
background-color: $select-option-focus;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.select-dropdown.dropdown-content {
|
||||||
|
li {
|
||||||
|
&:hover {
|
||||||
|
background-color: $select-option-hover;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.selected {
|
||||||
|
background-color: $select-option-selected;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Prefix Icons
|
||||||
|
.prefix ~ .select-wrapper {
|
||||||
|
margin-left: 3rem;
|
||||||
|
width: 92%;
|
||||||
|
width: calc(100% - 3rem);
|
||||||
|
}
|
||||||
|
|
||||||
|
.prefix ~ label { margin-left: 3rem; }
|
||||||
|
|
||||||
|
// Icons
|
||||||
|
.select-dropdown li {
|
||||||
|
img {
|
||||||
|
height: $dropdown-item-height - 10;
|
||||||
|
width: $dropdown-item-height - 10;
|
||||||
|
margin: 5px 15px;
|
||||||
|
float: right;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Optgroup styles
|
||||||
|
.select-dropdown li.optgroup {
|
||||||
|
border-top: 1px solid $dropdown-hover-bg-color;
|
||||||
|
|
||||||
|
&.selected > span {
|
||||||
|
color: rgba(0, 0, 0, .7);
|
||||||
|
}
|
||||||
|
|
||||||
|
& > span {
|
||||||
|
color: rgba(0, 0, 0, .4);
|
||||||
|
}
|
||||||
|
|
||||||
|
& ~ li.optgroup-option {
|
||||||
|
padding-left: 1rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
89
app/static/external/materialize/sass/components/forms/_switches.scss
vendored
Normal file
89
app/static/external/materialize/sass/components/forms/_switches.scss
vendored
Normal file
@ -0,0 +1,89 @@
|
|||||||
|
/* Switch
|
||||||
|
========================================================================== */
|
||||||
|
|
||||||
|
.switch,
|
||||||
|
.switch * {
|
||||||
|
-webkit-tap-highlight-color: transparent;
|
||||||
|
user-select: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.switch label {
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
.switch label input[type=checkbox] {
|
||||||
|
opacity: 0;
|
||||||
|
width: 0;
|
||||||
|
height: 0;
|
||||||
|
|
||||||
|
&:checked + .lever {
|
||||||
|
background-color: $switch-checked-lever-bg;
|
||||||
|
|
||||||
|
&:before, &:after {
|
||||||
|
left: 18px;
|
||||||
|
}
|
||||||
|
|
||||||
|
&:after {
|
||||||
|
background-color: $switch-bg-color;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.switch label .lever {
|
||||||
|
content: "";
|
||||||
|
display: inline-block;
|
||||||
|
position: relative;
|
||||||
|
width: 36px;
|
||||||
|
height: 14px;
|
||||||
|
background-color: $switch-unchecked-lever-bg;
|
||||||
|
border-radius: $switch-radius;
|
||||||
|
margin-right: 10px;
|
||||||
|
transition: background 0.3s ease;
|
||||||
|
vertical-align: middle;
|
||||||
|
margin: 0 16px;
|
||||||
|
|
||||||
|
&:before, &:after {
|
||||||
|
content: "";
|
||||||
|
position: absolute;
|
||||||
|
display: inline-block;
|
||||||
|
width: 20px;
|
||||||
|
height: 20px;
|
||||||
|
border-radius: 50%;
|
||||||
|
left: 0;
|
||||||
|
top: -3px;
|
||||||
|
transition: left 0.3s ease, background .3s ease, box-shadow 0.1s ease, transform .1s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
&:before {
|
||||||
|
background-color: transparentize($switch-bg-color, .85);
|
||||||
|
}
|
||||||
|
|
||||||
|
&:after {
|
||||||
|
background-color: $switch-unchecked-bg;
|
||||||
|
box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Switch active style
|
||||||
|
input[type=checkbox]:checked:not(:disabled) ~ .lever:active::before,
|
||||||
|
input[type=checkbox]:checked:not(:disabled).tabbed:focus ~ .lever::before {
|
||||||
|
transform: scale(2.4);
|
||||||
|
background-color: transparentize($switch-bg-color, .85);
|
||||||
|
}
|
||||||
|
|
||||||
|
input[type=checkbox]:not(:disabled) ~ .lever:active:before,
|
||||||
|
input[type=checkbox]:not(:disabled).tabbed:focus ~ .lever::before {
|
||||||
|
transform: scale(2.4);
|
||||||
|
background-color: rgba(0,0,0,.08);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Disabled Styles
|
||||||
|
.switch input[type=checkbox][disabled] + .lever {
|
||||||
|
cursor: default;
|
||||||
|
background-color: rgba(0,0,0,.12);
|
||||||
|
}
|
||||||
|
|
||||||
|
.switch label input[type=checkbox][disabled] + .lever:after,
|
||||||
|
.switch label input[type=checkbox][disabled]:checked + .lever:after {
|
||||||
|
background-color: $input-disabled-solid-color;
|
||||||
|
}
|
||||||
41
app/static/external/materialize/sass/materialize.scss
vendored
Normal file
41
app/static/external/materialize/sass/materialize.scss
vendored
Normal file
@ -0,0 +1,41 @@
|
|||||||
|
@charset "UTF-8";
|
||||||
|
|
||||||
|
// Color
|
||||||
|
@import "components/color-variables";
|
||||||
|
@import "components/color-classes";
|
||||||
|
|
||||||
|
// Variables;
|
||||||
|
@import "components/variables";
|
||||||
|
|
||||||
|
// Reset
|
||||||
|
@import "components/normalize";
|
||||||
|
|
||||||
|
// components
|
||||||
|
@import "components/global";
|
||||||
|
@import "components/badges";
|
||||||
|
@import "components/icons-material-design";
|
||||||
|
@import "components/grid";
|
||||||
|
@import "components/navbar";
|
||||||
|
@import "components/typography";
|
||||||
|
@import "components/transitions";
|
||||||
|
@import "components/cards";
|
||||||
|
@import "components/toast";
|
||||||
|
@import "components/tabs";
|
||||||
|
@import "components/tooltip";
|
||||||
|
@import "components/buttons";
|
||||||
|
@import "components/dropdown";
|
||||||
|
@import "components/waves";
|
||||||
|
@import "components/modal";
|
||||||
|
@import "components/collapsible";
|
||||||
|
@import "components/chips";
|
||||||
|
@import "components/materialbox";
|
||||||
|
@import "components/forms/forms";
|
||||||
|
@import "components/table_of_contents";
|
||||||
|
@import "components/sidenav";
|
||||||
|
@import "components/preloader";
|
||||||
|
@import "components/slider";
|
||||||
|
@import "components/carousel";
|
||||||
|
@import "components/tapTarget";
|
||||||
|
@import "components/pulse";
|
||||||
|
@import "components/datepicker";
|
||||||
|
@import "components/timepicker";
|
||||||
@ -86,15 +86,7 @@ nopaque.resource_displays.CorpusDisplay = class CorpusDisplay extends nopaque.re
|
|||||||
}
|
}
|
||||||
elements = this.displayElement.querySelectorAll('.corpus-status');
|
elements = this.displayElement.querySelectorAll('.corpus-status');
|
||||||
for (let element of elements) {
|
for (let element of elements) {
|
||||||
element.dataset.status = status;
|
element.dataset.corpusStatus = status;
|
||||||
}
|
|
||||||
elements = this.displayElement.querySelectorAll('.corpus-status-spinner');
|
|
||||||
for (let element of elements) {
|
|
||||||
if (['SUBMITTED', 'QUEUED', 'BUILDING', 'STARTING_ANALYSIS_SESSION', 'CANCELING_ANALYSIS_SESSION'].includes(status)) {
|
|
||||||
element.classList.remove('hide');
|
|
||||||
} else {
|
|
||||||
element.classList.add('hide');
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@ -61,15 +61,7 @@ nopaque.resource_displays.JobDisplay = class JobDisplay extends nopaque.resource
|
|||||||
setStatus(status) {
|
setStatus(status) {
|
||||||
let elements = this.displayElement.querySelectorAll('.job-status');
|
let elements = this.displayElement.querySelectorAll('.job-status');
|
||||||
for (let element of elements) {
|
for (let element of elements) {
|
||||||
element.dataset.status = status;
|
element.dataset.jobStatus = status;
|
||||||
}
|
|
||||||
elements = this.displayElement.querySelectorAll('.job-status-spinner');
|
|
||||||
for (let element of elements) {
|
|
||||||
if (['COMPLETED', 'FAILED'].includes(status)) {
|
|
||||||
element.classList.add('hide');
|
|
||||||
} else {
|
|
||||||
element.classList.remove('hide');
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
elements = this.displayElement.querySelectorAll('.job-log-trigger');
|
elements = this.displayElement.querySelectorAll('.job-log-trigger');
|
||||||
for (let element of elements) {
|
for (let element of elements) {
|
||||||
|
|||||||
@ -41,8 +41,8 @@ nopaque.resource_lists.CorpusFileList = class CorpusFileList extends nopaque.res
|
|||||||
<td><span class="publishing-year"></span></td>
|
<td><span class="publishing-year"></span></td>
|
||||||
<td class="right-align">
|
<td class="right-align">
|
||||||
<a class="list-action-trigger btn-floating red waves-effect waves-light ${this.hasPermissionManageFiles ? '' : 'hide'}" data-list-action="delete"><i class="material-icons">delete</i></a>
|
<a class="list-action-trigger btn-floating red waves-effect waves-light ${this.hasPermissionManageFiles ? '' : 'hide'}" data-list-action="delete"><i class="material-icons">delete</i></a>
|
||||||
<a class="list-action-trigger btn-floating service-color darken waves-effect waves-light ${this.hasPermissionView ? '' : 'hide'}" data-list-action="download" data-service="corpus-analysis"><i class="material-icons">file_download</i></a>
|
<a class="list-action-trigger btn-floating waves-effect waves-light ${this.hasPermissionView ? '' : 'hide'}" data-list-action="download"><i class="material-icons">file_download</i></a>
|
||||||
<a class="list-action-trigger btn-floating service-color darken waves-effect waves-light ${this.hasPermissionManageFiles ? '' : 'hide'}" data-list-action="view" data-service="corpus-analysis"><i class="material-icons">send</i></a>
|
<a class="list-action-trigger btn-floating waves-effect waves-light ${this.hasPermissionManageFiles ? '' : 'hide'}" data-list-action="view"><i class="material-icons">send</i></a>
|
||||||
</td>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
`.trim();
|
`.trim();
|
||||||
|
|||||||
@ -60,19 +60,27 @@ nopaque.resource_lists.CorpusList = class CorpusList extends nopaque.resource_li
|
|||||||
return (values) => {
|
return (values) => {
|
||||||
return `
|
return `
|
||||||
<tr class="list-item clickable hoverable">
|
<tr class="list-item clickable hoverable">
|
||||||
|
<td class="hide">
|
||||||
|
<time class="creation-date"></span>
|
||||||
|
</td>
|
||||||
<td>
|
<td>
|
||||||
<label class="list-action-trigger" data-list-action="select">
|
<label class="list-action-trigger" data-list-action="select">
|
||||||
<input class="select-checkbox" type="checkbox">
|
<input class="select-checkbox" type="checkbox">
|
||||||
<span class="disable-on-click"></span>
|
<span class="disable-on-click"></span>
|
||||||
</label>
|
</label>
|
||||||
</td>
|
</td>
|
||||||
<td><b class="title"></b><br><i class="description"></i></td>
|
<td>
|
||||||
<td><span class="owner"></span></td>
|
<b class="title"></b><br>
|
||||||
|
<i class="description"></i>
|
||||||
|
</td>
|
||||||
|
<td>
|
||||||
|
<span class="owner"></span>
|
||||||
|
</td>
|
||||||
<td><span class="status badge new corpus-status-color corpus-status-text" data-badge-caption=""></span></td>
|
<td><span class="status badge new corpus-status-color corpus-status-text" data-badge-caption=""></span></td>
|
||||||
<td>${values['current-user-is-following'] ? '<span><i class="left material-icons">visibility</i>Following</span>' : ''}</td>
|
<td>${values['current-user-is-following'] ? '<span><i class="left material-icons">visibility</i>Following</span>' : ''}</td>
|
||||||
<td class="right-align">
|
<td class="right-align">
|
||||||
<a class="list-action-trigger btn-floating red waves-effect waves-light" data-list-action="delete-request"><i class="material-icons">delete</i></a>
|
<a class="list-action-trigger btn-floating red waves-effect waves-light" data-list-action="delete-request"><i class="material-icons">delete</i></a>
|
||||||
<a class="list-action-trigger btn-floating service-color darken waves-effect waves-light" data-list-action="view" data-service="corpus-analysis"><i class="material-icons">send</i></a>
|
<a class="list-action-trigger btn-floating service-color darken waves-effect waves-light" data-list-action="view"><i class="material-icons">send</i></a>
|
||||||
</td>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
`.trim();
|
`.trim();
|
||||||
@ -82,8 +90,8 @@ nopaque.resource_lists.CorpusList = class CorpusList extends nopaque.resource_li
|
|||||||
get valueNames() {
|
get valueNames() {
|
||||||
return [
|
return [
|
||||||
{data: ['id']},
|
{data: ['id']},
|
||||||
{data: ['creation-date']},
|
{name: 'creation-date', attr: 'datetime'},
|
||||||
{name: 'status', attr: 'data-status'},
|
{name: 'status', attr: 'data-corpus-status'},
|
||||||
'description',
|
'description',
|
||||||
'title',
|
'title',
|
||||||
'owner',
|
'owner',
|
||||||
|
|||||||
@ -25,16 +25,16 @@ nopaque.resource_lists.JobList = class JobList extends nopaque.resource_lists.Re
|
|||||||
|
|
||||||
get item() {
|
get item() {
|
||||||
return `
|
return `
|
||||||
<tr class="list-item service-scheme clickable hoverable">
|
<tr class="list-item clickable hoverable">
|
||||||
<td>
|
<td>
|
||||||
<label class="list-action-trigger" data-list-action="select">
|
<label class="list-action-trigger" data-list-action="select">
|
||||||
<input class="select-checkbox" type="checkbox">
|
<input class="select-checkbox" type="checkbox">
|
||||||
<span class="disable-on-click"></span>
|
<span class="disable-on-click"></span>
|
||||||
</label>
|
</label>
|
||||||
</td>
|
</td>
|
||||||
<td><a class="btn-floating"><i class="nopaque-icons service-icons" data-service="inherit"></i></a></td>
|
<td><a class="btn-floating service-color darken" data-service="inherit"><i class="nopaque-icons service-icons" data-service="inherit"></i></a></td>
|
||||||
<td><b class="title"></b><br><i class="description"></i></td>
|
<td><b class="title"></b><br><i class="description"></i></td>
|
||||||
<td><span class="badge new job-status-color job-status-text status" data-badge-caption=""></span></td>
|
<td><span class="status badge new job-status-color job-status-text" data-badge-caption=""></span></td>
|
||||||
<td class="right-align">
|
<td class="right-align">
|
||||||
<a class="list-action-trigger btn-floating red waves-effect waves-light" data-list-action="delete-request"><i class="material-icons">delete</i></a>
|
<a class="list-action-trigger btn-floating red waves-effect waves-light" data-list-action="delete-request"><i class="material-icons">delete</i></a>
|
||||||
<a class="list-action-trigger btn-floating darken waves-effect waves-light" data-list-action="view"><i class="material-icons">send</i></a>
|
<a class="list-action-trigger btn-floating darken waves-effect waves-light" data-list-action="view"><i class="material-icons">send</i></a>
|
||||||
@ -48,7 +48,7 @@ nopaque.resource_lists.JobList = class JobList extends nopaque.resource_lists.Re
|
|||||||
{data: ['id']},
|
{data: ['id']},
|
||||||
{data: ['creation-date']},
|
{data: ['creation-date']},
|
||||||
{data: ['service']},
|
{data: ['service']},
|
||||||
{name: 'status', attr: 'data-status'},
|
{name: 'status', attr: 'data-job-status'},
|
||||||
'description',
|
'description',
|
||||||
'title'
|
'title'
|
||||||
];
|
];
|
||||||
|
|||||||
12
app/static/nopaque-materialize.scss
Normal file
12
app/static/nopaque-materialize.scss
Normal file
@ -0,0 +1,12 @@
|
|||||||
|
@import "sass/abstracts/base-color-variables";
|
||||||
|
|
||||||
|
$primary-color: map-get($base-color-palette, "primary");
|
||||||
|
$primary-color-light: map-get($base-color-palette, "primary-light");
|
||||||
|
$primary-color-dark: map-get($base-color-palette, "primary-dark");
|
||||||
|
|
||||||
|
$secondary-color: map-get($base-color-palette, "secondary");
|
||||||
|
$success-color: map-get($base-color-palette, "success");
|
||||||
|
$error-color: map-get($base-color-palette, "error");
|
||||||
|
$link-color: map-get($base-color-palette, "link");
|
||||||
|
|
||||||
|
@import "external/materialize/sass/materialize";
|
||||||
10
app/static/sass/abstracts/_base-color-variables.scss
Normal file
10
app/static/sass/abstracts/_base-color-variables.scss
Normal file
@ -0,0 +1,10 @@
|
|||||||
|
$base-color-palette: (
|
||||||
|
"primary": #00426f,
|
||||||
|
"primary-light": #006fbc, // primary lightened by 15%
|
||||||
|
"primary-dark": #001523, // primary darkened by 15%
|
||||||
|
// "secondary": #1a5c89,
|
||||||
|
"secondary": #00426f,
|
||||||
|
"success": #4caf50,
|
||||||
|
"error": #f44336,
|
||||||
|
"link": #039be5
|
||||||
|
);
|
||||||
@ -0,0 +1,10 @@
|
|||||||
|
$corpus-status-color-palette: (
|
||||||
|
"UNPREPARED": #9e9e9e,
|
||||||
|
"QUEUED": #2196f3,
|
||||||
|
"BUILDING": #ffc107,
|
||||||
|
"BUILT": #4caf50,
|
||||||
|
"FAILED": #f44336,
|
||||||
|
"STARTING_ANALYSIS_SESSION": #2196f3,
|
||||||
|
"RUNNING_ANALYSIS_SESSION": #4caf50,
|
||||||
|
"CANCELING_ANALYSIS_SESSION": #ff5722
|
||||||
|
);
|
||||||
10
app/static/sass/abstracts/_job-status-color-variables.scss
Normal file
10
app/static/sass/abstracts/_job-status-color-variables.scss
Normal file
@ -0,0 +1,10 @@
|
|||||||
|
$job-status-color-palette: (
|
||||||
|
"INITIALIZING": #9e9e9e,
|
||||||
|
"SUBMITTED": #9e9e9e,
|
||||||
|
"QUEUED": #2196f3,
|
||||||
|
"RUNNING": #ffc107,
|
||||||
|
"CANCELING": #ff5722,
|
||||||
|
"CANCELED": #ff5722,
|
||||||
|
"COMPLETED": #4caf50,
|
||||||
|
"FAILED": #f44336
|
||||||
|
);
|
||||||
25
app/static/sass/abstracts/_s-attr-color-variables.scss
Normal file
25
app/static/sass/abstracts/_s-attr-color-variables.scss
Normal file
@ -0,0 +1,25 @@
|
|||||||
|
$ent-type-color-palette: (
|
||||||
|
"PERSON": #a6e22d,
|
||||||
|
"PER": #a6e22d,
|
||||||
|
"NORP": #ef60b4,
|
||||||
|
"FACILITY": #43c6fc,
|
||||||
|
"ORG": #43c6fc,
|
||||||
|
"GPE": #fd9720,
|
||||||
|
"LOC": #fd9720,
|
||||||
|
"PRODUCT": #a99dfb,
|
||||||
|
"MISC": #a99dfb,
|
||||||
|
"EVENT": #fc0,
|
||||||
|
"WORK_OF_ART": #fc0,
|
||||||
|
"LANGUAGE": #fc0,
|
||||||
|
"DATE": #2fbbab,
|
||||||
|
"TIME": #2fbbab,
|
||||||
|
"PERCENT": #bbb,
|
||||||
|
"MONEY": #bbb,
|
||||||
|
"QUANTITY": #bbb,
|
||||||
|
"ORDINAL": #bbb,
|
||||||
|
"CARDINAL": #bbb
|
||||||
|
);
|
||||||
|
|
||||||
|
$s-attr-color-palettes: (
|
||||||
|
"ent_type": $ent-type-color-palette
|
||||||
|
);
|
||||||
38
app/static/sass/abstracts/_service-color-variables.scss
Normal file
38
app/static/sass/abstracts/_service-color-variables.scss
Normal file
@ -0,0 +1,38 @@
|
|||||||
|
$file-setup-pipeline-color-palette: (
|
||||||
|
"base": #d5dc95,
|
||||||
|
"darken": #a1b300,
|
||||||
|
"lighten": #f2f3e1
|
||||||
|
);
|
||||||
|
|
||||||
|
$tesseract-ocr-pipeline-color-palette: (
|
||||||
|
"base": #a9d8c8,
|
||||||
|
"darken": #00a58b,
|
||||||
|
"lighten": #e7f4f1
|
||||||
|
);
|
||||||
|
|
||||||
|
$transkribus-htr-pipeline-color-palette: (
|
||||||
|
"base": #607d8b,
|
||||||
|
"darken": #37474f,
|
||||||
|
"lighten": #cfd8dc
|
||||||
|
);
|
||||||
|
|
||||||
|
$spacy-nlp-pipeline-color-palette: (
|
||||||
|
"base": #98acd2,
|
||||||
|
"darken": #0064a3,
|
||||||
|
"lighten": #e5e8f5
|
||||||
|
);
|
||||||
|
|
||||||
|
$corpus-analysis-color-palette: (
|
||||||
|
"base": #aa9cc9,
|
||||||
|
"darken": #6b3f89,
|
||||||
|
"lighten": #ebe8f6
|
||||||
|
);
|
||||||
|
|
||||||
|
|
||||||
|
$service-color-palettes: (
|
||||||
|
"file-setup-pipeline": $file-setup-pipeline-color-palette,
|
||||||
|
"tesseract-ocr-pipeline": $tesseract-ocr-pipeline-color-palette,
|
||||||
|
"transkribus-htr-pipeline": $transkribus-htr-pipeline-color-palette,
|
||||||
|
"spacy-nlp-pipeline": $spacy-nlp-pipeline-color-palette,
|
||||||
|
"corpus-analysis": $corpus-analysis-color-palette
|
||||||
|
);
|
||||||
7
app/static/sass/abstracts/_service-icon-variables.scss
Normal file
7
app/static/sass/abstracts/_service-icon-variables.scss
Normal file
@ -0,0 +1,7 @@
|
|||||||
|
$service-icon-letters: (
|
||||||
|
"file-setup-pipeline": "E",
|
||||||
|
"tesseract-ocr-pipeline": "F",
|
||||||
|
"transkribus-htr-pipeline": "F",
|
||||||
|
"spacy-nlp-pipeline": "G",
|
||||||
|
"corpus-analysis": "H"
|
||||||
|
);
|
||||||
22
app/static/sass/abstracts/_spacing-variables.scss
Normal file
22
app/static/sass/abstracts/_spacing-variables.scss
Normal file
@ -0,0 +1,22 @@
|
|||||||
|
$spacing-shortcuts: (
|
||||||
|
"margin": "m",
|
||||||
|
"padding": "p"
|
||||||
|
);
|
||||||
|
|
||||||
|
$spacing-directions: (
|
||||||
|
"top": "t",
|
||||||
|
"right": "r",
|
||||||
|
"bottom": "b",
|
||||||
|
"left": "l"
|
||||||
|
);
|
||||||
|
|
||||||
|
$spacing-values: (
|
||||||
|
"0": 0,
|
||||||
|
"1": 0.25rem,
|
||||||
|
"2": 0.5rem,
|
||||||
|
"3": 0.75rem,
|
||||||
|
"4": 1rem,
|
||||||
|
"5": 1.5rem,
|
||||||
|
"6": 3rem,
|
||||||
|
"auto": auto
|
||||||
|
);
|
||||||
84
app/static/sass/components/_base-colors.scss
Normal file
84
app/static/sass/components/_base-colors.scss
Normal file
@ -0,0 +1,84 @@
|
|||||||
|
.primary-color {
|
||||||
|
background-color: map-get($base-color-palette, "primary") !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.primary-color-border {
|
||||||
|
border-color: map-get($base-color-palette, "primary") !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.primary-color-text {
|
||||||
|
color: map-get($base-color-palette, "primary") !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.primary-color.lighten {
|
||||||
|
background-color: map-get($base-color-palette, "primary-light") !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.primary-color-border.border-lighten {
|
||||||
|
border-color: map-get($base-color-palette, "primary-light") !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.primary-color-text.text-lighten {
|
||||||
|
color: map-get($base-color-palette, "primary-light") !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.primary-color.darken {
|
||||||
|
background-color: map-get($base-color-palette, "primary-dark") !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.primary-color-border.border-darken {
|
||||||
|
border-color: map-get($base-color-palette, "primary-dark") !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.primary-color-text.text-darken {
|
||||||
|
color: map-get($base-color-palette, "primary-dark") !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.secondary-color {
|
||||||
|
background-color: map-get($base-color-palette, "secondary") !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.secondary-color-border {
|
||||||
|
border-color: map-get($base-color-palette, "secondary") !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.secondary-color-text {
|
||||||
|
color: map-get($base-color-palette, "secondary") !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.success-color {
|
||||||
|
background-color: map-get($base-color-palette, "success") !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.success-color-border {
|
||||||
|
border-color: map-get($base-color-palette, "success") !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.success-color-text {
|
||||||
|
color: map-get($base-color-palette, "success") !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.error-color {
|
||||||
|
background-color: map-get($base-color-palette, "error") !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.error-color-border {
|
||||||
|
border-color: map-get($base-color-palette, "error") !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.error-color-text {
|
||||||
|
color: map-get($base-color-palette, "error") !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.link-color {
|
||||||
|
background-color: map-get($base-color-palette, "link") !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.link-color-border {
|
||||||
|
border-color: map-get($base-color-palette, "link") !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.link-color-text {
|
||||||
|
color: map-get($base-color-palette, "link") !important;
|
||||||
|
}
|
||||||
|
|
||||||
5
app/static/sass/components/_clearfix.scss
Normal file
5
app/static/sass/components/_clearfix.scss
Normal file
@ -0,0 +1,5 @@
|
|||||||
|
.clearfix::after {
|
||||||
|
clear: both;
|
||||||
|
content: "";
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
13
app/static/sass/components/_corpus-status-color.scss
Normal file
13
app/static/sass/components/_corpus-status-color.scss
Normal file
@ -0,0 +1,13 @@
|
|||||||
|
@each $corpus-status, $corpus-status-color in $corpus-status-color-palette {
|
||||||
|
.corpus-status-color[data-corpus-status="#{$corpus-status}"] {
|
||||||
|
background-color: $corpus-status-color !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.corpus-status-color-border[data-corpus-status="#{$corpus-status}"] {
|
||||||
|
border-color: $corpus-status-color !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.corpus-status-color-text[data-corpus-status="#{$corpus-status}"] {
|
||||||
|
color: $corpus-status-color !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
11
app/static/sass/components/_helpers.scss
Normal file
11
app/static/sass/components/_helpers.scss
Normal file
@ -0,0 +1,11 @@
|
|||||||
|
.clickable {
|
||||||
|
cursor: pointer !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.show-if-only-child:not(:only-child) {
|
||||||
|
display: none !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
[draggable="true"] {
|
||||||
|
cursor: move !important;
|
||||||
|
}
|
||||||
13
app/static/sass/components/_job-status-color.scss
Normal file
13
app/static/sass/components/_job-status-color.scss
Normal file
@ -0,0 +1,13 @@
|
|||||||
|
@each $job-status, $job-status-color in $job-status-color-palette {
|
||||||
|
.job-status-color[data-job-status="#{$job-status}"] {
|
||||||
|
background-color: $job-status-color !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.job-status-color-border[data-job-status="#{$job-status}"] {
|
||||||
|
border-color: $job-status-color !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.job-status-color-text[data-job-status="#{$job-status}"] {
|
||||||
|
color: $job-status-color !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
4
app/static/sass/components/_placeholder.scss
Normal file
4
app/static/sass/components/_placeholder.scss
Normal file
@ -0,0 +1,4 @@
|
|||||||
|
::placeholder {
|
||||||
|
color: #9e9e9e;
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
19
app/static/sass/components/_s-attr-color.scss
Normal file
19
app/static/sass/components/_s-attr-color.scss
Normal file
@ -0,0 +1,19 @@
|
|||||||
|
@each $s-attr, $s-attr-color-palette in $s-attr-color-palettes {
|
||||||
|
@each $s-attr-value, $s-attr-value-color in $s-attr-color-palette {
|
||||||
|
.s-attr-color[data-s-attr="#{$s-attr}"][data-s-attr-value="#{$s-attr-value}"] {
|
||||||
|
background-color: $s-attr-value-color !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.s-attr-color-text[data-s-attr="#{$s-attr}"][data-s-attr-value="#{$s-attr-value}"] {
|
||||||
|
background-color: $s-attr-value-color !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.s-attr-color-border[data-s-attr="#{$s-attr}"][data-s-attr-value="#{$s-attr-value}"] {
|
||||||
|
background-color: $s-attr-value-color !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.s-attr .p-attr {
|
||||||
|
background-color: inherit;
|
||||||
|
}
|
||||||
40
app/static/sass/components/_service-color.scss
Normal file
40
app/static/sass/components/_service-color.scss
Normal file
@ -0,0 +1,40 @@
|
|||||||
|
@each $service, $color-palette in $service-color-palettes {
|
||||||
|
.service-color[data-service="#{$service}"],
|
||||||
|
[data-service="#{$service}"] .service-color[data-service="inherit"] {
|
||||||
|
background-color: map-get($color-palette, "base") !important;
|
||||||
|
|
||||||
|
&.darken {
|
||||||
|
background-color: map-get($color-palette, "darken") !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.lighten {
|
||||||
|
background-color: map-get($color-palette, "lighten") !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.service-color-border[data-service="#{$service}"],
|
||||||
|
[data-service="#{$service}"] .service-color-border[data-service="inherit"] {
|
||||||
|
border-color: map-get($color-palette, "base") !important;
|
||||||
|
|
||||||
|
&.border-darken {
|
||||||
|
border-color: map-get($color-palette, "darken") !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.border-lighten {
|
||||||
|
border-color: map-get($color-palette, "lighten") !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.service-color-text[data-service="#{$service}"],
|
||||||
|
[data-service="#{$service}"] .service-color-text[data-service="inherit"] {
|
||||||
|
color: map-get($color-palette, "base") !important;
|
||||||
|
|
||||||
|
&.text-darken {
|
||||||
|
color: map-get($color-palette, "darken") !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.text-lighten {
|
||||||
|
color: map-get($color-palette, "lighten") !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
6
app/static/sass/components/_service-icon.scss
Normal file
6
app/static/sass/components/_service-icon.scss
Normal file
@ -0,0 +1,6 @@
|
|||||||
|
@each $service, $letter in $service-icon-letters {
|
||||||
|
.nopaque-icons.service-icons[data-service="#{$service}"]:empty::before,
|
||||||
|
[data-service="#{$service}"] .nopaque-icons.service-icons[data-service="inherit"]:empty::before {
|
||||||
|
content: "#{$letter}";
|
||||||
|
}
|
||||||
|
}
|
||||||
@ -1,26 +1,22 @@
|
|||||||
/*
|
|
||||||
* Spacing
|
|
||||||
*/
|
|
||||||
$spacing-shortcuts: ("margin": "m", "padding": "p");
|
|
||||||
$spacing-directions: ("top": "t", "right": "r", "bottom": "b", "left": "l");
|
|
||||||
$spacing-values: ("0": 0, "1": 0.25rem, "2": 0.5rem, "3": 0.75rem, "4": 1rem, "5": 1.5rem, "6": 3rem, "auto": auto);
|
|
||||||
|
|
||||||
@each $spacing-shortcut-name, $spacing-shortcut-value in $spacing-shortcuts {
|
@each $spacing-shortcut-name, $spacing-shortcut-value in $spacing-shortcuts {
|
||||||
@each $spacing-name, $spacing-value in $spacing-values {
|
@each $spacing-name, $spacing-value in $spacing-values {
|
||||||
// All directions
|
// All directions
|
||||||
.#{$spacing-shortcut-value}-#{$spacing-name} {
|
.#{$spacing-shortcut-value}-#{$spacing-name} {
|
||||||
#{$spacing-shortcut-name}: $spacing-value !important;
|
#{$spacing-shortcut-name}: $spacing-value !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
// Horizontal axis
|
// Horizontal axis
|
||||||
.#{$spacing-shortcut-value}x-#{$spacing-name} {
|
.#{$spacing-shortcut-value}x-#{$spacing-name} {
|
||||||
#{$spacing-shortcut-name}-left: $spacing-value !important;
|
#{$spacing-shortcut-name}-left: $spacing-value !important;
|
||||||
#{$spacing-shortcut-name}-right: $spacing-value !important;
|
#{$spacing-shortcut-name}-right: $spacing-value !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
// Vertical axis
|
// Vertical axis
|
||||||
.#{$spacing-shortcut-value}y-#{$spacing-name} {
|
.#{$spacing-shortcut-value}y-#{$spacing-name} {
|
||||||
#{$spacing-shortcut-name}-top: $spacing-value !important;
|
#{$spacing-shortcut-name}-top: $spacing-value !important;
|
||||||
#{$spacing-shortcut-name}-bottom: $spacing-value !important;
|
#{$spacing-shortcut-name}-bottom: $spacing-value !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
// Cardinal directions
|
// Cardinal directions
|
||||||
@each $spacing-direction-name, $spacing-direction-value in $spacing-directions {
|
@each $spacing-direction-name, $spacing-direction-value in $spacing-directions {
|
||||||
.#{$spacing-shortcut-value}#{$spacing-direction-value}-#{$spacing-name} {
|
.#{$spacing-shortcut-value}#{$spacing-direction-value}-#{$spacing-name} {
|
||||||
9
app/static/sass/components/_status-spinner.scss
Normal file
9
app/static/sass/components/_status-spinner.scss
Normal file
@ -0,0 +1,9 @@
|
|||||||
|
/*
|
||||||
|
* changes preoloader size etc. to fit visually better with the chip status
|
||||||
|
* indicator of jobs
|
||||||
|
*/
|
||||||
|
.status-spinner {
|
||||||
|
margin-bottom: -10px;
|
||||||
|
width: 30px !important;
|
||||||
|
height: 30px !important;
|
||||||
|
}
|
||||||
12
app/static/sass/components/_status-text.scss
Normal file
12
app/static/sass/components/_status-text.scss
Normal file
@ -0,0 +1,12 @@
|
|||||||
|
.corpus-status-text,
|
||||||
|
.job-status-text {
|
||||||
|
text-transform: lowercase;
|
||||||
|
}
|
||||||
|
|
||||||
|
.corpus-status-text[data-corpus-status]:empty::before {
|
||||||
|
content: attr(data-corpus-status);
|
||||||
|
}
|
||||||
|
|
||||||
|
.job-status-text[data-job-status]:empty::before {
|
||||||
|
content: attr(data-job-status);
|
||||||
|
}
|
||||||
28
app/static/sass/main.scss
Normal file
28
app/static/sass/main.scss
Normal file
@ -0,0 +1,28 @@
|
|||||||
|
// Abstracts
|
||||||
|
@import "abstracts/base-color-variables";
|
||||||
|
@import "abstracts/corpus-status-color-variables";
|
||||||
|
@import "abstracts/job-status-color-variables";
|
||||||
|
@import "abstracts/s-attr-color-variables";
|
||||||
|
@import "abstracts/service-color-variables";
|
||||||
|
@import "abstracts/service-icon-variables";
|
||||||
|
@import "abstracts/spacing-variables";
|
||||||
|
|
||||||
|
// Components
|
||||||
|
@import "components/base-colors";
|
||||||
|
@import "components/clearfix";
|
||||||
|
@import "components/corpus-status-color";
|
||||||
|
@import "components/helpers.scss";
|
||||||
|
@import "components/job-status-color";
|
||||||
|
@import "components/placeholder";
|
||||||
|
@import "components/s-attr-color";
|
||||||
|
@import "components/service-color";
|
||||||
|
@import "components/service-icon";
|
||||||
|
@import "components/spacing";
|
||||||
|
@import "components/status-spinner";
|
||||||
|
@import "components/status-text";
|
||||||
|
|
||||||
|
// Layout
|
||||||
|
@import "layout/sticky-footer";
|
||||||
|
|
||||||
|
/// Pages
|
||||||
|
/// Site specific styles are be imported with Jinja in HTML
|
||||||
1
app/static/sass/pages/corpora/analysis.scss
Normal file
1
app/static/sass/pages/corpora/analysis.scss
Normal file
@ -0,0 +1 @@
|
|||||||
|
@import "analysis/query-builder";
|
||||||
4
app/static/sass/pages/corpora/corpus.scss
Normal file
4
app/static/sass/pages/corpora/corpus.scss
Normal file
@ -0,0 +1,4 @@
|
|||||||
|
#invite-user-modal-search .dropdown-content {
|
||||||
|
width: 100% !important;
|
||||||
|
left: 0 !important;
|
||||||
|
}
|
||||||
1
app/static/sass/sidenav-fixed.scss
Normal file
1
app/static/sass/sidenav-fixed.scss
Normal file
@ -0,0 +1 @@
|
|||||||
|
@import "layout/sidenav-fixed";
|
||||||
@ -21,7 +21,7 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="footer-copyright primary-color">
|
<div class="footer-copyright">
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<div class="row" style="margin-bottom: 0;">
|
<div class="row" style="margin-bottom: 0;">
|
||||||
<div class="col s12 m3">
|
<div class="col s12 m3">
|
||||||
@ -31,9 +31,9 @@
|
|||||||
<span class="right"><b>Version {{ config.NOPAQUE_VERSION }}</b></span>
|
<span class="right"><b>Version {{ config.NOPAQUE_VERSION }}</b></span>
|
||||||
</div>
|
</div>
|
||||||
<div class="col s12 m7 right-align">
|
<div class="col s12 m7 right-align">
|
||||||
<a class="btn-small primary-variant-color waves-effect waves-light" href="{{ url_for('main.faq') }}"><i class="left material-icons">info_outline</i>Frequently Asked Questions</a>
|
<a class="btn-small waves-effect waves-light" href="{{ url_for('main.faq') }}"><i class="left material-icons">info_outline</i>Frequently Asked Questions</a>
|
||||||
<a class="btn-small primary-variant-color waves-effect waves-light" href="mailto:{{ config.NOPAQUE_SERVICE_DESK }}"><i class="left material-icons">mail</i>Report an issue</a>
|
<a class="btn-small waves-effect waves-light" href="mailto:{{ config.NOPAQUE_SERVICE_DESK }}"><i class="left material-icons">mail</i>Report an issue</a>
|
||||||
<a class="btn-small primary-variant-color waves-effect waves-light" href="https://gitlab.ub.uni-bielefeld.de/sfb1288inf/nopaque" target="_blank"><i class="left material-icons">code</i>GitLab</a>
|
<a class="btn-small waves-effect waves-light" href="https://gitlab.ub.uni-bielefeld.de/sfb1288inf/nopaque" target="_blank"><i class="left material-icons">code</i>GitLab</a>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@ -39,21 +39,21 @@
|
|||||||
{# processes & services items #}
|
{# processes & services items #}
|
||||||
<li><div class="divider"></div></li>
|
<li><div class="divider"></div></li>
|
||||||
<li><a class="subheader">Processes & Services</a></li>
|
<li><a class="subheader">Processes & Services</a></li>
|
||||||
<li class="service-color service-color-border border-darken" data-service="file-setup-pipeline" style="border-left: 10px solid; margin-top: 5px;">
|
<li class="service-color service-color-border border-darken" data-service="file-setup-pipeline" style="border-left: 10px solid;">
|
||||||
<a class="waves-effect" href="{{ url_for('services.file_setup_pipeline') }}"><i class="nopaque-icons service-icons" data-service="file-setup-pipeline"></i>File setup</a>
|
<a class="waves-effect" href="{{ url_for('services.file_setup_pipeline') }}"><i class="nopaque-icons service-icons" data-service="file-setup-pipeline"></i>File setup</a>
|
||||||
</li>
|
</li>
|
||||||
<li class="service-color service-color-border border-darken" data-service="tesseract-ocr-pipeline" style="border-left: 10px solid; margin-top: 5px;">
|
<li class="service-color service-color-border border-darken mt-1" data-service="tesseract-ocr-pipeline" style="border-left: 10px solid;">
|
||||||
<a class="waves-effect" href="{{ url_for('services.tesseract_ocr_pipeline') }}"><i class="nopaque-icons service-icons" data-service="tesseract-ocr-pipeline"></i>OCR</a>
|
<a class="waves-effect" href="{{ url_for('services.tesseract_ocr_pipeline') }}"><i class="nopaque-icons service-icons" data-service="tesseract-ocr-pipeline"></i>OCR</a>
|
||||||
</li>
|
</li>
|
||||||
{% if config.NOPAQUE_TRANSKRIBUS_ENABLED %}
|
{% if config.NOPAQUE_TRANSKRIBUS_ENABLED %}
|
||||||
<li class="service-color service-color-border border-darken" data-service="transkribus-htr-pipeline" style="border-left: 10px solid; margin-top: 5px;">
|
<li class="service-color service-color-border border-darken mt-1" data-service="transkribus-htr-pipeline" style="border-left: 10px solid;">
|
||||||
<a class="waves-effect" href="{{ url_for('services.transkribus_htr_pipeline') }}"><i class="nopaque-icons service-icons" data-service="transkribus-htr-pipeline"></i>HTR</a>
|
<a class="waves-effect" href="{{ url_for('services.transkribus_htr_pipeline') }}"><i class="nopaque-icons service-icons" data-service="transkribus-htr-pipeline"></i>HTR</a>
|
||||||
</li>
|
</li>
|
||||||
{% endif %}
|
{% endif %}
|
||||||
<li class="service-color service-color-border border-darken" data-service="spacy-nlp-pipeline" style="border-left: 10px solid; margin-top: 5px;">
|
<li class="service-color service-color-border border-darken mt-1" data-service="spacy-nlp-pipeline" style="border-left: 10px solid;">
|
||||||
<a class="waves-effect" href="{{ url_for('services.spacy_nlp_pipeline') }}"><i class="nopaque-icons service-icons" data-service="spacy-nlp-pipeline"></i>NLP</a>
|
<a class="waves-effect" href="{{ url_for('services.spacy_nlp_pipeline') }}"><i class="nopaque-icons service-icons" data-service="spacy-nlp-pipeline"></i>NLP</a>
|
||||||
</li>
|
</li>
|
||||||
<li class="service-color service-color-border border-darken" data-service="corpus-analysis" style="border-left: 10px solid; margin-top: 5px;">
|
<li class="service-color service-color-border border-darken mt-1" data-service="corpus-analysis" style="border-left: 10px solid;">
|
||||||
<a class="waves-effect" href="{{ url_for('services.corpus_analysis') }}"><i class="nopaque-icons service-icons" data-service="corpus-analysis"></i>Corpus Analysis</a>
|
<a class="waves-effect" href="{{ url_for('services.corpus_analysis') }}"><i class="nopaque-icons service-icons" data-service="corpus-analysis"></i>Corpus Analysis</a>
|
||||||
</li>
|
</li>
|
||||||
|
|
||||||
|
|||||||
@ -1,18 +1,26 @@
|
|||||||
<link href="{{ url_for('static', filename='external/material-design-icons/css/material-icons.css') }}" rel="stylesheet">
|
<link href="{{ url_for('static', filename='external/material-design-icons/css/material-icons.css') }}" rel="stylesheet">
|
||||||
<link href="{{ url_for('static', filename='external/materialize/css/materialize.min.css') }}" rel="stylesheet">
|
{# <link href="{{ url_for('static', filename='external/materialize/css/materialize.min.css') }}" rel="stylesheet"> #}
|
||||||
{% if current_user.is_authenticated -%}
|
|
||||||
<link href="{{ url_for('static', filename='css/materialize/sidenav-fixed.css') }}" rel="stylesheet">
|
|
||||||
{% endif -%}
|
|
||||||
<link href="{{ url_for('static', filename='css/materialize/sticky-footer.css') }}" rel="stylesheet">
|
|
||||||
<link href="{{ url_for('static', filename='css/materialize/fixes.css') }}" rel="stylesheet">
|
|
||||||
<link href="{{ url_for('static', filename='nopaque-icons/css/nopaque-icons.css') }}" rel="stylesheet">
|
|
||||||
<link href="{{ url_for('static', filename='css/queryBuilder.css') }}" rel="stylesheet">
|
|
||||||
{% assets
|
{% assets
|
||||||
filters='pyscss',
|
filters='pyscss',
|
||||||
output='gen/app.%(version)s.css',
|
output='gen/nopaque-materialize.%(version)s.css',
|
||||||
'css/colors.scss',
|
'nopaque-materialize.scss'
|
||||||
'css/helpers.scss',
|
-%}
|
||||||
'css/style.css'
|
<link href="{{ ASSET_URL }}" rel="stylesheet">
|
||||||
|
{% endassets -%}
|
||||||
|
{% if current_user.is_authenticated -%}
|
||||||
|
{% assets
|
||||||
|
filters='pyscss',
|
||||||
|
output='gen/sidenav-fixed.%(version)s.css',
|
||||||
|
'sass/sidenav-fixed.scss'
|
||||||
|
-%}
|
||||||
|
<link href="{{ ASSET_URL }}" rel="stylesheet">
|
||||||
|
{% endassets -%}
|
||||||
|
{% endif -%}
|
||||||
|
<link href="{{ url_for('static', filename='nopaque-icons/css/nopaque-icons.css') }}" rel="stylesheet">
|
||||||
|
{% assets
|
||||||
|
filters='pyscss',
|
||||||
|
output='gen/nopaque.%(version)s.css',
|
||||||
|
'sass/main.scss'
|
||||||
-%}
|
-%}
|
||||||
<link href="{{ ASSET_URL }}" rel="stylesheet">
|
<link href="{{ ASSET_URL }}" rel="stylesheet">
|
||||||
{% endassets -%}
|
{% endassets -%}
|
||||||
|
|||||||
@ -40,13 +40,13 @@
|
|||||||
{% endif %}
|
{% endif %}
|
||||||
<nav {% block navbar_attribs %}{% if navbar_extended %}class="nav-extended"{% endif %}{% endblock navbar_attribs %}>
|
<nav {% block navbar_attribs %}{% if navbar_extended %}class="nav-extended"{% endif %}{% endblock navbar_attribs %}>
|
||||||
{% block navbar %}
|
{% block navbar %}
|
||||||
<div {% block navbar_primary_content_attribs %}class="nav-wrapper primary-color"{% endblock navbar_primary_content_attribs %}>
|
<div {% block navbar_primary_content_attribs %}class="nav-wrapper"{% endblock navbar_primary_content_attribs %}>
|
||||||
{% block navbar_primary_content %}
|
{% block navbar_primary_content %}
|
||||||
{% include "_base/navbar_primary_content.html.j2" %}
|
{% include "_base/navbar_primary_content.html.j2" %}
|
||||||
{% endblock navbar_primary_content %}
|
{% endblock navbar_primary_content %}
|
||||||
</div>
|
</div>
|
||||||
{% if navbar_extended %}
|
{% if navbar_extended %}
|
||||||
<div {% block navbar_secondary_content_attribs %}class="nav-content primary-variant-color"{% endblock navbar_secondary_content_attribs %}>
|
<div {% block navbar_secondary_content_attribs %}class="nav-content"{% endblock navbar_secondary_content_attribs %}>
|
||||||
{% block navbar_secondary_content %}
|
{% block navbar_secondary_content %}
|
||||||
{% endblock navbar_secondary_content %}
|
{% endblock navbar_secondary_content %}
|
||||||
</div>
|
</div>
|
||||||
@ -64,7 +64,7 @@
|
|||||||
{% endblock header %}
|
{% endblock header %}
|
||||||
</header>
|
</header>
|
||||||
|
|
||||||
<main {% block main_attribs %}class="background-color"{% endblock main_attribs %}>
|
<main {% block main_attribs %}{% endblock main_attribs %}>
|
||||||
{% block main %}
|
{% block main %}
|
||||||
{% block page_content %}{% endblock page_content %}
|
{% block page_content %}{% endblock page_content %}
|
||||||
{% endblock main %}
|
{% endblock main %}
|
||||||
@ -82,7 +82,7 @@
|
|||||||
</div>
|
</div>
|
||||||
</main>
|
</main>
|
||||||
|
|
||||||
<footer {% block footer_attribs %}class="page-footer primary-variant-color"{% endblock footer_attribs %}>
|
<footer {% block footer_attribs %}class="page-footer"{% endblock footer_attribs %}>
|
||||||
{% block footer %}
|
{% block footer %}
|
||||||
{% include "_base/footer.html.j2" %}
|
{% include "_base/footer.html.j2" %}
|
||||||
{% endblock footer %}
|
{% endblock footer %}
|
||||||
|
|||||||
@ -5,22 +5,40 @@
|
|||||||
{% import 'corpora/_analysis/static_visualization.html.j2' as static_visualization_extension %}
|
{% import 'corpora/_analysis/static_visualization.html.j2' as static_visualization_extension %}
|
||||||
|
|
||||||
|
|
||||||
{% block main_attribs %} class="service-scheme" data-service="corpus-analysis" id="corpus-analysis-container"{% endblock main_attribs %}
|
{% set navbar_extended = true %}
|
||||||
|
|
||||||
|
|
||||||
|
{% block stylesheets %}
|
||||||
|
{{ super() }}
|
||||||
|
{% assets
|
||||||
|
filters='pyscss',
|
||||||
|
output='gen/pages/corpora/analysis.%(version)s.css',
|
||||||
|
'sass/pages/corpora/analysis.scss'
|
||||||
|
-%}
|
||||||
|
<link href="{{ ASSET_URL }}" rel="stylesheet">
|
||||||
|
{% endassets -%}
|
||||||
|
{% endblock stylesheets %}
|
||||||
|
|
||||||
|
|
||||||
|
{% block navbar_secondary_content %}
|
||||||
|
<ul class="tabs tabs-transparent no-autoinit" id="corpus-analysis-extension-tabs">
|
||||||
|
<li class="tab">
|
||||||
|
<a class="active" href="#corpus-analysis-home-container"><i class="nopaque-icons service-icons left" data-service="corpus-analysis" style="line-height: inherit;"></i>Corpus analysis</a>
|
||||||
|
</li>
|
||||||
|
<li class="tab">
|
||||||
|
<a href="#corpus-analysis-concordance-container"><i class="material-icons left" style="line-height: inherit;">{{ concordance_extension.icon }}</i>{{ concordance_extension.name }}</a>
|
||||||
|
</li>
|
||||||
|
<li class="tab">
|
||||||
|
<a href="#corpus-analysis-reader-container"><i class="material-icons left" style="line-height: inherit;">{{ reader_extension.icon }}</i>{{ reader_extension.name }}</a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
{% endblock navbar_secondary_content %}
|
||||||
|
|
||||||
|
|
||||||
|
{% block main_attribs %} class="service-color lighten" data-service="corpus-analysis" id="corpus-analysis-container" style="margin-top: 48px;"{% endblock main_attribs %}
|
||||||
|
|
||||||
|
|
||||||
{% block page_content %}
|
{% block page_content %}
|
||||||
<ul class="row tabs no-autoinit" id="corpus-analysis-extension-tabs">
|
|
||||||
<li class="tab col s3">
|
|
||||||
<a class="active" href="#corpus-analysis-home-container"><i class="nopaque-icons service-icons left" data-service="corpus-analysis"></i>Corpus analysis</a>
|
|
||||||
</li>
|
|
||||||
<li class="tab col s3">
|
|
||||||
<a href="#corpus-analysis-concordance-container"><i class="material-icons left">{{ concordance_extension.icon }}</i>{{ concordance_extension.name }}</a>
|
|
||||||
</li>
|
|
||||||
<li class="tab col s3">
|
|
||||||
<a href="#corpus-analysis-reader-container"><i class="material-icons left">{{ reader_extension.icon }}</i>{{ reader_extension.name }}</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
|
|
||||||
<div id="corpus-analysis-home-container">
|
<div id="corpus-analysis-home-container">
|
||||||
<h1>{{ title }}</h1>
|
<h1>{{ title }}</h1>
|
||||||
|
|
||||||
|
|||||||
@ -1,7 +1,20 @@
|
|||||||
{% extends "base.html.j2" %}
|
{% extends "base.html.j2" %}
|
||||||
{% import "wtf.html.j2" as wtf %}
|
{% import "wtf.html.j2" as wtf %}
|
||||||
|
|
||||||
{% block main_attribs %} class="service-scheme" data-service="corpus-analysis"{% endblock main_attribs %}
|
|
||||||
|
{% block stylesheets %}
|
||||||
|
{{ super() }}
|
||||||
|
{% assets
|
||||||
|
filters='pyscss',
|
||||||
|
output='gen/pages/corpora/corpus.%(version)s.css',
|
||||||
|
'sass/pages/corpora/corpus.scss'
|
||||||
|
-%}
|
||||||
|
<link href="{{ ASSET_URL }}" rel="stylesheet">
|
||||||
|
{% endassets -%}
|
||||||
|
{% endblock stylesheets %}
|
||||||
|
|
||||||
|
|
||||||
|
{% block main_attribs %} class="service-color lighten" data-service="corpus-analysis"{% endblock main_attribs %}
|
||||||
|
|
||||||
{% block page_content %}
|
{% block page_content %}
|
||||||
<div class="container">
|
<div class="container">
|
||||||
@ -14,19 +27,6 @@
|
|||||||
<div class="card service-color-border border-darken" data-service="corpus-analysis" style="border-top: 10px solid">
|
<div class="card service-color-border border-darken" data-service="corpus-analysis" style="border-top: 10px solid">
|
||||||
<div class="card-content">
|
<div class="card-content">
|
||||||
<span class="chip corpus-status corpus-status-color corpus-status-text white-text"></span>
|
<span class="chip corpus-status corpus-status-color corpus-status-text white-text"></span>
|
||||||
<div class="active preloader-wrapper small corpus-status-spinner">
|
|
||||||
<div class="spinner-layer spinner-blue-only">
|
|
||||||
<div class="circle-clipper left">
|
|
||||||
<div class="circle"></div>
|
|
||||||
</div>
|
|
||||||
<div class="gap-patch">
|
|
||||||
<div class="circle"></div>
|
|
||||||
</div>
|
|
||||||
<div class="circle-clipper right">
|
|
||||||
<div class="circle"></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col s12">
|
<div class="col s12">
|
||||||
<div class="input-field">
|
<div class="input-field">
|
||||||
|
|||||||
@ -15,7 +15,7 @@
|
|||||||
{% if corpus.status.name in ['SUBMITTED', 'QUEUED', 'BUILDING'] %}
|
{% if corpus.status.name in ['SUBMITTED', 'QUEUED', 'BUILDING'] %}
|
||||||
<a class="btn-floating btn-small waves-effect waves-light" id="refresh-button"><i class="material-icons">refresh</i></a>
|
<a class="btn-floating btn-small waves-effect waves-light" id="refresh-button"><i class="material-icons">refresh</i></a>
|
||||||
{% endif %}
|
{% endif %}
|
||||||
<span class="chip corpus-status-text corpus-status-color white-text" data-status="{{ corpus.status.name }}"></span>
|
<span class="chip corpus-status-text corpus-status-color white-text" data-corpus-status="{{ corpus.status.name }}"></span>
|
||||||
<div class="row">
|
<div class="row">
|
||||||
|
|
||||||
<div class="col s12">
|
<div class="col s12">
|
||||||
|
|||||||
@ -14,19 +14,6 @@
|
|||||||
<p> </p>
|
<p> </p>
|
||||||
<p> </p>
|
<p> </p>
|
||||||
<span class="chip job-status job-status-text job-status-color white-text"></span>
|
<span class="chip job-status job-status-text job-status-color white-text"></span>
|
||||||
<div class="active preloader-wrapper small job-status-spinner">
|
|
||||||
<div class="spinner-layer spinner-blue-only">
|
|
||||||
<div class="circle-clipper left">
|
|
||||||
<div class="circle"></div>
|
|
||||||
</div>
|
|
||||||
<div class="gap-patch">
|
|
||||||
<div class="circle"></div>
|
|
||||||
</div>
|
|
||||||
<div class="circle-clipper right">
|
|
||||||
<div class="circle"></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|||||||
@ -20,22 +20,22 @@
|
|||||||
<div class="col s12">
|
<div class="col s12">
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col s12 m6 l3 center-align">
|
<div class="col s12 m6 l3 center-align">
|
||||||
<i class="large nopaque-icons secondary-color-text">A</i><br>
|
<i class="large nopaque-icons primary-color-text">A</i><br>
|
||||||
<b class="primary-color-text">Speeds up your work</b>
|
<b class="primary-color-text">Speeds up your work</b>
|
||||||
<p class="light">All tools provided by nopaque are carefully selected to provide a complete tool suite without being held up by compatibility issues.</p>
|
<p class="light">All tools provided by nopaque are carefully selected to provide a complete tool suite without being held up by compatibility issues.</p>
|
||||||
</div>
|
</div>
|
||||||
<div class="col s12 m6 l3 center-align">
|
<div class="col s12 m6 l3 center-align">
|
||||||
<i class="large nopaque-icons secondary-color-text">B</i><br>
|
<i class="large nopaque-icons primary-color-text">B</i><br>
|
||||||
<b class="primary-color-text">Cloud infrastructure</b>
|
<b class="primary-color-text">Cloud infrastructure</b>
|
||||||
<p class="light">All computational work is processed within nopaque’s cloud infrastructure. You don't need to install any software. Great, right?</p>
|
<p class="light">All computational work is processed within nopaque’s cloud infrastructure. You don't need to install any software. Great, right?</p>
|
||||||
</div>
|
</div>
|
||||||
<div class="col s12 m6 l3 center-align">
|
<div class="col s12 m6 l3 center-align">
|
||||||
<i class="large nopaque-icons secondary-color-text">C</i><br>
|
<i class="large nopaque-icons primary-color-text">C</i><br>
|
||||||
<b class="primary-color-text">User friendly</b>
|
<b class="primary-color-text">User friendly</b>
|
||||||
<p class="light">You can start right away without having to read mile-long manuals. All services come with default settings that make it easy for you to just get going. Also great, right?</p>
|
<p class="light">You can start right away without having to read mile-long manuals. All services come with default settings that make it easy for you to just get going. Also great, right?</p>
|
||||||
</div>
|
</div>
|
||||||
<div class="col s12 m6 l3 center-align">
|
<div class="col s12 m6 l3 center-align">
|
||||||
<i class="large nopaque-icons secondary-color-text">D</i><br>
|
<i class="large nopaque-icons primary-color-text">D</i><br>
|
||||||
<b class="primary-color-text">Meshing processes</b>
|
<b class="primary-color-text">Meshing processes</b>
|
||||||
<p class="light">No matter where you step in, nopaque facilitates and accompanies your research. Its workflow perfectly ties in with your research process.</p>
|
<p class="light">No matter where you step in, nopaque facilitates and accompanies your research. Its workflow perfectly ties in with your research process.</p>
|
||||||
</div>
|
</div>
|
||||||
@ -74,48 +74,40 @@
|
|||||||
<div class="col s12">
|
<div class="col s12">
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col s12 m6 l3 center-align">
|
<div class="col s12 m6 l3 center-align">
|
||||||
<p> </p>
|
<a href="{{ url_for('services.file_setup_pipeline') }}">
|
||||||
<a href="{{ url_for('services.file_setup_pipeline') }}" class="btn-floating btn-large btn-scale-x2 waves-effect waves-light">
|
<i class="large nopaque-icons service-icons service-color-text text-darken" data-service="file-setup-pipeline"></i>
|
||||||
<i class="nopaque-icons service-color darken service-icons" data-service="file-setup-pipeline"></i>
|
</a><br>
|
||||||
</a>
|
<b class="service-color-text text-darken" data-service="file-setup-pipeline">File setup</b>
|
||||||
<br><br>
|
|
||||||
<p class="service-color-text text-darken" data-service="file-setup-pipeline"><b>File setup</b></p>
|
|
||||||
<p class="light">Digital copies of text based research data (books, letters, etc.) often comprise various files and formats. nopaque converts and merges those files to facilitate further processing and the application of other services.</p>
|
<p class="light">Digital copies of text based research data (books, letters, etc.) often comprise various files and formats. nopaque converts and merges those files to facilitate further processing and the application of other services.</p>
|
||||||
</div>
|
</div>
|
||||||
<div class="col s12 m6 l3 center-align">
|
<div class="col s12 m6 l3 center-align">
|
||||||
<p> </p>
|
<a href="{{ url_for('services.tesseract_ocr_pipeline') }}">
|
||||||
<a href="{{ url_for('services.tesseract_ocr_pipeline') }}" class="btn-floating btn-large btn-scale-x2 waves-effect waves-light">
|
<i class="large nopaque-icons service-icons service-color-text text-darken" data-service="tesseract-ocr-pipeline"></i>
|
||||||
<i class="nopaque-icons service-color darken service-icons" data-service="tesseract-ocr-pipeline"></i>
|
</a><br>
|
||||||
</a>
|
<b class="service-color-text text-darken" data-service="tesseract-ocr-pipeline">Optical Character Recognition</b>
|
||||||
<br><br>
|
|
||||||
<p class="service-color-text text-darken" data-service="tesseract-ocr-pipeline"><b>Optical Character Recognition</b></p>
|
|
||||||
<p class="light">nopaque converts your image data – like photos or scans – into text data through OCR making it machine readable. This step enables you to proceed with further computational analysis of your documents.</p>
|
<p class="light">nopaque converts your image data – like photos or scans – into text data through OCR making it machine readable. This step enables you to proceed with further computational analysis of your documents.</p>
|
||||||
</div>
|
</div>
|
||||||
|
{% if config.NOPAQUE_TRANSKRIBUS_ENABLED %}
|
||||||
<div class="col s12 m6 l3 center-align">
|
<div class="col s12 m6 l3 center-align">
|
||||||
<p> </p>
|
<a href="{{ url_for('services.transkribus_htr_pipeline') }}">
|
||||||
<a href="{{ url_for('services.transkribus_htr_pipeline') }}" class="btn-floating btn-large btn-scale-x2 waves-effect waves-light">
|
<i class="large nopaque-icons service-icons service-color-text text-darken" data-service="transkribus-htr-pipeline"></i>
|
||||||
<i class="nopaque-icons service-color darken service-icons" data-service="transkribus-htr-pipeline"></i>
|
</a><br>
|
||||||
</a>
|
<b class="service-color-text text-darken" data-service="transkribus-htr-pipeline">Transkribus HTR Pipeline</b>
|
||||||
<br><br>
|
|
||||||
<p class="service-color-text text-darken" data-service="transkribus-htr-pipeline"><b>Transkribus HTR Pipeline</b></p>
|
|
||||||
<p class="light">nopaque converts your image data – like photos or scans – into text data through HTR making it machine readable. This step enables you to proceed with further computational analysis of your documents.</p>
|
<p class="light">nopaque converts your image data – like photos or scans – into text data through HTR making it machine readable. This step enables you to proceed with further computational analysis of your documents.</p>
|
||||||
</div>
|
</div>
|
||||||
|
{% endif %}
|
||||||
<div class="col s12 m6 l3 center-align">
|
<div class="col s12 m6 l3 center-align">
|
||||||
<p> </p>
|
<a href="{{ url_for('services.spacy_nlp_pipeline') }}">
|
||||||
<a href="{{ url_for('services.spacy_nlp_pipeline') }}" class="btn-floating btn-large btn-scale-x2 waves-effect waves-light">
|
<i class="large nopaque-icons service-icons service-color-text text-darken" data-service="spacy-nlp-pipeline"></i>
|
||||||
<i class="nopaque-icons service-color darken service-icons" data-service="spacy-nlp-pipeline"></i>
|
</a><br>
|
||||||
</a>
|
<b class="service-color-text text-darken" data-service="spacy-nlp-pipeline">Natural Language Processing</b>
|
||||||
<br><br>
|
|
||||||
<p class="service-color-text text-darken" data-service="spacy-nlp-pipeline"><b>Natural Language Processing</b></p>
|
|
||||||
<p class="light">By means of computational linguistic data processing (tokenization, lemmatization, part-of-speech tagging and named-entity recognition) nopaque extracts additional information from your text.</p>
|
<p class="light">By means of computational linguistic data processing (tokenization, lemmatization, part-of-speech tagging and named-entity recognition) nopaque extracts additional information from your text.</p>
|
||||||
</div>
|
</div>
|
||||||
<div class="col s12 m6 l3 center-align">
|
<div class="col s12 m6 l3 center-align">
|
||||||
<p> </p>
|
<a href="{{ url_for('services.corpus_analysis') }}">
|
||||||
<a href="{{ url_for('services.corpus_analysis') }}" class="btn-floating btn-large btn-scale-x2 waves-effect waves-light">
|
<i class="large nopaque-icons service-icons service-color-text text-darken" data-service="corpus-analysis"></i>
|
||||||
<i class="nopaque-icons service-color darken service-icons" data-service="corpus-analysis"></i>
|
</a><br>
|
||||||
</a>
|
<b class="service-color-text text-darken" data-service="corpus-analysis">Corpus analysis</b>
|
||||||
<br><br>
|
|
||||||
<p class="service-color-text text-darken" data-service="corpus-analysis"><b>Corpus analysis</b></p>
|
|
||||||
<p class="light">nopaque lets you create and upload as many text corpora as you want. It makes use of CQP Query Language, which allows for complex search requests with the aid of metadata and NLP tags.</p>
|
<p class="light">nopaque lets you create and upload as many text corpora as you want. It makes use of CQP Query Language, which allows for complex search requests with the aid of metadata and NLP tags.</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@ -161,7 +153,7 @@
|
|||||||
{{ form.hidden_tag() }}
|
{{ form.hidden_tag() }}
|
||||||
{{ wtf.render_field(form.user, material_icon='person') }}
|
{{ wtf.render_field(form.user, material_icon='person') }}
|
||||||
{{ wtf.render_field(form.password, material_icon='vpn_key') }}
|
{{ wtf.render_field(form.password, material_icon='vpn_key') }}
|
||||||
<div class="row" style="margin-bottom: 0;">
|
<div class="row mb-0">
|
||||||
<div class="col s6 left-align">
|
<div class="col s6 left-align">
|
||||||
<a href="{{ url_for('auth.reset_password_request') }}">Forgot your password?</a>
|
<a href="{{ url_for('auth.reset_password_request') }}">Forgot your password?</a>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@ -1,6 +1,6 @@
|
|||||||
{% extends "base.html.j2" %}
|
{% extends "base.html.j2" %}
|
||||||
|
|
||||||
{% block main_attribs %} class="service-scheme" data-service="corpus-analysis"{% endblock main_attribs %}
|
{% block main_attribs %}class="service-color lighten" data-service="corpus-analysis"{% endblock main_attribs %}
|
||||||
|
|
||||||
{% block page_content %}
|
{% block page_content %}
|
||||||
<div class="container">
|
<div class="container">
|
||||||
@ -11,9 +11,7 @@
|
|||||||
|
|
||||||
<div class="col s12 m3 push-m9">
|
<div class="col s12 m3 push-m9">
|
||||||
<div class="center-align">
|
<div class="center-align">
|
||||||
<a class="btn-floating btn-large btn-scale-x2 waves-effect waves-light" style="transform: scale(2);">
|
<i class="large nopaque-icons service-icons service-color-text text-darken" data-service="corpus-analysis"></i>
|
||||||
<i class="nopaque-icons service-color darken service-icons" data-service="corpus-analysis"></i>
|
|
||||||
</a>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|||||||
@ -1,7 +1,7 @@
|
|||||||
{% extends "base.html.j2" %}
|
{% extends "base.html.j2" %}
|
||||||
{% import "wtf.html.j2" as wtf %}
|
{% import "wtf.html.j2" as wtf %}
|
||||||
|
|
||||||
{% block main_attribs %} class="service-scheme" data-service="file-setup-pipeline"{% endblock main_attribs %}
|
{% block main_attribs %}class="service-color lighten" data-service="file-setup-pipeline"{% endblock main_attribs %}
|
||||||
|
|
||||||
{% block page_content %}
|
{% block page_content %}
|
||||||
<div class="container">
|
<div class="container">
|
||||||
@ -14,9 +14,7 @@
|
|||||||
<div class="center-align">
|
<div class="center-align">
|
||||||
<p class="hide-on-small-only"> </p>
|
<p class="hide-on-small-only"> </p>
|
||||||
<p class="hide-on-small-only"> </p>
|
<p class="hide-on-small-only"> </p>
|
||||||
<a class="btn-floating btn-large btn-scale-x2 waves-effect waves-light">
|
<i class="large nopaque-icons service-icons service-color-text text-darken" data-service="file-setup-pipeline"></i>
|
||||||
<i class="nopaque-icons service-color darken service-icons" data-service="file-setup-pipeline"></i>
|
|
||||||
</a>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
@ -49,7 +47,7 @@
|
|||||||
{{ wtf.render_field(form.description, material_icon='description') }}
|
{{ wtf.render_field(form.description, material_icon='description') }}
|
||||||
</div>
|
</div>
|
||||||
<div class="col s12 l9">
|
<div class="col s12 l9">
|
||||||
{{ wtf.render_field(form.images, accept='image/jpeg, image/png, image/tiff', placeholder='Choose JPEG, PNG or TIFF files') }}
|
{{ wtf.render_field(form.images, accept='image/jpeg, image/png, image/tiff', class_='file-setup-pipeline-color darken', placeholder='Choose JPEG, PNG or TIFF files') }}
|
||||||
</div>
|
</div>
|
||||||
<div class="col s12 l3">
|
<div class="col s12 l3">
|
||||||
{{ wtf.render_field(form.version, material_icon='apps') }}
|
{{ wtf.render_field(form.version, material_icon='apps') }}
|
||||||
|
|||||||
@ -1,7 +1,7 @@
|
|||||||
{% extends "base.html.j2" %}
|
{% extends "base.html.j2" %}
|
||||||
{% import "wtf.html.j2" as wtf %}
|
{% import "wtf.html.j2" as wtf %}
|
||||||
|
|
||||||
{% block main_attribs %} class="service-scheme" data-service="spacy-nlp-pipeline"{% endblock main_attribs %}
|
{% block main_attribs %}class="service-color lighten" data-service="spacy-nlp-pipeline"{% endblock main_attribs %}
|
||||||
|
|
||||||
{% block page_content %}
|
{% block page_content %}
|
||||||
<div class="container">
|
<div class="container">
|
||||||
@ -14,9 +14,7 @@
|
|||||||
<div class="center-align">
|
<div class="center-align">
|
||||||
<p class="hide-on-small-only"> </p>
|
<p class="hide-on-small-only"> </p>
|
||||||
<p class="hide-on-small-only"> </p>
|
<p class="hide-on-small-only"> </p>
|
||||||
<a class="btn-floating btn-large btn-scale-x2 waves-effect waves-light">
|
<i class="large nopaque-icons service-icons service-color-text text-darken" data-service="spacy-nlp-pipeline"></i>
|
||||||
<i class="nopaque-icons service-color darken service-icons" data-service="spacy-nlp-pipeline"></i>
|
|
||||||
</a>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
@ -75,8 +73,8 @@
|
|||||||
{{ form.model() }}
|
{{ form.model() }}
|
||||||
{{ form.model.label }}
|
{{ form.model.label }}
|
||||||
<span class="helper-text">
|
<span class="helper-text">
|
||||||
<a class="modal-trigger tooltipped" href="#models-modal" data-position="bottom" data-tooltip="See more information about models"><i class="material-icons" style="color:#0064A3;">help_outline</i></a>
|
<a class="modal-trigger tooltipped" href="#models-modal" data-position="bottom" data-tooltip="See more information about models"><i class="material-icons">help_outline</i></a>
|
||||||
<a class="tooltipped" href="{{ url_for('contributions.create_spacy_nlp_pipeline_model') }}" data-position="bottom" data-tooltip="Add your own spaCy NLP models"><i class="material-icons" style="color:#0064A3">new_label</i></a>
|
<a class="tooltipped" href="{{ url_for('contributions.create_spacy_nlp_pipeline_model') }}" data-position="bottom" data-tooltip="Add your own spaCy NLP models"><i class="material-icons">new_label</i></a>
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@ -1,7 +1,7 @@
|
|||||||
{% extends "base.html.j2" %}
|
{% extends "base.html.j2" %}
|
||||||
{% import "wtf.html.j2" as wtf %}
|
{% import "wtf.html.j2" as wtf %}
|
||||||
|
|
||||||
{% block main_attribs %} class="service-scheme" data-service="tesseract-ocr-pipeline"{% endblock main_attribs %}
|
{% block main_attribs %}class="service-color lighten" data-service="tesseract-ocr-pipeline"{% endblock main_attribs %}
|
||||||
|
|
||||||
{% block page_content %}
|
{% block page_content %}
|
||||||
<div class="container">
|
<div class="container">
|
||||||
@ -14,9 +14,7 @@
|
|||||||
<div class="center-align">
|
<div class="center-align">
|
||||||
<p class="hide-on-small-only"> </p>
|
<p class="hide-on-small-only"> </p>
|
||||||
<p class="hide-on-small-only"> </p>
|
<p class="hide-on-small-only"> </p>
|
||||||
<a class="btn-floating btn-large btn-scale-x2 waves-effect waves-light">
|
<i class="large nopaque-icons service-icons service-color-text text-darken" data-service="tesseract-ocr-pipeline"></i>
|
||||||
<i class="nopaque-icons service-color darken service-icons" data-service="tesseract-ocr-pipeline"></i>
|
|
||||||
</a>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
@ -57,8 +55,8 @@
|
|||||||
{{ form.model() }}
|
{{ form.model() }}
|
||||||
{{ form.model.label }}
|
{{ form.model.label }}
|
||||||
<span class="helper-text">
|
<span class="helper-text">
|
||||||
<a class="modal-trigger tooltipped" href="#models-modal" data-position="bottom" data-tooltip="See more information about models"><i class="material-icons" style="color:#00A58B;">help_outline</i></a>
|
<a class="modal-trigger tooltipped" href="#models-modal" data-position="bottom" data-tooltip="See more information about models"><i class="material-icons">help_outline</i></a>
|
||||||
<a class="tooltipped" href="{{ url_for('contributions.create_tesseract_ocr_pipeline_model') }}" data-position="bottom" data-tooltip="Add your own Tesseract OCR models"><i class="material-icons" style="color:#00A58B">new_label</i></a>
|
<a class="tooltipped" href="{{ url_for('contributions.create_tesseract_ocr_pipeline_model') }}" data-position="bottom" data-tooltip="Add your own Tesseract OCR models"><i class="material-icons">new_label</i></a>
|
||||||
</span>
|
</span>
|
||||||
{% for error in form.model.errors %}
|
{% for error in form.model.errors %}
|
||||||
<span class="helper-text error-color-text">{{ error }}</span>
|
<span class="helper-text error-color-text">{{ error }}</span>
|
||||||
|
|||||||
@ -1,7 +1,7 @@
|
|||||||
{% extends "base.html.j2" %}
|
{% extends "base.html.j2" %}
|
||||||
{% import "wtf.html.j2" as wtf %}
|
{% import "wtf.html.j2" as wtf %}
|
||||||
|
|
||||||
{% block main_attribs %} class="service-scheme" data-service="transkribus-htr-pipeline"{% endblock main_attribs %}
|
{% block main_attribs %}class="service-color lighten" data-service="transkribus-htr-pipeline"{% endblock main_attribs %}
|
||||||
|
|
||||||
{% block page_content %}
|
{% block page_content %}
|
||||||
<div class="container">
|
<div class="container">
|
||||||
@ -14,9 +14,7 @@
|
|||||||
<div class="center-align">
|
<div class="center-align">
|
||||||
<p class="hide-on-small-only"> </p>
|
<p class="hide-on-small-only"> </p>
|
||||||
<p class="hide-on-small-only"> </p>
|
<p class="hide-on-small-only"> </p>
|
||||||
<a class="btn-floating btn-large btn-scale-x2 waves-effect waves-light">
|
<i class="large nopaque-icons service-icons service-color-text text-darken" data-service="transkribus-htr-pipeline"></i>
|
||||||
<i class="nopaque-icons service-color darken service-icons" data-service="transkribus-htr-pipeline"></i>
|
|
||||||
</a>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user