mirror of
https://framagit.org/framasoft/mobilizon.git
synced 2024-12-25 09:22:22 +00:00
Improve color palette
Signed-off-by: Thomas Citharel <tcit@tcit.fr>
This commit is contained in:
parent
148183ca48
commit
703de9c638
7 changed files with 80 additions and 37 deletions
|
@ -1,6 +1,6 @@
|
|||
a {
|
||||
text-decoration: underline;
|
||||
text-decoration-color: #fea72b;
|
||||
text-decoration-color: #ED8D07;
|
||||
text-decoration-thickness: 2px;
|
||||
|
||||
&.navbar-item,
|
||||
|
|
|
@ -42,9 +42,11 @@ export default class DateCalendarIcon extends Vue {
|
|||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
@import "../../variables.scss";
|
||||
|
||||
time.datetime-container {
|
||||
background: #f6f7f8;
|
||||
border: 1px solid rgba(46, 62, 72, 0.12);
|
||||
background: $backgrounds;
|
||||
border: 1px solid $borders;
|
||||
border-radius: 8px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
@ -59,7 +61,7 @@ time.datetime-container {
|
|||
font-weight: 600;
|
||||
|
||||
&.month {
|
||||
color: #fa3e3e;
|
||||
color: $danger;
|
||||
padding: 2px 0;
|
||||
font-size: 12px;
|
||||
line-height: 12px;
|
||||
|
@ -67,6 +69,7 @@ time.datetime-container {
|
|||
}
|
||||
|
||||
&.day {
|
||||
color: $violet-3;
|
||||
font-size: 20px;
|
||||
line-height: 20px;
|
||||
}
|
||||
|
|
|
@ -20,6 +20,8 @@ export default class EventMetadataBlock extends Vue {
|
|||
}
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
@import "../../variables.scss";
|
||||
|
||||
h2 {
|
||||
font-size: 1.8rem;
|
||||
font-weight: 500;
|
||||
|
|
|
@ -13,9 +13,11 @@ export default class Tag extends Vue {}
|
|||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
@import "../variables.scss";
|
||||
|
||||
span.tag {
|
||||
background: #ecebf7;
|
||||
color: #8e8bae;
|
||||
background: $purple-3;
|
||||
color: $violet-2;
|
||||
text-transform: uppercase;
|
||||
&::before {
|
||||
content: "#";
|
||||
|
|
|
@ -4,52 +4,79 @@ $bleuvert: #1e7d97;
|
|||
$jaune: #ffd599;
|
||||
$violet: #424056;
|
||||
|
||||
/**
|
||||
* Text body, paragraphs
|
||||
*/
|
||||
$violet-1: #3A384C;
|
||||
$violet-2: #474467;
|
||||
|
||||
/**
|
||||
* Titles, dark borders, buttons
|
||||
*/
|
||||
$violet-3: #3C376E;
|
||||
|
||||
/**
|
||||
* Borders
|
||||
*/
|
||||
$borders: #D7D6DE;
|
||||
$backgrounds: #ECEBF2;
|
||||
|
||||
/**
|
||||
* Text
|
||||
*/
|
||||
$purple-1: #757199;
|
||||
|
||||
/**
|
||||
* Background
|
||||
*/
|
||||
$purple-2: #CDCAEA;
|
||||
$purple-3: #E6E4F4;
|
||||
|
||||
$orange-2: #ED8D07;
|
||||
$orange-3: #D35204;
|
||||
|
||||
$yellow-1: #FFD599;
|
||||
$yellow-2: #FFF1DE;
|
||||
$yellow-3: #FBD5CB;
|
||||
$yellow-4: #f7ba30;
|
||||
|
||||
$primary: $bleuvert;
|
||||
$primary-invert: findColorInvert($primary);
|
||||
//$secondary: #ffcc85;
|
||||
$secondary: $jaune;
|
||||
$secondary-invert: findColorInvert($secondary);
|
||||
|
||||
$background-color: $violet;
|
||||
$background-color: $violet-2;
|
||||
|
||||
$success: #0eccaf;
|
||||
$success: #0D8758;
|
||||
$success-invert: findColorInvert($success);
|
||||
$info: #36bcd4;
|
||||
$info-invert: findColorInvert($info);
|
||||
$danger: #ff7061;
|
||||
$danger: #FF2E54;
|
||||
$danger-invert: findColorInvert($danger);
|
||||
$link: $primary;
|
||||
$link-invert: $primary-invert;
|
||||
$text: $violet-1;
|
||||
|
||||
$colors: map-merge(
|
||||
$colors,
|
||||
(
|
||||
"primary": (
|
||||
$primary,
|
||||
$colors: map-merge($colors,
|
||||
("primary": ($primary,
|
||||
$primary-invert,
|
||||
),
|
||||
"secondary": (
|
||||
$secondary,
|
||||
"secondary": ($secondary,
|
||||
$secondary-invert,
|
||||
),
|
||||
"success": (
|
||||
$success,
|
||||
"success": ($success,
|
||||
$success-invert,
|
||||
),
|
||||
"info": (
|
||||
$info,
|
||||
"info": ($info,
|
||||
$info-invert,
|
||||
),
|
||||
"danger": (
|
||||
$danger,
|
||||
"danger": ($danger,
|
||||
$danger-invert,
|
||||
),
|
||||
"link": (
|
||||
$link,
|
||||
"link": ($link,
|
||||
$link-invert,
|
||||
),
|
||||
)
|
||||
);
|
||||
));
|
||||
|
||||
// Navbar
|
||||
$navbar-background-color: $secondary;
|
||||
|
@ -64,25 +91,34 @@ $body-background-color: #efeef4;
|
|||
$fullhd-enabled: false;
|
||||
$hero-body-padding-medium: 6rem 1.5rem;
|
||||
|
||||
main > .container {
|
||||
main>.container {
|
||||
background: $body-background-color;
|
||||
}
|
||||
|
||||
$title-color: #3c376e;
|
||||
$title-family: "Liberation Sans", "Helvetica Neue", Roboto, Helvetica, Arial,
|
||||
serif;
|
||||
$title-family: "Liberation Sans",
|
||||
"Helvetica Neue",
|
||||
Roboto,
|
||||
Helvetica,
|
||||
Arial,
|
||||
serif;
|
||||
$title-weight: 700;
|
||||
$title-size: 40px;
|
||||
$title-sub-size: 45px;
|
||||
$title-sup-size: 30px;
|
||||
|
||||
$subtitle-color: #3a384c;
|
||||
$subtitle-family: "Liberation Sans", "Helvetica Neue", Roboto, Helvetica, Arial,
|
||||
serif;
|
||||
$subtitle-family: "Liberation Sans",
|
||||
"Helvetica Neue",
|
||||
Roboto,
|
||||
Helvetica,
|
||||
Arial,
|
||||
serif;
|
||||
$subtitle-weight: 400;
|
||||
$subtitle-size: 32px;
|
||||
$subtitle-sub-size: 30px;
|
||||
$subtitle-sup-size: 15px;
|
||||
|
||||
.title {
|
||||
margin: 30px auto 45px;
|
||||
}
|
||||
|
@ -97,3 +133,4 @@ $subtitle-sup-size: 15px;
|
|||
$input-border-color: #dbdbdb;
|
||||
$breadcrumb-item-color: $primary;
|
||||
$checkbox-background-color: #fff;
|
||||
$title-color: $violet-3;
|
|
@ -134,7 +134,10 @@ export default class About extends Vue {
|
|||
}
|
||||
|
||||
.hero.register {
|
||||
background: lighten($background-color, 20%);
|
||||
.title {
|
||||
color: $violet-1;
|
||||
}
|
||||
background: $purple-2;
|
||||
}
|
||||
|
||||
aside.menu {
|
||||
|
|
|
@ -184,10 +184,6 @@ export default class AboutMobilizon extends Vue {}
|
|||
}
|
||||
}
|
||||
|
||||
.hero.register {
|
||||
background: lighten($background-color, 20%);
|
||||
}
|
||||
|
||||
section {
|
||||
padding: 3rem 0;
|
||||
|
||||
|
|
Loading…
Reference in a new issue