FreakU
/
Retrospring
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Replace Bootstrap 3 with Bootstrap 4

This commit is contained in:
Andreas Nedbal 2020-04-19 21:08:58 +02:00
parent b47c0deb48
commit 7f74e844f5
6 changed files with 25 additions and 29 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
Gemfile
View File

@ -19,8 +19,7 @@ gem 'jbuilder', '~> 2.10'
gem 'bcrypt', '~> 3.1.7' gem 'bcrypt', '~> 3.1.7'
gem 'haml', '~> 5.0' gem 'haml', '~> 5.0'
gem 'bootstrap-sass', '~> 3.4.0' gem 'bootstrap', '~> 4.4', '>= 4.4.1'
gem 'bootswatch-rails'
gem 'sweetalert-rails' gem 'sweetalert-rails'
gem 'will_paginate' gem 'will_paginate'
gem 'will_paginate-bootstrap' gem 'will_paginate-bootstrap'

13
Gemfile.lock
View File

@ -79,16 +79,15 @@ GEM
erubi (>= 1.0.0) erubi (>= 1.0.0)
rack (>= 0.9.0) rack (>= 0.9.0)
bindex (0.8.1) bindex (0.8.1)
bootstrap-sass (3.4.1) bootstrap (4.4.1)
autoprefixer-rails (>= 5.2.1) autoprefixer-rails (>= 9.1.0)
sassc (>= 2.0.0) popper_js (>= 1.14.3, < 2)
sassc-rails (>= 2.0.0)
bootstrap3-datetimepicker-rails (4.7.14) bootstrap3-datetimepicker-rails (4.7.14)
momentjs-rails (>= 2.8.1) momentjs-rails (>= 2.8.1)
bootstrap_form (4.4.0) bootstrap_form (4.4.0)
actionpack (>= 5.0) actionpack (>= 5.0)
activemodel (>= 5.0) activemodel (>= 5.0)
bootswatch-rails (3.3.5)
railties (>= 3.1)
brakeman (4.8.1) brakeman (4.8.1)
buftok (0.2.0) buftok (0.2.0)
builder (3.2.4) builder (3.2.4)
@ -331,6 +330,7 @@ GEM
capybara (>= 2.1, < 4) capybara (>= 2.1, < 4)
cliver (~> 0.3.1) cliver (~> 0.3.1)
websocket-driver (>= 0.2.0) websocket-driver (>= 0.2.0)
popper_js (1.16.0)
pry (0.13.1) pry (0.13.1)
coderay (~> 1.1) coderay (~> 1.1)
method_source (~> 1.0) method_source (~> 1.0)
@ -527,10 +527,9 @@ DEPENDENCIES
bcrypt (~> 3.1.7) bcrypt (~> 3.1.7)
bcrypt_pbkdf (>= 1.0, < 2.0) bcrypt_pbkdf (>= 1.0, < 2.0)
better_errors better_errors
bootstrap-sass (~> 3.4.0) bootstrap (~> 4.4, >= 4.4.1)
bootstrap3-datetimepicker-rails (~> 4.7.14) bootstrap3-datetimepicker-rails (~> 4.7.14)
bootstrap_form bootstrap_form
bootswatch-rails
brakeman brakeman
byebug byebug
capistrano (~> 3.8) capistrano (~> 3.8)

3
app/assets/javascripts/application.js.erb.coffee
View File

@ -1,8 +1,9 @@
#= require jquery #= require jquery3
#= require jquery_ujs #= require jquery_ujs
#= require jquery.turbolinks #= require jquery.turbolinks
#= require jquery.arctic_scroll #= require jquery.arctic_scroll
#= require turbolinks #= require turbolinks
#= require popper
#= require bootstrap #= require bootstrap
#= require nprogress #= require nprogress
#= require nprogress-turbolinks #= require nprogress-turbolinks

9
app/assets/stylesheets/application.css.scss
View File

