rooty/fab-manager
1
0
Fork 0
mirror of https://github.com/LaCasemate/fab-manager.git synced 2024-12-01 12:24:28 +01:00
Code Issues Releases Activity

Add style variables

Browse Source
This commit is contained in:
vincent 2022-02-04 15:09:38 +01:00 committed by Sylvain
parent 3f4714861b
commit c1ec8b5ce8
5 changed files with 20 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
app/frontend/src/stylesheets/application.scss
View File

@ -1,5 +1,6 @@
@import "variables/colors";
@import "variables/typography";
@import "variables/decoration";
@import "app.functions";
@import "bootstrap_and_overrides";

3
app/frontend/src/stylesheets/bootstrap_and_overrides.scss vendored
View File

@ -95,7 +95,8 @@ $link-hover-decoration: underline;
// Semibold = 600, Bold = 700, ExtraB = 800
$font-family-sans-serif: "proxima-nova", "Open Sans", Helvetica, Arial, sans-serif !default;
//$font-family-sans-serif: "proxima-nova", "Open Sans", Helvetica, Arial, sans-serif !default;
$font-family-sans-serif: var(--font-text) !default;
$font-proxima-condensed: "proxima-nova-condensed", "Open Sans Condensed", Helvetica, Arial, sans-serif !default;
$font-family-serif: Georgia, "Times New Roman", Times, serif !default;
$font-felt: "felt-tip-roman", "Loved by the King", cursive, sans-serif;

16
app/frontend/src/stylesheets/modules/base/fab-text-editor.scss
View File

@ -4,10 +4,10 @@
padding-bottom: 1.6rem;
background-color: var(--gray-soft-lightest);
border: 1px solid var(--gray-soft-dark);
// TODO: border radius from variable
border-radius: 8px;
border-radius: var(--border-radius);
&-label {
@include text-sm;
display: block;
margin-bottom: 0.8rem;
}
@ -71,9 +71,8 @@
padding: 1.2rem;
background-color: var(--gray-soft-lightest);
border: 1px solid var(--gray-soft-darkest);
border-radius: 8px;
// TODO: shadow from variable
box-shadow: 0 0 10px rgba(39, 32, 32, 0.25);
border-radius: var(--border-radius);
box-shadow: var(--shadow);
opacity: 0;
pointer-events: none;
transition: opacity 0.25s ease-out;
@ -95,7 +94,7 @@
padding: 0.4rem 0.8rem;
background-color: var(--gray-soft-light);
border: 1px solid var(--secondary);
border-radius: 8px;
border-radius: var(--border-radius);
font-size: var(--text-base);
text-overflow: ellipsis;
white-space: nowrap;
@ -157,9 +156,8 @@
color: var(--main-dark);
background-color: var(--main-lightest);
border: 1px solid var(--main-light);
border-radius: 8px;
// TODO: shadow from variable
box-shadow: 0 0 10px rgba(39, 32, 32, 0.25);
border-radius: var(--border-radius);
box-shadow: var(--shadow);
svg {
flex-shrink: 0;

8
app/frontend/src/stylesheets/modules/base/rhf-input.scss
View File

@ -8,7 +8,10 @@
justify-content: space-between;
align-items: flex-start;
margin-bottom: 0.8rem;
p { margin: 0; }
p {
@include text-sm;
margin: 0;
}
}
&.is-required &-header p::after {
content: "*";
@ -22,7 +25,7 @@
grid-template-areas: "icon input addon";
grid-template-columns: min-content 1fr min-content;
border: 1px solid var(--gray-soft-dark);
border-radius: 4px;
border-radius: var(--border-radius);
overflow: hidden;
transition: border-color ease-in-out 0.15s;
@ -42,6 +45,7 @@
input {
grid-area: input;
border: none;
border-radius: var(--border-radius);
box-shadow: inset 0 1px 1px rgba(0, 0, 0, .08);
padding: 0 0.8rem;
color: var(--gray-hard-darkest);

4
app/frontend/src/stylesheets/variables/decoration.scss Normal file
View File

@ -0,0 +1,4 @@
:root {
--border-radius: 8px;
--shadow: 0 0 10px rgba(39, 32, 32, 0.25);
}