diff --git a/_config.yml b/_config.yml index 943b138..e4e900b 100644 --- a/_config.yml +++ b/_config.yml @@ -6,11 +6,18 @@ highlighter: rouge permalink: pretty # Setup -title: Simpson Lab Blog -tagline: 'SimpsonLab blog' -description: 'A blog for the Simpson Lab at the Ontario Institute for Cancer Research' -url: simpsonlab.github.io -baseurl: / +title: Simpson Lab Webpage +tagline: 'SimpsonLab Webpage' +description: 'Simpson Lab at the Ontario Institute for Cancer Research' +baseurl: "" +url: "" + +include: + - .htaccess + - _pages + +sass: + sass_dir: _sass author: name: 'Jared Simpson' @@ -22,10 +29,6 @@ paginate: 5 version: 1.0 markdown: kramdown -pages_list: - About: '/about' - Archive: '/archive' - authors: jared: display_name: Jared Simpson diff --git a/_data/courselist.yml b/_data/courselist.yml new file mode 100644 index 0000000..c0f6c0e --- /dev/null +++ b/_data/courselist.yml @@ -0,0 +1,22 @@ +- title: "Algorithms for Genome Sequence Analysis" + term: 2016 Fall + type: course + link: + url: https://jts.github.io/csc2417/ + display: "CSC 2417" + +- title: "Informatics on High-throughput Sequencing Data" + term: 2014-2017 + type: cbw + link: + url: https://bioinformatics.ca/workshops + display: "CBW" + +- title: "Bioinformatics for Cancer Genomics" + term: 2013-2017 + type: cbw + link: + url: https://bioinformatics.ca/workshops + display: "CBW" + + diff --git a/_data/pub_links.tsv b/_data/pub_links.tsv new file mode 100644 index 0000000..ba9e094 --- /dev/null +++ b/_data/pub_links.tsv @@ -0,0 +1,30 @@ +"Epidemic establishment and cryptic transmission of Zika virus in Brazil and the Americas" http://biorxiv.org/content/early/2017/02/02/105171 +"De novo genome and transcriptome assembly of the Canadian beaver (Castor canadensis)" http://www.g3journal.org/content/early/2017/01/13/g3.116.038208.1 +"Multiplex PCR method for MinION and Illumina sequencing of Zika and other virus genomes directly from clinical samples" http://biorxiv.org/content/early/2017/01/09/098913 +"A renewed model of pancreatic cancer evolution based on genomic rearrangement patterns" http://www.nature.com/nature/journal/v538/n7625/full/nature19823.html +"Evaluation of GRCh38 and de novo haploid genome assemblies demonstrates the enduring quality of the reference assembly" http://biorxiv.org/content/early/2016/08/30/072116 +"Using reference-free compressed data structures to analyse sequencing reads from thousands of human genomes" http://genome.cshlp.org/content/27/2/300.abstract +"A global reference for human genetic variation" http://www.nature.com/nature/journal/v526/n7571/full/nature15393.html +"trio-sga: facilitating de novo assembly of highly heterozygous genomes with parent-child trios" http://biorxiv.org/content/early/2016/05/03/051516 +"Detecting DNA Methylation using the Oxford Nanopore Technologies MinION sequencer" http://www.nature.com/nmeth/journal/vaop/ncurrent/full/nmeth.4184.html +"Nanocall: an open source basecaller for Oxford Nanopore sequencing data" https://academic.oup.com/bioinformatics/article/33/1/49/2525680/Nanocall-an-open-source-basecaller-for-Oxford +"Real-time, portable genome sequencing for Ebola surveillance" http://www.nature.com/nature/journal/v530/n7589/full/nature16996.html +"A comprehensive assessment of somatic mutation detection in cancer using whole-genome sequencing" http://www.nature.com/articles/ncomms10001 +"MinION Analysis and Reference Consortium: Phase 1 data release and analysis" https://f1000research.com/articles/4-1075/v1 +"The khmer software package: enabling efficient nucleotide sequence analysis" https://f1000research.com/articles/4-900/v1 +"A complete bacterial genome assembled de novo using only nanopore sequencing data" http://www.nature.com/nmeth/journal/v12/n8/full/nmeth.3444.html +"The genomic and phenotypic diversity of Schizosaccharomyces pombe" http://www.nature.com/ng/journal/v47/n3/full/ng.3215.html +"The theory and practice of genome sequence assembly" http://www.annualreviews.org/doi/abs/10.1146/annurev-genom-090314-050032?journalCode=genom +"A high-definition view of functional genetic variation from natural yeast genomes" https://academic.oup.com/mbe/article/31/4/872/1103434/A-High-Definition-View-of-Functional-Genetic +"Exploring genome characteristics and sequence quality without a reference" https://academic.oup.com/bioinformatics/article-lookup/doi/10.1093/bioinformatics/btu023 +"Assemblathon 2: evaluating de novo methods of genome assembly in three vertebrate species" https://gigascience.biomedcentral.com/articles/10.1186/2047-217X-2-10 +"Insights into hominid evolution from the gorilla genome sequence" http://www.nature.com/nature/journal/v483/n7388/full/nature10842.html +"Efficient de novo assembly of large genomes using compressed data structures" http://genome.cshlp.org/content/early/2011/12/07/gr.126953.111 +"Assemblathon 1: a competitive assessment of de novo short read assembly methods" http://genome.cshlp.org/content/early/2011/09/16/gr.126599.111.abstract +"Trait variation in yeast is defined by population history" http://journals.plos.org/plosgenetics/article?id=10.1371/journal.pgen.1002111 +"Copy number variant detection in inbred strains from short read sequence data" https://academic.oup.com/bioinformatics/article-lookup/doi/10.1093/bioinformatics/btp693 +"Revealing the genetic structure of a trait by sequencing a population under selection" http://genome.cshlp.org/content/21/7/1131.full +"Efficient construction of an assembly string graph using the FM-index" https://academic.oup.com/bioinformatics/article/26/12/i367/286190/Efficient-construction-of-an-assembly-string-graph +"Deep short-read sequencing of chromosome 17 from the mouse strains A/J and CAST/Ei identifies significant germline variation and candidate genes that regulate liver triglyceride levels" https://genomebiology.biomedcentral.com/articles/10.1186/gb-2009-10-10-r112 +"Complex landscapes of somatic rearrangement in human breast cancer genomes" http://www.nature.com/nature/journal/v462/n7276/full/nature08645.html +"ABySS: a parallel assembler for short read sequence data" http://genome.cshlp.org/content/19/6/1117 diff --git a/_data/publist.yml b/_data/publist.yml new file mode 100644 index 0000000..dc555ce --- /dev/null +++ b/_data/publist.yml @@ -0,0 +1,240 @@ +- title: "Detecting DNA Methylation using the Oxford Nanopore Technologies MinION sequencer" + authors: Jared T Simpson, Rachael Workman, Philip C Zuzarte, Matei David, Lewis Jonathan Dursi, Winston Timp + year: 2017 + preprint: 0 + link: + url: http://www.nature.com/nmeth/journal/vaop/ncurrent/full/nmeth.4184.html + display: "Nature Methods" + +- title: "Epidemic establishment and cryptic transmission of Zika virus in Brazil and the Americas" + authors: Nuno R Faria, Josh Quick, Ingra Morales, Julien Theze, Jacqueline G de Jesus, Marta Giovanetti, Moritz UG Kraemer, Sarah C Hill et al. + year: 2017 + preprint: 1 + link: + url: http://biorxiv.org/content/early/2017/02/02/105171 + display: "bioRxiv" + +- title: "De novo genome and transcriptome assembly of the Canadian beaver (Castor canadensis)" + authors: Si Lok, Tara A Paton, Zhuozhi Wang, Gaganjot Kaur, Susan Walker, Ryan KC Yuen, Wilson WL Sung, Joseph Whitney et al. + year: 2017 + preprint: 0 + link: + url: http://www.g3journal.org/content/early/2017/01/13/g3.116.038208.1 + display: "G3: Genes, Genomes, Genetics" + +- title: "Multiplex PCR method for MinION and Illumina sequencing of Zika and other virus genomes directly from clinical samples" + authors: Joshua Quick, Nathan D Grubaugh, Steven T Pullan, Ingra M Claro, Andrew D Smith, Karthik Gangavarapu, Glenn Oliveira, Refugio Robles-Sikisaka et al. + year: 2017 + preprint: 1 + link: + url: http://biorxiv.org/content/early/2017/01/09/098913 + display: "bioRxiv" + +- title: "A renewed model of pancreatic cancer evolution based on genomic rearrangement patterns" + authors: Faiyaz Notta, Michelle Chan-Seng-Yue, Mathieu Lemire, Yilong Li, Gavin W Wilson, Ashton A Connor, Robert E Denroche, Sheng-Ben Liang et al. + year: 2016 + preprint: 0 + link: + url: http://www.nature.com/nature/journal/v538/n7625/full/nature19823.html + display: "Nature" + +- title: "Evaluation of GRCh38 and de novo haploid genome assemblies demonstrates the enduring quality of the reference assembly" + authors: Valerie A Schneider, Tina Graves Lindsay, Kerstin Howe, Nathan Bouk, Hsiu-Chuan Chen, Paul A Kitts, Terence D Murphy, Kim D Pruitt et al. + year: 2016 + preprint: 1 + link: + url: http://biorxiv.org/content/early/2016/08/30/072116 + display: "bioRxiv" + +- title: "Using reference-free compressed data structures to analyse sequencing reads from thousands of human genomes" + authors: Dirk-Dominic Dolle, Zhicheng Liu, Matthew L Cotten, Jared T Simpson, Zamin Iqbal, Richard Durbin, Shane A McCarthy, Thomas M Keane + year: 2016 + preprint: 0 + link: + url: http://genome.cshlp.org/content/27/2/300.abstract + display: "Genome Research" + +- title: "A global reference for human genetic variation" + authors: 1000 Genomes Project Consortium et al. + year: 2015 + preprint: 0 + link: + url: http://www.nature.com/nature/journal/v526/n7571/full/nature15393.html + display: "Nature" + +- title: "trio-sga: facilitating de novo assembly of highly heterozygous genomes with parent-child trios" + authors: Milan Malinsky, Jared T Simpson, Richard Durbin + year: 2016 + preprint: 1 + link: + url: http://biorxiv.org/content/early/2016/05/03/051516 + display: "bioRxiv" + +- title: "Nanocall: an open source basecaller for Oxford Nanopore sequencing data" + authors: Matei David, Lewis Jonathan Dursi, Delia Yao, Paul C Boutros, Jared T Simpson + year: 2016 + preprint: 0 + link: + url: https://academic.oup.com/bioinformatics/article/33/1/49/2525680/Nanocall-an-open-source-basecaller-for-Oxford + display: "Bioinformatics" + +- title: "Real-time, portable genome sequencing for Ebola surveillance" + authors: Joshua Quick, Nicholas J Loman, Sophie Duraffour, Jared T Simpson, Ettore Severi, Lauren Cowley, Joseph Akoi Bore, Raymond Koundouno et al. + year: 2016 + preprint: 0 + link: + url: http://www.nature.com/nature/journal/v530/n7589/full/nature16996.html + display: "Nature" + +- title: "A comprehensive assessment of somatic mutation detection in cancer using whole-genome sequencing" + authors: Tyler S Alioto, Ivo Buchhalter, Sophia Derdak, Barbara Hutter, Matthew D Eldridge, Eivind Hovig, Lawrence E Heisler, Timothy A Beck et al. + year: 2015 + preprint: 0 + link: + url: http://www.nature.com/articles/ncomms10001 + display: "Nature communications" + +- title: "MinION Analysis and Reference Consortium: Phase 1 data release and analysis" + authors: Camilla LC Ip, Matthew Loose, John R Tyson, Mariateresa de Cesare, Bonnie L Brown, Miten Jain, Richard M Leggett, David A Eccles et al. + year: 2015 + preprint: 0 + link: + url: https://f1000research.com/articles/4-1075/v1 + display: "F1000Research" + +- title: "The khmer software package: enabling efficient nucleotide sequence analysis" + authors: Michael R Crusoe, Hussien F Alameldin, Sherine Awad, Elmar Boucher, Adam Caldwell, Reed Cartwright, Amanda Charbonneau, Bede Constantinides et al. + year: 2015 + preprint: 0 + link: + url: https://f1000research.com/articles/4-900/v1 + display: "F1000Research" + +- title: "A complete bacterial genome assembled de novo using only nanopore sequencing data" + authors: Nicholas J Loman, Joshua Quick, Jared T Simpson + year: 2015 + preprint: 0 + link: + url: http://www.nature.com/nmeth/journal/v12/n8/full/nmeth.3444.html + display: "Nature methods" + +- title: "The genomic and phenotypic diversity of Schizosaccharomyces pombe" + authors: Daniel C Jeffares, Charalampos Rallis, Adrien Rieux, Doug Speed, Martin P{ř}evorovsk{ỳ}, Tobias Mourier, Francesc X Marsellach, Zamin Iqbal et al. + year: 2015 + preprint: 0 + link: + url: http://www.nature.com/ng/journal/v47/n3/full/ng.3215.html + display: "Nature genetics" + +- title: "The theory and practice of genome sequence assembly" + authors: Jared T Simpson, Mihai Pop + year: 2015 + preprint: 0 + link: + url: http://www.annualreviews.org/doi/abs/10.1146/annurev-genom-090314-050032?journalCode=genom + display: "Annual review of genomics and human genetics" + +- title: "A high-definition view of functional genetic variation from natural yeast genomes" + authors: Anders Bergström, Jared T Simpson, Francisco Salinas, Benjamin Barré, Leopold Parts, Amin Zia, Alex N Nguyen Ba, Alan M Moses et al. + year: 2014 + preprint: 0 + link: + url: https://academic.oup.com/mbe/article/31/4/872/1103434/A-High-Definition-View-of-Functional-Genetic + display: "Molecular biology and evolution" + +- title: "Exploring genome characteristics and sequence quality without a reference" + authors: Jared T Simpson + year: 2014 + preprint: 0 + link: + url: https://academic.oup.com/bioinformatics/article-lookup/doi/10.1093/bioinformatics/btu023 + display: "Bioinformatics" + +- title: "Assemblathon 2: evaluating de novo methods of genome assembly in three vertebrate species" + authors: Keith R Bradnam, Joseph N Fass, Anton Alexandrov, Paul Baranay, Michael Bechner, Inan{ç} Birol, Sébastien Boisvert, Jarrod A Chapman et al. + year: 2013 + preprint: 0 + link: + url: https://gigascience.biomedcentral.com/articles/10.1186/2047-217X-2-10 + display: "GigaScience" + +- title: "Insights into hominid evolution from the gorilla genome sequence" + authors: Aylwyn Scally, Julien Y Dutheil, LaDeana W Hillier, Gregory E Jordan, Ian Goodhead, Javier Herrero, Asger Hobolth, Tuuli Lappalainen et al. + year: 2012 + preprint: 0 + link: + url: http://www.nature.com/nature/journal/v483/n7388/full/nature10842.html + display: "Nature" + +- title: "Efficient de novo assembly of large genomes using compressed data structures" + authors: Jared T Simpson, Richard Durbin + year: 2012 + preprint: 0 + link: + url: http://genome.cshlp.org/content/early/2011/12/07/gr.126953.111 + display: "Genome research" + +- title: "Assemblathon 1: a competitive assessment of de novo short read assembly methods" + authors: Dent Earl, Keith Bradnam, John St John, Aaron Darling, Dawei Lin, Joseph Fass, Hung On Ken Yu, Vince Buffalo et al. + year: 2011 + preprint: 0 + link: + url: http://genome.cshlp.org/content/early/2011/09/16/gr.126599.111.abstract + display: "Genome research" + +- title: "Trait variation in yeast is defined by population history" + authors: Jonas Warringer, Enikö Zörgö, Francisco A Cubillos, Amin Zia, Arne Gjuvsland, Jared T Simpson, Annabelle Forsmark, Richard Durbin et al. + year: 2011 + preprint: 0 + link: + url: http://journals.plos.org/plosgenetics/article?id=10.1371/journal.pgen.1002111 + display: "PLoS Genet" + +- title: "Copy number variant detection in inbred strains from short read sequence data" + authors: Jared T Simpson, Rebecca E McIntyre, David J Adams, Richard Durbin + year: 2010 + preprint: 0 + link: + url: https://academic.oup.com/bioinformatics/article-lookup/doi/10.1093/bioinformatics/btp693 + display: "Bioinformatics" + +- title: "Revealing the genetic structure of a trait by sequencing a population under selection" + authors: Leopold Parts, Francisco A Cubillos, Jonas Warringer, Kanika Jain, Francisco Salinas, Suzannah J Bumpstead, Mikael Molin, Amin Zia et al. + year: 2011 + preprint: 0 + link: + url: http://genome.cshlp.org/content/21/7/1131.full + display: "Genome research" + +- title: "Efficient construction of an assembly string graph using the FM-index" + authors: Jared T Simpson, Richard Durbin + year: 2010 + preprint: 0 + link: + url: https://academic.oup.com/bioinformatics/article/26/12/i367/286190/Efficient-construction-of-an-assembly-string-graph + display: "Bioinformatics" + +- title: "Deep short-read sequencing of chromosome 17 from the mouse strains A/J and CAST/Ei identifies significant germline variation and candidate genes that regulate liver triglyceride levels" + authors: Ian Sudbery, Jim Stalker, Jared T Simpson, Thomas Keane, Alistair G Rust, Matthew E Hurles, Klaudia Walter, Dee Lynch et al. + year: 2009 + preprint: 0 + link: + url: https://genomebiology.biomedcentral.com/articles/10.1186/gb-2009-10-10-r112 + display: "Genome biology" + +- title: "Complex landscapes of somatic rearrangement in human breast cancer genomes" + authors: Philip J Stephens, David J McBride, Meng-Lay Lin, Ignacio Varela, Erin D Pleasance, Jared T Simpson, Lucy A Stebbings, Catherine Leroy et al. + year: 2009 + preprint: 0 + link: + url: http://www.nature.com/nature/journal/v462/n7276/full/nature08645.html + display: "Nature" + +- title: "ABySS: a parallel assembler for short read sequence data" + authors: Jared T Simpson, Kim Wong, Shaun D Jackman, Jacqueline E Schein, Steven JM Jones, Inan{ç} Birol + year: 2009 + preprint: 0 + link: + url: http://genome.cshlp.org/content/19/6/1117 + display: "Genome research" + diff --git a/_data/team_members.yml b/_data/team_members.yml new file mode 100644 index 0000000..4d5bffe --- /dev/null +++ b/_data/team_members.yml @@ -0,0 +1,38 @@ +- name: Jared Simpson + photo: jared.png + info: Principal Investigator, started 2013 + email: jared.simpson@oicr.on.ca + github: https://github.com/jts + twitter: https://twitter.com/jaredtsimpson + number_educ: 2 + education1: PhD, University of Cambridge + education2: BSc, University of British Columbia + +- name: Matei David + photo: matei.jpg + info: Research Software Developer, started 2013 + email: matei.david@oicr.on.ca + github: github.com/mateidavid + twitter: https://twitter.com/mateidvd + number_educ: 2 + education1: PhD, University of Toronto + education2: BSc, University of Toronto + +- name: Heather Gibling + photo: heather.jpg + info: Graduate Student, started 2016 + email: heather.gibling@oicr.on.ca + github: github.com/hgibling + twitter: https://twitter.com/hgibling + number_educ: 2 + education1: MBinf, University of Guelph + education2: BSc, University of Calgary + +- name: Paul Tang + photo: paul.jpg + info: Computational Biologist, started 2016 + email: paul.tang@oicr.on.ca + github: paulswtang + twitter: 0 + number_educ: 1 + education1: BSc, McGill University diff --git a/_includes/comments.html b/_includes/comments.html deleted file mode 100644 index 7310c47..0000000 --- a/_includes/comments.html +++ /dev/null @@ -1,21 +0,0 @@ -{% if page.comments %} - -

