Commit 4ab041f7 by Torkel Ödegaard

ux(): added sass linter, almost no rules enabled yet

parent f3fe1a53
......@@ -110,7 +110,7 @@ func setIndexViewData(c *middleware.Context) (*dtos.IndexViewData, error) {
{Text: "Global Orgs", Icon: "fa fa-fw fa-cogs", Url: setting.AppSubUrl + "/admin/orgs"},
{Text: "Server Settings", Icon: "fa fa-fw fa-cogs", Url: setting.AppSubUrl + "/admin/settings"},
{Text: "Server Stats", Icon: "fa-fw fa-cogs", Url: setting.AppSubUrl + "/admin/stats"},
},
},
})
}
......
options:
formatter: stylish
files:
include: '**/*.s+(a|c)ss'
ignore:
- './utils/*.scss'
rules:
# Extends
extends-before-mixins: 0
extends-before-declarations: 0
placeholder-in-extend: 0
# Mixins
mixins-before-declarations: 0
# Line Spacing
one-declaration-per-line: 0
empty-line-between-blocks: 0
single-line-per-selector: 0
# Disallows
no-color-keywords: 0
no-color-literals: 0
no-css-comments: 0
no-debug: 0
no-duplicate-properties: 0
no-empty-rulesets: 1
no-extends: 0
no-ids: 0
no-important: 0
no-invalid-hex: 0
no-mergeable-selectors: 0
no-misspelled-properties: 0
no-qualifying-elements: 0
no-trailing-zero: 0
no-transition-all: 0
no-url-protocols: 0
no-vendor-prefixes: 0
no-warn: 0
property-units: 0
# Nesting
force-attribute-nesting: 0
force-element-nesting: 0
force-pseudo-nesting: 0
# Name Formats
class-name-format: 0
function-name-format: 0
id-name-format: 0
mixin-name-format: 0
placeholder-name-format: 0
variable-name-format: 0
# Style Guide
bem-depth: 0
border-zero: 0
brace-style: 0
clean-import-paths: 0
empty-args: 0
hex-length: 0
hex-notation: 0
indentation: 0
leading-zero: 0
nesting-depth: 0
property-sort-order: 0
quotes: 0
shorthand-values: 0
url-quotes: 0
variable-for-property: 0
zero-unit: 0
# Inner Spacing
space-after-comma: 0
space-before-colon: 0
space-after-colon: 0
space-before-brace: 0
space-before-bang: 0
space-after-bang: 0
space-between-parens: 0
space-around-operator: 0
# Final Items
trailing-semicolon: 0
final-newline: 0
......@@ -7,8 +7,8 @@
// ---------------------
@include media-breakpoint-down(sm) {
div.panel {
width: 100% !important;
padding: 0px !important;
width: 100%;
padding: 0px;
}
.panel-margin {
margin-right: 0;
......
//
// Grid system
// --------------------------------------------------
// Fixed (940px)
#grid > .core($gridColumnWidth, $gridGutterWidth);
// Fluid (940px)
#grid > .fluid($fluidGridColumnWidth, $fluidGridGutterWidth);
// Reset utility classes due to specificity
[class*="span"].hide,
.row-fluid [class*="span"].hide {
display: none;
}
[class*="span"].pull-right,
.row-fluid [class*="span"].pull-right {
float: right;
}
//
// Responsive: Large desktop and up
// --------------------------------------------------
@media (min-width: 1200px) {
// Fixed grid
#grid > .core($gridColumnWidth1200, $gridGutterWidth1200);
// Fluid grid
#grid > .fluid($fluidGridColumnWidth1200, $fluidGridGutterWidth1200);
// Input grid
#grid > .input($gridColumnWidth1200, $gridGutterWidth1200);
// Thumbnails
.thumbnails {
margin-left: -$gridGutterWidth1200;
}
.thumbnails > li {
margin-left: $gridGutterWidth1200;
}
.row-fluid .thumbnails {
margin-left: 0;
}
}
//
// Responsive: Landscape phone to desktop/tablet
// --------------------------------------------------
@media (max-width: 767px) {
// GRID & CONTAINERS
// -----------------
// Remove width from containers
.container {
width: auto;
}
// Fluid rows
.row-fluid {
width: 100%;
}
// Undo negative margin on rows and thumbnails
.row,
.thumbnails {
margin-left: 0;
}
.thumbnails > li {
float: none;
margin-left: 0; // Reset the default margin for all li elements when no .span* classes are present
}
// Make all grid-sized elements block level again
[class*="span"],
.uneditable-input[class*="span"], // Makes uneditable inputs full-width when using grid sizing
.row-fluid [class*="span"] {
float: none;
display: block;
width: 100%;
margin-left: 0;
@include box-sizing(border-box);
}
.span12,
.row-fluid .span12 {
width: 100%;
@include box-sizing(border-box);
}
.row-fluid [class*="offset"]:first-child {
margin-left: 0;
}
// FORM FIELDS
// -----------
// Make span* classes full width
.input-large,
.input-xlarge,
.input-xxlarge,
input[class*="span"],
select[class*="span"],
textarea[class*="span"],
.uneditable-input {
@mixin input-block-level();
}
// But don't let it screw up prepend/append inputs
.input-prepend input,
.input-append input,
.input-prepend input[class*="span"],
.input-append input[class*="span"] {
display: inline-block; // redeclare so they don't wrap to new lines
width: auto;
}
.controls-row [class*="span"] + [class*="span"] {
margin-left: 0;
}
// Modals
.modal {
position: fixed;
top: 20px;
left: 20px;
right: 20px;
width: auto;
margin: 0;
&.fade { top: -100px; }
&.fade.in { top: 20px; }
}
}
// UP TO LANDSCAPE PHONE
// ---------------------
@media (max-width: 480px) {
// Smooth out the collapsing/expanding nav
.nav-collapse {
-webkit-transform: translate3d(0, 0, 0); // activate the GPU
}
// Block level the page header small tag for readability
.page-header h1 small {
display: block;
line-height: $line-height-base;
}
// Update checkboxes for iOS
input[type="checkbox"],
input[type="radio"] {
border: 1px solid #ccc;
}
// Remove the horizontal form styles
.form-horizontal {
.control-label {
float: none;
width: auto;
padding-top: 0;
text-align: left;
}
// Move over all input controls and content
.controls {
margin-left: 0;
}
// Move the options list down to align with labels
.control-list {
padding-top: 0; // has to be padding because margin collaspes
}
// Move over buttons in .form-actions to align with .controls
.form-actions {
padding-left: 10px;
padding-right: 10px;
}
}
// Medias
// Reset float and spacing to stack
.media .pull-left,
.media .pull-right {
float: none;
display: block;
margin-bottom: 10px;
}
// Remove side margins since we stack instead of indent
.media-object {
margin-right: 0;
margin-left: 0;
}
// Modals
.modal {
top: 10px;
left: 10px;
right: 10px;
}
.modal-header .close {
padding: 10px;
margin: -10px;
}
// Carousel
.carousel-caption {
position: static;
}
}
//
// Responsive: Tablet to desktop
// --------------------------------------------------
@media (min-width: 768px) and (max-width: 979px) {
// Fixed grid
#grid > .core($gridColumnWidth768, $gridGutterWidth768);
// Fluid grid
#grid > .fluid($fluidGridColumnWidth768, $fluidGridGutterWidth768);
// Input grid
#grid > .input($gridColumnWidth768, $gridGutterWidth768);
// No need to reset .thumbnails here since it's the same $gridGutterWidth
}
//
// Responsive: Utility classes
// --------------------------------------------------
// IE10 Metro responsive
// Required for Windows 8 Metro split-screen snapping with IE10
// Source: http://timkadlec.com/2012/10/ie10-snap-mode-and-responsive-design/
$-ms-viewport{
width: device-width;
}
// Hide from screenreaders and browsers
// Credit: HTML5 Boilerplate
.hidden {
display: none;
visibility: hidden;
}
// Visibility utilities
// For desktops
.visible-phone { display: none !important; }
.visible-tablet { display: none !important; }
.hidden-phone { }
.hidden-tablet { }
.hidden-desktop { display: none !important; }
.visible-desktop { display: inherit !important; }
// Tablets & small desktops only
@media (min-width: 768px) and (max-width: 979px) {
// Hide everything else
.hidden-desktop { display: inherit !important; }
.visible-desktop { display: none !important ; }
// Show
.visible-tablet { display: inherit !important; }
// Hide
.hidden-tablet { display: none !important; }
}
// Phones only
@media (max-width: 767px) {
// Hide everything else
.hidden-desktop { display: inherit !important; }
.visible-desktop { display: none !important; }
// Show
.visible-phone { display: inherit !important; } // Use inherit to restore previous behavior
// Hide
.hidden-phone { display: none !important; }
}
// Print utilities
.visible-print { display: none !important; }
.hidden-print { }
@media print {
.visible-print { display: inherit !important; }
.hidden-print { display: none !important; }
}
/*!
* Bootstrap Responsive v2.3.2
*
* Copyright 2013 Twitter, Inc
* Licensed under the Apache License v2.0
* http://www.apache.org/licenses/LICENSE-2.0
*
* Designed and built with all the love in the world by $mdo and $fat.
*/
// Responsive.scss
// For phone and tablet devices
// -------------------------------------------------------------
// REPEAT VARIABLES & MIXINS
// -------------------------
// Required since we compile the responsive stuff separately
@import "../mixins/mixins.scss";
@import "responsive-utilities.scss";
@import "responsive-1200px-min.scss";
@import "responsive-768px-979px.scss";
@import "responsive-767px-max.scss";
......@@ -107,13 +107,11 @@
}
.glyphicon-chevron-right {
@extend .fa;
@extend .fa-chevron-right;
}
.glyphicon-chevron-left {
@extend .fa;
@extend .fa-chevron-left;
}
......@@ -9,13 +9,15 @@
// Close icons
// --------------------------------------------------
.close {
@include opacity(20);
float: right;
font-size: 20px;
font-weight: bold;
line-height: $line-height-base;
color: $black;
text-shadow: 0 1px 0 rgba(255,255,255,1);
@include opacity(20);
&:hover,
&:focus {
color: $black;
......
......@@ -2,7 +2,7 @@
module.exports = function(grunt) {
'use strict';
grunt.registerTask('css', ['sass', 'concat:cssDark', 'concat:cssLight', 'styleguide']);
grunt.registerTask('css', ['sass', 'concat:cssDark', 'concat:cssLight', 'styleguide', 'sasslint']);
grunt.registerTask('default', [
'jscs',
'jshint',
......
module.exports = function(config) {
'use strict';
return {
options: {
bundleExec: true,
config: 'public/sass/.scss-lint.yml',
reporterOutput: null
configFile: 'public/sass/.sass-lint.yml',
},
core: {
src: ['public/sass/**/*.scss', '!public/sass/base/_normalize.scss']
}
target: [
'public/sass/*.scss',
'public/sass/components/*.scss',
]
};
};
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