Skip to content

Commit

Permalink
Merge branch 'hotfix/2.5.4'
Browse files Browse the repository at this point in the history
  • Loading branch information
beatrizsmerino committed Nov 15, 2024
2 parents 210ddc6 + eafa4e7 commit 75fe96d
Show file tree
Hide file tree
Showing 10 changed files with 239 additions and 86 deletions.
4 changes: 2 additions & 2 deletions package-lock.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

2 changes: 1 addition & 1 deletion package.json
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
{
"version": "3.5.3",
"version": "3.5.4",
"private": true,
"name": "vue-users",
"description": "Vue app that get/set a list of random users from an API.",
Expand Down
96 changes: 16 additions & 80 deletions src/App.vue
Original file line number Diff line number Diff line change
Expand Up @@ -102,84 +102,20 @@
</script>

<style lang="scss">
@import "./assets/fonts/DauphinPlain/font.css";
@import "https://fonts.googleapis.com/css2?family=Oxygen:wght@300;400;700&display=swap";
@import "https://use.fontawesome.com/releases/v5.8.2/css/all.css";
// RESET
// -----------------------------------------
[v-cloak] {
display: none;
}
*,
*:after,
*:before {
box-sizing: border-box;
margin: 0;
padding: 0;
}
a {
text-decoration: none;
}
button {
appearance: none;
outline: none;
}
// PAGE
// -----------------------------------------
.page {
font-size: 62.5%;
}
.page-body {
padding: 7.2rem 0 0;
background-color: $color-light;
color: $color-gray;
font-family: $font-brand-2;
font-size: 1.6rem;
-webkit-font-smoothing: antialiased;
}
.page-main {
padding: 6.4rem 0;
@include media("md") {
padding: 4rem 0;
}
&__inner {
width: 100%;
}
}
.page-inner {
width: 100%;
padding: 0 3rem;
}
// VUE TRANSITIONS
// -----------------------------------------
/* default animation if don't use a name in the tag transition/transition-group (WITHOUT NAME) */
.v-enter {
opacity: 0;
}
.v-enter-active {
transition: opacity 1s;
}
.v-leave-to {
opacity: 0;
}
.v-leave-active {
transition: opacity 0.5s linear 0.5s;
}
// PARTIALS SASS
// ===============================================================================
// BASE
// ----------------------------------------------------------------------
@use "@/assets/scss/base/base-reset";
@use "@/assets/scss/base/base-global";
@use "@/assets/scss/base/base-fonts";
// COMPONENTS
// ----------------------------------------------------------------------
@use "@/assets/scss/components/components-page";
// ANIMATIONS
// ----------------------------------------------------------------------
@use "@/assets/scss/animations/animations-vue-transitions";
</style>
Original file line number Diff line number Diff line change
Expand Up @@ -5,4 +5,4 @@
// BRAND
// ----------------------------------------------------------------------
$font-brand-1: "Dauphin", "Bradley Hand", sans-serif;
$font-brand-2: "Oxygen", helvetica, cursive;
$font-brand-2: "Oxygen", "Helvetica", cursive;
20 changes: 20 additions & 0 deletions src/assets/scss/animations/_animations-vue-transitions.scss
Original file line number Diff line number Diff line change
@@ -0,0 +1,20 @@
// ANIMATIONS
// VUE-TRANSITIONS
// =================================================
// default animation if don't use a name in the tag transition/transition-group (WITHOUT NAME)

.v-enter {
opacity: 0;
}

.v-enter-active {
transition: opacity 1s;
}

.v-leave-to {
opacity: 0;
}

.v-leave-active {
transition: opacity 0.5s linear 0.5s;
}
7 changes: 7 additions & 0 deletions src/assets/scss/base/_base-fonts.scss
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
// BASE
// FONTS
// =================================================

@import url("@/assets/fonts/DauphinPlain/font.css");
@import url("https://fonts.googleapis.com/css2?family=Oxygen:wght@300;400;700&display=swap");
@import url("https://use.fontawesome.com/releases/v5.8.2/css/all.css");
24 changes: 24 additions & 0 deletions src/assets/scss/base/_base-global.scss
Original file line number Diff line number Diff line change
@@ -0,0 +1,24 @@
// BASE
// GLOBAL
// =================================================

*,
*:after,
*:before {
box-sizing: border-box;
margin: 0;
padding: 0;
}

a {
text-decoration: none;
}

button {
appearance: none;
outline: none;
}

[v-cloak] {
display: none;
}
130 changes: 130 additions & 0 deletions src/assets/scss/base/_base-reset.scss
Original file line number Diff line number Diff line change
@@ -0,0 +1,130 @@
// BASE
// RESET
// =================================================

html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video,
button {
font: inherit;
font-size: 100%;
vertical-align: baseline;
}

/* HTML5 display-role reset for older browsers */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
display: block;
}

body {
line-height: 1;
}

blockquote,
q {
quotes: none;

&:before,
&:after {
content: none;
}
}

table {
border-collapse: collapse;
border-spacing: 0;
}

select {
&::-ms-expand {
display: none;
}
}
36 changes: 36 additions & 0 deletions src/assets/scss/components/_components-page.scss
Original file line number Diff line number Diff line change
@@ -0,0 +1,36 @@
// COMPONENTS
// PAGE
// =================================================
@use "../abstracts/mixins/abstracts-mixins-media" as *;
@use "../abstracts/variables/abstracts-variables-colors" as *;
@use "../abstracts/variables/abstracts-variables-fonts" as *;

.page {
font-size: 62.5%;
}

.page-body {
padding: 7.2rem 0 0;
background-color: $color-light;
color: $color-gray;
font-family: $font-brand-2;
font-size: 1.6rem;
-webkit-font-smoothing: antialiased;
}

.page-main {
padding: 6.4rem 0;

@include media("md") {
padding: 4rem 0;
}

&__inner {
width: 100%;
}
}

.page-inner {
width: 100%;
padding: 0 3rem;
}
4 changes: 2 additions & 2 deletions src/assets/scss/styles.scss
Original file line number Diff line number Diff line change
Expand Up @@ -4,9 +4,9 @@
// ABSTRACTS
// ----------------------------------------------------------------------
@forward "abstracts/functions/abstracts-functions-contains";
// -------------------
// ------------------
@forward "abstracts/mixins/abstracts-mixins-media";
// -------------------
// ------------------
@forward "abstracts/variables/abstracts-variables-breakpoints";
@forward "abstracts/variables/abstracts-variables-colors";
@forward "abstracts/variables/abstracts-variables-fonts";

0 comments on commit 75fe96d

Please sign in to comment.