Browse Source

Initial Commit

master
Trevor Richards 3 years ago
commit
615aa91bb2
  1. 3
      .gitignore
  2. 29
      app.py
  3. 8
      passenger_wsgi.py
  4. 49
      readme.md
  5. 12
      requirements.txt
  6. 8
      routes/get.py
  7. 1
      routes/post.py
  8. 5
      sass/_imports.sass
  9. 548
      sass/libs/bootstrap/.scss-lint.yml
  10. 51
      sass/libs/bootstrap/_alert.scss
  11. 47
      sass/libs/bootstrap/_badge.scss
  12. 32
      sass/libs/bootstrap/_bootstrap-grid.scss
  13. 12
      sass/libs/bootstrap/_bootstrap-reboot.scss
  14. 42
      sass/libs/bootstrap/_bootstrap.scss
  15. 38
      sass/libs/bootstrap/_breadcrumb.scss
  16. 166
      sass/libs/bootstrap/_button-group.scss
  17. 143
      sass/libs/bootstrap/_buttons.scss
  18. 270
      sass/libs/bootstrap/_card.scss
  19. 191
      sass/libs/bootstrap/_carousel.scss
  20. 34
      sass/libs/bootstrap/_close.scss
  21. 56
      sass/libs/bootstrap/_code.scss
  22. 297
      sass/libs/bootstrap/_custom-forms.scss
  23. 131
      sass/libs/bootstrap/_dropdown.scss
  24. 333
      sass/libs/bootstrap/_forms.scss
  25. 86
      sass/libs/bootstrap/_functions.scss
  26. 52
      sass/libs/bootstrap/_grid.scss
  27. 42
      sass/libs/bootstrap/_images.scss
  28. 159
      sass/libs/bootstrap/_input-group.scss
  29. 16
      sass/libs/bootstrap/_jumbotron.scss
  30. 115
      sass/libs/bootstrap/_list-group.scss
  31. 8
      sass/libs/bootstrap/_media.scss
  32. 42
      sass/libs/bootstrap/_mixins.scss
  33. 168
      sass/libs/bootstrap/_modal.scss
  34. 118
      sass/libs/bootstrap/_nav.scss
  35. 311
      sass/libs/bootstrap/_navbar.scss
  36. 77
      sass/libs/bootstrap/_pagination.scss
  37. 183
      sass/libs/bootstrap/_popover.scss
  38. 124
      sass/libs/bootstrap/_print.scss
  39. 33
      sass/libs/bootstrap/_progress.scss
  40. 481
      sass/libs/bootstrap/_reboot.scss
  41. 19
      sass/libs/bootstrap/_root.scss
  42. 180
      sass/libs/bootstrap/_tables.scss
  43. 115
      sass/libs/bootstrap/_tooltip.scss
  44. 36
      sass/libs/bootstrap/_transitions.scss
  45. 125
      sass/libs/bootstrap/_type.scss
  46. 14
      sass/libs/bootstrap/_utilities.scss
  47. 894
      sass/libs/bootstrap/_variables.scss
  48. 13
      sass/libs/bootstrap/mixins/_alert.scss
  49. 21
      sass/libs/bootstrap/mixins/_background-variant.scss
  50. 12
      sass/libs/bootstrap/mixins/_badge.scss
  51. 35
      sass/libs/bootstrap/mixins/_border-radius.scss
  52. 5
      sass/libs/bootstrap/mixins/_box-shadow.scss
  53. 123
      sass/libs/bootstrap/mixins/_breakpoints.scss
  54. 109
      sass/libs/bootstrap/mixins/_buttons.scss
  55. 65
      sass/libs/bootstrap/mixins/_caret.scss
  56. 7
      sass/libs/bootstrap/mixins/_clearfix.scss
  57. 11
      sass/libs/bootstrap/mixins/_float.scss
  58. 137
      sass/libs/bootstrap/mixins/_forms.scss
  59. 45
      sass/libs/bootstrap/mixins/_gradients.scss
  60. 67
      sass/libs/bootstrap/mixins/_grid-framework.scss
  61. 52
      sass/libs/bootstrap/mixins/_grid.scss
  62. 39
      sass/libs/bootstrap/mixins/_hover.scss
  63. 36
      sass/libs/bootstrap/mixins/_image.scss
  64. 21
      sass/libs/bootstrap/mixins/_list-group.scss
  65. 7
      sass/libs/bootstrap/mixins/_lists.scss
  66. 10
      sass/libs/bootstrap/mixins/_nav-divider.scss
  67. 10
      sass/libs/bootstrap/mixins/_navbar-align.scss
  68. 22
      sass/libs/bootstrap/mixins/_pagination.scss
  69. 17
      sass/libs/bootstrap/mixins/_reset-text.scss
  70. 6
      sass/libs/bootstrap/mixins/_resize.scss
  71. 35
      sass/libs/bootstrap/mixins/_screen-reader.scss
  72. 6
      sass/libs/bootstrap/mixins/_size.scss
  73. 30
      sass/libs/bootstrap/mixins/_table-row.scss
  74. 14
      sass/libs/bootstrap/mixins/_text-emphasis.scss
  75. 9
      sass/libs/bootstrap/mixins/_text-hide.scss
  76. 8
      sass/libs/bootstrap/mixins/_text-truncate.scss
  77. 9
      sass/libs/bootstrap/mixins/_transition.scss
  78. 7
      sass/libs/bootstrap/mixins/_visibility.scss
  79. 8
      sass/libs/bootstrap/utilities/_align.scss
  80. 19
      sass/libs/bootstrap/utilities/_background.scss
  81. 59
      sass/libs/bootstrap/utilities/_borders.scss
  82. 3
      sass/libs/bootstrap/utilities/_clearfix.scss
  83. 38
      sass/libs/bootstrap/utilities/_display.scss
  84. 52
      sass/libs/bootstrap/utilities/_embed.scss
  85. 46
      sass/libs/bootstrap/utilities/_flex.scss
  86. 9
      sass/libs/bootstrap/utilities/_float.scss
  87. 36
      sass/libs/bootstrap/utilities/_position.scss
  88. 11
      sass/libs/bootstrap/utilities/_screenreaders.scss
  89. 12
      sass/libs/bootstrap/utilities/_sizing.scss
  90. 51
      sass/libs/bootstrap/utilities/_spacing.scss
  91. 52
      sass/libs/bootstrap/utilities/_text.scss
  92. 11
      sass/libs/bootstrap/utilities/_visibility.scss
  93. 48
      sass/partials/_helpers.sass
  94. 40
      sass/partials/_tempsite.sass
  95. 1
      sass/styles.sass
  96. 1
      site.cfg
  97. 9280
      static/css/styles.css
  98. BIN
      static/img/fav.png
  99. BIN
      static/img/flask.png
  100. BIN
      static/img/python.png

3
.gitignore

@ -0,0 +1,3 @@
/env
*/__pycache__
*/.webassets-cache

29
app.py

@ -0,0 +1,29 @@
from flask import Flask
from flask_assets import Environment, Bundle
from routes.get import get
# Instantiate Flask
app = Flask(
__name__,
static_folder='static',
static_path='/static',
template_folder='views'
)
# Apply configurations
app.config.from_pyfile('site.cfg')
assets = Environment(app)
#JS/CSS bundlers for minification
js = Bundle('js/site.js', filters='jsmin', output='js/bundle.min.js')
css = Bundle('css/styles.css', filters='cssmin', output='css/bundle.min.css')
assets.register('js_modules', js)
assets.register('css_modules', css)
# Apply GET method routes
app.register_blueprint(get)
# Run application
if __name__ == '__main__':
app.run()

8
passenger_wsgi.py

@ -0,0 +1,8 @@
import sys, os # noqa
INTERP = '/home/user/<website.com>/env/bin/python'
if sys.executable != INTERP:
os.execl(INTERP, INTERP, *sys.argv)
sys.path.append(os.getcwd())
from app import app as application # noqa

49
readme.md

@ -0,0 +1,49 @@
# Flask Starter Web Application
## What's included
In this repo is flask web-app skeleton for a basic API or Flask powered website. The stylesheets are Sassy and Bootstrap 4 is included in the Sass libs folder. Everything you need here (except a Sass precompiler) to get started with a Flask App along with deployment instructions for Dreamhost.
## Requirements
- [Python](https://www.python.org/downloads/) (preferrably Python3)
- [pip package manager](https://pip.pypa.io/en/stable/installing/)
- [Virtualenv](https://virtualenv.pypa.io/en/stable/installation/) for managing virtual environments (installed via pip)
- SASS/SCSS compiler (or not, it's up to you. My SASS files are included in the repo.)
## Instructions
#### Installation
1) Clone this repository
```
git clone git@github.com:trev-dev/flask-starter.git
```
2) Enter the flask-starter directory
3) Setup your virtual environment (virtualenv) and activate your env.
```
virtualenv env
source ./env/bin/activate
```
4) When you see the little (env) indicator on your terminal, install the python package dependancies.
```
pip install -r requirements.txt
```
5) Launch the app and preview it in your browser on localhost:5000.
```
python app.py
```
6) Edit/change/develop your site using [Flask + Jinja2](http://flask.pocoo.org/docs/0.12/) (Or whatever other templating you wish to use)
#### Deployment (Dreamhost)
1) Setup hosting for a domain and ensure you have [passenger enabled](https://help.dreamhost.com/hc/en-us/articles/216385637-How-do-I-enable-Passenger-on-my-domain-) for Python apps.
2) Use FTP/SFTP to move your project to its destination on Dreamhost (/home/username/example.com). *Be sure to avoid moving any caching or your env*.
3) Use a secure shell to log in to your dreamhost hosting and run the same steps to setup your pip and virtualenv. If your python is out of date on Dreamhost, you can update it/install your own version.
4) Configure passenger_wsgi.py to tie-in passenger to your application - specifically the destination of the python file inside ./env/bin/python. You'll need to change the "website" in the INTERP string.
```python
import sys, os
INTERP = '/home/user/<website.com>/env/bin/python'
if sys.executable != INTERP:
os.execl(INTERP, INTERP, *sys.argv)
sys.path.append(os.getcwd())
from app import app as application
```
5) Wait a few minutes, then visit your website. It should be working. If not, Dreamhost has lots of documentation/support that can help you out. Enjoy!

12
requirements.txt

@ -0,0 +1,12 @@
blinker==1.4
click==6.7
cssmin==0.2.0
Flask==0.12.2
Flask-Assets==0.12
Flask-Mail==0.9.1
itsdangerous==0.24
Jinja2==2.10
jsmin==2.2.2
MarkupSafe==1.0
webassets==0.12.1
Werkzeug==0.14.1

