Skip to content
Snippets Groups Projects
Commit 407b09a8 authored by Pierre-Jean CHANCELLIER's avatar Pierre-Jean CHANCELLIER
Browse files

Bootstrap 5.1 installation

parent ef412dc1
No related branches found
No related tags found
No related merge requests found
Hide whitespace changes
Inline Side-by-side
Showing
with 184 additions and 108 deletions
assets/css/_bootstrap.scss
+ 32
− 16
View file @ 407b09a8
/*!
* Bootstrap v5.1.3 (https://getbootstrap.com/)
* Copyright 2011-2021 The Bootstrap Authors
* Copyright 2011-2021 Twitter, Inc.
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
*/
// scss-docs-start import-stack
// Configuration
@import "~bootstrap/scss/functions"; @import "~bootstrap/scss/functions";
@import "~bootstrap/scss/variables"; @import "~bootstrap/scss/variables";
@import "~bootstrap/scss/mixins"; @import "~bootstrap/scss/mixins";
@import "~bootstrap/scss/utilities";
// Layout & components
@import "~bootstrap/scss/root"; @import "~bootstrap/scss/root";
@import "~bootstrap/scss/reboot"; @import "~bootstrap/scss/reboot";
@import "~bootstrap/scss/type"; @import "~bootstrap/scss/type";
@import "~bootstrap/scss/images"; @import "~bootstrap/scss/images";
@import "~bootstrap/scss/code"; @import "~bootstrap/scss/containers";
@import "~bootstrap/scss/grid"; @import "~bootstrap/scss/grid";
@import "~bootstrap/scss/tables"; @import "~bootstrap/scss/tables";
@import "~bootstrap/scss/forms"; @import "~bootstrap/scss/forms";
@import "~bootstrap/scss/buttons"; @import "~bootstrap/scss/buttons";
@import "~bootstrap/scss/transitions"; @import "~bootstrap/scss/transitions";
// @import "~bootstrap/scss/dropdown"; // @import "~bootstrap/scss/dropdown";
// @import "~bootstrap/scss/button-group"; // @import "~bootstrap/scss/button-group";
@import "~bootstrap/scss/input-group";
// @import "~bootstrap/scss/custom-forms";
@import "~bootstrap/scss/nav"; @import "~bootstrap/scss/nav";
@import "~bootstrap/scss/navbar"; @import "~bootstrap/scss/navbar";
@import "~bootstrap/scss/card"; @import "~bootstrap/scss/card";
@import "~bootstrap/scss/accordion";
@import "~bootstrap/scss/breadcrumb"; @import "~bootstrap/scss/breadcrumb";
// @import "~bootstrap/scss/pagination"; // @import "~bootstrap/scss/pagination";
@import "~bootstrap/scss/badge"; @import "~bootstrap/scss/badge";
// @import "~bootstrap/scss/jumbotron";
@import "~bootstrap/scss/alert"; @import "~bootstrap/scss/alert";
// @import "~bootstrap/scss/progress"; // @import "~bootstrap/scss/progress";
// @import "~bootstrap/scss/media";
@import "~bootstrap/scss/list-group"; @import "~bootstrap/scss/list-group";
@import "~bootstrap/scss/close"; @import "~bootstrap/scss/close";
// @import "~bootstrap/scss/toasts"; // @import "~bootstrap/scss/toasts";
// @import "~bootstrap/scss/modal"; // @import "~bootstrap/scss/modal";
@import "~bootstrap/scss/tooltip"; @import "~bootstrap/scss/tooltip";
// @import "~bootstrap/scss/popover"; // @import "~bootstrap/scss/popover";
// @import "~bootstrap/scss/carousel"; // @import "~bootstrap/scss/carousel";
// @import "~bootstrap/scss/spinners"; // @import "~bootstrap/scss/spinners";
@import "~bootstrap/scss/utilities"; @import "~bootstrap/scss/offcanvas";
@import "~bootstrap/scss/print"; // TODO : A tester
// @import "~bootstrap/scss/placeholders";
// Helpers
@import "~bootstrap/scss/helpers";
// Utilities
@import "~bootstrap/scss/utilities/api";
assets/css/style _back.scss 0 → 100644
+ 110
− 0
View file @ 407b09a8
// Bootstrap variables customisation
// Fonts & Typo
$link-hover-decoration: none;
$text-muted: var(--text-secondary-color);
$enable-responsive-font-sizes: true;
$font-family-base: Montserrat, Helvetica, Arial, serif;
$small-font-size: 70%;
// Body
$body-bg: var(--background-color-primary);
$body-color: var(--text-primary-color);
// Tables;
$table-border-color: var(--background-color-primary);
$table-cell-padding: 0.5rem;
$table-bg: var(--background-color-primary);
$table-color: var(--text-primary-color);
$table-head-bg: var(--background-color-secondary);
$table-head-color: var(--text-primary-color);
$table-hover-bg: rgba(0, 0, 255, 0.075);
// Breadcrumb
$breadcrumb-bg: var(--background-color-secondary);
$breadcrumb-active-color: var(--text-primary-color);
$breadcrumb-divider-color: var(--text-primary-color);
// List-groups
$list-group-bg: var(--background-color-secondary);
$list-group-active-bg: rgba(0, 0, 255, 0.075);
$list-group-active-color: var(--text-primary-color);
$list-group-action-hover-color: var(--text-secondary-color);
$list-group-action-color: var(--text-primary-color);
// Cards
$card-bg: var(--background-color-secondary);
// Close button
$close-color: var(--text-primary-color);
$close-font-weight: 500;
// Mark
$mark-padding: 0.2em 0;
$mark-bg: yellow;
// Colors
$info: #0a8299;
@import "font";
@import "bootstrap";
.btn:disabled {
cursor: not-allowed;
}
.table {
&-fixed {
table-layout: fixed;
}
&.sortable thead {
tr {
border-left: 1px solid var(--text-primary-color);
}
th {
border-right: 1px solid;
border-top: 1px solid;
border-bottom: 1px solid;
}
}
tbody tr > * {
vertical-align: middle;
}
&-hover tbody tr {
cursor: pointer;
}
.td-date {
width: 165px;
}
}
.list-group-item {
&-action:not(.active) {
&:hover {
background: rgba(0, 0, 255, 0.075);
color: var(--text-primary-color);
}
}
.menu-item {
transition: left 0.3s ease-in-out;
left: 0;
&::before {
content: "›";
position: relative;
left: -0.5em;
}
&:hover {
left: 0.5em;
}
}
}
.icon {
width: 1.15rem;
}
assets/css/style.scss
+ 0
− 47
View file @ 407b09a8
// Bootstrap variables customisation
// Fonts & Typo
$link-hover-decoration: none;
$text-muted: var(--text-secondary-color);
$enable-responsive-font-sizes: true;
$font-family-base: Montserrat, Helvetica, Arial, serif;
$small-font-size: 70%;
// Body
$body-bg: var(--background-color-primary);
$body-color: var(--text-primary-color);
// Tables;
$table-border-color: var(--background-color-primary);
$table-cell-padding: 0.5rem;
$table-bg: var(--background-color-primary);
$table-color: var(--text-primary-color);
$table-head-bg: var(--background-color-secondary);
$table-head-color: var(--text-primary-color);
$table-hover-bg: rgba(0, 0, 255, 0.075);
// Breadcrumb
$breadcrumb-bg: var(--background-color-secondary);
$breadcrumb-active-color: var(--text-primary-color);
$breadcrumb-divider-color: var(--text-primary-color);
// List-groups
$list-group-bg: var(--background-color-secondary);
$list-group-active-bg: rgba(0, 0, 255, 0.075);
$list-group-active-color: var(--text-primary-color);
$list-group-action-hover-color: var(--text-secondary-color);
$list-group-action-color: var(--text-primary-color);
// Cards
$card-bg: var(--background-color-secondary);
// Close button
$close-color: var(--text-primary-color);
$close-font-weight: 500;
// Mark
$mark-padding: 0.2em 0;
$mark-bg: yellow;
// Colors
$info: #0a8299;
@import "font"; @import "font";
@import "bootstrap"; @import "bootstrap";
......
components/btn/Clipboard.vue
+ 8
− 8
View file @ 407b09a8
...@@ -28,14 +28,14 @@ export default { ...@@ -28,14 +28,14 @@ export default {
methods: { methods: {
copyText() { copyText() {
navigator.clipboard.writeText(this.textContent) navigator.clipboard.writeText(this.textContent)
$("#btncopy").tooltip({ // $("#btncopy").tooltip({
title: this.$t("copie") + " !", // title: this.$t("copie") + " !",
trigger: "manual" // trigger: "manual"
}) // })
$("#btncopy").tooltip("show") // $("#btncopy").tooltip("show")
setTimeout(() => { // setTimeout(() => {
$("#btncopy").tooltip("hide") // $("#btncopy").tooltip("hide")
}, 1000) // }, 1000)
} }
} }
} }
......
layouts/default.vue
+ 11
− 10
View file @ 407b09a8
...@@ -3,7 +3,7 @@ ...@@ -3,7 +3,7 @@
<NavigationBar :breadcrumb="breadcrumb" :menus="menus" /> <NavigationBar :breadcrumb="breadcrumb" :menus="menus" />
<Nuxt /> <Nuxt />
<a <a
class="scrollToTop bg-info position-fixed text-white d-flex align-items-center justify-content-center rounded" class="scrollToTop fade bg-info position-fixed text-white d-flex align-items-center justify-content-center rounded"
href="#" href="#"
@click="scrollToTop($event)"> @click="scrollToTop($event)">
<outline-chevron-double-up-icon class="icon" /> <outline-chevron-double-up-icon class="icon" />
...@@ -49,16 +49,13 @@ export default { ...@@ -49,16 +49,13 @@ export default {
} }
}, },
beforeMount() { beforeMount() {
let animated = false
window.addEventListener("scroll", function (e) { window.addEventListener("scroll", function (e) {
if (window.scrollY > 250 && !animated) { let scrollClassList = document.querySelector(".scrollToTop").classList
$(".scrollToTop").css("right", "1rem") let visible = scrollClassList.contains("show")
} else { if (!visible && window.scrollY > 250) {
animated = true scrollClassList.add("show")
setTimeout(function () { } else if (visible && window.scrollY <= 250) {
animated = false scrollClassList.remove("show")
}, 300)
$(".scrollToTop").css("right", "-4rem")
} }
}) })
}, },
...@@ -129,6 +126,10 @@ main { ...@@ -129,6 +126,10 @@ main {
opacity: 0.7; opacity: 0.7;
transition: all 0.3s ease-in; transition: all 0.3s ease-in;
&.show {
right: 1rem;
}
&:hover { &:hover {
opacity: 1; opacity: 1;
} }
......
nuxt.config.js
+ 2
− 6
View file @ 407b09a8
...@@ -34,7 +34,7 @@ export default { ...@@ -34,7 +34,7 @@ export default {
plugins: [ plugins: [
"~plugins/favourites.js", "~plugins/favourites.js",
"~plugins/filters.js", "~plugins/filters.js",
"~plugins/bootstrap.js" { src: "~/plugins/bootstrap.js", mode: "client" }
], ],
// Auto import components: https://go.nuxtjs.dev/config-components // Auto import components: https://go.nuxtjs.dev/config-components
...@@ -129,10 +129,6 @@ export default { ...@@ -129,10 +129,6 @@ export default {
// Build Configuration: https://go.nuxtjs.dev/config-build // Build Configuration: https://go.nuxtjs.dev/config-build
build: { build: {
plugins: [ plugins: []
new webpack.ProvidePlugin({
$: "jquery"
})
]
} }
} }
package.json
+ 1
− 1
View file @ 407b09a8
...@@ -21,7 +21,7 @@ ...@@ -21,7 +21,7 @@
"@nuxtjs/pwa": "^3.3.5", "@nuxtjs/pwa": "^3.3.5",
"apollo-link-context": "^1.0.20", "apollo-link-context": "^1.0.20",
"apollo-link-http": "^1.5.17", "apollo-link-http": "^1.5.17",
"bootstrap": "^4.6.1", "bootstrap": "^5.1.3",
"core-js": "^3.15.1", "core-js": "^3.15.1",
"graphql-tag": "^2.12.6", "graphql-tag": "^2.12.6",
"nuxt": "^2.15.8", "nuxt": "^2.15.8",
......
pages/lexique.vue
+ 6
− 4
View file @ 407b09a8
...@@ -122,10 +122,12 @@ export default { ...@@ -122,10 +122,12 @@ export default {
}, },
beforeMount() { beforeMount() {
window.addEventListener("scroll", function (e) { window.addEventListener("scroll", function (e) {
if (window.scrollY > 20) { let scrollClassList = document.querySelector(".rech-lexique").classList
$(".rech-lexique").addClass("reduced") let reduced = scrollClassList.contains("reduced")
} else { if (!reduced && window.scrollY > 20) {
$(".rech-lexique").removeClass("reduced") scrollClassList.add("reduced")
} else if (reduced && window.scrollY <= 20) {
scrollClassList.remove("reduced")
} }
}) })
}, },
......
plugins/bootstrap.js
+ 1
− 3
View file @ 407b09a8
if (process.browser) { import bootstrap from "bootstrap"
require("bootstrap")
}
\ No newline at end of file
plugins/favourites.js
+ 13
− 13
View file @ 407b09a8
...@@ -6,20 +6,20 @@ export default (context, inject) => { ...@@ -6,20 +6,20 @@ export default (context, inject) => {
: [] : []
let toggleFavourite = (uid, e) => { let toggleFavourite = (uid, e) => {
$(e.target).tooltip({ // $(e.target).tooltip({
title: function () { // title: function () {
return context.$favourites.list.includes(uid) // return context.$favourites.list.includes(uid)
? context.app.i18n.t("favoris.supprime") // ? context.app.i18n.t("favoris.supprime")
: context.app.i18n.t("favoris.enregistre") // : context.app.i18n.t("favoris.enregistre")
}, // },
html: true, // html: true,
trigger: "manual" // trigger: "manual"
}) // })
$(e.target).tooltip("show") // $(e.target).tooltip("show")
setTimeout(() => { // setTimeout(() => {
$(e.target).tooltip("hide") // $(e.target).tooltip("hide")
}, 600) // }, 600)
if (!context.$favourites.list.includes(uid)) { if (!context.$favourites.list.includes(uid)) {
context.$favourites.list.push(uid) context.$favourites.list.push(uid)
......
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment