From e511ba9a574895502129abac5256a338a7acac03 Mon Sep 17 00:00:00 2001 From: Thorsten Kober Date: Tue, 17 Oct 2023 15:01:40 -0400 Subject: [PATCH] use overflow-wrap --- resources/todomvc/todomvc-css/dist/index.css | 2 +- resources/todomvc/todomvc-css/dist/index.min.css | 2 +- resources/todomvc/todomvc-css/dist/todo-item.constructable.js | 2 +- resources/todomvc/todomvc-css/dist/todo-item.css | 2 +- resources/todomvc/todomvc-css/dist/todo-item.module.css | 2 +- resources/todomvc/todomvc-css/src/css/todo-item.css | 2 +- .../dist/styles/todo-item.constructable.js | 2 +- .../dist/styles/todo-item.constructable.js | 2 +- 8 files changed, 8 insertions(+), 8 deletions(-) diff --git a/resources/todomvc/todomvc-css/dist/index.css b/resources/todomvc/todomvc-css/dist/index.css index 83dcc3a3b..7cb30fe5a 100644 --- a/resources/todomvc/todomvc-css/dist/index.css +++ b/resources/todomvc/todomvc-css/dist/index.css @@ -376,7 +376,7 @@ but useful for people who use screen readers */ } .todo-item-text { - word-break: break-word; + overflow-wrap: break-word; padding: 0 60px; display: block; line-height: 60px; diff --git a/resources/todomvc/todomvc-css/dist/index.min.css b/resources/todomvc/todomvc-css/dist/index.min.css index 292612662..e7bf2fe03 100644 --- a/resources/todomvc/todomvc-css/dist/index.min.css +++ b/resources/todomvc/todomvc-css/dist/index.min.css @@ -4,6 +4,6 @@ :host{display:block;box-shadow:none!important;}.topbar{position:relative;}.new-todo-input{padding:0 32px 0 60px;width:100%;height:68px;font-size:24px;line-height:1.4em;background:rgba(0,0,0,0.003);box-shadow:inset 0 -2px 1px rgba(0,0,0,0.03);}.new-todo-input::placeholder{font-style:italic;font-weight:400;color:rgba(0,0,0,0.4);}.toggle-all-container{width:45px;height:68px;position:absolute;left:0;top:0;}.toggle-all-input{width:45px;height:45px;font-size:0;position:absolute;top:11.5px;left:0;border:none;appearance:none;cursor:pointer;}.toggle-all-label{display:flex;align-items:center;justify-content:center;width:45px;height:68px;font-size:0;position:absolute;top:0;left:0;cursor:pointer;}.toggle-all-label::before{content:"❯";display:inline-block;font-size:22px;color:#949494;padding:10px 27px 10px 27px;transform:rotate(90deg);}.toggle-all-input:checked + .toggle-all-label::before{color:#484848;}@media screen and (-webkit-min-device-pixel-ratio:0){.toggle-all-input{background:none;}}html[dir="rtl"] .new-todo-input,:host([dir="rtl"]) .new-todo-input{padding:0 60px 0 32px;}html[dir="rtl"] .toggle-all-container,:host([dir="rtl"]) .toggle-all-container{right:0;left:unset;} :host{display:block;box-shadow:none!important;}.main{position:relative;} :host{display:block;box-shadow:none!important;}.todo-list{margin:0;padding:0;list-style:none;display:block;border-top:1px solid #e6e6e6;} -:host{display:block;box-shadow:none!important;}:host(:last-child) > .todo-item{border-bottom:none;}.todo-item{position:relative;font-size:24px;border-bottom:1px solid #ededed;height:60px;}.todo-item.editing{border-bottom:none;padding:0;}.edit-todo-container{display:none;}.todo-item.editing .edit-todo-container{display:block;}.edit-todo-input{padding:0 16px 0 60px;width:100%;height:60px;font-size:24px;line-height:1.4em;background:rgba(0,0,0,0.003);box-shadow:inset 0 -2px 1px rgba(0,0,0,0.03);background-image:url("data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%2240%22%20height%3D%2240%22%20%20style%3D%22opacity%3A%200.2%22%20viewBox%3D%22-10%20-18%20100%20135%22%3E%3Ccircle%20cx%3D%2250%22%20cy%3D%2250%22%20r%3D%2250%22%20fill%3D%22none%22%20stroke%3D%22%23949494%22%20stroke-width%3D%223%22/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:center left;}.display-todo{position:relative;}.todo-item.editing .display-todo{display:none;}.toggle-todo-input{text-align:center;width:40px;height:auto;position:absolute;top:0;bottom:0;left:3px;margin:auto 0;border:none;appearance:none;cursor:pointer;}.todo-item-text{word-break:break-word;padding:0 60px;display:block;line-height:60px;transition:color 0.4s;font-weight:400;color:#484848;background-image:url("data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%2240%22%20height%3D%2240%22%20viewBox%3D%22-10%20-18%20100%20135%22%3E%3Ccircle%20cx%3D%2250%22%20cy%3D%2250%22%20r%3D%2250%22%20fill%3D%22none%22%20stroke%3D%22%23949494%22%20stroke-width%3D%223%22/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:center left;}.toggle-todo-input:checked + .todo-item-text{color:#949494;text-decoration:line-through;background-image:url("data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2240%22%20height%3D%2240%22%20viewBox%3D%22-10%20-18%20100%20135%22%3E%3Ccircle%20cx%3D%2250%22%20cy%3D%2250%22%20r%3D%2250%22%20fill%3D%22none%22%20stroke%3D%22%2359A193%22%20stroke-width%3D%223%22%2F%3E%3Cpath%20fill%3D%22%233EA390%22%20d%3D%22M72%2025L42%2071%2027%2056l-4%204%2020%2020%2034-52z%22%2F%3E%3C%2Fsvg%3E");}.remove-todo-button{display:none;position:absolute;top:0;right:10px;bottom:0;width:40px;height:40px;margin:auto 0;font-size:30px;color:#949494;transition:color 0.2s ease-out;cursor:pointer;}.remove-todo-button:hover,.remove-todo-button:focus{color:#c18585;}.remove-todo-button::after{content:"×";display:block;height:100%;line-height:1.1;}.todo-item:hover .remove-todo-button{display:block;}@media screen and (-webkit-min-device-pixel-ratio:0){.toggle-todo-input{background:none;height:40px;}}@media (max-width:430px){.remove-todo-button{display:block;}}html[dir="rtl"] .toggle-todo-input,:host([dir="rtl"]) .toggle-todo-input{right:3px;left:unset;}html[dir="rtl"] .todo-item-text,:host([dir="rtl"]) .todo-item-text{background-position:center right 6px;}html[dir="rtl"] .remove-todo-button,:host([dir="rtl"]) .remove-todo-button{left:10px;right:unset;} +:host{display:block;box-shadow:none!important;}:host(:last-child) > .todo-item{border-bottom:none;}.todo-item{position:relative;font-size:24px;border-bottom:1px solid #ededed;height:60px;}.todo-item.editing{border-bottom:none;padding:0;}.edit-todo-container{display:none;}.todo-item.editing .edit-todo-container{display:block;}.edit-todo-input{padding:0 16px 0 60px;width:100%;height:60px;font-size:24px;line-height:1.4em;background:rgba(0,0,0,0.003);box-shadow:inset 0 -2px 1px rgba(0,0,0,0.03);background-image:url("data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%2240%22%20height%3D%2240%22%20%20style%3D%22opacity%3A%200.2%22%20viewBox%3D%22-10%20-18%20100%20135%22%3E%3Ccircle%20cx%3D%2250%22%20cy%3D%2250%22%20r%3D%2250%22%20fill%3D%22none%22%20stroke%3D%22%23949494%22%20stroke-width%3D%223%22/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:center left;}.display-todo{position:relative;}.todo-item.editing .display-todo{display:none;}.toggle-todo-input{text-align:center;width:40px;height:auto;position:absolute;top:0;bottom:0;left:3px;margin:auto 0;border:none;appearance:none;cursor:pointer;}.todo-item-text{overflow-wrap:break-word;padding:0 60px;display:block;line-height:60px;transition:color 0.4s;font-weight:400;color:#484848;background-image:url("data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%2240%22%20height%3D%2240%22%20viewBox%3D%22-10%20-18%20100%20135%22%3E%3Ccircle%20cx%3D%2250%22%20cy%3D%2250%22%20r%3D%2250%22%20fill%3D%22none%22%20stroke%3D%22%23949494%22%20stroke-width%3D%223%22/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:center left;}.toggle-todo-input:checked + .todo-item-text{color:#949494;text-decoration:line-through;background-image:url("data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2240%22%20height%3D%2240%22%20viewBox%3D%22-10%20-18%20100%20135%22%3E%3Ccircle%20cx%3D%2250%22%20cy%3D%2250%22%20r%3D%2250%22%20fill%3D%22none%22%20stroke%3D%22%2359A193%22%20stroke-width%3D%223%22%2F%3E%3Cpath%20fill%3D%22%233EA390%22%20d%3D%22M72%2025L42%2071%2027%2056l-4%204%2020%2020%2034-52z%22%2F%3E%3C%2Fsvg%3E");}.remove-todo-button{display:none;position:absolute;top:0;right:10px;bottom:0;width:40px;height:40px;margin:auto 0;font-size:30px;color:#949494;transition:color 0.2s ease-out;cursor:pointer;}.remove-todo-button:hover,.remove-todo-button:focus{color:#c18585;}.remove-todo-button::after{content:"×";display:block;height:100%;line-height:1.1;}.todo-item:hover .remove-todo-button{display:block;}@media screen and (-webkit-min-device-pixel-ratio:0){.toggle-todo-input{background:none;height:40px;}}@media (max-width:430px){.remove-todo-button{display:block;}}html[dir="rtl"] .toggle-todo-input,:host([dir="rtl"]) .toggle-todo-input{right:3px;left:unset;}html[dir="rtl"] .todo-item-text,:host([dir="rtl"]) .todo-item-text{background-position:center right 6px;}html[dir="rtl"] .remove-todo-button,:host([dir="rtl"]) .remove-todo-button{left:10px;right:unset;} :host{display:block;box-shadow:none!important;}.bottombar{padding:10px 0;height:41px;text-align:center;font-size:15px;border-top:1px solid #e6e6e6;position:relative;}.bottombar::before{content:"";position:absolute;right:0;bottom:0;left:0;height:50px;overflow:hidden;pointer-events:none;box-shadow:0 1px 1px rgba(0,0,0,0.2),0 8px 0 -3px #f6f6f6,0 9px 1px -3px rgba(0,0,0,0.2),0 16px 0 -6px #f6f6f6,0 17px 2px -6px rgba(0,0,0,0.2);}.todo-status{text-align:left;padding:3px;height:32px;line-height:26px;position:absolute;left:12px;top:50%;transform:translateY(-50%);}.todo-count{font-weight:300;}.filter-list{margin:0;padding:0;list-style:none;display:inline-block;position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);}.filter-item{display:inline-block;}.filter-link{color:inherit;margin:3px;padding:0 7px;text-decoration:none;border:1px solid transparent;border-radius:3px;cursor:pointer;display:block;height:26px;line-height:26px;}.filter-link:hover{border-color:#db7676;}.filter-link.selected{border-color:#ce4646;}.clear-completed-button,.clear-completed-button:active{text-decoration:none;cursor:pointer;padding:3px;height:32px;line-height:26px;position:absolute;right:12px;top:50%;transform:translateY(-50%);}.clear-completed-button:hover{text-decoration:underline;}html[dir="rtl"] .todo-status,:host([dir="rtl"]) .todo-status{right:12px;left:unset;}html[dir="rtl"] .clear-completed-button,:host([dir="rtl"]) .clear-completed-button{left:12px;right:unset;}@media (max-width:430px){.bottombar{height:120px;}.todo-status{display:block;text-align:center;position:relative;left:unset;right:unset;top:unset;transform:unset;}.filter-list{display:block;position:relative;left:unset;right:unset;top:unset;transform:unset;}.clear-completed-button,.clear-completed-button:active{display:block;margin:0 auto;position:relative;left:unset;right:unset;top:unset;transform:unset;}html[dir="rtl"] .todo-status,:host([dir="rtl"]) .todo-status{right:unset;left:unset;}html[dir="rtl"] .clear-completed-button,:host([dir="rtl"]) .clear-completed-button{left:unset;right:unset;}} :host{display:block;box-shadow:none!important;}.footer{margin:65px auto 0;color:#4d4d4d;font-size:11px;text-shadow:0 1px 0 rgba(255,255,255,0.5);text-align:center;}.footer-text{line-height:1;}.footer-link{color:inherit;text-decoration:none;font-weight:400;}.footer-link:hover{text-decoration:underline;} \ No newline at end of file diff --git a/resources/todomvc/todomvc-css/dist/todo-item.constructable.js b/resources/todomvc/todomvc-css/dist/todo-item.constructable.js index ddd396dc7..59dba7f77 100644 --- a/resources/todomvc/todomvc-css/dist/todo-item.constructable.js +++ b/resources/todomvc/todomvc-css/dist/todo-item.constructable.js @@ -64,7 +64,7 @@ sheet.replaceSync(`:host { } .todo-item-text { - word-break: break-word; + overflow-wrap: break-word; padding: 0 60px; display: block; line-height: 60px; diff --git a/resources/todomvc/todomvc-css/dist/todo-item.css b/resources/todomvc/todomvc-css/dist/todo-item.css index a83518b67..59e1936e6 100644 --- a/resources/todomvc/todomvc-css/dist/todo-item.css +++ b/resources/todomvc/todomvc-css/dist/todo-item.css @@ -65,7 +65,7 @@ } .todo-item-text { - word-break: break-word; + overflow-wrap: break-word; padding: 0 60px; display: block; line-height: 60px; diff --git a/resources/todomvc/todomvc-css/dist/todo-item.module.css b/resources/todomvc/todomvc-css/dist/todo-item.module.css index a83518b67..59e1936e6 100644 --- a/resources/todomvc/todomvc-css/dist/todo-item.module.css +++ b/resources/todomvc/todomvc-css/dist/todo-item.module.css @@ -65,7 +65,7 @@ } .todo-item-text { - word-break: break-word; + overflow-wrap: break-word; padding: 0 60px; display: block; line-height: 60px; diff --git a/resources/todomvc/todomvc-css/src/css/todo-item.css b/resources/todomvc/todomvc-css/src/css/todo-item.css index a83518b67..59e1936e6 100644 --- a/resources/todomvc/todomvc-css/src/css/todo-item.css +++ b/resources/todomvc/todomvc-css/src/css/todo-item.css @@ -65,7 +65,7 @@ } .todo-item-text { - word-break: break-word; + overflow-wrap: break-word; padding: 0 60px; display: block; line-height: 60px; diff --git a/resources/todomvc/vanilla-examples/javascript-web-components-complex/dist/styles/todo-item.constructable.js b/resources/todomvc/vanilla-examples/javascript-web-components-complex/dist/styles/todo-item.constructable.js index ddd396dc7..59dba7f77 100644 --- a/resources/todomvc/vanilla-examples/javascript-web-components-complex/dist/styles/todo-item.constructable.js +++ b/resources/todomvc/vanilla-examples/javascript-web-components-complex/dist/styles/todo-item.constructable.js @@ -64,7 +64,7 @@ sheet.replaceSync(`:host { } .todo-item-text { - word-break: break-word; + overflow-wrap: break-word; padding: 0 60px; display: block; line-height: 60px; diff --git a/resources/todomvc/vanilla-examples/javascript-web-components/dist/styles/todo-item.constructable.js b/resources/todomvc/vanilla-examples/javascript-web-components/dist/styles/todo-item.constructable.js index ddd396dc7..59dba7f77 100644 --- a/resources/todomvc/vanilla-examples/javascript-web-components/dist/styles/todo-item.constructable.js +++ b/resources/todomvc/vanilla-examples/javascript-web-components/dist/styles/todo-item.constructable.js @@ -64,7 +64,7 @@ sheet.replaceSync(`:host { } .todo-item-text { - word-break: break-word; + overflow-wrap: break-word; padding: 0 60px; display: block; line-height: 60px;