Dessa forma temos tudo separado em pequenos arquivos, o que facilita a manutenção, além de tornar mais fácil a separação entre componentes e layout. Agora podemos, por exemplo, criar nossos headings em um arquivo separado e manter tudo mais modular e reutilizável.
Também dei uma modularizada nas classes que já existiam, está tudo bem fácil de entender, mas já deixo o compromisso de documentar tudo assim que der :)
obs: Lembrando que também vou documentar o grid :D
obs2: Tem uma linha verde contornando as partes do layout. Ela serve para ajudar a ver os grids nessa fase de desenvolvimento, para retira-la é só comentar as linhas 30 e 31 no arquivo style.sass
raphamorim
commented
9 years ago
Pessoal, antes de continuar a estilizar as outras paginas, dei uma arrumada no que já temos pronto.
Seguem a organização dos arquivos:
style.sass (importa todos os arquivos e contem as infos globais
// Base @import "base/reset" @import "base/grid"
// Layouts @import "layouts/header" @import "layouts/featured" @import "layouts/main" @import "layouts/footer"
// Components @import "components/social-icons" @import "components/text" @import "components/buttons"
Dessa forma temos tudo separado em pequenos arquivos, o que facilita a manutenção, além de tornar mais fácil a separação entre componentes e layout. Agora podemos, por exemplo, criar nossos headings em um arquivo separado e manter tudo mais modular e reutilizável.
Também dei uma modularizada nas classes que já existiam, está tudo bem fácil de entender, mas já deixo o compromisso de documentar tudo assim que der :)
obs: Lembrando que também vou documentar o grid :D obs2: Tem uma linha verde contornando as partes do layout. Ela serve para ajudar a ver os grids nessa fase de desenvolvimento, para retira-la é só comentar as linhas 30 e 31 no arquivo style.sass