8
routes/get.py

@ -0,0 +1,8 @@
from flask import Blueprint, render_template
get = Blueprint('get', __name__)
@get.route('/')
def home():
return render_template('home.html')

1
routes/post.py

@ -0,0 +1 @@
# Routes for POST methods.

5
sass/_imports.sass

@ -0,0 +1,5 @@
@import libs/bootstrap/bootstrap
@import partials/helpers
@import partials/tempsite

548
sass/libs/bootstrap/.scss-lint.yml

@ -0,0 +1,548 @@
# Default application configuration that all configurations inherit from.
scss_files:
- "**/*.scss"
- "docs/assets/scss/**/*.scss"
exclude:
- "scss/_normalize.scss"
plugin_directories: ['.scss-linters']
# List of gem names to load custom linters from (make sure they are already
# installed)
plugin_gems: []
# Default severity of all linters.
severity: warning
linters:
BangFormat:
enabled: true
space_before_bang: true
space_after_bang: false
BemDepth:
enabled: false
max_elements: 1
BorderZero:
enabled: true
convention: zero # or `none`
exclude:
- _normalize.scss
ChainedClasses:
enabled: false
ColorKeyword:
enabled: true
ColorVariable:
enabled: false
Comment:
enabled: true
exclude:
- _normalize.scss
- bootstrap.scss
style: silent
DebugStatement:
enabled: true
DeclarationOrder:
enabled: false
DisableLinterReason:
enabled: false
DuplicateProperty:
enabled: true
ElsePlacement:
enabled: true
style: same_line # or 'new_line'
EmptyLineBetweenBlocks:
enabled: false
ignore_single_line_blocks: true
EmptyRule:
enabled: true
ExtendDirective:
enabled: false
FinalNewline:
enabled: true
present: true
HexLength:
enabled: true
style: short # or 'long'
HexNotation:
enabled: true
style: lowercase # or 'uppercase'
HexValidation:
enabled: true
IdSelector:
enabled: true
ImportantRule:
enabled: false
ImportPath:
enabled: true
leading_underscore: false
filename_extension: false
Indentation:
enabled: true
allow_non_nested_indentation: false
character: space # or 'tab'
width: 2
LeadingZero:
enabled: true
style: exclude_zero # or 'include_zero'
exclude:
- _normalize.scss
MergeableSelector:
enabled: false
force_nesting: true
NameFormat:
enabled: true
allow_leading_underscore: true
convention: hyphenated_lowercase # or 'camel_case', or 'snake_case', or a regex pattern
NestingDepth:
enabled: true
max_depth: 4
ignore_parent_selectors: false
PlaceholderInExtend:
enabled: false
PropertyCount:
enabled: false
include_nested: false
max_properties: 10
PropertySortOrder:
enabled: true
ignore_unspecified: false
min_properties: 2
separate_groups: false
exclude:
- _normalize.scss
order:
- position
- top
- right
- bottom
- left
- z-index
- -webkit-box-sizing
- -moz-box-sizing
- box-sizing
- display
- flex
- flex-align
- flex-basis
- flex-direction
- flex-wrap
- flex-flow
- flex-grow
- flex-order
- flex-pack
- align-items
- align-self
- justify-content
- float
- width
- min-width
- max-width
- height
- min-height
- max-height
- padding
- padding-top
- padding-right
- padding-bottom
- padding-left
- margin
- margin-top
- margin-right
- margin-bottom
- margin-left
- overflow
- overflow-x
- overflow-y
- -webkit-overflow-scrolling
- -ms-overflow-x
- -ms-overflow-y
- -ms-overflow-style
- clip
- clear
- font
- font-family
- font-size
- font-style
- font-weight
- font-variant
- font-size-adjust
- font-stretch
- font-effect
- font-emphasize
- font-emphasize-position
- font-emphasize-style
- font-smooth
- -webkit-hyphens
- -moz-hyphens
- hyphens
- line-height
- color
- text-align
- -webkit-text-align-last
- -moz-text-align-last
- -ms-text-align-last
- text-align-last
- text-emphasis
- text-emphasis-color
- text-emphasis-style
- text-emphasis-position
- text-decoration
- text-indent
- text-justify
- text-outline
- -ms-text-overflow
- text-overflow
- text-overflow-ellipsis
- text-overflow-mode
- text-shadow
- text-transform
- text-wrap
- -webkit-text-size-adjust
- -ms-text-size-adjust
- letter-spacing
- -ms-word-break
- word-break
- word-spacing
- -ms-word-wrap
- word-wrap
- overflow-wrap
- -moz-tab-size
- -o-tab-size
- tab-size
- white-space
- vertical-align
- list-style
- list-style-position
- list-style-type
- list-style-image
- pointer-events
- -ms-touch-action
- touch-action
- cursor
- visibility
- zoom
- table-layout
- empty-cells
- caption-side
- border-spacing
- border-collapse
- content
- quotes
- counter-reset
- counter-increment
- resize
- -webkit-user-select
- -moz-user-select
- -ms-user-select
- -o-user-select
- user-select
- nav-index
- nav-up
- nav-right
- nav-down
- nav-left
- background
- background-color
- background-image
- -ms-filter:\\'progid:DXImageTransform.Microsoft.gradient
- filter:progid:DXImageTransform.Microsoft.gradient
- filter:progid:DXImageTransform.Microsoft.AlphaImageLoader
- filter
- background-repeat
- background-attachment
- background-position
- background-position-x
- background-position-y
- -webkit-background-clip
- -moz-background-clip
- background-clip
- background-origin
- -webkit-background-size
- -moz-background-size
- -o-background-size
- background-size
- border
- border-color
- border-style
- border-width
- border-top
- border-top-color
- border-top-style
- border-top-width
- border-right
- border-right-color
- border-right-style
- border-right-width
- border-bottom
- border-bottom-color
- border-bottom-style
- border-bottom-width
- border-left
- border-left-color
- border-left-style
- border-left-width
- border-radius
- border-top-left-radius
- border-top-right-radius
- border-bottom-right-radius
- border-bottom-left-radius
- -webkit-border-image
- -moz-border-image
- -o-border-image
- border-image
- -webkit-border-image-source
- -moz-border-image-source
- -o-border-image-source
- border-image-source
- -webkit-border-image-slice
- -moz-border-image-slice
- -o-border-image-slice
- border-image-slice
- -webkit-border-image-width
- -moz-border-image-width
- -o-border-image-width
- border-image-width
- -webkit-border-image-outset
- -moz-border-image-outset
- -o-border-image-outset
- border-image-outset
- -webkit-border-image-repeat
- -moz-border-image-repeat
- -o-border-image-repeat
- border-image-repeat
- outline
- outline-width
- outline-style
- outline-color
- outline-offset
- -webkit-box-shadow
- -moz-box-shadow
- box-shadow
- filter:progid:DXImageTransform.Microsoft.Alpha(Opacity
- -ms-filter:\\'progid:DXImageTransform.Microsoft.Alpha
- opacity
- -ms-interpolation-mode
- -webkit-transition
- -moz-transition
- -ms-transition
- -o-transition
- transition
- -webkit-transition-delay
- -moz-transition-delay
- -ms-transition-delay
- -o-transition-delay
- transition-delay
- -webkit-transition-timing-function
- -moz-transition-timing-function
- -ms-transition-timing-function
- -o-transition-timing-function
- transition-timing-function
- -webkit-transition-duration
- -moz-transition-duration
- -ms-transition-duration
- -o-transition-duration
- transition-duration
- -webkit-transition-property
- -moz-transition-property
- -ms-transition-property
- -o-transition-property
- transition-property
- -webkit-transform
- -moz-transform
- -ms-transform
- -o-transform
- transform
- -webkit-transform-origin
- -moz-transform-origin
- -ms-transform-origin
- -o-transform-origin
- transform-origin
- -webkit-animation
- -moz-animation
- -ms-animation
- -o-animation
- animation
- -webkit-animation-name
- -moz-animation-name
- -ms-animation-name
- -o-animation-name
- animation-name
- -webkit-animation-duration
- -moz-animation-duration
- -ms-animation-duration
- -o-animation-duration
- animation-duration
- -webkit-animation-play-state
- -moz-animation-play-state
- -ms-animation-play-state
- -o-animation-play-state
- animation-play-state
- -webkit-animation-timing-function
- -moz-animation-timing-function
- -ms-animation-timing-function
- -o-animation-timing-function
- animation-timing-function
- -webkit-animation-delay
- -moz-animation-delay
- -ms-animation-delay
- -o-animation-delay
- animation-delay
- -webkit-animation-iteration-count
- -moz-animation-iteration-count
- -ms-animation-iteration-count
- -o-animation-iteration-count
- animation-iteration-count
- -webkit-animation-direction
- -moz-animation-direction
- -ms-animation-direction
- -o-animation-direction
PropertySpelling:
enabled: true
extra_properties: []
disabled_properties: []
PropertyUnits:
enabled: true
global: [
'ch', 'em', 'ex', 'rem', # Font-relative lengths
'cm', 'in', 'mm', 'pc', 'pt', 'px', 'q', # Absolute lengths
'vh', 'vw', 'vmin', 'vmax', # Viewport-percentage lengths
'deg', 'grad', 'rad', 'turn', # Angle
'ms', 's', # Duration
'Hz', 'kHz', # Frequency
'dpi', 'dpcm', 'dppx', # Resolution
'%'] # Other
properties: {}
PseudoElement:
enabled: true
QualifyingElement:
enabled: true
allow_element_with_attribute: false
allow_element_with_class: false
allow_element_with_id: false
SelectorDepth:
enabled: true
max_depth: 4
SelectorFormat:
enabled: false
convention: hyphenated_lowercase # or 'strict_BEM', or 'hyphenated_BEM', or 'snake_case', or 'camel_case', or a regex pattern
Shorthand:
enabled: true
allowed_shorthands: [1, 2, 3, 4]
SingleLinePerProperty:
enabled: false
allow_single_line_rule_sets: true
SingleLinePerSelector:
enabled: false
SpaceAfterComma:
enabled: false
style: one_space # or 'no_space', or 'at_least_one_space'
SpaceAfterPropertyColon:
enabled: true
style: at_least_one_space # or 'no_space', or 'at_least_one_space', or 'aligned'
SpaceAfterPropertyName:
enabled: true
SpaceAfterVariableName:
enabled: true
SpaceAroundOperator:
enabled: true
style: one_space # or 'at_least_one_space', or 'no_space'
SpaceBeforeBrace:
enabled: true
style: space # or 'new_line'
allow_single_line_padding: true
SpaceBetweenParens:
enabled: true
spaces: 0
StringQuotes:
enabled: true
style: double_quotes # or double_quotes
TrailingSemicolon:
enabled: true
TrailingWhitespace:
enabled: true
TrailingZero:
enabled: false
TransitionAll:
enabled: false
UnnecessaryMantissa:
enabled: true
UnnecessaryParentReference:
enabled: true
UrlFormat:
enabled: true
UrlQuotes:
enabled: true
VariableForProperty:
enabled: false
properties: []
VendorPrefix:
enabled: true
identifier_list: base
additional_identifiers: []
excluded_identifiers: []
exclude:
- _normalize.scss
ZeroUnit:
enabled: true
Compass::*:
enabled: false

51
sass/libs/bootstrap/_alert.scss

@ -0,0 +1,51 @@
//
// Base styles
//
.alert {
position: relative;
padding: $alert-padding-y $alert-padding-x;
margin-bottom: $alert-margin-bottom;
border: $alert-border-width solid transparent;
@include border-radius($alert-border-radius);
}
// Headings for larger alerts
.alert-heading {
// Specified to prevent conflicts of changing $headings-color
color: inherit;
}
// Provide class for links that match alerts
.alert-link {
font-weight: $alert-link-font-weight;
}
// Dismissible alerts
//
// Expand the right padding and account for the close button's positioning.
.alert-dismissible {
padding-right: ($close-font-size + $alert-padding-x * 2);
// Adjust close link position
.close {
position: absolute;
top: 0;
right: 0;
padding: $alert-padding-y $alert-padding-x;
color: inherit;
}
}
// Alternate styles
//
// Generate contextual modifier classes for colorizing the alert.
@each $color, $value in $theme-colors {
.alert-#{$color} {
@include alert-variant(theme-color-level($color, $alert-bg-level), theme-color-level($color, $alert-border-level), theme-color-level($color, $alert-color-level));
}
}

47
sass/libs/bootstrap/_badge.scss

@ -0,0 +1,47 @@
// Base class
//
// Requires one of the contextual, color modifier classes for `color` and
// `background-color`.
.badge {
display: inline-block;
padding: $badge-padding-y $badge-padding-x;
font-size: $badge-font-size;
font-weight: $badge-font-weight;
line-height: 1;
text-align: center;
white-space: nowrap;
vertical-align: baseline;
@include border-radius($badge-border-radius);
// Empty badges collapse automatically
&:empty {
display: none;
}
}
// Quick fix for badges in buttons
.btn .badge {
position: relative;
top: -1px;
}
// Pill badges
//
// Make them extra rounded with a modifier to replace v3's badges.
.badge-pill {
padding-right: $badge-pill-padding-x;
padding-left: $badge-pill-padding-x;
@include border-radius($badge-pill-border-radius);
}
// Colors
//
// Contextual variations (linked badges get darker on :hover).
@each $color, $value in $theme-colors {
.badge-#{$color} {
@include badge-variant($value);
}
}

32
sass/libs/bootstrap/_bootstrap-grid.scss

@ -0,0 +1,32 @@
/*!
* Bootstrap Grid v4.0.0 (https://getbootstrap.com)
* Copyright 2011-2018 The Bootstrap Authors
* Copyright 2011-2018 Twitter, Inc.
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
*/
@at-root {
@-ms-viewport { width: device-width; } // stylelint-disable-line at-rule-no-vendor-prefix
}
html {
box-sizing: border-box;
-ms-overflow-style: scrollbar;
}
*,
*::before,
*::after {
box-sizing: inherit;
}
@import "functions";
@import "variables";
@import "mixins/breakpoints";
@import "mixins/grid-framework";
@import "mixins/grid";
@import "grid";
@import "utilities/display";
@import "utilities/flex";