Comments

-
- - - - -{% endif %} diff --git a/_includes/footer.html b/_includes/footer.html new file mode 100644 index 0000000..347a9df --- /dev/null +++ b/_includes/footer.html @@ -0,0 +1,24 @@ + + + + diff --git a/_includes/head.html b/_includes/head.html index 62cf3aa..b27e976 100644 --- a/_includes/head.html +++ b/_includes/head.html @@ -1,28 +1,16 @@ - + - - - - - - - {% if page.title == "Home" %} - {{ site.title }} · {{ site.tagline }} - {% else %} - {{ page.title }} · {{ site.title }} - {% endif %} - - - - - - - - - - - + + {% if page.title %}{{ page.title | escape }}{% else %}{{ site.title | escape }}{% endif %} + + + + +{% if jekyll.environment == 'production' %} +{% include google-analytics.html %} +{% endif %} + diff --git a/_includes/header.html b/_includes/header.html new file mode 100644 index 0000000..ad982d2 --- /dev/null +++ b/_includes/header.html @@ -0,0 +1,23 @@ + diff --git a/_includes/sidebar.html b/_includes/sidebar.html deleted file mode 100644 index 5ae3117..0000000 --- a/_includes/sidebar.html +++ /dev/null @@ -1,32 +0,0 @@ - diff --git a/_layouts/default.html b/_layouts/default.html index c308a4e..df89cb6 100644 --- a/_layouts/default.html +++ b/_layouts/default.html @@ -1,23 +1,20 @@ - + {% include head.html %} - {% include sidebar.html %} - -
- {{ content }} - - {% include comments.html %} + {% include header.html %} +
+
+ {{ content }} +
- - - + {% include footer.html %} - {% include google_analytics.html %} + diff --git a/_layouts/gridlay.html b/_layouts/gridlay.html new file mode 100644 index 0000000..4560794 --- /dev/null +++ b/_layouts/gridlay.html @@ -0,0 +1,6 @@ +--- +layout: default +--- +
+ {{ content }} +
diff --git a/_layouts/homelay.html b/_layouts/homelay.html new file mode 100644 index 0000000..5c64475 --- /dev/null +++ b/_layouts/homelay.html @@ -0,0 +1,9 @@ +--- +layout: default +--- + +
+

Welcome to the Simpson Lab

+ + {{ content }} +
diff --git a/_layouts/page.html b/_layouts/page.html index 4e0d4eb..ce233ad 100644 --- a/_layouts/page.html +++ b/_layouts/page.html @@ -1,8 +1,14 @@ --- layout: default --- +
-
-

{{ page.title }}

- {{ content }} -
+
+

{{ page.title }}

+
+ +
+ {{ content }} +
+ +
diff --git a/_layouts/piclay.html b/_layouts/piclay.html new file mode 100644 index 0000000..3a7ddca --- /dev/null +++ b/_layouts/piclay.html @@ -0,0 +1,7 @@ +--- +layout: default +--- + +
+ {{ content }} +
diff --git a/_layouts/post.html b/_layouts/post.html index 9bd1cfc..3a0fb52 100644 --- a/_layouts/post.html +++ b/_layouts/post.html @@ -1,31 +1,15 @@ --- layout: default --- -{% assign author = site.authors[page.author] %} -
-
-

{{ page.title }}

-

{{ author.display_name }}

- -
+
- {{ content }} -
+
+

{{ page.title }}

