|
|
|
|
|
|
|
|
|
|
|
|
|
|
.aux-button-container { |
|
|
.aux-button-container { |
|
|
display: flex; |
|
|
display: flex; |
|
|
flex-flow: column; |
|
|
|
|
|
border-top: 1px solid #ddd; |
|
|
border-top: 1px solid #ddd; |
|
|
flex: 1 1 auto; |
|
|
flex: 1 1 auto; |
|
|
|
|
|
padding: 0 8px; |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
/*==================*/ |
|
|
|
|
|
/*= OPTIONS BUTTON =*/ |
|
|
|
|
|
/*==================*/ |
|
|
|
|
|
|
|
|
|
|
|
button.options-button { |
|
|
|
|
|
font-size: 1.125rem; |
|
|
|
|
|
padding: 10px; |
|
|
|
|
|
color: #777; |
|
|
|
|
|
width: 100%; |
|
|
|
|
|
|
|
|
.aux-button-container button { |
|
|
|
|
|
font-size: 1.25rem; |
|
|
|
|
|
padding: 0; |
|
|
flex: 1 1 auto; |
|
|
flex: 1 1 auto; |
|
|
font-family: Font Awesome, Inconsolata, sans-serif; |
|
|
font-family: Font Awesome, Inconsolata, sans-serif; |
|
|
|
|
|
display: flex; |
|
|
|
|
|
flex-flow: column; |
|
|
|
|
|
align-items: center; |
|
|
|
|
|
justify-content: center; |
|
|
|
|
|
min-width: 0; |
|
|
} |
|
|
} |
|
|
button.options-button:hover { |
|
|
|
|
|
|
|
|
.aux-button-container button::before { |
|
|
|
|
|
padding: 4px 0 0 0; |
|
|
|
|
|
} |
|
|
|
|
|
.aux-button-container button:hover::before { |
|
|
color: #000; |
|
|
color: #000; |
|
|
} |
|
|
} |
|
|
|
|
|
.aux-button-container button::after { |
|
|
|
|
|
text-transform: uppercase; |
|
|
|
|
|
color: #777; |
|
|
|
|
|
font-size: 0.75rem; |
|
|
|
|
|
padding: 4px 0 0 0; |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
/*==================*/ |
|
|
|
|
|
/*= OPTIONS BUTTON =*/ |
|
|
|
|
|
/*==================*/ |
|
|
|
|
|
|
|
|
button.options-button::before { |
|
|
button.options-button::before { |
|
|
content: "\F1DE"; |
|
|
content: "\F1DE"; |
|
|
font-family: Font Awesome; |
|
|
|
|
|
font-size: 0.875em; |
|
|
|
|
|
margin: 0 6px 0 0; |
|
|
|
|
|
|
|
|
color: #777; |
|
|
} |
|
|
} |
|
|
button.options-button::after { |
|
|
button.options-button::after { |
|
|
content: "Options"; |
|
|
content: "Options"; |
|
|
margin: 0 3px 0 0; |
|
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
/*===============*/ |
|
|
|
|
|
/*= HELP BUTTON =*/ |
|
|
|
|
|
/*===============*/ |
|
|
|
|
|
|
|
|
|
|
|
button.help-button::before { |
|
|
|
|
|
content: "\F128"; |
|
|
|
|
|
font-weight: 900; |
|
|
|
|
|
color: #999; |
|
|
|
|
|
} |
|
|
|
|
|
button.help-button::after { |
|
|
|
|
|
content: "Help"; |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
/********/ |
|
|
/********/ |