Skip to content

Commit c9295bb

Browse files
author
Michael Vurchio
committed
Remove some styling code example to make it easier to process
1 parent f447939 commit c9295bb

File tree

1 file changed

+1
-29
lines changed

1 file changed

+1
-29
lines changed

README.md

Lines changed: 1 addition & 29 deletions
Original file line numberDiff line numberDiff line change
@@ -348,7 +348,6 @@ export default {
348348
background-color: #fff;
349349
transform: translateX(-50%) translateY(-50%);
350350
}
351-
352351
section {
353352
flex: 0 1 auto;
354353
flex-direction: column;
@@ -357,30 +356,17 @@ export default {
357356
}
358357
header {
359358
padding: 1rem;
360-
font-size: 1.2rem;
361-
font-weight: bold;
362359
border-bottom: 1px solid #d9d9d9;
363360
}
364-
365361
.body {
366362
padding: 1rem;
367363
flex: 1 0 0;
368-
min-height: 0;
369-
max-height: 100%;
370-
overflow: scroll;
371-
-webkit-overflow-scrolling: touch;
372364
}
373-
374365
footer {
375366
padding: 1rem;
376-
text-align: right;
377367
border-top: 1px solid #d9d9d9;
378368
}
379369
button {
380-
padding: .5em 1em;
381-
min-width: 100px;
382-
font-size: .8rem;
383-
font-weight: 600;
384370
background: #fff;
385371
border: 1px solid #ccc;
386372
border-radius: 5px;
@@ -418,7 +404,6 @@ export default {
418404
background-color: #fff;
419405
transform: translateX(-50%) translateY(-50%);
420406
}
421-
422407
section {
423408
flex: 0 1 auto;
424409
flex-direction: column;
@@ -427,30 +412,17 @@ export default {
427412
}
428413
header {
429414
padding: 1rem;
430-
font-size: 1.2rem;
431-
font-weight: bold;
432415
border-bottom: 1px solid #d9d9d9;
433416
}
434-
435417
._1HPUBXtzNG {
436418
padding: 1rem;
437419
flex: 1 0 0;
438-
min-height: 0;
439-
max-height: 100%;
440-
overflow: scroll;
441-
-webkit-overflow-scrolling: touch;
442420
}
443-
444421
footer {
445422
padding: 1rem;
446-
text-align: right;
447423
border-top: 1px solid #d9d9d9;
448424
}
449425
button {
450-
padding: .5em 1em;
451-
min-width: 100px;
452-
font-size: .8rem;
453-
font-weight: 600;
454426
background: #fff;
455427
border: 1px solid #ccc;
456428
border-radius: 5px;
@@ -478,7 +450,7 @@ export default {
478450

479451
## Why CSS Modules on Svelte
480452

481-
While the native CSS Scoped system should be largely enough to avoid class conflict, it could find its limit when working on a hybrid project. On a non full javascript front-end where Svelte is used to enhance pieces of the page, the thought on the class naming is no less different than the one on a regular html page. For example, on the modal component above, It would have been wiser to namespace some of the classes such as `.modal-body` and `.modal-cancel` to avoid inheriting styles from other `.body` and `.cancel`.
453+
While the native CSS Scoped system should be largely enough to avoid class conflict, it could find its limit when working on a hybrid project. On a non full Svelte application where it is used to enhance pieces of the page; the thought on the class naming is no less different than the one on a regular html page to avoid conflict and unwilling inheritance. For example, on the modal component above, It would have been wiser to namespace some of the classes such as `.modal-body` and `.modal-cancel` to avoid inheriting styles from other `.body` and `.cancel`.
482454

483455
## License
484456

0 commit comments

Comments
 (0)