Commit ec8b2308 authored by nwindis's avatar nwindis
Browse files

ADD npm run task to lint Scss

#66
parent 1c318ded
{
"extends": "stylelint-config-sass-guidelines"
"extends": "stylelint-config-sass-guidelines",
"rules": {
"selector-class-pattern": "[a-z]+",
"max-nesting-depth": 2
}
}
\ No newline at end of file
{
"blocks": "never",
"brackets": "never",
"colons": "never",
"colors": "always",
"commaSpace": "always",
"commentSpace": "always",
"cssLiteral": "never",
"depthLimit": false,
"duplicates": true,
"efficient": "always",
"extendPref": false,
"globalDupe": true,
"indentPref": 2,
"leadingZero": "never",
"maxErrors": false,
"maxWarnings": false,
"mixed": false,
"namingConvention": false,
"namingConventionStrict": false,
"none": "never",
"noImportant": false,
"parenSpace": "never",
"placeholder": false,
"prefixVarsWithDollar": "always",
"quotePref": "single",
"semicolons": "never",
"sortOrder": false,
"stackedProperties": "never",
"trailingWhitespace": "never",
"universal": "never",
"valid": true,
"zeroUnits": "never",
"zIndexNormalize": false
}
......@@ -14533,12 +14533,6 @@
}
}
},
"stylelint-config-recommended": {
"version": "3.0.0",
"resolved": "https://registry.npmjs.org/stylelint-config-recommended/-/stylelint-config-recommended-3.0.0.tgz",
"integrity": "sha512-F6yTRuc06xr1h5Qw/ykb2LuFynJ2IxkKfCMf+1xqPffkxh0S09Zc902XCffcsw/XMFq/OzQ1w54fLIDtmRNHnQ==",
"dev": true
},
"stylelint-config-sass-guidelines": {
"version": "7.1.0",
"resolved": "https://registry.npmjs.org/stylelint-config-sass-guidelines/-/stylelint-config-sass-guidelines-7.1.0.tgz",
......@@ -14549,15 +14543,6 @@
"stylelint-scss": "^3.18.0"
}
},
"stylelint-config-standard": {
"version": "20.0.0",
"resolved": "https://registry.npmjs.org/stylelint-config-standard/-/stylelint-config-standard-20.0.0.tgz",
"integrity": "sha512-IB2iFdzOTA/zS4jSVav6z+wGtin08qfj+YyExHB3LF9lnouQht//YyB0KZq9gGz5HNPkddHOzcY8HsUey6ZUlA==",
"dev": true,
"requires": {
"stylelint-config-recommended": "^3.0.0"
}
},
"stylelint-order": {
"version": "4.1.0",
"resolved": "https://registry.npmjs.org/stylelint-order/-/stylelint-order-4.1.0.tgz",
......
......@@ -55,8 +55,7 @@
"sass": "^1.26.10",
"sass-loader": "8.0.2",
"stylelint": "^13.7.2",
"stylelint-config-sass-guidelines": "^7.1.0",
"stylelint-config-standard": "^20.0.0"
"stylelint-config-sass-guidelines": "^7.1.0"
},
"browserslist": [
"last 1 version, not dead, ie >= 11"
......@@ -71,6 +70,7 @@
"scripts": {
"build": "quasar build --modern",
"dev": "quasar dev --modern",
"lint": "eslint --ext .js,.vue src"
"lint": "eslint --ext .js,.vue src",
"lint:scss": "node_modules/.bin/stylelint 'src/**/*.{scss,vue}'"
}
}
......@@ -12,9 +12,7 @@ module.exports = function (ctx) {
// https://quasar.dev/quasar-cli/quasar-conf-js#Property%3A-css
css: [
'../statics/support.css',
'/global.scss',
'/treeview.scss'
'/style.scss'
],
// https://github.com/quasarframework/quasar/tree/dev/extras
......
......@@ -29,7 +29,7 @@
</div>
<!-- FIXME: remove inline style -->
<div class="row" style="display: contents">
<div class="row" style="display: contents;">
<!-- FIXME: remove inline style -->
<div class="scroll-panel" :id="nodeid" :style="`font-size: ${fontsize}px`" v-html="content" />
</div>
......
<template>
<q-header
id="header"
elevated
:class="$q.dark.isActive ? 'bg-black text-white' : 'bg-white text-black'"
>
......@@ -70,11 +69,12 @@ export default {
</script>
<style lang="scss" scoped>
#header {
header {
left: 0;
position: absolute;
top: 0;
left: 0;
}
.bar {
margin-left: auto;
margin-right: auto;
......
......@@ -16,7 +16,7 @@
self="center middle"
>
<!-- FIXME: remove inline style -->
<q-list style="min-width: 100px">
<q-list style="min-width: 100px;">
<q-item clickable v-close-popup>
<q-item-section>EN</q-item-section>
</q-item>
......
......@@ -51,14 +51,14 @@ export default {
<style lang="scss" scoped>
button:first-of-type {
@media (min-width: 600px){
@media (min-width: 600px) {
margin-right: 8px;
}
}
.q-input {
width: 100%;
@media (min-width: 600px){
@media (min-width: 600px) {
margin-right: 8px;
width: 150px;
}
......
<template>
<!-- FIXME: remove inline style -->
<figure id="openseadragon" style="margin-top: 0px; padding: 8px">
<figure id="openseadragon" style="margin-top: 0; padding: 8px">
<nav class="sticky">
<q-btn
v-for="(btn, idx) in buttons" :key="idx"
......
......@@ -6,7 +6,7 @@
<!-- FIXME: remove inline style -->
<q-card
:class="$q.dark.isActive ? 'bg-black' : 'bg-white text-black'"
style="width: 600px"
style="width: 600px;"
>
<q-card-section>
<div class="text-h6 text-uppercase">Customize Panels</div>
......
<template>
<section id="filterBtns">
<section class="filter-buttons">
<q-btn-dropdown v-if="$q.screen.width < 1100"
class="q-mb-md"
color="black"
......@@ -15,7 +15,7 @@
</template>
<style lang="scss" scoped>
#filterBtns {
.filter-buttons {
align-items: center;
display: flex;
justify-content: center;
......
......@@ -88,6 +88,7 @@ export default {
margin-right: 8px;
}
}
button:last-of-type {
margin-right: 0;
}
......
......@@ -16,6 +16,7 @@
:class="$q.dark.isActive ? 'bg-grey-8 text-white' : 'bg-grey-1 text-black'"
>
<div>
<!-- FIXME: use a div or alike, but not HTML header tag -->
<header>
<input
class="hidden-textinput"
......@@ -146,10 +147,12 @@ export default {
grid-template-columns: 1fr 1fr 1fr 1fr;
}
div.p-c {
// FIXME: class name not self explanatory
.p-c {
position: relative;
> * {
background-color: #eee;
background-color: $light;
height: 300px;
padding: 15px 10px;
}
......@@ -159,18 +162,16 @@ export default {
display: flex;
}
.components-list {
> * {
background-color: $light;
border-radius: 5px;
cursor: move;
margin: 10px 0;
padding: 10px;
&:active, &:focus {
// FIXME: Quasar color variables
outline: 1px solid blue;
}
.components-list > * {
background-color: $light;
border-radius: 5px;
cursor: move;
margin: 10px 0;
padding: 10px;
&:active,
&:focus {
outline: 1px solid $blue-6;
}
}
......
// global extra classes
@import './responsive-heights.scss';
body {
height: 100vh;
......@@ -11,8 +10,9 @@ body {
.scroll-panel {
position: relative;
.sticky {
background: #fff;
background: $light;
display: flex;
justify-content: flex-start;
left: 0;
......@@ -42,10 +42,10 @@ body {
}
.scroll-panel {
-ms-overflow-style: none;
@include makeResponsiveHeight();
overflow: auto;
-ms-overflow-style: none;
scrollbar-width: none;
@include makeResponsiveHeight();
}
.scroll-panel::-webkit-scrollbar {
......@@ -54,10 +54,6 @@ body {
.unselect-text {
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
......@@ -72,7 +68,7 @@ body {
.hidden-textinput {
background: transparent;
border: none;
border: 0;
outline: none;
width: 100%;
}
......@@ -12,15 +12,4 @@
// to match your app's branding.
// Tip: Use the "Theme Builder" on Quasar's documentation website.
$primary : #1976D2;
$secondary : #26A69A;
$accent : #9C27B0;
$dark : #1D1D1D;
$light : #FFFFFF;
$positive : #21BA45;
$negative : #C10015;
$info : #31CCEC;
$warning : #F2C037;
\ No newline at end of file
$light: #fff;
@mixin makeResponsiveHeight {
$sizesSreen: ("400px": "26vh","450px": "34vh", "500px": "41vh", "550px": "46vh", "600px": "50vh", "630px": "53vh", "660px": "55vh", "700px": "58vh", "750px": "61vh", "800px": "63vh", "850px": "66vh", "900px": "67vh", "980px": "70vh", "1200px": "75vh", "1300px": "77vh", "1800px": "83vh");
$sizesSreen: ('400px': '26vh','450px': '34vh', '500px': '41vh', '550px': '46vh', '600px': '50vh', '630px': '53vh', '660px': '55vh', '700px': '58vh', '750px': '61vh', '800px': '63vh', '850px': '66vh', '900px': '67vh', '980px': '70vh', '1200px': '75vh', '1300px': '77vh', '1800px': '83vh');
@each $minheight, $height in $sizesSreen {
@media (min-height: #{$minheight}) {
......
@import '../statics/support.css';
@import '~quasar/src/css/variables';
@import './quasar.variables';
@import './responsive-heights';
@import './global';
@import './treeview';
@import './responsive-heights.scss';
.view-tree {
overflow-y: scroll;
@include makeResponsiveHeight();
-ms-overflow-style: none;
overflow-y: scroll;
scrollbar-width: none;
.q-tree__node-collapsible .q-tree__children {
> .q-tree__node--parent {
> .q-tree__node-header {
......@@ -19,9 +18,11 @@
}
}
}
.q-tree__node-header-content.col.row.no-wrap.items-center {
z-index: 99;
}
.q-tree__children {
cursor: pointer;
}
......
......@@ -104,12 +104,14 @@ export default {
</script>
<style lang="scss" scoped>
.content-tabs {
display: inline-block;
}
.tabs-container {
display: flex;
> * {
flex: 1;
}
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment