Skip to content

Commit

Permalink
CSS Produtos
Browse files Browse the repository at this point in the history
  • Loading branch information
Paulo e família committed Jan 24, 2020
1 parent f524aee commit 1bce801
Showing 57 changed files with 12,130 additions and 15 deletions.
Binary file added .DS_Store
Binary file not shown.
2 changes: 1 addition & 1 deletion .env
Original file line number Diff line number Diff line change
@@ -25,7 +25,7 @@ APP_SECRET=ca91fb3f4841f8d3c38e951fa7d83a24
# For an SQLite database, use: "sqlite:///%kernel.project_dir%/var/data.db"
# For a PostgreSQL database, use: "postgresql://db_user:[email protected]:5432/db_name?serverVersion=11&charset=utf8"
# IMPORTANT: You MUST configure your server version, either here or in config/packages/doctrine.yaml
DATABASE_URL=mysql://db_user:db_password@127.0.0.1:3306/db_name?serverVersion=5.7
DATABASE_URL=mysql://root:nationalkid@127.0.0.1:3306/casalit?serverVersion=5.7
###< doctrine/doctrine-bundle ###

###> symfony/mailer ###
7 changes: 7 additions & 0 deletions .gitignore
Original file line number Diff line number Diff line change
@@ -14,3 +14,10 @@
.phpunit.result.cache
/phpunit.xml
###< symfony/phpunit-bridge ###

###> symfony/webpack-encore-bundle ###
/node_modules/
/public/build/
npm-debug.log
yarn-error.log
###< symfony/webpack-encore-bundle ###
Binary file added assets/.DS_Store
Binary file not shown.
Binary file added assets/css/.DS_Store
Binary file not shown.
130 changes: 130 additions & 0 deletions assets/css/_footer.scss
Original file line number Diff line number Diff line change
@@ -0,0 +1,130 @@
/*
Theme Name: Casalit by Orion
Description: Estilos do footer
*/

:root {
--layout-margin: 64px;
--primary-color: #3A7DFF;
--secondary-color: #194AA8;
--default-text-color: rgba(0, 0, 0, 0.54);
}

/* Contents */
#cl-footer > .wrapper {
box-sizing: border-box;
align-items: center;
display: grid;
grid-row-gap: 12px;
grid-template-areas: 'brand address'
'menu orion';
grid-template-columns: 1fr auto;
grid-template-rows: auto 64px;
height: 100%;
padding: 0px var(--layout-margin);
width: 100%;
}

#cl-footer .cl-logo {
align-self: flex-end;
display: block;
grid-area: brand;
}

#cl-footer .cl-logo .cl-site-title {
display: block;
height: 42px;
margin-bottom: 16px;
width: 114px;
}

#cl-footer .cl-logo .cl-site-title > a {
background-color: transparent;
// background-image: url('../assets/images/casalit-blue.svg');
background-position: center;
background-repeat: no-repeat;
background-size: contain;
color: transparent;
display: block;
height: 100%;
text-decoration: none;
user-select: none;
width: 100%;
}

#cl-footer .cl-logo .cl-site-desc {
color: var(--default-text-color);
font-size: 12px;
line-height: 15px;
user-select: none;
}

#cl-footer .cl-address {
align-self: flex-end;
color: var(--default-text-color);
display: block;
font-size: 12px;
grid-area: address;
}

#cl-footer .cl-address > p {
display: block;
text-align: right;
line-height: 18px;
}

#cl-footer .cl-footer-navigation {
display: inline-block;
grid-area: menu;
}

#cl-footer .cl-menu {
align-items: center;
display: flex;
flex-flow: row wrap;
}

#cl-footer .cl-menu li:not(:first-child) {
margin: 0 0 0 40px;
}

#cl-footer .cl-menu .menu-item > a {
box-shadow: 0 0 0 0 transparent;
color: var(--default-text-color);
transition: box-shadow linear 100ms;
}

#cl-footer .cl-menu .menu-item > a:hover {
box-shadow: 0 2px 0 0 var(--primary-color);
color: var(--primary-color);
}

#cl-footer .cl-menu .current-menu-item {
animation: scaleIn 400ms cubic-bezier(0.1, 0.9, 0.2, 1);
}

#cl-footer .cl-menu .current-menu-item > a {
color: var(--secondary-color);
font-weight: 600;
}

#oriondesign {
display: block;
grid-area: orion;
justify-self: end;
width: 168px;
}

#oriondesign > a {
background-color: transparent;
// background-image: url('../assets/images/oriondesign.svg');
background-position: center;
background-repeat: no-repeat;
background-size: contain;
color: transparent;
display: block;
font-size: 0px;
height: 20px;
user-select: none;
width: 100%;
}
129 changes: 129 additions & 0 deletions assets/css/_header.scss
Original file line number Diff line number Diff line change
@@ -0,0 +1,129 @@
/*
Theme Name: Casalit by Orion
Description: Estilos do header
*/

:root {
--layout-margin: 64px;
--primary-color: #3A7DFF;
--secondary-color: #194AA8;
--default-text-color: rgba(0, 0, 0, 0.54);
}

