parent
182d9143ad
commit
17cbaa7455
@ -1,7 +1,3 @@ |
||||
.DS_Store |
||||
/node_modules/ |
||||
/src/node_modules/@sapper/ |
||||
yarn-error.log |
||||
/cypress/screenshots/ |
||||
/__sapper__/ |
||||
node_modules |
||||
.*.sw* |
||||
|
||||
@ -1,113 +0,0 @@ |
||||
const { ButtonMachine } = require('../../src/node_modules/buttons'); |
||||
|
||||
const run_code = (expecting, code, debug=false) => { |
||||
let machine = new ButtonMachine(code); |
||||
|
||||
machine.run(debug); |
||||
|
||||
expect(machine.stack_top).toBe(expecting); |
||||
|
||||
return machine; |
||||
} |
||||
|
||||
it('Can do addition', () => { |
||||
run_code(3, [ |
||||
['PUSH', 1], |
||||
['PUSH', 2], |
||||
['ADD'], |
||||
]) |
||||
}); |
||||
|
||||
it('Can do subtraction', () => { |
||||
run_code(1, [ |
||||
['PUSH', 2], |
||||
['PUSH', 1], |
||||
['SUB'], |
||||
]) |
||||
}) |
||||
|
||||
it('Can do multiplication', () => { |
||||
run_code(20, [ |
||||
['PUSH', 10], |
||||
['PUSH', 2], |
||||
['MUL'], |
||||
]) |
||||
}) |
||||
|
||||
it('Can do division', () => { |
||||
run_code(5, [ |
||||
['PUSH', 10], |
||||
['PUSH', 2], |
||||
['DIV'], |
||||
]) |
||||
}) |
||||
|
||||
it('Can do modulus', () => { |
||||
run_code(0, [ |
||||
['PUSH', 10], |
||||
['PUSH', 2], |
||||
['MOD'], |
||||
]) |
||||
}) |
||||
|
||||
it('Can loop until the end of clicks', () => { |
||||
run_code(43, [ |
||||
['PUSH', 1], |
||||
['PUSH', 1], |
||||
['ADD'], |
||||
['JUMP', 1] |
||||
]); |
||||
}); |
||||
|
||||
|
||||
it('Can do zero test for jump', () => { |
||||
run_code(0, [ |
||||
['PUSH', 20], // start at 20
|
||||
['PUSH', 1], // decrement by 1
|
||||
['SUB'],
|
||||
['JZ', 5], // if we're at 0 jumps to the end
|
||||
['JUMP', 1] // the previous test fails so it jumps to loop again
|
||||
]); |
||||
}); |
||||
|
||||
|
||||
it('Can do NOT zero test for jump', () => { |
||||
run_code(-19, [ |
||||
['PUSH', -20], // start at 20
|
||||
['PUSH', 1], // decrement by 1
|
||||
['ADD'],
|
||||
['JNZ', 5], // if we're at 0 jumps to the end
|
||||
['JUMP', 1] // the previous test fails so it jumps to loop again
|
||||
]); |
||||
}); |
||||
|
||||
it('Can store and restor', () => { |
||||
run_code(150, [ |
||||
['PUSH', 100], // start with 100
|
||||
['STOR', 'AX'], // put it in the regA register
|
||||
['PUSH', 50], // push 50 on too
|
||||
['ADD'], // add those for 150
|
||||
['RSTOR', 'AX'],// recover the original 100
|
||||
['SUB'] // sub and should be 150
|
||||
]); |
||||
}); |
||||
|
||||
it('Halts on bad registers', () => { |
||||
run_code(0, [ |
||||
['PUSH', 0], |
||||
['STOR', 'AX'], |
||||
['RSTOR', 'BAD NAME'], // should cause a halt here
|
||||
['PUSH', 100], |
||||
['ADD'] |
||||
]); |
||||
}); |
||||
|
||||
it('Can halt on purpose', () => { |
||||
let machine = run_code(0, [ |
||||
['PUSH', 0], |
||||
['HALT', 'Done on purpose.'] |
||||
]); |
||||
|
||||
expect(machine.halted).toBe(true); |
||||
expect(machine.error).toBe('Done on purpose.'); |
||||
}); |
||||
@ -1,4 +0,0 @@ |
||||
{ |
||||
"baseUrl": "http://localhost:3000", |
||||
"video": false |
||||
} |
||||
@ -1,5 +0,0 @@ |
||||
{ |
||||
"name": "Using fixtures to represent data", |
||||
"email": "hello@cypress.io", |
||||
"body": "Fixtures are a great way to mock data for responses to routes" |
||||
} |
||||
@ -1,19 +0,0 @@ |
||||
describe('Sapper template app', () => { |
||||
beforeEach(() => { |
||||
cy.visit('/') |
||||
}); |
||||
|
||||
it('has the correct <h1>', () => { |
||||
cy.contains('h1', 'Great success!') |
||||
}); |
||||
|
||||
it('navigates to /about', () => { |
||||
cy.get('nav a').contains('about').click(); |
||||
cy.url().should('include', '/about'); |
||||
}); |
||||
|
||||
it('navigates to /blog', () => { |
||||
cy.get('nav a').contains('blog').click(); |
||||
cy.url().should('include', '/blog'); |
||||
}); |
||||
}); |
||||
@ -1,17 +0,0 @@ |
||||
// ***********************************************************
|
||||
// This example plugins/index.js can be used to load plugins
|
||||
//
|
||||
// You can change the location of this file or turn off loading
|
||||
// the plugins file with the 'pluginsFile' configuration option.
|
||||
//
|
||||
// You can read more here:
|
||||
// https://on.cypress.io/plugins-guide
|
||||
// ***********************************************************
|
||||
|
||||
// This function is called when a project is opened or re-opened (e.g. due to
|
||||
// the project's config changing)
|
||||
|
||||
module.exports = (on, config) => { |
||||
// `on` is used to hook into various events Cypress emits
|
||||
// `config` is the resolved Cypress config
|
||||
} |
||||
@ -1,25 +0,0 @@ |
||||
// ***********************************************
|
||||
// This example commands.js shows you how to
|
||||
// create various custom commands and overwrite
|
||||
// existing commands.
|
||||
//
|
||||
// For more comprehensive examples of custom
|
||||
// commands please read more here:
|
||||
// https://on.cypress.io/custom-commands
|
||||
// ***********************************************
|
||||
//
|
||||
//
|
||||
// -- This is a parent command --
|
||||
// Cypress.Commands.add("login", (email, password) => { ... })
|
||||
//
|
||||
//
|
||||
// -- This is a child command --
|
||||
// Cypress.Commands.add("drag", { prevSubject: 'element'}, (subject, options) => { ... })
|
||||
//
|
||||
//
|
||||
// -- This is a dual command --
|
||||
// Cypress.Commands.add("dismiss", { prevSubject: 'optional'}, (subject, options) => { ... })
|
||||
//
|
||||
//
|
||||
// -- This is will overwrite an existing command --
|
||||
// Cypress.Commands.overwrite("visit", (originalFn, url, options) => { ... })
|
||||
@ -1,20 +0,0 @@ |
||||
// ***********************************************************
|
||||
// This example support/index.js is processed and
|
||||
// loaded automatically before your test files.
|
||||
//
|
||||
// This is a great place to put global configuration and
|
||||
// behavior that modifies Cypress.
|
||||
//
|
||||
// You can change the location of this file or turn off
|
||||
// automatically serving support files with the
|
||||
// 'supportFile' configuration option.
|
||||
//
|
||||
// You can read more here:
|
||||
// https://on.cypress.io/configuration
|
||||
// ***********************************************************
|
||||
|
||||
// Import commands.js using ES2015 syntax:
|
||||
import './commands' |
||||
|
||||
// Alternatively you can use CommonJS syntax:
|
||||
// require('./commands')
|
||||
@ -1,20 +0,0 @@ |
||||
module.exports = { |
||||
apps : [ |
||||
{ |
||||
name: 'gulp', |
||||
script: 'gulp', |
||||
instances: 1, |
||||
autorestart: true, |
||||
watch: false, |
||||
max_memory_restart: '1G', |
||||
env: { |
||||
NODE_ENV: 'development' |
||||
}, |
||||
env_production: { |
||||
NODE_ENV: 'production' |
||||
} |
||||
}, |
||||
], |
||||
}; |
||||
|
||||
|
||||
@ -1,35 +0,0 @@ |
||||
const gulp = require('gulp'); |
||||
const autoprefixer = require('gulp-autoprefixer'); |
||||
const cleancss = require('gulp-clean-css'); |
||||
const csscomb = require('gulp-csscomb'); |
||||
const rename = require('gulp-rename'); |
||||
const sass = require('gulp-sass'); |
||||
|
||||
let paths = { |
||||
source: './sass/*.scss', |
||||
}; |
||||
|
||||
const styles = () => { |
||||
return gulp.src(paths.source) |
||||
.pipe(sass({outputStyle: 'compact', precision: 10}) |
||||
.on('error', sass.logError) |
||||
) |
||||
.pipe(autoprefixer()) |
||||
.pipe(csscomb()) |
||||
.pipe(cleancss()) |
||||
.pipe(rename({ |
||||
suffix: '.min' |
||||
})) |
||||
.pipe(gulp.dest('./static/css/')); |
||||
}; |
||||
|
||||
|
||||
const auto = () => { |
||||
return gulp.watch(['./**/*.scss'], styles); |
||||
} |
||||
|
||||
module.exports = { |
||||
styles, |
||||
default: auto |
||||
}; |
||||
|
||||
File diff suppressed because it is too large
Load Diff
@ -1,45 +0,0 @@ |
||||
{ |
||||
"name": "TODO", |
||||
"description": "TODO", |
||||
"version": "0.0.1", |
||||
"scripts": { |
||||
"dev": "sapper dev", |
||||
"build": "sapper build --legacy", |
||||
"export": "sapper export --legacy", |
||||
"start": "node __sapper__/build", |
||||
"cy:run": "cypress run", |
||||
"cy:open": "cypress open", |
||||
"test": "run-p --race dev cy:run" |
||||
}, |
||||
"dependencies": { |
||||
"compression": "^1.7.1", |
||||
"gulp": "^4.0.2", |
||||
"gulp-autoprefixer": "^7.0.1", |
||||
"gulp-clean-css": "^4.3.0", |
||||
"gulp-csscomb": "^3.1.0", |
||||
"gulp-rename": "^2.0.0", |
||||
"gulp-sass": "^4.1.0", |
||||
"pm2": "^4.4.1", |
||||
"polka": "next", |
||||
"randomcolor": "^0.6.2", |
||||
"sirv": "^1.0.0", |
||||
"svelte-preprocess": "^4.1.2" |
||||
}, |
||||
"devDependencies": { |
||||
"@babel/core": "^7.0.0", |
||||
"@babel/plugin-syntax-dynamic-import": "^7.0.0", |
||||
"@babel/plugin-transform-runtime": "^7.0.0", |
||||
"@babel/preset-env": "^7.0.0", |
||||
"@babel/runtime": "^7.0.0", |
||||
"@rollup/plugin-babel": "^5.0.0", |
||||
"@rollup/plugin-commonjs": "^14.0.0", |
||||
"@rollup/plugin-node-resolve": "^8.0.0", |
||||
"@rollup/plugin-replace": "^2.2.0", |
||||
"npm-run-all": "^4.1.5", |
||||
"rollup": "^2.3.4", |
||||
"rollup-plugin-svelte": "^6.0.0", |
||||
"rollup-plugin-terser": "^7.0.0", |
||||
"sapper": "^0.28.0", |
||||
"svelte": "^3.17.3" |
||||
} |
||||
} |
||||
@ -1,111 +0,0 @@ |
||||
import resolve from '@rollup/plugin-node-resolve'; |
||||
import replace from '@rollup/plugin-replace'; |
||||
import commonjs from '@rollup/plugin-commonjs'; |
||||
import svelte from 'rollup-plugin-svelte'; |
||||
import babel from '@rollup/plugin-babel'; |
||||
import { terser } from 'rollup-plugin-terser'; |
||||
import config from 'sapper/config/rollup.js'; |
||||
import pkg from './package.json'; |
||||
import sveltePreprocess from 'svelte-preprocess'; |
||||
|
||||
const preprocopts = {}; |
||||
|
||||
|
||||
const mode = process.env.NODE_ENV; |
||||
const dev = mode === 'development'; |
||||
const legacy = !!process.env.SAPPER_LEGACY_BUILD; |
||||
|
||||
const onwarn = (warning, onwarn) => |
||||
(warning.code === 'MISSING_EXPORT' && /'preload'/.test(warning.message)) || |
||||
(warning.code === 'CIRCULAR_DEPENDENCY' && /[/\\]@sapper[/\\]/.test(warning.message)) || |
||||
onwarn(warning); |
||||
|
||||
export default { |
||||
client: { |
||||
input: config.client.input(), |
||||
output: config.client.output(), |
||||
plugins: [ |
||||
replace({ |
||||
'process.browser': true, |
||||
'process.env.NODE_ENV': JSON.stringify(mode) |
||||
}), |
||||
svelte({ |
||||
dev, |
||||
hydratable: true, |
||||
emitCss: true, |
||||
preprocess: sveltePreprocess(preprocopts) |
||||
}), |
||||
resolve({ |
||||
browser: true, |
||||
dedupe: ['svelte'] |
||||
}), |
||||
commonjs(), |
||||
|
||||
legacy && babel({ |
||||
extensions: ['.js', '.mjs', '.html', '.svelte'], |
||||
babelHelpers: 'runtime', |
||||
exclude: ['node_modules/@babel/**'], |
||||
presets: [ |
||||
['@babel/preset-env', { |
||||
targets: '> 0.25%, not dead' |
||||
}] |
||||
], |
||||
plugins: [ |
||||
'@babel/plugin-syntax-dynamic-import', |
||||
['@babel/plugin-transform-runtime', { |
||||
useESModules: true |
||||
}] |
||||
] |
||||
}), |
||||
|
||||
!dev && terser({ |
||||
module: true |
||||
}) |
||||
], |
||||
|
||||
preserveEntrySignatures: false, |
||||
onwarn, |
||||
}, |
||||
|
||||
server: { |
||||
input: config.server.input(), |
||||
output: config.server.output(), |
||||
plugins: [ |
||||
replace({ |
||||
'process.browser': false, |
||||
'process.env.NODE_ENV': JSON.stringify(mode) |
||||
}), |
||||
svelte({ |
||||
generate: 'ssr', |
||||
hydratable: true, |
||||
dev, |
||||
preprocess: sveltePreprocess(preprocopts) |
||||
}), |
||||
resolve({ |
||||
dedupe: ['svelte'] |
||||
}), |
||||
commonjs() |
||||
], |
||||
external: Object.keys(pkg.dependencies).concat(require('module').builtinModules), |
||||
|
||||
preserveEntrySignatures: 'strict', |
||||
onwarn, |
||||
}, |
||||
|
||||
serviceworker: { |
||||
input: config.serviceworker.input(), |
||||
output: config.serviceworker.output(), |
||||
plugins: [ |
||||
resolve(), |
||||
replace({ |
||||
'process.browser': true, |
||||
'process.env.NODE_ENV': JSON.stringify(mode) |
||||
}), |
||||
commonjs(), |
||||
!dev && terser() |
||||
], |
||||
|
||||
preserveEntrySignatures: false, |
||||
onwarn, |
||||
} |
||||
}; |
||||
@ -1,38 +0,0 @@ |
||||
// Accordions |
||||
.accordion { |
||||
input:checked ~, |
||||
&[open] { |
||||
& .accordion-header { |
||||
.icon { |
||||
transform: rotate(90deg); |
||||
} |
||||
} |
||||
|
||||
& .accordion-body { |
||||
max-height: 50rem; |
||||
} |
||||
} |
||||
|
||||
.accordion-header { |
||||
display: block; |
||||
padding: $unit-1 $unit-2; |
||||
|
||||
.icon { |
||||
transition: transform .25s; |
||||
} |
||||
} |
||||
|
||||
.accordion-body { |
||||
margin-bottom: $layout-spacing; |
||||
max-height: 0; |
||||
overflow: hidden; |
||||
transition: max-height .25s; |
||||
} |
||||
} |
||||
|
||||
// Remove default details marker in Webkit |
||||
summary.accordion-header { |
||||
&::-webkit-details-marker { |
||||
display: none; |
||||
} |
||||
} |
||||
@ -1,20 +0,0 @@ |
||||
// Animations |
||||
@keyframes loading { |
||||
0% { |
||||
transform: rotate(0deg); |
||||
} |
||||
100% { |
||||
transform: rotate(360deg); |
||||
} |
||||
} |
||||
|
||||
@keyframes slide-down { |
||||
0% { |
||||
opacity: 0; |
||||
transform: translateY(-$unit-8); |
||||
} |
||||
100% { |
||||
opacity: 1; |
||||
transform: translateY(0); |
||||
} |
||||
} |
||||
@ -1,47 +0,0 @@ |
||||
// Autocomplete |
||||
.form-autocomplete { |
||||
position: relative; |
||||
|
||||
.form-autocomplete-input { |
||||
align-content: flex-start; |
||||
display: flex; |
||||
flex-wrap: wrap; |
||||
height: auto; |
||||
min-height: $unit-8; |
||||
padding: $unit-h; |
||||
|
||||
&.is-focused { |
||||
@include control-shadow(); |
||||
border-color: $primary-color; |
||||
} |
||||
|
||||
.form-input { |
||||
border-color: transparent; |
||||
box-shadow: none; |
||||
display: inline-block; |
||||
flex: 1 0 auto; |
||||
height: $unit-6; |
||||
line-height: $unit-4; |
||||
margin: $unit-h; |
||||
width: auto; |
||||
} |
||||
} |
||||
|
||||
.menu { |
||||
left: 0; |
||||
position: absolute; |
||||
top: 100%; |
||||
width: 100%; |
||||
} |
||||
|
||||
&.autocomplete-oneline { |
||||
.form-autocomplete-input { |
||||
flex-wrap: nowrap; |
||||
overflow-x: auto; |
||||
} |
||||
|
||||
.chip { |
||||
flex: 1 0 auto; |
||||
} |
||||
} |
||||
} |
||||
@ -1,77 +0,0 @@ |
||||
// Avatars |
||||
.avatar { |
||||
@include avatar-base(); |
||||
background: $primary-color; |
||||
border-radius: 50%; |
||||
color: rgba($light-color, .85); |
||||
display: inline-block; |
||||
font-weight: 300; |
||||
line-height: 1.25; |
||||
margin: 0; |
||||
position: relative; |
||||
vertical-align: middle; |
||||
|
||||
&.avatar-xs { |
||||
@include avatar-base($unit-4); |
||||
} |
||||
&.avatar-sm { |
||||
@include avatar-base($unit-6); |
||||
} |
||||
&.avatar-lg { |
||||
@include avatar-base($unit-12); |
||||
} |
||||
&.avatar-xl { |
||||
@include avatar-base($unit-16); |
||||
} |
||||
|
||||
img { |
||||
border-radius: 50%; |
||||
height: 100%; |
||||
position: relative; |
||||
width: 100%; |
||||
z-index: $zindex-0; |
||||
} |
||||
|
||||
.avatar-icon, |
||||
.avatar-presence { |
||||
background: $bg-color-light; |
||||
bottom: 14.64%; |
||||
height: 50%; |
||||
padding: $border-width-lg; |
||||
position: absolute; |
||||
right: 14.64%; |
||||
transform: translate(50%, 50%); |
||||
width: 50%; |
||||
z-index: $zindex-0 + 1; |
||||
} |
||||
|
||||
.avatar-presence { |
||||
background: $gray-color; |
||||
box-shadow: 0 0 0 $border-width-lg $light-color; |
||||
border-radius: 50%; |
||||
height: .5em; |
||||
width: .5em; |
||||
|
||||
&.online { |
||||
background: $success-color; |
||||
} |
||||
|
||||
&.busy { |
||||
background: $error-color; |
||||
} |
||||
|
||||
&.away { |
||||
background: $warning-color; |
||||
} |
||||
} |
||||
|
||||
&[data-initial]::before { |
||||
color: currentColor; |
||||
content: attr(data-initial); |
||||
left: 50%; |
||||
position: absolute; |
||||
top: 50%; |
||||
transform: translate(-50%, -50%); |
||||
z-index: $zindex-0; |
||||
} |
||||
} |
||||
@ -1,60 +0,0 @@ |
||||
// Badges |
||||
.badge { |
||||
position: relative; |
||||
white-space: nowrap; |
||||
|
||||
&[data-badge], |
||||
&:not([data-badge]) { |
||||
&::after { |
||||
background: $primary-color; |
||||
background-clip: padding-box; |
||||
border-radius: .5rem; |
||||
box-shadow: 0 0 0 .1rem $bg-color-light; |
||||
color: $light-color; |
||||
content: attr(data-badge); |
||||
display: inline-block; |
||||
transform: translate(-.05rem, -.5rem); |
||||
} |
||||
} |
||||
&[data-badge] { |
||||
&::after { |
||||
font-size: $font-size-sm; |
||||
height: .9rem; |
||||
line-height: 1; |
||||
min-width: .9rem; |
||||
padding: .1rem .2rem; |
||||
text-align: center; |
||||
white-space: nowrap; |
||||
} |
||||
} |
||||
&:not([data-badge]), |
||||
&[data-badge=""] { |
||||
&::after { |
||||
height: 6px; |
||||
min-width: 6px; |
||||
padding: 0; |
||||
width: 6px; |
||||
} |
||||
} |
||||
|
||||
// Badges for Buttons |
||||
&.btn { |
||||
&::after { |
||||
position: absolute; |
||||
top: 0; |
||||
right: 0; |
||||
transform: translate(50%, -50%); |
||||
} |
||||
} |
||||
|
||||
// Badges for Avatars |
||||
&.avatar { |
||||
&::after { |
||||
position: absolute; |
||||
top: 14.64%; |
||||
right: 14.64%; |
||||
transform: translate(50%, -50%); |
||||
z-index: $zindex-1; |
||||
} |
||||
} |
||||
} |
||||
@ -1,71 +0,0 @@ |
||||
// Bars |
||||
.bar { |
||||
background: $bg-color-dark; |
||||
border-radius: $border-radius; |
||||
display: flex; |
||||
flex-wrap: nowrap; |
||||
height: $unit-4; |
||||
width: 100%; |
||||
|
||||
&.bar-sm { |
||||
height: $unit-1; |
||||
} |
||||
|
||||
// TODO: attr() support |
||||
.bar-item { |
||||
background: $primary-color; |
||||
color: $light-color; |
||||
display: block; |
||||
font-size: $font-size-sm; |
||||
flex-shrink: 0; |
||||
line-height: $unit-4; |
||||
height: 100%; |
||||
position: relative; |
||||
text-align: center; |
||||
width: 0; |
||||
|
||||
&:first-child { |
||||
border-bottom-left-radius: $border-radius; |
||||
border-top-left-radius: $border-radius; |
||||
} |
||||
&:last-child { |
||||
border-bottom-right-radius: $border-radius; |
||||
border-top-right-radius: $border-radius; |
||||
flex-shrink: 1; |
||||
} |
||||
} |
||||
} |
||||
|
||||
// Slider bar |
||||
.bar-slider { |
||||
height: $border-width-lg; |
||||
margin: $layout-spacing 0; |
||||
position: relative; |
||||
|
||||
.bar-item { |
||||
left: 0; |
||||
padding: 0; |
||||
position: absolute; |
||||
&:not(:last-child):first-child { |
||||
background: $bg-color-dark; |
||||
z-index: $zindex-0; |
||||
} |
||||
} |
||||
|
||||
.bar-slider-btn { |
||||
background: $primary-color; |
||||
border: 0; |
||||
border-radius: 50%; |
||||
height: $unit-3; |
||||
padding: 0; |
||||
position: absolute; |
||||
right: 0; |
||||
top: 50%; |
||||
transform: translate(50%, -50%); |
||||
width: $unit-3; |
||||
|
||||
&:active { |
||||
box-shadow: 0 0 0 .1rem $primary-color; |
||||
} |
||||
} |
||||
} |
||||
@ -1,40 +0,0 @@ |
||||
// Base |
||||
*, |
||||
*::before, |
||||
*::after { |
||||
box-sizing: inherit; |
||||
} |
||||
|
||||
html { |
||||
box-sizing: border-box; |
||||
font-size: $html-font-size; |
||||
line-height: $html-line-height; |
||||
-webkit-tap-highlight-color: transparent; |
||||
} |
||||
|
||||
body { |
||||
background: $body-bg; |
||||
color: $body-font-color; |
||||
font-family: $body-font-family; |
||||
font-size: $font-size; |
||||
overflow-x: hidden; |
||||
text-rendering: optimizeLegibility; |
||||
} |
||||
|
||||
a { |
||||
color: $link-color; |
||||
outline: none; |
||||
text-decoration: underline; |
||||
|
||||
&:focus { |
||||
@include control-shadow(); |
||||
} |
||||
|
||||
&:focus, |
||||
&:hover, |
||||
&:active, |
||||
&.active { |
||||
color: $link-color-dark; |
||||
text-decoration: underline; |
||||
} |
||||
} |
||||
@ -1,29 +0,0 @@ |
||||
// Breadcrumbs |
||||
.breadcrumb { |
||||
list-style: none; |
||||
margin: $unit-1 0; |
||||
padding: $unit-1 0; |
||||
|
||||
.breadcrumb-item { |
||||
color: $gray-color-dark; |
||||
display: inline-block; |
||||
margin: 0; |
||||
padding: $unit-1 0; |
||||
|
||||
&:not(:last-child) { |
||||
margin-right: $unit-1; |
||||
|
||||
a { |
||||
color: $gray-color-dark; |
||||
} |
||||
} |
||||
|
||||
&:not(:first-child) { |
||||
&::before { |
||||
color: $gray-color-dark; |
||||
content: "/"; |
||||
padding-right: $unit-2; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
@ -1,198 +0,0 @@ |
||||
// Buttons |
||||
.btn { |
||||
appearance: none; |
||||
background: $bg-color-light; |
||||
border: $border-width solid $primary-color; |
||||
border-radius: $border-radius; |
||||
color: $primary-color; |
||||
cursor: pointer; |
||||
display: inline-block; |
||||
font-size: $font-size; |
||||
height: $control-size; |
||||
line-height: $line-height; |
||||
outline: none; |
||||
padding: $control-padding-y $control-padding-x; |
||||
text-align: center; |
||||
text-decoration: none; |
||||
transition: background .2s, border .2s, box-shadow .2s, color .2s; |
||||
user-select: none; |
||||
vertical-align: middle; |
||||
white-space: nowrap; |
||||
&:focus { |
||||
@include control-shadow(); |
||||
} |
||||
&:focus, |
||||
&:hover { |
||||
background: $secondary-color; |
||||
border-color: $primary-color-dark; |
||||
color: $light-color; |
||||
text-decoration: none; |
||||
} |
||||
&:active, |
||||
&.active { |
||||
background: $primary-color-dark; |
||||
border-color: darken($primary-color-dark, 5%); |
||||
color: $light-color; |
||||
text-decoration: none; |
||||
&.loading { |
||||
&::after { |
||||
border-bottom-color: $light-color; |
||||
border-left-color: $light-color; |
||||
} |
||||
} |
||||
} |
||||
&[disabled], |
||||
&:disabled, |
||||
&.disabled { |
||||
cursor: default; |
||||
opacity: .5; |
||||
pointer-events: none; |
||||
} |
||||
|
||||
// Button Primary |
||||
&.btn-primary { |
||||
background: $primary-color; |
||||
border-color: $primary-color-dark; |
||||
color: $light-color; |
||||
&:focus, |
||||
&:hover { |
||||
background: darken($primary-color-dark, 2%); |
||||
border-color: darken($primary-color-dark, 5%); |
||||
color: $light-color; |
||||
} |
||||
&:active, |
||||
&.active { |
||||
background: darken($primary-color-dark, 4%); |
||||
border-color: darken($primary-color-dark, 7%); |
||||
color: $light-color; |
||||
} |
||||
&.loading { |
||||
&::after { |
||||
border-bottom-color: $light-color; |
||||
border-left-color: $light-color; |
||||
} |
||||
} |
||||
} |
||||
|
||||
// Button Colors |
||||
&.btn-success { |
||||
@include button-variant($success-color); |
||||
} |
||||
|
||||
&.btn-warning { |
||||
@include button-variant($warning-color); |
||||
} |
||||
|
||||
&.btn-error { |
||||
@include button-variant($error-color); |
||||
} |
||||
|
||||
// Button Link |
||||
&.btn-link { |
||||
background: transparent; |
||||
border-color: transparent; |
||||
color: $link-color; |
||||
&:focus, |
||||
&:hover, |
||||
&:active, |
||||
&.active { |
||||
color: $link-color-dark; |
||||
} |
||||
} |
||||
|
||||
// Button Sizes |
||||
&.btn-sm { |
||||
font-size: $font-size-sm; |
||||
height: $control-size-sm; |
||||
padding: $control-padding-y-sm $control-padding-x-sm; |
||||
} |
||||
|
||||
&.btn-lg { |
||||
font-size: $font-size-lg; |
||||
height: $control-size-lg; |
||||
padding: $control-padding-y-lg $control-padding-x-lg; |
||||
} |
||||
|
||||
// Button Block |
||||
&.btn-block { |
||||
display: block; |
||||
width: 100%; |
||||
} |
||||
|
||||
// Button Action |
||||
&.btn-action { |
||||
width: $control-size; |
||||
padding-left: 0; |
||||
padding-right: 0; |
||||
|
||||
&.btn-sm { |
||||
width: $control-size-sm; |
||||
} |
||||
|
||||
&.btn-lg { |
||||
width: $control-size-lg; |
||||
} |
||||
} |
||||
|
||||
// Button Clear |
||||
&.btn-clear { |
||||
background: transparent; |
||||
border: 0; |
||||
color: currentColor; |
||||
height: $unit-5; |
||||
line-height: $unit-4; |
||||
margin-left: $unit-1; |
||||
margin-right: -2px; |
||||
opacity: 1; |
||||
padding: $unit-h; |
||||
text-decoration: none; |
||||
width: $unit-5; |
||||
|
||||
&:focus, |
||||
&:hover { |
||||
background: rgba($bg-color, .5); |
||||
opacity: .95; |
||||
} |
||||
|
||||
&::before { |
||||
content: "\2715"; |
||||
} |
||||
} |
||||
} |
||||
|
||||
// Button groups |
||||
.btn-group { |
||||
display: inline-flex; |
||||
flex-wrap: wrap; |
||||
|
||||
.btn { |
||||
flex: 1 0 auto; |
||||
&:first-child:not(:last-child) { |
||||
border-bottom-right-radius: 0; |
||||
border-top-right-radius: 0; |
||||
} |
||||
&:not(:first-child):not(:last-child) { |
||||
border-radius: 0; |
||||
margin-left: -$border-width; |
||||
} |
||||
&:last-child:not(:first-child) { |
||||
border-bottom-left-radius: 0; |
||||
border-top-left-radius: 0; |
||||
margin-left: -$border-width; |
||||
} |
||||
&:focus, |
||||
&:hover, |
||||
&:active, |
||||
&.active { |
||||
z-index: $zindex-0; |
||||
} |
||||
} |
||||
|
||||
&.btn-group-block { |
||||
display: flex; |
||||
|
||||
.btn { |
||||
flex: 1 0 0; |
||||
} |
||||
} |
||||
} |
||||
@ -1,222 +0,0 @@ |
||||
// Calendars |
||||
.calendar { |
||||
border: $border-width solid $border-color; |
||||
border-radius: $border-radius; |
||||
display: block; |
||||
min-width: 280px; |
||||
|
||||
.calendar-nav { |
||||
align-items: center; |
||||
background: $bg-color; |
||||
border-top-left-radius: $border-radius; |
||||
border-top-right-radius: $border-radius; |
||||
display: flex; |
||||
font-size: $font-size-lg; |
||||
padding: $layout-spacing; |
||||
} |
||||
|
||||
.calendar-header, |
||||
.calendar-body { |
||||
display: flex; |
||||
flex-wrap: wrap; |
||||
justify-content: center; |
||||
padding: $layout-spacing 0; |
||||
|
||||
.calendar-date { |
||||
flex: 0 0 14.28%; // 7 calendar-items each row |
||||
max-width: 14.28%; |
||||
} |
||||
} |
||||
|
||||
.calendar-header { |
||||
background: $bg-color; |
||||
border-bottom: $border-width solid $border-color; |
||||
color: $gray-color; |
||||
font-size: $font-size-sm; |
||||
text-align: center; |
||||
} |
||||
|
||||
.calendar-body { |
||||
color: $gray-color-dark; |
||||
} |
||||
|
||||
.calendar-date { |
||||
border: 0; |
||||
padding: $unit-1; |
||||
|
||||
.date-item { |
||||
appearance: none; |
||||
background: transparent; |
||||
border: $border-width solid transparent; |
||||
border-radius: 50%; |
||||
color: $gray-color-dark; |
||||
cursor: pointer; |
||||
font-size: $font-size-sm; |
||||
height: $unit-7; |
||||
line-height: $unit-5; |
||||
outline: none; |
||||
padding: $unit-h; |
||||
position: relative; |
||||
text-align: center; |
||||
text-decoration: none; |
||||
transition: background .2s, border .2s, box-shadow .2s, color .2s; |
||||
vertical-align: middle; |
||||
white-space: nowrap; |
||||
width: $unit-7; |
||||
|
||||
&.date-today { |
||||
border-color: $secondary-color-dark; |
||||
color: $primary-color; |
||||
} |
||||
|
||||
&:focus { |
||||
@include control-shadow(); |
||||
} |
||||
|
||||
&:focus, |
||||
&:hover { |
||||
background: $secondary-color-light; |
||||
border-color: $secondary-color-dark; |
||||
color: $primary-color; |
||||
text-decoration: none; |
||||
} |
||||
&:active, |
||||
&.active { |
||||
background: $primary-color-dark; |
||||
border-color: darken($primary-color-dark, 5%); |
||||
color: $light-color; |
||||
} |
||||
|
||||
// Calendar badge support |
||||
&.badge { |
||||
&::after { |
||||
position: absolute; |
||||
top: 3px; |
||||
right: 3px; |
||||
transform: translate(50%, -50%); |
||||
} |
||||
} |
||||
} |
||||
|
||||
.date-item, |
||||
.calendar-event { |
||||
&:disabled, |
||||
&.disabled { |
||||
cursor: default; |
||||
opacity: .25; |
||||
pointer-events: none; |
||||
} |
||||
} |
||||
|
||||
&.prev-month, |
||||
&.next-month { |
||||
.date-item, |
||||
.calendar-event { |
||||
opacity: .25; |
||||
} |
||||
} |
||||
} |
||||
|
||||
.calendar-range { |
||||
position: relative; |
||||
|
||||
&::before { |
||||
background: $secondary-color; |
||||
content: ""; |
||||
height: $unit-7; |
||||
left: 0; |
||||
position: absolute; |
||||
right: 0; |
||||
top: 50%; |
||||
transform: translateY(-50%); |
||||
} |
||||
&.range-start { |
||||
&::before { |
||||
left: 50%; |
||||
} |
||||
} |
||||
&.range-end { |
||||
&::before { |
||||
right: 50%; |
||||
} |
||||
} |
||||
|
||||
&.range-start, |
||||
&.range-end { |
||||
.date-item { |
||||
background: $primary-color-dark; |
||||
border-color: darken($primary-color-dark, 5%); |
||||
color: $light-color; |
||||
} |
||||
} |
||||
|
||||
.date-item { |
||||
color: $primary-color; |
||||
} |
||||
} |
||||
|
||||
// Calendars size |
||||
&.calendar-lg { |
||||
.calendar-body { |
||||
padding: 0; |
||||
|
||||
.calendar-date { |
||||
border-bottom: $border-width solid $border-color; |
||||
border-right: $border-width solid $border-color; |
||||
display: flex; |
||||
flex-direction: column; |
||||
height: 5.5rem; |
||||
padding: 0; |
||||
|
||||
&:nth-child(7n) { |
||||
border-right: 0; |
||||
} |
||||
&:nth-last-child(-n+7) { |
||||
border-bottom: 0; |
||||
} |
||||
} |
||||
} |
||||
|
||||
.date-item { |
||||
align-self: flex-end; |
||||
height: $unit-7; |
||||
margin-right: $layout-spacing-sm; |
||||
margin-top: $layout-spacing-sm; |
||||
} |
||||
|
||||
.calendar-range { |
||||
&::before { |
||||
top: 19px; |
||||
} |
||||
&.range-start { |
||||
&::before { |
||||
left: auto; |
||||
width: 19px; |
||||
} |
||||
} |
||||
&.range-end { |
||||
&::before { |
||||
right: 19px; |
||||
} |
||||
} |
||||
} |
||||
|
||||
.calendar-events { |
||||
flex-grow: 1; |
||||
line-height: 1; |
||||
overflow-y: auto; |
||||
padding: $layout-spacing-sm; |
||||
} |
||||
|
||||
.calendar-event { |
||||
border-radius: $border-radius; |
||||
font-size: $font-size-sm; |
||||
display: block; |
||||
margin: $unit-h auto; |
||||
overflow: hidden; |
||||
padding: 3px 4px; |
||||
text-overflow: ellipsis; |
||||
white-space: nowrap; |
||||
} |
||||
} |
||||
} |
||||
@ -1,43 +0,0 @@ |
||||
// Cards |
||||
.card { |
||||
background: $bg-color-light; |
||||
border: $border-width solid $border-color; |
||||
border-radius: $border-radius; |
||||
display: flex; |
||||
flex-direction: column; |
||||
|
||||
.card-header, |
||||
.card-body, |
||||
.card-footer { |
||||
padding: $layout-spacing-lg; |
||||
padding-bottom: 0; |
||||
|
||||
&:last-child { |
||||
padding-bottom: $layout-spacing-lg; |
||||
} |
||||
} |
||||
|
||||
.card-body { |
||||
flex: 1 1 auto; |
||||
} |
||||
|
||||
.card-image { |
||||
padding-top: $layout-spacing-lg; |
||||
|
||||
&:first-child { |
||||
padding-top: 0; |
||||
|
||||
img { |
||||
border-top-left-radius: $border-radius; |
||||
border-top-right-radius: $border-radius; |
||||
} |
||||
} |
||||
|
||||
&:last-child { |
||||
img { |
||||
border-bottom-left-radius: $border-radius; |
||||
border-bottom-right-radius: $border-radius; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
@ -1,136 +0,0 @@ |
||||
// Carousels |
||||
// The number of carousel images |
||||
$carousel-number: 8; |
||||
|
||||
%carousel-image-checked { |
||||
animation: carousel-slidein .75s ease-in-out 1; |
||||
opacity: 1; |
||||
z-index: $zindex-1; |
||||
} |
||||
|
||||
%carousel-nav-checked { |
||||
color: $gray-color-light; |
||||
} |
||||
|
||||
.carousel { |
||||
background: $bg-color; |
||||
display: block; |
||||
overflow: hidden; |
||||
position: relative; |
||||
width: 100%; |
||||
-webkit-overflow-scrolling: touch; |
||||
z-index: $zindex-0; |
||||
|
||||
.carousel-container { |
||||
height: 100%; |
||||
left: 0; |
||||
position: relative; |
||||
&::before { |
||||
content: ""; |
||||
display: block; |
||||
padding-bottom: 56.25%; |
||||
} |
||||
|
||||
.carousel-item { |
||||
animation: carousel-slideout 1s ease-in-out 1; |
||||
height: 100%; |
||||
left: 0; |
||||
margin: 0; |
||||
opacity: 0; |
||||
position: absolute; |
||||
top: 0; |
||||
width: 100%; |
||||
|
||||
&:hover { |
||||
.item-prev, |
||||
.item-next { |
||||
opacity: 1; |
||||
} |
||||
} |
||||
} |
||||
|
||||
.item-prev, |
||||
.item-next { |
||||
background: rgba($gray-color-light, .25); |
||||
border-color: rgba($gray-color-light, .5); |
||||
color: $gray-color-light; |
||||
opacity: 0; |
||||
position: absolute; |
||||
top: 50%; |
||||
transition: all .4s; |
||||
transform: translateY(-50%); |
||||
z-index: $zindex-1; |
||||
} |
||||
.item-prev { |
||||
left: 1rem; |
||||
} |
||||
.item-next { |
||||
right: 1rem; |
||||
} |
||||
} |
||||
|
||||
.carousel-locator { |
||||
@for $i from 1 through ($carousel-number) { |
||||
&:nth-of-type(#{$i}):checked ~ .carousel-container .carousel-item:nth-of-type(#{$i}) { |
||||