Skip to content

Commit 4dc4256

Browse files
committed
style: #1183 Conform new Bootstrap 4 design to the previous Bootstrap 3 one (atierant)
1 parent 46ee773 commit 4dc4256

File tree

8 files changed

+90
-56
lines changed

8 files changed

+90
-56
lines changed

assets/styles/_variables.scss

Lines changed: 15 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -7,11 +7,24 @@ $web-font-path: 'data:text/css;base64,';
77
//$icon-font-path: "~bootstrap-sass/assets/fonts/bootstrap/";
88
$lato-font-path: '~lato-font/fonts';
99

10-
$font-default: 17px;
10+
$font-default: 19px;
11+
1112
$font-heading: 2.5rem;
12-
$font-title: 1.85rem;
13+
$font-title: 2rem;
14+
$font-subtitle: 1.5rem;
1315

1416
$secondary-color: #ecf0f1;
1517
$gray-7500: #e9ecec;
1618

19+
$navbar-margin-bottom: 21px;
20+
21+
$table-cell-padding: 0.5rem;
22+
23+
$btn-padding-y-lg: 21px;
24+
$btn-padding-x-lg: 14px;
25+
$btn-padding-y: 15px;
26+
$btn-padding-x: 10px;
27+
$btn-padding-y-sm: 9px;
28+
$btn-padding-x-sm: 6px;
29+
1730
@import "~bootswatch/dist/flatly/variables";

assets/styles/app.scss

Lines changed: 69 additions & 48 deletions
Original file line numberDiff line numberDiff line change
@@ -46,15 +46,20 @@
4646

4747
// pick the Lato fonts individually to avoid importing the entire font family
4848
@import '~lato-font/scss/public-api';
49+
4950
@include lato-include-font('normal');
5051
@include lato-include-font('bold');
5152

5253
/* Basic styles
5354
------------------------------------------------------------------------- */
54-
h1 {
55+
h1, .h1 {
5556
font-size: $font-heading;
5657
}
5758

59+
h3, .h3 {
60+
font-size: $font-subtitle;
61+
}
62+
5863
p, ul, ol {
5964
font-size: $font-default;
6065
margin-bottom: 1.5em
@@ -64,13 +69,14 @@ strong {
6469
font-weight: bold;
6570
}
6671

67-
li {
72+
li:not(.nav-item) {
6873
margin-bottom: 0.5em
6974
}
7075

7176
code {
7277
background: $secondary-color;
7378
color: $blue;
79+
font-size: 90%;
7480
}
7581

7682
.text-danger, .text-danger:hover {
@@ -87,7 +93,7 @@ i {
8793
}
8894

8995
.doclink {
90-
color: inherit
96+
color: inherit
9197
}
9298

9399
a:hover {
@@ -104,12 +110,6 @@ a:hover {
104110

105111
/* Utilities
106112
------------------------------------------------------------------------- */
107-
.m-b-0 { margin-bottom: 0 }
108-
109-
.badge{
110-
padding: 0.25em 0.4em 0.27em 0.4em
111-
}
112-
113113
.jumbotron {
114114
padding: 1.5rem 1rem
115115
}
@@ -122,49 +122,59 @@ body {
122122
min-height: 100vh;
123123

124124
&:not(#homepage) {
125-
padding-top: 120px
125+
padding-top: 110px
126126
}
127127
}
128128

129129
header {
130-
margin-bottom: 2em;
130+
nav.navbar {
131131

132-
.nav-link {
133-
padding: 0 2rem;
134-
}
132+
margin-bottom: $navbar-margin-bottom;
135133

136-
.locales {
137-
min-width: 190px;
138-
max-height: 320px;
139-
overflow-y: scroll;
140-
141-
.dropdown-item {
142-
padding: 0.25rem 1rem;
143-
margin-bottom: 0;
144-
145-
&.active a,
146-
&.active small,
147-
&:hover a,
148-
&:hover small,
149-
a:hover{
150-
color: inherit;
151-
}
134+
.navbar-brand {
135+
padding: 0;
136+
}
137+
.navbar-toggler {
138+
padding: 0 $navbar-toggler-padding-x;
139+
}
152140

153-
a {
154-
color: $gray-900;
155-
156-
small {
157-
border-radius: 4px;
158-
border: 2px solid $gray-300;
159-
color: $gray-700;
160-
float: left;
161-
font-size: 12px;
162-
line-height: 1.1;
163-
margin: 2px 10px 0 0;
164-
min-width: 26px;
165-
padding: 0px 3px;
166-
text-align: center;
167-
text-transform: uppercase;
141+
.nav-link {
142+
padding: 0 2rem;
143+
}
144+
145+
.locales {
146+
min-width: 190px;
147+
max-height: 320px;
148+
overflow-y: scroll;
149+
150+
.dropdown-item {
151+
padding: 0.25rem 1rem;
152+
margin-bottom: 0;
153+
154+
&.active a,
155+
&.active small,
156+
&:hover a,
157+
&:hover small,
158+
a:hover {
159+
color: inherit;
160+
}
161+
162+
a {
163+
color: $gray-900;
164+
165+
small {
166+
border-radius: 4px;
167+
border: 2px solid $gray-300;
168+
color: $gray-700;
169+
float: left;
170+
font-size: 12px;
171+
line-height: 1.1;
172+
margin: 2px 10px 0 0;
173+
min-width: 26px;
174+
padding: 0 3px;
175+
text-align: center;
176+
text-transform: uppercase;
177+
}
168178
}
169179
}
170180
}
@@ -255,6 +265,10 @@ footer #footer-resources i {
255265

256266
/* Forms
257267
------------------------------------------------------------------------- */
268+
.form-control {
269+
height: 45px;
270+
}
271+
258272
.form-group.has-error .form-control {
259273
border-color: $red
260274
}
@@ -274,6 +288,7 @@ footer #footer-resources i {
274288
.form-group.has-error .help-block li {
275289
margin-bottom: 0
276290
}
291+
277292
.form-group.has-error .help-block li + li {
278293
margin-top: 0.5em;
279294
}
@@ -316,7 +331,7 @@ body#homepage {
316331
}
317332

318333
.jumbotron {
319-
padding: 48px 60px!important;
334+
padding: 48px 60px !important;
320335

321336
.btn {
322337
font-size: 19px;
@@ -357,7 +372,10 @@ body#login #login-users-help p .console {
357372
body#login .form-group-password {
358373
position: relative;
359374

360-
input { padding-right: 48px; }
375+
input {
376+
padding-right: 48px;
377+
}
378+
361379
button {
362380
background: transparent;
363381
border: 0;
@@ -379,10 +397,11 @@ body#login .form-group-password {
379397
}
380398

381399
.post-metadata {
382-
color: $gray-500;
400+
color: $gray-600;
383401
font-size: $font-default;
384402
margin-bottom: 16px;
385403
}
404+
386405
.post-metadata .metadata {
387406
margin-right: 1.5em;
388407
}
@@ -419,6 +438,7 @@ body#blog_index .post-tags .label-default {
419438
background-color: $gray-7500;
420439
color: #6d8283;
421440
}
441+
422442
body#blog_index .post-tags .label-default i {
423443
color: #a3b2b2;
424444
}
@@ -436,6 +456,7 @@ body#blog_post_show .post-tags .label-default {
436456
margin-right: 10px;
437457
padding: .4em 1em .5em;
438458
}
459+
439460
body#blog_post_show .post-tags .label-default i {
440461
color: #95A6A7;
441462
}

public/build/app.362b41a9.css

Lines changed: 0 additions & 1 deletion
This file was deleted.

public/build/app.c11f98f0.css

Lines changed: 1 addition & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

public/build/entrypoints.json

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@
99
],
1010
"css": [
1111
"/build/323.350bc330.css",
12-
"/build/app.362b41a9.css"
12+
"/build/app.c11f98f0.css"
1313
]
1414
},
1515
"admin": {
@@ -30,7 +30,7 @@
3030
"/build/323.832dd193.js": "sha384-wdtiAqXOhRXpGCWGrREc57H5PccwDJi5usOjIB9qKAgJ/pKHy8HzKQwZbX7UR6JF",
3131
"/build/app.66289e51.js": "sha384-gGGSOyghWGewAewTc6ZEDTDI+BeUOvn/XVTcB9JlFq5Q3V/Spmdp6rE+zlTIoSf/",
3232
"/build/323.350bc330.css": "sha384-ieyomRvEoNUU0mGkbZBIUAu3gECtNAm7HWIop5bEhnLLnBAUmmh8vu5xzn/yKV+y",
33-
"/build/app.362b41a9.css": "sha384-RNFoh+BzC4IP+pbBm49bDDH4fDuwas9Ft3QehnDvc6Jt0mx6PZPVUha9uQnUAkm3",
33+
"/build/app.c11f98f0.css": "sha384-Gh1aRKSs0jnDBpgRk3wgNn0/wYpemN/XfjY8G4MW1CK2X8M1qxpVRxDPnk6uP9Cz",
3434
"/build/384.7392c8fa.js": "sha384-BQ4GjY+bpPeoukwRuf5b3A5PaeaHu1zM55WrHoRKw2d6lAw0gnZJ/Wz1peQH+OtI",
3535
"/build/admin.223fd8e3.js": "sha384-AbTN7LsVgw9ZtWeN1zVDTzOa7oJfWP/yi2oAN25NXGc+Dd4RXoYDGL8a+peIUqfZ",
3636
"/build/admin.2b1a6c83.css": "sha384-ikQwASTRPK0sjWtW//EXsUjqkjNxc2Yndtt0m5a/I/qE+qEoikXP5ailZKDaqtN9"

public/build/manifest.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
{
2-
"build/app.css": "/build/app.362b41a9.css",
2+
"build/app.css": "/build/app.c11f98f0.css",
33
"build/app.js": "/build/app.66289e51.js",
44
"build/admin.css": "/build/admin.2b1a6c83.css",
55
"build/admin.js": "/build/admin.223fd8e3.js",

templates/admin/blog/index.html.twig

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@
55
{% block main %}
66
<h1>{{ 'title.post_list'|trans }}</h1>
77

8-
<table class="table table-striped table-middle-aligned">
8+
<table class="table table-striped table-middle-aligned table-borderless">
99
<thead>
1010
<tr>
1111
<th scope="col">{{ 'label.title'|trans }}</th>

templates/admin/blog/show.html.twig

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,7 @@
1111
</p>
1212

1313
<div class="jumbotron">
14-
<p class="m-b-0"><strong>{{ 'label.summary'|trans }}</strong>: {{ post.summary }}</p>
14+
<p class="mb-0"><strong>{{ 'label.summary'|trans }}</strong>: {{ post.summary }}</p>
1515
</div>
1616

1717
{{ post.content|markdown_to_html|sanitize_html }}

0 commit comments

Comments
 (0)