+ +
- +
+ {{ content }} +
+ + diff --git a/_layouts/publications.html b/_layouts/publications.html new file mode 100644 index 0000000..ac4e92c --- /dev/null +++ b/_layouts/publications.html @@ -0,0 +1,6 @@ +--- +layout: default +--- +
+ {{ content }} +
diff --git a/_layouts/research.html b/_layouts/research.html new file mode 100644 index 0000000..1fb65e7 --- /dev/null +++ b/_layouts/research.html @@ -0,0 +1,6 @@ +--- +layout: default +--- +
+ {{ content }} +
diff --git a/_layouts/team.html b/_layouts/team.html new file mode 100644 index 0000000..c17f2ce --- /dev/null +++ b/_layouts/team.html @@ -0,0 +1,7 @@ +--- +layout: default +--- +
+ {{ content }} +
+ diff --git a/_layouts/textlay.html b/_layouts/textlay.html new file mode 100644 index 0000000..a2bbf5e --- /dev/null +++ b/_layouts/textlay.html @@ -0,0 +1,6 @@ +--- +layout: default +--- +
+ {{ content }} +
diff --git a/_pages/404.md b/_pages/404.md new file mode 100755 index 0000000..4dfa484 --- /dev/null +++ b/_pages/404.md @@ -0,0 +1,10 @@ +--- +title: "Page Not Found" +layout: default +excerpt: "Page not found. Your pixels are in another canvas." +sitemap: false +permalink: /404.html +--- + +Sorry, but the page you were trying to view does not exist. + diff --git a/_pages/blog.md b/_pages/blog.md new file mode 100644 index 0000000..81d737f --- /dev/null +++ b/_pages/blog.md @@ -0,0 +1,17 @@ +--- +title: "Simpson Lab - Blog" +layout: gridlay +excerpt: "Simpson Lab -- Blog." +sitemap: false +permalink: /blog/ +--- + +## Blog Posts + +{% for post in site.posts %} + {% unless post.draft %} + * {{ post.date | date_to_string }} » [ {{ post.title }} ]({{ post.url }}) + {% endunless %} + {% endfor %} + +
diff --git a/_pages/index.md b/_pages/index.md new file mode 100644 index 0000000..2f5c00a --- /dev/null +++ b/_pages/index.md @@ -0,0 +1,13 @@ +--- +title: "Simpson Lab - Home" +layout: homelay +excerpt: "Simpson Lab - Computational Genomics." +sitemap: false +permalink: / +--- + +The Simpson Lab develops new ways to analyze biological sequence data. + +Our computational work focuses on the development of new ways of handling very large sequencing data sets, from indexing and text compression, to probabilistic modeling and inference. We make our methods freely available as open source software. + +We apply our computational methods to de novo genome assembly, cancer genomics and (most recently) infectious disease. We collaborate closely with [Nick Loman's group at the University of Birmingham](http://lab.loman.net/), [Winston Timp's lab at Johns Hopkins University](http://www.timplab.org/) and [Conrad Nieduszynski at the University of Oxford](http://www.path.ox.ac.uk/content/conrad-nieduszynski). diff --git a/_pages/publications.md b/_pages/publications.md new file mode 100644 index 0000000..e1269db --- /dev/null +++ b/_pages/publications.md @@ -0,0 +1,36 @@ +--- +title: "Simpson Lab - Publications" +layout: gridlay +excerpt: "Simpson Lab -- Publications." +sitemap: false +permalink: /publications/ +--- + +# Publications + +This list is also available on [Google Scholar](https://scholar.google.ca/citations?user=jcbxkKwAAAAJ) + +## Preprints + +{% for publi in site.data.publist %} + + {% if publi.preprint == 1 %} + {{ publi.title }}
+ {{ publi.authors }}
+ {{ publi.link.display }} ({{publi.year}}) + {% endif %} + +{% endfor %} + +## Peer Reviewed + +{% for publi in site.data.publist %} + + {% if publi.preprint == 0 %} + {{ publi.title }}
+ {{ publi.authors }}
+ {{ publi.link.display }} ({{publi.year}}) + {% endif %} + +{% endfor %} + diff --git a/_pages/teaching.md b/_pages/teaching.md new file mode 100644 index 0000000..36c7ed0 --- /dev/null +++ b/_pages/teaching.md @@ -0,0 +1,27 @@ +--- +title: "Simpson Lab - Teaching" +layout: gridlay +excerpt: "Simpson Lab -- Teaching." +sitemap: false +permalink: /teaching/ +--- + +# Teaching + +### University of Toronto Courses + +{% assign uoft_courses = site.data.courselist | where: "type", "course" %} +{% for course in uoft_courses %} + + {{ course.link.display }} ({{course.term}}) - {{ course.title }} + +{% endfor %} + +### Canadian Bioinformatics Workshops + +{% assign cbw_courses = site.data.courselist | where: "type", "cbw" %} +{% for course in cbw_courses %} + {{ course.title }} ({{course.term}}) +{% endfor %} + +
diff --git a/_pages/team.md b/_pages/team.md new file mode 100644 index 0000000..0fc220a --- /dev/null +++ b/_pages/team.md @@ -0,0 +1,82 @@ +--- +title: "Simpson Lab - Team" +layout: gridlay +excerpt: "Simpson Lab: Team members" +sitemap: false +permalink: /team/ +--- + +# Group Members + +{% assign number_printed = 0 %} +{% for member in site.data.team_members %} + +{% assign even_odd = number_printed | modulo: 2 %} + +{% if even_odd == 0 %} +
+{% endif %} + +
+ +

{{ member.name }}

+ + {% if member.twitter != 0 %} + + {% endif %} +
+ {{ member.info }}
+
    + + {% if member.number_educ == 1 %} +
  • {{ member.education1 }}
  • + {% endif %} + + {% if member.number_educ == 2 %} +
  • {{ member.education1 }}
  • +
  • {{ member.education2 }}
  • + {% endif %} + + {% if member.number_educ == 3 %} +
  • {{ member.education1 }}
  • +
  • {{ member.education2 }}
  • +
  • {{ member.education3 }}
  • + {% endif %} + + {% if member.number_educ == 4 %} +
  • {{ member.education1 }}
  • +
  • {{ member.education2 }}
  • +
  • {{ member.education3 }}
  • +
  • {{ member.education4 }}
  • + {% endif %} + +
+
+ +{% assign number_printed = number_printed | plus: 1 %} + +{% if even_odd == 1 %} +
+{% endif %} + +{% endfor %} + +{% assign even_odd = number_printed | modulo: 2 %} +{% if even_odd == 1 %} +
+{% endif %} + +## Alumni + + + + + + + + + + +
Staff
Jonathan Dursi, 2015-2016
Marina Barsky, 2013-2015
+ +
diff --git a/_plugins/markdown.rb b/_plugins/markdown.rb new file mode 100644 index 0000000..727bf40 --- /dev/null +++ b/_plugins/markdown.rb @@ -0,0 +1,23 @@ +=begin + Jekyll tag to include Markdown text from _includes directory preprocessing with Liquid. + Usage: + {% markdown %} + Dependency: + - kramdown +=end +module Jekyll + class MarkdownTag < Liquid::Tag + def initialize(tag_name, text, tokens) + super + @text = text.strip + end + require "kramdown" + def render(context) + tmpl = File.read File.join Dir.pwd, "_includes", @text + site = context.registers[:site] + tmpl = (Liquid::Template.parse tmpl).render site.site_payload + html = Kramdown::Document.new(tmpl).to_html + end + end +end +Liquid::Template.register_tag('markdown', Jekyll::MarkdownTag) diff --git a/_posts/2015-04-08-eventalign.md b/_posts/2015-04-08-eventalign.md index 7d1210f..33843b0 100644 --- a/_posts/2015-04-08-eventalign.md +++ b/_posts/2015-04-08-eventalign.md @@ -24,6 +24,7 @@ This is a simulation from an idealized nanopore sequencing process. The black do The event detection software writes the events to an HDF5 file. The raw kHz samples are typically not stored as the output files would be impractically large. Here's the table of events for this simulation: +{: .table .table-striped .table-post} | event index | mean (pA) | length (s) | | :----------: | :-------: | :--------: | | 1 | 60.3 | 0.521 | @@ -36,6 +37,7 @@ The event detection software writes the events to an HDF5 file. The raw kHz samp To help translate events into a DNA sequence, Oxford Nanopore provides a _pore model_ which describes the expected current signal for each 5-mer. The pore model is a set of 1024 normal distributions - an example might look like this: +{: .table .table-striped .table-post} | 5-mer | $$\mu_k$$ | $$\sigma_k$$ | | :----: | :-------: | :----------: | | AAAAA | 53.5 | 1.3 | diff --git a/_posts/2015-05-01-understanding-poa.md b/_posts/2015-05-01-understanding-poa.md index 4bd0aa6..576e2e8 100644 --- a/_posts/2015-05-01-understanding-poa.md +++ b/_posts/2015-05-01-understanding-poa.md @@ -119,7 +119,7 @@ A familiar diagram follows below; of those three possible moves, we take the running scores from each of those previous positions, add the score corresponding to the move, and set the score of the current position. -![Dynamic programming for string-string alignment](/assets/poa/sw-dynamicprogramming.png "Dynamic programming for string-string alignment" ) +![Dynamic programming for string-string alignment](/assets/poa/sw-dynamicprogramming.png "Dynamic programming for string-string alignment" ){:class="img-responsive"} We can calculate the scores for pairs of positions in any order we like – along rows of the matrix, columns, or minor diagonals – @@ -128,7 +128,7 @@ positions we need have already been calculated. ### String to Graph Alignment -![Dynamic programming for graph-string alignment](/assets/poa/poa-dynamicprogramming.png "Dynamic programming for graph-string alignment") +![Dynamic programming for graph-string alignment](/assets/poa/poa-dynamicprogramming.png "Dynamic programming for graph-string alignment"){:class="img-responsive"} Aligning a sequence to a DAG introduces suprisingly little complexity to the dynamic programming problem; the clever diagram in the POA paper with a dynamic diff --git a/_posts/2015-05-19-io-performance.md b/_posts/2015-05-19-io-performance.md index 00d1b00..5c6a7bb 100644 --- a/_posts/2015-05-19-io-performance.md +++ b/_posts/2015-05-19-io-performance.md @@ -10,7 +10,7 @@ Last week, [Titus Brown](http://ivory.idyll.org/blog/) asked a question on [twit This workload is a great case study for looking some of the ins and outs of I/O performance in general, and the tradeoffs between streaming and random file access in particular. The results can be a little surprising, and the exact numbers will necessarily be file system dependant: but on hard drives (and even more so on most cluster file systems), seeks will perform surprisingly poorly compared to streaming reads (the "Reservoir" approach in the plot below): -![Streaming Reads vs. Seeks](/assets/io/uncompress-seek-vs-stream.png) +![Streaming Reads vs. Seeks](/assets/io/uncompress-seek-vs-stream.png){:class="img-responsive"} and here we'll talk about why. @@ -144,7 +144,7 @@ The file handling and parsing will be significantly slower in python than it wou The primary results are shown in this plot, which we have already seen (note that both x and y scales are logarithmic): -![Streaming Reads vs. Seeks](/assets/io/uncompress-seek-vs-stream.png) +![Streaming Reads vs. Seeks](/assets/io/uncompress-seek-vs-stream.png){:class="img-responsive"} Some basic takeaways: @@ -155,7 +155,7 @@ Some basic takeaways: We also tried the same test on gzipped files directly, since Python's [gzipped file access](https://docs.python.org/2/library/gzip.html) has a seek operation you can in principle use; but this isn't really a fair test, as you can't properly `seek` through a gzipped file, you have to decompress along the way. That means the "seeking" approach is really just a streaming approach implemented much less efficiently, and we see that quite clearly: -![On gzipped files](/assets/io/gzip-seek-vs-stream.png) +![On gzipped files](/assets/io/gzip-seek-vs-stream.png){:class="img-responsive"} It was because the file was truncated that we could use gzip with seek-based sampling here at all; seek-sampling requires knowing the filesize, and the total (uncompressed) file size isn't available with a gzipped file unless the uncompressed size is less than 4GB. @@ -194,7 +194,7 @@ At those rates, both streaming and seeking workflows see a performance boost, bu Running this same test on my laptop gives results as shown below: -![SSD: Streaming Reads vs. Seeks](/assets/io/ssd.png) +![SSD: Streaming Reads vs. Seeks](/assets/io/ssd.png){:class="img-responsive"} We see that the laptop-grade hardware limits the performance of the streaming read; bandwidths (and thus the performance of the reservoir sampling) are down by about a factor of 2. On the other hand, we seem to have gained over a factor of 10 in IOPS, with approximately 3000 effective random reading IOPS. As a result, the seeking for a 0.1% sampling fraction takes a lightning-fast 2.5 seconds. diff --git a/_posts/2015-06-15-merging-sv-calls.md b/_posts/2015-06-15-merging-sv-calls.md index 7443d6e..9306c36 100644 --- a/_posts/2015-06-15-merging-sv-calls.md +++ b/_posts/2015-06-15-merging-sv-calls.md @@ -56,7 +56,7 @@ Performing the same task with structural variants (henceforth SVs) was more comp Structural variants are generally observed differently than, say, SNVs. An alignment-based method might align a read to a reference, find that the alignment unambigiously implies a mismatch, and so call an SNV, as in the top panel of the figure below; there is no question about the location of the variant. (Obviously, to call the variant with any confidence would require multiple reads, not shown in the figure for clarity.) -![Mapping SNVs vs SVs](/assets/sv/mapping-alpha.png) +![Mapping SNVs vs SVs](/assets/sv/mapping-alpha.png){:class="img-responsive"} However, a structural variant – say a translocation, as in the bottom panel of the figure – will likely be found differently. In the diagram, paired ends of a read map to two different chromosomes unambigiously, but there is ambiguity as to the location of the two breakpoints on the chromosomes which are now joined to form an new adjacency. Information from other reads will reduce the uncertainties, even to zero; but in the general case one has to handle ambiguity in location when deciding which calls to merge. @@ -81,7 +81,7 @@ A bigger challenge – not conceptually, but in terms of bookkeeping and cor The [VCF Standard](http://samtools.github.io/hts-specs/) describes two ways of describing SVs in a VCF file, of which there are numerous small variations out in the field. The second, described in somewhat more detail, is breakend notation (usually labelled with an SVTYPE=BND entry in the INFO field of a record). Before we go into this in much detail, let's look at a figure describing the possibilties: -![VCF Breakpoint meanings](/assets/sv/bkpts-alpha.png) +![VCF Breakpoint meanings](/assets/sv/bkpts-alpha.png){:class="img-responsive"} To describe a structural variant, we need more than just two positions, one per breakend. The breakends aren't just points; they can be thought of as half-intervals, (eg, the piece of Chromosome 1 leading up to position 500; or the piece of Chromsome 1 starting at and continuing from position 500), and we will need that directional information. @@ -101,6 +101,7 @@ In VCF BND notation, for consistency with other entries but perhaps somewhat con Note that the adjacency can be described equally well from either side; that is, for the purposes of identifying the new adjacency we could just as easily list 1:800 first: +{: .table .table-striped .table-post} | 500 first | 800 first | |---|---| | `1 500 . N N[1:800[` | `1 800 . N ]1:500]N` | @@ -125,6 +126,7 @@ convention is to use a "connection" field, CT, to indicate whether the 5' or the We can then translate between BND notation and translocation calls: +{: .table .table-striped} | BND | with CT INFO field | |---|---| | `1 500 . N N[1:800[` | `1 500 . N ... CHR2=1;END=800;CT='3to5'` | @@ -143,12 +145,13 @@ callers may call them using BND-style calls, or even calls, they have to In the figure below are simple examples of a deletion, an inversion, and a duplication. -![VCF Breakpoint meanings](/assets/sv/del-inv-alpha.png) +![VCF Breakpoint meanings](/assets/sv/del-inv-alpha.png){:class="img-responsive"} The deletion and duplication each generate only one novel adjacency (the 3to5 adjacency between Chr1:10 and Chr1:11 isn't novel!), wheras the inversion generates 2. Converting these into BND-style descriptions of the adjacencies follows below. +{: .table .table-striped} | Symbolic Call | As BND call(s) | |---|---| | `1 10 . N ... END=20;` | `1 10 . N N[1:21[`| diff --git a/_posts/2015-10-07-nanopolish-v0.4.0.md b/_posts/2015-10-07-nanopolish-v0.4.0.md index 6a5e746..2a9e899 100644 --- a/_posts/2015-10-07-nanopolish-v0.4.0.md +++ b/_posts/2015-10-07-nanopolish-v0.4.0.md @@ -18,6 +18,7 @@ SQK006 also brings an increase in speed - from 30bp/s (SQK005) to 70bp/s (SQK006 We were quite curious to see how well the new data performs in practice. Nick and Josh made four runs with SQK006 kits - two of native E. coli DNA and two of PCR-treated E. coli DNA to remove DNA damage, base modifications and other artefacts. I downloaded one of the native runs and one of the PCR-treated runs and used it to make a new consensus sequence for the draft assembly in our [paper](http://www.nature.com/nmeth/journal/v12/n8/full/nmeth.3444.html). As before we use dnadiff from [mummer](http://mummer.sourceforge.net/) to calculate percent identity, the number of SNPs and the number of indels with respect to the E. coli K12 reference genome. +{: .table .table-striped .table-post} | Kit, Coverage | Percent Identity | # SNPs | # Indels | | ----------------- | ---------------- | ------ | -------- | | SQK005, 29X | 99.48% | 1,343 | 22,601 | diff --git a/_posts/2015-12-18-kdtree-mapping.md b/_posts/2015-12-18-kdtree-mapping.md index 189c4a3..b5dd361 100644 --- a/_posts/2015-12-18-kdtree-mapping.md +++ b/_posts/2015-12-18-kdtree-mapping.md @@ -32,6 +32,7 @@ the pore (for the MinION devices, pore models typically use $$k$$=5 or that looks something like this: +{: .table .table-striped .table-post} | kmer | mean | std dev | | ----- | ----- | --------- | | AAAAA | 70.24 | ± 0.95 pA | @@ -45,6 +46,7 @@ go from a sequence to an expected set of signal levels from the sequencer: so, say, for the 10-base sequence AAAAACGTCC and the above 5-mer pore model we’d expect 6 events (10-5+1) that look like: +{: .table .table-striped .table-post} | event | kmer | mean | range (1$$\sigma$$)| | ------ | ----- | -------- | ---------------- | | *e1* | AAAAA | 70.2 pA | 69.3 - 71.2 pA | diff --git a/_sass/_bootstrap.scss b/_sass/_bootstrap.scss new file mode 100644 index 0000000..9babefd --- /dev/null +++ b/_sass/_bootstrap.scss @@ -0,0 +1,58 @@ +/*! + * Bootstrap v3.3.7 (http://getbootstrap.com) + * Copyright 2011-2016 Twitter, Inc. + * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE) + */ + +// Core variables and mixins +@import "bootstrap/variables"; +@import "bootstrap/mixins"; + +// Reset and dependencies +@import "bootstrap/normalize"; +@import "bootstrap/print"; +@import "bootstrap/glyphicons"; + +// Core CSS +@import "bootstrap/scaffolding"; +@import "bootstrap/type"; +@import "bootstrap/code"; +@import "bootstrap/grid"; +@import "bootstrap/tables"; +@import "bootstrap/forms"; +@import "bootstrap/buttons"; + +// Components +@import "bootstrap/component-animations"; +@import "bootstrap/dropdowns"; +@import "bootstrap/button-groups"; +@import "bootstrap/input-groups"; +@import "bootstrap/navs"; +@import "bootstrap/navbar"; +@import "bootstrap/breadcrumbs"; +@import "bootstrap/pagination"; +@import "bootstrap/pager"; +@import "bootstrap/labels"; +@import "bootstrap/badges"; +@import "bootstrap/jumbotron"; +@import "bootstrap/thumbnails"; +@import "bootstrap/alerts"; +@import "bootstrap/progress-bars"; +@import "bootstrap/media"; +@import "bootstrap/list-group"; +@import "bootstrap/panels"; +@import "bootstrap/responsive-embed"; +@import "bootstrap/wells"; +@import "bootstrap/close"; + +// Components w/ JavaScript +@import "bootstrap/modals"; +@import "bootstrap/tooltip"; +@import "bootstrap/popovers"; +@import "bootstrap/carousel"; + +// Utility classes +@import "bootstrap/utilities"; +@import "bootstrap/responsive-utilities"; +@import "bootstrap/bootswatch"; + diff --git a/_sass/bootstrap/_alerts.scss b/_sass/bootstrap/_alerts.scss new file mode 100644 index 0000000..7d1e1fd --- /dev/null +++ b/_sass/bootstrap/_alerts.scss @@ -0,0 +1,73 @@ +// +// Alerts +// -------------------------------------------------- + + +// Base styles +// ------------------------- + +.alert { + padding: $alert-padding; + margin-bottom: $line-height-computed; + border: 1px solid transparent; + border-radius: $alert-border-radius; + + // Headings for larger alerts + h4 { + margin-top: 0; + // Specified for the h4 to prevent conflicts of changing $headings-color + color: inherit; + } + + // Provide class for links that match alerts + .alert-link { + font-weight: $alert-link-font-weight; + } + + // Improve alignment and spacing of inner content + > p, + > ul { + margin-bottom: 0; + } + + > p + p { + margin-top: 5px; + } +} + +// Dismissible alerts +// +// Expand the right padding and account for the close button's positioning. + +.alert-dismissable, // The misspelled .alert-dismissable was deprecated in 3.2.0. +.alert-dismissible { + padding-right: ($alert-padding + 20); + + // Adjust close link position + .close { + position: relative; + top: -2px; + right: -21px; + color: inherit; + } +} + +// Alternate styles +// +// Generate contextual modifier classes for colorizing the alert. + +.alert-success { + @include alert-variant($alert-success-bg, $alert-success-border, $alert-success-text); +} + +.alert-info { + @include alert-variant($alert-info-bg, $alert-info-border, $alert-info-text); +} + +.alert-warning { + @include alert-variant($alert-warning-bg, $alert-warning-border, $alert-warning-text); +} + +.alert-danger { + @include alert-variant($alert-danger-bg, $alert-danger-border, $alert-danger-text); +} diff --git a/_sass/bootstrap/_badges.scss b/_sass/bootstrap/_badges.scss new file mode 100644 index 0000000..70002e0 --- /dev/null +++ b/_sass/bootstrap/_badges.scss @@ -0,0 +1,68 @@ +// +// Badges +// -------------------------------------------------- + + +// Base class +.badge { + display: inline-block; + min-width: 10px; + padding: 3px 7px; + font-size: $font-size-small; + font-weight: $badge-font-weight; + color: $badge-color; + line-height: $badge-line-height; + vertical-align: middle; + white-space: nowrap; + text-align: center; + background-color: $badge-bg; + border-radius: $badge-border-radius; + + // Empty badges collapse automatically (not available in IE8) + &:empty { + display: none; + } + + // Quick fix for badges in buttons + .btn & { + position: relative; + top: -1px; + } + + .btn-xs &, + .btn-group-xs > .btn & { + top: 0; + padding: 1px 5px; + } + + // [converter] extracted a& to a.badge + + // Account for badges in navs + .list-group-item.active > &, + .nav-pills > .active > a > & { + color: $badge-active-color; + background-color: $badge-active-bg; + } + + .list-group-item > & { + float: right; + } + + .list-group-item > & + & { + margin-right: 5px; + } + + .nav-pills > li > a > & { + margin-left: 3px; + } +} + +// Hover state, but only for links +a.badge { + &:hover, + &:focus { + color: $badge-link-hover-color; + text-decoration: none; + cursor: pointer; + } +} diff --git a/_sass/bootstrap/_bootswatch.scss b/_sass/bootstrap/_bootswatch.scss new file mode 100644 index 0000000..2d35f52 --- /dev/null +++ b/_sass/bootstrap/_bootswatch.scss @@ -0,0 +1,523 @@ +// Lumen 3.3.7 +// Bootswatch +// ----------------------------------------------------- + +$web-font-path: "https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,700,400italic" !default; +@import url($web-font-path); + +@mixin shadow($width: 4px){ + border-width: 0 1px $width 1px; +} + +// Navbar ===================================================================== + +.navbar { + @include shadow(); +} + +// Buttons ==================================================================== + +.btn { + padding: ($padding-base-vertical + 2) $padding-base-horizontal $padding-base-vertical; + @include shadow(); + font-size: 12px; + font-weight: bold; + text-transform: uppercase; + + &:hover { + margin-top: 1px; + border-bottom-width: 3px; + } + + &:active { + margin-top: 2px; + border-bottom-width: 2px; + @include box-shadow(none); + } + + &-lg, + &-group-lg > .btn { + padding: ($padding-large-vertical + 2) $padding-large-horizontal $padding-large-vertical; + line-height: 15px; + } + + &-sm, + &-group-sm > .btn { + padding: ($padding-small-vertical + 2) $padding-small-horizontal $padding-small-vertical; + } + + &-xs, + &-group-xs > .btn { + padding: ($padding-xs-vertical + 2) $padding-xs-horizontal $padding-xs-vertical; + } + + &-default:hover, + &-default:focus, + &-group.open .dropdown-toggle.btn-default { + background-color: $btn-default-bg; + border-color: $btn-default-border; + } + + &-primary:hover, + &-primary:focus, + &-group.open .dropdown-toggle.btn-primary { + background-color: $btn-primary-bg; + border-color: $btn-primary-border; + } + + &-success:hover, + &-success:focus, + &-group.open .dropdown-toggle.btn-success { + background-color: $btn-success-bg; + border-color: $btn-success-border; + } + + &-info:hover, + &-info:focus, + &-group.open .dropdown-toggle.btn-info { + background-color: $btn-info-bg; + border-color: $btn-info-border; + } + + &-warning:hover, + &-warning:focus, + &-group.open .dropdown-toggle.btn-warning { + background-color: $btn-warning-bg; + border-color: $btn-warning-border; + } + + &-danger:hover, + &-danger:focus, + &-group.open .dropdown-toggle.btn-danger { + background-color: $btn-danger-bg; + border-color: $btn-danger-border; + } + + &-group.open .dropdown-toggle { + @include box-shadow(none); + } +} + +.navbar-btn { + &:hover { + margin-top: 8px + } + + &:active { + margin-top: 9px + } + + &.btn-sm { + &:hover { + margin-top: 11px + } + + &:active { + margin-top: 12px + } + } + + &.btn-xs { + &:hover { + margin-top: 15px + } + + &:active { + margin-top: 16px + } + } +} + +.btn-group-vertical { + .btn + .btn { + &:hover { + border-top-width: 1px; + } + + &:active { + border-top-width: 2px; + } + } +} + +// Typography ================================================================= + +.text-primary, +.text-primary:hover { + color: $brand-primary; +} + +.text-success, +.text-success:hover { + color: $brand-success; +} + +.text-danger, +.text-danger:hover { + color: $brand-danger; +} + +.text-warning, +.text-warning:hover { + color: $brand-warning; +} + +.text-info, +.text-info:hover { + color: $brand-info; +} + +// Tables ===================================================================== + +table, +.table { + + a:not(.btn) { + text-decoration: underline; + } + + .dropdown-menu a { + text-decoration: none; + } + + .success, + .warning, + .danger, + .info { + color: #fff; + + a:not(.btn) { + color: #fff; + } + } + + &:not(.table-bordered) { + > thead > tr > th, + > tbody > tr > th, + > tfoot > tr > th, + > thead > tr > td, + > tbody > tr > td, + > tfoot > tr > td { + border-color: transparent; + } + } +} + +// Forms ====================================================================== + +.form-control { + @include box-shadow(inset 0 2px 0 rgba(0, 0, 0, 0.075)); +} + +label { + font-weight: normal; +} + +.has-warning { + .help-block, + .control-label, + .radio, + .checkbox, + .radio-inline, + .checkbox-inline, + &.radio label, + &.checkbox label, + &.radio-inline label, + &.checkbox-inline label, + .form-control-feedback { + color: $brand-warning; + } + + .form-control, + .form-control:focus { + border: 1px solid $brand-warning; + @include box-shadow(inset 0 2px 0 rgba(0, 0, 0, 0.075)); + } + + .input-group-addon { + border: 1px solid $brand-warning; + } +} + +.has-error { + .help-block, + .control-label, + .radio, + .checkbox, + .radio-inline, + .checkbox-inline, + &.radio label, + &.checkbox label, + &.radio-inline label, + &.checkbox-inline label, + .form-control-feedback { + color: $brand-danger; + } + + .form-control, + .form-control:focus { + border: 1px solid $brand-danger; + @include box-shadow(inset 0 2px 0 rgba(0, 0, 0, 0.075)); + } + + .input-group-addon { + border: 1px solid $brand-danger; + } +} + +.has-success { + .help-block, + .control-label, + .radio, + .checkbox, + .radio-inline, + .checkbox-inline, + &.radio label, + &.checkbox label, + &.radio-inline label, + &.checkbox-inline label, + .form-control-feedback { + color: $brand-success; + } + + .form-control, + .form-control:focus { + border: 1px solid $brand-success; + @include box-shadow(inset 0 2px 0 rgba(0, 0, 0, 0.075)); + } + + .input-group-addon { + border: 1px solid $brand-success; + } +} + +// Navs ======================================================================= + +.nav { + .open > a, + .open > a:hover, + .open > a:focus { + border-color: transparent; + } +} + +.nav-tabs { + + > li > a { + margin-top: 6px; + border-color: $navbar-default-border; + color: $gray-dark; + @include transition(all 0.2s ease-in-out); + } + + > li > a:hover, + > li > a:focus, + > li.active > a, + > li.active > a:hover, + > li.active > a:focus, + .open > a, + .open > a:hover, + .open > a:focus { + padding-bottom: ($padding-large-vertical + 3); + margin-top: 0; + } + + .open > a, + .open > a:hover, + .open > a:focus { + border-color: $navbar-default-border; + } + + > li.disabled > a:hover, + > li.disabled > a:focus { + padding-top: 10px; + padding-bottom: 10px; + margin-top: 6px; + } + + &.nav-justified > li { + vertical-align: bottom; + } +} + +.dropdown-menu { + margin-top: 0; + @include shadow(); + border-top-width: 1px; + @include box-shadow(none); +} + +.breadcrumb { + border-color: darken($breadcrumb-bg, 5%); + border-style: solid; + @include shadow(); +} + +.pagination, +.pager { + + > li > a, + > li > span { + position: relative; + top: 0; + @include shadow(); + color: $pagination-color; + font-size: 12px; + font-weight: bold; + text-transform: uppercase; + + &:hover { + top: 1px; + border-bottom-width: 3px; + } + + &:active { + top: 2px; + border-bottom-width: 2px; + } + } + + > .disabled > a, + > .disabled > span { + + &:hover { + top: 0; + @include shadow(); + } + + &:active { + top: 0; + @include shadow(); + } + } +} + +.pager { + + > li > a, + > li > span, + > .disabled > a, + > .disabled > span { + + &, + &:hover, + &:active { + border-left-width: 2px; + border-right-width: 2px; + } + } +} + +// Indicators ================================================================= + +.close { + color: #fff; + text-decoration: none; + opacity: 0.4; + + &:hover, + &:focus { + color: #fff; + opacity: 1; + } +} + +.alert { + @include shadow(); + + .alert-link { + font-weight: normal; + color: #fff; + text-decoration: underline; + } +} + +.label { + font-weight: normal; +} + +// Progress bars ============================================================== + +.progress { + border: 1px solid $navbar-default-border; + @include box-shadow(inset 0 2px 0 rgba(0, 0, 0, 0.1)); + + &-bar { + @include box-shadow(inset 0 -4px 0 rgba(0, 0, 0, 0.15)); + } +} + +// Containers ================================================================= + +.well { + border: 1px solid $navbar-default-border; + @include box-shadow(inset 0 2px 0 rgba(0, 0, 0, 0.05)); +} + +a.list-group-item { + + &.active, + &.active:hover, + &.active:focus { + border-color: $list-group-border; + } + + &-success { + &.active { + background-color: $state-success-bg; + } + + &.active:hover, + &.active:focus { + background-color: darken($state-success-bg, 5%); + } + } + + &-warning { + &.active { + background-color: $state-warning-bg; + } + + &.active:hover, + &.active:focus { + background-color: darken($state-warning-bg, 5%); + } + } + + &-danger { + &.active { + background-color: $state-danger-bg; + } + + &.active:hover, + &.active:focus { + background-color: darken($state-danger-bg, 5%); + } + } +} + +.jumbotron { + border: 1px solid $navbar-default-border; + @include box-shadow(inset 0 2px 0 rgba(0, 0, 0, 0.05)); +} + +.panel { + border: 1px solid $navbar-default-border; + @include shadow(); + + &-default { + .close { + color: $text-color; + } + } +} + +.modal { + .close { + color: $text-color; + } +} + +.popover { + color: $text-color; +} diff --git a/_sass/bootstrap/_breadcrumbs.scss b/_sass/bootstrap/_breadcrumbs.scss new file mode 100644 index 0000000..b61f0c7 --- /dev/null +++ b/_sass/bootstrap/_breadcrumbs.scss @@ -0,0 +1,28 @@ +// +// Breadcrumbs +// -------------------------------------------------- + + +.breadcrumb { + padding: $breadcrumb-padding-vertical $breadcrumb-padding-horizontal; + margin-bottom: $line-height-computed; + list-style: none; + background-color: $breadcrumb-bg; + border-radius: $border-radius-base; + + > li { + display: inline-block; + + + li:before { + // [converter] Workaround for https://github.com/sass/libsass/issues/1115 + $nbsp: "\00a0"; + content: "#{$breadcrumb-separator}#{$nbsp}"; // Unicode space added since inline-block means non-collapsing white-space + padding: 0 5px; + color: $breadcrumb-color; + } + } + + > .active { + color: $breadcrumb-active-color; + } +} diff --git a/_sass/bootstrap/_button-groups.scss b/_sass/bootstrap/_button-groups.scss new file mode 100644 index 0000000..4b385f5 --- /dev/null +++ b/_sass/bootstrap/_button-groups.scss @@ -0,0 +1,244 @@ +// +// Button groups +// -------------------------------------------------- + +// Make the div behave like a button +.btn-group, +.btn-group-vertical { + position: relative; + display: inline-block; + vertical-align: middle; // match .btn alignment given font-size hack above + > .btn { + position: relative; + float: left; + // Bring the "active" button to the front + &:hover, + &:focus, + &:active, + &.active { + z-index: 2; + } + } +} + +// Prevent double borders when buttons are next to each other +.btn-group { + .btn + .btn, + .btn + .btn-group, + .btn-group + .btn, + .btn-group + .btn-group { + margin-left: -1px; + } +} + +// Optional: Group multiple button groups together for a toolbar +.btn-toolbar { + margin-left: -5px; // Offset the first child's margin + @include clearfix; + + .btn, + .btn-group, + .input-group { + float: left; + } + > .btn, + > .btn-group, + > .input-group { + margin-left: 5px; + } +} + +.btn-group > .btn:not(:first-child):not(:last-child):not(.dropdown-toggle) { + border-radius: 0; +} + +// Set corners individual because sometimes a single button can be in a .btn-group and we need :first-child and :last-child to both match +.btn-group > .btn:first-child { + margin-left: 0; + &:not(:last-child):not(.dropdown-toggle) { + @include border-right-radius(0); + } +} +// Need .dropdown-toggle since :last-child doesn't apply, given that a .dropdown-menu is used immediately after it +.btn-group > .btn:last-child:not(:first-child), +.btn-group > .dropdown-toggle:not(:first-child) { + @include border-left-radius(0); +} + +// Custom edits for including btn-groups within btn-groups (useful for including dropdown buttons within a btn-group) +.btn-group > .btn-group { + float: left; +} +.btn-group > .btn-group:not(:first-child):not(:last-child) > .btn { + border-radius: 0; +} +.btn-group > .btn-group:first-child:not(:last-child) { + > .btn:last-child, + > .dropdown-toggle { + @include border-right-radius(0); + } +} +.btn-group > .btn-group:last-child:not(:first-child) > .btn:first-child { + @include border-left-radius(0); +} + +// On active and open, don't show outline +.btn-group .dropdown-toggle:active, +.btn-group.open .dropdown-toggle { + outline: 0; +} + + +// Sizing +// +// Remix the default button sizing classes into new ones for easier manipulation. + +.btn-group-xs > .btn { @extend .btn-xs; } +.btn-group-sm > .btn { @extend .btn-sm; } +.btn-group-lg > .btn { @extend .btn-lg; } + + +// Split button dropdowns +// ---------------------- + +// Give the line between buttons some depth +.btn-group > .btn + .dropdown-toggle { + padding-left: 8px; + padding-right: 8px; +} +.btn-group > .btn-lg + .dropdown-toggle { + padding-left: 12px; + padding-right: 12px; +} + +// The clickable button for toggling the menu +// Remove the gradient and set the same inset shadow as the :active state +.btn-group.open .dropdown-toggle { + @include box-shadow(inset 0 3px 5px rgba(0,0,0,.125)); + + // Show no shadow for `.btn-link` since it has no other button styles. + &.btn-link { + @include box-shadow(none); + } +} + + +// Reposition the caret +.btn .caret { + margin-left: 0; +} +// Carets in other button sizes +.btn-lg .caret { + border-width: $caret-width-large $caret-width-large 0; + border-bottom-width: 0; +} +// Upside down carets for .dropup +.dropup .btn-lg .caret { + border-width: 0 $caret-width-large $caret-width-large; +} + + +// Vertical button groups +// ---------------------- + +.btn-group-vertical { + > .btn, + > .btn-group, + > .btn-group > .btn { + display: block; + float: none; + width: 100%; + max-width: 100%; + } + + // Clear floats so dropdown menus can be properly placed + > .btn-group { + @include clearfix; + > .btn { + float: none; + } + } + + > .btn + .btn, + > .btn + .btn-group, + > .btn-group + .btn, + > .btn-group + .btn-group { + margin-top: -1px; + margin-left: 0; + } +} + +.btn-group-vertical > .btn { + &:not(:first-child):not(:last-child) { + border-radius: 0; + } + &:first-child:not(:last-child) { + @include border-top-radius($btn-border-radius-base); + @include border-bottom-radius(0); + } + &:last-child:not(:first-child) { + @include border-top-radius(0); + @include border-bottom-radius($btn-border-radius-base); + } +} +.btn-group-vertical > .btn-group:not(:first-child):not(:last-child) > .btn { + border-radius: 0; +} +.btn-group-vertical > .btn-group:first-child:not(:last-child) { + > .btn:last-child, + > .dropdown-toggle { + @include border-bottom-radius(0); + } +} +.btn-group-vertical > .btn-group:last-child:not(:first-child) > .btn:first-child { + @include border-top-radius(0); +} + + +// Justified button groups +// ---------------------- + +.btn-group-justified { + display: table; + width: 100%; + table-layout: fixed; + border-collapse: separate; + > .btn, + > .btn-group { + float: none; + display: table-cell; + width: 1%; + } + > .btn-group .btn { + width: 100%; + } + + > .btn-group .dropdown-menu { + left: auto; + } +} + + +// Checkbox and radio options +// +// In order to support the browser's form validation feedback, powered by the +// `required` attribute, we have to "hide" the inputs via `clip`. We cannot use +// `display: none;` or `visibility: hidden;` as that also hides the popover. +// Simply visually hiding the inputs via `opacity` would leave them clickable in +// certain cases which is prevented by using `clip` and `pointer-events`. +// This way, we ensure a DOM element is visible to position the popover from. +// +// See https://github.com/twbs/bootstrap/pull/12794 and +// https://github.com/twbs/bootstrap/pull/14559 for more information. + +[data-toggle="buttons"] { + > .btn, + > .btn-group > .btn { + input[type="radio"], + input[type="checkbox"] { + position: absolute; + clip: rect(0,0,0,0); + pointer-events: none; + } + } +} diff --git a/_sass/bootstrap/_buttons.scss b/_sass/bootstrap/_buttons.scss new file mode 100644 index 0000000..6452b70 --- /dev/null +++ b/_sass/bootstrap/_buttons.scss @@ -0,0 +1,168 @@ +// +// Buttons +// -------------------------------------------------- + + +// Base styles +// -------------------------------------------------- + +.btn { + display: inline-block; + margin-bottom: 0; // For input.btn + font-weight: $btn-font-weight; + text-align: center; + vertical-align: middle; + touch-action: manipulation; + cursor: pointer; + background-image: none; // Reset unusual Firefox-on-Android default style; see https://github.com/necolas/normalize.css/issues/214 + border: 1px solid transparent; + white-space: nowrap; + @include button-size($padding-base-vertical, $padding-base-horizontal, $font-size-base, $line-height-base, $btn-border-radius-base); + @include user-select(none); + + &, + &:active, + &.active { + &:focus, + &.focus { + @include tab-focus; + } + } + + &:hover, + &:focus, + &.focus { + color: $btn-default-color; + text-decoration: none; + } + + &:active, + &.active { + outline: 0; + background-image: none; + @include box-shadow(inset 0 3px 5px rgba(0,0,0,.125)); + } + + &.disabled, + &[disabled], + fieldset[disabled] & { + cursor: $cursor-disabled; + @include opacity(.65); + @include box-shadow(none); + } + + // [converter] extracted a& to a.btn +} + +a.btn { + &.disabled, + fieldset[disabled] & { + pointer-events: none; // Future-proof disabling of clicks on `` elements + } +} + + +// Alternate buttons +// -------------------------------------------------- + +.btn-default { + @include button-variant($btn-default-color, $btn-default-bg, $btn-default-border); +} +.btn-primary { + @include button-variant($btn-primary-color, $btn-primary-bg, $btn-primary-border); +} +// Success appears as green +.btn-success { + @include button-variant($btn-success-color, $btn-success-bg, $btn-success-border); +} +// Info appears as blue-green +.btn-info { + @include button-variant($btn-info-color, $btn-info-bg, $btn-info-border); +} +// Warning appears as orange +.btn-warning { + @include button-variant($btn-warning-color, $btn-warning-bg, $btn-warning-border); +} +// Danger and error appear as red +.btn-danger { + @include button-variant($btn-danger-color, $btn-danger-bg, $btn-danger-border); +} + + +// Link buttons +// ------------------------- + +// Make a button look and behave like a link +.btn-link { + color: $link-color; + font-weight: normal; + border-radius: 0; + + &, + &:active, + &.active, + &[disabled], + fieldset[disabled] & { + background-color: transparent; + @include box-shadow(none); + } + &, + &:hover, + &:focus, + &:active { + border-color: transparent; + } + &:hover, + &:focus { + color: $link-hover-color; + text-decoration: $link-hover-decoration; + background-color: transparent; + } + &[disabled], + fieldset[disabled] & { + &:hover, + &:focus { + color: $btn-link-disabled-color; + text-decoration: none; + } + } +} + + +// Button Sizes +// -------------------------------------------------- + +.btn-lg { + // line-height: ensure even-numbered height of button next to large input + @include button-size($padding-large-vertical, $padding-large-horizontal, $font-size-large, $line-height-large, $btn-border-radius-large); +} +.btn-sm { + // line-height: ensure proper height of button next to small input + @include button-size($padding-small-vertical, $padding-small-horizontal, $font-size-small, $line-height-small, $btn-border-radius-small); +} +.btn-xs { + @include button-size($padding-xs-vertical, $padding-xs-horizontal, $font-size-small, $line-height-small, $btn-border-radius-small); +} + + +// Block button +// -------------------------------------------------- + +.btn-block { + display: block; + width: 100%; +} + +// Vertically space out multiple block buttons +.btn-block + .btn-block { + margin-top: 5px; +} + +// Specificity overrides +input[type="submit"], +input[type="reset"], +input[type="button"] { + &.btn-block { + width: 100%; + } +} diff --git a/_sass/bootstrap/_carousel.scss b/_sass/bootstrap/_carousel.scss new file mode 100644 index 0000000..823476a --- /dev/null +++ b/_sass/bootstrap/_carousel.scss @@ -0,0 +1,270 @@ +// +// Carousel +// -------------------------------------------------- + + +// Wrapper for the slide container and indicators +.carousel { + position: relative; +} + +.carousel-inner { + position: relative; + overflow: hidden; + width: 100%; + + > .item { + display: none; + position: relative; + @include transition(.6s ease-in-out left); + + // Account for jankitude on images + > img, + > a > img { + @include img-responsive; + line-height: 1; + } + + // WebKit CSS3 transforms for supported devices + @media all and (transform-3d), (-webkit-transform-3d) { + @include transition-transform(0.6s ease-in-out); + @include backface-visibility(hidden); + @include perspective(1000px); + + &.next, + &.active.right { + @include translate3d(100%, 0, 0); + left: 0; + } + &.prev, + &.active.left { + @include translate3d(-100%, 0, 0); + left: 0; + } + &.next.left, + &.prev.right, + &.active { + @include translate3d(0, 0, 0); + left: 0; + } + } + } + + > .active, + > .next, + > .prev { + display: block; + } + + > .active { + left: 0; + } + + > .next, + > .prev { + position: absolute; + top: 0; + width: 100%; + } + + > .next { + left: 100%; + } + > .prev { + left: -100%; + } + > .next.left, + > .prev.right { + left: 0; + } + + > .active.left { + left: -100%; + } + > .active.right { + left: 100%; + } + +} + +// Left/right controls for nav +// --------------------------- + +.carousel-control { + position: absolute; + top: 0; + left: 0; + bottom: 0; + width: $carousel-control-width; + @include opacity($carousel-control-opacity); + font-size: $carousel-control-font-size; + color: $carousel-control-color; + text-align: center; + text-shadow: $carousel-text-shadow; + background-color: rgba(0, 0, 0, 0); // Fix IE9 click-thru bug + // We can't have this transition here because WebKit cancels the carousel + // animation if you trip this while in the middle of another animation. + + // Set gradients for backgrounds + &.left { + @include gradient-horizontal($start-color: rgba(0,0,0,.0001), $end-color: rgba(0,0,0,.0001)); + } + &.right { + left: auto; + right: 0; + @include gradient-horizontal($start-color: rgba(0,0,0,.0001), $end-color: rgba(0,0,0,.0001)); + } + + // Hover/focus state + &:hover, + &:focus { + outline: 0; + color: $carousel-control-color; + text-decoration: none; + @include opacity(.9); + } + + // Toggles + .icon-prev, + .icon-next, + .glyphicon-chevron-left, + .glyphicon-chevron-right { + position: absolute; + top: 50%; + margin-top: -10px; + z-index: 5; + display: inline-block; + } + .icon-prev, + .glyphicon-chevron-left { + left: 50%; + margin-left: -10px; + } + .icon-next, + .glyphicon-chevron-right { + right: 50%; + margin-right: -10px; + } + .icon-prev, + .icon-next { + width: 20px; + height: 20px; + line-height: 1; + font-family: serif; + } + + + .icon-prev { + &:before { + content: '\2039';// SINGLE LEFT-POINTING ANGLE QUOTATION MARK (U+2039) + } + } + .icon-next { + &:before { + content: '\203a';// SINGLE RIGHT-POINTING ANGLE QUOTATION MARK (U+203A) + } + } +} + +// Optional indicator pips +// +// Add an unordered list with the following class and add a list item for each +// slide your carousel holds. + +.carousel-indicators { + position: absolute; + bottom: 10px; + left: 50%; + z-index: 15; + width: 60%; + margin-left: -30%; + padding-left: 0; + list-style: none; + text-align: center; + + li { + display: inline-block; + width: 10px; + height: 10px; + margin: 1px; + text-indent: -999px; + border: 1px solid $carousel-indicator-border-color; + border-radius: 10px; + cursor: pointer; + + // IE8-9 hack for event handling + // + // Internet Explorer 8-9 does not support clicks on elements without a set + // `background-color`. We cannot use `filter` since that's not viewed as a + // background color by the browser. Thus, a hack is needed. + // See https://developer.mozilla.org/en-US/docs/Web/Events/click#Internet_Explorer + // + // For IE8, we set solid black as it doesn't support `rgba()`. For IE9, we + // set alpha transparency for the best results possible. + background-color: #000 \9; // IE8 + background-color: rgba(0,0,0,0); // IE9 + } + .active { + margin: 0; + width: 12px; + height: 12px; + background-color: $carousel-indicator-active-bg; + } +} + +// Optional captions +// ----------------------------- +// Hidden by default for smaller viewports +.carousel-caption { + position: absolute; + left: 15%; + right: 15%; + bottom: 20px; + z-index: 10; + padding-top: 20px; + padding-bottom: 20px; + color: $carousel-caption-color; + text-align: center; + text-shadow: $carousel-text-shadow; + & .btn { + text-shadow: none; // No shadow for button elements in carousel-caption + } +} + + +// Scale up controls for tablets and up +@media screen and (min-width: $screen-sm-min) { + + // Scale up the controls a smidge + .carousel-control { + .glyphicon-chevron-left, + .glyphicon-chevron-right, + .icon-prev, + .icon-next { + width: ($carousel-control-font-size * 1.5); + height: ($carousel-control-font-size * 1.5); + margin-top: ($carousel-control-font-size / -2); + font-size: ($carousel-control-font-size * 1.5); + } + .glyphicon-chevron-left, + .icon-prev { + margin-left: ($carousel-control-font-size / -2); + } + .glyphicon-chevron-right, + .icon-next { + margin-right: ($carousel-control-font-size / -2); + } + } + + // Show and left align the captions + .carousel-caption { + left: 20%; + right: 20%; + padding-bottom: 30px; + } + + // Move up the indicators + .carousel-indicators { + bottom: 20px; + } +} diff --git a/_sass/bootstrap/_close.scss b/_sass/bootstrap/_close.scss new file mode 100644 index 0000000..3b74d8a --- /dev/null +++ b/_sass/bootstrap/_close.scss @@ -0,0 +1,36 @@ +// +// Close icons +// -------------------------------------------------- + + +.close { + float: right; + font-size: ($font-size-base * 1.5); + font-weight: $close-font-weight; + line-height: 1; + color: $close-color; + text-shadow: $close-text-shadow; + @include opacity(.2); + + &:hover, + &:focus { + color: $close-color; + text-decoration: none; + cursor: pointer; + @include opacity(.5); + } + + // [converter] extracted button& to button.close +} + +// Additional properties for button version +// iOS requires the button element instead of an anchor tag. +// If you want the anchor version, it requires `href="#"`. +// See https://developer.mozilla.org/en-US/docs/Web/Events/click#Safari_Mobile +button.close { + padding: 0; + cursor: pointer; + background: transparent; + border: 0; + -webkit-appearance: none; +} diff --git a/_sass/bootstrap/_code.scss b/_sass/bootstrap/_code.scss new file mode 100644 index 0000000..caa5f06 --- /dev/null +++ b/_sass/bootstrap/_code.scss @@ -0,0 +1,69 @@ +// +// Code (inline and block) +// -------------------------------------------------- + + +// Inline and block code styles +code, +kbd, +pre, +samp { + font-family: $font-family-monospace; +} + +// Inline code +code { + padding: 2px 4px; + font-size: 90%; + color: $code-color; + background-color: $code-bg; + border-radius: $border-radius-base; +} + +// User input typically entered via keyboard +kbd { + padding: 2px 4px; + font-size: 90%; + color: $kbd-color; + background-color: $kbd-bg; + border-radius: $border-radius-small; + box-shadow: inset 0 -1px 0 rgba(0,0,0,.25); + + kbd { + padding: 0; + font-size: 100%; + font-weight: bold; + box-shadow: none; + } +} + +// Blocks of code +pre { + display: block; + padding: (($line-height-computed - 1) / 2); + margin: 0 0 ($line-height-computed / 2); + font-size: ($font-size-base - 1); // 14px to 13px + line-height: $line-height-base; + word-break: break-all; + word-wrap: break-word; + color: $pre-color; + background-color: $pre-bg; + border: 1px solid $pre-border-color; + border-radius: $border-radius-base; + + // Account for some code outputs that place code tags in pre tags + code { + padding: 0; + font-size: inherit; + color: inherit; + white-space: pre-wrap; + background-color: transparent; + border-radius: 0; + } +} + +// Enable scrollable blocks of code +.pre-scrollable { + max-height: $pre-scrollable-max-height; + overflow-y: scroll; +} diff --git a/_sass/bootstrap/_component-animations.scss b/_sass/bootstrap/_component-animations.scss new file mode 100644 index 0000000..ca3b43c --- /dev/null +++ b/_sass/bootstrap/_component-animations.scss @@ -0,0 +1,37 @@ +// +// Component animations +// -------------------------------------------------- + +// Heads up! +// +// We don't use the `.opacity()` mixin here since it causes a bug with text +// fields in IE7-8. Source: https://github.com/twbs/bootstrap/pull/3552. + +.fade { + opacity: 0; + @include transition(opacity .15s linear); + &.in { + opacity: 1; + } +} + +.collapse { + display: none; + + &.in { display: block; } + // [converter] extracted tr&.in to tr.collapse.in + // [converter] extracted tbody&.in to tbody.collapse.in +} + +tr.collapse.in { display: table-row; } + +tbody.collapse.in { display: table-row-group; } + +.collapsing { + position: relative; + height: 0; + overflow: hidden; + @include transition-property(height, visibility); + @include transition-duration(.35s); + @include transition-timing-function(ease); +} diff --git a/_sass/bootstrap/_dropdowns.scss b/_sass/bootstrap/_dropdowns.scss new file mode 100644 index 0000000..aac8459 --- /dev/null +++ b/_sass/bootstrap/_dropdowns.scss @@ -0,0 +1,216 @@ +// +// Dropdown menus +// -------------------------------------------------- + + +// Dropdown arrow/caret +.caret { + display: inline-block; + width: 0; + height: 0; + margin-left: 2px; + vertical-align: middle; + border-top: $caret-width-base dashed; + border-top: $caret-width-base solid \9; // IE8 + border-right: $caret-width-base solid transparent; + border-left: $caret-width-base solid transparent; +} + +// The dropdown wrapper (div) +.dropup, +.dropdown { + position: relative; +} + +// Prevent the focus on the dropdown toggle when closing dropdowns +.dropdown-toggle:focus { + outline: 0; +} + +// The dropdown menu (ul) +.dropdown-menu { + position: absolute; + top: 100%; + left: 0; + z-index: $zindex-dropdown; + display: none; // none by default, but block on "open" of the menu + float: left; + min-width: 160px; + padding: 5px 0; + margin: 2px 0 0; // override default ul + list-style: none; + font-size: $font-size-base; + text-align: left; // Ensures proper alignment if parent has it changed (e.g., modal footer) + background-color: $dropdown-bg; + border: 1px solid $dropdown-fallback-border; // IE8 fallback + border: 1px solid $dropdown-border; + border-radius: $border-radius-base; + @include box-shadow(0 6px 12px rgba(0,0,0,.175)); + background-clip: padding-box; + + // Aligns the dropdown menu to right + // + // Deprecated as of 3.1.0 in favor of `.dropdown-menu-[dir]` + &.pull-right { + right: 0; + left: auto; + } + + // Dividers (basically an hr) within the dropdown + .divider { + @include nav-divider($dropdown-divider-bg); + } + + // Links within the dropdown menu + > li > a { + display: block; + padding: 3px 20px; + clear: both; + font-weight: normal; + line-height: $line-height-base; + color: $dropdown-link-color; + white-space: nowrap; // prevent links from randomly breaking onto new lines + } +} + +// Hover/Focus state +.dropdown-menu > li > a { + &:hover, + &:focus { + text-decoration: none; + color: $dropdown-link-hover-color; + background-color: $dropdown-link-hover-bg; + } +} + +// Active state +.dropdown-menu > .active > a { + &, + &:hover, + &:focus { + color: $dropdown-link-active-color; + text-decoration: none; + outline: 0; + background-color: $dropdown-link-active-bg; + } +} + +// Disabled state +// +// Gray out text and ensure the hover/focus state remains gray + +.dropdown-menu > .disabled > a { + &, + &:hover, + &:focus { + color: $dropdown-link-disabled-color; + } + + // Nuke hover/focus effects + &:hover, + &:focus { + text-decoration: none; + background-color: transparent; + background-image: none; // Remove CSS gradient + @include reset-filter; + cursor: $cursor-disabled; + } +} + +// Open state for the dropdown +.open { + // Show the menu + > .dropdown-menu { + display: block; + } + + // Remove the outline when :focus is triggered + > a { + outline: 0; + } +} + +// Menu positioning +// +// Add extra class to `.dropdown-menu` to flip the alignment of the dropdown +// menu with the parent. +.dropdown-menu-right { + left: auto; // Reset the default from `.dropdown-menu` + right: 0; +} +// With v3, we enabled auto-flipping if you have a dropdown within a right +// aligned nav component. To enable the undoing of that, we provide an override +// to restore the default dropdown menu alignment. +// +// This is only for left-aligning a dropdown menu within a `.navbar-right` or +// `.pull-right` nav component. +.dropdown-menu-left { + left: 0; + right: auto; +} + +// Dropdown section headers +.dropdown-header { + display: block; + padding: 3px 20px; + font-size: $font-size-small; + line-height: $line-height-base; + color: $dropdown-header-color; + white-space: nowrap; // as with > li > a +} + +// Backdrop to catch body clicks on mobile, etc. +.dropdown-backdrop { + position: fixed; + left: 0; + right: 0; + bottom: 0; + top: 0; + z-index: ($zindex-dropdown - 10); +} + +// Right aligned dropdowns +.pull-right > .dropdown-menu { + right: 0; + left: auto; +} + +// Allow for dropdowns to go bottom up (aka, dropup-menu) +// +// Just add .dropup after the standard .dropdown class and you're set, bro. +// TODO: abstract this so that the navbar fixed styles are not placed here? + +.dropup, +.navbar-fixed-bottom .dropdown { + // Reverse the caret + .caret { + border-top: 0; + border-bottom: $caret-width-base dashed; + border-bottom: $caret-width-base solid \9; // IE8 + content: ""; + } + // Different positioning for bottom up menu + .dropdown-menu { + top: auto; + bottom: 100%; + margin-bottom: 2px; + } +} + + +// Component alignment +// +// Reiterate per navbar.less and the modified component alignment there. + +@media (min-width: $grid-float-breakpoint) { + .navbar-right { + .dropdown-menu { + right: 0; left: auto; + } + // Necessary for overrides of the default right aligned menu. + // Will remove come v4 in all likelihood. + .dropdown-menu-left { + left: 0; right: auto; + } + } +} diff --git a/_sass/bootstrap/_forms.scss b/_sass/bootstrap/_forms.scss new file mode 100644 index 0000000..ac26a6a --- /dev/null +++ b/_sass/bootstrap/_forms.scss @@ -0,0 +1,617 @@ +// +// Forms +// -------------------------------------------------- + + +// Normalize non-controls +// +// Restyle and baseline non-control form elements. + +fieldset { + padding: 0; + margin: 0; + border: 0; + // Chrome and Firefox set a `min-width: min-content;` on fieldsets, + // so we reset that to ensure it behaves more like a standard block element. + // See https://github.com/twbs/bootstrap/issues/12359. + min-width: 0; +} + +legend { + display: block; + width: 100%; + padding: 0; + margin-bottom: $line-height-computed; + font-size: ($font-size-base * 1.5); + line-height: inherit; + color: $legend-color; + border: 0; + border-bottom: 1px solid $legend-border-color; +} + +label { + display: inline-block; + max-width: 100%; // Force IE8 to wrap long content (see https://github.com/twbs/bootstrap/issues/13141) + margin-bottom: 5px; + font-weight: bold; +} + + +// Normalize form controls +// +// While most of our form styles require extra classes, some basic normalization +// is required to ensure optimum display with or without those classes to better +// address browser inconsistencies. + +// Override content-box in Normalize (* isn't specific enough) +input[type="search"] { + @include box-sizing(border-box); +} + +// Position radios and checkboxes better +input[type="radio"], +input[type="checkbox"] { + margin: 4px 0 0; + margin-top: 1px \9; // IE8-9 + line-height: normal; +} + +input[type="file"] { + display: block; +} + +// Make range inputs behave like textual form controls +input[type="range"] { + display: block; + width: 100%; +} + +// Make multiple select elements height not fixed +select[multiple], +select[size] { + height: auto; +} + +// Focus for file, radio, and checkbox +input[type="file"]:focus, +input[type="radio"]:focus, +input[type="checkbox"]:focus { + @include tab-focus; +} + +// Adjust output element +output { + display: block; + padding-top: ($padding-base-vertical + 1); + font-size: $font-size-base; + line-height: $line-height-base; + color: $input-color; +} + + +// Common form controls +// +// Shared size and type resets for form controls. Apply `.form-control` to any +// of the following form controls: +// +// 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"] + +.form-control { + display: block; + width: 100%; + height: $input-height-base; // Make inputs at least the height of their button counterpart (base line-height + padding + border) + padding: $padding-base-vertical $padding-base-horizontal; + font-size: $font-size-base; + line-height: $line-height-base; + color: $input-color; + background-color: $input-bg; + background-image: none; // Reset unusual Firefox-on-Android default style; see https://github.com/necolas/normalize.css/issues/214 + border: 1px solid $input-border; + border-radius: $input-border-radius; // Note: This has no effect on s in CSS. + @include box-shadow(inset 0 1px 1px rgba(0,0,0,.075)); + @include transition(border-color ease-in-out .15s, box-shadow ease-in-out .15s); + + // Customize the `:focus` state to imitate native WebKit styles. + @include form-control-focus; + + // Placeholder + @include placeholder; + + // Unstyle the caret on `` background color +$input-bg: #fff !default; +//** `` background color +$input-bg-disabled: $gray-lighter !default; + +//** Text color for ``s +$input-color: $gray !default; +//** `` border color +$input-border: #ccc !default; + +// TODO: Rename `$input-border-radius` to `$input-border-radius-base` in v4 +//** Default `.form-control` border radius +// This has no effect on ``s in CSS. +$input-border-radius: $border-radius-base !default; +//** Large `.form-control` border radius +$input-border-radius-large: $border-radius-large !default; +//** Small `.form-control` border radius +$input-border-radius-small: $border-radius-small !default; + +//** Border color for inputs on focus +$input-border-focus: #66afe9 !default; + +//** Placeholder text color +$input-color-placeholder: #999 !default; + +//** Default `.form-control` height +$input-height-base: ($line-height-computed + ($padding-base-vertical * 2) + 2) !default; +//** Large `.form-control` height +$input-height-large: (ceil($font-size-large * $line-height-large) + ($padding-large-vertical * 2) + 2) !default; +//** Small `.form-control` height +$input-height-small: (floor($font-size-small * $line-height-small) + ($padding-small-vertical * 2) + 2) !default; + +//** `.form-group` margin +$form-group-margin-bottom: 15px !default; + +$legend-color: $gray-dark !default; +$legend-border-color: #e5e5e5 !default; + +//** Background color for textual input addons +$input-group-addon-bg: $gray-lighter !default; +//** Border color for textual input addons +$input-group-addon-border-color: $input-border !default; + +//** Disabled cursor for form controls and buttons. +$cursor-disabled: not-allowed !default; + + +//== Dropdowns +// +//## Dropdown menu container and contents. + +//** Background for the dropdown menu. +$dropdown-bg: #fff !default; +//** Dropdown menu `border-color`. +$dropdown-border: rgba(0,0,0,.15) !default; +//** Dropdown menu `border-color` **for IE8**. +$dropdown-fallback-border: #ccc !default; +//** Divider color for between dropdown items. +$dropdown-divider-bg: #e5e5e5 !default; + +//** Dropdown link text color. +$dropdown-link-color: $gray-dark !default; +//** Hover color for dropdown links. +$dropdown-link-hover-color: darken($gray-dark, 5%) !default; +//** Hover background for dropdown links. +$dropdown-link-hover-bg: #f5f5f5 !default; + +//** Active dropdown menu item text color. +$dropdown-link-active-color: $component-active-color !default; +//** Active dropdown menu item background color. +$dropdown-link-active-bg: $component-active-bg !default; + +//** Disabled dropdown menu item background color. +$dropdown-link-disabled-color: $gray-light !default; + +//** Text color for headers within dropdown menus. +$dropdown-header-color: $gray-light !default; + +//** Deprecated `$dropdown-caret-color` as of v3.1.0 +$dropdown-caret-color: #000 !default; + + +//-- Z-index master list +// +// Warning: Avoid customizing these values. They're used for a bird's eye view +// of components dependent on the z-axis and are designed to all work together. +// +// Note: These variables are not generated into the Customizer. + +$zindex-navbar: 1000 !default; +$zindex-dropdown: 1000 !default; +$zindex-popover: 1060 !default; +$zindex-tooltip: 1070 !default; +$zindex-navbar-fixed: 1030 !default; +$zindex-modal-background: 1040 !default; +$zindex-modal: 1050 !default; + + +//== Media queries breakpoints +// +//## Define the breakpoints at which your layout will change, adapting to different screen sizes. + +// Extra small screen / phone +//** Deprecated `$screen-xs` as of v3.0.1 +$screen-xs: 480px !default; +//** Deprecated `$screen-xs-min` as of v3.2.0 +$screen-xs-min: $screen-xs !default; +//** Deprecated `$screen-phone` as of v3.0.1 +$screen-phone: $screen-xs-min !default; + +// Small screen / tablet +//** Deprecated `$screen-sm` as of v3.0.1 +$screen-sm: 768px !default; +$screen-sm-min: $screen-sm !default; +//** Deprecated `$screen-tablet` as of v3.0.1 +$screen-tablet: $screen-sm-min !default; + +// Medium screen / desktop +//** Deprecated `$screen-md` as of v3.0.1 +$screen-md: 992px !default; +$screen-md-min: $screen-md !default; +//** Deprecated `$screen-desktop` as of v3.0.1 +$screen-desktop: $screen-md-min !default; + +// Large screen / wide desktop +//** Deprecated `$screen-lg` as of v3.0.1 +$screen-lg: 1200px !default; +$screen-lg-min: $screen-lg !default; +//** Deprecated `$screen-lg-desktop` as of v3.0.1 +$screen-lg-desktop: $screen-lg-min !default; + +// So media queries don't overlap when required, provide a maximum +$screen-xs-max: ($screen-sm-min - 1) !default; +$screen-sm-max: ($screen-md-min - 1) !default; +$screen-md-max: ($screen-lg-min - 1) !default; + + +//== Grid system +// +//## Define your custom responsive grid. + +//** Number of columns in the grid. +$grid-columns: 12 !default; +//** Padding between columns. Gets divided in half for the left and right. +$grid-gutter-width: 30px !default; +// Navbar collapse +//** Point at which the navbar becomes uncollapsed. +$grid-float-breakpoint: $screen-sm-min !default; +//** Point at which the navbar begins collapsing. +$grid-float-breakpoint-max: ($grid-float-breakpoint - 1) !default; + + +//== Container sizes +// +//## Define the maximum width of `.container` for different screen sizes. + +// Small screen / tablet +$container-tablet: (720px + $grid-gutter-width) !default; +//** For `$screen-sm-min` and up. +$container-sm: $container-tablet !default; + +// Medium screen / desktop +$container-desktop: (940px + $grid-gutter-width) !default; +//** For `$screen-md-min` and up. +$container-md: $container-desktop !default; + +// Large screen / wide desktop +$container-large-desktop: (1140px + $grid-gutter-width) !default; +//** For `$screen-lg-min` and up. +$container-lg: $container-large-desktop !default; + + +//== Navbar +// +//## + +// Basics of a navbar +$navbar-height: 50px !default; +$navbar-margin-bottom: $line-height-computed !default; +$navbar-border-radius: $border-radius-base !default; +$navbar-padding-horizontal: floor(($grid-gutter-width / 2)) !default; +$navbar-padding-vertical: (($navbar-height - $line-height-computed) / 2) !default; +$navbar-collapse-max-height: 340px !default; + +$navbar-default-color: #777 !default; +$navbar-default-bg: #f8f8f8 !default; +$navbar-default-border: darken($navbar-default-bg, 6.5%) !default; + +// Navbar links +$navbar-default-link-color: #777 !default; +$navbar-default-link-hover-color: #333 !default; +$navbar-default-link-hover-bg: transparent !default; +$navbar-default-link-active-color: #555 !default; +$navbar-default-link-active-bg: darken($navbar-default-bg, 6.5%) !default; +$navbar-default-link-disabled-color: #ccc !default; +$navbar-default-link-disabled-bg: transparent !default; + +// Navbar brand label +$navbar-default-brand-color: $navbar-default-link-color !default; +$navbar-default-brand-hover-color: darken($navbar-default-brand-color, 10%) !default; +$navbar-default-brand-hover-bg: transparent !default; + +// Navbar toggle +$navbar-default-toggle-hover-bg: #ddd !default; +$navbar-default-toggle-icon-bar-bg: #888 !default; +$navbar-default-toggle-border-color: #ddd !default; + + +//=== Inverted navbar +// Reset inverted navbar basics +$navbar-inverse-color: lighten($gray-light, 15%) !default; +$navbar-inverse-bg: #222 !default; +$navbar-inverse-border: darken($navbar-inverse-bg, 10%) !default; + +// Inverted navbar links +$navbar-inverse-link-color: lighten($gray-light, 15%) !default; +$navbar-inverse-link-hover-color: #fff !default; +$navbar-inverse-link-hover-bg: transparent !default; +$navbar-inverse-link-active-color: $navbar-inverse-link-hover-color !default; +$navbar-inverse-link-active-bg: darken($navbar-inverse-bg, 10%) !default; +$navbar-inverse-link-disabled-color: #444 !default; +$navbar-inverse-link-disabled-bg: transparent !default; + +// Inverted navbar brand label +$navbar-inverse-brand-color: $navbar-inverse-link-color !default; +$navbar-inverse-brand-hover-color: #fff !default; +$navbar-inverse-brand-hover-bg: transparent !default; + +// Inverted navbar toggle +$navbar-inverse-toggle-hover-bg: #333 !default; +$navbar-inverse-toggle-icon-bar-bg: #fff !default; +$navbar-inverse-toggle-border-color: #333 !default; + + +//== Navs +// +//## + +//=== Shared nav styles +$nav-link-padding: 10px 15px !default; +$nav-link-hover-bg: $gray-lighter !default; + +$nav-disabled-link-color: $gray-light !default; +$nav-disabled-link-hover-color: $gray-light !default; + +//== Tabs +$nav-tabs-border-color: #ddd !default; + +$nav-tabs-link-hover-border-color: $gray-lighter !default; + +$nav-tabs-active-link-hover-bg: $body-bg !default; +$nav-tabs-active-link-hover-color: $gray !default; +$nav-tabs-active-link-hover-border-color: #ddd !default; + +$nav-tabs-justified-link-border-color: #ddd !default; +$nav-tabs-justified-active-link-border-color: $body-bg !default; + +//== Pills +$nav-pills-border-radius: $border-radius-base !default; +$nav-pills-active-link-hover-bg: $component-active-bg !default; +$nav-pills-active-link-hover-color: $component-active-color !default; + + +//== Pagination +// +//## + +$pagination-color: $link-color !default; +$pagination-bg: #fff !default; +$pagination-border: #ddd !default; + +$pagination-hover-color: $link-hover-color !default; +$pagination-hover-bg: $gray-lighter !default; +$pagination-hover-border: #ddd !default; + +$pagination-active-color: #fff !default; +$pagination-active-bg: $brand-primary !default; +$pagination-active-border: $brand-primary !default; + +$pagination-disabled-color: $gray-light !default; +$pagination-disabled-bg: #fff !default; +$pagination-disabled-border: #ddd !default; + + +//== Pager +// +//## + +$pager-bg: $pagination-bg !default; +$pager-border: $pagination-border !default; +$pager-border-radius: 15px !default; + +$pager-hover-bg: $pagination-hover-bg !default; + +$pager-active-bg: $pagination-active-bg !default; +$pager-active-color: $pagination-active-color !default; + +$pager-disabled-color: $pagination-disabled-color !default; + + +//== Jumbotron +// +//## + +$jumbotron-padding: 30px !default; +$jumbotron-color: inherit !default; +$jumbotron-bg: $gray-lighter !default; +$jumbotron-heading-color: inherit !default; +$jumbotron-font-size: ceil(($font-size-base * 1.5)) !default; +$jumbotron-heading-font-size: ceil(($font-size-base * 4.5)) !default; + + +//== Form states and alerts +// +//## Define colors for form feedback states and, by default, alerts. + +$state-success-text: #3c763d !default; +$state-success-bg: #dff0d8 !default; +$state-success-border: darken(adjust-hue($state-success-bg, -10), 5%) !default; + +$state-info-text: #31708f !default; +$state-info-bg: #d9edf7 !default; +$state-info-border: darken(adjust-hue($state-info-bg, -10), 7%) !default; + +$state-warning-text: #8a6d3b !default; +$state-warning-bg: #fcf8e3 !default; +$state-warning-border: darken(adjust-hue($state-warning-bg, -10), 5%) !default; + +$state-danger-text: #a94442 !default; +$state-danger-bg: #f2dede !default; +$state-danger-border: darken(adjust-hue($state-danger-bg, -10), 5%) !default; + + +//== Tooltips +// +//## + +//** Tooltip max width +$tooltip-max-width: 200px !default; +//** Tooltip text color +$tooltip-color: #fff !default; +//** Tooltip background color +$tooltip-bg: #000 !default; +$tooltip-opacity: .9 !default; + +//** Tooltip arrow width +$tooltip-arrow-width: 5px !default; +//** Tooltip arrow color +$tooltip-arrow-color: $tooltip-bg !default; + + +//== Popovers +// +//## + +//** Popover body background color +$popover-bg: #fff !default; +//** Popover maximum width +$popover-max-width: 276px !default; +//** Popover border color +$popover-border-color: rgba(0,0,0,.2) !default; +//** Popover fallback border color +$popover-fallback-border-color: #ccc !default; + +//** Popover title background color +$popover-title-bg: darken($popover-bg, 3%) !default; + +//** Popover arrow width +$popover-arrow-width: 10px !default; +//** Popover arrow color +$popover-arrow-color: $popover-bg !default; + +//** Popover outer arrow width +$popover-arrow-outer-width: ($popover-arrow-width + 1) !default; +//** Popover outer arrow color +$popover-arrow-outer-color: fade_in($popover-border-color, 0.05) !default; +//** Popover outer arrow fallback color +$popover-arrow-outer-fallback-color: darken($popover-fallback-border-color, 20%) !default; + + +//== Labels +// +//## + +//** Default label background color +$label-default-bg: $gray-light !default; +//** Primary label background color +$label-primary-bg: $brand-primary !default; +//** Success label background color +$label-success-bg: $brand-success !default; +//** Info label background color +$label-info-bg: $brand-info !default; +//** Warning label background color +$label-warning-bg: $brand-warning !default; +//** Danger label background color +$label-danger-bg: $brand-danger !default; + +//** Default label text color +$label-color: #fff !default; +//** Default text color of a linked label +$label-link-hover-color: #fff !default; + + +//== Modals +// +//## + +//** Padding applied to the modal body +$modal-inner-padding: 15px !default; + +//** Padding applied to the modal title +$modal-title-padding: 15px !default; +//** Modal title line-height +$modal-title-line-height: $line-height-base !default; + +//** Background color of modal content area +$modal-content-bg: #fff !default; +//** Modal content border color +$modal-content-border-color: rgba(0,0,0,.2) !default; +//** Modal content border color **for IE8** +$modal-content-fallback-border-color: #999 !default; + +//** Modal backdrop background color +$modal-backdrop-bg: #000 !default; +//** Modal backdrop opacity +$modal-backdrop-opacity: .5 !default; +//** Modal header border color +$modal-header-border-color: #e5e5e5 !default; +//** Modal footer border color +$modal-footer-border-color: $modal-header-border-color !default; + +$modal-lg: 900px !default; +$modal-md: 600px !default; +$modal-sm: 300px !default; + + +//== Alerts +// +//## Define alert colors, border radius, and padding. + +$alert-padding: 15px !default; +$alert-border-radius: $border-radius-base !default; +$alert-link-font-weight: bold !default; + +$alert-success-bg: $state-success-bg !default; +$alert-success-text: $state-success-text !default; +$alert-success-border: $state-success-border !default; + +$alert-info-bg: $state-info-bg !default; +$alert-info-text: $state-info-text !default; +$alert-info-border: $state-info-border !default; + +$alert-warning-bg: $state-warning-bg !default; +$alert-warning-text: $state-warning-text !default; +$alert-warning-border: $state-warning-border !default; + +$alert-danger-bg: $state-danger-bg !default; +$alert-danger-text: $state-danger-text !default; +$alert-danger-border: $state-danger-border !default; + + +//== Progress bars +// +//## + +//** Background color of the whole progress component +$progress-bg: #f5f5f5 !default; +//** Progress bar text color +$progress-bar-color: #fff !default; +//** Variable for setting rounded corners on progress bar. +$progress-border-radius: $border-radius-base !default; + +//** Default progress bar color +$progress-bar-bg: $brand-primary !default; +//** Success progress bar color +$progress-bar-success-bg: $brand-success !default; +//** Warning progress bar color +$progress-bar-warning-bg: $brand-warning !default; +//** Danger progress bar color +$progress-bar-danger-bg: $brand-danger !default; +//** Info progress bar color +$progress-bar-info-bg: $brand-info !default; + + +//== List group +// +//## + +//** Background color on `.list-group-item` +$list-group-bg: #fff !default; +//** `.list-group-item` border color +$list-group-border: #ddd !default; +//** List group border radius +$list-group-border-radius: $border-radius-base !default; + +//** Background color of single list items on hover +$list-group-hover-bg: #f5f5f5 !default; +//** Text color of active list items +$list-group-active-color: $component-active-color !default; +//** Background color of active list items +$list-group-active-bg: $component-active-bg !default; +//** Border color of active list elements +$list-group-active-border: $list-group-active-bg !default; +//** Text color for content within active list items +$list-group-active-text-color: lighten($list-group-active-bg, 40%) !default; + +//** Text color of disabled list items +$list-group-disabled-color: $gray-light !default; +//** Background color of disabled list items +$list-group-disabled-bg: $gray-lighter !default; +//** Text color for content within disabled list items +$list-group-disabled-text-color: $list-group-disabled-color !default; + +$list-group-link-color: #555 !default; +$list-group-link-hover-color: $list-group-link-color !default; +$list-group-link-heading-color: #333 !default; + + +//== Panels +// +//## + +$panel-bg: #fff !default; +$panel-body-padding: 15px !default; +$panel-heading-padding: 10px 15px !default; +$panel-footer-padding: $panel-heading-padding !default; +$panel-border-radius: $border-radius-base !default; + +//** Border color for elements within panels +$panel-inner-border: #ddd !default; +$panel-footer-bg: #f5f5f5 !default; + +$panel-default-text: $gray-dark !default; +$panel-default-border: #ddd !default; +$panel-default-heading-bg: #f5f5f5 !default; + +$panel-primary-text: #fff !default; +$panel-primary-border: $brand-primary !default; +$panel-primary-heading-bg: $brand-primary !default; + +$panel-success-text: $state-success-text !default; +$panel-success-border: $state-success-border !default; +$panel-success-heading-bg: $state-success-bg !default; + +$panel-info-text: $state-info-text !default; +$panel-info-border: $state-info-border !default; +$panel-info-heading-bg: $state-info-bg !default; + +$panel-warning-text: $state-warning-text !default; +$panel-warning-border: $state-warning-border !default; +$panel-warning-heading-bg: $state-warning-bg !default; + +$panel-danger-text: $state-danger-text !default; +$panel-danger-border: $state-danger-border !default; +$panel-danger-heading-bg: $state-danger-bg !default; + + +//== Thumbnails +// +//## + +//** Padding around the thumbnail image +$thumbnail-padding: 4px !default; +//** Thumbnail background color +$thumbnail-bg: $body-bg !default; +//** Thumbnail border color +$thumbnail-border: #ddd !default; +//** Thumbnail border radius +$thumbnail-border-radius: $border-radius-base !default; + +//** Custom text color for thumbnail captions +$thumbnail-caption-color: $text-color !default; +//** Padding around the thumbnail caption +$thumbnail-caption-padding: 9px !default; + + +//== Wells +// +//## + +$well-bg: #f5f5f5 !default; +$well-border: darken($well-bg, 7%) !default; + + +//== Badges +// +//## + +$badge-color: #fff !default; +//** Linked badge text color on hover +$badge-link-hover-color: #fff !default; +$badge-bg: $gray-light !default; + +//** Badge text color in active nav link +$badge-active-color: $link-color !default; +//** Badge background color in active nav link +$badge-active-bg: #fff !default; + +$badge-font-weight: bold !default; +$badge-line-height: 1 !default; +$badge-border-radius: 10px !default; + + +//== Breadcrumbs +// +//## + +$breadcrumb-padding-vertical: 8px !default; +$breadcrumb-padding-horizontal: 15px !default; +//** Breadcrumb background color +$breadcrumb-bg: #f5f5f5 !default; +//** Breadcrumb text color +$breadcrumb-color: #ccc !default; +//** Text color of current page in the breadcrumb +$breadcrumb-active-color: $gray-light !default; +//** Textual separator for between breadcrumb elements +$breadcrumb-separator: "/" !default; + + +//== Carousel +// +//## + +$carousel-text-shadow: 0 1px 2px rgba(0,0,0,.6) !default; + +$carousel-control-color: #fff !default; +$carousel-control-width: 15% !default; +$carousel-control-opacity: .5 !default; +$carousel-control-font-size: 20px !default; + +$carousel-indicator-active-bg: #fff !default; +$carousel-indicator-border-color: #fff !default; + +$carousel-caption-color: #fff !default; + + +//== Close +// +//## + +$close-font-weight: bold !default; +$close-color: #000 !default; +$close-text-shadow: 0 1px 0 #fff !default; + + +//== Code +// +//## + +$code-color: #c7254e !default; +$code-bg: #f9f2f4 !default; + +$kbd-color: #fff !default; +$kbd-bg: #333 !default; + +$pre-bg: #f5f5f5 !default; +$pre-color: $gray-dark !default; +$pre-border-color: #ccc !default; +$pre-scrollable-max-height: 340px !default; + + +//== Type +// +//## + +//** Horizontal offset for forms and lists. +$component-offset-horizontal: 180px !default; +//** Text muted color +$text-muted: $gray-light !default; +//** Abbreviations and acronyms border color +$abbr-border-color: $gray-light !default; +//** Headings small color +$headings-small-color: $gray-light !default; +//** Blockquote small color +$blockquote-small-color: $gray-light !default; +//** Blockquote font size +$blockquote-font-size: ($font-size-base * 1.25) !default; +//** Blockquote border color +$blockquote-border-color: $gray-lighter !default; +//** Page header border color +$page-header-border-color: $gray-lighter !default; +//** Width of horizontal description list titles +$dl-horizontal-offset: $component-offset-horizontal !default; +//** Point at which .dl-horizontal becomes horizontal +$dl-horizontal-breakpoint: $grid-float-breakpoint !default; +//** Horizontal line color. +$hr-border: $gray-lighter !default; diff --git a/_sass/bootstrap/_variables.scss b/_sass/bootstrap/_variables.scss new file mode 100644 index 0000000..26e7e3b --- /dev/null +++ b/_sass/bootstrap/_variables.scss @@ -0,0 +1,870 @@ +$bootstrap-sass-asset-helper: false !default; +// Lumen 3.3.7 +// Variables +// -------------------------------------------------- + + +//== Colors +// +//## Gray and brand colors for use across Bootstrap. + +$gray-base: #000 !default; +$gray-darker: lighten($gray-base, 13.5%) !default; // #222 +$gray-dark: lighten($gray-base, 20%) !default; // #333 +$gray: lighten($gray-base, 33.5%) !default; // #555 +$gray-light: lighten($gray-base, 60%) !default; // #999 +$gray-lighter: lighten($gray-base, 93.5%) !default; // #eee + +$brand-primary: #158CBA !default; +$brand-success: #28B62C !default; +$brand-info: #75CAEB !default; +$brand-warning: #FF851B !default; +$brand-danger: #FF4136 !default; + + +//== Scaffolding +// +//## Settings for some of the most global styles. + +//** Background color for ``. +$body-bg: #fff !default; +//** Global text color on ``. +$text-color: $gray !default; + +//** Global textual link color. +$link-color: $brand-primary !default; +//** Link hover color set via `darken()` function. +$link-hover-color: $link-color !default; +//** Link hover decoration. +$link-hover-decoration: underline !default; + + +//== Typography +// +//## Font, line-height, and color for body text, headings, and more. + +$font-family-sans-serif: "Source Sans Pro", "Helvetica Neue", Helvetica, Arial, sans-serif !default; +$font-family-serif: Georgia, "Times New Roman", Times, serif !default; +//** Default monospace fonts for ``, ``, and `
`.
+$font-family-monospace:   Menlo, Monaco, Consolas, "Courier New", monospace !default;
+$font-family-base:        $font-family-sans-serif !default;
+
+$font-size-base:          16px !default;
+$font-size-large:         ceil(($font-size-base * 1.25)) !default; // ~18px
+$font-size-small:         ceil(($font-size-base * 0.85)) !default; // ~12px
+
+$font-size-h1:            floor(($font-size-base * 2.6)) !default; // ~36px
+$font-size-h2:            floor(($font-size-base * 2.15)) !default; // ~30px
+$font-size-h3:            ceil(($font-size-base * 1.7)) !default; // ~24px
+$font-size-h4:            ceil(($font-size-base * 1.25)) !default; // ~18px
+$font-size-h5:            $font-size-base !default;
+$font-size-h6:            ceil(($font-size-base * 0.85)) !default; // ~12px
+
+//** Unit-less `line-height` for use in components like buttons.
+$line-height-base:        1.428571429 !default; // 20/14
+//** Computed "line-height" (`font-size` * `line-height`) for use with `margin`, `padding`, etc.
+$line-height-computed:    floor(($font-size-base * $line-height-base)) !default; // ~20px
+
+//** By default, this inherits from the ``.
+$headings-font-family:    inherit !default;
+$headings-font-weight:    400 !default;
+$headings-line-height:    1.1 !default;
+$headings-color:          $gray-dark !default;
+
+
+//== Iconography
+//
+//## Specify custom location and filename of the included Glyphicons icon font. Useful for those including Bootstrap via Bower.
+
+//** Load fonts from this directory.
+$icon-font-path: if($bootstrap-sass-asset-helper, "bootstrap/", "../fonts/") !default;
+//** File name for all font files.
+$icon-font-name:          "glyphicons-halflings-regular" !default;
+//** Element ID within SVG icon file.
+$icon-font-svg-id:        "glyphicons_halflingsregular" !default;
+
+
+//== Components
+//
+//## Define common padding and border radius sizes and more. Values based on 14px text and 1.428 line-height (~20px to start).
+
+$padding-base-vertical:     7px !default;
+$padding-base-horizontal:   12px !default;
+
+$padding-large-vertical:    13px !default;
+$padding-large-horizontal:  16px !default;
+
+$padding-small-vertical:    4px !default;
+$padding-small-horizontal:  10px !default;
+
+$padding-xs-vertical:       1px !default;
+$padding-xs-horizontal:     5px !default;
+
+$line-height-large:         1.3333333 !default; // extra decimals for Win 8.1 Chrome
+$line-height-small:         1.5 !default;
+
+$border-radius-base:        4px !default;
+$border-radius-large:       5px !default;
+$border-radius-small:       2px !default;
+
+//** Global color for active items (e.g., navs or dropdowns).
+$component-active-color:    #fff !default;
+//** Global background color for active items (e.g., navs or dropdowns).
+$component-active-bg:       $brand-primary !default;
+
+//** Width of the `border` for generating carets that indicate dropdowns.
+$caret-width-base:          4px !default;
+//** Carets increase slightly in size for larger components.
+$caret-width-large:         5px !default;
+
+
+//== Tables
+//
+//## Customizes the `.table` component with basic values, each used across all table variations.
+
+//** Padding for ``s and ``s.
+$table-cell-padding:            8px !default;
+//** Padding for cells in `.table-condensed`.
+$table-condensed-cell-padding:  5px !default;
+
+//** Default background color used for all tables.
+$table-bg:                      transparent !default;
+//** Background color used for `.table-striped`.
+$table-bg-accent:               #f9f9f9 !default;
+//** Background color used for `.table-hover`.
+$table-bg-hover:                #f5f5f5 !default;
+$table-bg-active:               $table-bg-hover !default;
+
+//** Border color for table and cell borders.
+$table-border-color:            $gray-lighter !default;
+
+
+//== Buttons
+//
+//## For each of Bootstrap's buttons, define text, background and border color.
+
+$btn-font-weight:                normal !default;
+
+$btn-default-color:              $gray !default;
+$btn-default-bg:                 $gray-lighter !default;
+$btn-default-border:             darken($btn-default-bg, 5%) !default;
+
+$btn-primary-color:              #fff !default;
+$btn-primary-bg:                 $brand-primary !default;
+$btn-primary-border:             darken($btn-primary-bg, 5%) !default;
+
+$btn-success-color:              #fff !default;
+$btn-success-bg:                 $brand-success !default;
+$btn-success-border:             darken($btn-success-bg, 5%) !default;
+
+$btn-info-color:                 #fff !default;
+$btn-info-bg:                    $brand-info !default;
+$btn-info-border:                darken($btn-info-bg, 5%) !default;
+
+$btn-warning-color:              #fff !default;
+$btn-warning-bg:                 $brand-warning !default;
+$btn-warning-border:             darken($btn-warning-bg, 5%) !default;
+
+$btn-danger-color:               #fff !default;
+$btn-danger-bg:                  $brand-danger !default;
+$btn-danger-border:              darken($btn-danger-bg, 5%) !default;
+
+$btn-link-disabled-color:        $gray-light !default;
+
+// Allows for customizing button radius independently from global border radius
+$btn-border-radius-base:         $border-radius-base !default;
+$btn-border-radius-large:        $border-radius-large !default;
+$btn-border-radius-small:        $border-radius-small !default;
+
+
+//== Forms
+//
+//##
+
+//** `` background color
+$input-bg:                       #fff !default;
+//** `` background color
+$input-bg-disabled:              $gray-lighter !default;
+
+//** Text color for ``s
+$input-color:                    $gray !default;
+//** `` border color
+$input-border:                   darken(#f8f8f8, 6.5%) !default;
+
+// TODO: Rename `$input-border-radius` to `$input-border-radius-base` in v4
+//** Default `.form-control` border radius
+// This has no effect on ``s in CSS.
+$input-border-radius:            $border-radius-base !default;
+//** Large `.form-control` border radius
+$input-border-radius-large:      $border-radius-large !default;
+//** Small `.form-control` border radius
+$input-border-radius-small:      $border-radius-small !default;
+
+//** Border color for inputs on focus
+$input-border-focus:             #66afe9 !default;
+
+//** Placeholder text color
+$input-color-placeholder:        $gray-light !default;
+
+//** Default `.form-control` height
+$input-height-base:              ($line-height-computed + ($padding-base-vertical * 2) + 4) !default;
+//** Large `.form-control` height
+$input-height-large:             (ceil($font-size-large * $line-height-large) + ($padding-large-vertical * 2) + 2) !default;
+//** Small `.form-control` height
+$input-height-small:             (floor($font-size-small * $line-height-small) + ($padding-small-vertical * 2) + 2) !default;
+
+//** `.form-group` margin
+$form-group-margin-bottom:       15px !default;
+
+$legend-color:                   $gray-dark !default;
+$legend-border-color:            #e5e5e5 !default;
+
+//** Background color for textual input addons
+$input-group-addon-bg:           $gray-lighter !default;
+//** Border color for textual input addons
+$input-group-addon-border-color: $input-border !default;
+
+//** Disabled cursor for form controls and buttons.
+$cursor-disabled:                not-allowed !default;
+
+
+//== Dropdowns
+//
+//## Dropdown menu container and contents.
+
+//** Background for the dropdown menu.
+$dropdown-bg:                    #fff !default;
+//** Dropdown menu `border-color`.
+$dropdown-border:                $input-border !default;
+//** Dropdown menu `border-color` **for IE8**.
+$dropdown-fallback-border:       #ccc !default;
+//** Divider color for between dropdown items.
+$dropdown-divider-bg:            $gray-lighter !default;
+
+//** Dropdown link text color.
+$dropdown-link-color:            $gray-light !default;
+//** Hover color for dropdown links.
+$dropdown-link-hover-color:      $gray-dark !default;
+//** Hover background for dropdown links.
+$dropdown-link-hover-bg:         transparent !default;
+
+//** Active dropdown menu item text color.
+$dropdown-link-active-color:     $component-active-color !default;
+//** Active dropdown menu item background color.
+$dropdown-link-active-bg:        $component-active-bg !default;
+
+//** Disabled dropdown menu item background color.
+$dropdown-link-disabled-color:   $gray-lighter !default;
+
+//** Text color for headers within dropdown menus.
+$dropdown-header-color:          $gray-light !default;
+
+//** Deprecated `$dropdown-caret-color` as of v3.1.0
+$dropdown-caret-color:           #000 !default;
+
+
+//-- Z-index master list
+//
+// Warning: Avoid customizing these values. They're used for a bird's eye view
+// of components dependent on the z-axis and are designed to all work together.
+//
+// Note: These variables are not generated into the Customizer.
+
+$zindex-navbar:            1000 !default;
+$zindex-dropdown:          1000 !default;
+$zindex-popover:           1060 !default;
+$zindex-tooltip:           1070 !default;
+$zindex-navbar-fixed:      1030 !default;
+$zindex-modal-background:  1040 !default;
+$zindex-modal:             1050 !default;
+
+
+//== Media queries breakpoints
+//
+//## Define the breakpoints at which your layout will change, adapting to different screen sizes.
+
+// Extra small screen / phone
+//** Deprecated `$screen-xs` as of v3.0.1
+$screen-xs:                  480px !default;
+//** Deprecated `$screen-xs-min` as of v3.2.0
+$screen-xs-min:              $screen-xs !default;
+//** Deprecated `$screen-phone` as of v3.0.1
+$screen-phone:               $screen-xs-min !default;
+
+// Small screen / tablet
+//** Deprecated `$screen-sm` as of v3.0.1
+$screen-sm:                  768px !default;
+$screen-sm-min:              $screen-sm !default;
+//** Deprecated `$screen-tablet` as of v3.0.1
+$screen-tablet:              $screen-sm-min !default;
+
+// Medium screen / desktop
+//** Deprecated `$screen-md` as of v3.0.1
+$screen-md:                  992px !default;
+$screen-md-min:              $screen-md !default;
+//** Deprecated `$screen-desktop` as of v3.0.1
+$screen-desktop:             $screen-md-min !default;
+
+// Large screen / wide desktop
+//** Deprecated `$screen-lg` as of v3.0.1
+$screen-lg:                  200px !default;
+$screen-lg-min:              $screen-lg !default;
+//** Deprecated `$screen-lg-desktop` as of v3.0.1
+$screen-lg-desktop:          $screen-lg-min !default;
+
+// So media queries don't overlap when required, provide a maximum
+$screen-xs-max:              ($screen-sm-min - 1) !default;
+$screen-sm-max:              ($screen-md-min - 1) !default;
+$screen-md-max:              ($screen-lg-min - 1) !default;
+
+
+//== Grid system
+//
+//## Define your custom responsive grid.
+
+//** Number of columns in the grid.
+$grid-columns:              12 !default;
+//** Padding between columns. Gets divided in half for the left and right.
+$grid-gutter-width:         30px !default;
+// Navbar collapse
+//** Point at which the navbar becomes uncollapsed.
+$grid-float-breakpoint:     $screen-sm-min !default;
+//** Point at which the navbar begins collapsing.
+$grid-float-breakpoint-max: ($grid-float-breakpoint - 1) !default;
+
+
+//== Container sizes
+//
+//## Define the maximum width of `.container` for different screen sizes.
+
+// Small screen / tablet
+$container-tablet:             (720px + $grid-gutter-width) !default;
+//** For `$screen-sm-min` and up.
+$container-sm:                 $container-tablet !default;
+
+// Medium screen / desktop
+$container-desktop:            (940px + $grid-gutter-width) !default;
+//** For `$screen-md-min` and up.
+$container-md:                 $container-desktop !default;
+
+// Large screen / wide desktop
+$container-large-desktop:      (1140px + $grid-gutter-width) !default;
+//** For `$screen-lg-min` and up.
+$container-lg:                 $container-large-desktop !default;
+
+
+//== Navbar
+//
+//##
+
+// Basics of a navbar
+$navbar-height:                    50px !default;
+$navbar-margin-bottom:             $line-height-computed !default;
+$navbar-border-radius:             $border-radius-base !default;
+$navbar-padding-horizontal:        floor(($grid-gutter-width / 2)) !default;
+$navbar-padding-vertical:          (($navbar-height - $line-height-computed) / 2) !default;
+$navbar-collapse-max-height:       340px !default;
+
+$navbar-default-color:             $text-color !default;
+$navbar-default-bg:                #f8f8f8 !default;
+$navbar-default-border:            $input-border !default;
+
+// Navbar links
+$navbar-default-link-color:                $gray-light !default;
+$navbar-default-link-hover-color:          $gray-dark !default;
+$navbar-default-link-hover-bg:             transparent !default;
+$navbar-default-link-active-color:         $navbar-default-link-hover-color !default;
+$navbar-default-link-active-bg:            transparent !default;
+$navbar-default-link-disabled-color:       $gray-lighter !default;
+$navbar-default-link-disabled-bg:          transparent !default;
+
+// Navbar brand label
+$navbar-default-brand-color:               $navbar-default-link-hover-color !default;
+$navbar-default-brand-hover-color:         $navbar-default-link-hover-color !default;
+$navbar-default-brand-hover-bg:            transparent !default;
+
+// Navbar toggle
+$navbar-default-toggle-hover-bg:           #fff !default;
+$navbar-default-toggle-icon-bar-bg:        $gray-light !default;
+$navbar-default-toggle-border-color:       $gray-lighter !default;
+
+
+//=== Inverted navbar
+// Reset inverted navbar basics
+$navbar-inverse-color:                      $gray-light !default;
+$navbar-inverse-bg:                         #fff !default;
+$navbar-inverse-border:                     darken($navbar-inverse-bg, 10%) !default;
+
+// Inverted navbar links
+$navbar-inverse-link-color:                 $gray-light !default;
+$navbar-inverse-link-hover-color:           $gray-dark !default;
+$navbar-inverse-link-hover-bg:              transparent !default;
+$navbar-inverse-link-active-color:          $navbar-inverse-link-hover-color !default;
+$navbar-inverse-link-active-bg:             transparent !default;
+$navbar-inverse-link-disabled-color:        $gray-lighter !default;
+$navbar-inverse-link-disabled-bg:           transparent !default;
+
+// Inverted navbar brand label
+$navbar-inverse-brand-color:                $navbar-inverse-link-color !default;
+$navbar-inverse-brand-hover-color:          $navbar-inverse-link-hover-color !default;
+$navbar-inverse-brand-hover-bg:             transparent !default;
+
+// Inverted navbar toggle
+$navbar-inverse-toggle-hover-bg:            $gray-lighter !default;
+$navbar-inverse-toggle-icon-bar-bg:         $gray-light !default;
+$navbar-inverse-toggle-border-color:        $gray-lighter !default;
+
+
+//== Navs
+//
+//##
+
+//=== Shared nav styles
+$nav-link-padding:                          10px 15px !default;
+$nav-link-hover-bg:                         #fff !default;
+
+$nav-disabled-link-color:                   $gray-light !default;
+$nav-disabled-link-hover-color:             $gray-light !default;
+
+//== Tabs
+$nav-tabs-border-color:                     $navbar-default-border !default;
+
+$nav-tabs-link-hover-border-color:          $gray-lighter !default;
+
+$nav-tabs-active-link-hover-bg:             #fff !default;
+$nav-tabs-active-link-hover-color:          $gray !default;
+$nav-tabs-active-link-hover-border-color:   $nav-tabs-border-color !default;
+
+$nav-tabs-justified-link-border-color:            $nav-tabs-border-color !default;
+$nav-tabs-justified-active-link-border-color:     $body-bg !default;
+
+//== Pills
+$nav-pills-border-radius:                   $border-radius-base !default;
+$nav-pills-active-link-hover-bg:            $component-active-bg !default;
+$nav-pills-active-link-hover-color:         $component-active-color !default;
+
+
+//== Pagination
+//
+//##
+
+$pagination-color:                     $btn-default-color !default;
+$pagination-bg:                        $btn-default-bg !default;
+$pagination-border:                    $btn-default-border !default;
+
+$pagination-hover-color:               $pagination-color !default;
+$pagination-hover-bg:                  $pagination-bg !default;
+$pagination-hover-border:              $pagination-border !default;
+
+$pagination-active-color:              #fff !default;
+$pagination-active-bg:                 $brand-primary !default;
+$pagination-active-border:             $btn-primary-border !default;
+
+$pagination-disabled-color:            $gray-light !default;
+$pagination-disabled-bg:               $pagination-bg !default;
+$pagination-disabled-border:           $pagination-border !default;
+
+
+//== Pager
+//
+//##
+
+$pager-bg:                             $pagination-bg !default;
+$pager-border:                         $pagination-border !default;
+$pager-border-radius:                  15px !default;
+
+$pager-hover-bg:                       $pagination-hover-bg !default;
+
+$pager-active-bg:                      $pagination-active-bg !default;
+$pager-active-color:                   $pagination-active-color !default;
+
+$pager-disabled-color:                 $pagination-disabled-color !default;
+
+
+//== Jumbotron
+//
+//##
+
+$jumbotron-padding:              30px !default;
+$jumbotron-color:                inherit !default;
+$jumbotron-bg:                   #fafafa !default;
+$jumbotron-heading-color:        inherit !default;
+$jumbotron-font-size:            ceil(($font-size-base * 1.5)) !default;
+$jumbotron-heading-font-size:    ceil(($font-size-base * 4.5)) !default;
+
+
+//== Form states and alerts
+//
+//## Define colors for form feedback states and, by default, alerts.
+
+$state-success-text:             #fff !default;
+$state-success-bg:               $brand-success !default;
+$state-success-border:           darken($state-success-bg, 4%) !default;
+
+$state-info-text:                #fff !default;
+$state-info-bg:                  $brand-info !default;
+$state-info-border:              darken($state-info-bg, 12%) !default;
+
+$state-warning-text:             #fff !default;
+$state-warning-bg:               $brand-warning !default;
+$state-warning-border:           darken($state-warning-bg, 5%) !default;
+
+$state-danger-text:              #fff !default;
+$state-danger-bg:                $brand-danger !default;
+$state-danger-border:            darken($state-danger-bg, 10%) !default;
+
+
+//== Tooltips
+//
+//##
+
+//** Tooltip max width
+$tooltip-max-width:           200px !default;
+//** Tooltip text color
+$tooltip-color:               #fff !default;
+//** Tooltip background color
+$tooltip-bg:                  #000 !default;
+$tooltip-opacity:             .9 !default;
+
+//** Tooltip arrow width
+$tooltip-arrow-width:         5px !default;
+//** Tooltip arrow color
+$tooltip-arrow-color:         $tooltip-bg !default;
+
+
+//== Popovers
+//
+//##
+
+//** Popover body background color
+$popover-bg:                          #fff !default;
+//** Popover maximum width
+$popover-max-width:                   276px !default;
+//** Popover border color
+$popover-border-color:                rgba(0,0,0,.2) !default;
+//** Popover fallback border color
+$popover-fallback-border-color:       #ccc !default;
+
+//** Popover title background color
+$popover-title-bg:                    darken($popover-bg, 3%) !default;
+
+//** Popover arrow width
+$popover-arrow-width:                 10px !default;
+//** Popover arrow color
+$popover-arrow-color:                 $popover-bg !default;
+
+//** Popover outer arrow width
+$popover-arrow-outer-width:           ($popover-arrow-width + 1) !default;
+//** Popover outer arrow color
+$popover-arrow-outer-color:           fadein($popover-border-color, 5%) !default;
+//** Popover outer arrow fallback color
+$popover-arrow-outer-fallback-color:  darken($popover-fallback-border-color, 20%) !default;
+
+
+//== Labels
+//
+//##
+
+//** Default label background color
+$label-default-bg:            $gray-light !default;
+//** Primary label background color
+$label-primary-bg:            $brand-primary !default;
+//** Success label background color
+$label-success-bg:            $brand-success !default;
+//** Info label background color
+$label-info-bg:               $brand-info !default;
+//** Warning label background color
+$label-warning-bg:            $brand-warning !default;
+//** Danger label background color
+$label-danger-bg:             $brand-danger !default;
+
+//** Default label text color
+$label-color:                 #fff !default;
+//** Default text color of a linked label
+$label-link-hover-color:      #fff !default;
+
+
+//== Modals
+//
+//##
+
+//** Padding applied to the modal body
+$modal-inner-padding:         20px !default;
+
+//** Padding applied to the modal title
+$modal-title-padding:         15px !default;
+//** Modal title line-height
+$modal-title-line-height:     $line-height-base !default;
+
+//** Background color of modal content area
+$modal-content-bg:                             #fff !default;
+//** Modal content border color
+$modal-content-border-color:                   rgba(0,0,0,.05) !default;
+//** Modal content border color **for IE8**
+$modal-content-fallback-border-color:          $gray-lighter !default;
+
+//** Modal backdrop background color
+$modal-backdrop-bg:           #000 !default;
+//** Modal backdrop opacity
+$modal-backdrop-opacity:      .5 !default;
+//** Modal header border color
+$modal-header-border-color:   #e5e5e5 !default;
+//** Modal footer border color
+$modal-footer-border-color:   $modal-header-border-color !default;
+
+$modal-lg:                    900px !default;
+$modal-md:                    600px !default;
+$modal-sm:                    300px !default;
+
+
+//== Alerts
+//
+//## Define alert colors, border radius, and padding.
+
+$alert-padding:               15px !default;
+$alert-border-radius:         $border-radius-base !default;
+$alert-link-font-weight:      bold !default;
+
+$alert-success-bg:            $state-success-bg !default;
+$alert-success-text:          $state-success-text !default;
+$alert-success-border:        $state-success-border !default;
+
+$alert-info-bg:               $state-info-bg !default;
+$alert-info-text:             $state-info-text !default;
+$alert-info-border:           $state-info-border !default;
+
+$alert-warning-bg:            $state-warning-bg !default;
+$alert-warning-text:          $state-warning-text !default;
+$alert-warning-border:        $state-warning-border !default;
+
+$alert-danger-bg:             $state-danger-bg !default;
+$alert-danger-text:           $state-danger-text !default;
+$alert-danger-border:         $state-danger-border !default;
+
+
+//== Progress bars
+//
+//##
+
+//** Background color of the whole progress component
+$progress-bg:                 $jumbotron-bg !default;
+//** Progress bar text color
+$progress-bar-color:          #fff !default;
+//** Variable for setting rounded corners on progress bar.
+$progress-border-radius:      $border-radius-base !default;
+
+//** Default progress bar color
+$progress-bar-bg:             $brand-primary !default;
+//** Success progress bar color
+$progress-bar-success-bg:     $brand-success !default;
+//** Warning progress bar color
+$progress-bar-warning-bg:     $brand-warning !default;
+//** Danger progress bar color
+$progress-bar-danger-bg:      $brand-danger !default;
+//** Info progress bar color
+$progress-bar-info-bg:        $brand-info !default;
+
+
+//== List group
+//
+//##
+
+//** Background color on `.list-group-item`
+$list-group-bg:                 #fff !default;
+//** `.list-group-item` border color
+$list-group-border:             $gray-lighter !default;
+//** List group border radius
+$list-group-border-radius:      $border-radius-base !default;
+
+//** Background color of single list items on hover
+$list-group-hover-bg:           #f5f5f5 !default;
+//** Text color of active list items
+$list-group-active-color:       $component-active-color !default;
+//** Background color of active list elements
+$list-group-active-bg:          $component-active-bg !default;
+//** Background color of active list items
+$list-group-active-border:      $list-group-active-bg !default;
+//** Text color for content within active list items
+$list-group-active-text-color:  lighten($list-group-active-bg, 40%) !default;
+
+//** Text color of disabled list items
+$list-group-disabled-color:      $gray-light !default;
+//** Background color of disabled list items
+$list-group-disabled-bg:         $gray-lighter !default;
+//** Text color for content within disabled list items
+$list-group-disabled-text-color: $list-group-disabled-color !default;
+
+$list-group-link-color:         #555 !default;
+$list-group-link-hover-color:   $list-group-link-color !default;
+$list-group-link-heading-color: #333 !default;
+
+
+//== Panels
+//
+//##
+
+$panel-bg:                    #fff !default;
+$panel-body-padding:          15px !default;
+$panel-heading-padding:       10px 15px !default;
+$panel-footer-padding:        $panel-heading-padding !default;
+$panel-border-radius:         $border-radius-base !default;
+
+//** Border color for elements within panels
+$panel-inner-border:          transparent !default;
+$panel-footer-bg:             #f5f5f5 !default;
+
+$panel-default-text:          $gray-dark !default;
+$panel-default-border:        transparent !default;
+$panel-default-heading-bg:    #f5f5f5 !default;
+
+$panel-primary-text:          #fff !default;
+$panel-primary-border:        transparent !default;
+$panel-primary-heading-bg:    $brand-primary !default;
+
+$panel-success-text:          $state-success-text !default;
+$panel-success-border:        transparent !default;
+$panel-success-heading-bg:    $state-success-bg !default;
+
+$panel-info-text:             $state-info-text !default;
+$panel-info-border:           transparent !default;
+$panel-info-heading-bg:       $state-info-bg !default;
+
+$panel-warning-text:          $state-warning-text !default;
+$panel-warning-border:        transparent !default;
+$panel-warning-heading-bg:    $state-warning-bg !default;
+
+$panel-danger-text:           $state-danger-text !default;
+$panel-danger-border:         transparent !default;
+$panel-danger-heading-bg:     $state-danger-bg !default;
+
+
+//== Thumbnails
+//
+//##
+
+//** Padding around the thumbnail image
+$thumbnail-padding:           4px !default;
+//** Thumbnail background color
+$thumbnail-bg:                $body-bg !default;
+//** Thumbnail border color
+$thumbnail-border:            $gray-lighter !default;
+//** Thumbnail border radius
+$thumbnail-border-radius:     $border-radius-base !default;
+
+//** Custom text color for thumbnail captions
+$thumbnail-caption-color:     $text-color !default;
+//** Padding around the thumbnail caption
+$thumbnail-caption-padding:   9px !default;
+
+
+//== Wells
+//
+//##
+
+$well-bg:                     $jumbotron-bg !default;
+$well-border:                 darken($well-bg, 7%) !default;
+
+
+//== Badges
+//
+//##
+
+$badge-color:                 #fff !default;
+//** Linked badge text color on hover
+$badge-link-hover-color:      #fff !default;
+$badge-bg:                    $brand-primary !default;
+
+//** Badge text color in active nav link
+$badge-active-color:          $link-color !default;
+//** Badge background color in active nav link
+$badge-active-bg:             #fff !default;
+
+$badge-font-weight:           normal !default;
+$badge-line-height:           1 !default;
+$badge-border-radius:         10px !default;
+
+
+//== Breadcrumbs
+//
+//##
+
+$breadcrumb-padding-vertical:   8px !default;
+$breadcrumb-padding-horizontal: 15px !default;
+//** Breadcrumb background color
+$breadcrumb-bg:                 $well-bg !default;
+//** Breadcrumb text color
+$breadcrumb-color:              $gray-light !default;
+//** Text color of current page in the breadcrumb
+$breadcrumb-active-color:       $gray-light !default;
+//** Textual separator for between breadcrumb elements
+$breadcrumb-separator:          ">" !default;
+
+
+//== Carousel
+//
+//##
+
+$carousel-text-shadow:                        0 1px 2px rgba(0,0,0,.6) !default;
+
+$carousel-control-color:                      #fff !default;
+$carousel-control-width:                      15% !default;
+$carousel-control-opacity:                    .7 !default;
+$carousel-control-font-size:                  20px !default;
+
+$carousel-indicator-active-bg:                #fff !default;
+$carousel-indicator-border-color:             #fff !default;
+
+$carousel-caption-color:                      #fff !default;
+
+
+//== Close
+//
+//##
+
+$close-font-weight:           bold !default;
+$close-color:                 #fff !default;
+$close-text-shadow:           0 1px 0 #fff !default;
+
+
+//== Code
+//
+//##
+
+$code-color:                  #c7254e !default;
+$code-bg:                     #f9f2f4 !default;
+
+$kbd-color:                   #fff !default;
+$kbd-bg:                      #333 !default;
+
+$pre-bg:                      #f5f5f5 !default;
+$pre-color:                   $gray-dark !default;
+$pre-border-color:            #ccc !default;
+$pre-scrollable-max-height:   340px !default;
+
+
+//== Type
+//
+//##
+
+//** Horizontal offset for forms and lists.
+$component-offset-horizontal: 180px !default;
+//** Text muted color
+$text-muted:                  $gray-light !default;
+//** Abbreviations and acronyms border color
+$abbr-border-color:           $gray-light !default;
+//** Headings small color
+$headings-small-color:        $gray-light !default;
+//** Blockquote small color
+$blockquote-small-color:      $gray-light !default;
+//** Blockquote font size
+$blockquote-font-size:        ($font-size-base * 1.25) !default;
+//** Blockquote border color
+$blockquote-border-color:     $gray-lighter !default;
+//** Page header border color
+$page-header-border-color:    $gray-lighter !default;
+//** Width of horizontal description list titles
+$dl-horizontal-offset:        $component-offset-horizontal !default;
+//** Point at which .dl-horizontal becomes horizontal
+$dl-horizontal-breakpoint:    $grid-float-breakpoint !default;
+//** Horizontal line color.
+$hr-border:                   $gray-lighter !default;
diff --git a/_sass/bootstrap/_wells.scss b/_sass/bootstrap/_wells.scss
new file mode 100644
index 0000000..b865711
--- /dev/null
+++ b/_sass/bootstrap/_wells.scss
@@ -0,0 +1,29 @@
+//
+// Wells
+// --------------------------------------------------
+
+
+// Base class
+.well {
+  min-height: 20px;
+  padding: 19px;
+  margin-bottom: 20px;
+  background-color: $well-bg;
+  border: 1px solid $well-border;
+  border-radius: $border-radius-base;
+  @include box-shadow(inset 0 1px 1px rgba(0,0,0,.05));
+  blockquote {
+    border-color: #ddd;
+    border-color: rgba(0,0,0,.15);
+  }
+}
+
+// Sizes
+.well-lg {
+  padding: 24px;
+  border-radius: $border-radius-large;
+}
+.well-sm {
+  padding: 9px;
+  border-radius: $border-radius-small;
+}
diff --git a/_sass/bootstrap/mixins/_alerts.scss b/_sass/bootstrap/mixins/_alerts.scss
new file mode 100644
index 0000000..3faf0b5
--- /dev/null
+++ b/_sass/bootstrap/mixins/_alerts.scss
@@ -0,0 +1,14 @@
+// Alerts
+
+@mixin alert-variant($background, $border, $text-color) {
+  background-color: $background;
+  border-color: $border;
+  color: $text-color;
+
+  hr {
+    border-top-color: darken($border, 5%);
+  }
+  .alert-link {
+    color: darken($text-color, 10%);
+  }
+}
diff --git a/_sass/bootstrap/mixins/_background-variant.scss b/_sass/bootstrap/mixins/_background-variant.scss
new file mode 100644
index 0000000..4c7769e
--- /dev/null
+++ b/_sass/bootstrap/mixins/_background-variant.scss
@@ -0,0 +1,12 @@
+// Contextual backgrounds
+
+// [converter] $parent hack
+@mixin bg-variant($parent, $color) {
+  #{$parent} {
+    background-color: $color;
+  }
+  a#{$parent}:hover,
+  a#{$parent}:focus {
+    background-color: darken($color, 10%);
+  }
+}
diff --git a/_sass/bootstrap/mixins/_border-radius.scss b/_sass/bootstrap/mixins/_border-radius.scss
new file mode 100644
index 0000000..ce19499
--- /dev/null
+++ b/_sass/bootstrap/mixins/_border-radius.scss
@@ -0,0 +1,18 @@
+// Single side border-radius
+
+@mixin border-top-radius($radius) {
+  border-top-right-radius: $radius;
+   border-top-left-radius: $radius;
+}
+@mixin border-right-radius($radius) {
+  border-bottom-right-radius: $radius;
+     border-top-right-radius: $radius;
+}
+@mixin border-bottom-radius($radius) {
+  border-bottom-right-radius: $radius;
+   border-bottom-left-radius: $radius;
+}
+@mixin border-left-radius($radius) {
+  border-bottom-left-radius: $radius;
+     border-top-left-radius: $radius;
+}
diff --git a/_sass/bootstrap/mixins/_buttons.scss b/_sass/bootstrap/mixins/_buttons.scss
new file mode 100644
index 0000000..b93f84b
--- /dev/null
+++ b/_sass/bootstrap/mixins/_buttons.scss
@@ -0,0 +1,65 @@
+// Button variants
+//
+// Easily pump out default styles, as well as :hover, :focus, :active,
+// and disabled options for all buttons
+
+@mixin button-variant($color, $background, $border) {
+  color: $color;
+  background-color: $background;
+  border-color: $border;
+
+  &:focus,
+  &.focus {
+    color: $color;
+    background-color: darken($background, 10%);
+        border-color: darken($border, 25%);
+  }
+  &:hover {
+    color: $color;
+    background-color: darken($background, 10%);
+        border-color: darken($border, 12%);
+  }
+  &:active,
+  &.active,
+  .open > &.dropdown-toggle {
+    color: $color;
+    background-color: darken($background, 10%);
+        border-color: darken($border, 12%);
+
+    &:hover,
+    &:focus,
+    &.focus {
+      color: $color;
+      background-color: darken($background, 17%);
+          border-color: darken($border, 25%);
+    }
+  }
+  &:active,
+  &.active,
+  .open > &.dropdown-toggle {
+    background-image: none;
+  }
+  &.disabled,
+  &[disabled],
+  fieldset[disabled] & {
+    &:hover,
+    &:focus,
+    &.focus {
+      background-color: $background;
+          border-color: $border;
+    }
+  }
+
+  .badge {
+    color: $background;
+    background-color: $color;
+  }
+}
+
+// Button sizes
+@mixin button-size($padding-vertical, $padding-horizontal, $font-size, $line-height, $border-radius) {
+  padding: $padding-vertical $padding-horizontal;
+  font-size: $font-size;
+  line-height: $line-height;
+  border-radius: $border-radius;
+}
diff --git a/_sass/bootstrap/mixins/_center-block.scss b/_sass/bootstrap/mixins/_center-block.scss
new file mode 100644
index 0000000..e06fb5e
--- /dev/null
+++ b/_sass/bootstrap/mixins/_center-block.scss
@@ -0,0 +1,7 @@
+// Center-align a block level element
+
+@mixin center-block() {
+  display: block;
+  margin-left: auto;
+  margin-right: auto;
+}
diff --git a/_sass/bootstrap/mixins/_clearfix.scss b/_sass/bootstrap/mixins/_clearfix.scss
new file mode 100644
index 0000000..dc3e2ab
--- /dev/null
+++ b/_sass/bootstrap/mixins/_clearfix.scss
@@ -0,0 +1,22 @@
+// Clearfix
+//
+// For modern browsers
+// 1. The space content is one way to avoid an Opera bug when the
+//    contenteditable attribute is included anywhere else in the document.
+//    Otherwise it causes space to appear at the top and bottom of elements
+//    that are clearfixed.
+// 2. The use of `table` rather than `block` is only necessary if using
+//    `:before` to contain the top-margins of child elements.
+//
+// Source: http://nicolasgallagher.com/micro-clearfix-hack/
+
+@mixin clearfix() {
+  &:before,
+  &:after {
+    content: " "; // 1
+    display: table; // 2
+  }
+  &:after {
+    clear: both;
+  }
+}
diff --git a/_sass/bootstrap/mixins/_forms.scss b/_sass/bootstrap/mixins/_forms.scss
new file mode 100644
index 0000000..277aa5f
--- /dev/null
+++ b/_sass/bootstrap/mixins/_forms.scss
@@ -0,0 +1,88 @@
+// Form validation states
+//
+// Used in forms.less to generate the form validation CSS for warnings, errors,
+// and successes.
+
+@mixin form-control-validation($text-color: #555, $border-color: #ccc, $background-color: #f5f5f5) {
+  // Color the label and help text
+  .help-block,
+  .control-label,
+  .radio,
+  .checkbox,
+  .radio-inline,
+  .checkbox-inline,
+  &.radio label,
+  &.checkbox label,
+  &.radio-inline label,
+  &.checkbox-inline label  {
+    color: $text-color;
+  }
+  // Set the border and box shadow on specific inputs to match
+  .form-control {
+    border-color: $border-color;
+    @include box-shadow(inset 0 1px 1px rgba(0,0,0,.075)); // Redeclare so transitions work
+    &:focus {
+      border-color: darken($border-color, 10%);
+      $shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 6px lighten($border-color, 20%);
+      @include box-shadow($shadow);
+    }
+  }
+  // Set validation states also for addons
+  .input-group-addon {
+    color: $text-color;
+    border-color: $border-color;
+    background-color: $background-color;
+  }
+  // Optional feedback icon
+  .form-control-feedback {
+    color: $text-color;
+  }
+}
+
+
+// Form control focus state
+//
+// Generate a customized focus state and for any input with the specified color,
+// which defaults to the `$input-border-focus` variable.
+//
+// We highly encourage you to not customize the default value, but instead use
+// this to tweak colors on an as-needed basis. This aesthetic change is based on
+// WebKit's default styles, but applicable to a wider range of browsers. Its
+// usability and accessibility should be taken into account with any change.
+//
+// Example usage: change the default blue border and shadow to white for better
+// contrast against a dark gray background.
+@mixin form-control-focus($color: $input-border-focus) {
+  $color-rgba: rgba(red($color), green($color), blue($color), .6);
+  &:focus {
+    border-color: $color;
+    outline: 0;
+    @include box-shadow(inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px $color-rgba);
+  }
+}
+
+// Form control sizing
+//
+// Relative text size, padding, and border-radii changes for form controls. For
+// horizontal sizing, wrap controls in the predefined grid classes. `