@ -16,7 +16,7 @@ $font-family-serif: Georgia, "DejaVu Serif", "Times New Roman", Times, ser
$font-family-monospace: "PragmataPro", Monaco, "Ubuntu Mono", Menlo, "DejaVu Sans Mono", monospace; $font-family-monospace: "PragmataPro", Monaco, "Ubuntu Mono", Menlo, "DejaVu Sans Mono", monospace;
$font-family-base: $font-family-sans-serif; $font-family-base: $font-family-sans-serif;
$font-size-base: 14px; $font-size-base: 1rem;
$font-size-large: ceil(($font-size-base * 1.25)); // ~18px $font-size-large: ceil(($font-size-base * 1.25)); // ~18px
$font-size-small: ceil(($font-size-base * 0.85)); // ~12px $font-size-small: ceil(($font-size-base * 0.85)); // ~12px
@ -27,6 +27,7 @@ $font-size-h4: ceil(($font-size-base * 1.25)); // ~18px
$font-size-h5: $font-size-base; $font-size-h5: $font-size-base;
$font-size-h6: ceil(($font-size-base * 0.85)); // ~12px $font-size-h6: ceil(($font-size-base * 0.85)); // ~12px
$gray: #e2e2e2;
$brand-primary: #5e35b1; $brand-primary: #5e35b1;
$navbar-inverse-bg: #5e35b1; $navbar-inverse-bg: #5e35b1;
$navbar-inverse-link-color: #ffffff; $navbar-inverse-link-color: #ffffff;
@ -44,19 +45,15 @@ $navbar-inverse-toggle-hover-bg: #512da8;
$navbar-inverse-toggle-icon-bar-bg: #7e57c2; $navbar-inverse-toggle-icon-bar-bg: #7e57c2;
$navbar-inverse-toggle-border-color: #512da8; $navbar-inverse-toggle-border-color: #512da8;
@import "bootswatch/cosmo/variables";
@import "bootstrap"; @import "bootstrap";
body { padding-top: $navbar-height; } body { padding-top: 50px; }
@import 'bootstrap-datetimepicker'; @import 'bootstrap-datetimepicker';
.remove-native-picker::-webkit-calendar-picker-indicator{ .remove-native-picker::-webkit-calendar-picker-indicator{
display: none display: none
} }
@import "bootswatch/cosmo/bootswatch";
@import "base"; @import "base";
@import "font-awesome"; @import "font-awesome";

6
app/assets/stylesheets/base.css.scss
View File

@ -107,7 +107,7 @@ body {
} }
.j2-delete { .j2-delete {
color: $brand-danger; color: theme-color('danger');
text-decoration: none; text-decoration: none;
} }
@ -115,7 +115,7 @@ body {
margin-bottom: 0px; margin-bottom: 0px;
} }
@media (max-width: $screen-xs-max) { @include media-breakpoint-down(xs) {
.j2-col-reset { .j2-col-reset {
padding-left: 0px; padding-left: 0px;
padding-right: 0px; padding-right: 0px;
@ -277,7 +277,7 @@ body {
} }
.colored-icon:before { .colored-icon:before {
color: $brand-primary; color: theme-color('primary');
} }
.colored-icon { .colored-icon {

20
app/assets/stylesheets/scss/user.scss
View File

@ -42,8 +42,8 @@
} }
.profile--panel .panel-heading { .profile--panel .panel-heading {
color: $brand-primary; color: theme-color('primary');
border-bottom: 2px solid $brand-primary; border-bottom: 2px solid theme-color('primary');
background-color: #fff; background-color: #fff;
text-transform: uppercase; text-transform: uppercase;
} }
@ -53,15 +53,15 @@
} }
.inbox--panel .panel-heading { .inbox--panel .panel-heading {
color: $brand-info; color: theme-color('info');
border-bottom: 2px solid $brand-info; border-bottom: 2px solid theme-color('info');
background-color: #fff; background-color: #fff;
text-transform: uppercase; text-transform: uppercase;
} }
.warning--panel .panel-heading { .warning--panel .panel-heading {
color: $brand-danger; color: theme-color('danger');
border-bottom: 2px solid $brand-danger; border-bottom: 2px solid theme-color('danger');
background-color: #fff; background-color: #fff;
text-transform: uppercase; text-transform: uppercase;
} }
@ -87,11 +87,11 @@
color: #fff; color: #fff;
} }
$colours: danger $brand-danger, $colours: danger theme-color('danger'),
default #BBB, default #BBB,
success $brand-success, success theme-color('success'),
warning $brand-warning, warning theme-color('warning'),
primary $brand-primary, primary theme-color('primary'),
info #2980b9; info #2980b9;
@each $colour in $colours { @each $colour in $colours {