Skip to content

Commit 6dc5a2c

Browse files
committed
refactor: improve styles
1 parent f66763c commit 6dc5a2c

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

47 files changed

+114
-35
lines changed

src/pug/_partials/head.pug

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -31,6 +31,7 @@ link(rel='stylesheet' href='css/vendors/simplebar.css')
3131
// Main styles for this application
3232
link(href='css/style.css', rel='stylesheet')
3333

34+
// We use those styles to show code examples, you should remove them in your application.
3435
link(href='css/examples.css', rel='stylesheet')
3536

3637
script(src='js/config.js')

src/scss/_custom.scss

Lines changed: 1 addition & 29 deletions
Original file line numberDiff line numberDiff line change
@@ -1,29 +1 @@
1-
// Custom styles for this theme
2-
3-
.header > .container-fluid,
4-
.sidebar-header {
5-
min-height: calc(4rem + 1px); // stylelint-disable-line function-disallowed-list
6-
}
7-
8-
.header > .container-fluid + .container-fluid {
9-
min-height: 3rem;
10-
}
11-
12-
.sidebar-brand-full {
13-
margin-left: 3px;
14-
}
15-
16-
.sidebar-toggler {
17-
@include ltr-rtl("margin-left", auto);
18-
}
19-
20-
.sidebar-narrow,
21-
.sidebar-narrow-unfoldable:not(:hover) {
22-
.sidebar-toggler {
23-
@include ltr-rtl("margin-right", auto);
24-
}
25-
}
26-
27-
.footer {
28-
min-height: calc(3rem + 1px); // stylelint-disable-line function-disallowed-list
29-
}
1+
// Here you can add other styles

src/scss/_theme.scss

Lines changed: 64 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,64 @@
1+
body {
2+
background-color: var(--cui-tertiary-bg);
3+
}
4+
5+
.wrapper {
6+
width: 100%;
7+
@include ltr-rtl("padding-left", var(--cui-sidebar-occupy-start, 0));
8+
@include ltr-rtl("padding-right", var(--cui-sidebar-occupy-end, 0));
9+
will-change: auto;
10+
@include transition(padding .15s);
11+
}
12+
13+
.header > .container-fluid,
14+
.sidebar-header {
15+
min-height: calc(4rem + 1px); // stylelint-disable-line function-disallowed-list
16+
}
17+
18+
.sidebar-brand-full {
19+
margin-left: 3px;
20+
}
21+
22+
.sidebar-header {
23+
.nav-underline-border {
24+
--cui-nav-underline-border-link-padding-x: 1rem;
25+
--cui-nav-underline-border-gap: 0;
26+
}
27+
28+
.nav-link {
29+
display: flex;
30+
align-items: center;
31+
min-height: calc(4rem + 1px); // stylelint-disable-line function-disallowed-list
32+
}
33+
}
34+
35+
.sidebar-toggler {
36+
@include ltr-rtl("margin-left", auto);
37+
}
38+
39+
.sidebar-narrow,
40+
.sidebar-narrow-unfoldable:not(:hover) {
41+
.sidebar-toggler {
42+
@include ltr-rtl("margin-right", auto);
43+
}
44+
}
45+
46+
.header > .container-fluid + .container-fluid {
47+
min-height: 3rem;
48+
}
49+
50+
.footer {
51+
min-height: calc(3rem + 1px); // stylelint-disable-line function-disallowed-list
52+
}
53+
54+
@if $enable-dark-mode {
55+
@include color-mode(dark) {
56+
body {
57+
background-color: var(--cui-dark-bg-subtle);
58+
}
59+
60+
.footer {
61+
--cui-footer-bg: var(--cui-body-bg);
62+
}
63+
}
64+
}

src/scss/_variables.scss

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,5 +2,4 @@
22
//
33
// If you want to customize your project please add your variables below.
44

5-
$enable-deprecation-messages: false; /* stylelint-disable-line scss/dollar-variable-default */
6-
$enable-rtl: true; /* stylelint-disable-line scss/dollar-variable-default */
5+
$enable-deprecation-messages: false !default;

src/scss/style.scss

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -4,10 +4,11 @@
44
// Import styles
55
@import "@coreui/coreui/scss/coreui";
66

7-
@import "layout";
7+
// Vendors
8+
@import "vendors/simplebar";
89

9-
// Preview
10-
@import "examples";
10+
// Custom styles for this theme
11+
@import "theme";
1112

12-
// If you want to add custom CSS you can put it here.
13+
// If you want to add custom CSS you can put it here
1314
@import "custom";

src/views/404.html

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -39,6 +39,7 @@
3939
<link rel="stylesheet" href="css/vendors/simplebar.css">
4040
<!-- Main styles for this application-->
4141
<link href="css/style.css" rel="stylesheet">
42+
<!-- We use those styles to show code examples, you should remove them in your application.-->
4243
<link href="css/examples.css" rel="stylesheet">
4344
<script src="js/config.js"></script>
4445
<script src="js/color-modes.js"></script>

src/views/500.html

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -39,6 +39,7 @@
3939
<link rel="stylesheet" href="css/vendors/simplebar.css">
4040
<!-- Main styles for this application-->
4141
<link href="css/style.css" rel="stylesheet">
42+
<!-- We use those styles to show code examples, you should remove them in your application.-->
4243
<link href="css/examples.css" rel="stylesheet">
4344
<script src="js/config.js"></script>
4445
<script src="js/color-modes.js"></script>

src/views/base/accordion.html

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -39,6 +39,7 @@
3939
<link rel="stylesheet" href="css/vendors/simplebar.css">
4040
<!-- Main styles for this application-->
4141
<link href="css/style.css" rel="stylesheet">
42+
<!-- We use those styles to show code examples, you should remove them in your application.-->
4243
<link href="css/examples.css" rel="stylesheet">
4344
<script src="js/config.js"></script>
4445
<script src="js/color-modes.js"></script>

src/views/base/breadcrumb.html

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -39,6 +39,7 @@
3939
<link rel="stylesheet" href="css/vendors/simplebar.css">
4040
<!-- Main styles for this application-->
4141
<link href="css/style.css" rel="stylesheet">
42+
<!-- We use those styles to show code examples, you should remove them in your application.-->
4243
<link href="css/examples.css" rel="stylesheet">
4344
<script src="js/config.js"></script>
4445
<script src="js/color-modes.js"></script>

src/views/base/cards.html

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -39,6 +39,7 @@
3939
<link rel="stylesheet" href="css/vendors/simplebar.css">
4040
<!-- Main styles for this application-->
4141
<link href="css/style.css" rel="stylesheet">
42+
<!-- We use those styles to show code examples, you should remove them in your application.-->
4243
<link href="css/examples.css" rel="stylesheet">
4344
<script src="js/config.js"></script>
4445
<script src="js/color-modes.js"></script>

0 commit comments

Comments
 (0)