12
sass/libs/bootstrap/_bootstrap-reboot.scss

@ -0,0 +1,12 @@
/*!
* Bootstrap Reboot v4.0.0 (https://getbootstrap.com)
* Copyright 2011-2018 The Bootstrap Authors
* Copyright 2011-2018 Twitter, Inc.
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
* Forked from Normalize.css, licensed MIT (https://github.com/necolas/normalize.css/blob/master/LICENSE.md)
*/
@import "functions";
@import "variables";
@import "mixins";
@import "reboot";

42
sass/libs/bootstrap/_bootstrap.scss

@ -0,0 +1,42 @@
/*!
* Bootstrap v4.0.0 (https://getbootstrap.com)
* Copyright 2011-2018 The Bootstrap Authors
* Copyright 2011-2018 Twitter, Inc.
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
*/
@import "functions";
@import "variables";
@import "mixins";
@import "root";
@import "reboot";
@import "type";
@import "images";
@import "code";
@import "grid";
@import "tables";
@import "forms";
@import "buttons";
@import "transitions";
@import "dropdown";
@import "button-group";
@import "input-group";
@import "custom-forms";
@import "nav";
@import "navbar";
@import "card";
@import "breadcrumb";
@import "pagination";
@import "badge";
@import "jumbotron";
@import "alert";
@import "progress";
@import "media";
@import "list-group";
@import "close";
@import "modal";
@import "tooltip";
@import "popover";
@import "carousel";
@import "utilities";
@import "print";

38
sass/libs/bootstrap/_breadcrumb.scss

@ -0,0 +1,38 @@
.breadcrumb {
display: flex;
flex-wrap: wrap;
padding: $breadcrumb-padding-y $breadcrumb-padding-x;
margin-bottom: $breadcrumb-margin-bottom;
list-style: none;
background-color: $breadcrumb-bg;
@include border-radius($border-radius);
}
.breadcrumb-item {
// The separator between breadcrumbs (by default, a forward-slash: "/")
+ .breadcrumb-item::before {
display: inline-block; // Suppress underlining of the separator in modern browsers
padding-right: $breadcrumb-item-padding;
padding-left: $breadcrumb-item-padding;
color: $breadcrumb-divider-color;
content: "#{$breadcrumb-divider}";
}
// IE9-11 hack to properly handle hyperlink underlines for breadcrumbs built
// without `<ul>`s. The `::before` pseudo-element generates an element
// *within* the .breadcrumb-item and thereby inherits the `text-decoration`.
//
// To trick IE into suppressing the underline, we give the pseudo-element an
// underline and then immediately remove it.
+ .breadcrumb-item:hover::before {
text-decoration: underline;
}
// stylelint-disable-next-line no-duplicate-selectors
+ .breadcrumb-item:hover::before {
text-decoration: none;
}
&.active {
color: $breadcrumb-active-color;
}
}

166
sass/libs/bootstrap/_button-group.scss

@ -0,0 +1,166 @@
// stylelint-disable selector-no-qualifying-type
// Make the div behave like a button
.btn-group,
.btn-group-vertical {
position: relative;
display: inline-flex;
vertical-align: middle; // match .btn alignment given font-size hack above
> .btn {
position: relative;
flex: 0 1 auto;
// Bring the hover, focused, and "active" buttons to the front to overlay
// the borders properly
@include hover {
z-index: 1;
}
&:focus,
&:active,
&.active {
z-index: 1;
}
}
// Prevent double borders when buttons are next to each other
.btn + .btn,
.btn + .btn-group,
.btn-group + .btn,
.btn-group + .btn-group {
margin-left: -$btn-border-width;
}
}
// Optional: Group multiple button groups together for a toolbar
.btn-toolbar {
display: flex;
flex-wrap: wrap;
justify-content: flex-start;
.input-group {
width: auto;
}
}
.btn-group {
> .btn:first-child {
margin-left: 0;
}
// Reset rounded corners
> .btn:not(:last-child):not(.dropdown-toggle),
> .btn-group:not(:last-child) > .btn {
@include border-right-radius(0);
}
> .btn:not(:first-child),
> .btn-group:not(:first-child) > .btn {
@include border-left-radius(0);
}
}
// Sizing
//
// Remix the default button sizing classes into new ones for easier manipulation.
.btn-group-sm > .btn { @extend .btn-sm; }
.btn-group-lg > .btn { @extend .btn-lg; }
//
// Split button dropdowns
//
.dropdown-toggle-split {
padding-right: $btn-padding-x * .75;
padding-left: $btn-padding-x * .75;
&::after {
margin-left: 0;
}
}
.btn-sm + .dropdown-toggle-split {
padding-right: $btn-padding-x-sm * .75;
padding-left: $btn-padding-x-sm * .75;
}
.btn-lg + .dropdown-toggle-split {
padding-right: $btn-padding-x-lg * .75;
padding-left: $btn-padding-x-lg * .75;
}
// The clickable button for toggling the menu
// Set the same inset shadow as the :active state
.btn-group.show .dropdown-toggle {
@include box-shadow($btn-active-box-shadow);
// Show no shadow for `.btn-link` since it has no other button styles.
&.btn-link {
@include box-shadow(none);
}
}
//
// Vertical button groups
//
.btn-group-vertical {
flex-direction: column;
align-items: flex-start;
justify-content: center;
.btn,
.btn-group {
width: 100%;
}
> .btn + .btn,
> .btn + .btn-group,
> .btn-group + .btn,
> .btn-group + .btn-group {
margin-top: -$btn-border-width;
margin-left: 0;
}
// Reset rounded corners
> .btn:not(:last-child):not(.dropdown-toggle),
> .btn-group:not(:last-child) > .btn {
@include border-bottom-radius(0);
}
> .btn:not(:first-child),
> .btn-group:not(:first-child) > .btn {
@include border-top-radius(0);
}
}
// 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.
.btn-group-toggle {
> .btn,
> .btn-group > .btn {
margin-bottom: 0; // Override default `<label>` value
input[type="radio"],
input[type="checkbox"] {
position: absolute;
clip: rect(0, 0, 0, 0);
pointer-events: none;
}
}
}

143
sass/libs/bootstrap/_buttons.scss

