forge-joniko/ldc-gen-game-web
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

style: update back-office and base SCSS styles

Browse source
This commit is contained in:
Jérémy Munsch 2026-07-20 17:53:16 +02:00
parent eaa9303445
commit c40b80dd79
Signed by: forge-joniko
GPG key ID: D7EFE2F5CB6CC0E4
7 changed files with 130 additions and 129 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
resources/sass/base/_bootstrap-overload.scss
View file

@ -1,4 +1,4 @@
.nav-link.active {
color: $primary;
font-weight: bold;
color: $primary;
font-weight: bold;
}

72
resources/sass/base/_common.scss
View file

@ -1,65 +1,65 @@
// * LAYOUT
body {
> main {
min-height: calc(100vh - #{$bo-header-height} - #{$bo-footer-height});
margin-top: $bo-header-height;
}
> main {
min-height: calc(100vh - #{$bo-header-height} - #{$bo-footer-height});
margin-top: $bo-header-height;
}
> footer {
box-shadow: 0 -0.125rem 0.25rem rgb(0 0 0 / 7.5%) !important;
}
> footer {
box-shadow: 0 -0.125rem 0.25rem rgb(0 0 0 / 7.5%) !important;
}
}
// * OTHERS
.table {
&-fix-action {
th:last-child,
td:last-child {
position: sticky;
right: 0;
width: 0;
background-color: rgb(var(--bs-secondary-bg-rgb));
color: rgb(var(--bs-body-color));
white-space: nowrap;
}
&-fix-action {
th:last-child,
td:last-child {
position: sticky;
right: 0;
width: 0;
background-color: rgb(var(--bs-secondary-bg-rgb));
color: rgb(var(--bs-body-color));
white-space: nowrap;
}
}
.text-ellipsis {
overflow: hidden;
width: 20rem;
text-overflow: ellipsis;
white-space: nowrap;
}
.text-ellipsis {
overflow: hidden;
width: 20rem;
text-overflow: ellipsis;
white-space: nowrap;
}
&-col-sorter {
height: 3rem;
}
&-col-sorter {
height: 3rem;
}
}
.w-fit {
width: fit-content;
width: fit-content;
}
.btn-md {
height: 38px;
height: 38px;
}
.btn-sm {
height: 31px;
height: 31px;
}
.pagination-custom .dropdown-menu {
overflow: auto;
min-width: 5rem;
max-height: 178px;
overflow: auto;
min-width: 5rem;
max-height: 178px;
}
.need-word-counter-password {
border-radius: 0 0 0 0.375rem !important;
border-radius: 0 0 0 0.375rem !important;
&-btn {
border-radius: 0 0 0.375rem !important;
}
&-btn {
border-radius: 0 0 0.375rem !important;
}
}

12
resources/sass/bo.scss
View file

@ -1,15 +1,15 @@
@charset "UTF-8";
// * UTILITIES
@import "./utilities/variables";
@import './utilities/variables';
// * VENDOR
@import "./vendor/bootstrap";
@import './vendor/bootstrap';
// * Add ckContent here because front is not responsible for the ck editor version
@import "./vendor/ckEditorContent";
@import './vendor/ckEditorContent';
// * BASE
@import "./base/bootstrap-overload";
@import "./base/fonts";
@import "./base/common";
@import './base/bootstrap-overload';
@import './base/fonts';
@import './base/common';

61
resources/sass/utilities/_bootstrap-custom.scss
View file

@ -1,36 +1,37 @@
@use "sass:list";
@import "mixins";
@use 'sass:list';
@use 'sass:map';
@import 'mixins';
// SET SOME CLASSES WITH BOOTSTRAP BREAKPOINTS
@each $breakpoint in map-keys($grid-breakpoints) {
@include media-breakpoint-up($breakpoint) {
$infix: breakpoint-infix($breakpoint, $grid-breakpoints);
@each $breakpoint in map.keys($grid-breakpoints) {
@include media-breakpoint-up($breakpoint) {
$infix: breakpoint-infix($breakpoint, $grid-breakpoints);
@include generate-bs-borders($infix, $prefix);
@include generate-bs-borders($infix, $prefix);
.w#{$infix}-25 {
width: 25% !important;
}
.w#{$infix}-50 {
width: 50% !important;
}
.w#{$infix}-75 {
width: 75% !important;
}
.w#{$infix}-100 {
width: 100% !important;
}
@each $prop, $unit in (width: vw, height: vh) {
@each $size in [25, 50, 75, 100] {
.#{$unit}#{$infix}-#{$size} {
#{$prop}: #{$size}#{$unit} !important;
}
}
}
@each $color, $value in $theme-colors {
@include generate-bs-borders($infix, $prefix, $color);
}
.w#{$infix}-25 {
width: 25% !important;
}
.w#{$infix}-50 {
width: 50% !important;
}
.w#{$infix}-75 {
width: 75% !important;
}
.w#{$infix}-100 {
width: 100% !important;
}
@each $prop, $unit in (width: vw, height: vh) {
@each $size in [25, 50, 75, 100] {
.#{$unit}#{$infix}-#{$size} {
#{$prop}: #{$size}#{$unit} !important;
}
}
}
@each $color, $value in $theme-colors {
@include generate-bs-borders($infix, $prefix, $color);
}
}
}

16
resources/sass/utilities/_bootstrap-variables.scss
View file

@ -8,14 +8,14 @@ $danger: $color-danger;
$light: $color-light;
$dark: $color-dark;
$theme-colors: (
primary: $primary,
secondary: $secondary,
success: $success,
info: $info,
warning: $warning,
danger: $danger,
light: $light,
dark: $dark,
primary: $primary,
secondary: $secondary,
success: $success,
info: $info,
warning: $warning,
danger: $danger,
light: $light,
dark: $dark,
);
// Override bootstrap vars

88
resources/sass/utilities/_mixins.scss
View file

@ -1,54 +1,54 @@
@mixin generate-bs-borders($infix, $prefix, $color:null) {
$color-var: var(--#{$prefix}border-color);
$color-var: var(--#{$prefix}border-color);
@if $color {
$color-var: rgba(var(--#{$prefix}#{$color}-rgb));
$color: "-#{$color}";
}
@if $color {
$color-var: rgb(var(--#{$prefix}#{$color}-rgb));
$color: '-#{$color}';
}
.border#{$infix}#{$color}-top {
border-top: $border-width var(--#{$prefix}border-style) #{$color-var} !important;
}
.border#{$infix}#{$color}-end {
border-right: $border-width var(--#{$prefix}border-style) #{$color-var} !important;
}
.border#{$infix}#{$color}-bottom {
border-bottom: $border-width var(--#{$prefix}border-style) #{$color-var} !important;
}
.border#{$infix}#{$color}-start {
border-left: $border-width var(--#{$prefix}border-style) #{$color-var} !important;
}
.border#{$infix}#{$color}-top {
border-top: $border-width var(--#{$prefix}border-style) #{$color-var} !important;
}
.border#{$infix}#{$color}-end {
border-right: $border-width var(--#{$prefix}border-style) #{$color-var} !important;
}
.border#{$infix}#{$color}-bottom {
border-bottom: $border-width var(--#{$prefix}border-style) #{$color-var} !important;
}
.border#{$infix}#{$color}-start {
border-left: $border-width var(--#{$prefix}border-style) #{$color-var} !important;
}
.border#{$infix}#{$color}-0 { border: 0 !important; }
.border#{$infix}#{$color}-top-0 { border-top: 0 !important; }
.border#{$infix}#{$color}-end-0 { border-right: 0 !important; }
.border#{$infix}#{$color}-bottom-0 { border-bottom: 0 !important; }
.border#{$infix}#{$color}-start-0 { border-left: 0 !important; }
.border#{$infix}#{$color}-0 { border: 0 !important; }
.border#{$infix}#{$color}-top-0 { border-top: 0 !important; }
.border#{$infix}#{$color}-end-0 { border-right: 0 !important; }
.border#{$infix}#{$color}-bottom-0 { border-bottom: 0 !important; }
.border#{$infix}#{$color}-start-0 { border-left: 0 !important; }
@each $idx, $b-width in $border-widths {
$pidx: list.index(($border-widths), ($idx $b-width));
@each $idx, $b-width in $border-widths {
$pidx: list.index(($border-widths), ($idx $b-width));
.border#{$infix}#{$color}-top-#{$idx} {
border-top: $b-width var(--#{$prefix}border-style) #{$color-var} !important;
}
.border#{$infix}#{$color}-end-#{$idx} {
border-right: $b-width var(--#{$prefix}border-style) #{$color-var} !important;
}
.border#{$infix}#{$color}-bottom-#{$idx} {
border-bottom: $b-width var(--#{$prefix}border-style) #{$color-var} !important;
}
.border#{$infix}#{$color}-start-#{$idx} {
border-left: $b-width var(--#{$prefix}border-style) #{$color-var} !important;
}
.border#{$infix}#{$color}-top-#{$idx} {
border-top: $b-width var(--#{$prefix}border-style) #{$color-var} !important;
}
.border#{$infix}#{$color}-x {
border-right: $border-width var(--#{$prefix}border-style) #{$color-var} !important;
border-left: $border-width var(--#{$prefix}border-style) #{$color-var} !important;
.border#{$infix}#{$color}-end-#{$idx} {
border-right: $b-width var(--#{$prefix}border-style) #{$color-var} !important;
}
.border#{$infix}#{$color}-y {
border-top: $border-width var(--#{$prefix}border-style) #{$color-var} !important;
border-bottom: $border-width var(--#{$prefix}border-style) #{$color-var} !important;
.border#{$infix}#{$color}-bottom-#{$idx} {
border-bottom: $b-width var(--#{$prefix}border-style) #{$color-var} !important;
}
.border#{$infix}#{$color}-start-#{$idx} {
border-left: $b-width var(--#{$prefix}border-style) #{$color-var} !important;
}
}
.border#{$infix}#{$color}-x {
border-right: $border-width var(--#{$prefix}border-style) #{$color-var} !important;
border-left: $border-width var(--#{$prefix}border-style) #{$color-var} !important;
}
.border#{$infix}#{$color}-y {
border-top: $border-width var(--#{$prefix}border-style) #{$color-var} !important;
border-bottom: $border-width var(--#{$prefix}border-style) #{$color-var} !important;
}
}

6
resources/sass/utilities/_variables.scss
View file

@ -10,9 +10,9 @@ $color-primary: #376eb2;
$color-secondary: #444d54;
// * FONTS
$font-default-family-base: system-ui, -apple-system, "Segoe UI", "Roboto",
"Helvetica Neue", "Arial", "Noto Sans", "Liberation Sans", sans-serif,
"Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; // - The default site font family.
$font-default-family-base: system-ui, -apple-system, 'Segoe UI', 'Roboto',
'Helvetica Neue', 'Arial', 'Noto Sans', 'Liberation Sans', sans-serif,
'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji'; // - The default site font family.
$font-default-size-base: 1rem; // Assumes the browser default, typically `16px`
$line-default-height-base: 1.5;