diff --git a/bootstrap_subtheme_grunt/.DS_Store b/bootstrap_subtheme_grunt/.DS_Store new file mode 100644 index 0000000..489209e Binary files /dev/null and b/bootstrap_subtheme_grunt/.DS_Store differ diff --git a/bootstrap_subtheme_grunt/.bowerrc b/bootstrap_subtheme_grunt/.bowerrc new file mode 100644 index 0000000..7e5306c --- /dev/null +++ b/bootstrap_subtheme_grunt/.bowerrc @@ -0,0 +1,4 @@ +{ + "directory": "components", + "json": "bower.json" +} diff --git a/bootstrap_subtheme_grunt/Gruntfile.js b/bootstrap_subtheme_grunt/Gruntfile.js new file mode 100644 index 0000000..f8b3a40 --- /dev/null +++ b/bootstrap_subtheme_grunt/Gruntfile.js @@ -0,0 +1,217 @@ +/* jshint node: true */ + +module.exports = function(grunt) { + "use strict"; + + // Project configuration. + grunt.initConfig({ + + // Metadata. + pkg: grunt.file.readJSON('package.json'), + banner: '/**\n' + + '* <%= pkg.name %>.js v<%= pkg.version %> by @fat and @mdo\n' + + '* Copyright <%= grunt.template.today("yyyy") %> <%= pkg.author %>\n' + + '* <%= _.pluck(pkg.licenses, "url").join(", ") %>\n' + + '*/\n', + jqueryCheck: 'if (!jQuery) { throw new Error(\"Bootstrap requires jQuery\") }\n\n', + + // Task configuration. + clean: { + dist: ['dist'] + }, + + jshint: { + options: { + jshintrc: 'components/bootstrap/js/.jshintrc' + }, + gruntfile: { + src: 'Gruntfile.js' + }, + src: { + src: ['components/boostrap/js/*.js'] + }, + test: { + src: ['components/bootstrap/js/tests/unit/*.js'] + } + }, + + concat: { + options: { + banner: '<%= banner %><%= jqueryCheck %>', + stripBanners: false + }, + bootstrap: { + src: [ + 'components/bootstrap/js/transition.js', + 'components/bootstrap/js/alert.js', + 'components/bootstrap/js/button.js', + 'components/bootstrap/js/carousel.js', + 'components/bootstrap/js/collapse.js', + 'components/bootstrap/js/dropdown.js', + 'components/bootstrap/js/modal.js', + 'components/bootstrap/js/tooltip.js', + 'components/bootstrap/js/popover.js', + 'components/bootstrap/js/scrollspy.js', + 'components/bootstrap/js/tab.js', + 'components/bootstrap/js/affix.js' + ], + dest: 'js/<%= pkg.name %>.js' + } + }, + + uglify: { + options: { + banner: '<%= banner %>' + }, + bootstrap: { + src: ['<%= concat.bootstrap.dest %>'], + dest: 'js/<%= pkg.name %>.min.js' + } + }, + + recess: { + options: { + compile: true + }, + bootstrap: { + src: ['components/bootstrap/less/bootstrap.less'], + dest: 'css/style.css' + }, + min: { + options: { + compress: true + }, + src: ['components/bootstrap/less/bootstrap.less'], + dest: 'css/style.min.css' + }, + theme: { + src: ['less/theme.less'], + dest: 'dist/css/<%= pkg.name %>-theme.css' + }, + theme_min: { + options: { + compress: true + }, + src: ['less/theme.less'], + dest: 'dist/css/<%= pkg.name %>-theme.min.css' + } + }, + + copy: { + fonts: { + expand: true, + src: ["fonts/*"], + dest: 'bootstrap/dist/' + } + }, + + qunit: { + options: { + inject: 'js/tests/unit/phantom.js' + }, + files: ['js/tests/*.html'] + }, + + connect: { + server: { + options: { + port: 3000, + base: '.' + } + } + }, + + jekyll: { + docs: {} + }, + + validation: { + options: { + reset: true + }, + files: { + src: ["_gh_pages/**/*.html"] + } + }, + + watch: { + src: { + files: '<%= jshint.src.src %>', + tasks: ['jshint:src', 'qunit'] + }, + test: { + files: '<%= jshint.test.src %>', + tasks: ['jshint:test', 'qunit'] + }, + recess: { + files: 'bootstrap/less/*.less', + tasks: ['recess'] + } + } + }); + + + // These plugins provide necessary tasks. + grunt.loadNpmTasks('grunt-contrib-clean'); + grunt.loadNpmTasks('grunt-contrib-concat'); + grunt.loadNpmTasks('grunt-contrib-connect'); + grunt.loadNpmTasks('grunt-contrib-copy'); + grunt.loadNpmTasks('grunt-contrib-jshint'); + grunt.loadNpmTasks('grunt-contrib-qunit'); + grunt.loadNpmTasks('grunt-contrib-uglify'); + grunt.loadNpmTasks('grunt-contrib-watch'); + grunt.loadNpmTasks('grunt-html-validation'); + grunt.loadNpmTasks('grunt-jekyll'); + grunt.loadNpmTasks('grunt-recess'); + grunt.loadNpmTasks('browserstack-runner'); + + // Docs HTML validation task + grunt.registerTask('validate-html', ['jekyll', 'validation']); + + // Test task. + var testSubtasks = ['dist-css', 'jshint', 'qunit', 'validate-html']; + // Only run BrowserStack tests under Travis + if (process.env.TRAVIS) { + // Only run BrowserStack tests if this is a mainline commit in twbs/bootstrap, or you have your own BrowserStack key + if ((process.env.TRAVIS_REPO_SLUG === 'twbs/bootstrap' && process.env.TRAVIS_PULL_REQUEST === 'false') || process.env.TWBS_HAVE_OWN_BROWSERSTACK_KEY) { + testSubtasks.push('browserstack_runner'); + } + } + grunt.registerTask('test', testSubtasks); + + // JS distribution task. + grunt.registerTask('dist-js', ['concat', 'uglify']); + + // CSS distribution task. + grunt.registerTask('dist-css', ['recess']); + + // Fonts distribution task. + grunt.registerTask('dist-fonts', ['copy']); + + // Full distribution task. + grunt.registerTask('dist', ['clean', 'dist-css', 'dist-fonts', 'dist-js']); + + // Default task. + grunt.registerTask('default', ['test', 'dist', 'build-customizer']); + + // task for building customizer + grunt.registerTask('build-customizer', 'Add scripts/less files to customizer.', function () { + var fs = require('fs') + + function getFiles(type) { + var files = {} + fs.readdirSync(type) + .filter(function (path) { + return type == 'fonts' ? true : new RegExp('\\.' + type + '$').test(path) + }) + .forEach(function (path) { + return files[path] = fs.readFileSync(type + '/' + path, 'utf8') + }) + return 'var __' + type + ' = ' + JSON.stringify(files) + '\n' + } + + var customize = fs.readFileSync('customize.html', 'utf-8') + var files = getFiles('js') + getFiles('less') + getFiles('fonts') + fs.writeFileSync('assets/js/raw-files.js', files) + }); +}; \ No newline at end of file diff --git a/bootstrap_subtheme_grunt/README.txt b/bootstrap_subtheme_grunt/README.txt new file mode 100644 index 0000000..3342373 --- /dev/null +++ b/bootstrap_subtheme_grunt/README.txt @@ -0,0 +1,121 @@ +# Bootstrap grunt + +This is a documenation for this sub-theme using grunt + bower. +Bootstrap grunt is an opinionated subtheme to the +[https://drupal.org/project/bootstrap](drupal bootstrap project) and putting +grunt and bower in good use. + +### Goal and focus: +The goal of this sub-theme to ease package management for theme developers and +give them the control to choose which processor port of twitter bootstrap +they would want to use. + +*Examples*: + +* [Bootstrap stylus](https://github.com/D1plo1d/bootstrap-stylus) +* [Bootstrap sass](https://github.com/thomas-mcdonald/bootstrap-sass) + +### The use of Grunt: + +* Local pre-processor for LESS, SASS or stylus utilising node. +* Livereload support ( tested in a local installation ). +* Giving you control over which instance of bootstrap you would want to + install. Whether it be LESS, SASS och stylus. All this using node as your + local processor. + +### The use of bower: + +* For you to configure necessary dependencies and their versions that are + necessary for your theme. + +### Future development: + +* Nothing will happen until you actually test this and give me your feedback! +* I'm open to your ideas on what you would want in this sub-theme, since you + are the main user of this theme. +* Implement support for Sass and stylus compilers "out of the box". + +# Installation + +### The checklist: + +* .starter file edited and changed to .info +* NodeJS is installed. +* [Grunt](http://gruntjs.com/) (grunt, grunt-cli) is installed. +* [Bower](http://bower.io/) is installed. + +Run the following commands to install the dependencies you need to make use of +this theme. + +* `npm install` +* `bower install` + + +the `bower install` command has a requirement of jQuery, so it comes along +when you run this. Since (drupal) bootstrap is using drupals internal jQuery +version, feel free to delete the jQuery folder. + +Better yet, run this command instead: `bower install && rm -r components/jquery` + +Now your theme is ready almost ready to be used. + +# Configure First: + +### Making use of livereload ( local installation ): + +* Add the following script in your `` + `` +* Uncomment the following code in the `Gruntfile.js` + +``` + // ------------------------ + // , options : { + // livereload : true + // } + // ------------------------ +``` + +# Initiate + +* Build - grunt + +Run grunt to run tests locally and compile the CSS and JavaScript into /dist. Uses recess and UglifyJS. + +* Only compile CSS and JavaScript - grunt dist + +grunt dist creates the /dist directory with compiled files. Uses recess and UglifyJS. + +* Tests - grunt test + +Runs JSHint and QUnit tests headlessly in PhantomJS (used for CI). +* Watch - grunt watch + +This is a convenience method for watching just Less files and automatically building them whenever you save. + +### The good stuff: + +* Now you can lint on the fly as you hack in your js code. +* No need to prefixes paths when you @import from the bootstrap source, make + good use of `paths` in the `Gruntfile.js`. + +### Recommendation: + +* Keep `components/css` and `components/less` where they are. Moving them else- + where may result in wrong path targeting bootstrap sprites. + You can work around this by overriding bootstrap source. +* Use prefixes in your less files. This is to avoid colliding with the bootstrap + source files. + +# Distributing within your team: + +When you are distributing in your team, it would be best if you +add the following files in your .gitignore file: + +``` +components/bootstrap +components/jquery +node_modules +*.swp +``` + +The `*.swp` is optional to add in your gitignore. diff --git a/bootstrap_subtheme_grunt/bootstrap_grunt.starter b/bootstrap_subtheme_grunt/bootstrap_grunt.starter new file mode 100644 index 0000000..8adffb9 --- /dev/null +++ b/bootstrap_subtheme_grunt/bootstrap_grunt.starter @@ -0,0 +1,27 @@ +name = Test Grunt +description = A Bootstrap Sub-theme Using Grunt +core = 7.x +base theme = bootstrap + +; Regions +regions[navigation] = 'Navigation' +regions[header] = 'Top Bar' +regions[highlighted] = 'Highlighted' +regions[help] = 'Help' +regions[content] = 'Content' +regions[sidebar_first] = 'Primary' +regions[sidebar_second] = 'Secondary' +regions[footer] = 'Footer' + +; Stylesheets +stylesheets[all][] = css/style.css + +; ;;;;;;;;;;;;;;;;;;;;; +; ;; Scripts +; ;;;;;;;;;;;;;;;;;;;;; +; +scripts[] = 'js/bootstrap_grunt.js' + +; +; Disable BootstrapCDN if using Bootstrap source files in your sub-theme. +settings[bootstrap_cdn] = '' diff --git a/bootstrap_subtheme_grunt/bower.json b/bootstrap_subtheme_grunt/bower.json new file mode 100644 index 0000000..69270fb --- /dev/null +++ b/bootstrap_subtheme_grunt/bower.json @@ -0,0 +1,14 @@ +{ + "name": "bootstrap_grunt", + "version": "0.0.1", + "main": "css/style.css", + "dependencies": { + "bootstrap": "~3.0.0" + }, + "ignore": [ + "**/.*", + "node_modules", + "components/bootstrap", + "components/jquery" + ] +} diff --git a/bootstrap_subtheme_grunt/components/.DS_Store b/bootstrap_subtheme_grunt/components/.DS_Store new file mode 100644 index 0000000..e1ef27d Binary files /dev/null and b/bootstrap_subtheme_grunt/components/.DS_Store differ diff --git a/bootstrap_subtheme_grunt/components/less/main_bootstrap.less b/bootstrap_subtheme_grunt/components/less/main_bootstrap.less new file mode 100644 index 0000000..363c504 --- /dev/null +++ b/bootstrap_subtheme_grunt/components/less/main_bootstrap.less @@ -0,0 +1,58 @@ +// The caveat with this is that overiding files and files with the same name as +// the bootstrap framework needs to be either prefixed or suffixed. +// I'm not entirely sure that it is a bad thing. +@import "main_variables.less"; + +// Imports from bootstrap! +// No need to prefix paths, that is taken care of by grunt. +@import "mixins.less"; + +// CSS Reset +@import "reset.less"; + +// Grid system and page structure +@import "scaffolding.less"; +@import "grid.less"; +@import "layouts.less"; + +// Base CSS +@import "type.less"; +@import "code.less"; +@import "forms.less"; +@import "tables.less"; + +// Components: common +@import "sprites.less"; +@import "dropdowns.less"; +@import "wells.less"; +@import "component-animations.less"; +@import "close.less"; + +// Components: Buttons & Alerts +@import "buttons.less"; +@import "button-groups.less"; +@import "alerts.less"; // Note: alerts share common CSS with buttons and thus have styles in buttons.less + +// Components: Nav +@import "navs.less"; +@import "navbar.less"; +@import "breadcrumbs.less"; +@import "pagination.less"; +@import "pager.less"; + +// Components: Popovers +@import "modals.less"; +@import "tooltip.less"; +@import "popovers.less"; + +// Components: Misc +@import "thumbnails.less"; +@import "media.less"; +@import "labels-badges.less"; +@import "progress-bars.less"; +@import "accordion.less"; +@import "carousel.less"; +@import "hero-unit.less"; + +// Utility classes +@import "utilities.less"; diff --git a/bootstrap_subtheme_grunt/components/less/main_overrides.less b/bootstrap_subtheme_grunt/components/less/main_overrides.less new file mode 100644 index 0000000..0f9d727 --- /dev/null +++ b/bootstrap_subtheme_grunt/components/less/main_overrides.less @@ -0,0 +1,338 @@ +// Bootstrap variables. +@import 'main_variables.less'; + +// Media query variables. +@mobile: ~"(max-width: 767px)"; +@tablet: ~"(min-width: 768px) and (max-width: 979px)"; +@normal: ~"(min-width: 980px) and (max-width: 1199px)"; +@wide: ~"(min-width: 1200px)"; + +// Border Radius +.border-radius(@radius) { + -webkit-border-radius: @radius; + -moz-border-radius: @radius; + border-radius: @radius; +} +// Drop shadows. +.box-shadow(@shadow) { + -webkit-box-shadow: @shadow; + -moz-box-shadow: @shadow; + box-shadow: @shadow; +} +// Box sizing. +.box-sizing(@boxmodel) { + -webkit-box-sizing: @boxmodel; + -moz-box-sizing: @boxmodel; + box-sizing: @boxmodel; +} + +html { + &.overlay-open .navbar-fixed-top { + z-index: 400; + } + &.js { + // Collapsible fieldsets. + fieldset.collapsed { + height: auto; + } + // Throbbers. + input.form-autocomplete { + background-position: 100% 8px; /* LTR */ + background-repeat: no-repeat; + } + input.throbbing { + background-position: 100% -13px; /* LTR */ + } + } +} +body { + // Bootstrap manually sets line heights, this should be relative (em) to the + // font size, not manually set. + &, h1, h2, h3, h4, h5, h6 { + line-height: 1.25em; + } + @media @mobile { + // Fix horizontal scrolling on iOS devices. + // http://drupal.org/node/1870076 + position: relative; + } + @media @normal, @wide { + padding-top: 60px; + } + // Core admin toolbar. + &.toolbar .navbar-fixed-top { + top: 30px; + } + &.toolbar-drawer .navbar-fixed-top { + top: 65px; + } + &.admin-expanded.admin-vertical.admin-nw .navbar, + &.admin-expanded.admin-vertical.admin-sw .navbar { + margin-left: 260px; + } + div#admin-toolbar { + z-index: 500; + } + @media @normal, @wide { + &.toolbar { + padding-top: 94px !important; + } + &.toolbar-drawer { + padding-top: 129px !important; + } + } + // Admin_menu toolbar. + #admin-menu { + .box-shadow(none); + margin: 0; + padding: 0; + position: fixed; + z-index: 1100; + .dropdown li { + line-height: normal; + } + } + &.admin-menu { + html & { + margin-top: 28px !important; + } + .navbar-fixed-top { + top: 28px; + } + } +} +.footer { + margin-top: 45px; + padding: 35px 0 36px; + border-top: 1px solid #E5E5E5; +} + +// Element invisible fix +.element-invisible { + margin: 0; + padding: 0; + width: 1px; +} + +// Branding. +.navbar .logo { + margin-top: 5px; + margin-right: 10px; +} +#site-name { + line-height: 1; + margin: 0; +} + +// Page header. +.page-header { + margin-top: 0; +} + +// Blocks +.block { + h2.block-title { + margin-top: 0; + } +} + +// Search form. +form#search-block-form { + margin: 0; +} +.navbar #block-search-form { + float: right; + margin: 5px 0 5px 5px; + @media @mobile, @tablet { + float: none; + } +} +fieldset.search-advanced { + padding-bottom: 1.5em; + margin-top: 1em; +} +.navbar-search .control-group { + margin-bottom:0px; +} + +// Action Links +ul.action-links { + margin-bottom: 2em; + li { + display: inline; + padding-right: 1.5em; + } + [class^="icon-"], [class*=" icon-"] { + padding-right: 0.5em; + } +} + +// Form elements. +input, textarea, select, .uneditable-input { + max-width: 100%; + width: auto; +} +select, textarea, input[type="text"], input[type="password"], input[type="datetime"], input[type="datetime-local"], input[type="date"], input[type="month"], input[type="time"], input[type="week"], input[type="number"], input[type="email"], input[type="url"], input[type="search"], input[type="tel"], input[type="color"], .uneditable-input { + .box-sizing(border-box); + height: auto; +} +input.error { + color: @errorText; + border-color: @errorBorder; +} +.form-type-checkbox input, .form-type-radio input { + float: left; +} +.form-actions{ + clear: both; +} +.resizable-textarea textarea { + .border-radius(~"4px 4px 0 0"); +} +.help-block, .control-group .help-inline { + color: @placeholderText; + font-size: 12px; + margin: -8px 0 10px; + padding: 0 3px; + .description + &, + .checkbox + &, + .form-type-checkbox + &, + .form-type-radio + &, + .form-file + &, + .resizable-textarea + & { + margin-top: 0; + } +} + +.input-append { + .box-sizing(border-box); + padding-right: 40px; + width: 100%; + input, textarea, select, .uneditable-input { + width: 100% !important; + } +} + +// Inline containers. +.container-inline div, .container-inline label { + display: block; +} + +// Error containers. +div.error, +table tr.error { + background-color: @errorBackground; + color: @errorText; +} +.control-group.error { + background: none; + label, .control-label { + color: @errorText; + font-weight: 600; + } + input, textarea, select, .uneditable-input { + color: @errorText; + border: 1px solid @inputBorder; + } + .help-block, .help-inline { + color: @placeholderText; + } +} + +// Lists +ul li.collapsed, +ul li.expanded, +ul li.leaf { + list-style: none; + list-style-image: none; +} + +// Vertical tabs. +.vertical-tabs { + .form-type-textfield input { + .box-sizing(inherit); + width: auto; + } + .form-item{ + margin: 1em 0; + } +} + +// Submitted +.submitted { + margin-bottom: 1em; + font-style: italic; + font-weight: normal; + color: #777; +} + +// Password strength indicator. +.password-strength { + width: 17em; + float: right; /* LTR */ + margin-top: 1.4em; +} +.password-strength-title { + display: inline; +} +.password-strength-text { + float: right; /* LTR */ + font-weight: bold; +} +.password-indicator { + background-color: darken(@grayLighter, 2%); + height: 0.3em; + width: 100%; + div { + height: 100%; + width: 0%; + background-color: @green; + } +} +input.password-confirm, +input.password-field { + width: 16em; + margin-bottom: 0.4em; +} +div.password-confirm { + float: right; /* LTR */ + margin-top: 1.5em; + visibility: hidden; + width: 17em; +} +div.form-item div.password-suggestions { + padding: 0.2em 0.5em; + margin: 0.7em 0; + width: 38.5em; + border: 1px solid #B4B4B4; +} +div.password-suggestions ul { + margin-bottom: 0; +} +.confirm-parent, +.password-parent { + clear: left; /* LTR */ + margin: 0; + width: 36.3em; +} + +// Progress bar. +.progress-wrapper .progress { + margin-bottom: 10px; + .bar { + border: 0 none; + margin: 0; + } +} + +// Views AJAX pager. +.pagination ul > li > a { + &.progress-disabled { + float: left; + } + .throbber { + margin: 0 -0.25em 0 0.5em; + position: relative; + top: 1px; + } +} diff --git a/bootstrap_subtheme_grunt/components/less/main_responsive.less b/bootstrap_subtheme_grunt/components/less/main_responsive.less new file mode 100644 index 0000000..cd073fd --- /dev/null +++ b/bootstrap_subtheme_grunt/components/less/main_responsive.less @@ -0,0 +1,37 @@ +// Responsive.less +// For phone and tablet devices +// ------------------------------------------------------------- + + +// REPEAT VARIABLES & MIXINS +// ------------------------- +// Required since we compile the responsive stuff separately + +@import "main_variables.less"; // Modify this for custom colors, font-sizes, etc +@import "mixins.less"; + + +// RESPONSIVE CLASSES +// ------------------ + +@import "responsive-utilities.less"; + + +// MEDIA QUERIES +// ------------------ + +// Large desktops +@import "responsive-1200px-min.less"; + +// Tablets to regular desktops +@import "responsive-768px-979px.less"; + +// Phones to portrait tablets and narrow desktops +@import "responsive-767px-max.less"; + + +// RESPONSIVE NAVBAR +// ------------------ + +// From 979px and below, show a button to toggle navbar contents +@import "responsive-navbar.less"; diff --git a/bootstrap_subtheme_grunt/components/less/main_variables.less b/bootstrap_subtheme_grunt/components/less/main_variables.less new file mode 100644 index 0000000..6788b7e --- /dev/null +++ b/bootstrap_subtheme_grunt/components/less/main_variables.less @@ -0,0 +1,301 @@ +// +// Variables +// -------------------------------------------------- + + +// Global values +// -------------------------------------------------- + + +// Grays +// ------------------------- +@black: #000; +@grayDarker: #222; +@grayDark: #333; +@gray: #555; +@grayLight: #999; +@grayLighter: #eee; +@white: #fff; + + +// Accent colors +// ------------------------- +@blue: #049cdb; +@blueDark: #0064cd; +@green: #46a546; +@red: #9d261d; +@yellow: #ffc40d; +@orange: #f89406; +@pink: #c3325f; +@purple: #7a43b6; + + +// Scaffolding +// ------------------------- +@bodyBackground: @white; +@textColor: @grayDark; + + +// Links +// ------------------------- +@linkColor: #08c; +@linkColorHover: darken(@linkColor, 15%); + + +// Typography +// ------------------------- +@sansFontFamily: "Helvetica Neue", Helvetica, Arial, sans-serif; +@serifFontFamily: Georgia, "Times New Roman", Times, serif; +@monoFontFamily: Monaco, Menlo, Consolas, "Courier New", monospace; + +@baseFontSize: 14px; +@baseFontFamily: @sansFontFamily; +@baseLineHeight: 20px; +@altFontFamily: @serifFontFamily; + +@headingsFontFamily: inherit; // empty to use BS default, @baseFontFamily +@headingsFontWeight: bold; // instead of browser default, bold +@headingsColor: inherit; // empty to use BS default, @textColor + + +// Component sizing +// ------------------------- +// Based on 14px font-size and 20px line-height + +@fontSizeLarge: @baseFontSize * 1.25; // ~18px +@fontSizeSmall: @baseFontSize * 0.85; // ~12px +@fontSizeMini: @baseFontSize * 0.75; // ~11px + +@paddingLarge: 11px 19px; // 44px +@paddingSmall: 2px 10px; // 26px +@paddingMini: 0 6px; // 22px + +@baseBorderRadius: 4px; +@borderRadiusLarge: 6px; +@borderRadiusSmall: 3px; + + +// Tables +// ------------------------- +@tableBackground: transparent; // overall background-color +@tableBackgroundAccent: #f9f9f9; // for striping +@tableBackgroundHover: #f5f5f5; // for hover +@tableBorder: #ddd; // table and cell border + +// Buttons +// ------------------------- +@btnBackground: @white; +@btnBackgroundHighlight: darken(@white, 10%); +@btnBorder: #ccc; + +@btnPrimaryBackground: @linkColor; +@btnPrimaryBackgroundHighlight: spin(@btnPrimaryBackground, 20%); + +@btnInfoBackground: #5bc0de; +@btnInfoBackgroundHighlight: #2f96b4; + +@btnSuccessBackground: #62c462; +@btnSuccessBackgroundHighlight: #51a351; + +@btnWarningBackground: lighten(@orange, 15%); +@btnWarningBackgroundHighlight: @orange; + +@btnDangerBackground: #ee5f5b; +@btnDangerBackgroundHighlight: #bd362f; + +@btnInverseBackground: #444; +@btnInverseBackgroundHighlight: @grayDarker; + + +// Forms +// ------------------------- +@inputBackground: @white; +@inputBorder: #ccc; +@inputBorderRadius: @baseBorderRadius; +@inputDisabledBackground: @grayLighter; +@formActionsBackground: #f5f5f5; +@inputHeight: @baseLineHeight + 10px; // base line-height + 8px vertical padding + 2px top/bottom border + + +// Dropdowns +// ------------------------- +@dropdownBackground: @white; +@dropdownBorder: rgba(0,0,0,.2); +@dropdownDividerTop: #e5e5e5; +@dropdownDividerBottom: @white; + +@dropdownLinkColor: @grayDark; +@dropdownLinkColorHover: @white; +@dropdownLinkColorActive: @white; + +@dropdownLinkBackgroundActive: @linkColor; +@dropdownLinkBackgroundHover: @dropdownLinkBackgroundActive; + + + +// COMPONENT VARIABLES +// -------------------------------------------------- + + +// Z-index master list +// ------------------------- +// Used for a bird's eye view of components dependent on the z-axis +// Try to avoid customizing these :) +@zindexDropdown: 1000; +@zindexPopover: 1010; +@zindexTooltip: 1030; +@zindexFixedNavbar: 1030; +@zindexModalBackdrop: 1040; +@zindexModal: 1050; + + +// Sprite icons path +// ------------------------- +@iconSpritePath: "../bootstrap/img/glyphicons-halflings.png"; +@iconWhiteSpritePath: "../bootstrap/img/glyphicons-halflings-white.png"; + + +// Input placeholder text color +// ------------------------- +@placeholderText: @grayLight; + + +// Hr border color +// ------------------------- +@hrBorder: @grayLighter; + + +// Horizontal forms & lists +// ------------------------- +@horizontalComponentOffset: 180px; + + +// Wells +// ------------------------- +@wellBackground: #f5f5f5; + + +// Navbar +// ------------------------- +@navbarCollapseWidth: 979px; +@navbarCollapseDesktopWidth: @navbarCollapseWidth + 1; + +@navbarHeight: 40px; +@navbarBackgroundHighlight: #ffffff; +@navbarBackground: darken(@navbarBackgroundHighlight, 5%); +@navbarBorder: darken(@navbarBackground, 12%); + +@navbarText: #777; +@navbarLinkColor: #777; +@navbarLinkColorHover: @grayDark; +@navbarLinkColorActive: @gray; +@navbarLinkBackgroundHover: transparent; +@navbarLinkBackgroundActive: darken(@navbarBackground, 5%); + +@navbarBrandColor: @navbarLinkColor; + +// Inverted navbar +@navbarInverseBackground: #111111; +@navbarInverseBackgroundHighlight: #222222; +@navbarInverseBorder: #252525; + +@navbarInverseText: @grayLight; +@navbarInverseLinkColor: @grayLight; +@navbarInverseLinkColorHover: @white; +@navbarInverseLinkColorActive: @navbarInverseLinkColorHover; +@navbarInverseLinkBackgroundHover: transparent; +@navbarInverseLinkBackgroundActive: @navbarInverseBackground; + +@navbarInverseSearchBackground: lighten(@navbarInverseBackground, 25%); +@navbarInverseSearchBackgroundFocus: @white; +@navbarInverseSearchBorder: @navbarInverseBackground; +@navbarInverseSearchPlaceholderColor: #ccc; + +@navbarInverseBrandColor: @navbarInverseLinkColor; + + +// Pagination +// ------------------------- +@paginationBackground: #fff; +@paginationBorder: #ddd; +@paginationActiveBackground: #f5f5f5; + + +// Hero unit +// ------------------------- +@heroUnitBackground: @grayLighter; +@heroUnitHeadingColor: inherit; +@heroUnitLeadColor: inherit; + + +// Form states and alerts +// ------------------------- +@warningText: #c09853; +@warningBackground: #fcf8e3; +@warningBorder: darken(spin(@warningBackground, -10), 3%); + +@errorText: #b94a48; +@errorBackground: #f2dede; +@errorBorder: darken(spin(@errorBackground, -10), 3%); + +@successText: #468847; +@successBackground: #dff0d8; +@successBorder: darken(spin(@successBackground, -10), 5%); + +@infoText: #3a87ad; +@infoBackground: #d9edf7; +@infoBorder: darken(spin(@infoBackground, -10), 7%); + + +// Tooltips and popovers +// ------------------------- +@tooltipColor: #fff; +@tooltipBackground: #000; +@tooltipArrowWidth: 5px; +@tooltipArrowColor: @tooltipBackground; + +@popoverBackground: #fff; +@popoverArrowWidth: 10px; +@popoverArrowColor: #fff; +@popoverTitleBackground: darken(@popoverBackground, 3%); + +// Special enhancement for popovers +@popoverArrowOuterWidth: @popoverArrowWidth + 1; +@popoverArrowOuterColor: rgba(0,0,0,.25); + + + +// GRID +// -------------------------------------------------- + + +// Default 940px grid +// ------------------------- +@gridColumns: 12; +@gridColumnWidth: 60px; +@gridGutterWidth: 20px; +@gridRowWidth: (@gridColumns * @gridColumnWidth) + (@gridGutterWidth * (@gridColumns - 1)); + +// 1200px min +@gridColumnWidth1200: 70px; +@gridGutterWidth1200: 30px; +@gridRowWidth1200: (@gridColumns * @gridColumnWidth1200) + (@gridGutterWidth1200 * (@gridColumns - 1)); + +// 768px-979px +@gridColumnWidth768: 42px; +@gridGutterWidth768: 20px; +@gridRowWidth768: (@gridColumns * @gridColumnWidth768) + (@gridGutterWidth768 * (@gridColumns - 1)); + + +// Fluid grid +// ------------------------- +@fluidGridColumnWidth: percentage(@gridColumnWidth/@gridRowWidth); +@fluidGridGutterWidth: percentage(@gridGutterWidth/@gridRowWidth); + +// 1200px min +@fluidGridColumnWidth1200: percentage(@gridColumnWidth1200/@gridRowWidth1200); +@fluidGridGutterWidth1200: percentage(@gridGutterWidth1200/@gridRowWidth1200); + +// 768px-979px +@fluidGridColumnWidth768: percentage(@gridColumnWidth768/@gridRowWidth768); +@fluidGridGutterWidth768: percentage(@gridGutterWidth768/@gridRowWidth768); diff --git a/bootstrap_subtheme_grunt/components/less/style.less b/bootstrap_subtheme_grunt/components/less/style.less new file mode 100644 index 0000000..9949d17 --- /dev/null +++ b/bootstrap_subtheme_grunt/components/less/style.less @@ -0,0 +1,14 @@ +// Media query variables. +@mobile: ~"(max-width: 767px)"; +@tablet: ~"(min-width: 768px) and (max-width: 979px)"; +@normal: ~"(min-width: 980px) and (max-width: 1199px)"; +@wide: ~"(min-width: 1200px)"; + +// Bootstrap library. +@import 'main_bootstrap.less'; +@import 'main_responsive.less'; + +// Base-theme overrides. +@import 'main_overrides.less'; + +// Theme specific. diff --git a/bootstrap_subtheme_grunt/logo.png b/bootstrap_subtheme_grunt/logo.png new file mode 100644 index 0000000..462877d Binary files /dev/null and b/bootstrap_subtheme_grunt/logo.png differ diff --git a/bootstrap_subtheme_grunt/package.json b/bootstrap_subtheme_grunt/package.json new file mode 100644 index 0000000..5017691 --- /dev/null +++ b/bootstrap_subtheme_grunt/package.json @@ -0,0 +1,36 @@ +{ + "name": "bootstrap_grunt", + "version": "0.0.1", + "description": "A sub-theme to the drupal-bootstrap project making more use of Grunt and bower as part of the workflow", + "main": "Gruntfile.js", + "dependencies": { + }, + "devDependencies": { + "grunt": "~0.4.1" + , "grunt-contrib-clean": "~0.5.0" + , "grunt-contrib-connect": "~0.3.0" + , "grunt-contrib-concat": "~0.3.0" + , "grunt-contrib-copy": "~0.4.0" + , "grunt-contrib-jshint": "~0.6.0" + , "grunt-contrib-uglify": "~0.2.2" + , "grunt-contrib-qunit": "~0.2.2" + , "grunt-contrib-watch": "~0.5.1" + , "grunt-html-validation": "git://github.com/praveenvijayan/grunt-html-validation.git" + , "grunt-jekyll": "~0.3.8" + , "grunt-recess": "~0.3.3" + , "browserstack-runner": "~0.0.11" + + }, + "scripts": { + "test": "echo \"Error: no test specified\" && exit 1" + }, + "repository": "", + "keywords": [ + "Sub-theme", + "drupal", + "bootstrap" + ], + "author": "Adnan Asani. Melissa McEwen.", + "license": "GNU", + "readmeFilename": "README.txt" +} diff --git a/bootstrap_subtheme_grunt/screenshot.png b/bootstrap_subtheme_grunt/screenshot.png new file mode 100644 index 0000000..568cf56 Binary files /dev/null and b/bootstrap_subtheme_grunt/screenshot.png differ diff --git a/bootstrap_subtheme_grunt/template.php b/bootstrap_subtheme_grunt/template.php new file mode 100755 index 0000000..6b2b8c5 --- /dev/null +++ b/bootstrap_subtheme_grunt/template.php @@ -0,0 +1,5 @@ +