@ -0,0 +1,143 @@
// stylelint-disable selector-no-qualifying-type
//
// Base styles
//
.btn {
display: inline-block;
font-weight: $btn-font-weight;
text-align: center;
white-space: nowrap;
vertical-align: middle;
user-select: none;
border: $btn-border-width solid transparent;
@include button-size($btn-padding-y, $btn-padding-x, $font-size-base, $btn-line-height, $btn-border-radius);
@include transition($btn-transition);
// Share hover and focus styles
@include hover-focus {
text-decoration: none;
}
&:focus,
&.focus {
outline: 0;
box-shadow: $btn-focus-box-shadow;
}
// Disabled comes first so active can properly restyle
&.disabled,
&:disabled {
opacity: $btn-disabled-opacity;
@include box-shadow(none);
}
// Opinionated: add "hand" cursor to non-disabled .btn elements
&:not(:disabled):not(.disabled) {
cursor: pointer;
}
&:not(:disabled):not(.disabled):active,
&:not(:disabled):not(.disabled).active {
background-image: none;
@include box-shadow($btn-active-box-shadow);
&:focus {
@include box-shadow($btn-focus-box-shadow, $btn-active-box-shadow);
}
}
}
// Future-proof disabling of clicks on `<a>` elements
a.btn.disabled,
fieldset:disabled a.btn {
pointer-events: none;
}
//
// Alternate buttons
//
@each $color, $value in $theme-colors {
.btn-#{$color} {
@include button-variant($value, $value);
}
}
@each $color, $value in $theme-colors {
.btn-outline-#{$color} {
@include button-outline-variant($value);
}
}
//
// Link buttons
//
// Make a button look and behave like a link
.btn-link {
font-weight: $font-weight-normal;
color: $link-color;
background-color: transparent;
@include hover {
color: $link-hover-color;
text-decoration: $link-hover-decoration;
background-color: transparent;
border-color: transparent;
}
&:focus,
&.focus {
text-decoration: $link-hover-decoration;
border-color: transparent;
box-shadow: none;
}
&:disabled,
&.disabled {
color: $btn-link-disabled-color;
}
// No need for an active state here
}
//
// Button Sizes
//
.btn-lg {
@include button-size($btn-padding-y-lg, $btn-padding-x-lg, $font-size-lg, $btn-line-height-lg, $btn-border-radius-lg);
}
.btn-sm {
@include button-size($btn-padding-y-sm, $btn-padding-x-sm, $font-size-sm, $btn-line-height-sm, $btn-border-radius-sm);
}
//
// Block button
//
.btn-block {
display: block;
width: 100%;
// Vertically space out multiple block buttons
+ .btn-block {
margin-top: $btn-block-spacing-y;
}
}
// Specificity overrides
input[type="submit"],
input[type="reset"],
input[type="button"] {
&.btn-block {
width: 100%;
}
}

270
sass/libs/bootstrap/_card.scss

@ -0,0 +1,270 @@
//
// Base styles
//
.card {
position: relative;
display: flex;
flex-direction: column;
min-width: 0;
word-wrap: break-word;
background-color: $card-bg;
background-clip: border-box;
border: $card-border-width solid $card-border-color;
@include border-radius($card-border-radius);
> hr {
margin-right: 0;
margin-left: 0;
}
> .list-group:first-child {
.list-group-item:first-child {
@include border-top-radius($card-border-radius);
}
}
> .list-group:last-child {
.list-group-item:last-child {
@include border-bottom-radius($card-border-radius);
}
}
}
.card-body {
// Enable `flex-grow: 1` for decks and groups so that card blocks take up
// as much space as possible, ensuring footers are aligned to the bottom.
flex: 1 1 auto;
padding: $card-spacer-x;
}
.card-title {
margin-bottom: $card-spacer-y;
}
.card-subtitle {
margin-top: -($card-spacer-y / 2);
margin-bottom: 0;
}
.card-text:last-child {
margin-bottom: 0;
}
.card-link {
@include hover {
text-decoration: none;
}
+ .card-link {
margin-left: $card-spacer-x;
}
}
//
// Optional textual caps
//
.card-header {
padding: $card-spacer-y $card-spacer-x;
margin-bottom: 0; // Removes the default margin-bottom of <hN>
background-color: $card-cap-bg;
border-bottom: $card-border-width solid $card-border-color;
&:first-child {
@include border-radius($card-inner-border-radius $card-inner-border-radius 0 0);
}
+ .list-group {
.list-group-item:first-child {
border-top: 0;
}
}
}
.card-footer {
padding: $card-spacer-y $card-spacer-x;
background-color: $card-cap-bg;
border-top: $card-border-width solid $card-border-color;
&:last-child {
@include border-radius(0 0 $card-inner-border-radius $card-inner-border-radius);
}
}
//
// Header navs
//
.card-header-tabs {
margin-right: -($card-spacer-x / 2);
margin-bottom: -$card-spacer-y;
margin-left: -($card-spacer-x / 2);
border-bottom: 0;
}
.card-header-pills {
margin-right: -($card-spacer-x / 2);
margin-left: -($card-spacer-x / 2);
}
// Card image
.card-img-overlay {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
padding: $card-img-overlay-padding;
}
.card-img {
width: 100%; // Required because we use flexbox and this inherently applies align-self: stretch
@include border-radius($card-inner-border-radius);
}
// Card image caps
.card-img-top {
width: 100%; // Required because we use flexbox and this inherently applies align-self: stretch
@include border-top-radius($card-inner-border-radius);
}
.card-img-bottom {
width: 100%; // Required because we use flexbox and this inherently applies align-self: stretch
@include border-bottom-radius($card-inner-border-radius);
}
// Card deck
.card-deck {
display: flex;
flex-direction: column;
.card {
margin-bottom: $card-deck-margin;
}
@include media-breakpoint-up(sm) {
flex-flow: row wrap;
margin-right: -$card-deck-margin;
margin-left: -$card-deck-margin;
.card {
display: flex;
// Flexbugs #4: https://github.com/philipwalton/flexbugs#4-flex-shorthand-declarations-with-unitless-flex-basis-values-are-ignored
flex: 1 0 0%;
flex-direction: column;
margin-right: $card-deck-margin;
margin-bottom: 0; // Override the default
margin-left: $card-deck-margin;
}
}
}
//
// Card groups
//
.card-group {
display: flex;
flex-direction: column;
// The child selector allows nested `.card` within `.card-group`
// to display properly.
> .card {
margin-bottom: $card-group-margin;
}
@include media-breakpoint-up(sm) {
flex-flow: row wrap;
// The child selector allows nested `.card` within `.card-group`
// to display properly.
> .card {
// Flexbugs #4: https://github.com/philipwalton/flexbugs#4-flex-shorthand-declarations-with-unitless-flex-basis-values-are-ignored
flex: 1 0 0%;
margin-bottom: 0;
+ .card {
margin-left: 0;
border-left: 0;
}
// Handle rounded corners
@if $enable-rounded {
&:first-child {
@include border-right-radius(0);
.card-img-top,
.card-header {
border-top-right-radius: 0;
}
.card-img-bottom,
.card-footer {
border-bottom-right-radius: 0;
}
}
&:last-child {
@include border-left-radius(0);
.card-img-top,
.card-header {
border-top-left-radius: 0;
}
.card-img-bottom,
.card-footer {
border-bottom-left-radius: 0;
}
}
&:only-child {
@include border-radius($card-border-radius);
.card-img-top,
.card-header {
@include border-top-radius($card-border-radius);
}
.card-img-bottom,
.card-footer {
@include border-bottom-radius($card-border-radius);
}
}
&:not(:first-child):not(:last-child):not(:only-child) {
@include border-radius(0);
.card-img-top,
.card-img-bottom,
.card-header,
.card-footer {
@include border-radius(0);
}
}
}
}
}
}
//
// Columns
//
.card-columns {
.card {
margin-bottom: $card-columns-margin;
}
@include media-breakpoint-up(sm) {
column-count: $card-columns-count;
column-gap: $card-columns-gap;
.card {
display: inline-block; // Don't let them vertically span multiple columns
width: 100%; // Don't let their width change
}
}
}

191
sass/libs/bootstrap/_carousel.scss

@ -0,0 +1,191 @@
// Wrapper for the slide container and indicators
.carousel {
position: relative;
}
.carousel-inner {
position: relative;
width: 100%;
overflow: hidden;
}
.carousel-item {
position: relative;
display: none;
align-items: center;
width: 100%;
@include transition($carousel-transition);
backface-visibility: hidden;
perspective: 1000px;
}
.carousel-item.active,
.carousel-item-next,
.carousel-item-prev {
display: block;
}
.carousel-item-next,
.carousel-item-prev {
position: absolute;
top: 0;
}
// CSS3 transforms when supported by the browser
.carousel-item-next.carousel-item-left,
.carousel-item-prev.carousel-item-right {
transform: translateX(0);
@supports (transform-style: preserve-3d) {
transform: translate3d(0, 0, 0);
}
}
.carousel-item-next,
.active.carousel-item-right {
transform: translateX(100%);
@supports (transform-style: preserve-3d) {
transform: translate3d(100%, 0, 0);
}
}
.carousel-item-prev,
.active.carousel-item-left {
transform: translateX(-100%);
@supports (transform-style: preserve-3d) {
transform: translate3d(-100%, 0, 0);
}
}
//
// Left/right controls for nav
//
.carousel-control-prev,
.carousel-control-next {
position: absolute;
top: 0;
bottom: 0;
// Use flex for alignment (1-3)
display: flex; // 1. allow flex styles
align-items: center; // 2. vertically center contents
justify-content: center; // 3. horizontally center contents
width: $carousel-control-width;
color: $carousel-control-color;
text-align: center;
opacity: $carousel-control-opacity;
// We can't have a transition here because WebKit cancels the carousel
// animation if you trip this while in the middle of another animation.
// Hover/focus state
@include hover-focus {
color: $carousel-control-color;
text-decoration: none;
outline: 0;
opacity: .9;
}
}
.carousel-control-prev {
left: 0;
@if $enable-gradients {
background: linear-gradient(90deg, rgba(0, 0, 0, .25), rgba(0, 0, 0, .001));
}
}
.carousel-control-next {
right: 0;
@if $enable-gradients {
background: linear-gradient(270deg, rgba(0, 0, 0, .25), rgba(0, 0, 0, .001));
}
}
// Icons for within
.carousel-control-prev-icon,
.carousel-control-next-icon {
display: inline-block;
width: $carousel-control-icon-width;
height: $carousel-control-icon-width;
background: transparent no-repeat center center;
background-size: 100% 100%;
}
.carousel-control-prev-icon {
background-image: $carousel-control-prev-icon-bg;
}
.carousel-control-next-icon {
background-image: $carousel-control-next-icon-bg;
}
// Optional indicator pips
//
// Add an ordered list with the following class and add a list item for each
// slide your carousel holds.
.carousel-indicators {
position: absolute;
right: 0;
bottom: 10px;
left: 0;
z-index: 15;
display: flex;
justify-content: center;
padding-left: 0; // override <ol> default
// Use the .carousel-control's width as margin so we don't overlay those
margin-right: $carousel-control-width;