mirror_css/csslayout
1
0
Fork 0
mirror of https://github.com/phuoc-ng/csslayout.git synced 2025-08-27 07:44:28 +02:00
Code Issues Releases Wiki Activity

Use BEM naming convention

Browse Source
This commit is contained in:
Phuoc Nguyen
2021-04-01 16:46:44 +07:00
parent e1b4c6efa2
commit 538e5f750e
37 changed files with 233 additions and 214 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20
client/patterns/holy-grail/Details.tsx
View File

@@ -26,15 +26,15 @@ html={`
<header>
...
</header>
<main class="main">
<main class="container__main">
<!-- Left sidebar -->
<aside class="left">...</aside>
<aside class="container__left">...</aside>
<!-- Main content -->
<article class="middle">...</article>
<article class="container__middle">...</article>
<!-- Right sidebar -->
<nav class="right">...</nav>
<nav class="container__right">...</nav>
</main>
<footer>
...
@@ -46,7 +46,8 @@ css={`
display: flex;
flex-direction: column;
}
.main {
.container__main {
/* Take the remaining height */
flex-grow: 1;
@@ -54,14 +55,17 @@ css={`
display: flex;
flex-direction: row;
}
.left {
.container__left {
width: 25%;
}
.middle {
.container__middle {
/* Take the remaining width */
flex-grow: 1;
}
.right {
.container__right {
width: 20%;
}
`}