/* Contents */
#cl-header > .wrapper {
box-shadow: inset 0 8px 0 0 var(--primary-color);
box-sizing: border-box;
align-items: center;
display: grid;
grid-template-columns: auto 1fr auto;
grid-template-rows: 1fr;
height: 100%;
padding: 0px var(--layout-margin);
width: 100%;
}

#cl-header .cl-logo {
display: block;
}

#cl-header .cl-logo .cl-site-title {
display: block;
height: 42px;
margin-bottom: 6px;
width: 150px;
}

#cl-header .cl-logo .cl-site-title > a {
background-color: transparent;
background-position: center;
background-repeat: no-repeat;
background-size: contain;
color: transparent;
display: block;
height: 100%;
text-decoration: none;
user-select: none;
width: 100%;
}

#cl-header .cl-logo .cl-site-desc {
color: var(--default-text-color);
letter-spacing: -0.38px;
line-height: 17px;
user-select: none;
}

#cl-header .cl-header-navigation {
display: inline-block;
justify-self: center;
}

#cl-header .cl-menu {
align-items: center;
display: flex;
flex-flow: row wrap;
}

#cl-header .cl-menu li:not(:first-child) {
margin: 0 0 0 40px;
}

#cl-header .cl-menu .menu-item > a {
box-shadow: 0 0 0 0 transparent;
color: var(--default-text-color);
transition: box-shadow linear 100ms;
}

#cl-header .cl-menu .menu-item > a:hover {
box-shadow: 0 2px 0 0 var(--primary-color);
color: var(--primary-color);
}

@keyframes scaleIn {
from {
transform: scale3d(1.15, 1.15, 1);
}
to {
transform: scale3d(1, 1, 1);
}
}

#cl-header .cl-menu .current-menu-item {
animation: scaleIn 600ms cubic-bezier(0.1, 0.9, 0.2, 1);
}

#cl-header .cl-menu .current-menu-item > a {
color: var(--secondary-color);
font-weight: 600;
}

#cl-header .cl-search-form {
display: block;
width: 150px;
}

#cl-header .cl-search-form > input {
appearance: none;
background-color: #FFFFFF;
background-image: url('../vectors/search.svg');
background-position: center left 12px;
background-repeat: no-repeat;
background-size: auto 14px;
border: none;
box-shadow: 0 1px 7px 0 rgba(0,0,0,0.16);
box-sizing: border-box;
color: #000;
display: block;
font-family: 'aileron', sans-serif;
font-size: 14px;
height: 32px;
outline: none;
padding-left: 38px;
transition: box-shadow 100ms linear;
width: 100%;
}

#cl-header .cl-search-form > input:focus {
box-shadow: 0 0 0 2px var(--secondary-color);
}
106 changes: 106 additions & 0 deletions assets/css/_layout.scss
Original file line number Diff line number Diff line change
@@ -0,0 +1,106 @@
/*
Theme Name: Casalit by Orion
Description: Diagramação do site
*/

/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
1.0 Canvas
2.0 Header
3.0 Footer
4.0 Body and its wrapper
--------------------------------------------------------------*/

:root {
--layout-margin: 64px;
--primary-color: #3A7DFF;
--default-text-color: rgba(0, 0, 0, 0.54);
}

/*--------------------------------------------------------------
1.0 Canvas
--------------------------------------------------------------*/

#canvas {
background-color: #FFFFFF;
box-sizing: border-box;
display: grid;
grid-row-gap: 6px;
grid-template-rows: 162px 1fr 176px;
min-height: 100vh;
overflow-x: hidden;
width: 100vw;
}

/*--------------------------------------------------------------
2.0 Header
--------------------------------------------------------------*/

#casalit #cl-header {
display: block;
height: 100%;
position: relative;
width: 100%;
}

/*--------------------------------------------------------------
3.0 Footer
--------------------------------------------------------------*/

#casalit #cl-footer {
background-color: rgba(0, 0, 0, 0.02);
display: block;
height: 100%;
position: relative;
width: 100%;
}

/*--------------------------------------------------------------
4.0 Body and its wrapper
--------------------------------------------------------------*/

#casalit #cl-body {
background-color: #FFFFFF;
display: block;
height: 100%;
position: relative;
width: 100%;
}

/* Wrapper */

@keyframes slideUpInFade {
from {
transform: translate3d(0, 48px, 0);
opacity: 0;
}
to {
transform: translate3d(0, 0, 0);
opacity: 1;
}
}

#casalit #cl-body > .wrapper {
animation: slideUpInFade 400ms cubic-bezier(0.1, 0.9, 0.2, 1);
box-sizing: border-box;
display: block;
height: 100%;
margin-bottom: 72px;
padding: 0 var(--layout-margin);
width: 100%;
}

.slideUpIn {
animation: slideUpInFade 600ms cubic-bezier(0.1, 0.9, 0.2, 1);
}

.cl-products {
align-items: center;
display: grid;
grid-auto-flow: column;
grid-column-gap: 24px;
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
margin: 56px auto;
max-width: 700px;
}
Loading

0 comments on commit 1bce801

Please sign in to comment.