full-websites-styled.html 436 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237123812391240124112421243124412451246124712481249125012511252125312541255125612571258125912601261126212631264126512661267126812691270127112721273127412751276127712781279128012811282128312841285128612871288128912901291129212931294129512961297129812991300130113021303130413051306130713081309131013111312131313141315131613171318131913201321132213231324132513261327132813291330133113321333133413351336133713381339134013411342134313441345134613471348134913501351135213531354135513561357135813591360136113621363136413651366136713681369137013711372137313741375137613771378137913801381138213831384138513861387138813891390139113921393139413951396139713981399140014011402140314041405140614071408140914101411141214131414141514161417141814191420142114221423142414251426142714281429143014311432143314341435143614371438143914401441144214431444144514461447144814491450145114521453145414551456145714581459146014611462146314641465146614671468146914701471147214731474147514761477147814791480148114821483148414851486148714881489149014911492149314941495149614971498149915001501150215031504150515061507150815091510151115121513151415151516151715181519152015211522152315241525152615271528152915301531153215331534153515361537153815391540154115421543154415451546154715481549155015511552155315541555155615571558155915601561156215631564156515661567156815691570157115721573157415751576157715781579158015811582158315841585158615871588158915901591159215931594159515961597159815991600160116021603160416051606160716081609161016111612161316141615161616171618161916201621162216231624162516261627162816291630163116321633163416351636163716381639164016411642164316441645164616471648164916501651165216531654165516561657165816591660166116621663166416651666166716681669167016711672167316741675167616771678167916801681168216831684168516861687168816891690169116921693169416951696169716981699170017011702170317041705170617071708170917101711171217131714171517161717171817191720172117221723172417251726172717281729173017311732173317341735173617371738173917401741174217431744174517461747174817491750175117521753175417551756175717581759176017611762176317641765176617671768176917701771177217731774177517761777177817791780178117821783178417851786178717881789179017911792179317941795179617971798179918001801180218031804180518061807180818091810181118121813181418151816181718181819182018211822182318241825182618271828182918301831183218331834183518361837183818391840184118421843184418451846184718481849185018511852185318541855185618571858185918601861186218631864186518661867186818691870187118721873187418751876187718781879188018811882188318841885188618871888188918901891189218931894189518961897189818991900190119021903190419051906190719081909191019111912191319141915191619171918191919201921192219231924192519261927192819291930193119321933193419351936193719381939194019411942194319441945194619471948194919501951195219531954195519561957195819591960196119621963196419651966196719681969197019711972197319741975197619771978197919801981198219831984198519861987198819891990199119921993199419951996199719981999200020012002200320042005200620072008200920102011201220132014201520162017201820192020202120222023202420252026202720282029203020312032203320342035203620372038203920402041204220432044204520462047204820492050205120522053205420552056205720582059206020612062206320642065206620672068206920702071207220732074207520762077207820792080208120822083208420852086208720882089209020912092209320942095209620972098209921002101210221032104210521062107210821092110211121122113211421152116211721182119212021212122212321242125212621272128212921302131213221332134213521362137213821392140214121422143214421452146214721482149215021512152215321542155215621572158215921602161216221632164216521662167216821692170217121722173217421752176217721782179218021812182218321842185218621872188218921902191219221932194219521962197219821992200220122022203220422052206220722082209221022112212221322142215221622172218221922202221222222232224222522262227222822292230223122322233223422352236223722382239224022412242224322442245224622472248224922502251225222532254225522562257225822592260226122622263226422652266226722682269227022712272227322742275227622772278227922802281228222832284228522862287228822892290229122922293229422952296229722982299230023012302230323042305230623072308230923102311231223132314231523162317231823192320232123222323232423252326232723282329233023312332233323342335233623372338233923402341234223432344234523462347234823492350235123522353235423552356235723582359236023612362236323642365236623672368236923702371237223732374237523762377237823792380238123822383238423852386238723882389239023912392239323942395239623972398239924002401240224032404240524062407240824092410241124122413241424152416241724182419242024212422242324242425242624272428242924302431243224332434243524362437243824392440244124422443244424452446244724482449245024512452245324542455245624572458245924602461246224632464246524662467246824692470247124722473247424752476247724782479248024812482248324842485248624872488248924902491249224932494249524962497249824992500250125022503250425052506250725082509251025112512251325142515251625172518251925202521252225232524252525262527252825292530253125322533253425352536253725382539254025412542254325442545254625472548254925502551255225532554255525562557255825592560256125622563256425652566256725682569257025712572257325742575257625772578257925802581258225832584258525862587258825892590259125922593259425952596259725982599260026012602260326042605260626072608260926102611261226132614261526162617261826192620262126222623262426252626262726282629263026312632263326342635263626372638263926402641264226432644264526462647264826492650265126522653265426552656265726582659266026612662266326642665266626672668266926702671267226732674267526762677267826792680268126822683268426852686268726882689269026912692269326942695269626972698269927002701270227032704270527062707270827092710271127122713271427152716271727182719272027212722272327242725272627272728272927302731273227332734273527362737273827392740274127422743274427452746274727482749275027512752275327542755275627572758275927602761276227632764276527662767276827692770277127722773277427752776277727782779278027812782278327842785278627872788278927902791279227932794279527962797279827992800280128022803280428052806280728082809281028112812281328142815281628172818281928202821282228232824282528262827282828292830283128322833283428352836283728382839284028412842284328442845284628472848284928502851285228532854285528562857285828592860286128622863286428652866286728682869287028712872287328742875287628772878287928802881288228832884288528862887288828892890289128922893289428952896289728982899290029012902290329042905290629072908290929102911291229132914291529162917291829192920292129222923292429252926292729282929293029312932293329342935293629372938293929402941294229432944294529462947294829492950295129522953295429552956295729582959296029612962296329642965296629672968296929702971297229732974297529762977297829792980298129822983298429852986298729882989299029912992299329942995299629972998299930003001300230033004300530063007300830093010301130123013301430153016301730183019302030213022302330243025302630273028302930303031303230333034303530363037303830393040304130423043304430453046304730483049305030513052305330543055305630573058305930603061306230633064306530663067306830693070307130723073307430753076307730783079308030813082308330843085308630873088308930903091309230933094309530963097309830993100310131023103310431053106310731083109311031113112311331143115311631173118311931203121312231233124312531263127312831293130313131323133313431353136313731383139314031413142314331443145314631473148314931503151315231533154315531563157315831593160316131623163316431653166316731683169317031713172317331743175317631773178317931803181318231833184318531863187318831893190319131923193319431953196319731983199320032013202320332043205320632073208320932103211321232133214321532163217321832193220322132223223322432253226322732283229323032313232323332343235323632373238323932403241324232433244324532463247324832493250325132523253325432553256325732583259326032613262326332643265326632673268326932703271327232733274327532763277327832793280328132823283328432853286328732883289329032913292329332943295329632973298329933003301330233033304330533063307330833093310331133123313331433153316331733183319332033213322332333243325332633273328332933303331333233333334333533363337333833393340334133423343334433453346334733483349335033513352335333543355335633573358335933603361336233633364336533663367336833693370337133723373337433753376337733783379338033813382338333843385338633873388338933903391339233933394339533963397339833993400340134023403340434053406340734083409341034113412341334143415341634173418341934203421342234233424342534263427342834293430343134323433343434353436343734383439344034413442344334443445344634473448344934503451345234533454345534563457345834593460346134623463346434653466346734683469347034713472347334743475347634773478347934803481348234833484348534863487348834893490349134923493349434953496349734983499350035013502350335043505350635073508350935103511351235133514351535163517351835193520352135223523352435253526352735283529353035313532353335343535353635373538353935403541354235433544354535463547354835493550355135523553355435553556355735583559356035613562356335643565356635673568356935703571357235733574357535763577357835793580358135823583358435853586358735883589359035913592359335943595359635973598359936003601360236033604360536063607360836093610361136123613361436153616361736183619362036213622362336243625362636273628362936303631363236333634363536363637363836393640364136423643364436453646364736483649365036513652365336543655365636573658365936603661366236633664366536663667366836693670367136723673367436753676367736783679368036813682368336843685368636873688368936903691369236933694369536963697369836993700370137023703370437053706370737083709371037113712371337143715371637173718371937203721372237233724372537263727372837293730373137323733373437353736373737383739374037413742374337443745374637473748374937503751375237533754375537563757375837593760376137623763376437653766376737683769377037713772377337743775377637773778377937803781378237833784378537863787378837893790379137923793379437953796379737983799380038013802380338043805380638073808380938103811381238133814381538163817381838193820382138223823382438253826382738283829383038313832383338343835383638373838383938403841384238433844384538463847384838493850385138523853385438553856385738583859386038613862386338643865386638673868386938703871387238733874387538763877387838793880388138823883388438853886388738883889389038913892389338943895389638973898389939003901390239033904390539063907390839093910391139123913391439153916391739183919392039213922392339243925392639273928392939303931393239333934393539363937393839393940394139423943394439453946394739483949395039513952395339543955395639573958395939603961396239633964396539663967396839693970397139723973397439753976397739783979398039813982398339843985398639873988398939903991399239933994399539963997399839994000400140024003400440054006400740084009401040114012401340144015401640174018401940204021402240234024402540264027402840294030403140324033403440354036403740384039404040414042404340444045404640474048404940504051405240534054405540564057405840594060406140624063406440654066406740684069407040714072407340744075407640774078407940804081408240834084408540864087408840894090409140924093409440954096409740984099410041014102410341044105410641074108410941104111411241134114411541164117411841194120412141224123412441254126412741284129413041314132413341344135413641374138413941404141414241434144414541464147414841494150415141524153415441554156415741584159416041614162416341644165416641674168416941704171417241734174417541764177417841794180418141824183418441854186418741884189419041914192419341944195419641974198419942004201420242034204420542064207420842094210421142124213421442154216421742184219422042214222422342244225422642274228422942304231423242334234423542364237423842394240424142424243424442454246424742484249425042514252425342544255425642574258425942604261426242634264426542664267426842694270427142724273427442754276427742784279428042814282428342844285428642874288428942904291429242934294429542964297429842994300430143024303430443054306430743084309431043114312431343144315431643174318431943204321432243234324432543264327432843294330433143324333433443354336433743384339434043414342434343444345434643474348434943504351435243534354435543564357435843594360436143624363436443654366436743684369437043714372437343744375437643774378437943804381438243834384438543864387438843894390439143924393439443954396439743984399440044014402440344044405440644074408440944104411441244134414441544164417441844194420442144224423442444254426442744284429443044314432443344344435443644374438443944404441444244434444444544464447444844494450445144524453445444554456445744584459446044614462446344644465446644674468446944704471447244734474447544764477447844794480448144824483448444854486448744884489449044914492449344944495449644974498449945004501450245034504450545064507450845094510451145124513451445154516451745184519452045214522452345244525452645274528452945304531453245334534453545364537453845394540454145424543454445454546454745484549455045514552455345544555455645574558455945604561456245634564456545664567456845694570457145724573457445754576457745784579458045814582458345844585458645874588458945904591459245934594459545964597459845994600460146024603460446054606460746084609461046114612461346144615461646174618461946204621462246234624462546264627462846294630463146324633463446354636463746384639464046414642464346444645464646474648464946504651465246534654465546564657465846594660466146624663466446654666466746684669467046714672467346744675467646774678467946804681468246834684468546864687468846894690469146924693469446954696469746984699470047014702470347044705470647074708470947104711471247134714471547164717471847194720472147224723472447254726472747284729473047314732473347344735473647374738473947404741474247434744474547464747474847494750475147524753475447554756475747584759476047614762476347644765476647674768476947704771477247734774477547764777477847794780478147824783478447854786478747884789479047914792479347944795479647974798479948004801480248034804480548064807480848094810481148124813481448154816481748184819482048214822482348244825482648274828482948304831483248334834483548364837483848394840484148424843484448454846484748484849485048514852485348544855485648574858485948604861486248634864486548664867486848694870487148724873487448754876487748784879488048814882488348844885488648874888488948904891489248934894489548964897489848994900490149024903490449054906490749084909491049114912491349144915491649174918491949204921492249234924492549264927492849294930493149324933493449354936493749384939494049414942494349444945494649474948494949504951495249534954495549564957495849594960496149624963496449654966496749684969497049714972497349744975497649774978497949804981498249834984498549864987498849894990499149924993499449954996499749984999500050015002500350045005500650075008500950105011501250135014501550165017501850195020502150225023502450255026502750285029503050315032503350345035503650375038503950405041504250435044504550465047504850495050505150525053505450555056505750585059506050615062506350645065506650675068506950705071507250735074507550765077507850795080508150825083508450855086508750885089509050915092509350945095509650975098509951005101510251035104510551065107510851095110511151125113511451155116511751185119512051215122512351245125512651275128512951305131513251335134513551365137513851395140514151425143514451455146514751485149515051515152515351545155515651575158515951605161516251635164516551665167516851695170517151725173517451755176517751785179518051815182518351845185518651875188518951905191519251935194519551965197519851995200520152025203520452055206520752085209521052115212521352145215521652175218521952205221522252235224522552265227522852295230523152325233523452355236523752385239524052415242524352445245524652475248524952505251525252535254
  1. <div class="position-relative js-header-wrapper "
  2. style="box-sizing: border-box; position: relative !important; color: rgb(36, 41, 46); font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Helvetica, Arial, sans-serif, &quot;Apple Color Emoji&quot;, &quot;Segoe UI Emoji&quot;; font-size: 14px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 400; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial;">
  3. <header class="Header-old header-logged-out position-relative f4 py-2" role="banner"
  4. style="box-sizing: border-box; display: block; position: relative !important; padding-top: 8px !important; padding-bottom: 8px !important; font-size: 16px !important; z-index: 32; color: rgba(255, 255, 255, 0.7); background-color: rgb(36, 41, 46);">
  5. <div class="container-lg d-flex px-3"
  6. style="box-sizing: border-box; max-width: 1012px; margin-right: auto; margin-left: auto; padding-left: 16px !important; padding-right: 16px !important; display: flex !important;">
  7. <div class="HeaderMenu HeaderMenu--logged-out d-flex flex-justify-between flex-items-center flex-auto"
  8. style="box-sizing: border-box; justify-content: space-between !important; align-items: center !important; flex: 1 1 auto !important; display: flex !important;">
  9. <div class="d-flex flex-items-center px-0 text-center text-left"
  10. style="box-sizing: border-box; align-items: center !important; padding-left: 0px !important; padding-right: 0px !important; text-align: center !important; display: flex !important;">
  11. <a class="HeaderMenu-link d-inline-block no-underline border border-gray-dark rounded-1 px-2 py-1"
  12. data-ga-click="(Logged out) Header, clicked Sign up, text:sign-up"
  13. href="https://github.com/join?source_repo=ckeditor%2Fckeditor5"
  14. style="box-sizing: border-box; background: transparent; color: rgb(255, 255, 255); text-decoration: none !important; border: 1px solid rgb(209, 213, 218) !important; border-radius: 3px !important; padding: 4px 8px !important; display: inline-block !important; transition: all 0.4s ease 0s;">Sign&nbsp;up</a>
  15. </div>
  16. </div>
  17. </div>
  18. </header>
  19. </div>
  20. <div class="show-on-focus" id="start-of-content"
  21. style="box-sizing: border-box; position: absolute; width: 1px; height: 1px; overflow: hidden; margin: 0px; clip: rect(1px, 1px, 1px, 1px); color: rgb(36, 41, 46); font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Helvetica, Arial, sans-serif, &quot;Apple Color Emoji&quot;, &quot;Segoe UI Emoji&quot;; font-size: 14px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 400; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial;">
  22. &nbsp;</div>
  23. <div id="js-flash-container"
  24. style="box-sizing: border-box; color: rgb(36, 41, 46); font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Helvetica, Arial, sans-serif, &quot;Apple Color Emoji&quot;, &quot;Segoe UI Emoji&quot;; font-size: 14px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 400; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial;">
  25. &nbsp;</div>
  26. <div class="application-main " data-commit-hovercards-enabled=""
  27. style="box-sizing: border-box; color: rgb(36, 41, 46); font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Helvetica, Arial, sans-serif, &quot;Apple Color Emoji&quot;, &quot;Segoe UI Emoji&quot;; font-size: 14px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 400; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial;">
  28. <div itemscope="" itemtype="http://schema.org/SoftwareSourceCode" style="box-sizing: border-box;">
  29. <main data-pjax-container="" id="js-repo-pjax-container" style="box-sizing: border-box; display: block;">
  30. <div class="pagehead repohead readability-menu experiment-repo-nav pt-3 pb-0"
  31. style="box-sizing: border-box; padding-bottom: 0px; padding-top: 24px; position: relative; margin-bottom: 24px; border-bottom: 1px solid rgb(225, 228, 232); background-color: rgb(250, 251, 252);">
  32. <div class="container-lg mb-4 px-3 d-flex"
  33. style="box-sizing: border-box; max-width: 1012px; margin-right: auto; margin-left: auto; margin-bottom: 24px !important; padding-left: 16px !important; padding-right: 16px !important; display: flex !important;">
  34. <div class="flex-auto min-width-0 width-fit mr-3"
  35. style="box-sizing: border-box; flex: 1 1 auto !important; max-width: 100%; min-width: 0px !important; margin-right: 16px !important;">
  36. <h1 class="public d-flex flex-wrap flex-items-center break-word float-none"
  37. style="box-sizing: border-box; font-size: 18px; margin: 0px; font-weight: 400; flex-wrap: wrap !important; align-items: center !important; float: none !important; word-break: break-word !important; overflow-wrap: break-word !important; display: flex !important; line-height: 26px; position: relative; max-width: 635px; color: rgb(88, 96, 105);">
  38. <svg aria-hidden="true" class="octicon octicon-repo mr-1" height="16" version="1.1"
  39. viewbox="0 0 12 16" width="12">
  40. <path
  41. d="M4 9H3V8h1v1zm0-3H3v1h1V6zm0-2H3v1h1V4zm0-2H3v1h1V2zm8-1v12c0 .55-.45 1-1 1H6v2l-1.5-1.5L3 16v-2H1c-.55 0-1-.45-1-1V1c0-.55.45-1 1-1h10c.55 0 1 .45 1 1zm-1 10H1v2h2v-1h3v1h5v-2zm0-10H2v9h9V1z"
  42. fill-rule="evenodd"> </path>
  43. </svg><span class="author" itemprop="author" style="box-sizing: border-box;"><a
  44. class="url fn" data-hovercard-type="organization"
  45. data-hovercard-url="/orgs/ckeditor/hovercard" href="https://github.com/ckeditor"
  46. rel="author"
  47. style="box-sizing: border-box; background-color: initial; color: rgb(3, 102, 214); text-decoration: none;">ckeditor</a></span><span
  48. class="path-divider" style="box-sizing: border-box; margin: 0px 0.25em;">/</span><strong
  49. class="mr-2" itemprop="name"
  50. style="box-sizing: border-box; font-weight: 600; margin-right: 8px !important;"><a
  51. data-pjax="#js-repo-pjax-container" href="https://github.com/ckeditor/ckeditor5"
  52. style="box-sizing: border-box; background-color: initial; color: rgb(3, 102, 214); text-decoration: none;">ckeditor5</a></strong>
  53. </h1>
  54. </div>
  55. <ul class="pagehead-actions flex-shrink-0"
  56. style="box-sizing: border-box; padding-left: 0px; margin: 0px; flex-shrink: 0 !important; position: relative; z-index: 31; float: right;">
  57. <li
  58. style="box-sizing: border-box; float: left; margin: 0px 10px 0px 0px; font-size: 11px; color: rgb(36, 41, 46); list-style-type: none;">
  59. <a aria-label="You must be signed in to watch a repository"
  60. class="tooltipped tooltipped-s btn btn-sm btn-with-count"
  61. href="https://github.com/login?return_to=%2Fckeditor%2Fckeditor5" rel="nofollow"
  62. style="box-sizing: border-box; background-color: rgb(239, 243, 246); color: rgb(36, 41, 46); text-decoration: none; position: relative; display: inline-block; padding: 3px 10px; font-size: 12px; font-weight: 600; line-height: 20px; white-space: nowrap; vertical-align: middle; cursor: pointer; user-select: none; background-repeat: repeat-x; background-position: -1px -1px; background-size: 110% 110%; border: 1px solid rgba(27, 31, 35, 0.2); border-radius: 0.25em 0px 0px 0.25em; -webkit-appearance: none; background-image: linear-gradient(-180deg, rgb(250, 251, 252), rgb(239, 243, 246) 90%); float: left;"><svg
  63. aria-hidden="true" class="octicon octicon-eye v-align-text-bottom" height="16"
  64. version="1.1" viewbox="0 0 16 16" width="16">
  65. <path
  66. d="M8.06 2C3 2 0 8 0 8s3 6 8.06 6C13 14 16 8 16 8s-3-6-7.94-6zM8 12c-2.2 0-4-1.78-4-4 0-2.2 1.8-4 4-4 2.22 0 4 1.8 4 4 0 2.22-1.78 4-4 4zm2-4c0 1.11-.89 2-2 2-1.11 0-2-.89-2-2 0-1.11.89-2 2-2 1.11 0 2 .89 2 2z"
  67. fill-rule="evenodd"> </path>
  68. </svg><span>&nbsp;</span>Watch</a><a aria-label="119 users are watching this repository"
  69. class="social-count" href="https://github.com/ckeditor/ckeditor5/watchers"
  70. style="box-sizing: border-box; background-color: rgb(255, 255, 255); color: rgb(36, 41, 46); text-decoration: none; float: left; padding: 3px 10px; font-size: 12px; font-weight: 600; line-height: 20px; vertical-align: middle; border-width: 1px 1px 1px 0px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-top-color: rgba(27, 31, 35, 0.2); border-right-color: rgba(27, 31, 35, 0.2); border-bottom-color: rgba(27, 31, 35, 0.2); border-image: initial; border-left-style: initial; border-left-color: initial; border-top-right-radius: 3px; border-bottom-right-radius: 3px;">119</a>
  71. </li>
  72. <li
  73. style="box-sizing: border-box; float: left; margin: 0px 10px 0px 0px; font-size: 11px; color: rgb(36, 41, 46); list-style-type: none;">
  74. <a aria-label="You must be signed in to star a repository"
  75. class="btn btn-sm btn-with-count tooltipped tooltipped-s"
  76. href="https://github.com/login?return_to=%2Fckeditor%2Fckeditor5" rel="nofollow"
  77. style="box-sizing: border-box; background-color: rgb(239, 243, 246); color: rgb(36, 41, 46); text-decoration: none; position: relative; display: inline-block; padding: 3px 10px; font-size: 12px; font-weight: 600; line-height: 20px; white-space: nowrap; vertical-align: middle; cursor: pointer; user-select: none; background-repeat: repeat-x; background-position: -1px -1px; background-size: 110% 110%; border: 1px solid rgba(27, 31, 35, 0.2); border-radius: 0.25em 0px 0px 0.25em; -webkit-appearance: none; background-image: linear-gradient(-180deg, rgb(250, 251, 252), rgb(239, 243, 246) 90%); float: left;"><svg
  78. aria-label="star" class="octicon octicon-star v-align-text-bottom" height="16"
  79. role="img" version="1.1" viewbox="0 0 14 16" width="14">
  80. <path
  81. d="M14 6l-4.9-.64L7 1 4.9 5.36 0 6l3.6 3.26L2.67 14 7 11.67 11.33 14l-.93-4.74L14 6z"
  82. fill-rule="evenodd"> </path>
  83. </svg><span>&nbsp;</span>Star</a><a aria-label="3004 users starred this repository"
  84. class="social-count js-social-count"
  85. href="https://github.com/ckeditor/ckeditor5/stargazers"
  86. style="box-sizing: border-box; background-color: rgb(255, 255, 255); color: rgb(36, 41, 46); text-decoration: none; float: left; padding: 3px 10px; font-size: 12px; font-weight: 600; line-height: 20px; vertical-align: middle; border-width: 1px 1px 1px 0px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-top-color: rgba(27, 31, 35, 0.2); border-right-color: rgba(27, 31, 35, 0.2); border-bottom-color: rgba(27, 31, 35, 0.2); border-image: initial; border-left-style: initial; border-left-color: initial; border-top-right-radius: 3px; border-bottom-right-radius: 3px;">3k</a>
  87. </li>
  88. <li
  89. style="box-sizing: border-box; float: left; margin: 0px; font-size: 11px; color: rgb(36, 41, 46); list-style-type: none;">
  90. <a aria-label="You must be signed in to fork a repository"
  91. class="btn btn-sm btn-with-count tooltipped tooltipped-s"
  92. href="https://github.com/login?return_to=%2Fckeditor%2Fckeditor5" rel="nofollow"
  93. style="box-sizing: border-box; background-color: rgb(239, 243, 246); color: rgb(36, 41, 46); text-decoration: none; position: relative; display: inline-block; padding: 3px 10px; font-size: 12px; font-weight: 600; line-height: 20px; white-space: nowrap; vertical-align: middle; cursor: pointer; user-select: none; background-repeat: repeat-x; background-position: -1px -1px; background-size: 110% 110%; border: 1px solid rgba(27, 31, 35, 0.2); border-radius: 0.25em 0px 0px 0.25em; -webkit-appearance: none; background-image: linear-gradient(-180deg, rgb(250, 251, 252), rgb(239, 243, 246) 90%); float: left;"><svg
  94. aria-hidden="true" class="octicon octicon-repo-forked v-align-text-bottom"
  95. height="16" version="1.1" viewbox="0 0 10 16" width="10">
  96. <path
  97. d="M8 1a1.993 1.993 0 00-1 3.72V6L5 8 3 6V4.72A1.993 1.993 0 002 1a1.993 1.993 0 00-1 3.72V6.5l3 3v1.78A1.993 1.993 0 005 15a1.993 1.993 0 001-3.72V9.5l3-3V4.72A1.993 1.993 0 008 1zM2 4.2C1.34 4.2.8 3.65.8 3c0-.65.55-1.2 1.2-1.2.65 0 1.2.55 1.2 1.2 0 .65-.55 1.2-1.2 1.2zm3 10c-.66 0-1.2-.55-1.2-1.2 0-.65.55-1.2 1.2-1.2.65 0 1.2.55 1.2 1.2 0 .65-.55 1.2-1.2 1.2zm3-10c-.66 0-1.2-.55-1.2-1.2 0-.65.55-1.2 1.2-1.2.65 0 1.2.55 1.2 1.2 0 .65-.55 1.2-1.2 1.2z"
  98. fill-rule="evenodd"> </path>
  99. </svg><span>&nbsp;</span>Fork</a><a aria-label="635 users forked this repository"
  100. class="social-count" href="https://github.com/ckeditor/ckeditor5/network/members"
  101. style="box-sizing: border-box; background-color: rgb(255, 255, 255); color: rgb(36, 41, 46); text-decoration: none; float: left; padding: 3px 10px; font-size: 12px; font-weight: 600; line-height: 20px; vertical-align: middle; border-width: 1px 1px 1px 0px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-top-color: rgba(27, 31, 35, 0.2); border-right-color: rgba(27, 31, 35, 0.2); border-bottom-color: rgba(27, 31, 35, 0.2); border-image: initial; border-left-style: initial; border-left-color: initial; border-top-right-radius: 3px; border-bottom-right-radius: 3px;">635</a>
  102. </li>
  103. </ul>
  104. </div>
  105. <nav aria-label="Repository"
  106. class="hx_reponav reponav js-repo-nav js-sidenav-container-pjax clearfix container-lg px-3"
  107. data-pjax="#js-repo-pjax-container" itemscope="" itemtype="http://schema.org/BreadcrumbList"
  108. style="box-sizing: border-box; display: block; max-width: 1012px; margin-right: auto; margin-left: auto; padding-left: 16px !important; padding-right: 16px !important; position: relative; top: 1px; margin-top: -5px;">
  109. <div class="d-inline" style="box-sizing: border-box; display: inline !important;"><span
  110. itemprop="itemListElement" itemscope="" itemtype="http://schema.org/ListItem"
  111. style="box-sizing: border-box;"><a class="js-selected-navigation-item reponav-item"
  112. data-hotkey="g c"
  113. data-selected-links="repo_source repo_downloads repo_commits repo_releases repo_tags repo_branches repo_packages /ckeditor/ckeditor5"
  114. href="https://github.com/ckeditor/ckeditor5" itemprop="url"
  115. style="box-sizing: border-box; background-color: initial; color: rgb(88, 96, 105); text-decoration: none; float: left; padding: 7px 12px 8px !important; white-space: nowrap; border-width: 3px 1px 1px; border-style: solid; border-color: transparent; border-image: initial; border-radius: 3px 3px 0px 0px;"><svg
  116. aria-hidden="true" class="octicon octicon-code" height="16" version="1.1"
  117. viewbox="0 0 14 16" width="14">
  118. <path
  119. d="M9.5 3L8 4.5 11.5 8 8 11.5 9.5 13 14 8 9.5 3zm-5 0L0 8l4.5 5L6 11.5 2.5 8 6 4.5 4.5 3z"
  120. fill-rule="evenodd"> </path>
  121. </svg></a></span></div>
  122. <span itemprop="itemListElement" itemscope="" itemtype="http://schema.org/ListItem"
  123. style="box-sizing: border-box;"><a class="js-selected-navigation-item reponav-item"
  124. data-hotkey="g c"
  125. data-selected-links="repo_source repo_downloads repo_commits repo_releases repo_tags repo_branches repo_packages /ckeditor/ckeditor5"
  126. href="https://github.com/ckeditor/ckeditor5" itemprop="url"
  127. style="box-sizing: border-box; background-color: initial; color: rgb(88, 96, 105); text-decoration: none; float: left; padding: 7px 12px 8px !important; white-space: nowrap; border-width: 3px 1px 1px; border-style: solid; border-color: transparent; border-image: initial; border-radius: 3px 3px 0px 0px;"><span>&nbsp;</span><span
  128. itemprop="name" style="box-sizing: border-box;">Code</span> </a></span><span
  129. itemprop="itemListElement" itemscope="" itemtype="http://schema.org/ListItem"
  130. style="box-sizing: border-box;"><a aria-current="page"
  131. class="js-selected-navigation-item selected reponav-item" data-hotkey="g i"
  132. data-selected-links="repo_issues repo_labels repo_milestones /ckeditor/ckeditor5/issues"
  133. href="https://github.com/ckeditor/ckeditor5/issues" itemprop="url"
  134. style="box-sizing: border-box; background-color: rgb(255, 255, 255); color: rgb(36, 41, 46); text-decoration: none; float: left; padding: 7px 12px 8px !important; white-space: nowrap; border-width: 3px 1px 1px; border-style: solid; border-color: rgb(227, 98, 9) rgb(225, 228, 232) transparent; border-image: initial; border-radius: 3px 3px 0px 0px;">
  135. </a></span>
  136. <div class="d-inline" style="box-sizing: border-box; display: inline !important;"><span
  137. itemprop="itemListElement" itemscope="" itemtype="http://schema.org/ListItem"
  138. style="box-sizing: border-box;"><a aria-current="page"
  139. class="js-selected-navigation-item selected reponav-item" data-hotkey="g i"
  140. data-selected-links="repo_issues repo_labels repo_milestones /ckeditor/ckeditor5/issues"
  141. href="https://github.com/ckeditor/ckeditor5/issues" itemprop="url"
  142. style="box-sizing: border-box; background-color: rgb(255, 255, 255); color: rgb(36, 41, 46); text-decoration: none; float: left; padding: 7px 12px 8px !important; white-space: nowrap; border-width: 3px 1px 1px; border-style: solid; border-color: rgb(227, 98, 9) rgb(225, 228, 232) transparent; border-image: initial; border-radius: 3px 3px 0px 0px;"><svg
  143. aria-hidden="true" class="octicon octicon-issue-opened" height="16" version="1.1"
  144. viewbox="0 0 14 16" width="14">
  145. <path
  146. d="M7 2.3c3.14 0 5.7 2.56 5.7 5.7s-2.56 5.7-5.7 5.7A5.71 5.71 0 011.3 8c0-3.14 2.56-5.7 5.7-5.7zM7 1C3.14 1 0 4.14 0 8s3.14 7 7 7 7-3.14 7-7-3.14-7-7-7zm1 3H6v5h2V4zm0 6H6v2h2v-2z"
  147. fill-rule="evenodd"> </path>
  148. </svg></a></span></div>
  149. <span itemprop="itemListElement" itemscope="" itemtype="http://schema.org/ListItem"
  150. style="box-sizing: border-box;"><a aria-current="page"
  151. class="js-selected-navigation-item selected reponav-item" data-hotkey="g i"
  152. data-selected-links="repo_issues repo_labels repo_milestones /ckeditor/ckeditor5/issues"
  153. href="https://github.com/ckeditor/ckeditor5/issues" itemprop="url"
  154. style="box-sizing: border-box; background-color: rgb(255, 255, 255); color: rgb(36, 41, 46); text-decoration: none; float: left; padding: 7px 12px 8px !important; white-space: nowrap; border-width: 3px 1px 1px; border-style: solid; border-color: rgb(227, 98, 9) rgb(225, 228, 232) transparent; border-image: initial; border-radius: 3px 3px 0px 0px;"><span>&nbsp;</span><span
  155. itemprop="name" style="box-sizing: border-box;">Issues</span><span>&nbsp;</span><span
  156. class="Counter"
  157. style="box-sizing: border-box; display: inline-block; padding: 2px 4px !important; font-size: 12px; font-weight: 600; line-height: 1; color: rgb(68, 77, 86); background-color: rgba(27, 31, 35, 0.08); border-radius: 20px;">1,175</span>
  158. </a></span><span itemprop="itemListElement" itemscope="" itemtype="http://schema.org/ListItem"
  159. style="box-sizing: border-box;"><a class="js-selected-navigation-item reponav-item"
  160. data-hotkey="g p" data-selected-links="repo_pulls checks /ckeditor/ckeditor5/pulls"
  161. data-skip-pjax="true" href="https://github.com/ckeditor/ckeditor5/pulls" itemprop="url"
  162. style="box-sizing: border-box; background-color: initial; color: rgb(88, 96, 105); text-decoration: none; float: left; padding: 7px 12px 8px !important; white-space: nowrap; border-width: 3px 1px 1px; border-style: solid; border-color: transparent; border-image: initial; border-radius: 3px 3px 0px 0px;">
  163. </a></span>
  164. <div class="d-inline" style="box-sizing: border-box; display: inline !important;"><span
  165. itemprop="itemListElement" itemscope="" itemtype="http://schema.org/ListItem"
  166. style="box-sizing: border-box;"><a class="js-selected-navigation-item reponav-item"
  167. data-hotkey="g p" data-selected-links="repo_pulls checks /ckeditor/ckeditor5/pulls"
  168. data-skip-pjax="true" href="https://github.com/ckeditor/ckeditor5/pulls" itemprop="url"
  169. style="box-sizing: border-box; background-color: initial; color: rgb(88, 96, 105); text-decoration: none; float: left; padding: 7px 12px 8px !important; white-space: nowrap; border-width: 3px 1px 1px; border-style: solid; border-color: transparent; border-image: initial; border-radius: 3px 3px 0px 0px;"><svg
  170. aria-hidden="true" class="octicon octicon-git-pull-request" height="16"
  171. version="1.1" viewbox="0 0 12 16" width="12">
  172. <path
  173. d="M11 11.28V5c-.03-.78-.34-1.47-.94-2.06C9.46 2.35 8.78 2.03 8 2H7V0L4 3l3 3V4h1c.27.02.48.11.69.31.21.2.3.42.31.69v6.28A1.993 1.993 0 0010 15a1.993 1.993 0 001-3.72zm-1 2.92c-.66 0-1.2-.55-1.2-1.2 0-.65.55-1.2 1.2-1.2.65 0 1.2.55 1.2 1.2 0 .65-.55 1.2-1.2 1.2zM4 3c0-1.11-.89-2-2-2a1.993 1.993 0 00-1 3.72v6.56A1.993 1.993 0 002 15a1.993 1.993 0 001-3.72V4.72c.59-.34 1-.98 1-1.72zm-.8 10c0 .66-.55 1.2-1.2 1.2-.65 0-1.2-.55-1.2-1.2 0-.65.55-1.2 1.2-1.2.65 0 1.2.55 1.2 1.2zM2 4.2C1.34 4.2.8 3.65.8 3c0-.65.55-1.2 1.2-1.2.65 0 1.2.55 1.2 1.2 0 .65-.55 1.2-1.2 1.2z"
  174. fill-rule="evenodd"> </path>
  175. </svg></a></span></div>
  176. <span itemprop="itemListElement" itemscope="" itemtype="http://schema.org/ListItem"
  177. style="box-sizing: border-box;"><a class="js-selected-navigation-item reponav-item"
  178. data-hotkey="g p" data-selected-links="repo_pulls checks /ckeditor/ckeditor5/pulls"
  179. data-skip-pjax="true" href="https://github.com/ckeditor/ckeditor5/pulls" itemprop="url"
  180. style="box-sizing: border-box; background-color: initial; color: rgb(88, 96, 105); text-decoration: none; float: left; padding: 7px 12px 8px !important; white-space: nowrap; border-width: 3px 1px 1px; border-style: solid; border-color: transparent; border-image: initial; border-radius: 3px 3px 0px 0px;"><span>&nbsp;</span><span
  181. itemprop="name" style="box-sizing: border-box;">Pull
  182. requests</span><span>&nbsp;</span><span class="Counter"
  183. style="box-sizing: border-box; display: inline-block; padding: 2px 4px !important; font-size: 12px; font-weight: 600; line-height: 1; color: rgb(68, 77, 86); background-color: rgba(27, 31, 35, 0.08); border-radius: 20px;">6</span>
  184. </a></span><span class="position-relative float-left" itemprop="itemListElement" itemscope=""
  185. itemtype="http://schema.org/ListItem"
  186. style="box-sizing: border-box; position: relative !important; float: left !important;"><a
  187. class="js-selected-navigation-item reponav-item" data-hotkey="g w"
  188. data-selected-links="repo_actions /ckeditor/ckeditor5/actions" data-skip-pjax="true"
  189. href="https://github.com/ckeditor/ckeditor5/actions"
  190. style="box-sizing: border-box; background-color: initial; color: rgb(88, 96, 105); text-decoration: none; float: left; padding: 7px 12px 8px !important; white-space: nowrap; border-width: 3px 1px 1px; border-style: solid; border-color: transparent; border-image: initial; border-radius: 3px 3px 0px 0px;">
  191. </a></span>
  192. <div class="d-inline" style="box-sizing: border-box; display: inline !important;"><span
  193. class="position-relative float-left" itemprop="itemListElement" itemscope=""
  194. itemtype="http://schema.org/ListItem"
  195. style="box-sizing: border-box; position: relative !important; float: left !important;"><a
  196. class="js-selected-navigation-item reponav-item" data-hotkey="g w"
  197. data-selected-links="repo_actions /ckeditor/ckeditor5/actions" data-skip-pjax="true"
  198. href="https://github.com/ckeditor/ckeditor5/actions"
  199. style="box-sizing: border-box; background-color: initial; color: rgb(88, 96, 105); text-decoration: none; float: left; padding: 7px 12px 8px !important; white-space: nowrap; border-width: 3px 1px 1px; border-style: solid; border-color: transparent; border-image: initial; border-radius: 3px 3px 0px 0px;"><svg
  200. aria-hidden="true" class="octicon octicon-play" height="16" version="1.1"
  201. viewbox="0 0 14 16" width="14">
  202. <path
  203. d="M14 8A7 7 0 110 8a7 7 0 0114 0zm-8.223 3.482l4.599-3.066a.5.5 0 000-.832L5.777 4.518A.5.5 0 005 4.934v6.132a.5.5 0 00.777.416z"
  204. fill-rule="evenodd"> </path>
  205. </svg></a></span></div>
  206. <span class="position-relative float-left" itemprop="itemListElement" itemscope=""
  207. itemtype="http://schema.org/ListItem"
  208. style="box-sizing: border-box; position: relative !important; float: left !important;"><a
  209. class="js-selected-navigation-item reponav-item" data-hotkey="g w"
  210. data-selected-links="repo_actions /ckeditor/ckeditor5/actions" data-skip-pjax="true"
  211. href="https://github.com/ckeditor/ckeditor5/actions"
  212. style="box-sizing: border-box; background-color: initial; color: rgb(88, 96, 105); text-decoration: none; float: left; padding: 7px 12px 8px !important; white-space: nowrap; border-width: 3px 1px 1px; border-style: solid; border-color: transparent; border-image: initial; border-radius: 3px 3px 0px 0px;"><span>&nbsp;</span>Actions
  213. </a></span><a class="js-selected-navigation-item reponav-item" data-hotkey="g w"
  214. data-selected-links="repo_wiki /ckeditor/ckeditor5/wiki"
  215. href="https://github.com/ckeditor/ckeditor5/wiki"
  216. style="box-sizing: border-box; background-color: initial; color: rgb(88, 96, 105); text-decoration: none; float: left; padding: 7px 12px 8px !important; white-space: nowrap; border-width: 3px 1px 1px; border-style: solid; border-color: transparent; border-image: initial; border-radius: 3px 3px 0px 0px;">
  217. </a>
  218. <div class="d-inline" style="box-sizing: border-box; display: inline !important;"><a
  219. class="js-selected-navigation-item reponav-item" data-hotkey="g w"
  220. data-selected-links="repo_wiki /ckeditor/ckeditor5/wiki"
  221. href="https://github.com/ckeditor/ckeditor5/wiki"
  222. style="box-sizing: border-box; background-color: initial; color: rgb(88, 96, 105); text-decoration: none; float: left; padding: 7px 12px 8px !important; white-space: nowrap; border-width: 3px 1px 1px; border-style: solid; border-color: transparent; border-image: initial; border-radius: 3px 3px 0px 0px;"><svg
  223. aria-hidden="true" class="octicon octicon-book" height="16" version="1.1"
  224. viewbox="0 0 16 16" width="16">
  225. <path
  226. d="M3 5h4v1H3V5zm0 3h4V7H3v1zm0 2h4V9H3v1zm11-5h-4v1h4V5zm0 2h-4v1h4V7zm0 2h-4v1h4V9zm2-6v9c0 .55-.45 1-1 1H9.5l-1 1-1-1H2c-.55 0-1-.45-1-1V3c0-.55.45-1 1-1h5.5l1 1 1-1H15c.55 0 1 .45 1 1zm-8 .5L7.5 3H2v9h6V3.5zm7-.5H9.5l-.5.5V12h6V3z"
  227. fill-rule="evenodd"> </path>
  228. </svg></a></div>
  229. <a class="js-selected-navigation-item reponav-item" data-hotkey="g w"
  230. data-selected-links="repo_wiki /ckeditor/ckeditor5/wiki"
  231. href="https://github.com/ckeditor/ckeditor5/wiki"
  232. style="box-sizing: border-box; background-color: initial; color: rgb(88, 96, 105); text-decoration: none; float: left; padding: 7px 12px 8px !important; white-space: nowrap; border-width: 3px 1px 1px; border-style: solid; border-color: transparent; border-image: initial; border-radius: 3px 3px 0px 0px;"><span>&nbsp;</span>Wiki
  233. </a><a class="js-selected-navigation-item reponav-item"
  234. data-selected-links="security alerts policy token_scanning code_scanning /ckeditor/ckeditor5/security/advisories"
  235. data-skip-pjax="true" href="https://github.com/ckeditor/ckeditor5/security/advisories"
  236. style="box-sizing: border-box; background-color: initial; color: rgb(88, 96, 105); text-decoration: none; float: left; padding: 7px 12px 8px !important; white-space: nowrap; border-width: 3px 1px 1px; border-style: solid; border-color: transparent; border-image: initial; border-radius: 3px 3px 0px 0px;">
  237. </a>
  238. <div class="d-inline" style="box-sizing: border-box; display: inline !important;"><a
  239. class="js-selected-navigation-item reponav-item"
  240. data-selected-links="security alerts policy token_scanning code_scanning /ckeditor/ckeditor5/security/advisories"
  241. data-skip-pjax="true" href="https://github.com/ckeditor/ckeditor5/security/advisories"
  242. style="box-sizing: border-box; background-color: initial; color: rgb(88, 96, 105); text-decoration: none; float: left; padding: 7px 12px 8px !important; white-space: nowrap; border-width: 3px 1px 1px; border-style: solid; border-color: transparent; border-image: initial; border-radius: 3px 3px 0px 0px;"><svg
  243. aria-hidden="true" class="octicon octicon-shield" height="16" version="1.1"
  244. viewbox="0 0 14 16" width="14">
  245. <path
  246. d="M0 2l7-2 7 2v6.02C14 12.69 8.69 16 7 16c-1.69 0-7-3.31-7-7.98V2zm1 .75L7 1l6 1.75v5.268C13 12.104 8.449 15 7 15c-1.449 0-6-2.896-6-6.982V2.75zm1 .75L7 2v12c-1.207 0-5-2.482-5-5.985V3.5z"
  247. fill-rule="evenodd"> </path>
  248. </svg></a></div>
  249. <a class="js-selected-navigation-item reponav-item"
  250. data-selected-links="security alerts policy token_scanning code_scanning /ckeditor/ckeditor5/security/advisories"
  251. data-skip-pjax="true" href="https://github.com/ckeditor/ckeditor5/security/advisories"
  252. style="box-sizing: border-box; background-color: initial; color: rgb(88, 96, 105); text-decoration: none; float: left; padding: 7px 12px 8px !important; white-space: nowrap; border-width: 3px 1px 1px; border-style: solid; border-color: transparent; border-image: initial; border-radius: 3px 3px 0px 0px;"><span>&nbsp;</span>Security
  253. </a><a class="js-selected-navigation-item reponav-item"
  254. data-selected-links="repo_graphs repo_contributors dependency_graph pulse people /ckeditor/ckeditor5/pulse"
  255. href="https://github.com/ckeditor/ckeditor5/pulse"
  256. style="box-sizing: border-box; background-color: initial; color: rgb(88, 96, 105); text-decoration: none; float: left; padding: 7px 12px 8px !important; white-space: nowrap; border-width: 3px 1px 1px; border-style: solid; border-color: transparent; border-image: initial; border-radius: 3px 3px 0px 0px;">
  257. </a>
  258. <div class="d-inline" style="box-sizing: border-box; display: inline !important;"><a
  259. class="js-selected-navigation-item reponav-item"
  260. data-selected-links="repo_graphs repo_contributors dependency_graph pulse people /ckeditor/ckeditor5/pulse"
  261. href="https://github.com/ckeditor/ckeditor5/pulse"
  262. style="box-sizing: border-box; background-color: initial; color: rgb(88, 96, 105); text-decoration: none; float: left; padding: 7px 12px 8px !important; white-space: nowrap; border-width: 3px 1px 1px; border-style: solid; border-color: transparent; border-image: initial; border-radius: 3px 3px 0px 0px;"><svg
  263. aria-hidden="true" class="octicon octicon-graph" height="16" version="1.1"
  264. viewbox="0 0 16 16" width="16">
  265. <path d="M16 14v1H0V0h1v14h15zM5 13H3V8h2v5zm4 0H7V3h2v10zm4 0h-2V6h2v7z"
  266. fill-rule="evenodd"></path>
  267. </svg></a></div>
  268. <a class="js-selected-navigation-item reponav-item"
  269. data-selected-links="repo_graphs repo_contributors dependency_graph pulse people /ckeditor/ckeditor5/pulse"
  270. href="https://github.com/ckeditor/ckeditor5/pulse"
  271. style="box-sizing: border-box; background-color: initial; color: rgb(88, 96, 105); text-decoration: none; float: left; padding: 7px 12px 8px !important; white-space: nowrap; border-width: 3px 1px 1px; border-style: solid; border-color: transparent; border-image: initial; border-radius: 3px 3px 0px 0px;"><span>&nbsp;</span>Insights
  272. </a>
  273. </nav>
  274. </div>
  275. <div class="container-lg clearfix new-discussion-timeline experiment-repo-nav px-3"
  276. style="box-sizing: border-box; max-width: 1012px; margin-right: auto; margin-left: auto; padding-left: 16px !important; padding-right: 16px !important;">
  277. <div class="repository-content " style="box-sizing: border-box;">
  278. <div class="js-check-all-container" data-pjax="" style="box-sizing: border-box;">
  279. <div class="js-pinned-issues-reorder-container" style="box-sizing: border-box;">
  280. <h2 class="f4 mb-2 text-normal"
  281. style="box-sizing: border-box; margin-top: 0px; margin-bottom: 8px !important; font-weight: 400 !important; font-size: 16px !important;">
  282. Pinned issues</h2>
  283. <div class="container-lg"
  284. style="box-sizing: border-box; max-width: 1012px; margin-right: auto; margin-left: auto;">
  285. <div class="pl-3 d-flex gutter js-pinned-issues-reorder-list"
  286. style="box-sizing: border-box; margin-right: -16px; margin-left: -16px; padding-left: 16px !important; display: flex !important;">
  287. <div class="pinned-issue-item d-flex flex-column col-4 p-2 mr-3 border border-gray-dark rounded-1 js-pinned-issue-list-item mb-3"
  288. style="box-sizing: border-box; width: 331.994px; border: 1px solid rgb(209, 213, 218) !important; border-radius: 3px !important; flex-direction: column !important; margin-right: 16px !important; margin-bottom: 16px !important; padding: 8px 16px !important; display: flex !important;">
  289. <span class="d-block position-relative"
  290. style="box-sizing: border-box; position: relative !important; display: block !important;"><a
  291. class="link-gray-dark no-underline h4"
  292. href="https://github.com/ckeditor/ckeditor5/issues/5909"
  293. style="box-sizing: border-box; background-color: initial; color: rgb(36, 41, 46) !important; text-decoration: none !important; font-size: 16px !important; font-weight: 600 !important;"><span
  294. style="box-sizing: border-box;"
  295. title="📃 Iteration 29 roadmap 📃">📃 Iteration 29 roadmap
  296. 📃</span></a></span>
  297. <div class="mt-1 text-small text-gray pinned-item-desc"
  298. style="box-sizing: border-box; color: rgb(88, 96, 105) !important; margin-top: 4px !important; font-size: 12px !important; flex: 1 0 auto;">
  299. <span class="opened-by" style="box-sizing: border-box;">#5909
  300. opened<span>&nbsp;</span>
  301. <relative-time class="no-wrap" datetime="2019-12-05T09:13:05Z"
  302. style="box-sizing: border-box; white-space: nowrap !important;"
  303. title="Dec 5, 2019, 10:13 AM GMT+1"> on Dec 5, 2019</relative-time>
  304. <span>&nbsp;</span>by<span>&nbsp;</span><a class="muted-link"
  305. data-hovercard-type="user"
  306. data-hovercard-url="/users/mlewand/hovercard"
  307. data-octo-click="hovercard-link-click"
  308. data-octo-dimensions="link_type:self"
  309. href="https://github.com/ckeditor/ckeditor5/issues?q=is%3Aissue+is%3Aopen+author%3Amlewand"
  310. style="box-sizing: border-box; background-color: initial; color: rgb(88, 96, 105) !important; text-decoration: none;"
  311. title="Open issues created by mlewand">mlewand</a>
  312. </span></div>
  313. <span class="mt-1"
  314. style="box-sizing: border-box; margin-top: 4px !important;"><svg
  315. aria-hidden="true" class="octicon octicon-issue-opened open" height="16"
  316. version="1.1" viewbox="0 0 14 16" width="14">
  317. <path
  318. d="M7 2.3c3.14 0 5.7 2.56 5.7 5.7s-2.56 5.7-5.7 5.7A5.71 5.71 0 011.3 8c0-3.14 2.56-5.7 5.7-5.7zM7 1C3.14 1 0 4.14 0 8s3.14 7 7 7 7-3.14 7-7-3.14-7-7-7zm1 3H6v5h2V4zm0 6H6v2h2v-2z"
  319. fill-rule="evenodd"> </path>
  320. </svg><span>&nbsp;</span><span class="text-gray text-small mr-3"
  321. style="box-sizing: border-box; color: rgb(88, 96, 105) !important; margin-right: 16px !important; font-size: 12px !important;">Open</span><span>&nbsp;</span><a
  322. aria-label="3 comments" class="muted-link"
  323. href="https://github.com/ckeditor/ckeditor5/issues/5909"
  324. style="box-sizing: border-box; background-color: initial; color: rgb(88, 96, 105) !important; text-decoration: none;"><svg
  325. aria-hidden="true" class="octicon octicon-comment v-align-middle"
  326. height="16" version="1.1" viewbox="0 0 16 16" width="16">
  327. <path
  328. d="M14 1H2c-.55 0-1 .45-1 1v8c0 .55.45 1 1 1h2v3.5L7.5 11H14c.55 0 1-.45 1-1V2c0-.55-.45-1-1-1zm0 9H7l-2 2v-2H2V2h12v8z"
  329. fill-rule="evenodd"> </path>
  330. </svg><span>&nbsp;</span><span class="text-small"
  331. style="box-sizing: border-box; font-size: 12px !important;">3</span></a></span>
  332. </div>
  333. <div class="pinned-issue-item d-flex flex-column col-4 p-2 mr-3 border border-gray-dark rounded-1 js-pinned-issue-list-item mb-3"
  334. style="box-sizing: border-box; width: 331.994px; border: 1px solid rgb(209, 213, 218) !important; border-radius: 3px !important; flex-direction: column !important; margin-right: 16px !important; margin-bottom: 16px !important; padding: 8px 16px !important; display: flex !important;">
  335. <span class="d-block position-relative"
  336. style="box-sizing: border-box; position: relative !important; display: block !important;"><a
  337. class="link-gray-dark no-underline h4"
  338. href="https://github.com/ckeditor/ckeditor5/issues/5653"
  339. style="box-sizing: border-box; background-color: initial; color: rgb(36, 41, 46) !important; text-decoration: none !important; font-size: 16px !important; font-weight: 600 !important;"><span
  340. style="box-sizing: border-box;"
  341. title="📃 Iteration 28 roadmap 📃">📃 Iteration 28 roadmap
  342. 📃</span></a></span>
  343. <div class="mt-1 text-small text-gray pinned-item-desc"
  344. style="box-sizing: border-box; color: rgb(88, 96, 105) !important; margin-top: 4px !important; font-size: 12px !important; flex: 1 0 auto;">
  345. <span class="opened-by" style="box-sizing: border-box;">#5653
  346. by<span>&nbsp;</span><a class="muted-link" data-hovercard-type="user"
  347. data-hovercard-url="/users/mlewand/hovercard"
  348. data-octo-click="hovercard-link-click"
  349. data-octo-dimensions="link_type:self"
  350. href="https://github.com/ckeditor/ckeditor5/issues?q=is%3Aissue+author%3Amlewand"
  351. style="box-sizing: border-box; background-color: initial; color: rgb(88, 96, 105) !important; text-decoration: none;"
  352. title="issues opened by mlewand">mlewand</a><span>&nbsp;</span>was
  353. closed<span>&nbsp;</span>
  354. <relative-time class="no-wrap" datetime="2019-12-05T09:26:08Z"
  355. style="box-sizing: border-box; white-space: nowrap !important;"
  356. title="Dec 5, 2019, 10:26 AM GMT+1"> on Dec 5, 2019</relative-time>
  357. </span></div>
  358. <span class="mt-1"
  359. style="box-sizing: border-box; margin-top: 4px !important;"><svg
  360. aria-hidden="true" class="octicon octicon-issue-closed closed"
  361. height="16" version="1.1" viewbox="0 0 16 16" width="16">
  362. <path
  363. d="M7 10h2v2H7v-2zm2-6H7v5h2V4zm1.5 1.5l-1 1L12 9l4-4.5-1-1L12 7l-1.5-1.5zM8 13.7A5.71 5.71 0 012.3 8c0-3.14 2.56-5.7 5.7-5.7 1.83 0 3.45.88 4.5 2.2l.92-.92A6.947 6.947 0 008 1C4.14 1 1 4.14 1 8s3.14 7 7 7 7-3.14 7-7l-1.52 1.52c-.66 2.41-2.86 4.19-5.48 4.19v-.01z"
  364. fill-rule="evenodd"> </path>
  365. </svg><span>&nbsp;</span><span class="text-gray text-small mr-3"
  366. style="box-sizing: border-box; color: rgb(88, 96, 105) !important; margin-right: 16px !important; font-size: 12px !important;">Closed</span><span>&nbsp;</span><a
  367. aria-label="4 comments" class="muted-link"
  368. href="https://github.com/ckeditor/ckeditor5/issues/5653"
  369. style="box-sizing: border-box; background-color: initial; color: rgb(88, 96, 105) !important; text-decoration: none;"><svg
  370. aria-hidden="true" class="octicon octicon-comment v-align-middle"
  371. height="16" version="1.1" viewbox="0 0 16 16" width="16">
  372. <path
  373. d="M14 1H2c-.55 0-1 .45-1 1v8c0 .55.45 1 1 1h2v3.5L7.5 11H14c.55 0 1-.45 1-1V2c0-.55-.45-1-1-1zm0 9H7l-2 2v-2H2V2h12v8z"
  374. fill-rule="evenodd"> </path>
  375. </svg><span>&nbsp;</span><span class="text-small"
  376. style="box-sizing: border-box; font-size: 12px !important;">4</span></a></span>
  377. </div>
  378. </div>
  379. </div>
  380. </div>
  381. <div class="d-flex flex-justify-between mb-3"
  382. style="box-sizing: border-box; justify-content: space-between !important; margin-bottom: 16px !important; display: flex !important;">
  383. <div class="d-flex flex-justify-start flex-auto width-full " role="search"
  384. style="box-sizing: border-box; justify-content: flex-start !important; flex: 1 1 auto !important; width: 874.044px; display: flex !important;">
  385. <form accept-charset="UTF-8" action="https://github.com/ckeditor/ckeditor5/issues"
  386. aria-label="Issues" class="subnav-search width-full ml-0" data-pjax="true"
  387. method="get" role="search"
  388. style="box-sizing: border-box; position: relative; margin-left: 0px !important; width: 607.156px;">
  389. <input aria-label="Search all issues"
  390. class="form-control form-control subnav-search-input input-contrast width-full"
  391. data-hotkey="Control+/,Meta+/" id="js-issues-search" name="q"
  392. placeholder="Search all issues"
  393. style="box-sizing: border-box; font-style: inherit; font-variant: inherit; font-weight: inherit; font-stretch: inherit; font-size: 14px; line-height: 20px; font-family: inherit; margin: 0px; overflow: visible; min-height: 34px; padding: 6px 8px 6px 30px; color: rgb(88, 96, 105); vertical-align: middle; background-color: rgb(250, 251, 252); background-repeat: no-repeat; background-position: right 8px center; border: 1px solid rgb(209, 213, 218); border-radius: 3px; outline: none; box-shadow: rgba(27, 31, 35, 0.075) 0px 1px 2px inset; width: 607.156px;"
  394. type="text" value="is:issue is:open " /><svg aria-hidden="true"
  395. class="octicon octicon-search subnav-search-icon" height="16" version="1.1"
  396. viewbox="0 0 16 16" width="16">
  397. <path
  398. d="M15.7 13.3l-3.81-3.83A5.93 5.93 0 0013 6c0-3.31-2.69-6-6-6S1 2.69 1 6s2.69 6 6 6c1.3 0 2.48-.41 3.47-1.11l3.83 3.81c.19.2.45.3.7.3.25 0 .52-.09.7-.3a.996.996 0 000-1.41v.01zM7 10.7c-2.59 0-4.7-2.11-4.7-4.7 0-2.59 2.11-4.7 4.7-4.7 2.59 0 4.7 2.11 4.7 4.7 0 2.59-2.11 4.7-4.7 4.7z"
  399. fill-rule="evenodd"> </path>
  400. </svg></form>
  401. <div class="ml-2 pl-2 "
  402. style="box-sizing: border-box; margin-left: 8px !important; padding-left: 8px !important;">
  403. <nav aria-label="Issue" class="subnav-links float-left d-flex no-wrap"
  404. style="box-sizing: border-box; display: flex !important; float: left !important; white-space: nowrap !important;">
  405. <a class="js-selected-navigation-item subnav-item"
  406. data-selected-links="repo_labels /ckeditor/ckeditor5/labels"
  407. href="https://github.com/ckeditor/ckeditor5/labels"
  408. selected_link="repo_issues"
  409. style="box-sizing: border-box; background-color: initial; color: rgb(88, 96, 105); text-decoration: none; position: relative; float: left; padding: 6px 14px; font-weight: 600; line-height: 20px; border: 1px solid rgb(225, 228, 232); border-top-left-radius: 3px; border-bottom-left-radius: 3px;"><svg
  410. aria-hidden="true" class="octicon octicon-tag" height="16" version="1.1"
  411. viewbox="0 0 14 16" width="14">
  412. <path
  413. d="M7.73 1.73C7.26 1.26 6.62 1 5.96 1H3.5C2.13 1 1 2.13 1 3.5v2.47c0 .66.27 1.3.73 1.77l6.06 6.06c.39.39 1.02.39 1.41 0l4.59-4.59a.996.996 0 000-1.41L7.73 1.73zM2.38 7.09c-.31-.3-.47-.7-.47-1.13V3.5c0-.88.72-1.59 1.59-1.59h2.47c.42 0 .83.16 1.13.47l6.14 6.13-4.73 4.73-6.13-6.15zM3.01 3h2v2H3V3h.01z"
  414. fill-rule="evenodd"> </path>
  415. </svg><span>&nbsp;</span>Labels<span>&nbsp;</span><span class="Counter "
  416. style="box-sizing: border-box; display: inline-block; padding: 2px 5px; font-size: 12px; font-weight: 600; line-height: 1; color: rgb(88, 96, 105); background-color: rgba(27, 31, 35, 0.08); border-radius: 20px;">92</span></a><a
  417. class="js-selected-navigation-item subnav-item"
  418. data-selected-links="repo_milestones /ckeditor/ckeditor5/milestones"
  419. href="https://github.com/ckeditor/ckeditor5/milestones"
  420. selected_link="repo_issues"
  421. style="box-sizing: border-box; background-color: initial; color: rgb(88, 96, 105); text-decoration: none; position: relative; float: left; padding: 6px 14px; font-weight: 600; line-height: 20px; border: 1px solid rgb(225, 228, 232); margin-left: -1px; border-top-right-radius: 3px; border-bottom-right-radius: 3px;"><svg
  422. aria-hidden="true" class="octicon octicon-milestone" height="16"
  423. version="1.1" viewbox="0 0 14 16" width="14">
  424. <path
  425. d="M8 2H6V0h2v2zm4 5H2c-.55 0-1-.45-1-1V4c0-.55.45-1 1-1h10l2 2-2 2zM8 4H6v2h2V4zM6 16h2V8H6v8z"
  426. fill-rule="evenodd"> </path>
  427. </svg><span>&nbsp;</span>Milestones<span>&nbsp;</span><span class="Counter "
  428. style="box-sizing: border-box; display: inline-block; padding: 2px 5px; font-size: 12px; font-weight: 600; line-height: 1; color: rgb(88, 96, 105); background-color: rgba(27, 31, 35, 0.08); border-radius: 20px;">6</span></a>
  429. </nav>
  430. </div>
  431. </div>
  432. <div class="ml-3 " data-pjax=""
  433. style="box-sizing: border-box; margin-left: 16px !important;">
  434. <details class="details-reset details-overlay details-overlay-dark float-right"
  435. style="box-sizing: border-box; display: block; float: right !important;">
  436. <summary class="btn btn-primary"
  437. data-ga-click="Issues, create new issue, view:issue_show location:issue_header style:button logged_in:false"
  438. role="button"
  439. style="box-sizing: border-box; display: inline-block; cursor: pointer; position: relative; padding: 6px 12px; font-size: 14px; font-weight: 600; line-height: 20px; white-space: nowrap; vertical-align: middle; user-select: none; background-repeat: repeat-x; background-position: -1px -1px; background-size: 110% 110%; border: 1px solid rgba(27, 31, 35, 0.2); border-radius: 0.25em; -webkit-appearance: none; color: rgb(255, 255, 255); background-color: rgb(40, 167, 69); background-image: linear-gradient(-180deg, rgb(52, 208, 88), rgb(40, 167, 69) 90%); list-style: none;">
  440. New issue</summary>
  441. </details>
  442. </div>
  443. </div>
  444. <div class="Box mt-3 "
  445. style="box-sizing: border-box; background-color: rgb(255, 255, 255); border: 1px solid rgb(209, 213, 218); border-radius: 3px; margin-top: 16px !important;">
  446. <div class="Box-header d-flex flex-justify-between" id="js-issues-toolbar"
  447. style="box-sizing: border-box; padding: 16px; margin: -1px -1px 0px; background-color: rgb(246, 248, 250); border: 1px solid rgb(209, 213, 218); border-top-left-radius: 3px; border-top-right-radius: 3px; justify-content: space-between !important; display: flex !important;">
  448. <div class="table-list-filters flex-auto d-flex min-width-0"
  449. style="box-sizing: border-box; flex: 1 1 auto !important; min-width: 0px !important; display: flex !important;">
  450. <div class="flex-auto " style="box-sizing: border-box; flex: 1 1 auto !important;">
  451. <div class="table-list-header-toggle states flex-auto pl-0"
  452. style="box-sizing: border-box; flex: 1 1 auto !important; padding-left: 16px;">
  453. <a class="btn-link selected"
  454. href="https://github.com/ckeditor/ckeditor5/issues?q=is%3Aopen+is%3Aissue"
  455. style="box-sizing: border-box; background-color: initial; color: rgb(36, 41, 46); text-decoration: none; display: inline-block; padding: 0px; font-size: inherit; white-space: nowrap; cursor: pointer; user-select: none; border: 0px; -webkit-appearance: none; font-weight: 600;"><svg
  456. aria-hidden="true" class="octicon octicon-issue-opened" height="16"
  457. version="1.1" viewbox="0 0 14 16" width="14">
  458. <path
  459. d="M7 2.3c3.14 0 5.7 2.56 5.7 5.7s-2.56 5.7-5.7 5.7A5.71 5.71 0 011.3 8c0-3.14 2.56-5.7 5.7-5.7zM7 1C3.14 1 0 4.14 0 8s3.14 7 7 7 7-3.14 7-7-3.14-7-7-7zm1 3H6v5h2V4zm0 6H6v2h2v-2z"
  460. fill-rule="evenodd"> </path>
  461. </svg><span>&nbsp;</span>1,175 Open</a><span>&nbsp;</span><a
  462. class="btn-link "
  463. href="https://github.com/ckeditor/ckeditor5/issues?q=is%3Aissue+is%3Aclosed"
  464. style="box-sizing: border-box; background-color: initial; color: rgb(88, 96, 105); text-decoration: none; display: inline-block; padding: 0px; font-size: inherit; white-space: nowrap; cursor: pointer; user-select: none; border: 0px; -webkit-appearance: none; margin-left: 10px;"><svg
  465. aria-hidden="true" class="octicon octicon-check" height="16"
  466. version="1.1" viewbox="0 0 12 16" width="12">
  467. <path d="M12 5l-8 8-4-4 1.5-1.5L4 10l6.5-6.5L12 5z"
  468. fill-rule="evenodd"></path>
  469. </svg><span>&nbsp;</span>4,640 Closed</a></div>
  470. </div>
  471. <div class="table-list-header-toggle no-wrap "
  472. style="box-sizing: border-box; white-space: nowrap !important;">
  473. <details
  474. class="details-reset details-overlay d-inline-block position-relative px-3"
  475. id="author-select-menu"
  476. style="box-sizing: border-box; display: inline-block !important; position: relative !important; padding-left: 16px !important; padding-right: 16px !important;">
  477. <summary aria-haspopup="menu" class="btn-link" data-hotkey="u" role="button"
  478. style="box-sizing: border-box; display: inline-block; cursor: pointer; padding: 0px; font-size: inherit; color: rgb(88, 96, 105); text-decoration: none; white-space: nowrap; user-select: none; background-color: initial; border: 0px; -webkit-appearance: none; list-style: none;"
  479. title="Author"> Author<span>&nbsp;</span> </summary>
  480. </details>
  481. <span>&nbsp;</span>
  482. <details
  483. class="details-reset details-overlay d-inline-block position-relative px-3"
  484. id="label-select-menu"
  485. style="box-sizing: border-box; display: inline-block !important; position: relative !important; padding-left: 16px !important; padding-right: 16px !important;">
  486. <summary aria-haspopup="menu" class="btn-link" data-hotkey="l" role="button"
  487. style="box-sizing: border-box; display: inline-block; cursor: pointer; padding: 0px; font-size: inherit; color: rgb(88, 96, 105); text-decoration: none; white-space: nowrap; user-select: none; background-color: initial; border: 0px; -webkit-appearance: none; list-style: none;"
  488. title="Label"> Label<span>&nbsp;</span> </summary>
  489. </details>
  490. <span>&nbsp;</span><span style="box-sizing: border-box;"> </span>
  491. <details
  492. class="details-reset details-overlay d-inline-block position-relative px-3"
  493. id="project-select-menu"
  494. style="box-sizing: border-box; display: inline-block !important; position: relative !important; padding-left: 16px !important; padding-right: 16px !important;">
  495. <summary aria-haspopup="menu" class="btn-link" data-hotkey="p" role="button"
  496. style="box-sizing: border-box; display: inline-block; cursor: pointer; padding: 0px; font-size: inherit; color: rgb(88, 96, 105); text-decoration: none; white-space: nowrap; user-select: none; background-color: initial; border: 0px; -webkit-appearance: none; list-style: none;">
  497. <span style="box-sizing: border-box;"> Projects<span>&nbsp;</span>
  498. </span></summary><span style="box-sizing: border-box;"> </span>
  499. </details>
  500. <span style="box-sizing: border-box;"><span>&nbsp;</span> </span>
  501. <details
  502. class="details-reset details-overlay d-inline-block position-relative px-3"
  503. id="milestones-select-menu"
  504. style="box-sizing: border-box; display: inline-block !important; position: relative !important; padding-left: 16px !important; padding-right: 16px !important;">
  505. <summary aria-haspopup="menu" class="btn-link" data-hotkey="m" role="button"
  506. style="box-sizing: border-box; display: inline-block; cursor: pointer; padding: 0px; font-size: inherit; color: rgb(88, 96, 105); text-decoration: none; white-space: nowrap; user-select: none; background-color: initial; border: 0px; -webkit-appearance: none; list-style: none;">
  507. <span style="box-sizing: border-box;"> Milestones<span>&nbsp;</span>
  508. </span></summary><span style="box-sizing: border-box;"> </span>
  509. </details>
  510. <span style="box-sizing: border-box;"><span>&nbsp;</span> </span>
  511. <details
  512. class="details-reset details-overlay d-inline-block position-relative px-3"
  513. id="assignees-select-menu"
  514. style="box-sizing: border-box; display: inline-block !important; position: relative !important; padding-left: 16px !important; padding-right: 16px !important;">
  515. <summary aria-haspopup="menu" class="btn-link" data-hotkey="a" role="button"
  516. style="box-sizing: border-box; display: inline-block; cursor: pointer; padding: 0px; font-size: inherit; color: rgb(88, 96, 105); text-decoration: none; white-space: nowrap; user-select: none; background-color: initial; border: 0px; -webkit-appearance: none; list-style: none;"
  517. title="Assignees"> Assignee<span>&nbsp;</span> </summary>
  518. </details>
  519. <span>&nbsp;</span>
  520. <details
  521. class="details-reset details-overlay d-inline-block position-relative pr-3 pr-sm-0 px-3"
  522. id="sort-select-menu"
  523. style="box-sizing: border-box; display: inline-block !important; position: relative !important; padding-right: 0px !important; padding-left: 16px !important;">
  524. <summary aria-haspopup="menu" class="btn-link" role="button"
  525. style="box-sizing: border-box; display: inline-block; cursor: pointer; padding: 0px; font-size: inherit; color: rgb(88, 96, 105); text-decoration: none; white-space: nowrap; user-select: none; background-color: initial; border: 0px; -webkit-appearance: none; list-style: none;"
  526. title="Sort"> Sort<span>&nbsp;</span> </summary>
  527. </details>
  528. </div>
  529. </div>
  530. </div>
  531. <div aria-label="Issues" data-issue-and-pr-hovercards-enabled="" role="group"
  532. style="box-sizing: border-box;">
  533. <div class="js-navigation-container js-active-navigation-container"
  534. style="box-sizing: border-box;">
  535. <div class="Box-row Box-row--focus-gray p-0 mt-0 js-navigation-item js-issue-row"
  536. data-id="557464229" id="issue_6165"
  537. style="box-sizing: border-box; padding: 0px !important; margin-top: 0px !important; list-style-type: none; border-top: 1px solid transparent; border-top-left-radius: 2px; border-top-right-radius: 2px;">
  538. <div class="d-flex Box-row--drag-hide position-relative"
  539. style="box-sizing: border-box; position: relative !important; display: flex !important;">
  540. <div class="flex-shrink-0 pt-2 pl-3"
  541. style="box-sizing: border-box; flex-shrink: 0 !important; padding-top: 8px !important; padding-left: 16px !important;">
  542. <span aria-label="Open issue" class="tooltipped tooltipped-e"
  543. style="box-sizing: border-box; position: relative;"><svg
  544. aria-hidden="true" class="octicon octicon-issue-opened open"
  545. height="16" version="1.1" viewbox="0 0 14 16" width="14">
  546. <path
  547. d="M7 2.3c3.14 0 5.7 2.56 5.7 5.7s-2.56 5.7-5.7 5.7A5.71 5.71 0 011.3 8c0-3.14 2.56-5.7 5.7-5.7zM7 1C3.14 1 0 4.14 0 8s3.14 7 7 7 7-3.14 7-7-3.14-7-7-7zm1 3H6v5h2V4zm0 6H6v2h2v-2z"
  548. fill-rule="evenodd"> </path>
  549. </svg></span></div>
  550. <div class="flex-auto min-width-0 lh-condensed p-2 "
  551. style="box-sizing: border-box; flex: 1 1 auto !important; min-width: 0px !important; padding: 8px !important; line-height: 1.25 !important;">
  552. <a class="link-gray-dark v-align-middle no-underline h4 js-navigation-open"
  553. data-hovercard-type="issue"
  554. data-hovercard-url="/ckeditor/ckeditor5/issues/6165/hovercard"
  555. href="https://github.com/ckeditor/ckeditor5/issues/6165"
  556. id="issue_6165_link"
  557. style="box-sizing: border-box; background-color: initial; color: rgb(36, 41, 46) !important; text-decoration: none !important; vertical-align: middle !important; font-size: 16px !important; font-weight: 600 !important;">Font
  558. styles are <span style="font-family:Georgia,serif;"><span
  559. style="color:#27ae60;"><span
  560. style="background-color:#dddddd;">not honored when
  561. pasti</span></span></span>ng from MS
  562. Word<span>&nbsp;</span></a><span class="labels lh-default "
  563. style="box-sizing: border-box; line-height: 1.5 !important; position: relative;"><a
  564. class="d-inline-block IssueLabel"
  565. href="https://github.com/ckeditor/ckeditor5/issues?q=is%3Aissue+is%3Aopen+label%3Apackage%3Afont"
  566. style="box-sizing: border-box; background-color: rgb(254, 242, 192); color: rgb(0, 0, 0); text-decoration: none; display: inline-block !important; height: 20px; padding: 0.15em 4px; font-size: 12px; font-weight: 600; line-height: 15px; border-radius: 2px; box-shadow: rgba(27, 31, 35, 0.12) 0px -1px 0px inset;"
  567. title="package:font">package:font</a><span>&nbsp;</span><a
  568. class="d-inline-block IssueLabel"
  569. href="https://github.com/ckeditor/ckeditor5/issues?q=is%3Aissue+is%3Aopen+label%3Apackage%3Apaste-from-office"
  570. style="box-sizing: border-box; background-color: rgb(254, 242, 192); color: rgb(0, 0, 0); text-decoration: none; display: inline-block !important; height: 20px; padding: 0.15em 4px; font-size: 12px; font-weight: 600; line-height: 15px; border-radius: 2px; box-shadow: rgba(27, 31, 35, 0.12) 0px -1px 0px inset;"
  571. title="package:paste-from-office">package:paste-from-office</a><span>&nbsp;</span><a
  572. class="d-inline-block IssueLabel"
  573. href="https://github.com/ckeditor/ckeditor5/issues?q=is%3Aissue+is%3Aopen+label%3Astatus%3Aconfirmed"
  574. style="box-sizing: border-box; background-color: rgb(230, 230, 230); color: rgb(0, 0, 0); text-decoration: none; display: inline-block !important; height: 20px; padding: 0.15em 4px; font-size: 12px; font-weight: 600; line-height: 15px; border-radius: 2px; box-shadow: rgba(27, 31, 35, 0.12) 0px -1px 0px inset;"
  575. title="status:confirmed">status:confirmed</a><span>&nbsp;</span><a
  576. class="d-inline-block IssueLabel"
  577. href="https://github.com/ckeditor/ckeditor5/issues?q=is%3Aissue+is%3Aopen+label%3Asupport%3A1"
  578. style="box-sizing: border-box; background-color: rgb(170, 170, 170); color: rgb(0, 0, 0); text-decoration: none; display: inline-block !important; height: 20px; padding: 0.15em 4px; font-size: 12px; font-weight: 600; line-height: 15px; border-radius: 2px; box-shadow: rgba(27, 31, 35, 0.12) 0px -1px 0px inset;"
  579. title="An issue reported by a commercially licensed client.">support:1</a><span>&nbsp;</span><a
  580. class="d-inline-block IssueLabel"
  581. href="https://github.com/ckeditor/ckeditor5/issues?q=is%3Aissue+is%3Aopen+label%3Atype%3Abug"
  582. style="box-sizing: border-box; background-color: rgb(221, 68, 68); color: rgb(0, 0, 0); text-decoration: none; display: inline-block !important; height: 20px; padding: 0.15em 4px; font-size: 12px; font-weight: 600; line-height: 15px; border-radius: 2px; box-shadow: rgba(27, 31, 35, 0.12) 0px -1px 0px inset;"
  583. title="type:bug">type:bug</a></span>
  584. <div class="mt-1 text-small text-gray"
  585. style="box-sizing: border-box; color: rgb(88, 96, 105) !important; margin-top: 4px !important; font-size: 12px !important;">
  586. <span class="opened-by" style="box-sizing: border-box;">#6165
  587. opened<span>&nbsp;</span>
  588. <relative-time class="no-wrap" datetime="2020-01-30T12:34:35Z"
  589. style="box-sizing: border-box; white-space: nowrap !important;"
  590. title="Jan 30, 2020, 1:34 PM GMT+1"> 2 hours ago
  591. </relative-time> <span>&nbsp;</span>by<span>&nbsp;</span><a
  592. class="muted-link" data-hovercard-type="user"
  593. data-hovercard-url="/users/jswiderski/hovercard"
  594. data-octo-click="hovercard-link-click"
  595. data-octo-dimensions="link_type:self"
  596. href="https://github.com/ckeditor/ckeditor5/issues?q=is%3Aissue+is%3Aopen+author%3Ajswiderski"
  597. style="box-sizing: border-box; background-color: initial; color: rgb(88, 96, 105) !important; text-decoration: none;"
  598. title="Open issues created by jswiderski">jswiderski</a><span>&nbsp;</span>
  599. </span><span
  600. class="issue-meta-section css-truncate issue-milestone ml-2 "
  601. style="box-sizing: border-box; margin-left: 8px !important; max-width: 240px;"><a
  602. aria-label="nice-to-have"
  603. class="milestone-link muted-link css-truncate tooltipped tooltipped-n"
  604. href="https://github.com/ckeditor/ckeditor5/milestone/17"
  605. style="box-sizing: border-box; background-color: initial; color: rgb(88, 96, 105) !important; text-decoration: none; position: relative;"><svg
  606. aria-label="Milestone" class="octicon octicon-milestone"
  607. height="16" role="img" version="1.1" viewbox="0 0 14 16"
  608. width="14">
  609. <path
  610. d="M8 2H6V0h2v2zm4 5H2c-.55 0-1-.45-1-1V4c0-.55.45-1 1-1h10l2 2-2 2zM8 4H6v2h2V4zM6 16h2V8H6v8z"
  611. fill-rule="evenodd"> </path>
  612. </svg><span>&nbsp;</span><span class="css-truncate-target"
  613. style="box-sizing: border-box; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: inline-block; max-width: 100px; vertical-align: top;">nice-to-have</span></a></span>
  614. </div>
  615. </div>
  616. <div class="flex-shrink-0 col-3 pt-2 text-right pr-3 no-wrap d-grid grid-4-col grid-gap-2 "
  617. style="box-sizing: border-box; width: 244.5px; flex-shrink: 0 !important; padding-top: 8px !important; padding-right: 16px !important; text-align: right !important; white-space: nowrap !important; display: grid; column-gap: 8px; grid-template-columns: repeat(4, 1fr); grid-template-areas: &quot;grid-col-1 grid-col-2 grid-col-3 grid-col-4&quot;;">
  618. <div class="AvatarStack AvatarStack--right grid-col-1 "
  619. style="box-sizing: border-box; position: relative; min-width: 26px; height: 20px; grid-area: grid-col-1 / grid-col-1 / grid-col-1 / grid-col-1;">
  620. <div aria-label="Assigned to "
  621. class="AvatarStack-body tooltipped tooltipped-sw tooltipped-multiline tooltipped-align-right-1 mt-1"
  622. style="box-sizing: border-box; position: absolute; margin-top: 4px !important; display: flex; background: rgb(255, 255, 255); right: 0px; flex-direction: row-reverse;">
  623. &nbsp;</div>
  624. </div>
  625. <span class="grid-col-4"
  626. style="box-sizing: border-box; grid-area: grid-col-4 / grid-col-4 / grid-col-4 / grid-col-4;"><a
  627. aria-label="3 comments" class="muted-link"
  628. href="https://github.com/ckeditor/ckeditor5/issues/6165"
  629. style="box-sizing: border-box; background-color: initial; color: rgb(88, 96, 105) !important; text-decoration: none;"><svg
  630. aria-hidden="true"
  631. class="octicon octicon-comment v-align-middle" height="16"
  632. version="1.1" viewbox="0 0 16 16" width="16">
  633. <path
  634. d="M14 1H2c-.55 0-1 .45-1 1v8c0 .55.45 1 1 1h2v3.5L7.5 11H14c.55 0 1-.45 1-1V2c0-.55-.45-1-1-1zm0 9H7l-2 2v-2H2V2h12v8z"
  635. fill-rule="evenodd"> </path>
  636. </svg><span>&nbsp;</span><span class="text-small text-bold"
  637. style="box-sizing: border-box; font-size: 12px !important; font-weight: 600 !important;">3</span></a></span>
  638. </div>
  639. </div>
  640. </div>
  641. <div class="Box-row Box-row--focus-gray p-0 mt-0 js-navigation-item js-issue-row"
  642. data-id="557464229" id="issue_6165"
  643. style="box-sizing: border-box; padding: 0px !important; margin-top: 0px !important; list-style-type: none; border-top: 1px solid transparent; border-top-left-radius: 2px; border-top-right-radius: 2px;">
  644. <div class="d-flex Box-row--drag-hide position-relative"
  645. style="box-sizing: border-box; position: relative !important; display: flex !important;">
  646. <div class="flex-shrink-0 pt-2 pl-3"
  647. style="box-sizing: border-box; flex-shrink: 0 !important; padding-top: 8px !important; padding-left: 16px !important;">
  648. <span aria-label="Open issue" class="tooltipped tooltipped-e"
  649. style="box-sizing: border-box; position: relative;"><svg
  650. aria-hidden="true" class="octicon octicon-issue-opened open"
  651. height="16" version="1.1" viewbox="0 0 14 16" width="14">
  652. <path
  653. d="M7 2.3c3.14 0 5.7 2.56 5.7 5.7s-2.56 5.7-5.7 5.7A5.71 5.71 0 011.3 8c0-3.14 2.56-5.7 5.7-5.7zM7 1C3.14 1 0 4.14 0 8s3.14 7 7 7 7-3.14 7-7-3.14-7-7-7zm1 3H6v5h2V4zm0 6H6v2h2v-2z"
  654. fill-rule="evenodd"> </path>
  655. </svg></span></div>
  656. <div class="flex-auto min-width-0 lh-condensed p-2 "
  657. style="box-sizing: border-box; flex: 1 1 auto !important; min-width: 0px !important; padding: 8px !important; line-height: 1.25 !important;">
  658. <a class="link-gray-dark v-align-middle no-underline h4 js-navigation-open"
  659. data-hovercard-type="issue"
  660. data-hovercard-url="/ckeditor/ckeditor5/issues/6165/hovercard"
  661. href="https://github.com/ckeditor/ckeditor5/issues/6165"
  662. id="issue_6165_link"
  663. style="box-sizing: border-box; background-color: initial; color: rgb(36, 41, 46) !important; text-decoration: none !important; vertical-align: middle !important; font-size: 16px !important; font-weight: 600 !important;">Font
  664. styles are <span style="font-family:Georgia,serif;"><span
  665. style="color:#27ae60;"><span
  666. style="background-color:#dddddd;">not honored when
  667. pasti</span></span></span>ng from MS
  668. Word<span>&nbsp;</span></a><span class="labels lh-default "
  669. style="box-sizing: border-box; line-height: 1.5 !important; position: relative;"><a
  670. class="d-inline-block IssueLabel"
  671. href="https://github.com/ckeditor/ckeditor5/issues?q=is%3Aissue+is%3Aopen+label%3Apackage%3Afont"
  672. style="box-sizing: border-box; background-color: rgb(254, 242, 192); color: rgb(0, 0, 0); text-decoration: none; display: inline-block !important; height: 20px; padding: 0.15em 4px; font-size: 12px; font-weight: 600; line-height: 15px; border-radius: 2px; box-shadow: rgba(27, 31, 35, 0.12) 0px -1px 0px inset;"
  673. title="package:font">package:font</a><span>&nbsp;</span><a
  674. class="d-inline-block IssueLabel"
  675. href="https://github.com/ckeditor/ckeditor5/issues?q=is%3Aissue+is%3Aopen+label%3Apackage%3Apaste-from-office"
  676. style="box-sizing: border-box; background-color: rgb(254, 242, 192); color: rgb(0, 0, 0); text-decoration: none; display: inline-block !important; height: 20px; padding: 0.15em 4px; font-size: 12px; font-weight: 600; line-height: 15px; border-radius: 2px; box-shadow: rgba(27, 31, 35, 0.12) 0px -1px 0px inset;"
  677. title="package:paste-from-office">package:paste-from-office</a><span>&nbsp;</span><a
  678. class="d-inline-block IssueLabel"
  679. href="https://github.com/ckeditor/ckeditor5/issues?q=is%3Aissue+is%3Aopen+label%3Astatus%3Aconfirmed"
  680. style="box-sizing: border-box; background-color: rgb(230, 230, 230); color: rgb(0, 0, 0); text-decoration: none; display: inline-block !important; height: 20px; padding: 0.15em 4px; font-size: 12px; font-weight: 600; line-height: 15px; border-radius: 2px; box-shadow: rgba(27, 31, 35, 0.12) 0px -1px 0px inset;"
  681. title="status:confirmed">status:confirmed</a><span>&nbsp;</span><a
  682. class="d-inline-block IssueLabel"
  683. href="https://github.com/ckeditor/ckeditor5/issues?q=is%3Aissue+is%3Aopen+label%3Asupport%3A1"
  684. style="box-sizing: border-box; background-color: rgb(170, 170, 170); color: rgb(0, 0, 0); text-decoration: none; display: inline-block !important; height: 20px; padding: 0.15em 4px; font-size: 12px; font-weight: 600; line-height: 15px; border-radius: 2px; box-shadow: rgba(27, 31, 35, 0.12) 0px -1px 0px inset;"
  685. title="An issue reported by a commercially licensed client.">support:1</a><span>&nbsp;</span><a
  686. class="d-inline-block IssueLabel"
  687. href="https://github.com/ckeditor/ckeditor5/issues?q=is%3Aissue+is%3Aopen+label%3Atype%3Abug"
  688. style="box-sizing: border-box; background-color: rgb(221, 68, 68); color: rgb(0, 0, 0); text-decoration: none; display: inline-block !important; height: 20px; padding: 0.15em 4px; font-size: 12px; font-weight: 600; line-height: 15px; border-radius: 2px; box-shadow: rgba(27, 31, 35, 0.12) 0px -1px 0px inset;"
  689. title="type:bug">type:bug</a></span>
  690. <div class="mt-1 text-small text-gray"
  691. style="box-sizing: border-box; color: rgb(88, 96, 105) !important; margin-top: 4px !important; font-size: 12px !important;">
  692. <span class="opened-by" style="box-sizing: border-box;">#6165
  693. opened<span>&nbsp;</span>
  694. <relative-time class="no-wrap" datetime="2020-01-30T12:34:35Z"
  695. style="box-sizing: border-box; white-space: nowrap !important;"
  696. title="Jan 30, 2020, 1:34 PM GMT+1"> 2 hours ago
  697. </relative-time> <span>&nbsp;</span>by<span>&nbsp;</span><a
  698. class="muted-link" data-hovercard-type="user"
  699. data-hovercard-url="/users/jswiderski/hovercard"
  700. data-octo-click="hovercard-link-click"
  701. data-octo-dimensions="link_type:self"
  702. href="https://github.com/ckeditor/ckeditor5/issues?q=is%3Aissue+is%3Aopen+author%3Ajswiderski"
  703. style="box-sizing: border-box; background-color: initial; color: rgb(88, 96, 105) !important; text-decoration: none;"
  704. title="Open issues created by jswiderski">jswiderski</a><span>&nbsp;</span>
  705. </span><span
  706. class="issue-meta-section css-truncate issue-milestone ml-2 "
  707. style="box-sizing: border-box; margin-left: 8px !important; max-width: 240px;"><a
  708. aria-label="nice-to-have"
  709. class="milestone-link muted-link css-truncate tooltipped tooltipped-n"
  710. href="https://github.com/ckeditor/ckeditor5/milestone/17"
  711. style="box-sizing: border-box; background-color: initial; color: rgb(88, 96, 105) !important; text-decoration: none; position: relative;"><svg
  712. aria-label="Milestone" class="octicon octicon-milestone"
  713. height="16" role="img" version="1.1" viewbox="0 0 14 16"
  714. width="14">
  715. <path
  716. d="M8 2H6V0h2v2zm4 5H2c-.55 0-1-.45-1-1V4c0-.55.45-1 1-1h10l2 2-2 2zM8 4H6v2h2V4zM6 16h2V8H6v8z"
  717. fill-rule="evenodd"> </path>
  718. </svg><span>&nbsp;</span><span class="css-truncate-target"
  719. style="box-sizing: border-box; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: inline-block; max-width: 100px; vertical-align: top;">nice-to-have</span></a></span>
  720. </div>
  721. </div>
  722. <div class="flex-shrink-0 col-3 pt-2 text-right pr-3 no-wrap d-grid grid-4-col grid-gap-2 "
  723. style="box-sizing: border-box; width: 244.5px; flex-shrink: 0 !important; padding-top: 8px !important; padding-right: 16px !important; text-align: right !important; white-space: nowrap !important; display: grid; column-gap: 8px; grid-template-columns: repeat(4, 1fr); grid-template-areas: &quot;grid-col-1 grid-col-2 grid-col-3 grid-col-4&quot;;">
  724. <div class="AvatarStack AvatarStack--right grid-col-1 "
  725. style="box-sizing: border-box; position: relative; min-width: 26px; height: 20px; grid-area: grid-col-1 / grid-col-1 / grid-col-1 / grid-col-1;">
  726. <div aria-label="Assigned to "
  727. class="AvatarStack-body tooltipped tooltipped-sw tooltipped-multiline tooltipped-align-right-1 mt-1"
  728. style="box-sizing: border-box; position: absolute; margin-top: 4px !important; display: flex; background: rgb(255, 255, 255); right: 0px; flex-direction: row-reverse;">
  729. &nbsp;</div>
  730. </div>
  731. <span class="grid-col-4"
  732. style="box-sizing: border-box; grid-area: grid-col-4 / grid-col-4 / grid-col-4 / grid-col-4;"><a
  733. aria-label="3 comments" class="muted-link"
  734. href="https://github.com/ckeditor/ckeditor5/issues/6165"
  735. style="box-sizing: border-box; background-color: initial; color: rgb(88, 96, 105) !important; text-decoration: none;"><svg
  736. aria-hidden="true"
  737. class="octicon octicon-comment v-align-middle" height="16"
  738. version="1.1" viewbox="0 0 16 16" width="16">
  739. <path
  740. d="M14 1H2c-.55 0-1 .45-1 1v8c0 .55.45 1 1 1h2v3.5L7.5 11H14c.55 0 1-.45 1-1V2c0-.55-.45-1-1-1zm0 9H7l-2 2v-2H2V2h12v8z"
  741. fill-rule="evenodd"> </path>
  742. </svg><span>&nbsp;</span><span class="text-small text-bold"
  743. style="box-sizing: border-box; font-size: 12px !important; font-weight: 600 !important;">3</span></a></span>
  744. </div>
  745. </div>
  746. </div>
  747. <div class="Box-row Box-row--focus-gray p-0 mt-0 js-navigation-item js-issue-row"
  748. data-id="557464229" id="issue_6165"
  749. style="box-sizing: border-box; padding: 0px !important; margin-top: 0px !important; list-style-type: none; border-top: 1px solid transparent; border-top-left-radius: 2px; border-top-right-radius: 2px;">
  750. <div class="d-flex Box-row--drag-hide position-relative"
  751. style="box-sizing: border-box; position: relative !important; display: flex !important;">
  752. <div class="flex-shrink-0 pt-2 pl-3"
  753. style="box-sizing: border-box; flex-shrink: 0 !important; padding-top: 8px !important; padding-left: 16px !important;">
  754. <span aria-label="Open issue" class="tooltipped tooltipped-e"
  755. style="box-sizing: border-box; position: relative;"><svg
  756. aria-hidden="true" class="octicon octicon-issue-opened open"
  757. height="16" version="1.1" viewbox="0 0 14 16" width="14">
  758. <path
  759. d="M7 2.3c3.14 0 5.7 2.56 5.7 5.7s-2.56 5.7-5.7 5.7A5.71 5.71 0 011.3 8c0-3.14 2.56-5.7 5.7-5.7zM7 1C3.14 1 0 4.14 0 8s3.14 7 7 7 7-3.14 7-7-3.14-7-7-7zm1 3H6v5h2V4zm0 6H6v2h2v-2z"
  760. fill-rule="evenodd"> </path>
  761. </svg></span></div>
  762. <div class="flex-auto min-width-0 lh-condensed p-2 "
  763. style="box-sizing: border-box; flex: 1 1 auto !important; min-width: 0px !important; padding: 8px !important; line-height: 1.25 !important;">
  764. <a class="link-gray-dark v-align-middle no-underline h4 js-navigation-open"
  765. data-hovercard-type="issue"
  766. data-hovercard-url="/ckeditor/ckeditor5/issues/6165/hovercard"
  767. href="https://github.com/ckeditor/ckeditor5/issues/6165"
  768. id="issue_6165_link"
  769. style="box-sizing: border-box; background-color: initial; color: rgb(36, 41, 46) !important; text-decoration: none !important; vertical-align: middle !important; font-size: 16px !important; font-weight: 600 !important;">Font
  770. styles are <span style="font-family:Georgia,serif;"><span
  771. style="color:#27ae60;"><span
  772. style="background-color:#dddddd;">not honored when
  773. pasti</span></span></span>ng from MS
  774. Word<span>&nbsp;</span></a><span class="labels lh-default "
  775. style="box-sizing: border-box; line-height: 1.5 !important; position: relative;"><a
  776. class="d-inline-block IssueLabel"
  777. href="https://github.com/ckeditor/ckeditor5/issues?q=is%3Aissue+is%3Aopen+label%3Apackage%3Afont"
  778. style="box-sizing: border-box; background-color: rgb(254, 242, 192); color: rgb(0, 0, 0); text-decoration: none; display: inline-block !important; height: 20px; padding: 0.15em 4px; font-size: 12px; font-weight: 600; line-height: 15px; border-radius: 2px; box-shadow: rgba(27, 31, 35, 0.12) 0px -1px 0px inset;"
  779. title="package:font">package:font</a><span>&nbsp;</span><a
  780. class="d-inline-block IssueLabel"
  781. href="https://github.com/ckeditor/ckeditor5/issues?q=is%3Aissue+is%3Aopen+label%3Apackage%3Apaste-from-office"
  782. style="box-sizing: border-box; background-color: rgb(254, 242, 192); color: rgb(0, 0, 0); text-decoration: none; display: inline-block !important; height: 20px; padding: 0.15em 4px; font-size: 12px; font-weight: 600; line-height: 15px; border-radius: 2px; box-shadow: rgba(27, 31, 35, 0.12) 0px -1px 0px inset;"
  783. title="package:paste-from-office">package:paste-from-office</a><span>&nbsp;</span><a
  784. class="d-inline-block IssueLabel"
  785. href="https://github.com/ckeditor/ckeditor5/issues?q=is%3Aissue+is%3Aopen+label%3Astatus%3Aconfirmed"
  786. style="box-sizing: border-box; background-color: rgb(230, 230, 230); color: rgb(0, 0, 0); text-decoration: none; display: inline-block !important; height: 20px; padding: 0.15em 4px; font-size: 12px; font-weight: 600; line-height: 15px; border-radius: 2px; box-shadow: rgba(27, 31, 35, 0.12) 0px -1px 0px inset;"
  787. title="status:confirmed">status:confirmed</a><span>&nbsp;</span><a
  788. class="d-inline-block IssueLabel"
  789. href="https://github.com/ckeditor/ckeditor5/issues?q=is%3Aissue+is%3Aopen+label%3Asupport%3A1"
  790. style="box-sizing: border-box; background-color: rgb(170, 170, 170); color: rgb(0, 0, 0); text-decoration: none; display: inline-block !important; height: 20px; padding: 0.15em 4px; font-size: 12px; font-weight: 600; line-height: 15px; border-radius: 2px; box-shadow: rgba(27, 31, 35, 0.12) 0px -1px 0px inset;"
  791. title="An issue reported by a commercially licensed client.">support:1</a><span>&nbsp;</span><a
  792. class="d-inline-block IssueLabel"
  793. href="https://github.com/ckeditor/ckeditor5/issues?q=is%3Aissue+is%3Aopen+label%3Atype%3Abug"
  794. style="box-sizing: border-box; background-color: rgb(221, 68, 68); color: rgb(0, 0, 0); text-decoration: none; display: inline-block !important; height: 20px; padding: 0.15em 4px; font-size: 12px; font-weight: 600; line-height: 15px; border-radius: 2px; box-shadow: rgba(27, 31, 35, 0.12) 0px -1px 0px inset;"
  795. title="type:bug">type:bug</a></span>
  796. <div class="mt-1 text-small text-gray"
  797. style="box-sizing: border-box; color: rgb(88, 96, 105) !important; margin-top: 4px !important; font-size: 12px !important;">
  798. <span class="opened-by" style="box-sizing: border-box;">#6165
  799. opened<span>&nbsp;</span>
  800. <relative-time class="no-wrap" datetime="2020-01-30T12:34:35Z"
  801. style="box-sizing: border-box; white-space: nowrap !important;"
  802. title="Jan 30, 2020, 1:34 PM GMT+1"> 2 hours ago
  803. </relative-time> <span>&nbsp;</span>by<span>&nbsp;</span><a
  804. class="muted-link" data-hovercard-type="user"
  805. data-hovercard-url="/users/jswiderski/hovercard"
  806. data-octo-click="hovercard-link-click"
  807. data-octo-dimensions="link_type:self"
  808. href="https://github.com/ckeditor/ckeditor5/issues?q=is%3Aissue+is%3Aopen+author%3Ajswiderski"
  809. style="box-sizing: border-box; background-color: initial; color: rgb(88, 96, 105) !important; text-decoration: none;"
  810. title="Open issues created by jswiderski">jswiderski</a><span>&nbsp;</span>
  811. </span><span
  812. class="issue-meta-section css-truncate issue-milestone ml-2 "
  813. style="box-sizing: border-box; margin-left: 8px !important; max-width: 240px;"><a
  814. aria-label="nice-to-have"
  815. class="milestone-link muted-link css-truncate tooltipped tooltipped-n"
  816. href="https://github.com/ckeditor/ckeditor5/milestone/17"
  817. style="box-sizing: border-box; background-color: initial; color: rgb(88, 96, 105) !important; text-decoration: none; position: relative;"><svg
  818. aria-label="Milestone" class="octicon octicon-milestone"
  819. height="16" role="img" version="1.1" viewbox="0 0 14 16"
  820. width="14">
  821. <path
  822. d="M8 2H6V0h2v2zm4 5H2c-.55 0-1-.45-1-1V4c0-.55.45-1 1-1h10l2 2-2 2zM8 4H6v2h2V4zM6 16h2V8H6v8z"
  823. fill-rule="evenodd"> </path>
  824. </svg><span>&nbsp;</span><span class="css-truncate-target"
  825. style="box-sizing: border-box; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: inline-block; max-width: 100px; vertical-align: top;">nice-to-have</span></a></span>
  826. </div>
  827. </div>
  828. <div class="flex-shrink-0 col-3 pt-2 text-right pr-3 no-wrap d-grid grid-4-col grid-gap-2 "
  829. style="box-sizing: border-box; width: 244.5px; flex-shrink: 0 !important; padding-top: 8px !important; padding-right: 16px !important; text-align: right !important; white-space: nowrap !important; display: grid; column-gap: 8px; grid-template-columns: repeat(4, 1fr); grid-template-areas: &quot;grid-col-1 grid-col-2 grid-col-3 grid-col-4&quot;;">
  830. <div class="AvatarStack AvatarStack--right grid-col-1 "
  831. style="box-sizing: border-box; position: relative; min-width: 26px; height: 20px; grid-area: grid-col-1 / grid-col-1 / grid-col-1 / grid-col-1;">
  832. <div aria-label="Assigned to "
  833. class="AvatarStack-body tooltipped tooltipped-sw tooltipped-multiline tooltipped-align-right-1 mt-1"
  834. style="box-sizing: border-box; position: absolute; margin-top: 4px !important; display: flex; background: rgb(255, 255, 255); right: 0px; flex-direction: row-reverse;">
  835. &nbsp;</div>
  836. </div>
  837. <span class="grid-col-4"
  838. style="box-sizing: border-box; grid-area: grid-col-4 / grid-col-4 / grid-col-4 / grid-col-4;"><a
  839. aria-label="3 comments" class="muted-link"
  840. href="https://github.com/ckeditor/ckeditor5/issues/6165"
  841. style="box-sizing: border-box; background-color: initial; color: rgb(88, 96, 105) !important; text-decoration: none;"><svg
  842. aria-hidden="true"
  843. class="octicon octicon-comment v-align-middle" height="16"
  844. version="1.1" viewbox="0 0 16 16" width="16">
  845. <path
  846. d="M14 1H2c-.55 0-1 .45-1 1v8c0 .55.45 1 1 1h2v3.5L7.5 11H14c.55 0 1-.45 1-1V2c0-.55-.45-1-1-1zm0 9H7l-2 2v-2H2V2h12v8z"
  847. fill-rule="evenodd"> </path>
  848. </svg><span>&nbsp;</span><span class="text-small text-bold"
  849. style="box-sizing: border-box; font-size: 12px !important; font-weight: 600 !important;">3</span></a></span>
  850. </div>
  851. </div>
  852. </div>
  853. <div class="Box-row Box-row--focus-gray p-0 mt-0 js-navigation-item js-issue-row"
  854. data-id="557464229" id="issue_6165"
  855. style="box-sizing: border-box; padding: 0px !important; margin-top: 0px !important; list-style-type: none; border-top: 1px solid transparent; border-top-left-radius: 2px; border-top-right-radius: 2px;">
  856. <div class="d-flex Box-row--drag-hide position-relative"
  857. style="box-sizing: border-box; position: relative !important; display: flex !important;">
  858. <div class="flex-shrink-0 pt-2 pl-3"
  859. style="box-sizing: border-box; flex-shrink: 0 !important; padding-top: 8px !important; padding-left: 16px !important;">
  860. <span aria-label="Open issue" class="tooltipped tooltipped-e"
  861. style="box-sizing: border-box; position: relative;"><svg
  862. aria-hidden="true" class="octicon octicon-issue-opened open"
  863. height="16" version="1.1" viewbox="0 0 14 16" width="14">
  864. <path
  865. d="M7 2.3c3.14 0 5.7 2.56 5.7 5.7s-2.56 5.7-5.7 5.7A5.71 5.71 0 011.3 8c0-3.14 2.56-5.7 5.7-5.7zM7 1C3.14 1 0 4.14 0 8s3.14 7 7 7 7-3.14 7-7-3.14-7-7-7zm1 3H6v5h2V4zm0 6H6v2h2v-2z"
  866. fill-rule="evenodd"> </path>
  867. </svg></span></div>
  868. <div class="flex-auto min-width-0 lh-condensed p-2 "
  869. style="box-sizing: border-box; flex: 1 1 auto !important; min-width: 0px !important; padding: 8px !important; line-height: 1.25 !important;">
  870. <a class="link-gray-dark v-align-middle no-underline h4 js-navigation-open"
  871. data-hovercard-type="issue"
  872. data-hovercard-url="/ckeditor/ckeditor5/issues/6165/hovercard"
  873. href="https://github.com/ckeditor/ckeditor5/issues/6165"
  874. id="issue_6165_link"
  875. style="box-sizing: border-box; background-color: initial; color: rgb(36, 41, 46) !important; text-decoration: none !important; vertical-align: middle !important; font-size: 16px !important; font-weight: 600 !important;">Font
  876. styles are <span style="font-family:Georgia,serif;"><span
  877. style="color:#27ae60;"><span
  878. style="background-color:#dddddd;">not honored when
  879. pasti</span></span></span>ng from MS
  880. Word<span>&nbsp;</span></a><span class="labels lh-default "
  881. style="box-sizing: border-box; line-height: 1.5 !important; position: relative;"><a
  882. class="d-inline-block IssueLabel"
  883. href="https://github.com/ckeditor/ckeditor5/issues?q=is%3Aissue+is%3Aopen+label%3Apackage%3Afont"
  884. style="box-sizing: border-box; background-color: rgb(254, 242, 192); color: rgb(0, 0, 0); text-decoration: none; display: inline-block !important; height: 20px; padding: 0.15em 4px; font-size: 12px; font-weight: 600; line-height: 15px; border-radius: 2px; box-shadow: rgba(27, 31, 35, 0.12) 0px -1px 0px inset;"
  885. title="package:font">package:font</a><span>&nbsp;</span><a
  886. class="d-inline-block IssueLabel"
  887. href="https://github.com/ckeditor/ckeditor5/issues?q=is%3Aissue+is%3Aopen+label%3Apackage%3Apaste-from-office"
  888. style="box-sizing: border-box; background-color: rgb(254, 242, 192); color: rgb(0, 0, 0); text-decoration: none; display: inline-block !important; height: 20px; padding: 0.15em 4px; font-size: 12px; font-weight: 600; line-height: 15px; border-radius: 2px; box-shadow: rgba(27, 31, 35, 0.12) 0px -1px 0px inset;"
  889. title="package:paste-from-office">package:paste-from-office</a><span>&nbsp;</span><a
  890. class="d-inline-block IssueLabel"
  891. href="https://github.com/ckeditor/ckeditor5/issues?q=is%3Aissue+is%3Aopen+label%3Astatus%3Aconfirmed"
  892. style="box-sizing: border-box; background-color: rgb(230, 230, 230); color: rgb(0, 0, 0); text-decoration: none; display: inline-block !important; height: 20px; padding: 0.15em 4px; font-size: 12px; font-weight: 600; line-height: 15px; border-radius: 2px; box-shadow: rgba(27, 31, 35, 0.12) 0px -1px 0px inset;"
  893. title="status:confirmed">status:confirmed</a><span>&nbsp;</span><a
  894. class="d-inline-block IssueLabel"
  895. href="https://github.com/ckeditor/ckeditor5/issues?q=is%3Aissue+is%3Aopen+label%3Asupport%3A1"
  896. style="box-sizing: border-box; background-color: rgb(170, 170, 170); color: rgb(0, 0, 0); text-decoration: none; display: inline-block !important; height: 20px; padding: 0.15em 4px; font-size: 12px; font-weight: 600; line-height: 15px; border-radius: 2px; box-shadow: rgba(27, 31, 35, 0.12) 0px -1px 0px inset;"
  897. title="An issue reported by a commercially licensed client.">support:1</a><span>&nbsp;</span><a
  898. class="d-inline-block IssueLabel"
  899. href="https://github.com/ckeditor/ckeditor5/issues?q=is%3Aissue+is%3Aopen+label%3Atype%3Abug"
  900. style="box-sizing: border-box; background-color: rgb(221, 68, 68); color: rgb(0, 0, 0); text-decoration: none; display: inline-block !important; height: 20px; padding: 0.15em 4px; font-size: 12px; font-weight: 600; line-height: 15px; border-radius: 2px; box-shadow: rgba(27, 31, 35, 0.12) 0px -1px 0px inset;"
  901. title="type:bug">type:bug</a></span>
  902. <div class="mt-1 text-small text-gray"
  903. style="box-sizing: border-box; color: rgb(88, 96, 105) !important; margin-top: 4px !important; font-size: 12px !important;">
  904. <span class="opened-by" style="box-sizing: border-box;">#6165
  905. opened<span>&nbsp;</span>
  906. <relative-time class="no-wrap" datetime="2020-01-30T12:34:35Z"
  907. style="box-sizing: border-box; white-space: nowrap !important;"
  908. title="Jan 30, 2020, 1:34 PM GMT+1"> 2 hours ago
  909. </relative-time> <span>&nbsp;</span>by<span>&nbsp;</span><a
  910. class="muted-link" data-hovercard-type="user"
  911. data-hovercard-url="/users/jswiderski/hovercard"
  912. data-octo-click="hovercard-link-click"
  913. data-octo-dimensions="link_type:self"
  914. href="https://github.com/ckeditor/ckeditor5/issues?q=is%3Aissue+is%3Aopen+author%3Ajswiderski"
  915. style="box-sizing: border-box; background-color: initial; color: rgb(88, 96, 105) !important; text-decoration: none;"
  916. title="Open issues created by jswiderski">jswiderski</a><span>&nbsp;</span>
  917. </span><span
  918. class="issue-meta-section css-truncate issue-milestone ml-2 "
  919. style="box-sizing: border-box; margin-left: 8px !important; max-width: 240px;"><a
  920. aria-label="nice-to-have"
  921. class="milestone-link muted-link css-truncate tooltipped tooltipped-n"
  922. href="https://github.com/ckeditor/ckeditor5/milestone/17"
  923. style="box-sizing: border-box; background-color: initial; color: rgb(88, 96, 105) !important; text-decoration: none; position: relative;"><svg
  924. aria-label="Milestone" class="octicon octicon-milestone"
  925. height="16" role="img" version="1.1" viewbox="0 0 14 16"
  926. width="14">
  927. <path
  928. d="M8 2H6V0h2v2zm4 5H2c-.55 0-1-.45-1-1V4c0-.55.45-1 1-1h10l2 2-2 2zM8 4H6v2h2V4zM6 16h2V8H6v8z"
  929. fill-rule="evenodd"> </path>
  930. </svg><span>&nbsp;</span><span class="css-truncate-target"
  931. style="box-sizing: border-box; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: inline-block; max-width: 100px; vertical-align: top;">nice-to-have</span></a></span>
  932. </div>
  933. </div>
  934. <div class="flex-shrink-0 col-3 pt-2 text-right pr-3 no-wrap d-grid grid-4-col grid-gap-2 "
  935. style="box-sizing: border-box; width: 244.5px; flex-shrink: 0 !important; padding-top: 8px !important; padding-right: 16px !important; text-align: right !important; white-space: nowrap !important; display: grid; column-gap: 8px; grid-template-columns: repeat(4, 1fr); grid-template-areas: &quot;grid-col-1 grid-col-2 grid-col-3 grid-col-4&quot;;">
  936. <div class="AvatarStack AvatarStack--right grid-col-1 "
  937. style="box-sizing: border-box; position: relative; min-width: 26px; height: 20px; grid-area: grid-col-1 / grid-col-1 / grid-col-1 / grid-col-1;">
  938. <div aria-label="Assigned to "
  939. class="AvatarStack-body tooltipped tooltipped-sw tooltipped-multiline tooltipped-align-right-1 mt-1"
  940. style="box-sizing: border-box; position: absolute; margin-top: 4px !important; display: flex; background: rgb(255, 255, 255); right: 0px; flex-direction: row-reverse;">
  941. &nbsp;</div>
  942. </div>
  943. <span class="grid-col-4"
  944. style="box-sizing: border-box; grid-area: grid-col-4 / grid-col-4 / grid-col-4 / grid-col-4;"><a
  945. aria-label="3 comments" class="muted-link"
  946. href="https://github.com/ckeditor/ckeditor5/issues/6165"
  947. style="box-sizing: border-box; background-color: initial; color: rgb(88, 96, 105) !important; text-decoration: none;"><svg
  948. aria-hidden="true"
  949. class="octicon octicon-comment v-align-middle" height="16"
  950. version="1.1" viewbox="0 0 16 16" width="16">
  951. <path
  952. d="M14 1H2c-.55 0-1 .45-1 1v8c0 .55.45 1 1 1h2v3.5L7.5 11H14c.55 0 1-.45 1-1V2c0-.55-.45-1-1-1zm0 9H7l-2 2v-2H2V2h12v8z"
  953. fill-rule="evenodd"> </path>
  954. </svg><span>&nbsp;</span><span class="text-small text-bold"
  955. style="box-sizing: border-box; font-size: 12px !important; font-weight: 600 !important;">3</span></a></span>
  956. </div>
  957. </div>
  958. </div>
  959. <div class="Box-row Box-row--focus-gray p-0 mt-0 js-navigation-item js-issue-row"
  960. data-id="557464229" id="issue_6165"
  961. style="box-sizing: border-box; padding: 0px !important; margin-top: 0px !important; list-style-type: none; border-top: 1px solid transparent; border-top-left-radius: 2px; border-top-right-radius: 2px;">
  962. <div class="d-flex Box-row--drag-hide position-relative"
  963. style="box-sizing: border-box; position: relative !important; display: flex !important;">
  964. <div class="flex-shrink-0 pt-2 pl-3"
  965. style="box-sizing: border-box; flex-shrink: 0 !important; padding-top: 8px !important; padding-left: 16px !important;">
  966. <span aria-label="Open issue" class="tooltipped tooltipped-e"
  967. style="box-sizing: border-box; position: relative;"><svg
  968. aria-hidden="true" class="octicon octicon-issue-opened open"
  969. height="16" version="1.1" viewbox="0 0 14 16" width="14">
  970. <path
  971. d="M7 2.3c3.14 0 5.7 2.56 5.7 5.7s-2.56 5.7-5.7 5.7A5.71 5.71 0 011.3 8c0-3.14 2.56-5.7 5.7-5.7zM7 1C3.14 1 0 4.14 0 8s3.14 7 7 7 7-3.14 7-7-3.14-7-7-7zm1 3H6v5h2V4zm0 6H6v2h2v-2z"
  972. fill-rule="evenodd"> </path>
  973. </svg></span></div>
  974. <div class="flex-auto min-width-0 lh-condensed p-2 "
  975. style="box-sizing: border-box; flex: 1 1 auto !important; min-width: 0px !important; padding: 8px !important; line-height: 1.25 !important;">
  976. <a class="link-gray-dark v-align-middle no-underline h4 js-navigation-open"
  977. data-hovercard-type="issue"
  978. data-hovercard-url="/ckeditor/ckeditor5/issues/6165/hovercard"
  979. href="https://github.com/ckeditor/ckeditor5/issues/6165"
  980. id="issue_6165_link"
  981. style="box-sizing: border-box; background-color: initial; color: rgb(36, 41, 46) !important; text-decoration: none !important; vertical-align: middle !important; font-size: 16px !important; font-weight: 600 !important;">Font
  982. styles are <span style="font-family:Georgia,serif;"><span
  983. style="color:#27ae60;"><span
  984. style="background-color:#dddddd;">not honored when
  985. pasti</span></span></span>ng from MS
  986. Word<span>&nbsp;</span></a><span class="labels lh-default "
  987. style="box-sizing: border-box; line-height: 1.5 !important; position: relative;"><a
  988. class="d-inline-block IssueLabel"
  989. href="https://github.com/ckeditor/ckeditor5/issues?q=is%3Aissue+is%3Aopen+label%3Apackage%3Afont"
  990. style="box-sizing: border-box; background-color: rgb(254, 242, 192); color: rgb(0, 0, 0); text-decoration: none; display: inline-block !important; height: 20px; padding: 0.15em 4px; font-size: 12px; font-weight: 600; line-height: 15px; border-radius: 2px; box-shadow: rgba(27, 31, 35, 0.12) 0px -1px 0px inset;"
  991. title="package:font">package:font</a><span>&nbsp;</span><a
  992. class="d-inline-block IssueLabel"
  993. href="https://github.com/ckeditor/ckeditor5/issues?q=is%3Aissue+is%3Aopen+label%3Apackage%3Apaste-from-office"
  994. style="box-sizing: border-box; background-color: rgb(254, 242, 192); color: rgb(0, 0, 0); text-decoration: none; display: inline-block !important; height: 20px; padding: 0.15em 4px; font-size: 12px; font-weight: 600; line-height: 15px; border-radius: 2px; box-shadow: rgba(27, 31, 35, 0.12) 0px -1px 0px inset;"
  995. title="package:paste-from-office">package:paste-from-office</a><span>&nbsp;</span><a
  996. class="d-inline-block IssueLabel"
  997. href="https://github.com/ckeditor/ckeditor5/issues?q=is%3Aissue+is%3Aopen+label%3Astatus%3Aconfirmed"
  998. style="box-sizing: border-box; background-color: rgb(230, 230, 230); color: rgb(0, 0, 0); text-decoration: none; display: inline-block !important; height: 20px; padding: 0.15em 4px; font-size: 12px; font-weight: 600; line-height: 15px; border-radius: 2px; box-shadow: rgba(27, 31, 35, 0.12) 0px -1px 0px inset;"
  999. title="status:confirmed">status:confirmed</a><span>&nbsp;</span><a
  1000. class="d-inline-block IssueLabel"
  1001. href="https://github.com/ckeditor/ckeditor5/issues?q=is%3Aissue+is%3Aopen+label%3Asupport%3A1"
  1002. style="box-sizing: border-box; background-color: rgb(170, 170, 170); color: rgb(0, 0, 0); text-decoration: none; display: inline-block !important; height: 20px; padding: 0.15em 4px; font-size: 12px; font-weight: 600; line-height: 15px; border-radius: 2px; box-shadow: rgba(27, 31, 35, 0.12) 0px -1px 0px inset;"
  1003. title="An issue reported by a commercially licensed client.">support:1</a><span>&nbsp;</span><a
  1004. class="d-inline-block IssueLabel"
  1005. href="https://github.com/ckeditor/ckeditor5/issues?q=is%3Aissue+is%3Aopen+label%3Atype%3Abug"
  1006. style="box-sizing: border-box; background-color: rgb(221, 68, 68); color: rgb(0, 0, 0); text-decoration: none; display: inline-block !important; height: 20px; padding: 0.15em 4px; font-size: 12px; font-weight: 600; line-height: 15px; border-radius: 2px; box-shadow: rgba(27, 31, 35, 0.12) 0px -1px 0px inset;"
  1007. title="type:bug">type:bug</a></span>
  1008. <div class="mt-1 text-small text-gray"
  1009. style="box-sizing: border-box; color: rgb(88, 96, 105) !important; margin-top: 4px !important; font-size: 12px !important;">
  1010. <span class="opened-by" style="box-sizing: border-box;">#6165
  1011. opened<span>&nbsp;</span>
  1012. <relative-time class="no-wrap" datetime="2020-01-30T12:34:35Z"
  1013. style="box-sizing: border-box; white-space: nowrap !important;"
  1014. title="Jan 30, 2020, 1:34 PM GMT+1"> 2 hours ago
  1015. </relative-time> <span>&nbsp;</span>by<span>&nbsp;</span><a
  1016. class="muted-link" data-hovercard-type="user"
  1017. data-hovercard-url="/users/jswiderski/hovercard"
  1018. data-octo-click="hovercard-link-click"
  1019. data-octo-dimensions="link_type:self"
  1020. href="https://github.com/ckeditor/ckeditor5/issues?q=is%3Aissue+is%3Aopen+author%3Ajswiderski"
  1021. style="box-sizing: border-box; background-color: initial; color: rgb(88, 96, 105) !important; text-decoration: none;"
  1022. title="Open issues created by jswiderski">jswiderski</a><span>&nbsp;</span>
  1023. </span><span
  1024. class="issue-meta-section css-truncate issue-milestone ml-2 "
  1025. style="box-sizing: border-box; margin-left: 8px !important; max-width: 240px;"><a
  1026. aria-label="nice-to-have"
  1027. class="milestone-link muted-link css-truncate tooltipped tooltipped-n"
  1028. href="https://github.com/ckeditor/ckeditor5/milestone/17"
  1029. style="box-sizing: border-box; background-color: initial; color: rgb(88, 96, 105) !important; text-decoration: none; position: relative;"><svg
  1030. aria-label="Milestone" class="octicon octicon-milestone"
  1031. height="16" role="img" version="1.1" viewbox="0 0 14 16"
  1032. width="14">
  1033. <path
  1034. d="M8 2H6V0h2v2zm4 5H2c-.55 0-1-.45-1-1V4c0-.55.45-1 1-1h10l2 2-2 2zM8 4H6v2h2V4zM6 16h2V8H6v8z"
  1035. fill-rule="evenodd"> </path>
  1036. </svg><span>&nbsp;</span><span class="css-truncate-target"
  1037. style="box-sizing: border-box; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: inline-block; max-width: 100px; vertical-align: top;">nice-to-have</span></a></span>
  1038. </div>
  1039. </div>
  1040. <div class="flex-shrink-0 col-3 pt-2 text-right pr-3 no-wrap d-grid grid-4-col grid-gap-2 "
  1041. style="box-sizing: border-box; width: 244.5px; flex-shrink: 0 !important; padding-top: 8px !important; padding-right: 16px !important; text-align: right !important; white-space: nowrap !important; display: grid; column-gap: 8px; grid-template-columns: repeat(4, 1fr); grid-template-areas: &quot;grid-col-1 grid-col-2 grid-col-3 grid-col-4&quot;;">
  1042. <div class="AvatarStack AvatarStack--right grid-col-1 "
  1043. style="box-sizing: border-box; position: relative; min-width: 26px; height: 20px; grid-area: grid-col-1 / grid-col-1 / grid-col-1 / grid-col-1;">
  1044. <div aria-label="Assigned to "
  1045. class="AvatarStack-body tooltipped tooltipped-sw tooltipped-multiline tooltipped-align-right-1 mt-1"
  1046. style="box-sizing: border-box; position: absolute; margin-top: 4px !important; display: flex; background: rgb(255, 255, 255); right: 0px; flex-direction: row-reverse;">
  1047. &nbsp;</div>
  1048. </div>
  1049. <span class="grid-col-4"
  1050. style="box-sizing: border-box; grid-area: grid-col-4 / grid-col-4 / grid-col-4 / grid-col-4;"><a
  1051. aria-label="3 comments" class="muted-link"
  1052. href="https://github.com/ckeditor/ckeditor5/issues/6165"
  1053. style="box-sizing: border-box; background-color: initial; color: rgb(88, 96, 105) !important; text-decoration: none;"><svg
  1054. aria-hidden="true"
  1055. class="octicon octicon-comment v-align-middle" height="16"
  1056. version="1.1" viewbox="0 0 16 16" width="16">
  1057. <path
  1058. d="M14 1H2c-.55 0-1 .45-1 1v8c0 .55.45 1 1 1h2v3.5L7.5 11H14c.55 0 1-.45 1-1V2c0-.55-.45-1-1-1zm0 9H7l-2 2v-2H2V2h12v8z"
  1059. fill-rule="evenodd"> </path>
  1060. </svg><span>&nbsp;</span><span class="text-small text-bold"
  1061. style="box-sizing: border-box; font-size: 12px !important; font-weight: 600 !important;">3</span></a></span>
  1062. </div>
  1063. </div>
  1064. </div>
  1065. <div class="Box-row Box-row--focus-gray p-0 mt-0 js-navigation-item js-issue-row"
  1066. data-id="557464229" id="issue_6165"
  1067. style="box-sizing: border-box; padding: 0px !important; margin-top: 0px !important; list-style-type: none; border-top: 1px solid transparent; border-top-left-radius: 2px; border-top-right-radius: 2px;">
  1068. <div class="d-flex Box-row--drag-hide position-relative"
  1069. style="box-sizing: border-box; position: relative !important; display: flex !important;">
  1070. <div class="flex-shrink-0 pt-2 pl-3"
  1071. style="box-sizing: border-box; flex-shrink: 0 !important; padding-top: 8px !important; padding-left: 16px !important;">
  1072. <span aria-label="Open issue" class="tooltipped tooltipped-e"
  1073. style="box-sizing: border-box; position: relative;"><svg
  1074. aria-hidden="true" class="octicon octicon-issue-opened open"
  1075. height="16" version="1.1" viewbox="0 0 14 16" width="14">
  1076. <path
  1077. d="M7 2.3c3.14 0 5.7 2.56 5.7 5.7s-2.56 5.7-5.7 5.7A5.71 5.71 0 011.3 8c0-3.14 2.56-5.7 5.7-5.7zM7 1C3.14 1 0 4.14 0 8s3.14 7 7 7 7-3.14 7-7-3.14-7-7-7zm1 3H6v5h2V4zm0 6H6v2h2v-2z"
  1078. fill-rule="evenodd"> </path>
  1079. </svg></span></div>
  1080. <div class="flex-auto min-width-0 lh-condensed p-2 "
  1081. style="box-sizing: border-box; flex: 1 1 auto !important; min-width: 0px !important; padding: 8px !important; line-height: 1.25 !important;">
  1082. <a class="link-gray-dark v-align-middle no-underline h4 js-navigation-open"
  1083. data-hovercard-type="issue"
  1084. data-hovercard-url="/ckeditor/ckeditor5/issues/6165/hovercard"
  1085. href="https://github.com/ckeditor/ckeditor5/issues/6165"
  1086. id="issue_6165_link"
  1087. style="box-sizing: border-box; background-color: initial; color: rgb(36, 41, 46) !important; text-decoration: none !important; vertical-align: middle !important; font-size: 16px !important; font-weight: 600 !important;">Font
  1088. styles are <span style="font-family:Georgia,serif;"><span
  1089. style="color:#27ae60;"><span
  1090. style="background-color:#dddddd;">not honored when
  1091. pasti</span></span></span>ng from MS
  1092. Word<span>&nbsp;</span></a><span class="labels lh-default "
  1093. style="box-sizing: border-box; line-height: 1.5 !important; position: relative;"><a
  1094. class="d-inline-block IssueLabel"
  1095. href="https://github.com/ckeditor/ckeditor5/issues?q=is%3Aissue+is%3Aopen+label%3Apackage%3Afont"
  1096. style="box-sizing: border-box; background-color: rgb(254, 242, 192); color: rgb(0, 0, 0); text-decoration: none; display: inline-block !important; height: 20px; padding: 0.15em 4px; font-size: 12px; font-weight: 600; line-height: 15px; border-radius: 2px; box-shadow: rgba(27, 31, 35, 0.12) 0px -1px 0px inset;"
  1097. title="package:font">package:font</a><span>&nbsp;</span><a
  1098. class="d-inline-block IssueLabel"
  1099. href="https://github.com/ckeditor/ckeditor5/issues?q=is%3Aissue+is%3Aopen+label%3Apackage%3Apaste-from-office"
  1100. style="box-sizing: border-box; background-color: rgb(254, 242, 192); color: rgb(0, 0, 0); text-decoration: none; display: inline-block !important; height: 20px; padding: 0.15em 4px; font-size: 12px; font-weight: 600; line-height: 15px; border-radius: 2px; box-shadow: rgba(27, 31, 35, 0.12) 0px -1px 0px inset;"
  1101. title="package:paste-from-office">package:paste-from-office</a><span>&nbsp;</span><a
  1102. class="d-inline-block IssueLabel"
  1103. href="https://github.com/ckeditor/ckeditor5/issues?q=is%3Aissue+is%3Aopen+label%3Astatus%3Aconfirmed"
  1104. style="box-sizing: border-box; background-color: rgb(230, 230, 230); color: rgb(0, 0, 0); text-decoration: none; display: inline-block !important; height: 20px; padding: 0.15em 4px; font-size: 12px; font-weight: 600; line-height: 15px; border-radius: 2px; box-shadow: rgba(27, 31, 35, 0.12) 0px -1px 0px inset;"
  1105. title="status:confirmed">status:confirmed</a><span>&nbsp;</span><a
  1106. class="d-inline-block IssueLabel"
  1107. href="https://github.com/ckeditor/ckeditor5/issues?q=is%3Aissue+is%3Aopen+label%3Asupport%3A1"
  1108. style="box-sizing: border-box; background-color: rgb(170, 170, 170); color: rgb(0, 0, 0); text-decoration: none; display: inline-block !important; height: 20px; padding: 0.15em 4px; font-size: 12px; font-weight: 600; line-height: 15px; border-radius: 2px; box-shadow: rgba(27, 31, 35, 0.12) 0px -1px 0px inset;"
  1109. title="An issue reported by a commercially licensed client.">support:1</a><span>&nbsp;</span><a
  1110. class="d-inline-block IssueLabel"
  1111. href="https://github.com/ckeditor/ckeditor5/issues?q=is%3Aissue+is%3Aopen+label%3Atype%3Abug"
  1112. style="box-sizing: border-box; background-color: rgb(221, 68, 68); color: rgb(0, 0, 0); text-decoration: none; display: inline-block !important; height: 20px; padding: 0.15em 4px; font-size: 12px; font-weight: 600; line-height: 15px; border-radius: 2px; box-shadow: rgba(27, 31, 35, 0.12) 0px -1px 0px inset;"
  1113. title="type:bug">type:bug</a></span>
  1114. <div class="mt-1 text-small text-gray"
  1115. style="box-sizing: border-box; color: rgb(88, 96, 105) !important; margin-top: 4px !important; font-size: 12px !important;">
  1116. <span class="opened-by" style="box-sizing: border-box;">#6165
  1117. opened<span>&nbsp;</span>
  1118. <relative-time class="no-wrap" datetime="2020-01-30T12:34:35Z"
  1119. style="box-sizing: border-box; white-space: nowrap !important;"
  1120. title="Jan 30, 2020, 1:34 PM GMT+1"> 2 hours ago
  1121. </relative-time> <span>&nbsp;</span>by<span>&nbsp;</span><a
  1122. class="muted-link" data-hovercard-type="user"
  1123. data-hovercard-url="/users/jswiderski/hovercard"
  1124. data-octo-click="hovercard-link-click"
  1125. data-octo-dimensions="link_type:self"
  1126. href="https://github.com/ckeditor/ckeditor5/issues?q=is%3Aissue+is%3Aopen+author%3Ajswiderski"
  1127. style="box-sizing: border-box; background-color: initial; color: rgb(88, 96, 105) !important; text-decoration: none;"
  1128. title="Open issues created by jswiderski">jswiderski</a><span>&nbsp;</span>
  1129. </span><span
  1130. class="issue-meta-section css-truncate issue-milestone ml-2 "
  1131. style="box-sizing: border-box; margin-left: 8px !important; max-width: 240px;"><a
  1132. aria-label="nice-to-have"
  1133. class="milestone-link muted-link css-truncate tooltipped tooltipped-n"
  1134. href="https://github.com/ckeditor/ckeditor5/milestone/17"
  1135. style="box-sizing: border-box; background-color: initial; color: rgb(88, 96, 105) !important; text-decoration: none; position: relative;"><svg
  1136. aria-label="Milestone" class="octicon octicon-milestone"
  1137. height="16" role="img" version="1.1" viewbox="0 0 14 16"
  1138. width="14">
  1139. <path
  1140. d="M8 2H6V0h2v2zm4 5H2c-.55 0-1-.45-1-1V4c0-.55.45-1 1-1h10l2 2-2 2zM8 4H6v2h2V4zM6 16h2V8H6v8z"
  1141. fill-rule="evenodd"> </path>
  1142. </svg><span>&nbsp;</span><span class="css-truncate-target"
  1143. style="box-sizing: border-box; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: inline-block; max-width: 100px; vertical-align: top;">nice-to-have</span></a></span>
  1144. </div>
  1145. </div>
  1146. <div class="flex-shrink-0 col-3 pt-2 text-right pr-3 no-wrap d-grid grid-4-col grid-gap-2 "
  1147. style="box-sizing: border-box; width: 244.5px; flex-shrink: 0 !important; padding-top: 8px !important; padding-right: 16px !important; text-align: right !important; white-space: nowrap !important; display: grid; column-gap: 8px; grid-template-columns: repeat(4, 1fr); grid-template-areas: &quot;grid-col-1 grid-col-2 grid-col-3 grid-col-4&quot;;">
  1148. <div class="AvatarStack AvatarStack--right grid-col-1 "
  1149. style="box-sizing: border-box; position: relative; min-width: 26px; height: 20px; grid-area: grid-col-1 / grid-col-1 / grid-col-1 / grid-col-1;">
  1150. <div aria-label="Assigned to "
  1151. class="AvatarStack-body tooltipped tooltipped-sw tooltipped-multiline tooltipped-align-right-1 mt-1"
  1152. style="box-sizing: border-box; position: absolute; margin-top: 4px !important; display: flex; background: rgb(255, 255, 255); right: 0px; flex-direction: row-reverse;">
  1153. &nbsp;</div>
  1154. </div>
  1155. <span class="grid-col-4"
  1156. style="box-sizing: border-box; grid-area: grid-col-4 / grid-col-4 / grid-col-4 / grid-col-4;"><a
  1157. aria-label="3 comments" class="muted-link"
  1158. href="https://github.com/ckeditor/ckeditor5/issues/6165"
  1159. style="box-sizing: border-box; background-color: initial; color: rgb(88, 96, 105) !important; text-decoration: none;"><svg
  1160. aria-hidden="true"
  1161. class="octicon octicon-comment v-align-middle" height="16"
  1162. version="1.1" viewbox="0 0 16 16" width="16">
  1163. <path
  1164. d="M14 1H2c-.55 0-1 .45-1 1v8c0 .55.45 1 1 1h2v3.5L7.5 11H14c.55 0 1-.45 1-1V2c0-.55-.45-1-1-1zm0 9H7l-2 2v-2H2V2h12v8z"
  1165. fill-rule="evenodd"> </path>
  1166. </svg><span>&nbsp;</span><span class="text-small text-bold"
  1167. style="box-sizing: border-box; font-size: 12px !important; font-weight: 600 !important;">3</span></a></span>
  1168. </div>
  1169. </div>
  1170. </div>
  1171. <div aria-selected="false"
  1172. class="Box-row Box-row--focus-gray p-0 mt-0 js-navigation-item js-issue-row"
  1173. data-id="557435601" id="issue_6164"
  1174. style="box-sizing: border-box; padding: 0px !important; margin-top: 0px !important; list-style-type: none; border-top: 1px solid rgb(225, 228, 232);">
  1175. <div class="d-flex Box-row--drag-hide position-relative"
  1176. style="box-sizing: border-box; position: relative !important; display: flex !important;">
  1177. <div class="flex-shrink-0 pt-2 pl-3"
  1178. style="box-sizing: border-box; flex-shrink: 0 !important; padding-top: 8px !important; padding-left: 16px !important;">
  1179. <span aria-label="Open issue" class="tooltipped tooltipped-e"
  1180. style="box-sizing: border-box; position: relative;"><svg
  1181. aria-hidden="true" class="octicon octicon-issue-opened open"
  1182. height="16" version="1.1" viewbox="0 0 14 16" width="14">
  1183. <path
  1184. d="M7 2.3c3.14 0 5.7 2.56 5.7 5.7s-2.56 5.7-5.7 5.7A5.71 5.71 0 011.3 8c0-3.14 2.56-5.7 5.7-5.7zM7 1C3.14 1 0 4.14 0 8s3.14 7 7 7 7-3.14 7-7-3.14-7-7-7zm1 3H6v5h2V4zm0 6H6v2h2v-2z"
  1185. fill-rule="evenodd"> </path>
  1186. </svg></span></div>
  1187. <div class="flex-auto min-width-0 lh-condensed p-2 "
  1188. style="box-sizing: border-box; flex: 1 1 auto !important; min-width: 0px !important; padding: 8px !important; line-height: 1.25 !important;">
  1189. <a class="link-gray-dark v-align-middle no-underline h4 js-navigation-open"
  1190. data-hovercard-type="issue"
  1191. data-hovercard-url="/ckeditor/ckeditor5/issues/6164/hovercard"
  1192. href="https://github.com/ckeditor/ckeditor5/issues/6164"
  1193. id="issue_6164_link"
  1194. style="box-sizing: border-box; background-color: initial; color: rgb(36, 41, 46) !important; text-decoration: none !important; vertical-align: middle !important; font-size: 16px !important; font-weight: 600 !important;">CKEditor
  1195. Supressing MouseDown Action Performed Inside React Component Block
  1196. Widget</a><span>&nbsp;</span><span class="labels lh-default "
  1197. style="box-sizing: border-box; line-height: 1.5 !important; position: relative;"><a
  1198. class="d-inline-block IssueLabel"
  1199. href="https://github.com/ckeditor/ckeditor5/issues?q=is%3Aissue+is%3Aopen+label%3Atype%3Abug"
  1200. style="box-sizing: border-box; background-color: rgb(221, 68, 68); color: rgb(0, 0, 0); text-decoration: none; display: inline-block !important; height: 20px; padding: 0.15em 4px; font-size: 12px; font-weight: 600; line-height: 15px; border-radius: 2px; box-shadow: rgba(27, 31, 35, 0.12) 0px -1px 0px inset;"
  1201. title="type:bug">type:bug</a></span>
  1202. <div class="mt-1 text-small text-gray"
  1203. style="box-sizing: border-box; color: rgb(88, 96, 105) !important; margin-top: 4px !important; font-size: 12px !important;">
  1204. <span class="opened-by" style="box-sizing: border-box;">#6164
  1205. opened<span>&nbsp;</span>
  1206. <relative-time class="no-wrap" datetime="2020-01-30T11:35:02Z"
  1207. style="box-sizing: border-box; white-space: nowrap !important;"
  1208. title="Jan 30, 2020, 12:35 PM GMT+1"> 3 hours ago
  1209. </relative-time> <span>&nbsp;</span>by<span>&nbsp;</span><a
  1210. class="muted-link" data-hovercard-type="user"
  1211. data-hovercard-url="/users/abhisheksirari/hovercard"
  1212. data-octo-click="hovercard-link-click"
  1213. data-octo-dimensions="link_type:self"
  1214. href="https://github.com/ckeditor/ckeditor5/issues?q=is%3Aissue+is%3Aopen+author%3Aabhisheksirari"
  1215. style="box-sizing: border-box; background-color: initial; color: rgb(88, 96, 105) !important; text-decoration: none;"
  1216. title="Open issues created by abhisheksirari">abhisheksirari</a>
  1217. </span></div>
  1218. </div>
  1219. <div class="flex-shrink-0 col-3 pt-2 text-right pr-3 no-wrap d-grid grid-4-col grid-gap-2 "
  1220. style="box-sizing: border-box; width: 244.5px; flex-shrink: 0 !important; padding-top: 8px !important; padding-right: 16px !important; text-align: right !important; white-space: nowrap !important; display: grid; column-gap: 8px; grid-template-columns: repeat(4, 1fr); grid-template-areas: &quot;grid-col-1 grid-col-2 grid-col-3 grid-col-4&quot;;">
  1221. <div class="AvatarStack AvatarStack--right grid-col-1 "
  1222. style="box-sizing: border-box; position: relative; min-width: 26px; height: 20px; grid-area: grid-col-1 / grid-col-1 / grid-col-1 / grid-col-1;">
  1223. <div aria-label="Assigned to "
  1224. class="AvatarStack-body tooltipped tooltipped-sw tooltipped-multiline tooltipped-align-right-1 mt-1"
  1225. style="box-sizing: border-box; position: absolute; margin-top: 4px !important; display: flex; background: rgb(255, 255, 255); right: 0px; flex-direction: row-reverse;">
  1226. &nbsp;</div>
  1227. </div>
  1228. </div>
  1229. </div>
  1230. </div>
  1231. <div aria-selected="false"
  1232. class="Box-row Box-row--focus-gray p-0 mt-0 js-navigation-item js-issue-row"
  1233. data-id="556963730" id="issue_6161"
  1234. style="box-sizing: border-box; padding: 0px !important; margin-top: 0px !important; list-style-type: none; border-top: 1px solid rgb(225, 228, 232);">
  1235. <div class="d-flex Box-row--drag-hide position-relative"
  1236. style="box-sizing: border-box; position: relative !important; display: flex !important;">
  1237. <div class="flex-shrink-0 pt-2 pl-3"
  1238. style="box-sizing: border-box; flex-shrink: 0 !important; padding-top: 8px !important; padding-left: 16px !important;">
  1239. <span aria-label="Open issue" class="tooltipped tooltipped-e"
  1240. style="box-sizing: border-box; position: relative;"><svg
  1241. aria-hidden="true" class="octicon octicon-issue-opened open"
  1242. height="16" version="1.1" viewbox="0 0 14 16" width="14">
  1243. <path
  1244. d="M7 2.3c3.14 0 5.7 2.56 5.7 5.7s-2.56 5.7-5.7 5.7A5.71 5.71 0 011.3 8c0-3.14 2.56-5.7 5.7-5.7zM7 1C3.14 1 0 4.14 0 8s3.14 7 7 7 7-3.14 7-7-3.14-7-7-7zm1 3H6v5h2V4zm0 6H6v2h2v-2z"
  1245. fill-rule="evenodd"> </path>
  1246. </svg></span></div>
  1247. <div class="flex-auto min-width-0 lh-condensed p-2 "
  1248. style="box-sizing: border-box; flex: 1 1 auto !important; min-width: 0px !important; padding: 8px !important; line-height: 1.25 !important;">
  1249. <a class="link-gray-dark v-align-middle no-underline h4 js-navigation-open"
  1250. data-hovercard-type="issue"
  1251. data-hovercard-url="/ckeditor/ckeditor5/issues/6161/hovercard"
  1252. href="https://github.com/ckeditor/ckeditor5/issues/6161"
  1253. id="issue_6161_link"
  1254. style="box-sizing: border-box; background-color: initial; color: rgb(36, 41, 46) !important; text-decoration: none !important; vertical-align: middle !important; font-size: 16px !important; font-weight: 600 !important;">Special
  1255. characters all /<span style="font-size:8px;"><span
  1256. style="color:#2980b9;"> latin categories takes noticable
  1257. l</span></span>onger time to load than
  1258. others</a><span>&nbsp;</span><span class="labels lh-default "
  1259. style="box-sizing: border-box; line-height: 1.5 !important; position: relative;"><a
  1260. class="d-inline-block IssueLabel"
  1261. href="https://github.com/ckeditor/ckeditor5/issues?q=is%3Aissue+is%3Aopen+label%3Adomain%3Aui%2Fux"
  1262. style="box-sizing: border-box; background-color: rgb(254, 242, 192); color: rgb(0, 0, 0); text-decoration: none; display: inline-block !important; height: 20px; padding: 0.15em 4px; font-size: 12px; font-weight: 600; line-height: 15px; border-radius: 2px; box-shadow: rgba(27, 31, 35, 0.12) 0px -1px 0px inset;"
  1263. title="domain:ui/ux">domain:ui/ux</a><span>&nbsp;</span><a
  1264. class="d-inline-block IssueLabel"
  1265. href="https://github.com/ckeditor/ckeditor5/issues?q=is%3Aissue+is%3Aopen+label%3Apackage%3Aspecial-characters"
  1266. style="box-sizing: border-box; background-color: rgb(254, 242, 192); color: rgb(0, 0, 0); text-decoration: none; display: inline-block !important; height: 20px; padding: 0.15em 4px; font-size: 12px; font-weight: 600; line-height: 15px; border-radius: 2px; box-shadow: rgba(27, 31, 35, 0.12) 0px -1px 0px inset;"
  1267. title="package:special-characters">package:special-characters</a><span>&nbsp;</span><a
  1268. class="d-inline-block IssueLabel"
  1269. href="https://github.com/ckeditor/ckeditor5/issues?q=is%3Aissue+is%3Aopen+label%3Atype%3Aenhancement"
  1270. style="box-sizing: border-box; background-color: rgb(132, 182, 235); color: rgb(0, 0, 0); text-decoration: none; display: inline-block !important; height: 20px; padding: 0.15em 4px; font-size: 12px; font-weight: 600; line-height: 15px; border-radius: 2px; box-shadow: rgba(27, 31, 35, 0.12) 0px -1px 0px inset;"
  1271. title="type:enhancement">type:enhancement</a><span>&nbsp;</span><a
  1272. class="d-inline-block IssueLabel"
  1273. href="https://github.com/ckeditor/ckeditor5/issues?q=is%3Aissue+is%3Aopen+label%3Atype%3Aperformance"
  1274. style="box-sizing: border-box; background-color: rgb(132, 182, 235); color: rgb(0, 0, 0); text-decoration: none; display: inline-block !important; height: 20px; padding: 0.15em 4px; font-size: 12px; font-weight: 600; line-height: 15px; border-radius: 2px; box-shadow: rgba(27, 31, 35, 0.12) 0px -1px 0px inset;"
  1275. title="type:performance">type:performance</a></span>
  1276. <div class="mt-1 text-small text-gray"
  1277. style="box-sizing: border-box; color: rgb(88, 96, 105) !important; margin-top: 4px !important; font-size: 12px !important;">
  1278. <span class="opened-by" style="box-sizing: border-box;">#6161
  1279. opened<span>&nbsp;</span>
  1280. <relative-time class="no-wrap" datetime="2020-01-29T16:10:15Z"
  1281. style="box-sizing: border-box; white-space: nowrap !important;"
  1282. title="Jan 29, 2020, 5:10 PM GMT+1"> 23 hours ago
  1283. </relative-time> <span>&nbsp;</span>by<span>&nbsp;</span><a
  1284. class="muted-link" data-hovercard-type="user"
  1285. data-hovercard-url="/users/mlewand/hovercard"
  1286. data-octo-click="hovercard-link-click"
  1287. data-octo-dimensions="link_type:self"
  1288. href="https://github.com/ckeditor/ckeditor5/issues?q=is%3Aissue+is%3Aopen+author%3Amlewand"
  1289. style="box-sizing: border-box; background-color: initial; color: rgb(88, 96, 105) !important; text-decoration: none;"
  1290. title="Open issues created by mlewand">mlewand</a>
  1291. </span></div>
  1292. </div>
  1293. <div class="flex-shrink-0 col-3 pt-2 text-right pr-3 no-wrap d-grid grid-4-col grid-gap-2 "
  1294. style="box-sizing: border-box; width: 244.5px; flex-shrink: 0 !important; padding-top: 8px !important; padding-right: 16px !important; text-align: right !important; white-space: nowrap !important; display: grid; column-gap: 8px; grid-template-columns: repeat(4, 1fr); grid-template-areas: &quot;grid-col-1 grid-col-2 grid-col-3 grid-col-4&quot;;">
  1295. <div class="AvatarStack AvatarStack--right grid-col-1 "
  1296. style="box-sizing: border-box; position: relative; min-width: 26px; height: 20px; grid-area: grid-col-1 / grid-col-1 / grid-col-1 / grid-col-1;">
  1297. <div aria-label="Assigned to "
  1298. class="AvatarStack-body tooltipped tooltipped-sw tooltipped-multiline tooltipped-align-right-1 mt-1"
  1299. style="box-sizing: border-box; position: absolute; margin-top: 4px !important; display: flex; background: rgb(255, 255, 255); right: 0px; flex-direction: row-reverse;">
  1300. &nbsp;</div>
  1301. </div>
  1302. <span class="grid-col-4"
  1303. style="box-sizing: border-box; grid-area: grid-col-4 / grid-col-4 / grid-col-4 / grid-col-4;"><a
  1304. aria-label="1 comment" class="muted-link"
  1305. href="https://github.com/ckeditor/ckeditor5/issues/6161"
  1306. style="box-sizing: border-box; background-color: initial; color: rgb(88, 96, 105) !important; text-decoration: none;"><svg
  1307. aria-hidden="true"
  1308. class="octicon octicon-comment v-align-middle" height="16"
  1309. version="1.1" viewbox="0 0 16 16" width="16">
  1310. <path
  1311. d="M14 1H2c-.55 0-1 .45-1 1v8c0 .55.45 1 1 1h2v3.5L7.5 11H14c.55 0 1-.45 1-1V2c0-.55-.45-1-1-1zm0 9H7l-2 2v-2H2V2h12v8z"
  1312. fill-rule="evenodd"> </path>
  1313. </svg><span>&nbsp;</span><span class="text-small text-bold"
  1314. style="box-sizing: border-box; font-size: 12px !important; font-weight: 600 !important;">1</span></a></span>
  1315. </div>
  1316. </div>
  1317. </div>
  1318. <div class="Box-row Box-row--focus-gray p-0 mt-0 js-navigation-item js-issue-row"
  1319. data-id="556865644" id="issue_6160"
  1320. style="box-sizing: border-box; padding: 0px !important; margin-top: 0px !important; list-style-type: none; border-top: 1px solid rgb(225, 228, 232);">
  1321. <div class="d-flex Box-row--drag-hide position-relative"
  1322. style="box-sizing: border-box; position: relative !important; display: flex !important;">
  1323. <div class="flex-shrink-0 pt-2 pl-3"
  1324. style="box-sizing: border-box; flex-shrink: 0 !important; padding-top: 8px !important; padding-left: 16px !important;">
  1325. <span aria-label="Open issue" class="tooltipped tooltipped-e"
  1326. style="box-sizing: border-box; position: relative;"><svg
  1327. aria-hidden="true" class="octicon octicon-issue-opened open"
  1328. height="16" version="1.1" viewbox="0 0 14 16" width="14">
  1329. <path
  1330. d="M7 2.3c3.14 0 5.7 2.56 5.7 5.7s-2.56 5.7-5.7 5.7A5.71 5.71 0 011.3 8c0-3.14 2.56-5.7 5.7-5.7zM7 1C3.14 1 0 4.14 0 8s3.14 7 7 7 7-3.14 7-7-3.14-7-7-7zm1 3H6v5h2V4zm0 6H6v2h2v-2z"
  1331. fill-rule="evenodd"> </path>
  1332. </svg></span></div>
  1333. <div class="flex-auto min-width-0 lh-condensed p-2 "
  1334. style="box-sizing: border-box; flex: 1 1 auto !important; min-width: 0px !important; padding: 8px !important; line-height: 1.25 !important;">
  1335. <a class="link-gray-dark v-align-middle no-underline h4 js-navigation-open"
  1336. data-hovercard-type="issue"
  1337. data-hovercard-url="/ckeditor/ckeditor5/issues/6160/hovercard"
  1338. href="https://github.com/ckeditor/ckeditor5/issues/6160"
  1339. id="issue_6160_link"
  1340. style="box-sizing: border-box; background-color: initial; color: rgb(36, 41, 46) !important; text-decoration: none !important; vertical-align: middle !important; font-size: 16px !important; font-weight: 600 !important;">config.removePlugins
  1341. string doesn&#39;t work for plugins added at a
  1342. runtime</a><span>&nbsp;</span><span class="labels lh-default "
  1343. style="box-sizing: border-box; line-height: 1.5 !important; position: relative;"><a
  1344. class="d-inline-block IssueLabel"
  1345. href="https://github.com/ckeditor/ckeditor5/issues?q=is%3Aissue+is%3Aopen+label%3Adomain%3Adx"
  1346. style="box-sizing: border-box; background-color: rgb(254, 242, 192); color: rgb(0, 0, 0); text-decoration: none; display: inline-block !important; height: 20px; padding: 0.15em 4px; font-size: 12px; font-weight: 600; line-height: 15px; border-radius: 2px; box-shadow: rgba(27, 31, 35, 0.12) 0px -1px 0px inset;"
  1347. title="domain:dx">domain:dx</a><span>&nbsp;</span><a
  1348. class="d-inline-block IssueLabel"
  1349. href="https://github.com/ckeditor/ckeditor5/issues?q=is%3Aissue+is%3Aopen+label%3Atype%3Abug"
  1350. style="box-sizing: border-box; background-color: rgb(221, 68, 68); color: rgb(0, 0, 0); text-decoration: none; display: inline-block !important; height: 20px; padding: 0.15em 4px; font-size: 12px; font-weight: 600; line-height: 15px; border-radius: 2px; box-shadow: rgba(27, 31, 35, 0.12) 0px -1px 0px inset;"
  1351. title="type:bug">type:bug</a></span>
  1352. <div class="mt-1 text-small text-gray"
  1353. style="box-sizing: border-box; color: rgb(88, 96, 105) !important; margin-top: 4px !important; font-size: 12px !important;">
  1354. <span class="opened-by" style="box-sizing: border-box;">#6160
  1355. opened<span>&nbsp;</span>
  1356. <relative-time class="no-wrap" datetime="2020-01-29T13:34:44Z"
  1357. style="box-sizing: border-box; white-space: nowrap !important;"
  1358. title="Jan 29, 2020, 2:34 PM GMT+1"> yesterday
  1359. </relative-time> <span>&nbsp;</span>by<span>&nbsp;</span><a
  1360. class="muted-link" data-hovercard-type="user"
  1361. data-hovercard-url="/users/mlewand/hovercard"
  1362. data-octo-click="hovercard-link-click"
  1363. data-octo-dimensions="link_type:self"
  1364. href="https://github.com/ckeditor/ckeditor5/issues?q=is%3Aissue+is%3Aopen+author%3Amlewand"
  1365. style="box-sizing: border-box; background-color: initial; color: rgb(88, 96, 105) !important; text-decoration: none;"
  1366. title="Open issues created by mlewand">mlewand</a>
  1367. </span></div>
  1368. </div>
  1369. <div class="flex-shrink-0 col-3 pt-2 text-right pr-3 no-wrap d-grid grid-4-col grid-gap-2 "
  1370. style="box-sizing: border-box; width: 244.5px; flex-shrink: 0 !important; padding-top: 8px !important; padding-right: 16px !important; text-align: right !important; white-space: nowrap !important; display: grid; column-gap: 8px; grid-template-columns: repeat(4, 1fr); grid-template-areas: &quot;grid-col-1 grid-col-2 grid-col-3 grid-col-4&quot;;">
  1371. <div class="AvatarStack AvatarStack--right grid-col-1 "
  1372. style="box-sizing: border-box; position: relative; min-width: 26px; height: 20px; grid-area: grid-col-1 / grid-col-1 / grid-col-1 / grid-col-1;">
  1373. <div aria-label="Assigned to "
  1374. class="AvatarStack-body tooltipped tooltipped-sw tooltipped-multiline tooltipped-align-right-1 mt-1"
  1375. style="box-sizing: border-box; position: absolute; margin-top: 4px !important; display: flex; background: rgb(255, 255, 255); right: 0px; flex-direction: row-reverse;">
  1376. &nbsp;</div>
  1377. </div>
  1378. </div>
  1379. </div>
  1380. </div>
  1381. <div aria-selected="false"
  1382. class="Box-row Box-row--focus-gray p-0 mt-0 js-navigation-item js-issue-row"
  1383. data-id="556840990" id="issue_6159"
  1384. style="box-sizing: border-box; padding: 0px !important; margin-top: 0px !important; list-style-type: none; border-top: 1px solid rgb(225, 228, 232);">
  1385. <div class="d-flex Box-row--drag-hide position-relative"
  1386. style="box-sizing: border-box; position: relative !important; display: flex !important;">
  1387. <div class="flex-shrink-0 pt-2 pl-3"
  1388. style="box-sizing: border-box; flex-shrink: 0 !important; padding-top: 8px !important; padding-left: 16px !important;">
  1389. <span aria-label="Open issue" class="tooltipped tooltipped-e"
  1390. style="box-sizing: border-box; position: relative;"><svg
  1391. aria-hidden="true" class="octicon octicon-issue-opened open"
  1392. height="16" version="1.1" viewbox="0 0 14 16" width="14">
  1393. <path
  1394. d="M7 2.3c3.14 0 5.7 2.56 5.7 5.7s-2.56 5.7-5.7 5.7A5.71 5.71 0 011.3 8c0-3.14 2.56-5.7 5.7-5.7zM7 1C3.14 1 0 4.14 0 8s3.14 7 7 7 7-3.14 7-7-3.14-7-7-7zm1 3H6v5h2V4zm0 6H6v2h2v-2z"
  1395. fill-rule="evenodd"> </path>
  1396. </svg></span></div>
  1397. <div class="flex-auto min-width-0 lh-condensed p-2 "
  1398. style="box-sizing: border-box; flex: 1 1 auto !important; min-width: 0px !important; padding: 8px !important; line-height: 1.25 !important;">
  1399. <a class="link-gray-dark v-align-middle no-underline h4 js-navigation-open"
  1400. data-hovercard-type="issue"
  1401. data-hovercard-url="/ckeditor/ckeditor5/issues/6159/hovercard"
  1402. href="https://github.com/ckeditor/ckeditor5/issues/6159"
  1403. id="issue_6159_link"
  1404. style="box-sizing: border-box; background-color: initial; color: rgb(36, 41, 46) !important; text-decoration: none !important; vertical-align: middle !important; font-size: 16px !important; font-weight: 600 !important;">Page
  1405. s<span style="color:#27ae60;">crolling when deleting the first or
  1406. last row of a t</span>able</a><span>&nbsp;</span><span
  1407. class="labels lh-default "
  1408. style="box-sizing: border-box; line-height: 1.5 !important; position: relative;"><a
  1409. class="d-inline-block IssueLabel"
  1410. href="https://github.com/ckeditor/ckeditor5/issues?q=is%3Aissue+is%3Aopen+label%3Adomain%3Aui%2Fux"
  1411. style="box-sizing: border-box; background-color: rgb(254, 242, 192); color: rgb(0, 0, 0); text-decoration: none; display: inline-block !important; height: 20px; padding: 0.15em 4px; font-size: 12px; font-weight: 600; line-height: 15px; border-radius: 2px; box-shadow: rgba(27, 31, 35, 0.12) 0px -1px 0px inset;"
  1412. title="domain:ui/ux">domain:ui/ux</a><span>&nbsp;</span><a
  1413. class="d-inline-block IssueLabel"
  1414. href="https://github.com/ckeditor/ckeditor5/issues?q=is%3Aissue+is%3Aopen+label%3Apackage%3Atable"
  1415. style="box-sizing: border-box; background-color: rgb(254, 242, 192); color: rgb(0, 0, 0); text-decoration: none; display: inline-block !important; height: 20px; padding: 0.15em 4px; font-size: 12px; font-weight: 600; line-height: 15px; border-radius: 2px; box-shadow: rgba(27, 31, 35, 0.12) 0px -1px 0px inset;"
  1416. title="package:table">package:table</a><span>&nbsp;</span><a
  1417. class="d-inline-block IssueLabel"
  1418. href="https://github.com/ckeditor/ckeditor5/issues?q=is%3Aissue+is%3Aopen+label%3Astatus%3Aconfirmed"
  1419. style="box-sizing: border-box; background-color: rgb(230, 230, 230); color: rgb(0, 0, 0); text-decoration: none; display: inline-block !important; height: 20px; padding: 0.15em 4px; font-size: 12px; font-weight: 600; line-height: 15px; border-radius: 2px; box-shadow: rgba(27, 31, 35, 0.12) 0px -1px 0px inset;"
  1420. title="status:confirmed">status:confirmed</a><span>&nbsp;</span><a
  1421. class="d-inline-block IssueLabel"
  1422. href="https://github.com/ckeditor/ckeditor5/issues?q=is%3Aissue+is%3Aopen+label%3Atype%3Abug"
  1423. style="box-sizing: border-box; background-color: rgb(221, 68, 68); color: rgb(0, 0, 0); text-decoration: none; display: inline-block !important; height: 20px; padding: 0.15em 4px; font-size: 12px; font-weight: 600; line-height: 15px; border-radius: 2px; box-shadow: rgba(27, 31, 35, 0.12) 0px -1px 0px inset;"
  1424. title="type:bug">type:bug</a></span>
  1425. <div class="mt-1 text-small text-gray"
  1426. style="box-sizing: border-box; color: rgb(88, 96, 105) !important; margin-top: 4px !important; font-size: 12px !important;">
  1427. <span class="opened-by" style="box-sizing: border-box;">#6159
  1428. opened<span>&nbsp;</span>
  1429. <relative-time class="no-wrap" datetime="2020-01-29T12:49:22Z"
  1430. style="box-sizing: border-box; white-space: nowrap !important;"
  1431. title="Jan 29, 2020, 1:49 PM GMT+1"> yesterday
  1432. </relative-time> <span>&nbsp;</span>by<span>&nbsp;</span><a
  1433. class="muted-link" data-hovercard-type="user"
  1434. data-hovercard-url="/users/heroicyang/hovercard"
  1435. data-octo-click="hovercard-link-click"
  1436. data-octo-dimensions="link_type:self"
  1437. href="https://github.com/ckeditor/ckeditor5/issues?q=is%3Aissue+is%3Aopen+author%3Aheroicyang"
  1438. style="box-sizing: border-box; background-color: initial; color: rgb(88, 96, 105) !important; text-decoration: none;"
  1439. title="Open issues created by heroicyang">heroicyang</a>
  1440. </span></div>
  1441. </div>
  1442. <div class="flex-shrink-0 col-3 pt-2 text-right pr-3 no-wrap d-grid grid-4-col grid-gap-2 "
  1443. style="box-sizing: border-box; width: 244.5px; flex-shrink: 0 !important; padding-top: 8px !important; padding-right: 16px !important; text-align: right !important; white-space: nowrap !important; display: grid; column-gap: 8px; grid-template-columns: repeat(4, 1fr); grid-template-areas: &quot;grid-col-1 grid-col-2 grid-col-3 grid-col-4&quot;;">
  1444. <div class="AvatarStack AvatarStack--right grid-col-1 "
  1445. style="box-sizing: border-box; position: relative; min-width: 26px; height: 20px; grid-area: grid-col-1 / grid-col-1 / grid-col-1 / grid-col-1;">
  1446. <div aria-label="Assigned to "
  1447. class="AvatarStack-body tooltipped tooltipped-sw tooltipped-multiline tooltipped-align-right-1 mt-1"
  1448. style="box-sizing: border-box; position: absolute; margin-top: 4px !important; display: flex; background: rgb(255, 255, 255); right: 0px; flex-direction: row-reverse;">
  1449. &nbsp;</div>
  1450. </div>
  1451. <span class="grid-col-4"
  1452. style="box-sizing: border-box; grid-area: grid-col-4 / grid-col-4 / grid-col-4 / grid-col-4;"><a
  1453. aria-label="1 comment" class="muted-link"
  1454. href="https://github.com/ckeditor/ckeditor5/issues/6159"
  1455. style="box-sizing: border-box; background-color: initial; color: rgb(88, 96, 105) !important; text-decoration: none;"><svg
  1456. aria-hidden="true"
  1457. class="octicon octicon-comment v-align-middle" height="16"
  1458. version="1.1" viewbox="0 0 16 16" width="16">
  1459. <path
  1460. d="M14 1H2c-.55 0-1 .45-1 1v8c0 .55.45 1 1 1h2v3.5L7.5 11H14c.55 0 1-.45 1-1V2c0-.55-.45-1-1-1zm0 9H7l-2 2v-2H2V2h12v8z"
  1461. fill-rule="evenodd"> </path>
  1462. </svg><span>&nbsp;</span><span class="text-small text-bold"
  1463. style="box-sizing: border-box; font-size: 12px !important; font-weight: 600 !important;">1</span></a></span>
  1464. </div>
  1465. </div>
  1466. </div>
  1467. <div aria-selected="false"
  1468. class="Box-row Box-row--focus-gray p-0 mt-0 js-navigation-item js-issue-row"
  1469. data-id="556769394" id="issue_6158"
  1470. style="box-sizing: border-box; padding: 0px !important; margin-top: 0px !important; list-style-type: none; border-top: 1px solid rgb(225, 228, 232);">
  1471. <div class="d-flex Box-row--drag-hide position-relative"
  1472. style="box-sizing: border-box; position: relative !important; display: flex !important;">
  1473. <div class="flex-shrink-0 pt-2 pl-3"
  1474. style="box-sizing: border-box; flex-shrink: 0 !important; padding-top: 8px !important; padding-left: 16px !important;">
  1475. <span aria-label="Open issue" class="tooltipped tooltipped-e"
  1476. style="box-sizing: border-box; position: relative;"><svg
  1477. aria-hidden="true" class="octicon octicon-issue-opened open"
  1478. height="16" version="1.1" viewbox="0 0 14 16" width="14">
  1479. <path
  1480. d="M7 2.3c3.14 0 5.7 2.56 5.7 5.7s-2.56 5.7-5.7 5.7A5.71 5.71 0 011.3 8c0-3.14 2.56-5.7 5.7-5.7zM7 1C3.14 1 0 4.14 0 8s3.14 7 7 7 7-3.14 7-7-3.14-7-7-7zm1 3H6v5h2V4zm0 6H6v2h2v-2z"
  1481. fill-rule="evenodd"> </path>
  1482. </svg></span></div>
  1483. <div class="flex-auto min-width-0 lh-condensed p-2 "
  1484. style="box-sizing: border-box; flex: 1 1 auto !important; min-width: 0px !important; padding: 8px !important; line-height: 1.25 !important;">
  1485. <a class="link-gray-dark v-align-middle no-underline h4 js-navigation-open"
  1486. data-hovercard-type="issue"
  1487. data-hovercard-url="/ckeditor/ckeditor5/issues/6158/hovercard"
  1488. href="https://github.com/ckeditor/ckeditor5/issues/6158"
  1489. id="issue_6158_link"
  1490. style="box-sizing: border-box; background-color: initial; color: rgb(36, 41, 46) !important; text-decoration: none !important; vertical-align: middle !important; font-size: 16px !important; font-weight: 600 !important;">Improve
  1491. Locale.t() to handle context and
  1492. plurals.</a><span>&nbsp;</span><span class="labels lh-default "
  1493. style="box-sizing: border-box; line-height: 1.5 !important; position: relative;"><a
  1494. class="d-inline-block IssueLabel"
  1495. href="https://github.com/ckeditor/ckeditor5/issues?q=is%3Aissue+is%3Aopen+label%3Adomain%3Aaccessibility"
  1496. style="box-sizing: border-box; background-color: rgb(254, 242, 192); color: rgb(0, 0, 0); text-decoration: none; display: inline-block !important; height: 20px; padding: 0.15em 4px; font-size: 12px; font-weight: 600; line-height: 15px; border-radius: 2px; box-shadow: rgba(27, 31, 35, 0.12) 0px -1px 0px inset;"
  1497. title="domain:accessibility">domain:accessibility</a><span>&nbsp;</span><a
  1498. class="d-inline-block IssueLabel"
  1499. href="https://github.com/ckeditor/ckeditor5/issues?q=is%3Aissue+is%3Aopen+label%3Adomain%3Adx"
  1500. style="box-sizing: border-box; background-color: rgb(254, 242, 192); color: rgb(0, 0, 0); text-decoration: none; display: inline-block !important; height: 20px; padding: 0.15em 4px; font-size: 12px; font-weight: 600; line-height: 15px; border-radius: 2px; box-shadow: rgba(27, 31, 35, 0.12) 0px -1px 0px inset;"
  1501. title="domain:dx">domain:dx</a><span>&nbsp;</span><a
  1502. class="d-inline-block IssueLabel"
  1503. href="https://github.com/ckeditor/ckeditor5/issues?q=is%3Aissue+is%3Aopen+label%3Apackage%3Autils"
  1504. style="box-sizing: border-box; background-color: rgb(254, 242, 192); color: rgb(0, 0, 0); text-decoration: none; display: inline-block !important; height: 20px; padding: 0.15em 4px; font-size: 12px; font-weight: 600; line-height: 15px; border-radius: 2px; box-shadow: rgba(27, 31, 35, 0.12) 0px -1px 0px inset;"
  1505. title="package:utils">package:utils</a><span>&nbsp;</span><a
  1506. class="d-inline-block IssueLabel"
  1507. href="https://github.com/ckeditor/ckeditor5/issues?q=is%3Aissue+is%3Aopen+label%3Atype%3Aenhancement"
  1508. style="box-sizing: border-box; background-color: rgb(132, 182, 235); color: rgb(0, 0, 0); text-decoration: none; display: inline-block !important; height: 20px; padding: 0.15em 4px; font-size: 12px; font-weight: 600; line-height: 15px; border-radius: 2px; box-shadow: rgba(27, 31, 35, 0.12) 0px -1px 0px inset;"
  1509. title="type:enhancement">type:enhancement</a></span>
  1510. <div class="mt-1 text-small text-gray"
  1511. style="box-sizing: border-box; color: rgb(88, 96, 105) !important; margin-top: 4px !important; font-size: 12px !important;">
  1512. <span class="opened-by" style="box-sizing: border-box;">#6158
  1513. opened<span>&nbsp;</span>
  1514. <relative-time class="no-wrap" datetime="2020-01-29T10:27:11Z"
  1515. style="box-sizing: border-box; white-space: nowrap !important;"
  1516. title="Jan 29, 2020, 11:27 AM GMT+1"> yesterday
  1517. </relative-time> <span>&nbsp;</span>by<span>&nbsp;</span><a
  1518. class="muted-link" data-hovercard-type="user"
  1519. data-hovercard-url="/users/phaux/hovercard"
  1520. data-octo-click="hovercard-link-click"
  1521. data-octo-dimensions="link_type:self"
  1522. href="https://github.com/ckeditor/ckeditor5/issues?q=is%3Aissue+is%3Aopen+author%3Aphaux"
  1523. style="box-sizing: border-box; background-color: initial; color: rgb(88, 96, 105) !important; text-decoration: none;"
  1524. title="Open issues created by phaux">phaux</a>
  1525. </span></div>
  1526. </div>
  1527. <div class="flex-shrink-0 col-3 pt-2 text-right pr-3 no-wrap d-grid grid-4-col grid-gap-2 "
  1528. style="box-sizing: border-box; width: 244.5px; flex-shrink: 0 !important; padding-top: 8px !important; padding-right: 16px !important; text-align: right !important; white-space: nowrap !important; display: grid; column-gap: 8px; grid-template-columns: repeat(4, 1fr); grid-template-areas: &quot;grid-col-1 grid-col-2 grid-col-3 grid-col-4&quot;;">
  1529. <div class="AvatarStack AvatarStack--right grid-col-1 "
  1530. style="box-sizing: border-box; position: relative; min-width: 26px; height: 20px; grid-area: grid-col-1 / grid-col-1 / grid-col-1 / grid-col-1;">
  1531. <div aria-label="Assigned to "
  1532. class="AvatarStack-body tooltipped tooltipped-sw tooltipped-multiline tooltipped-align-right-1 mt-1"
  1533. style="box-sizing: border-box; position: absolute; margin-top: 4px !important; display: flex; background: rgb(255, 255, 255); right: 0px; flex-direction: row-reverse;">
  1534. &nbsp;</div>
  1535. </div>
  1536. </div>
  1537. </div>
  1538. </div>
  1539. <div aria-selected="false"
  1540. class="Box-row Box-row--focus-gray p-0 mt-0 js-navigation-item js-issue-row"
  1541. data-id="556664030" id="issue_6156"
  1542. style="box-sizing: border-box; padding: 0px !important; margin-top: 0px !important; list-style-type: none; border-top: 1px solid rgb(225, 228, 232);">
  1543. <div class="d-flex Box-row--drag-hide position-relative"
  1544. style="box-sizing: border-box; position: relative !important; display: flex !important;">
  1545. <div class="flex-shrink-0 pt-2 pl-3"
  1546. style="box-sizing: border-box; flex-shrink: 0 !important; padding-top: 8px !important; padding-left: 16px !important;">
  1547. <span aria-label="Open issue" class="tooltipped tooltipped-e"
  1548. style="box-sizing: border-box; position: relative;"><svg
  1549. aria-hidden="true" class="octicon octicon-issue-opened open"
  1550. height="16" version="1.1" viewbox="0 0 14 16" width="14">
  1551. <path
  1552. d="M7 2.3c3.14 0 5.7 2.56 5.7 5.7s-2.56 5.7-5.7 5.7A5.71 5.71 0 011.3 8c0-3.14 2.56-5.7 5.7-5.7zM7 1C3.14 1 0 4.14 0 8s3.14 7 7 7 7-3.14 7-7-3.14-7-7-7zm1 3H6v5h2V4zm0 6H6v2h2v-2z"
  1553. fill-rule="evenodd"> </path>
  1554. </svg></span></div>
  1555. <div class="flex-auto min-width-0 lh-condensed p-2 "
  1556. style="box-sizing: border-box; flex: 1 1 auto !important; min-width: 0px !important; padding: 8px !important; line-height: 1.25 !important;">
  1557. <a class="link-gray-dark v-align-middle no-underline h4 js-navigation-open"
  1558. data-hovercard-type="issue"
  1559. data-hovercard-url="/ckeditor/ckeditor5/issues/6156/hovercard"
  1560. href="https://github.com/ckeditor/ckeditor5/issues/6156"
  1561. id="issue_6156_link"
  1562. style="box-sizing: border-box; background-color: initial; color: rgb(36, 41, 46) !important; text-decoration: none !important; vertical-align: middle !important; font-size: 16px !important; font-weight: 600 !important;">Ckeditor
  1563. 5 is not rendered the view<span>&nbsp;</span></a><span
  1564. class="labels lh-default "
  1565. style="box-sizing: border-box; line-height: 1.5 !important; position: relative;"><a
  1566. class="d-inline-block IssueLabel"
  1567. href="https://github.com/ckeditor/ckeditor5/issues?q=is%3Aissue+is%3Aopen+label%3Atype%3Abug"
  1568. style="box-sizing: border-box; background-color: rgb(221, 68, 68); color: rgb(0, 0, 0); text-decoration: none; display: inline-block !important; height: 20px; padding: 0.15em 4px; font-size: 12px; font-weight: 600; line-height: 15px; border-radius: 2px; box-shadow: rgba(27, 31, 35, 0.12) 0px -1px 0px inset;"
  1569. title="type:bug">type:bug</a></span>
  1570. <div class="mt-1 text-small text-gray"
  1571. style="box-sizing: border-box; color: rgb(88, 96, 105) !important; margin-top: 4px !important; font-size: 12px !important;">
  1572. <span class="opened-by" style="box-sizing: border-box;">#6156
  1573. opened<span>&nbsp;</span>
  1574. <relative-time class="no-wrap" datetime="2020-01-29T06:25:49Z"
  1575. style="box-sizing: border-box; white-space: nowrap !important;"
  1576. title="Jan 29, 2020, 7:25 AM GMT+1"> yesterday
  1577. </relative-time> <span>&nbsp;</span>by<span>&nbsp;</span><a
  1578. class="muted-link" data-hovercard-type="user"
  1579. data-hovercard-url="/users/lingamwin/hovercard"
  1580. data-octo-click="hovercard-link-click"
  1581. data-octo-dimensions="link_type:self"
  1582. href="https://github.com/ckeditor/ckeditor5/issues?q=is%3Aissue+is%3Aopen+author%3Alingamwin"
  1583. style="box-sizing: border-box; background-color: initial; color: rgb(88, 96, 105) !important; text-decoration: none;"
  1584. title="Open issues created by lingamwin">lingamwin</a>
  1585. </span></div>
  1586. </div>
  1587. <div class="flex-shrink-0 col-3 pt-2 text-right pr-3 no-wrap d-grid grid-4-col grid-gap-2 "
  1588. style="box-sizing: border-box; width: 244.5px; flex-shrink: 0 !important; padding-top: 8px !important; padding-right: 16px !important; text-align: right !important; white-space: nowrap !important; display: grid; column-gap: 8px; grid-template-columns: repeat(4, 1fr); grid-template-areas: &quot;grid-col-1 grid-col-2 grid-col-3 grid-col-4&quot;;">
  1589. <div class="AvatarStack AvatarStack--right grid-col-1 "
  1590. style="box-sizing: border-box; position: relative; min-width: 26px; height: 20px; grid-area: grid-col-1 / grid-col-1 / grid-col-1 / grid-col-1;">
  1591. <div aria-label="Assigned to "
  1592. class="AvatarStack-body tooltipped tooltipped-sw tooltipped-multiline tooltipped-align-right-1 mt-1"
  1593. style="box-sizing: border-box; position: absolute; margin-top: 4px !important; display: flex; background: rgb(255, 255, 255); right: 0px; flex-direction: row-reverse;">
  1594. &nbsp;</div>
  1595. </div>
  1596. </div>
  1597. </div>
  1598. </div>
  1599. <div aria-selected="false"
  1600. class="Box-row Box-row--focus-gray p-0 mt-0 js-navigation-item js-issue-row"
  1601. data-id="556662531" id="issue_6155"
  1602. style="box-sizing: border-box; padding: 0px !important; margin-top: 0px !important; list-style-type: none; border-top: 1px solid rgb(225, 228, 232);">
  1603. <div class="d-flex Box-row--drag-hide position-relative"
  1604. style="box-sizing: border-box; position: relative !important; display: flex !important;">
  1605. <div class="flex-shrink-0 pt-2 pl-3"
  1606. style="box-sizing: border-box; flex-shrink: 0 !important; padding-top: 8px !important; padding-left: 16px !important;">
  1607. <span aria-label="Open issue" class="tooltipped tooltipped-e"
  1608. style="box-sizing: border-box; position: relative;"><svg
  1609. aria-hidden="true" class="octicon octicon-issue-opened open"
  1610. height="16" version="1.1" viewbox="0 0 14 16" width="14">
  1611. <path
  1612. d="M7 2.3c3.14 0 5.7 2.56 5.7 5.7s-2.56 5.7-5.7 5.7A5.71 5.71 0 011.3 8c0-3.14 2.56-5.7 5.7-5.7zM7 1C3.14 1 0 4.14 0 8s3.14 7 7 7 7-3.14 7-7-3.14-7-7-7zm1 3H6v5h2V4zm0 6H6v2h2v-2z"
  1613. fill-rule="evenodd"> </path>
  1614. </svg></span></div>
  1615. <div class="flex-auto min-width-0 lh-condensed p-2 "
  1616. style="box-sizing: border-box; flex: 1 1 auto !important; min-width: 0px !important; padding: 8px !important; line-height: 1.25 !important;">
  1617. <a class="link-gray-dark v-align-middle no-underline h4 js-navigation-open"
  1618. data-hovercard-type="issue"
  1619. data-hovercard-url="/ckeditor/ckeditor5/issues/6155/hovercard"
  1620. href="https://github.com/ckeditor/ckeditor5/issues/6155"
  1621. id="issue_6155_link"
  1622. style="box-sizing: border-box; background-color: initial; color: rgb(36, 41, 46) !important; text-decoration: none !important; vertical-align: middle !important; font-size: 16px !important; font-weight: 600 !important;">Render
  1623. dynamic svg content into ckeditor<span>&nbsp;</span></a><span
  1624. class="labels lh-default "
  1625. style="box-sizing: border-box; line-height: 1.5 !important; position: relative;"><a
  1626. class="d-inline-block IssueLabel"
  1627. href="https://github.com/ckeditor/ckeditor5/issues?q=is%3Aissue+is%3Aopen+label%3Atype%3Afeature"
  1628. style="box-sizing: border-box; background-color: rgb(132, 182, 235); color: rgb(0, 0, 0); text-decoration: none; display: inline-block !important; height: 20px; padding: 0.15em 4px; font-size: 12px; font-weight: 600; line-height: 15px; border-radius: 2px; box-shadow: rgba(27, 31, 35, 0.12) 0px -1px 0px inset;"
  1629. title="type:feature">type:feature</a></span>
  1630. <div class="mt-1 text-small text-gray"
  1631. style="box-sizing: border-box; color: rgb(88, 96, 105) !important; margin-top: 4px !important; font-size: 12px !important;">
  1632. <span class="opened-by" style="box-sizing: border-box;">#6155
  1633. opened<span>&nbsp;</span>
  1634. <relative-time class="no-wrap" datetime="2020-01-29T06:20:46Z"
  1635. style="box-sizing: border-box; white-space: nowrap !important;"
  1636. title="Jan 29, 2020, 7:20 AM GMT+1"> yesterday
  1637. </relative-time> <span>&nbsp;</span>by<span>&nbsp;</span><a
  1638. class="muted-link" data-hovercard-type="user"
  1639. data-hovercard-url="/users/lingamwin/hovercard"
  1640. data-octo-click="hovercard-link-click"
  1641. data-octo-dimensions="link_type:self"
  1642. href="https://github.com/ckeditor/ckeditor5/issues?q=is%3Aissue+is%3Aopen+author%3Alingamwin"
  1643. style="box-sizing: border-box; background-color: initial; color: rgb(88, 96, 105) !important; text-decoration: none;"
  1644. title="Open issues created by lingamwin">lingamwin</a>
  1645. </span></div>
  1646. </div>
  1647. <div class="flex-shrink-0 col-3 pt-2 text-right pr-3 no-wrap d-grid grid-4-col grid-gap-2 "
  1648. style="box-sizing: border-box; width: 244.5px; flex-shrink: 0 !important; padding-top: 8px !important; padding-right: 16px !important; text-align: right !important; white-space: nowrap !important; display: grid; column-gap: 8px; grid-template-columns: repeat(4, 1fr); grid-template-areas: &quot;grid-col-1 grid-col-2 grid-col-3 grid-col-4&quot;;">
  1649. <div class="AvatarStack AvatarStack--right grid-col-1 "
  1650. style="box-sizing: border-box; position: relative; min-width: 26px; height: 20px; grid-area: grid-col-1 / grid-col-1 / grid-col-1 / grid-col-1;">
  1651. <div aria-label="Assigned to "
  1652. class="AvatarStack-body tooltipped tooltipped-sw tooltipped-multiline tooltipped-align-right-1 mt-1"
  1653. style="box-sizing: border-box; position: absolute; margin-top: 4px !important; display: flex; background: rgb(255, 255, 255); right: 0px; flex-direction: row-reverse;">
  1654. &nbsp;</div>
  1655. </div>
  1656. </div>
  1657. </div>
  1658. </div>
  1659. <div aria-selected="false"
  1660. class="Box-row Box-row--focus-gray p-0 mt-0 js-navigation-item js-issue-row"
  1661. data-id="556394709" id="issue_6154"
  1662. style="box-sizing: border-box; padding: 0px !important; margin-top: 0px !important; list-style-type: none; border-top: 1px solid rgb(225, 228, 232);">
  1663. <div class="d-flex Box-row--drag-hide position-relative"
  1664. style="box-sizing: border-box; position: relative !important; display: flex !important;">
  1665. <div class="flex-shrink-0 pt-2 pl-3"
  1666. style="box-sizing: border-box; flex-shrink: 0 !important; padding-top: 8px !important; padding-left: 16px !important;">
  1667. <span aria-label="Open issue" class="tooltipped tooltipped-e"
  1668. style="box-sizing: border-box; position: relative;"><svg
  1669. aria-hidden="true" class="octicon octicon-issue-opened open"
  1670. height="16" version="1.1" viewbox="0 0 14 16" width="14">
  1671. <path
  1672. d="M7 2.3c3.14 0 5.7 2.56 5.7 5.7s-2.56 5.7-5.7 5.7A5.71 5.71 0 011.3 8c0-3.14 2.56-5.7 5.7-5.7zM7 1C3.14 1 0 4.14 0 8s3.14 7 7 7 7-3.14 7-7-3.14-7-7-7zm1 3H6v5h2V4zm0 6H6v2h2v-2z"
  1673. fill-rule="evenodd"> </path>
  1674. </svg></span></div>
  1675. <div class="flex-auto min-width-0 lh-condensed p-2 "
  1676. style="box-sizing: border-box; flex: 1 1 auto !important; min-width: 0px !important; padding: 8px !important; line-height: 1.25 !important;">
  1677. <a class="link-gray-dark v-align-middle no-underline h4 js-navigation-open"
  1678. data-hovercard-type="issue"
  1679. data-hovercard-url="/ckeditor/ckeditor5/issues/6154/hovercard"
  1680. href="https://github.com/ckeditor/ckeditor5/issues/6154"
  1681. id="issue_6154_link"
  1682. style="box-sizing: border-box; background-color: initial; color: rgb(36, 41, 46) !important; text-decoration: none !important; vertical-align: middle !important; font-size: 16px !important; font-weight: 600 !important;">Allow
  1683. selection to be set on object elements</a><span>&nbsp;</span><span
  1684. class="labels lh-default "
  1685. style="box-sizing: border-box; line-height: 1.5 !important; position: relative;"><a
  1686. class="d-inline-block IssueLabel"
  1687. href="https://github.com/ckeditor/ckeditor5/issues?q=is%3Aissue+is%3Aopen+label%3Apackage%3Aengine"
  1688. style="box-sizing: border-box; background-color: rgb(254, 242, 192); color: rgb(0, 0, 0); text-decoration: none; display: inline-block !important; height: 20px; padding: 0.15em 4px; font-size: 12px; font-weight: 600; line-height: 15px; border-radius: 2px; box-shadow: rgba(27, 31, 35, 0.12) 0px -1px 0px inset;"
  1689. title="package:engine">package:engine</a><span>&nbsp;</span><a
  1690. class="d-inline-block IssueLabel"
  1691. href="https://github.com/ckeditor/ckeditor5/issues?q=is%3Aissue+is%3Aopen+label%3Atype%3Aenhancement"
  1692. style="box-sizing: border-box; background-color: rgb(132, 182, 235); color: rgb(0, 0, 0); text-decoration: none; display: inline-block !important; height: 20px; padding: 0.15em 4px; font-size: 12px; font-weight: 600; line-height: 15px; border-radius: 2px; box-shadow: rgba(27, 31, 35, 0.12) 0px -1px 0px inset;"
  1693. title="type:enhancement">type:enhancement</a></span>
  1694. <div class="mt-1 text-small text-gray"
  1695. style="box-sizing: border-box; color: rgb(88, 96, 105) !important; margin-top: 4px !important; font-size: 12px !important;">
  1696. <span class="opened-by" style="box-sizing: border-box;">#6154
  1697. opened<span>&nbsp;</span>
  1698. <relative-time class="no-wrap" datetime="2020-01-28T18:40:57Z"
  1699. style="box-sizing: border-box; white-space: nowrap !important;"
  1700. title="Jan 28, 2020, 7:40 PM GMT+1"> 2 days ago
  1701. </relative-time> <span>&nbsp;</span>by<span>&nbsp;</span><a
  1702. class="muted-link" data-hovercard-type="user"
  1703. data-hovercard-url="/users/jodator/hovercard"
  1704. data-octo-click="hovercard-link-click"
  1705. data-octo-dimensions="link_type:self"
  1706. href="https://github.com/ckeditor/ckeditor5/issues?q=is%3Aissue+is%3Aopen+author%3Ajodator"
  1707. style="box-sizing: border-box; background-color: initial; color: rgb(88, 96, 105) !important; text-decoration: none;"
  1708. title="Open issues created by jodator">jodator</a><span>&nbsp;</span>
  1709. </span><span
  1710. class="issue-meta-section css-truncate issue-milestone ml-2 "
  1711. style="box-sizing: border-box; margin-left: 8px !important; max-width: 240px;"><a
  1712. aria-label="iteration 29"
  1713. class="milestone-link muted-link css-truncate tooltipped tooltipped-n"
  1714. href="https://github.com/ckeditor/ckeditor5/milestone/32"
  1715. style="box-sizing: border-box; background-color: initial; color: rgb(88, 96, 105) !important; text-decoration: none; position: relative;"><svg
  1716. aria-label="Milestone" class="octicon octicon-milestone"
  1717. height="16" role="img" version="1.1" viewbox="0 0 14 16"
  1718. width="14">
  1719. <path
  1720. d="M8 2H6V0h2v2zm4 5H2c-.55 0-1-.45-1-1V4c0-.55.45-1 1-1h10l2 2-2 2zM8 4H6v2h2V4zM6 16h2V8H6v8z"
  1721. fill-rule="evenodd"> </path>
  1722. </svg><span>&nbsp;</span><span class="css-truncate-target"
  1723. style="box-sizing: border-box; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: inline-block; max-width: 100px; vertical-align: top;">iteration
  1724. 29</span></a></span></div>
  1725. </div>
  1726. <div class="flex-shrink-0 col-3 pt-2 text-right pr-3 no-wrap d-grid grid-4-col grid-gap-2 "
  1727. style="box-sizing: border-box; width: 244.5px; flex-shrink: 0 !important; padding-top: 8px !important; padding-right: 16px !important; text-align: right !important; white-space: nowrap !important; display: grid; column-gap: 8px; grid-template-columns: repeat(4, 1fr); grid-template-areas: &quot;grid-col-1 grid-col-2 grid-col-3 grid-col-4&quot;;">
  1728. <div class="AvatarStack AvatarStack--right grid-col-1 "
  1729. style="box-sizing: border-box; position: relative; min-width: 26px; height: 20px; grid-area: grid-col-1 / grid-col-1 / grid-col-1 / grid-col-1;">
  1730. <div aria-label="Assigned to jodator"
  1731. class="AvatarStack-body tooltipped tooltipped-sw tooltipped-multiline tooltipped-align-right-1 mt-1"
  1732. style="box-sizing: border-box; position: absolute; margin-top: 4px !important; display: flex; background: rgb(255, 255, 255); right: 0px; flex-direction: row-reverse;">
  1733. <a aria-label="jodator’s assigned issues" class="avatar"
  1734. href="https://github.com/ckeditor/ckeditor5/issues?q=assignee%3Ajodator+is%3Aopen"
  1735. style="box-sizing: initial; background-color: rgb(255, 255, 255); color: rgb(3, 102, 214); text-decoration: none; display: flex; overflow: hidden; line-height: 1; vertical-align: middle; border-radius: 2px; position: relative; z-index: 1; width: 20px; height: 20px; margin-right: 0px; border-right: 0px; transition: margin 0.1s ease-in-out 0s; margin-left: -11px; border-left: 1px solid rgb(255, 255, 255);"><img
  1736. alt="@jodator" class="from-avatar" height="20"
  1737. src="https://avatars1.githubusercontent.com/u/247363?s=40&amp;v=4"
  1738. style="box-sizing: border-box; border-style: none; border-radius: 2px;"
  1739. width="20" /></a></div>
  1740. </div>
  1741. </div>
  1742. </div>
  1743. </div>
  1744. <div aria-selected="false"
  1745. class="Box-row Box-row--focus-gray p-0 mt-0 js-navigation-item js-issue-row"
  1746. data-id="556244754" id="issue_6153"
  1747. style="box-sizing: border-box; padding: 0px !important; margin-top: 0px !important; list-style-type: none; border-top: 1px solid rgb(225, 228, 232);">
  1748. <div class="d-flex Box-row--drag-hide position-relative"
  1749. style="box-sizing: border-box; position: relative !important; display: flex !important;">
  1750. <div class="flex-shrink-0 pt-2 pl-3"
  1751. style="box-sizing: border-box; flex-shrink: 0 !important; padding-top: 8px !important; padding-left: 16px !important;">
  1752. <span aria-label="Open issue" class="tooltipped tooltipped-e"
  1753. style="box-sizing: border-box; position: relative;"><svg
  1754. aria-hidden="true" class="octicon octicon-issue-opened open"
  1755. height="16" version="1.1" viewbox="0 0 14 16" width="14">
  1756. <path
  1757. d="M7 2.3c3.14 0 5.7 2.56 5.7 5.7s-2.56 5.7-5.7 5.7A5.71 5.71 0 011.3 8c0-3.14 2.56-5.7 5.7-5.7zM7 1C3.14 1 0 4.14 0 8s3.14 7 7 7 7-3.14 7-7-3.14-7-7-7zm1 3H6v5h2V4zm0 6H6v2h2v-2z"
  1758. fill-rule="evenodd"> </path>
  1759. </svg></span></div>
  1760. <div class="flex-auto min-width-0 lh-condensed p-2 "
  1761. style="box-sizing: border-box; flex: 1 1 auto !important; min-width: 0px !important; padding: 8px !important; line-height: 1.25 !important;">
  1762. <a class="link-gray-dark v-align-middle no-underline h4 js-navigation-open"
  1763. data-hovercard-type="issue"
  1764. data-hovercard-url="/ckeditor/ckeditor5/issues/6153/hovercard"
  1765. href="https://github.com/ckeditor/ckeditor5/issues/6153"
  1766. id="issue_6153_link"
  1767. style="box-sizing: border-box; background-color: initial; color: rgb(36, 41, 46) !important; text-decoration: none !important; vertical-align: middle !important; font-size: 16px !important; font-weight: 600 !important;">CKEditor
  1768. 5 - Toolbar is not starting correctly with hidden items when using
  1769. 100% width</a><span>&nbsp;</span><span class="labels lh-default "
  1770. style="box-sizing: border-box; line-height: 1.5 !important; position: relative;"><a
  1771. class="d-inline-block IssueLabel"
  1772. href="https://github.com/ckeditor/ckeditor5/issues?q=is%3Aissue+is%3Aopen+label%3Apending%3Afeedback"
  1773. style="box-sizing: border-box; background-color: rgb(153, 153, 153); color: rgb(0, 0, 0); text-decoration: none; display: inline-block !important; height: 20px; padding: 0.15em 4px; font-size: 12px; font-weight: 600; line-height: 15px; border-radius: 2px; box-shadow: rgba(27, 31, 35, 0.12) 0px -1px 0px inset;"
  1774. title="pending:feedback">pending:feedback</a><span>&nbsp;</span><a
  1775. class="d-inline-block IssueLabel"
  1776. href="https://github.com/ckeditor/ckeditor5/issues?q=is%3Aissue+is%3Aopen+label%3Atype%3Abug"
  1777. style="box-sizing: border-box; background-color: rgb(221, 68, 68); color: rgb(0, 0, 0); text-decoration: none; display: inline-block !important; height: 20px; padding: 0.15em 4px; font-size: 12px; font-weight: 600; line-height: 15px; border-radius: 2px; box-shadow: rgba(27, 31, 35, 0.12) 0px -1px 0px inset;"
  1778. title="type:bug">type:bug</a></span>
  1779. <div class="mt-1 text-small text-gray"
  1780. style="box-sizing: border-box; color: rgb(88, 96, 105) !important; margin-top: 4px !important; font-size: 12px !important;">
  1781. <span class="opened-by" style="box-sizing: border-box;">#6153
  1782. opened<span>&nbsp;</span>
  1783. <relative-time class="no-wrap" datetime="2020-01-28T14:26:06Z"
  1784. style="box-sizing: border-box; white-space: nowrap !important;"
  1785. title="Jan 28, 2020, 3:26 PM GMT+1"> 2 days ago
  1786. </relative-time> <span>&nbsp;</span>by<span>&nbsp;</span><a
  1787. class="muted-link" data-hovercard-type="user"
  1788. data-hovercard-url="/users/aadmaquino/hovercard"
  1789. data-octo-click="hovercard-link-click"
  1790. data-octo-dimensions="link_type:self"
  1791. href="https://github.com/ckeditor/ckeditor5/issues?q=is%3Aissue+is%3Aopen+author%3Aaadmaquino"
  1792. style="box-sizing: border-box; background-color: initial; color: rgb(88, 96, 105) !important; text-decoration: none;"
  1793. title="Open issues created by aadmaquino">aadmaquino</a>
  1794. </span></div>
  1795. </div>
  1796. <div class="flex-shrink-0 col-3 pt-2 text-right pr-3 no-wrap d-grid grid-4-col grid-gap-2 "
  1797. style="box-sizing: border-box; width: 244.5px; flex-shrink: 0 !important; padding-top: 8px !important; padding-right: 16px !important; text-align: right !important; white-space: nowrap !important; display: grid; column-gap: 8px; grid-template-columns: repeat(4, 1fr); grid-template-areas: &quot;grid-col-1 grid-col-2 grid-col-3 grid-col-4&quot;;">
  1798. <div class="AvatarStack AvatarStack--right grid-col-1 "
  1799. style="box-sizing: border-box; position: relative; min-width: 26px; height: 20px; grid-area: grid-col-1 / grid-col-1 / grid-col-1 / grid-col-1;">
  1800. <div aria-label="Assigned to "
  1801. class="AvatarStack-body tooltipped tooltipped-sw tooltipped-multiline tooltipped-align-right-1 mt-1"
  1802. style="box-sizing: border-box; position: absolute; margin-top: 4px !important; display: flex; background: rgb(255, 255, 255); right: 0px; flex-direction: row-reverse;">
  1803. &nbsp;</div>
  1804. </div>
  1805. <span class="grid-col-4"
  1806. style="box-sizing: border-box; grid-area: grid-col-4 / grid-col-4 / grid-col-4 / grid-col-4;"><a
  1807. aria-label="3 comments" class="muted-link"
  1808. href="https://github.com/ckeditor/ckeditor5/issues/6153"
  1809. style="box-sizing: border-box; background-color: initial; color: rgb(88, 96, 105) !important; text-decoration: none;"><svg
  1810. aria-hidden="true"
  1811. class="octicon octicon-comment v-align-middle" height="16"
  1812. version="1.1" viewbox="0 0 16 16" width="16">
  1813. <path
  1814. d="M14 1H2c-.55 0-1 .45-1 1v8c0 .55.45 1 1 1h2v3.5L7.5 11H14c.55 0 1-.45 1-1V2c0-.55-.45-1-1-1zm0 9H7l-2 2v-2H2V2h12v8z"
  1815. fill-rule="evenodd"> </path>
  1816. </svg><span>&nbsp;</span><span class="text-small text-bold"
  1817. style="box-sizing: border-box; font-size: 12px !important; font-weight: 600 !important;">3</span></a></span>
  1818. </div>
  1819. </div>
  1820. </div>
  1821. <div class="Box-row Box-row--focus-gray p-0 mt-0 js-navigation-item js-issue-row"
  1822. data-id="556143005" id="issue_6151"
  1823. style="box-sizing: border-box; padding: 0px !important; margin-top: 0px !important; list-style-type: none; border-top: 1px solid rgb(225, 228, 232);">
  1824. <div class="d-flex Box-row--drag-hide position-relative"
  1825. style="box-sizing: border-box; position: relative !important; display: flex !important;">
  1826. <div class="flex-shrink-0 pt-2 pl-3"
  1827. style="box-sizing: border-box; flex-shrink: 0 !important; padding-top: 8px !important; padding-left: 16px !important;">
  1828. <span aria-label="Open issue" class="tooltipped tooltipped-e"
  1829. style="box-sizing: border-box; position: relative;"><svg
  1830. aria-hidden="true" class="octicon octicon-issue-opened open"
  1831. height="16" version="1.1" viewbox="0 0 14 16" width="14">
  1832. <path
  1833. d="M7 2.3c3.14 0 5.7 2.56 5.7 5.7s-2.56 5.7-5.7 5.7A5.71 5.71 0 011.3 8c0-3.14 2.56-5.7 5.7-5.7zM7 1C3.14 1 0 4.14 0 8s3.14 7 7 7 7-3.14 7-7-3.14-7-7-7zm1 3H6v5h2V4zm0 6H6v2h2v-2z"
  1834. fill-rule="evenodd"> </path>
  1835. </svg></span></div>
  1836. <div class="flex-auto min-width-0 lh-condensed p-2 "
  1837. style="box-sizing: border-box; flex: 1 1 auto !important; min-width: 0px !important; padding: 8px !important; line-height: 1.25 !important;">
  1838. <a class="link-gray-dark v-align-middle no-underline h4 js-navigation-open"
  1839. data-hovercard-type="issue"
  1840. data-hovercard-url="/ckeditor/ckeditor5/issues/6151/hovercard"
  1841. href="https://github.com/ckeditor/ckeditor5/issues/6151"
  1842. id="issue_6151_link"
  1843. style="box-sizing: border-box; background-color: initial; color: rgb(36, 41, 46) !important; text-decoration: none !important; vertical-align: middle !important; font-size: 16px !important; font-weight: 600 !important;">Test
  1844. how Table features work with and without
  1845. TableSelection</a><span>&nbsp;</span><span
  1846. class="labels lh-default "
  1847. style="box-sizing: border-box; line-height: 1.5 !important; position: relative;"><a
  1848. class="d-inline-block IssueLabel"
  1849. href="https://github.com/ckeditor/ckeditor5/issues?q=is%3Aissue+is%3Aopen+label%3Apackage%3Atable"
  1850. style="box-sizing: border-box; background-color: rgb(254, 242, 192); color: rgb(0, 0, 0); text-decoration: none; display: inline-block !important; height: 20px; padding: 0.15em 4px; font-size: 12px; font-weight: 600; line-height: 15px; border-radius: 2px; box-shadow: rgba(27, 31, 35, 0.12) 0px -1px 0px inset;"
  1851. title="package:table">package:table</a></span>
  1852. <div class="mt-1 text-small text-gray"
  1853. style="box-sizing: border-box; color: rgb(88, 96, 105) !important; margin-top: 4px !important; font-size: 12px !important;">
  1854. <span class="opened-by" style="box-sizing: border-box;">#6151
  1855. opened<span>&nbsp;</span>
  1856. <relative-time class="no-wrap" datetime="2020-01-28T11:19:46Z"
  1857. style="box-sizing: border-box; white-space: nowrap !important;"
  1858. title="Jan 28, 2020, 12:19 PM GMT+1"> 2 days ago
  1859. </relative-time> <span>&nbsp;</span>by<span>&nbsp;</span><a
  1860. class="muted-link" data-hovercard-type="user"
  1861. data-hovercard-url="/users/jodator/hovercard"
  1862. data-octo-click="hovercard-link-click"
  1863. data-octo-dimensions="link_type:self"
  1864. href="https://github.com/ckeditor/ckeditor5/issues?q=is%3Aissue+is%3Aopen+author%3Ajodator"
  1865. style="box-sizing: border-box; background-color: initial; color: rgb(88, 96, 105) !important; text-decoration: none;"
  1866. title="Open issues created by jodator">jodator</a><span>&nbsp;</span>
  1867. </span><span
  1868. class="issue-meta-section css-truncate issue-milestone ml-2 "
  1869. style="box-sizing: border-box; margin-left: 8px !important; max-width: 240px;"><a
  1870. aria-label="iteration 30"
  1871. class="milestone-link muted-link css-truncate tooltipped tooltipped-n"
  1872. href="https://github.com/ckeditor/ckeditor5/milestone/33"
  1873. style="box-sizing: border-box; background-color: initial; color: rgb(88, 96, 105) !important; text-decoration: none; position: relative;"><svg
  1874. aria-label="Milestone" class="octicon octicon-milestone"
  1875. height="16" role="img" version="1.1" viewbox="0 0 14 16"
  1876. width="14">
  1877. <path
  1878. d="M8 2H6V0h2v2zm4 5H2c-.55 0-1-.45-1-1V4c0-.55.45-1 1-1h10l2 2-2 2zM8 4H6v2h2V4zM6 16h2V8H6v8z"
  1879. fill-rule="evenodd"> </path>
  1880. </svg><span>&nbsp;</span><span class="css-truncate-target"
  1881. style="box-sizing: border-box; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: inline-block; max-width: 100px; vertical-align: top;">iteration
  1882. 30</span></a></span></div>
  1883. </div>
  1884. <div class="flex-shrink-0 col-3 pt-2 text-right pr-3 no-wrap d-grid grid-4-col grid-gap-2 "
  1885. style="box-sizing: border-box; width: 244.5px; flex-shrink: 0 !important; padding-top: 8px !important; padding-right: 16px !important; text-align: right !important; white-space: nowrap !important; display: grid; column-gap: 8px; grid-template-columns: repeat(4, 1fr); grid-template-areas: &quot;grid-col-1 grid-col-2 grid-col-3 grid-col-4&quot;;">
  1886. <div class="AvatarStack AvatarStack--right grid-col-1 "
  1887. style="box-sizing: border-box; position: relative; min-width: 26px; height: 20px; grid-area: grid-col-1 / grid-col-1 / grid-col-1 / grid-col-1;">
  1888. <div aria-label="Assigned to "
  1889. class="AvatarStack-body tooltipped tooltipped-sw tooltipped-multiline tooltipped-align-right-1 mt-1"
  1890. style="box-sizing: border-box; position: absolute; margin-top: 4px !important; display: flex; background: rgb(255, 255, 255); right: 0px; flex-direction: row-reverse;">
  1891. &nbsp;</div>
  1892. </div>
  1893. </div>
  1894. </div>
  1895. </div>
  1896. <div class="Box-row Box-row--focus-gray p-0 mt-0 js-navigation-item js-issue-row"
  1897. data-id="556139612" id="issue_6150"
  1898. style="box-sizing: border-box; padding: 0px !important; margin-top: 0px !important; list-style-type: none; border-top: 1px solid rgb(225, 228, 232);">
  1899. <div class="d-flex Box-row--drag-hide position-relative"
  1900. style="box-sizing: border-box; position: relative !important; display: flex !important;">
  1901. <div class="flex-shrink-0 pt-2 pl-3"
  1902. style="box-sizing: border-box; flex-shrink: 0 !important; padding-top: 8px !important; padding-left: 16px !important;">
  1903. <span aria-label="Open issue" class="tooltipped tooltipped-e"
  1904. style="box-sizing: border-box; position: relative;"><svg
  1905. aria-hidden="true" class="octicon octicon-issue-opened open"
  1906. height="16" version="1.1" viewbox="0 0 14 16" width="14">
  1907. <path
  1908. d="M7 2.3c3.14 0 5.7 2.56 5.7 5.7s-2.56 5.7-5.7 5.7A5.71 5.71 0 011.3 8c0-3.14 2.56-5.7 5.7-5.7zM7 1C3.14 1 0 4.14 0 8s3.14 7 7 7 7-3.14 7-7-3.14-7-7-7zm1 3H6v5h2V4zm0 6H6v2h2v-2z"
  1909. fill-rule="evenodd"> </path>
  1910. </svg></span></div>
  1911. <div class="flex-auto min-width-0 lh-condensed p-2 "
  1912. style="box-sizing: border-box; flex: 1 1 auto !important; min-width: 0px !important; padding: 8px !important; line-height: 1.25 !important;">
  1913. <a class="link-gray-dark v-align-middle no-underline h4 js-navigation-open"
  1914. data-hovercard-type="issue"
  1915. data-hovercard-url="/ckeditor/ckeditor5/issues/6150/hovercard"
  1916. href="https://github.com/ckeditor/ckeditor5/issues/6150"
  1917. id="issue_6150_link"
  1918. style="box-sizing: border-box; background-color: initial; color: rgb(36, 41, 46) !important; text-decoration: none !important; vertical-align: middle !important; font-size: 16px !important; font-weight: 600 !important;">Align
  1919. table styles UI to multi<span
  1920. style="background-color:#e74c3c;">-range
  1921. selection</span></a><span
  1922. style="background-color:#e74c3c;">&nbsp;</span><span
  1923. class="labels lh-default "
  1924. style="box-sizing: border-box; line-height: 1.5 !important; position: relative;"><a
  1925. class="d-inline-block IssueLabel"
  1926. href="https://github.com/ckeditor/ckeditor5/issues?q=is%3Aissue+is%3Aopen+label%3Adomain%3Aui%2Fux"
  1927. style="box-sizing: border-box; background-color: rgb(254, 242, 192); color: rgb(0, 0, 0); text-decoration: none; display: inline-block !important; height: 20px; padding: 0.15em 4px; font-size: 12px; font-weight: 600; line-height: 15px; border-radius: 2px; box-shadow: rgba(27, 31, 35, 0.12) 0px -1px 0px inset;"
  1928. title="domain:ui/ux"><span
  1929. style="background-color:#e74c3c;">domain:ui/ux</span></a><span
  1930. style="background-color:#e74c3c;">&nbsp;</span><a
  1931. class="d-inline-block IssueLabel"
  1932. href="https://github.com/ckeditor/ckeditor5/issues?q=is%3Aissue+is%3Aopen+label%3Apackage%3Atable"
  1933. style="box-sizing: border-box; background-color: rgb(254, 242, 192); color: rgb(0, 0, 0); text-decoration: none; display: inline-block !important; height: 20px; padding: 0.15em 4px; font-size: 12px; font-weight: 600; line-height: 15px; border-radius: 2px; box-shadow: rgba(27, 31, 35, 0.12) 0px -1px 0px inset;"
  1934. title="package:table"><span
  1935. style="background-color:#e74c3c;">package:table</span></a><span
  1936. style="background-color:#e74c3c;">&nbsp;</span><a
  1937. class="d-inline-block IssueLabel"
  1938. href="https://github.com/ckeditor/ckeditor5/issues?q=is%3Aissue+is%3Aopen+label%3Atype%3Aenhancement"
  1939. style="box-sizing: border-box; background-color: rgb(132, 182, 235); color: rgb(0, 0, 0); text-decoration: none; display: inline-block !important; height: 20px; padding: 0.15em 4px; font-size: 12px; font-weight: 600; line-height: 15px; border-radius: 2px; box-shadow: rgba(27, 31, 35, 0.12) 0px -1px 0px inset;"
  1940. title="type:enhancement"><span
  1941. style="background-color:#e74c3c;">type:enhancement</span></a></span>
  1942. <div class="mt-1 text-small text-gray"
  1943. style="box-sizing: border-box; color: rgb(88, 96, 105) !important; margin-top: 4px !important; font-size: 12px !important;">
  1944. <span class="opened-by" style="box-sizing: border-box;"><span
  1945. style="background-color:#e74c3c;">#6150 opened&nbsp; </span>
  1946. <relative-time class="no-wrap" datetime="2020-01-28T11:13:28Z"
  1947. style="box-sizing: border-box; white-space: nowrap !important;"
  1948. title="Jan 28, 2020, 12:13 PM GMT+1"><span
  1949. style="background-color:#e74c3c;"> 2 days ago</span>
  1950. </relative-time><span style="background-color:#e74c3c;">
  1951. &nbsp;by&nbsp;</span><a class="muted-link"
  1952. data-hovercard-type="user"
  1953. data-hovercard-url="/users/jodator/hovercard"
  1954. data-octo-click="hovercard-link-click"
  1955. data-octo-dimensions="link_type:self"
  1956. href="https://github.com/ckeditor/ckeditor5/issues?q=is%3Aissue+is%3Aopen+author%3Ajodator"
  1957. style="box-sizing: border-box; background-color: initial; color: rgb(88, 96, 105) !important; text-decoration: none;"
  1958. title="Open issues created by jodator"><span
  1959. style="background-color:#e74c3c;">jodator</span></a><span
  1960. style="background-color:#e74c3c;">&nbsp; </span>
  1961. </span><span
  1962. class="issue-meta-section css-truncate issue-milestone ml-2 "
  1963. style="box-sizing: border-box; margin-left: 8px !important; max-width: 240px;"><a
  1964. aria-label="iteration 30"
  1965. class="milestone-link muted-link css-truncate tooltipped tooltipped-n"
  1966. href="https://github.com/ckeditor/ckeditor5/milestone/33"
  1967. style="box-sizing: border-box; background-color: initial; color: rgb(88, 96, 105) !important; text-decoration: none; position: relative;"><svg
  1968. aria-label="Milestone" class="octicon octicon-milestone"
  1969. height="16" role="img" version="1.1" viewbox="0 0 14 16"
  1970. width="14"><span style="background-color:#e74c3c;">
  1971. </span>
  1972. <path
  1973. d="M8 2H6V0h2v2zm4 5H2c-.55 0-1-.45-1-1V4c0-.55.45-1 1-1h10l2 2-2 2zM8 4H6v2h2V4zM6 16h2V8H6v8z"
  1974. fill-rule="evenodd"><span
  1975. style="background-color:#e74c3c;"> </span>
  1976. </path><span style="background-color:#e74c3c;"> </span>
  1977. </svg><span
  1978. style="background-color:#e74c3c;">&nbsp;</span><span
  1979. class="css-truncate-target"
  1980. style="box-sizing: border-box; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: inline-block; max-width: 100px; vertical-align: top;"><span
  1981. style="background-color:#e74c3c;">iteration
  1982. 30</span></span></a></span></div>
  1983. </div>
  1984. <div class="flex-shrink-0 col-3 pt-2 text-right pr-3 no-wrap d-grid grid-4-col grid-gap-2 "
  1985. style="box-sizing: border-box; width: 244.5px; flex-shrink: 0 !important; padding-top: 8px !important; padding-right: 16px !important; text-align: right !important; white-space: nowrap !important; display: grid; column-gap: 8px; grid-template-columns: repeat(4, 1fr); grid-template-areas: &quot;grid-col-1 grid-col-2 grid-col-3 grid-col-4&quot;;">
  1986. <div class="AvatarStack AvatarStack--right grid-col-1 "
  1987. style="box-sizing: border-box; position: relative; min-width: 26px; height: 20px; grid-area: grid-col-1 / grid-col-1 / grid-col-1 / grid-col-1;">
  1988. <div aria-label="Assigned to "
  1989. class="AvatarStack-body tooltipped tooltipped-sw tooltipped-multiline tooltipped-align-right-1 mt-1"
  1990. style="box-sizing: border-box; position: absolute; margin-top: 4px !important; display: flex; background: rgb(255, 255, 255); right: 0px; flex-direction: row-reverse;">
  1991. &nbsp;</div>
  1992. </div>
  1993. </div>
  1994. </div>
  1995. </div>
  1996. <div class="Box-row Box-row--focus-gray p-0 mt-0 js-navigation-item js-issue-row"
  1997. data-id="555523498" id="issue_6146"
  1998. style="box-sizing: border-box; padding: 0px !important; margin-top: 0px !important; list-style-type: none; border-top: 1px solid rgb(225, 228, 232);">
  1999. <div class="d-flex Box-row--drag-hide position-relative"
  2000. style="box-sizing: border-box; position: relative !important; display: flex !important;">
  2001. <div class="flex-shrink-0 pt-2 pl-3"
  2002. style="box-sizing: border-box; flex-shrink: 0 !important; padding-top: 8px !important; padding-left: 16px !important;">
  2003. <span aria-label="Open issue" class="tooltipped tooltipped-e"
  2004. style="box-sizing: border-box; position: relative;"><svg
  2005. aria-hidden="true" class="octicon octicon-issue-opened open"
  2006. height="16" version="1.1" viewbox="0 0 14 16" width="14"><span
  2007. style="background-color:#e74c3c;"> </span>
  2008. <path
  2009. d="M7 2.3c3.14 0 5.7 2.56 5.7 5.7s-2.56 5.7-5.7 5.7A5.71 5.71 0 011.3 8c0-3.14 2.56-5.7 5.7-5.7zM7 1C3.14 1 0 4.14 0 8s3.14 7 7 7 7-3.14 7-7-3.14-7-7-7zm1 3H6v5h2V4zm0 6H6v2h2v-2z"
  2010. fill-rule="evenodd"><span style="background-color:#e74c3c;">
  2011. </span></path><span style="background-color:#e74c3c;">
  2012. </span>
  2013. </svg></span></div>
  2014. <div class="flex-auto min-width-0 lh-condensed p-2 "
  2015. style="box-sizing: border-box; flex: 1 1 auto !important; min-width: 0px !important; padding: 8px !important; line-height: 1.25 !important;">
  2016. <a class="link-gray-dark v-align-middle no-underline h4 js-navigation-open"
  2017. data-hovercard-type="issue"
  2018. data-hovercard-url="/ckeditor/ckeditor5/issues/6146/hovercard"
  2019. href="https://github.com/ckeditor/ckeditor5/issues/6146"
  2020. id="issue_6146_link"
  2021. style="box-sizing: border-box; background-color: initial; color: rgb(36, 41, 46) !important; text-decoration: none !important; vertical-align: middle !important; font-size: 16px !important; font-weight: 600 !important;"><span
  2022. style="background-color:#e74c3c;">CKEditor Toolbar - Line
  2023. break</span></a><span
  2024. style="background-color:#e74c3c;">&nbsp;</span><span
  2025. class="labels lh-default "
  2026. style="box-sizing: border-box; line-height: 1.5 !important; position: relative;"><a
  2027. class="d-inline-block IssueLabel"
  2028. href="https://github.com/ckeditor/ckeditor5/issues?q=is%3Aissue+is%3Aopen+label%3Atype%3Afeature"
  2029. style="box-sizing: border-box; background-color: rgb(132, 182, 235); color: rgb(0, 0, 0); text-decoration: none; display: inline-block !important; height: 20px; padding: 0.15em 4px; font-size: 12px; font-weight: 600; line-height: 15px; border-radius: 2px; box-shadow: rgba(27, 31, 35, 0.12) 0px -1px 0px inset;"
  2030. title="type:feature"><span
  2031. style="background-color:#e74c3c;">type:feature</span></a></span>
  2032. <div class="mt-1 text-small text-gray"
  2033. style="box-sizing: border-box; color: rgb(88, 96, 105) !important; margin-top: 4px !important; font-size: 12px !important;">
  2034. <span class="opened-by" style="box-sizing: border-box;"><span
  2035. style="background-color:#e74c3c;">#6146 opened&nbsp; </span>
  2036. <relative-time class="no-wrap" datetime="2020-01-27T11:49:00Z"
  2037. style="box-sizing: border-box; white-space: nowrap !important;"
  2038. title="Jan 27, 2020, 12:49 PM GMT+1"><span
  2039. style="background-color:#e74c3c;"> 3 days ago</span>
  2040. </relative-time><span style="background-color:#e74c3c;">
  2041. &nbsp;by&nbsp;</span><a class="muted-link"
  2042. data-hovercard-type="user"
  2043. data-hovercard-url="/users/thorleifjaocbsen/hovercard"
  2044. data-octo-click="hovercard-link-click"
  2045. data-octo-dimensions="link_type:self"
  2046. href="https://github.com/ckeditor/ckeditor5/issues?q=is%3Aissue+is%3Aopen+author%3Athorleifjaocbsen"
  2047. style="box-sizing: border-box; background-color: initial; color: rgb(88, 96, 105) !important; text-decoration: none;"
  2048. title="Open issues created by thorleifjaocbsen"><span
  2049. style="background-color:#e74c3c;">thorleifjaocbsen</span></a><span
  2050. style="background-color:#e74c3c;"> </span>
  2051. </span></div>
  2052. </div>
  2053. <div class="flex-shrink-0 col-3 pt-2 text-right pr-3 no-wrap d-grid grid-4-col grid-gap-2 "
  2054. style="box-sizing: border-box; width: 244.5px; flex-shrink: 0 !important; padding-top: 8px !important; padding-right: 16px !important; text-align: right !important; white-space: nowrap !important; display: grid; column-gap: 8px; grid-template-columns: repeat(4, 1fr); grid-template-areas: &quot;grid-col-1 grid-col-2 grid-col-3 grid-col-4&quot;;">
  2055. <div class="AvatarStack AvatarStack--right grid-col-1 "
  2056. style="box-sizing: border-box; position: relative; min-width: 26px; height: 20px; grid-area: grid-col-1 / grid-col-1 / grid-col-1 / grid-col-1;">
  2057. <div aria-label="Assigned to "
  2058. class="AvatarStack-body tooltipped tooltipped-sw tooltipped-multiline tooltipped-align-right-1 mt-1"
  2059. style="box-sizing: border-box; position: absolute; margin-top: 4px !important; display: flex; background: rgb(255, 255, 255); right: 0px; flex-direction: row-reverse;">
  2060. &nbsp;</div>
  2061. </div>
  2062. </div>
  2063. </div>
  2064. </div>
  2065. <div aria-selected="true"
  2066. class="Box-row Box-row--focus-gray p-0 mt-0 js-navigation-item js-issue-row navigation-focus"
  2067. data-id="555467929" id="issue_6145"
  2068. style="box-sizing: border-box; padding: 0px !important; margin-top: 0px !important; list-style-type: none; border-top: 1px solid rgb(225, 228, 232); background-color: rgb(246, 248, 250);">
  2069. <div class="d-flex Box-row--drag-hide position-relative"
  2070. style="box-sizing: border-box; position: relative !important; display: flex !important;">
  2071. <div class="flex-shrink-0 pt-2 pl-3"
  2072. style="box-sizing: border-box; flex-shrink: 0 !important; padding-top: 8px !important; padding-left: 16px !important;">
  2073. <span aria-label="Open issue" class="tooltipped tooltipped-e"
  2074. style="box-sizing: border-box; position: relative;"><svg
  2075. aria-hidden="true" class="octicon octicon-issue-opened open"
  2076. height="16" version="1.1" viewbox="0 0 14 16" width="14"><span
  2077. style="background-color:#e74c3c;"> </span>
  2078. <path
  2079. d="M7 2.3c3.14 0 5.7 2.56 5.7 5.7s-2.56 5.7-5.7 5.7A5.71 5.71 0 011.3 8c0-3.14 2.56-5.7 5.7-5.7zM7 1C3.14 1 0 4.14 0 8s3.14 7 7 7 7-3.14 7-7-3.14-7-7-7zm1 3H6v5h2V4zm0 6H6v2h2v-2z"
  2080. fill-rule="evenodd"><span style="background-color:#e74c3c;">
  2081. </span></path><span style="background-color:#e74c3c;">
  2082. </span>
  2083. </svg></span></div>
  2084. <div class="flex-auto min-width-0 lh-condensed p-2 "
  2085. style="box-sizing: border-box; flex: 1 1 auto !important; min-width: 0px !important; padding: 8px !important; line-height: 1.25 !important;">
  2086. <a class="link-gray-dark v-align-middle no-underline h4 js-navigation-open"
  2087. data-hovercard-type="issue"
  2088. data-hovercard-url="/ckeditor/ckeditor5/issues/6145/hovercard"
  2089. href="https://github.com/ckeditor/ckeditor5/issues/6145"
  2090. id="issue_6145_link"
  2091. style="box-sizing: border-box; background-color: initial; color: rgb(36, 41, 46) !important; text-decoration: none !important; vertical-align: middle !important; font-size: 16px !important; font-weight: 600 !important;"><span
  2092. style="background-color:#e74c3c;">Make the getResizeObserver
  2093. re-use a single observer instance for performance
  2094. reasons</span></a><span
  2095. style="background-color:#e74c3c;">&nbsp;</span><span
  2096. class="labels lh-default "
  2097. style="box-sizing: border-box; line-height: 1.5 !important; position: relative;"><a
  2098. class="d-inline-block IssueLabel"
  2099. href="https://github.com/ckeditor/ckeditor5/issues?q=is%3Aissue+is%3Aopen+label%3Adomain%3Aui%2Fux"
  2100. style="box-sizing: border-box; background-color: rgb(254, 242, 192); color: rgb(0, 0, 0); text-decoration: none; display: inline-block !important; height: 20px; padding: 0.15em 4px; font-size: 12px; font-weight: 600; line-height: 15px; border-radius: 2px; box-shadow: rgba(27, 31, 35, 0.12) 0px -1px 0px inset;"
  2101. title="domain:ui/ux"><span
  2102. style="background-color:#e74c3c;">domain:ui/ux</span></a><span
  2103. style="background-color:#e74c3c;">&nbsp;</span><a
  2104. class="d-inline-block IssueLabel"
  2105. href="https://github.com/ckeditor/ckeditor5/issues?q=is%3Aissue+is%3Aopen+label%3Apackage%3Autils"
  2106. style="box-sizing: border-box; background-color: rgb(254, 242, 192); color: rgb(0, 0, 0); text-decoration: none; display: inline-block !important; height: 20px; padding: 0.15em 4px; font-size: 12px; font-weight: 600; line-height: 15px; border-radius: 2px; box-shadow: rgba(27, 31, 35, 0.12) 0px -1px 0px inset;"
  2107. title="package:utils"><span
  2108. style="background-color:#e74c3c;">package:utils</span></a><span
  2109. style="background-color:#e74c3c;">&nbsp;</span><a
  2110. class="d-inline-block IssueLabel"
  2111. href="https://github.com/ckeditor/ckeditor5/issues?q=is%3Aissue+is%3Aopen+label%3Atype%3Aperformance"
  2112. style="box-sizing: border-box; background-color: rgb(132, 182, 235); color: rgb(0, 0, 0); text-decoration: none; display: inline-block !important; height: 20px; padding: 0.15em 4px; font-size: 12px; font-weight: 600; line-height: 15px; border-radius: 2px; box-shadow: rgba(27, 31, 35, 0.12) 0px -1px 0px inset;"
  2113. title="type:performance"><span
  2114. style="background-color:#e74c3c;">type:performan</span>ce</a></span>
  2115. <div class="mt-1 text-small text-gray"
  2116. style="box-sizing: border-box; color: rgb(88, 96, 105) !important; margin-top: 4px !important; font-size: 12px !important;">
  2117. <span class="opened-by" style="box-sizing: border-box;">#6145
  2118. opened<span>&nbsp;</span>
  2119. <relative-time class="no-wrap" datetime="2020-01-27T10:01:21Z"
  2120. style="box-sizing: border-box; white-space: nowrap !important;"
  2121. title="Jan 27, 2020, 11:01 AM GMT+1"> 3 days ago
  2122. </relative-time> <span>&nbsp;</span>by<span>&nbsp;</span><a
  2123. class="muted-link" data-hovercard-type="user"
  2124. data-hovercard-url="/users/oleq/hovercard"
  2125. data-octo-click="hovercard-link-click"
  2126. data-octo-dimensions="link_type:self"
  2127. href="https://github.com/ckeditor/ckeditor5/issues?q=is%3Aissue+is%3Aopen+author%3Aoleq"
  2128. style="box-sizing: border-box; background-color: initial; color: rgb(88, 96, 105) !important; text-decoration: none;"
  2129. title="Open issues created by oleq">oleq</a><span>&nbsp;</span>
  2130. </span><span
  2131. class="issue-meta-section css-truncate issue-milestone ml-2 "
  2132. style="box-sizing: border-box; margin-left: 8px !important; max-width: 240px;"><a
  2133. aria-label="iteration 29"
  2134. class="milestone-link muted-link css-truncate tooltipped tooltipped-n"
  2135. href="https://github.com/ckeditor/ckeditor5/milestone/32"
  2136. style="box-sizing: border-box; background-color: initial; color: rgb(88, 96, 105) !important; text-decoration: none; position: relative;"><svg
  2137. aria-label="Milestone" class="octicon octicon-milestone"
  2138. height="16" role="img" version="1.1" viewbox="0 0 14 16"
  2139. width="14">
  2140. <path
  2141. d="M8 2H6V0h2v2zm4 5H2c-.55 0-1-.45-1-1V4c0-.55.45-1 1-1h10l2 2-2 2zM8 4H6v2h2V4zM6 16h2V8H6v8z"
  2142. fill-rule="evenodd"> </path>
  2143. </svg><span>&nbsp;</span><span class="css-truncate-target"
  2144. style="box-sizing: border-box; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: inline-block; max-width: 100px; vertical-align: top;">iteration
  2145. 29</span></a></span></div>
  2146. </div>
  2147. <div class="flex-shrink-0 col-3 pt-2 text-right pr-3 no-wrap d-grid grid-4-col grid-gap-2 "
  2148. style="box-sizing: border-box; width: 244.5px; flex-shrink: 0 !important; padding-top: 8px !important; padding-right: 16px !important; text-align: right !important; white-space: nowrap !important; display: grid; column-gap: 8px; grid-template-columns: repeat(4, 1fr); grid-template-areas: &quot;grid-col-1 grid-col-2 grid-col-3 grid-col-4&quot;;">
  2149. <div class="AvatarStack AvatarStack--right grid-col-1 "
  2150. style="box-sizing: border-box; position: relative; min-width: 26px; height: 20px; grid-area: grid-col-1 / grid-col-1 / grid-col-1 / grid-col-1;">
  2151. <div aria-label="Assigned to "
  2152. class="AvatarStack-body tooltipped tooltipped-sw tooltipped-multiline tooltipped-align-right-1 mt-1"
  2153. style="box-sizing: border-box; position: absolute; margin-top: 4px !important; display: flex; background: rgb(246, 251, 255); right: 0px; flex-direction: row-reverse;">
  2154. &nbsp;</div>
  2155. </div>
  2156. <span class="grid-col-4"
  2157. style="box-sizing: border-box; grid-area: grid-col-4 / grid-col-4 / grid-col-4 / grid-col-4;"><a
  2158. aria-label="2 comments" class="muted-link"
  2159. href="https://github.com/ckeditor/ckeditor5/issues/6145"
  2160. style="box-sizing: border-box; background-color: initial; color: rgb(88, 96, 105) !important; text-decoration: none;"><svg
  2161. aria-hidden="true"
  2162. class="octicon octicon-comment v-align-middle" height="16"
  2163. version="1.1" viewbox="0 0 16 16" width="16">
  2164. <path
  2165. d="M14 1H2c-.55 0-1 .45-1 1v8c0 .55.45 1 1 1h2v3.5L7.5 11H14c.55 0 1-.45 1-1V2c0-.55-.45-1-1-1zm0 9H7l-2 2v-2H2V2h12v8z"
  2166. fill-rule="evenodd"> </path>
  2167. </svg><span>&nbsp;</span><span class="text-small text-bold"
  2168. style="box-sizing: border-box; font-size: 12px !important; font-weight: 600 !important;">2</span></a></span>
  2169. </div>
  2170. </div>
  2171. </div>
  2172. <div class="Box-row Box-row--focus-gray p-0 mt-0 js-navigation-item js-issue-row"
  2173. data-id="555236721" id="issue_6142"
  2174. style="box-sizing: border-box; padding: 0px !important; margin-top: 0px !important; list-style-type: none; border-top: 1px solid rgb(225, 228, 232);">
  2175. <div class="d-flex Box-row--drag-hide position-relative"
  2176. style="box-sizing: border-box; position: relative !important; display: flex !important;">
  2177. <div class="flex-shrink-0 pt-2 pl-3"
  2178. style="box-sizing: border-box; flex-shrink: 0 !important; padding-top: 8px !important; padding-left: 16px !important;">
  2179. <span aria-label="Open issue" class="tooltipped tooltipped-e"
  2180. style="box-sizing: border-box; position: relative;"><svg
  2181. aria-hidden="true" class="octicon octicon-issue-opened open"
  2182. height="16" version="1.1" viewbox="0 0 14 16" width="14">
  2183. <path
  2184. d="M7 2.3c3.14 0 5.7 2.56 5.7 5.7s-2.56 5.7-5.7 5.7A5.71 5.71 0 011.3 8c0-3.14 2.56-5.7 5.7-5.7zM7 1C3.14 1 0 4.14 0 8s3.14 7 7 7 7-3.14 7-7-3.14-7-7-7zm1 3H6v5h2V4zm0 6H6v2h2v-2z"
  2185. fill-rule="evenodd"> </path>
  2186. </svg></span></div>
  2187. <div class="flex-auto min-width-0 lh-condensed p-2 "
  2188. style="box-sizing: border-box; flex: 1 1 auto !important; min-width: 0px !important; padding: 8px !important; line-height: 1.25 !important;">
  2189. <a class="link-gray-dark v-align-middle no-underline h4 js-navigation-open"
  2190. data-hovercard-type="issue"
  2191. data-hovercard-url="/ckeditor/ckeditor5/issues/6142/hovercard"
  2192. href="https://github.com/ckeditor/ckeditor5/issues/6142"
  2193. id="issue_6142_link"
  2194. style="box-sizing: border-box; background-color: initial; color: rgb(36, 41, 46) !important; text-decoration: none !important; vertical-align: middle !important; font-size: 16px !important; font-weight: 600 !important;">Custom
  2195. image uploader with URL</a><span>&nbsp;</span><span
  2196. class="labels lh-default "
  2197. style="box-sizing: border-box; line-height: 1.5 !important; position: relative;"><a
  2198. class="d-inline-block IssueLabel"
  2199. href="https://github.com/ckeditor/ckeditor5/issues?q=is%3Aissue+is%3Aopen+label%3Astatus%3Aconfirmed"
  2200. style="box-sizing: border-box; background-color: rgb(230, 230, 230); color: rgb(0, 0, 0); text-decoration: none; display: inline-block !important; height: 20px; padding: 0.15em 4px; font-size: 12px; font-weight: 600; line-height: 15px; border-radius: 2px; box-shadow: rgba(27, 31, 35, 0.12) 0px -1px 0px inset;"
  2201. title="status:confirmed">status:confirmed</a><span>&nbsp;</span><a
  2202. class="d-inline-block IssueLabel"
  2203. href="https://github.com/ckeditor/ckeditor5/issues?q=is%3Aissue+is%3Aopen+label%3Atype%3Afeature"
  2204. style="box-sizing: border-box; background-color: rgb(132, 182, 235); color: rgb(0, 0, 0); text-decoration: none; display: inline-block !important; height: 20px; padding: 0.15em 4px; font-size: 12px; font-weight: 600; line-height: 15px; border-radius: 2px; box-shadow: rgba(27, 31, 35, 0.12) 0px -1px 0px inset;"
  2205. title="type:feature">type:feature</a></span>
  2206. <div class="mt-1 text-small text-gray"
  2207. style="box-sizing: border-box; color: rgb(88, 96, 105) !important; margin-top: 4px !important; font-size: 12px !important;">
  2208. <span class="opened-by" style="box-sizing: border-box;">#6142
  2209. opened<span>&nbsp;</span>
  2210. <relative-time class="no-wrap" datetime="2020-01-26T14:32:48Z"
  2211. style="box-sizing: border-box; white-space: nowrap !important;"
  2212. title="Jan 26, 2020, 3:32 PM GMT+1"> 4 days ago
  2213. </relative-time> <span>&nbsp;</span>by<span>&nbsp;</span><a
  2214. class="muted-link" data-hovercard-type="user"
  2215. data-hovercard-url="/users/ayaniv/hovercard"
  2216. data-octo-click="hovercard-link-click"
  2217. data-octo-dimensions="link_type:self"
  2218. href="https://github.com/ckeditor/ckeditor5/issues?q=is%3Aissue+is%3Aopen+author%3Aayaniv"
  2219. style="box-sizing: border-box; background-color: initial; color: rgb(88, 96, 105) !important; text-decoration: none;"
  2220. title="Open issues created by ayaniv">ayaniv</a><span>&nbsp;</span>
  2221. </span><span
  2222. class="issue-meta-section css-truncate issue-milestone ml-2 "
  2223. style="box-sizing: border-box; margin-left: 8px !important; max-width: 240px;"><a
  2224. aria-label="backlog"
  2225. class="milestone-link muted-link css-truncate tooltipped tooltipped-n"
  2226. href="https://github.com/ckeditor/ckeditor5/milestone/15"
  2227. style="box-sizing: border-box; background-color: initial; color: rgb(88, 96, 105) !important; text-decoration: none; position: relative;"><svg
  2228. aria-label="Milestone" class="octicon octicon-milestone"
  2229. height="16" role="img" version="1.1" viewbox="0 0 14 16"
  2230. width="14">
  2231. <path
  2232. d="M8 2H6V0h2v2zm4 5H2c-.55 0-1-.45-1-1V4c0-.55.45-1 1-1h10l2 2-2 2zM8 4H6v2h2V4zM6 16h2V8H6v8z"
  2233. fill-rule="evenodd"> </path>
  2234. </svg><span>&nbsp;</span><span class="css-truncate-target"
  2235. style="box-sizing: border-box; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: inline-block; max-width: 100px; vertical-align: top;">backlog</span></a></span>
  2236. </div>
  2237. </div>
  2238. <div class="flex-shrink-0 col-3 pt-2 text-right pr-3 no-wrap d-grid grid-4-col grid-gap-2 "
  2239. style="box-sizing: border-box; width: 244.5px; flex-shrink: 0 !important; padding-top: 8px !important; padding-right: 16px !important; text-align: right !important; white-space: nowrap !important; display: grid; column-gap: 8px; grid-template-columns: repeat(4, 1fr); grid-template-areas: &quot;grid-col-1 grid-col-2 grid-col-3 grid-col-4&quot;;">
  2240. <div class="AvatarStack AvatarStack--right grid-col-1 "
  2241. style="box-sizing: border-box; position: relative; min-width: 26px; height: 20px; grid-area: grid-col-1 / grid-col-1 / grid-col-1 / grid-col-1;">
  2242. <div aria-label="Assigned to "
  2243. class="AvatarStack-body tooltipped tooltipped-sw tooltipped-multiline tooltipped-align-right-1 mt-1"
  2244. style="box-sizing: border-box; position: absolute; margin-top: 4px !important; display: flex; background: rgb(255, 255, 255); right: 0px; flex-direction: row-reverse;">
  2245. &nbsp;</div>
  2246. </div>
  2247. <span class="grid-col-4"
  2248. style="box-sizing: border-box; grid-area: grid-col-4 / grid-col-4 / grid-col-4 / grid-col-4;"><a
  2249. aria-label="3 comments" class="muted-link"
  2250. href="https://github.com/ckeditor/ckeditor5/issues/6142"
  2251. style="box-sizing: border-box; background-color: initial; color: rgb(88, 96, 105) !important; text-decoration: none;"><svg
  2252. aria-hidden="true"
  2253. class="octicon octicon-comment v-align-middle" height="16"
  2254. version="1.1" viewbox="0 0 16 16" width="16">
  2255. <path
  2256. d="M14 1H2c-.55 0-1 .45-1 1v8c0 .55.45 1 1 1h2v3.5L7.5 11H14c.55 0 1-.45 1-1V2c0-.55-.45-1-1-1zm0 9H7l-2 2v-2H2V2h12v8z"
  2257. fill-rule="evenodd"> </path>
  2258. </svg><span>&nbsp;</span><span class="text-small text-bold"
  2259. style="box-sizing: border-box; font-size: 12px !important; font-weight: 600 !important;">3</span></a></span>
  2260. </div>
  2261. </div>
  2262. </div>
  2263. <div class="Box-row Box-row--focus-gray p-0 mt-0 js-navigation-item js-issue-row"
  2264. data-id="555236082" id="issue_6141"
  2265. style="box-sizing: border-box; padding: 0px !important; margin-top: 0px !important; list-style-type: none; border-top: 1px solid rgb(225, 228, 232);">
  2266. <div class="d-flex Box-row--drag-hide position-relative"
  2267. style="box-sizing: border-box; position: relative !important; display: flex !important;">
  2268. <div class="flex-shrink-0 pt-2 pl-3"
  2269. style="box-sizing: border-box; flex-shrink: 0 !important; padding-top: 8px !important; padding-left: 16px !important;">
  2270. <span aria-label="Open issue" class="tooltipped tooltipped-e"
  2271. style="box-sizing: border-box; position: relative;"><svg
  2272. aria-hidden="true" class="octicon octicon-issue-opened open"
  2273. height="16" version="1.1" viewbox="0 0 14 16" width="14">
  2274. <path
  2275. d="M7 2.3c3.14 0 5.7 2.56 5.7 5.7s-2.56 5.7-5.7 5.7A5.71 5.71 0 011.3 8c0-3.14 2.56-5.7 5.7-5.7zM7 1C3.14 1 0 4.14 0 8s3.14 7 7 7 7-3.14 7-7-3.14-7-7-7zm1 3H6v5h2V4zm0 6H6v2h2v-2z"
  2276. fill-rule="evenodd"> </path>
  2277. </svg></span></div>
  2278. <div class="flex-auto min-width-0 lh-condensed p-2 "
  2279. style="box-sizing: border-box; flex: 1 1 auto !important; min-width: 0px !important; padding: 8px !important; line-height: 1.25 !important;">
  2280. <a class="link-gray-dark v-align-middle no-underline h4 js-navigation-open"
  2281. data-hovercard-type="issue"
  2282. data-hovercard-url="/ckeditor/ckeditor5/issues/6141/hovercard"
  2283. href="https://github.com/ckeditor/ckeditor5/issues/6141"
  2284. id="issue_6141_link"
  2285. style="box-sizing: border-box; background-color: initial; color: rgb(36, 41, 46) !important; text-decoration: none !important; vertical-align: middle !important; font-size: 16px !important; font-weight: 600 !important;">Toolbar
  2286. isEnabled event</a><span>&nbsp;</span><span
  2287. class="labels lh-default "
  2288. style="box-sizing: border-box; line-height: 1.5 !important; position: relative;"><a
  2289. class="d-inline-block IssueLabel"
  2290. href="https://github.com/ckeditor/ckeditor5/issues?q=is%3Aissue+is%3Aopen+label%3Atype%3Afeature"
  2291. style="box-sizing: border-box; background-color: rgb(132, 182, 235); color: rgb(0, 0, 0); text-decoration: none; display: inline-block !important; height: 20px; padding: 0.15em 4px; font-size: 12px; font-weight: 600; line-height: 15px; border-radius: 2px; box-shadow: rgba(27, 31, 35, 0.12) 0px -1px 0px inset;"
  2292. title="type:feature">type:feature</a><span>&nbsp;</span><a
  2293. class="d-inline-block IssueLabel"
  2294. href="https://github.com/ckeditor/ckeditor5/issues?q=is%3Aissue+is%3Aopen+label%3Atype%3Aquestion"
  2295. style="box-sizing: border-box; background-color: rgb(132, 182, 235); color: rgb(0, 0, 0); text-decoration: none; display: inline-block !important; height: 20px; padding: 0.15em 4px; font-size: 12px; font-weight: 600; line-height: 15px; border-radius: 2px; box-shadow: rgba(27, 31, 35, 0.12) 0px -1px 0px inset;"
  2296. title="type:question">type:question</a></span>
  2297. <div class="mt-1 text-small text-gray"
  2298. style="box-sizing: border-box; color: rgb(88, 96, 105) !important; margin-top: 4px !important; font-size: 12px !important;">
  2299. <span class="opened-by" style="box-sizing: border-box;">#6141
  2300. opened<span>&nbsp;</span>
  2301. <relative-time class="no-wrap" datetime="2020-01-26T14:27:41Z"
  2302. style="box-sizing: border-box; white-space: nowrap !important;"
  2303. title="Jan 26, 2020, 3:27 PM GMT+1"> 4 days ago
  2304. </relative-time> <span>&nbsp;</span>by<span>&nbsp;</span><a
  2305. class="muted-link" data-hovercard-type="user"
  2306. data-hovercard-url="/users/ayaniv/hovercard"
  2307. data-octo-click="hovercard-link-click"
  2308. data-octo-dimensions="link_type:self"
  2309. href="https://github.com/ckeditor/ckeditor5/issues?q=is%3Aissue+is%3Aopen+author%3Aayaniv"
  2310. style="box-sizing: border-box; background-color: initial; color: rgb(88, 96, 105) !important; text-decoration: none;"
  2311. title="Open issues created by ayaniv">ayaniv</a><span>&nbsp;</span>
  2312. </span><span
  2313. class="issue-meta-section css-truncate issue-milestone ml-2 "
  2314. style="box-sizing: border-box; margin-left: 8px !important; max-width: 240px;"><a
  2315. aria-label="backlog"
  2316. class="milestone-link muted-link css-truncate tooltipped tooltipped-n"
  2317. href="https://github.com/ckeditor/ckeditor5/milestone/15"
  2318. style="box-sizing: border-box; background-color: initial; color: rgb(88, 96, 105) !important; text-decoration: none; position: relative;"><svg
  2319. aria-label="Milestone" class="octicon octicon-milestone"
  2320. height="16" role="img" version="1.1" viewbox="0 0 14 16"
  2321. width="14">
  2322. <path
  2323. d="M8 2H6V0h2v2zm4 5H2c-.55 0-1-.45-1-1V4c0-.55.45-1 1-1h10l2 2-2 2zM8 4H6v2h2V4zM6 16h2V8H6v8z"
  2324. fill-rule="evenodd"> </path>
  2325. </svg><span>&nbsp;</span><span class="css-truncate-target"
  2326. style="box-sizing: border-box; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: inline-block; max-width: 100px; vertical-align: top;">backlog</span></a></span>
  2327. </div>
  2328. </div>
  2329. <div class="flex-shrink-0 col-3 pt-2 text-right pr-3 no-wrap d-grid grid-4-col grid-gap-2 "
  2330. style="box-sizing: border-box; width: 244.5px; flex-shrink: 0 !important; padding-top: 8px !important; padding-right: 16px !important; text-align: right !important; white-space: nowrap !important; display: grid; column-gap: 8px; grid-template-columns: repeat(4, 1fr); grid-template-areas: &quot;grid-col-1 grid-col-2 grid-col-3 grid-col-4&quot;;">
  2331. <div class="AvatarStack AvatarStack--right grid-col-1 "
  2332. style="box-sizing: border-box; position: relative; min-width: 26px; height: 20px; grid-area: grid-col-1 / grid-col-1 / grid-col-1 / grid-col-1;">
  2333. <div aria-label="Assigned to "
  2334. class="AvatarStack-body tooltipped tooltipped-sw tooltipped-multiline tooltipped-align-right-1 mt-1"
  2335. style="box-sizing: border-box; position: absolute; margin-top: 4px !important; display: flex; background: rgb(255, 255, 255); right: 0px; flex-direction: row-reverse;">
  2336. &nbsp;</div>
  2337. </div>
  2338. <span class="grid-col-4"
  2339. style="box-sizing: border-box; grid-area: grid-col-4 / grid-col-4 / grid-col-4 / grid-col-4;"><a
  2340. aria-label="4 comments" class="muted-link"
  2341. href="https://github.com/ckeditor/ckeditor5/issues/6141"
  2342. style="box-sizing: border-box; background-color: initial; color: rgb(88, 96, 105) !important; text-decoration: none;"><svg
  2343. aria-hidden="true"
  2344. class="octicon octicon-comment v-align-middle" height="16"
  2345. version="1.1" viewbox="0 0 16 16" width="16">
  2346. <path
  2347. d="M14 1H2c-.55 0-1 .45-1 1v8c0 .55.45 1 1 1h2v3.5L7.5 11H14c.55 0 1-.45 1-1V2c0-.55-.45-1-1-1zm0 9H7l-2 2v-2H2V2h12v8z"
  2348. fill-rule="evenodd"> </path>
  2349. </svg><span>&nbsp;</span><span class="text-small text-bold"
  2350. style="box-sizing: border-box; font-size: 12px !important; font-weight: 600 !important;">4</span></a></span>
  2351. </div>
  2352. </div>
  2353. </div>
  2354. <div class="Box-row Box-row--focus-gray p-0 mt-0 js-navigation-item js-issue-row"
  2355. data-id="554829765" id="issue_6139"
  2356. style="box-sizing: border-box; padding: 0px !important; margin-top: 0px !important; list-style-type: none; border-top: 1px solid rgb(225, 228, 232);">
  2357. <div class="d-flex Box-row--drag-hide position-relative"
  2358. style="box-sizing: border-box; position: relative !important; display: flex !important;">
  2359. <div class="flex-shrink-0 pt-2 pl-3"
  2360. style="box-sizing: border-box; flex-shrink: 0 !important; padding-top: 8px !important; padding-left: 16px !important;">
  2361. <span aria-label="Open issue" class="tooltipped tooltipped-e"
  2362. style="box-sizing: border-box; position: relative;"><svg
  2363. aria-hidden="true" class="octicon octicon-issue-opened open"
  2364. height="16" version="1.1" viewbox="0 0 14 16" width="14">
  2365. <path
  2366. d="M7 2.3c3.14 0 5.7 2.56 5.7 5.7s-2.56 5.7-5.7 5.7A5.71 5.71 0 011.3 8c0-3.14 2.56-5.7 5.7-5.7zM7 1C3.14 1 0 4.14 0 8s3.14 7 7 7 7-3.14 7-7-3.14-7-7-7zm1 3H6v5h2V4zm0 6H6v2h2v-2z"
  2367. fill-rule="evenodd"> </path>
  2368. </svg></span></div>
  2369. <div class="flex-auto min-width-0 lh-condensed p-2 "
  2370. style="box-sizing: border-box; flex: 1 1 auto !important; min-width: 0px !important; padding: 8px !important; line-height: 1.25 !important;">
  2371. <a class="link-gray-dark v-align-middle no-underline h4 js-navigation-open"
  2372. data-hovercard-type="issue"
  2373. data-hovercard-url="/ckeditor/ckeditor5/issues/6139/hovercard"
  2374. href="https://github.com/ckeditor/ckeditor5/issues/6139"
  2375. id="issue_6139_link"
  2376. style="box-sizing: border-box; background-color: initial; color: rgb(36, 41, 46) !important; text-decoration: none !important; vertical-align: middle !important; font-size: 16px !important; font-weight: 600 !important;">Some
  2377. ckeditor5-core tests do not cleanup
  2378. properly</a><span>&nbsp;</span><span class="labels lh-default "
  2379. style="box-sizing: border-box; line-height: 1.5 !important; position: relative;"><a
  2380. class="d-inline-block IssueLabel"
  2381. href="https://github.com/ckeditor/ckeditor5/issues?q=is%3Aissue+is%3Aopen+label%3Apackage%3Acore"
  2382. style="box-sizing: border-box; background-color: rgb(254, 242, 192); color: rgb(0, 0, 0); text-decoration: none; display: inline-block !important; height: 20px; padding: 0.15em 4px; font-size: 12px; font-weight: 600; line-height: 15px; border-radius: 2px; box-shadow: rgba(27, 31, 35, 0.12) 0px -1px 0px inset;"
  2383. title="package:core">package:core</a><span>&nbsp;</span><a
  2384. class="d-inline-block IssueLabel"
  2385. href="https://github.com/ckeditor/ckeditor5/issues?q=is%3Aissue+is%3Aopen+label%3Atype%3Abug"
  2386. style="box-sizing: border-box; background-color: rgb(221, 68, 68); color: rgb(0, 0, 0); text-decoration: none; display: inline-block !important; height: 20px; padding: 0.15em 4px; font-size: 12px; font-weight: 600; line-height: 15px; border-radius: 2px; box-shadow: rgba(27, 31, 35, 0.12) 0px -1px 0px inset;"
  2387. title="type:bug">type:bug</a></span>
  2388. <div class="mt-1 text-small text-gray"
  2389. style="box-sizing: border-box; color: rgb(88, 96, 105) !important; margin-top: 4px !important; font-size: 12px !important;">
  2390. <span class="opened-by" style="box-sizing: border-box;">#6139
  2391. opened<span>&nbsp;</span>
  2392. <relative-time class="no-wrap" datetime="2020-01-24T16:22:03Z"
  2393. style="box-sizing: border-box; white-space: nowrap !important;"
  2394. title="Jan 24, 2020, 5:22 PM GMT+1"> 6 days ago
  2395. </relative-time> <span>&nbsp;</span>by<span>&nbsp;</span><a
  2396. class="muted-link" data-hovercard-type="user"
  2397. data-hovercard-url="/users/jodator/hovercard"
  2398. data-octo-click="hovercard-link-click"
  2399. data-octo-dimensions="link_type:self"
  2400. href="https://github.com/ckeditor/ckeditor5/issues?q=is%3Aissue+is%3Aopen+author%3Ajodator"
  2401. style="box-sizing: border-box; background-color: initial; color: rgb(88, 96, 105) !important; text-decoration: none;"
  2402. title="Open issues created by jodator">jodator</a><span>&nbsp;</span>
  2403. </span><span
  2404. class="issue-meta-section css-truncate issue-milestone ml-2 "
  2405. style="box-sizing: border-box; margin-left: 8px !important; max-width: 240px;"><a
  2406. aria-label="iteration 29"
  2407. class="milestone-link muted-link css-truncate tooltipped tooltipped-n"
  2408. href="https://github.com/ckeditor/ckeditor5/milestone/32"
  2409. style="box-sizing: border-box; background-color: initial; color: rgb(88, 96, 105) !important; text-decoration: none; position: relative;"><svg
  2410. aria-label="Milestone" class="octicon octicon-milestone"
  2411. height="16" role="img" version="1.1" viewbox="0 0 14 16"
  2412. width="14">
  2413. <path
  2414. d="M8 2H6V0h2v2zm4 5H2c-.55 0-1-.45-1-1V4c0-.55.45-1 1-1h10l2 2-2 2zM8 4H6v2h2V4zM6 16h2V8H6v8z"
  2415. fill-rule="evenodd"> </path>
  2416. </svg><span>&nbsp;</span><span class="css-truncate-target"
  2417. style="box-sizing: border-box; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: inline-block; max-width: 100px; vertical-align: top;">iteration
  2418. 29</span></a></span></div>
  2419. </div>
  2420. <div class="flex-shrink-0 col-3 pt-2 text-right pr-3 no-wrap d-grid grid-4-col grid-gap-2 "
  2421. style="box-sizing: border-box; width: 244.5px; flex-shrink: 0 !important; padding-top: 8px !important; padding-right: 16px !important; text-align: right !important; white-space: nowrap !important; display: grid; column-gap: 8px; grid-template-columns: repeat(4, 1fr); grid-template-areas: &quot;grid-col-1 grid-col-2 grid-col-3 grid-col-4&quot;;">
  2422. <div class="AvatarStack AvatarStack--right grid-col-1 "
  2423. style="box-sizing: border-box; position: relative; min-width: 26px; height: 20px; grid-area: grid-col-1 / grid-col-1 / grid-col-1 / grid-col-1;">
  2424. <div aria-label="Assigned to jodator"
  2425. class="AvatarStack-body tooltipped tooltipped-sw tooltipped-multiline tooltipped-align-right-1 mt-1"
  2426. style="box-sizing: border-box; position: absolute; margin-top: 4px !important; display: flex; background: rgb(255, 255, 255); right: 0px; flex-direction: row-reverse;">
  2427. <a aria-label="jodator’s assigned issues" class="avatar"
  2428. href="https://github.com/ckeditor/ckeditor5/issues?q=assignee%3Ajodator+is%3Aopen"
  2429. style="box-sizing: initial; background-color: rgb(255, 255, 255); color: rgb(3, 102, 214); text-decoration: none; display: flex; overflow: hidden; line-height: 1; vertical-align: middle; border-radius: 2px; position: relative; z-index: 1; width: 20px; height: 20px; margin-right: 0px; border-right: 0px; transition: margin 0.1s ease-in-out 0s; margin-left: -11px; border-left: 1px solid rgb(255, 255, 255);"><img
  2430. alt="@jodator" class="from-avatar" height="20"
  2431. src="https://avatars1.githubusercontent.com/u/247363?s=40&amp;v=4"
  2432. style="box-sizing: border-box; border-style: none; border-radius: 2px;"
  2433. width="20" /></a></div>
  2434. </div>
  2435. </div>
  2436. </div>
  2437. </div>
  2438. </div>
  2439. </div>
  2440. </div>
  2441. </div>
  2442. </div>
  2443. </div>
  2444. </main>
  2445. </div>
  2446. </div>
  2447. <nav class="r s t u v c w x y z ab"
  2448. style="box-sizing: inherit; background-color: rgb(255, 255, 255); display: block; position: fixed; top: 0px; left: 0px; right: 0px; z-index: 500; box-shadow: rgba(0, 0, 0, 0.05) 0px 4px 12px 0px; transition: transform 300ms ease 0s; will-change: transform; color: rgba(0, 0, 0, 0.8); font-family: BlinkMacSystemFont, &quot;Segoe UI&quot;, Roboto, Oxygen, Ubuntu, Cantarell, &quot;Open Sans&quot;, &quot;Helvetica Neue&quot;, sans-serif; font-size: medium; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 400; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial;">
  2449. <div class="branch-journeys-top" style="box-sizing: inherit;">
  2450. <div class="r c" style="box-sizing: inherit; background-color: rgb(255, 255, 255); display: block;">
  2451. <div class="n p" style="box-sizing: inherit; display: flex; justify-content: center;">
  2452. <div class="ac ae af ag ah ai aj ak"
  2453. style="box-sizing: inherit; max-width: 1192px; min-width: 0px; width: 935px; margin: 0px 64px;">
  2454. <div class="al n o am an"
  2455. style="box-sizing: inherit; display: flex; align-items: center; height: 65px;">
  2456. <div class="n o ao w"
  2457. style="box-sizing: inherit; display: flex; align-items: center; z-index: 500; flex: 1 0 auto;">
  2458. <div class="r g" style="box-sizing: inherit; display: block;"><br
  2459. class="Apple-interchange-newline" />
  2460. <a href="https://foobar.test/example?source=post_page-----12345----------------------"
  2461. rel="noopener"
  2462. style="box-sizing: inherit; color: inherit; text-decoration: none; -webkit-tap-highlight-color: transparent;"><span
  2463. class="bj io ip iq cz pg db cy dc dd ph"
  2464. style="box-sizing: inherit; font-family: &quot;Lucida Grande&quot;, &quot;Lucida Sans Unicode&quot;, &quot;Lucida Sans&quot;, Geneva, Arial, sans-serif; display: -webkit-box; overflow: hidden; text-overflow: ellipsis; -webkit-line-clamp: 1; -webkit-box-orient: vertical; font-weight: 600; font-size: 28px; line-height: 36px; max-height: 36px; color: rgba(0, 0, 0, 0.9);">Content
  2465. Uneditable</span></a></div>
  2466. </div>
  2467. <div class="r ar w" style="box-sizing: inherit; display: block; z-index: 500; flex: 0 0 auto;">
  2468. <div class="n o" style="box-sizing: inherit; display: flex; align-items: center;">
  2469. <div class="n g" style="box-sizing: inherit; display: flex;">
  2470. <div class="ku" id="lo-post-page-navbar-sign-in-link"
  2471. style="box-sizing: inherit; visibility: visible;">
  2472. <div class="bq r"
  2473. style="box-sizing: inherit; display: block; margin-left: 16px;"><span
  2474. class="bj b bk bl bm bn r bo bp"
  2475. style="box-sizing: inherit; font-weight: 400; display: block; font-family: &quot;Lucida Grande&quot;, &quot;Lucida Sans Unicode&quot;, &quot;Lucida Sans&quot;, Geneva, Arial, sans-serif; font-style: normal; line-height: 20px; font-size: 15.8px; letter-spacing: 0px; color: rgba(0, 0, 0, 0.54); fill: rgba(0, 0, 0, 0.54);"><a
  2476. class="pi pj av aw ax ay az ba bb bc pk pl bf bg bv bw"
  2477. href="https://example.test/signin?source=post_page-----12345---------------------nav_reg-"
  2478. rel="noopener"
  2479. style="box-sizing: inherit; color: rgb(28, 153, 99); text-decoration: none; -webkit-tap-highlight-color: transparent; font-size: inherit; border: inherit; font-family: inherit; letter-spacing: inherit; font-weight: inherit; padding: 0px; margin: 0px; fill: rgb(2, 184, 117);">Sign
  2480. in</a></span></div>
  2481. </div>
  2482. </div>
  2483. <div class="ku" id="lo-post-page-navbar-get-started-button"
  2484. style="box-sizing: inherit; visibility: visible;">
  2485. <div class="bq r" style="box-sizing: inherit; display: block; margin-left: 16px;">
  2486. <button class="bx by pi pj pm pk pl pn bc cb bj b bk bl bm bn cc cd ce cf cg bf"
  2487. style="box-sizing: border-box; -webkit-tap-highlight-color: transparent; background: 0px center; overflow: visible; margin: 0px; font-weight: 400; font-family: &quot;Lucida Grande&quot;, &quot;Lucida Sans Unicode&quot;, &quot;Lucida Sans&quot;, Geneva, Arial, sans-serif; font-style: normal; line-height: 20px; font-size: 15.8px; letter-spacing: 0px; padding: 8px 16px; border-radius: 4px; border-width: 1px; border-style: solid; display: inline-block; text-decoration: none; color: rgb(28, 153, 99); fill: rgb(2, 184, 117); border-color: rgb(2, 184, 117);">Get
  2488. started</button></div>
  2489. </div>
  2490. </div>
  2491. </div>
  2492. </div>
  2493. </div>
  2494. </div>
  2495. </div>
  2496. </div>
  2497. </nav>
  2498. <div class="ch al r ci py"
  2499. style="box-sizing: inherit; display: block; height: 65px; margin-bottom: 0px; color: rgba(0, 0, 0, 0.8); font-family: BlinkMacSystemFont, &quot;Segoe UI&quot;, Roboto, Oxygen, Ubuntu, Cantarell, &quot;Open Sans&quot;, &quot;Helvetica Neue&quot;, sans-serif; font-size: medium; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 400; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial;">
  2500. &nbsp;</div>
  2501. <article
  2502. style="box-sizing: inherit; color: rgba(0, 0, 0, 0.8); font-family: BlinkMacSystemFont, &quot;Segoe UI&quot;, Roboto, Oxygen, Ubuntu, Cantarell, &quot;Open Sans&quot;, &quot;Helvetica Neue&quot;, sans-serif; font-size: medium; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 400; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial;">
  2503. <section class="cj ck cl cm ak cn ce n co"
  2504. style="box-sizing: border-box; display: flex; width: 728px; padding-left: 24px; padding-right: 24px; margin-left: auto; margin-right: auto; max-width: 728px; flex-direction: column;">
  2505. &nbsp;</section>
  2506. <div style="box-sizing: inherit;">
  2507. <div class="dh u di dj dk dl"
  2508. style="box-sizing: inherit; left: 0px; position: absolute; top: calc(100vh + 100px); bottom: calc(100vh + 100px); width: 10px; pointer-events: none;">
  2509. &nbsp;</div>
  2510. <div class="cl cm cn gl"
  2511. style="box-sizing: inherit; margin-left: auto; margin-right: auto; max-width: 728px; position: relative;">
  2512. <div class="r h g f e" style="box-sizing: inherit; display: block;">
  2513. <aside class="tq dh t"
  2514. style="box-sizing: inherit; top: 0px; position: absolute; left: 728px; width: 152.5px;">
  2515. <div class="tu no dh tx pu ak"
  2516. style="box-sizing: inherit; width: 152.5px; position: absolute; max-width: 100%; white-space: nowrap; margin-top: 6px; top: 2632.66px;">
  2517. <h4 class="bj dz eo bl bo"
  2518. style="box-sizing: inherit; margin: 0px; font-family: &quot;Lucida Grande&quot;, &quot;Lucida Sans Unicode&quot;, &quot;Lucida Sans&quot;, Geneva, Arial, sans-serif; line-height: 20px; color: rgba(0, 0, 0, 0.54); font-weight: 300; font-size: 15px;">
  2519. <span class="cf no pu cz db"
  2520. style="box-sizing: inherit; display: inline-block; overflow: hidden; text-overflow: ellipsis; max-width: 100%; white-space: nowrap;">Top
  2521. highlight</span></h4>
  2522. </div>
  2523. </aside>
  2524. </div>
  2525. </div>
  2526. <section class="ez fa fb fc fd" style="box-sizing: inherit; word-break: break-word; overflow-wrap: break-word;">
  2527. <div class="gz ak" style="box-sizing: inherit; width: 1063px; clear: both;">
  2528. <figure class="pz gz ak paragraph-image"
  2529. style="box-sizing: inherit; margin: 0px; width: 1063px; clear: both;">
  2530. <div class="qd r gl qe"
  2531. style="box-sizing: inherit; display: block; position: relative; margin: auto; background-color: rgba(0, 0, 0, 0.05);">
  2532. <div class="qf r" style="box-sizing: inherit; display: block; padding-bottom: 708.664px;">
  2533. <div class="fw qa dh t u hw ak cz qb qc"
  2534. style="box-sizing: inherit; top: 0px; left: 0px; width: 1063px; overflow: hidden; position: absolute; opacity: 0; height: 708.664px; transition: opacity 100ms ease 400ms; will-change: transform; transform: translateZ(0px);">
  2535. <img class="dh t u hw ak qg qh as tw" height="1200" role="presentation"
  2536. src="https://example.test/max/60/1*Dr6FyBZoAP-EOqP-xtiA.jpeg?q=20"
  2537. style="box-sizing: inherit; vertical-align: middle; top: 0px; left: 0px; width: 1063px; visibility: hidden; position: absolute; height: 708.664px; filter: blur(20px); transform: scale(1.1); transition: visibility 0ms ease 400ms;"
  2538. width="1800" /></div>
  2539. <img class="iz tt dh t u hw ak hu" height="1200" role="presentation"
  2540. src="https://example.test/max/3600/1*Dr6FyBZoAP-EKF94n-xtiA.jpeg"
  2541. style="box-sizing: inherit; vertical-align: middle; top: 0px; left: 0px; width: 1063px; position: absolute; background: rgb(255, 255, 255); height: 708.664px; opacity: 1; transition: opacity 400ms ease 0ms;"
  2542. width="1800" />
  2543. </div>
  2544. </div>
  2545. <figcaption class="bo ea qi qj jc cn cl cm qk ql bj dz" data-selectable-paragraph=""
  2546. style="box-sizing: inherit; font-family: &quot;Lucida Grande&quot;, &quot;Lucida Sans Unicode&quot;, &quot;Lucida Sans&quot;, Geneva, Arial, sans-serif; color: rgba(0, 0, 0, 0.54); margin-left: auto; margin-right: auto; max-width: 728px; font-weight: 300; font-size: 16px; text-align: center; line-height: 1.4; margin-top: 10px;">
  2547. Author:<span>&nbsp;</span><a class="at cg fs ft fu fv"
  2548. href="https://www.flickr.com/photos/bortabra/" rel="noopener nofollow"
  2549. style="box-sizing: inherit; color: inherit; text-decoration: none; -webkit-tap-highlight-color: transparent; background-repeat: repeat-x; background-image: url(&quot;data:image/svg+xml;utf8,&lt;svg preserveAspectRatio=\&quot;none\&quot; viewBox=\&quot;0 0 1 1\&quot; xmlns=\&quot;http://www.w3.org/2000/svg\&quot;&gt;&lt;line x1=\&quot;0\&quot; y1=\&quot;0\&quot; x2=\&quot;1\&quot; y2=\&quot;1\&quot; stroke=\&quot;rgba(0, 0, 0, 0.84)\&quot; /&gt;&lt;/svg&gt;&quot;); background-size: 1px 1px; background-position: 0px calc(1em + 1px);"
  2550. target="_blank">G&ouml;ran Ingman</a></figcaption>
  2551. </figure>
  2552. </div>
  2553. <div class="n p" style="box-sizing: inherit; display: flex; justify-content: center;">
  2554. <div class="ac ae af ag ah dn aj ak"
  2555. style="box-sizing: inherit; min-width: 0px; width: 680px; max-width: 680px; margin: 0px 64px;">
  2556. <div style="box-sizing: inherit;">
  2557. <div class="qm qn de bk nr b qo qp qq qr qs qt qu qv qw qx qy" id="8f99"
  2558. style="box-sizing: inherit; font-weight: 400; font-style: normal; color: rgba(0, 0, 0, 0.84); font-family: Georgia, Cambria, &quot;Times New Roman&quot;, Times, serif; line-height: 1.23; letter-spacing: 0px; margin-bottom: -0.27em; font-size: 40px; margin-top: 0.78em;">
  2559. <h1 class="nr b qo qz qq ra qs rb qu rc qw rd de"
  2560. style="box-sizing: inherit; margin: 0px; font-weight: 400; color: rgba(0, 0, 0, 0.84); font-family: Georgia, Cambria, &quot;Times New Roman&quot;, Times, serif; font-size: 40px; line-height: 48px;">
  2561. ContentEditable &mdash; The Good, the Bad and the Ugly</h1>
  2562. </div>
  2563. <div class="do" style="box-sizing: inherit; margin-top: 32px;">
  2564. <div class="n dp dq dr ds"
  2565. style="box-sizing: inherit; display: flex; justify-content: space-between;">
  2566. <div class="o n" style="box-sizing: inherit; display: flex; align-items: center;">
  2567. <div style="box-sizing: inherit;"><a
  2568. href="https://example.test/@reinmarpl?source=post_page-----12345----------------------"
  2569. rel="noopener"
  2570. style="box-sizing: inherit; color: inherit; text-decoration: none; -webkit-tap-highlight-color: transparent;"><img
  2571. alt="Piotrek Koszuliński" class="r dt du dv" height="48"
  2572. src="https://example.test/fit/c/96/96/1*eTpp1WMpoogzN8gYIt1XCw.jpeg"
  2573. style="box-sizing: inherit; vertical-align: middle; display: block; border-radius: 50%; height: 48px; width: 48px;"
  2574. width="48" /></a></div>
  2575. <div class="dw ak r"
  2576. style="box-sizing: inherit; display: block; width: 183.617px; margin-left: 12px;">
  2577. <div class="n" style="box-sizing: inherit; display: flex;">
  2578. <div style="box-sizing: inherit; flex: 1 1 0%;">
  2579. <div class="dx n o dy"
  2580. style="box-sizing: inherit; display: flex; align-items: center; margin-bottom: 2px;">
  2581. <span class="bj b bk bl bm bn r de q"
  2582. style="box-sizing: inherit; font-weight: 400; fill: rgba(0, 0, 0, 0.84); display: block; font-family: &quot;Lucida Grande&quot;, &quot;Lucida Sans Unicode&quot;, &quot;Lucida Sans&quot;, Geneva, Arial, sans-serif; font-style: normal; line-height: 20px; font-size: 15.8px; letter-spacing: 0px; color: rgba(0, 0, 0, 0.84);"><span
  2583. class="bj dz ea bl cz da db cy dc dd de"
  2584. style="box-sizing: inherit; font-family: &quot;Lucida Grande&quot;, &quot;Lucida Sans Unicode&quot;, &quot;Lucida Sans&quot;, Geneva, Arial, sans-serif; line-height: 20px; display: -webkit-box; overflow: hidden; max-height: 20px; text-overflow: ellipsis; -webkit-line-clamp: 1; -webkit-box-orient: vertical; color: rgba(0, 0, 0, 0.84); font-weight: 300; font-size: 16px;"><a
  2585. class="at au av aw ax ay az ba bb bc eb bf bg bh bi"
  2586. href="https://example.test/@reinmarpl?source=post_page-----12345----------------------"
  2587. rel="noopener"
  2588. style="box-sizing: inherit; color: inherit; text-decoration: none; -webkit-tap-highlight-color: transparent; fill: inherit; font-size: inherit; border: inherit; font-family: inherit; letter-spacing: inherit; font-weight: inherit; padding: 0px; margin: 0px;">Piotrek
  2589. Koszuliński</a></span> </span>
  2590. <div class="dg r ar h"
  2591. style="box-sizing: inherit; display: block; flex: 0 0 auto; margin-left: 8px;">
  2592. <span class="bj b bk bl bm bn r de q"
  2593. style="box-sizing: inherit; font-weight: 400; fill: rgba(0, 0, 0, 0.84); display: block; font-family: &quot;Lucida Grande&quot;, &quot;Lucida Sans Unicode&quot;, &quot;Lucida Sans&quot;, Geneva, Arial, sans-serif; font-style: normal; line-height: 20px; font-size: 15.8px; letter-spacing: 0px; color: rgba(0, 0, 0, 0.84);"><button
  2594. class="ec de q by ed ee ef eg bc bh eh ei ej ek el em cb bj b bk en eo bn cc cd ce cf cg bf"
  2595. style="box-sizing: border-box; -webkit-tap-highlight-color: transparent; background: 0px center; overflow: visible; margin: 0px; font-weight: 400; fill: rgba(0, 0, 0, 0.84); font-family: &quot;Lucida Grande&quot;, &quot;Lucida Sans Unicode&quot;, &quot;Lucida Sans&quot;, Geneva, Arial, sans-serif; font-style: normal; letter-spacing: 0px; border-radius: 4px; border-width: 1px; border-style: solid; display: inline-block; text-decoration: none; color: rgba(0, 0, 0, 0.84); padding: 0px 8px; border-color: rgba(0, 0, 0, 0.54); line-height: 18px; font-size: 15px;">Follow</button>
  2596. </span></div>
  2597. <span class="bj b bk bl bm bn r de q"
  2598. style="box-sizing: inherit; font-weight: 400; fill: rgba(0, 0, 0, 0.84); display: block; font-family: &quot;Lucida Grande&quot;, &quot;Lucida Sans Unicode&quot;, &quot;Lucida Sans&quot;, Geneva, Arial, sans-serif; font-style: normal; line-height: 20px; font-size: 15.8px; letter-spacing: 0px; color: rgba(0, 0, 0, 0.84);">
  2599. </span>
  2600. </div>
  2601. </div>
  2602. </div>
  2603. <div style="box-sizing: inherit;"><span class="bj b bk bl bm bn r bo bp"
  2604. style="box-sizing: inherit; font-weight: 400; display: block; font-family: &quot;Lucida Grande&quot;, &quot;Lucida Sans Unicode&quot;, &quot;Lucida Sans&quot;, Geneva, Arial, sans-serif; font-style: normal; line-height: 20px; font-size: 15.8px; letter-spacing: 0px; color: rgba(0, 0, 0, 0.54); fill: rgba(0, 0, 0, 0.54);"><span
  2605. class="bj dz ea bl cz da db cy dc dd bo"
  2606. style="box-sizing: inherit; font-family: &quot;Lucida Grande&quot;, &quot;Lucida Sans Unicode&quot;, &quot;Lucida Sans&quot;, Geneva, Arial, sans-serif; line-height: 20px; color: rgba(0, 0, 0, 0.54); display: -webkit-box; overflow: hidden; max-height: 20px; text-overflow: ellipsis; -webkit-line-clamp: 1; -webkit-box-orient: vertical; font-weight: 300; font-size: 16px;"><a
  2607. class="at au av aw ax ay az ba bb bc eb bf bg bh bi"
  2608. href="https://foobar.test/example/contenteditable-the-good-the-bad-and-the-ugly-12345?source=post_page-----12345----------------------"
  2609. rel="noopener"
  2610. style="box-sizing: inherit; color: inherit; text-decoration: none; -webkit-tap-highlight-color: transparent; fill: inherit; font-size: inherit; border: inherit; font-family: inherit; letter-spacing: inherit; font-weight: inherit; padding: 0px; margin: 0px;">Aug
  2611. 13,
  2612. 2015</a><span>&nbsp;</span>&middot;<span>&nbsp;</span>9<span>&nbsp;</span>min
  2613. read </span></span></div>
  2614. </div>
  2615. </div>
  2616. <div class="n ep eq er es et eu ev ew ab"
  2617. style="box-sizing: inherit; display: flex; align-items: flex-end; margin-left: 30px;">
  2618. <div class="n o" style="box-sizing: inherit; display: flex; align-items: center;">
  2619. <div class="ex r ar"
  2620. style="box-sizing: inherit; display: block; flex: 0 0 auto; padding-right: 8px;">
  2621. <a class="at au av aw ax ay az ba bb bc bd be bf bg bh bi"
  2622. href="https://example.test/p/12345/share/twitter?source=post_actions_header---------------------------"
  2623. rel="noopener nofollow"
  2624. style="box-sizing: inherit; color: inherit; text-decoration: none; -webkit-tap-highlight-color: transparent; fill: inherit; font-size: inherit; border: inherit; font-family: inherit; letter-spacing: inherit; font-weight: inherit; padding: 0px; margin: 0px;"
  2625. target="_blank"><svg class="q" height="29" width="29">
  2626. <path
  2627. d="M22.05 7.54a4.47 4.47 0 0 0-3.3-1.46 4.53 4.53 0 0 0-4.53 4.53c0 .35.04.7.08 1.05A12.9 12.9 0 0 1 5 6.89a5.1 5.1 0 0 0-.65 2.26c.03 1.6.83 2.99 2.02 3.79a4.3 4.3 0 0 1-2.02-.57v.08a4.55 4.55 0 0 0 3.63 4.44c-.4.08-.8.13-1.21.16l-.81-.08a4.54 4.54 0 0 0 4.2 3.15 9.56 9.56 0 0 1-5.66 1.94l-1.05-.08c2 1.27 4.38 2.02 6.94 2.02 8.3 0 12.86-6.9 12.84-12.85.02-.24 0-.43 0-.65a8.68 8.68 0 0 0 2.26-2.34c-.82.38-1.7.62-2.6.72a4.37 4.37 0 0 0 1.95-2.51c-.84.53-1.81.9-2.83 1.13z">
  2628. </path>
  2629. </svg></a></div>
  2630. <div class="ex r ar"
  2631. style="box-sizing: inherit; display: block; flex: 0 0 auto; padding-right: 8px;">
  2632. <a class="at au av aw ax ay az ba bb bc bd be bf bg bh bi"
  2633. href="https://example.test/p/12345/share/facebook?source=post_actions_header---------------------------"
  2634. rel="noopener nofollow"
  2635. style="box-sizing: inherit; color: inherit; text-decoration: none; -webkit-tap-highlight-color: transparent; fill: inherit; font-size: inherit; border: inherit; font-family: inherit; letter-spacing: inherit; font-weight: inherit; padding: 0px; margin: 0px;"
  2636. target="_blank"><svg class="q" height="29" width="29">
  2637. <path
  2638. d="M23.2 5H5.8a.8.8 0 0 0-.8.8V23.2c0 .44.35.8.8.8h9.3v-7.13h-2.38V13.9h2.38v-2.38c0-2.45 1.55-3.66 3.74-3.66 1.05 0 1.95.08 2.2.11v2.57h-1.5c-1.2 0-1.48.57-1.48 1.4v1.96h2.97l-.6 2.97h-2.37l.05 7.12h5.1a.8.8 0 0 0 .79-.8V5.8a.8.8 0 0 0-.8-.79">
  2639. </path>
  2640. </svg></a></div>
  2641. <div class="ey r ao"
  2642. style="box-sizing: inherit; display: block; flex: 1 0 auto; margin-right: -6px;">
  2643. <a class="at au av aw ax ay az ba bb bc bd be bf bg bh bi"
  2644. href="https://example.test/foo?x=y&amp;source=post_actions_header--------------------------bookmark_sidebar-"
  2645. rel="noopener"
  2646. style="box-sizing: inherit; color: inherit; text-decoration: none; -webkit-tap-highlight-color: transparent; fill: inherit; font-size: inherit; border: inherit; font-family: inherit; letter-spacing: inherit; font-weight: inherit; padding: 0px; margin: 0px;"><svg
  2647. height="25" viewbox="0 0 25 25" width="25">
  2648. <path
  2649. d="M19 6a2 2 0 0 0-2-2H8a2 2 0 0 0-2 2v14.66h.01c.01.1.05.2.12.28a.5.5 0 0 0 .7.03l5.67-4.12 5.66 4.13a.5.5 0 0 0 .71-.03.5.5 0 0 0 .12-.29H19V6zm-6.84 9.97L7 19.64V6a1 1 0 0 1 1-1h9a1 1 0 0 1 1 1v13.64l-5.16-3.67a.49.49 0 0 0-.68 0z"
  2650. fill-rule="evenodd"></path>
  2651. </svg></a></div>
  2652. </div>
  2653. </div>
  2654. </div>
  2655. </div>
  2656. </div>
  2657. </div>
  2658. </div>
  2659. </section>
  2660. <hr class="re dz ip rf rg jc rh ri rj rk rl"
  2661. style="box-sizing: inherit; font-weight: 300; font-size: 28px; text-align: center; font-family: Georgia, Cambria, &quot;Times New Roman&quot;, Times, serif; border: none; margin-top: 30px;" />
  2662. <section class="ez fa fb fc fd" style="box-sizing: inherit; word-break: break-word; overflow-wrap: break-word;">
  2663. <div class="n p" style="box-sizing: inherit; display: flex; justify-content: center;">
  2664. <div class="ac ae af ag ah dn aj ak"
  2665. style="box-sizing: inherit; min-width: 0px; width: 680px; max-width: 680px; margin: 0px 64px;">
  2666. <p class="fe ff de bk fg b fh fi fj fk fl fm fn fo fp fq fr ez" data-selectable-paragraph=""
  2667. id="da55"
  2668. style="box-sizing: inherit; margin: 2em 0px -0.46em; font-weight: 400; font-style: normal; color: rgba(0, 0, 0, 0.84); word-break: break-word; line-height: 1.58; letter-spacing: -0.004em; font-family: Georgia, Cambria, &quot;Times New Roman&quot;, Times, serif; font-size: 21px;">
  2669. <span style="font-family:Times New Roman,Times,serif; font-size:26px; color:#ecf0f1; background-color:#27ae60;">Every once in a while
  2670. some developer notices that</span>
  2671. there&rsquo;s<span>&nbsp;</span><em class="rm"
  2672. style="box-sizing: inherit; font-style: italic;">still</em><span>&nbsp;</span>no<span>&nbsp;</span><em
  2673. class="rm"
  2674. style="box-sizing: inherit; font-style: italic;">perfect</em><span>&nbsp;</span>WYSIWYG
  2675. editor for the web on the market and then this happens:</p>
  2676. <figure class="rn ro rp rq rr gz" style="box-sizing: inherit; margin: 56px 0px 0px; clear: both;">
  2677. <div class="qd r gl"
  2678. style="box-sizing: inherit; display: block; position: relative; margin: auto;">
  2679. <div class="rs r" style="box-sizing: inherit; display: block;"><iframe allowfullscreen=""
  2680. class="dh t u hw ak" frameborder="0" height="0" scrolling="auto"
  2681. src="https://example.test/media/fc4300fefc5617f3fb0a833563a03072"
  2682. style="box-sizing: inherit; top: 0px; left: 0px; width: 680px; position: absolute; height: 0px;"
  2683. title="Piotrek Koszuliński on Twitter" width="0"></iframe></div>
  2684. </div>
  2685. </figure>
  2686. <p class="fe ff de bk fg b fh fi fj fk fl fm fn fo fp fq fr ez" data-selectable-paragraph=""
  2687. id="3dba"
  2688. style="box-sizing: inherit; margin: 2em 0px -0.46em; font-weight: 400; font-style: normal; color: rgba(0, 0, 0, 0.84); word-break: break-word; line-height: 1.58; letter-spacing: -0.004em; font-family: Georgia, Cambria, &quot;Times New Roman&quot;, Times, serif; font-size: 21px;">
  2689. How hard can it be? We&rsquo;ve got<span>&nbsp;</span><a class="at cg fs ft fu fv"
  2690. href="http://html5demos.com/contenteditable" rel="noopener nofollow"
  2691. style="box-sizing: inherit; color: inherit; text-decoration: none; -webkit-tap-highlight-color: transparent; background-repeat: repeat-x; background-image: url(&quot;data:image/svg+xml;utf8,&lt;svg preserveAspectRatio=\&quot;none\&quot; viewBox=\&quot;0 0 1 1\&quot; xmlns=\&quot;http://www.w3.org/2000/svg\&quot;&gt;&lt;line x1=\&quot;0\&quot; y1=\&quot;0\&quot; x2=\&quot;1\&quot; y2=\&quot;1\&quot; stroke=\&quot;rgba(0, 0, 0, 0.84)\&quot; /&gt;&lt;/svg&gt;&quot;); background-size: 1px 1px; background-position: 0px calc(1em + 1px);"
  2692. target="_blank">contentEditable</a>,<span>&nbsp;</span><a class="at cg fs ft fu fv"
  2693. href="https://developer.mozilla.org/en-US/docs/Web/API/Document/execCommand"
  2694. rel="noopener nofollow"
  2695. style="box-sizing: inherit; color: inherit; text-decoration: none; -webkit-tap-highlight-color: transparent; background-repeat: repeat-x; background-image: url(&quot;data:image/svg+xml;utf8,&lt;svg preserveAspectRatio=\&quot;none\&quot; viewBox=\&quot;0 0 1 1\&quot; xmlns=\&quot;http://www.w3.org/2000/svg\&quot;&gt;&lt;line x1=\&quot;0\&quot; y1=\&quot;0\&quot; x2=\&quot;1\&quot; y2=\&quot;1\&quot; stroke=\&quot;rgba(0, 0, 0, 0.84)\&quot; /&gt;&lt;/svg&gt;&quot;); background-size: 1px 1px; background-position: 0px calc(1em + 1px);"
  2696. target="_blank"><em class="rm" style="box-sizing: inherit; font-style: italic;">exec<span
  2697. style="color:#2980b9;">Command()</span></em></a><span
  2698. style="color:#2980b9;">&nbsp;and&nbsp;</span><a class="at cg fs ft fu fv"
  2699. href="https://developer.mozilla.org/en-US/docs/Web/API/Document/queryCommandState"
  2700. rel="noopener nofollow"
  2701. style="box-sizing: inherit; color: inherit; text-decoration: none; -webkit-tap-highlight-color: transparent; background-repeat: repeat-x; background-image: url(&quot;data:image/svg+xml;utf8,&lt;svg preserveAspectRatio=\&quot;none\&quot; viewBox=\&quot;0 0 1 1\&quot; xmlns=\&quot;http://www.w3.org/2000/svg\&quot;&gt;&lt;line x1=\&quot;0\&quot; y1=\&quot;0\&quot; x2=\&quot;1\&quot; y2=\&quot;1\&quot; stroke=\&quot;rgba(0, 0, 0, 0.84)\&quot; /&gt;&lt;/svg&gt;&quot;); background-size: 1px 1px; background-position: 0px calc(1em + 1px);"
  2702. target="_blank"><span style="color:#2980b9;"><em class="rm"
  2703. style="box-sizing: inherit; font-style: italic;">queryCommandState()</em></span></a><span
  2704. style="color:#2980b9;">. Now, let&rsquo;s just add some toolbar with stylish buttons to
  2705. enable applying bold and linking the text. We&rsquo;ll </span>work a bit on typography, use
  2706. some trendy SVG/font icons for the buttons, add some CSS transitions here and there and we are
  2707. mostly ready. Right?</p>
  2708. <p class="fe ff de bk fg b fh fi fj fk fl fm fn fo fp fq fr ez" data-selectable-paragraph=""
  2709. id="db6d"
  2710. style="box-sizing: inherit; margin: 2em 0px -0.46em; font-weight: 400; font-style: normal; color: rgba(0, 0, 0, 0.84); word-break: break-word; line-height: 1.58; letter-spacing: -0.004em; font-family: Georgia, Cambria, &quot;Times New Roman&quot;, Times, serif; font-size: 21px;">
  2711. Just a couple of details left&hellip; How do I force the<span>&nbsp;</span><em class="rm"
  2712. style="box-sizing: inherit; font-style: italic;">bold</em><span>&nbsp;</span>command to
  2713. use<span>&nbsp;</span><em class="rm"
  2714. style="box-sizing: inherit; font-style: italic;">&lt;strong&gt;</em><span>&nbsp;</span>instead
  2715. of<span>&nbsp;</span><em class="rm"
  2716. style="box-sizing: inherit; font-style: italic;">&lt;b&gt;</em><span>&nbsp;</span>(choose
  2717. whichever you like more, actually) in every browser, force the<span>&nbsp;</span><em class="rm"
  2718. style="box-sizing: inherit; font-style: italic;">Enter</em><span>&nbsp;</span>key to create
  2719. new paragraphs instead of those ugly<span>&nbsp;</span><em class="rm"
  2720. style="box-sizing: inherit; font-style: italic;">&lt;br&gt;</em><span>&nbsp;</span>or<span>&nbsp;</span><em
  2721. class="rm"
  2722. style="box-sizing: inherit; font-style: italic;">&lt;div&gt;</em><span>&nbsp;</span>and fix
  2723. that damn pasting. I don&rsquo;t want all those inline styles!</p>
  2724. <p class="fe ff de bk fg b fh fi fj fk fl fm fn fo fp fq fr ez" data-selectable-paragraph=""
  2725. id="571f"
  2726. style="box-sizing: inherit; margin: 2em 0px -0.46em; font-weight: 400; font-style: normal; color: rgba(0, 0, 0, 0.84); word-break: break-word; line-height: 1.58; letter-spacing: -0.004em; font-family: Georgia, Cambria, &quot;Times New Roman&quot;, Times, serif; font-size: 21px;">
  2727. style="font-size:10px; font-family:Verdana,Geneva,sans-serif;"><span
  2728. style="color:#e67e22;">A month and several questions on&nbsp;</span><a
  2729. class="at cg fs ft fu fv" href="http://stackoverflow.com/" rel="noopener nofollow"
  2730. style="box-sizing: inherit; color: inherit; text-decoration: none; -webkit-tap-highlight-color: transparent; background-repeat: repeat-x; background-image: url(&quot;data:image/svg+xml;utf8,&lt;svg preserveAspectRatio=\&quot;none\&quot; viewBox=\&quot;0 0 1 1\&quot; xmlns=\&quot;http://www.w3.org/2000/svg\&quot;&gt;&lt;line x1=\&quot;0\&quot; y1=\&quot;0\&quot; x2=\&quot;1\&quot; y2=\&quot;1\&quot; stroke=\&quot;rgba(0, 0, 0, 0.84)\&quot; /&gt;&lt;/svg&gt;&quot;); background-size: 1px 1px; background-position: 0px calc(1em + 1px);"
  2731. target="_blank"><span style="color:#e67e22;">StackOverflow</span></a><span
  2732. style="color:#e67e22;">&nbsp;later the project is either dead or full of most brutal
  2733. hacks which seem to work (that&rsquo;s actually the worst situation &mdash; poor
  2734. end-users). The developer joins the&nbsp;<em class="rm"
  2735. style="box-sizing: inherit; font-style: italic;">&ldquo;contentEditable is
  2736. evil&rdquo;</em>&nbsp;club and hates WYSIWYG editors even
  2737. more.</span></span></p>
  2738. <p class="fe ff de bk fg b fh fi fj fk fl fm fn fo fp fq fr ez" data-selectable-paragraph=""
  2739. id="df42"
  2740. style="box-sizing: inherit; margin: 2em 0px -0.46em; font-weight: 400; font-style: normal; color: rgba(0, 0, 0, 0.84); word-break: break-word; line-height: 1.58; letter-spacing: -0.004em; font-family: Georgia, Cambria, &quot;Times New Roman&quot;, Times, serif; font-size: 21px;">
  2741. Those three small details &mdash; how the<span>&nbsp;</span><em class="rm"
  2742. style="box-sizing: inherit; font-style: italic;">bold</em><span>&nbsp;</span>command
  2743. and<span>&nbsp;</span><em class="rm"
  2744. style="box-sizing: inherit; font-style: italic;">Enter</em><span>&nbsp;</span>key work plus
  2745. cleaning up pasted data are just the tip of the iceberg, but they are already enough to make
  2746. even a skilled JavaScript developer hate<span>&nbsp;</span><em class="rm"
  2747. style="box-sizing: inherit; font-style: italic;">&ldquo;this entire
  2748. contentEditable&rdquo;</em>.</p>
  2749. <p class="fe ff de bk fg b fh fi fj fk fl fm fn fo fp fq fr ez" data-selectable-paragraph=""
  2750. id="1253"
  2751. style="box-sizing: inherit; margin: 2em 0px -0.46em; font-weight: 400; font-style: normal; color: rgba(0, 0, 0, 0.84); word-break: break-word; line-height: 1.58; letter-spacing: -0.004em; font-family: Georgia, Cambria, &quot;Times New Roman&quot;, Times, serif; font-size: 21px;">
  2752. Let&rsquo;s consider how the behavior of the<span>&nbsp;</span><span style="color:#2ecc71;"><em
  2753. class="rm" style="box-sizing: inherit; font-style: italic;">bold</em>&nbsp;command can
  2754. be altered. I&rsquo;ve seen many approaches from the hacky ones like using mutation
  2755. observers, through normalisation of HTML when retrieving it from the editor, to a complete
  2756. (in my opinion, the only real) solution which is reimplementing the&nbsp;<em class="rm"
  2757. style="box-sizing: inherit; font-style: italic;">execCommand()</em>&nbsp;behavior</span>
  2758. in JavaScript. But again, this is only the tip of the iceberg.</p>
  2759. <p class="fe ff de bk fg b fh fi fj fk fl fm fn fo fp fq fr ez" data-selectable-paragraph=""
  2760. id="cf16"
  2761. style="box-sizing: inherit; margin: 2em 0px -0.46em; font-weight: 400; font-style: normal; color: rgba(0, 0, 0, 0.84); word-break: break-word; line-height: 1.58; letter-spacing: -0.004em; font-family: Georgia, Cambria, &quot;Times New Roman&quot;, Times, serif; font-size: 21px;">
  2762. If you chose the mutation observers, you may need to deal with preserving selection (as it may
  2763. be reset when you modify the DOM around it) or with the<span>&nbsp;</span><a
  2764. class="at cg fs ft fu fv"
  2765. href="http://www.w3.org/wiki/Web_Editing_APIs/UndoManager_Problem_Descriptions"
  2766. rel="noopener nofollow"
  2767. style="box-sizing: inherit; color: inherit; text-decoration: none; -webkit-tap-highlight-color: transparent; background-repeat: repeat-x; background-image: url(&quot;data:image/svg+xml;utf8,&lt;svg preserveAspectRatio=\&quot;none\&quot; viewBox=\&quot;0 0 1 1\&quot; xmlns=\&quot;http://www.w3.org/2000/svg\&quot;&gt;&lt;line x1=\&quot;0\&quot; y1=\&quot;0\&quot; x2=\&quot;1\&quot; y2=\&quot;1\&quot; stroke=\&quot;rgba(0, 0, 0, 0.84)\&quot; /&gt;&lt;/svg&gt;&quot;); background-size: 1px 1px; background-position: 0px calc(1em + 1px);"
  2768. target="_blank">undo manager</a>.</p>
  2769. <p class="fe ff de bk fg b fh fi fj fk fl fm fn fo fp fq fr ez" data-selectable-paragraph=""
  2770. id="047f"
  2771. style="box-sizing: inherit; margin: 2em 0px -0.46em; font-weight: 400; font-style: normal; color: rgba(0, 0, 0, 0.84); word-break: break-word; line-height: 1.58; letter-spacing: -0.004em; font-family: Georgia, Cambria, &quot;Times New Roman&quot;, Times, serif; font-size: 21px;">
  2772. If you accepted normalisation of the output you&rsquo;re pretty safe, but I can hardly imagine
  2773. the same approach to the<span>&nbsp;</span><em class="rm"
  2774. style="box-sizing: inherit; font-style: italic;">Enter</em><span>&nbsp;</span>key support
  2775. and well&hellip; it smells bad.</p>
  2776. <p class="fe ff de bk fg b fh fi fj fk fl fm fn fo fp fq fr ez" data-selectable-paragraph=""
  2777. id="9b1d"
  2778. style="box-sizing: inherit; margin: 2em 0px -0.46em; font-weight: 400; font-style: normal; color: rgba(0, 0, 0, 0.84); word-break: break-word; line-height: 1.58; letter-spacing: -0.004em; font-family: Georgia, Cambria, &quot;Times New Roman&quot;, Times, serif; font-size: 21px;">
  2779. If you&rsquo;re a purist like me, you would perhaps try to implement<span>&nbsp;</span><em
  2780. class="rm"
  2781. style="box-sizing: inherit; font-style: italic;">execCommand()</em><span>&nbsp;</span>in
  2782. JavaScript. The algorithm is pretty straightforward &mdash; get the<span>&nbsp;</span><a
  2783. class="at cg fs ft fu fv"
  2784. href="https://developer.mozilla.org/en-US/docs/Web/API/Window/getSelection"
  2785. rel="noopener nofollow"
  2786. style="box-sizing: inherit; color: inherit; text-decoration: none; -webkit-tap-highlight-color: transparent; background-repeat: repeat-x; background-image: url(&quot;data:image/svg+xml;utf8,&lt;svg preserveAspectRatio=\&quot;none\&quot; viewBox=\&quot;0 0 1 1\&quot; xmlns=\&quot;http://www.w3.org/2000/svg\&quot;&gt;&lt;line x1=\&quot;0\&quot; y1=\&quot;0\&quot; x2=\&quot;1\&quot; y2=\&quot;1\&quot; stroke=\&quot;rgba(0, 0, 0, 0.84)\&quot; /&gt;&lt;/svg&gt;&quot;); background-size: 1px 1px; background-position: 0px calc(1em + 1px);"
  2787. target="_blank">selection</a>, get<span>&nbsp;</span><a class="at cg fs ft fu fv"
  2788. href="https://developer.mozilla.org/en-US/docs/Web/API/Selection/getRangeAt"
  2789. rel="noopener nofollow"
  2790. style="box-sizing: inherit; color: inherit; text-decoration: none; -webkit-tap-highlight-color: transparent; background-repeat: repeat-x; background-image: url(&quot;data:image/svg+xml;utf8,&lt;svg preserveAspectRatio=\&quot;none\&quot; viewBox=\&quot;0 0 1 1\&quot; xmlns=\&quot;http://www.w3.org/2000/svg\&quot;&gt;&lt;line x1=\&quot;0\&quot; y1=\&quot;0\&quot; x2=\&quot;1\&quot; y2=\&quot;1\&quot; stroke=\&quot;rgba(0, 0, 0, 0.84)\&quot; /&gt;&lt;/svg&gt;&quot;); background-size: 1px 1px; background-position: 0px calc(1em + 1px);"
  2791. target="_blank">ranges</a><span>&nbsp;</span>(did I mention that Firefox supports
  2792. multi-range selections?), do a couple of DOM operations, make selection, implement undo manager
  2793. (because your changes won&rsquo;t be recorded by the native one) and you&rsquo;re safe. Except
  2794. that:</p>
  2795. <ul style="box-sizing: inherit; margin: 0px; padding: 0px; list-style: none none;">
  2796. <li class="fe ff de bk fg b fh fi fj fk fl fm fn fo fp fq fr rt ru rv"
  2797. data-selectable-paragraph="" id="95b2"
  2798. style="box-sizing: inherit; font-weight: 400; font-style: normal; color: rgba(0, 0, 0, 0.84); line-height: 1.58; letter-spacing: -0.004em; font-family: Georgia, Cambria, &quot;Times New Roman&quot;, Times, serif; margin-bottom: -0.46em; list-style-type: disc; margin-left: 30px; padding-left: 0px; font-size: 21px; margin-top: 2em;">
  2799. <mark class="tr ts gp"
  2800. style="box-sizing: inherit; cursor: pointer; background-color: rgb(233, 253, 240); color: currentcolor;">You
  2801. were fired for delaying the project for a few months</mark>.</li>
  2802. <li class="fe ff de bk fg b fh rw fj rx fl ry fn rz fp sa fr rt ru rv"
  2803. data-selectable-paragraph="" id="1e25"
  2804. style="box-sizing: inherit; font-weight: 400; font-style: normal; color: rgba(0, 0, 0, 0.84); line-height: 1.58; letter-spacing: -0.004em; font-family: Georgia, Cambria, &quot;Times New Roman&quot;, Times, serif; margin-bottom: -0.46em; list-style-type: disc; margin-left: 30px; padding-left: 0px; font-size: 21px; margin-top: 1.05em;">
  2805. Your tests don&rsquo;t pass in any other browser (oh and did I mention
  2806. that<span>&nbsp;</span><a class="at cg fs ft fu fv"
  2807. href="https://bugs.webkit.org/show_bug.cgi?id=15256" rel="noopener nofollow"
  2808. style="box-sizing: inherit; color: inherit; text-decoration: none; -webkit-tap-highlight-color: transparent; background-repeat: repeat-x; background-image: url(&quot;data:image/svg+xml;utf8,&lt;svg preserveAspectRatio=\&quot;none\&quot; viewBox=\&quot;0 0 1 1\&quot; xmlns=\&quot;http://www.w3.org/2000/svg\&quot;&gt;&lt;line x1=\&quot;0\&quot; y1=\&quot;0\&quot; x2=\&quot;1\&quot; y2=\&quot;1\&quot; stroke=\&quot;rgba(0, 0, 0, 0.84)\&quot; /&gt;&lt;/svg&gt;&quot;); background-size: 1px 1px; background-position: 0px calc(1em + 1px);"
  2809. target="_blank">Blink and WebKit</a>&rsquo;s selection systems are broken? Yes&hellip;
  2810. the bug is 8 years old) and you&rsquo;re about to implement one of the most ugly hacks
  2811. you&rsquo;ll ever see.</li>
  2812. <li class="fe ff de bk fg b fh rw fj rx fl ry fn rz fp sa fr rt ru rv"
  2813. data-selectable-paragraph="" id="6b50"
  2814. style="box-sizing: inherit; font-weight: 400; font-style: normal; color: rgba(0, 0, 0, 0.84); line-height: 1.58; letter-spacing: -0.004em; font-family: Georgia, Cambria, &quot;Times New Roman&quot;, Times, serif; margin-bottom: -0.46em; list-style-type: disc; margin-left: 30px; padding-left: 0px; font-size: 21px; margin-top: 1.05em;">
  2815. First bug reports start to appear and you start to realise how many more cases your
  2816. implementation needs to support.</li>
  2817. <li class="fe ff de bk fg b fh rw fj rx fl ry fn rz fp sa fr rt ru rv"
  2818. data-selectable-paragraph="" id="e92b"
  2819. style="box-sizing: inherit; font-weight: 400; font-style: normal; color: rgba(0, 0, 0, 0.84); line-height: 1.58; letter-spacing: -0.004em; font-family: Georgia, Cambria, &quot;Times New Roman&quot;, Times, serif; margin-bottom: -0.46em; list-style-type: disc; margin-left: 30px; padding-left: 0px; font-size: 21px; margin-top: 1.05em;">
  2820. You still need to implement the<span>&nbsp;</span><em class="rm"
  2821. style="box-sizing: inherit; font-style: italic;">Enter</em><span>&nbsp;</span>key
  2822. support and do something with the damn pasting.</li>
  2823. <li class="fe ff de bk fg b fh rw fj rx fl ry fn rz fp sa fr rt ru rv"
  2824. data-selectable-paragraph="" id="1fdf"
  2825. style="box-sizing: inherit; font-weight: 400; font-style: normal; color: rgba(0, 0, 0, 0.84); line-height: 1.58; letter-spacing: -0.004em; font-family: Georgia, Cambria, &quot;Times New Roman&quot;, Times, serif; margin-bottom: -0.46em; list-style-type: disc; margin-left: 30px; padding-left: 0px; font-size: 21px; margin-top: 1.05em;">
  2826. You&rsquo;ve just noticed that you also need to reimplement<span>&nbsp;</span><em class="rm"
  2827. style="box-sizing: inherit; font-style: italic;">Backspace</em><span>&nbsp;</span>and<span>&nbsp;</span><em
  2828. class="rm"
  2829. style="box-sizing: inherit; font-style: italic;">Delete</em><span>&nbsp;</span>key
  2830. support in<span>&nbsp;</span><a class="at cg fs ft fu fv"
  2831. href="http://code.google.com/p/chromium/issues/detail?id=226941" rel="noopener nofollow"
  2832. style="box-sizing: inherit; color: inherit; text-decoration: none; -webkit-tap-highlight-color: transparent; background-repeat: repeat-x; background-image: url(&quot;data:image/svg+xml;utf8,&lt;svg preserveAspectRatio=\&quot;none\&quot; viewBox=\&quot;0 0 1 1\&quot; xmlns=\&quot;http://www.w3.org/2000/svg\&quot;&gt;&lt;line x1=\&quot;0\&quot; y1=\&quot;0\&quot; x2=\&quot;1\&quot; y2=\&quot;1\&quot; stroke=\&quot;rgba(0, 0, 0, 0.84)\&quot; /&gt;&lt;/svg&gt;&quot;); background-size: 1px 1px; background-position: 0px calc(1em + 1px);"
  2833. target="_blank">Blink</a><span>&nbsp;</span>and<span>&nbsp;</span><a
  2834. class="at cg fs ft fu fv" href="https://bugs.webkit.org/show_bug.cgi?id=114791"
  2835. rel="noopener nofollow"
  2836. style="box-sizing: inherit; color: inherit; text-decoration: none; -webkit-tap-highlight-color: transparent; background-repeat: repeat-x; background-image: url(&quot;data:image/svg+xml;utf8,&lt;svg preserveAspectRatio=\&quot;none\&quot; viewBox=\&quot;0 0 1 1\&quot; xmlns=\&quot;http://www.w3.org/2000/svg\&quot;&gt;&lt;line x1=\&quot;0\&quot; y1=\&quot;0\&quot; x2=\&quot;1\&quot; y2=\&quot;1\&quot; stroke=\&quot;rgba(0, 0, 0, 0.84)\&quot; /&gt;&lt;/svg&gt;&quot;); background-size: 1px 1px; background-position: 0px calc(1em + 1px);"
  2837. target="_blank">WebKit</a><span>&nbsp;</span>as these engines love inline styles far
  2838. more than you do.</li>
  2839. <li class="fe ff de bk fg b fh rw fj rx fl ry fn rz fp sa fr rt ru rv"
  2840. data-selectable-paragraph="" id="1efa"
  2841. style="box-sizing: inherit; font-weight: 400; font-style: normal; color: rgba(0, 0, 0, 0.84); line-height: 1.58; letter-spacing: -0.004em; font-family: Georgia, Cambria, &quot;Times New Roman&quot;, Times, serif; margin-bottom: -0.46em; list-style-type: disc; margin-left: 30px; padding-left: 0px; font-size: 21px; margin-top: 1.05em;">
  2842. You&rsquo;ve noticed that some engines return a<span>&nbsp;</span><em class="rm"
  2843. style="box-sizing: inherit; font-style: italic;">href</em><span>&nbsp;</span>attribute
  2844. with an absolute URL even though you made a link with a relative URL.</li>
  2845. <li class="fe ff de bk fg b fh rw fj rx fl ry fn rz fp sa fr rt ru rv"
  2846. data-selectable-paragraph="" id="4235"
  2847. style="box-sizing: inherit; font-weight: 400; font-style: normal; color: rgba(0, 0, 0, 0.84); line-height: 1.58; letter-spacing: -0.004em; font-family: Georgia, Cambria, &quot;Times New Roman&quot;, Times, serif; margin-bottom: -0.46em; list-style-type: disc; margin-left: 30px; padding-left: 0px; font-size: 21px; margin-top: 1.05em;">
  2848. Gosh&hellip; we only talked about four most basic features &mdash; when will you add support
  2849. for images?</li>
  2850. <li class="fe ff de bk fg b fh rw fj rx fl ry fn rz fp sa fr rt ru rv"
  2851. data-selectable-paragraph="" id="c34d"
  2852. style="box-sizing: inherit; font-weight: 400; font-style: normal; color: rgba(0, 0, 0, 0.84); line-height: 1.58; letter-spacing: -0.004em; font-family: Georgia, Cambria, &quot;Times New Roman&quot;, Times, serif; margin-bottom: -0.46em; list-style-type: disc; margin-left: 30px; padding-left: 0px; font-size: 21px; margin-top: 1.05em;">
  2853. Didn&rsquo;t you know that the selection has a direction?</li>
  2854. </ul>
  2855. <p class="fe ff de bk fg b fh fi fj fk fl fm fn fo fp fq fr ez" data-selectable-paragraph=""
  2856. id="ad67"
  2857. style="box-sizing: inherit; margin: 2em 0px -0.46em; font-weight: 400; font-style: normal; color: rgba(0, 0, 0, 0.84); word-break: break-word; line-height: 1.58; letter-spacing: -0.004em; font-family: Georgia, Cambria, &quot;Times New Roman&quot;, Times, serif; font-size: 21px;">
  2858. Enough. I think I&rsquo;ve made the point.<span>&nbsp;</span><a class="at cg fs ft fu fv"
  2859. href="https://example.test/why-contenteditable-is-terrible-122d8a40e480"
  2860. rel="noopener"
  2861. style="box-sizing: inherit; color: inherit; text-decoration: none; -webkit-tap-highlight-color: transparent; background-repeat: repeat-x; background-image: url(&quot;data:image/svg+xml;utf8,&lt;svg preserveAspectRatio=\&quot;none\&quot; viewBox=\&quot;0 0 1 1\&quot; xmlns=\&quot;http://www.w3.org/2000/svg\&quot;&gt;&lt;line x1=\&quot;0\&quot; y1=\&quot;0\&quot; x2=\&quot;1\&quot; y2=\&quot;1\&quot; stroke=\&quot;rgba(0, 0, 0, 0.84)\&quot; /&gt;&lt;/svg&gt;&quot;); background-size: 1px 1px; background-position: 0px calc(1em + 1px);"
  2862. target="_blank">ContentEditable is terrible</a>. Related APIs and their implementations such
  2863. as selection, clipboard and drag and drop are incomplete and/or inconsistent and buggy. Range
  2864. API is complicated and inconvenient. But your fridge isn&rsquo;t empty yet and now you know what
  2865. to do.</p>
  2866. </div>
  2867. </div>
  2868. </section>
  2869. <hr class="re dz ip rf rg jc rh ri rj rk rl"
  2870. style="box-sizing: inherit; font-weight: 300; font-size: 28px; text-align: center; font-family: Georgia, Cambria, &quot;Times New Roman&quot;, Times, serif; border: none; margin-top: 30px;" />
  2871. <section class="ez fa fb fc fd" style="box-sizing: inherit; word-break: break-word; overflow-wrap: break-word;">
  2872. <div class="n p" style="box-sizing: inherit; display: flex; justify-content: center;">
  2873. <div class="ac ae af ag ah dn aj ak"
  2874. style="box-sizing: inherit; min-width: 0px; width: 680px; max-width: 680px; margin: 0px 64px;">
  2875. <h1 class="sb sc de bk bj io qo sd qq se sf sg sh si sj sk sl" data-selectable-paragraph=""
  2876. id="b63d"
  2877. style="box-sizing: inherit; margin: 1.25em 0px -0.28em; font-family: &quot;Lucida Grande&quot;, &quot;Lucida Sans Unicode&quot;, &quot;Lucida Sans&quot;, Geneva, Arial, sans-serif; font-style: normal; color: rgba(0, 0, 0, 0.84); font-weight: 600; line-height: 1.12; letter-spacing: -0.022em; font-size: 34px;">
  2878. Goodbye, contentEditable</h1>
  2879. <p class="fe ff de bk fg b fh sm fj sn fl so fn sp fp sq fr ez" data-selectable-paragraph=""
  2880. id="2bea"
  2881. style="box-sizing: inherit; margin: 0.86em 0px -0.46em; font-weight: 400; font-style: normal; color: rgba(0, 0, 0, 0.84); word-break: break-word; line-height: 1.58; letter-spacing: -0.004em; font-family: Georgia, Cambria, &quot;Times New Roman&quot;, Times, serif; font-size: 21px;">
  2882. The idea is simple. ContentEditable is evil and the Selection API is its evil twin. Avoid them
  2883. as much as possible. So what&rsquo;s the plan?</p>
  2884. <ol style="box-sizing: inherit; margin: 0px; padding: 0px; list-style: none none;">
  2885. <li class="fe ff de bk fg b fh fi fj fk fl fm fn fo fp fq fr sr ru rv"
  2886. data-selectable-paragraph="" id="0cb0"
  2887. style="box-sizing: inherit; font-weight: 400; font-style: normal; color: rgba(0, 0, 0, 0.84); line-height: 1.58; letter-spacing: -0.004em; font-family: Georgia, Cambria, &quot;Times New Roman&quot;, Times, serif; margin-bottom: -0.46em; margin-left: 30px; padding-left: 0px; list-style-type: decimal; font-size: 21px; margin-top: 2em;">
  2888. You need a custom selection system. It must be doable nowadays to get position (represented
  2889. by a range, but we&rsquo;ll simplify this in a moment) in the DOM on<span>&nbsp;</span><em
  2890. class="rm" style="box-sizing: inherit; font-style: italic;">mousedown</em>/<em
  2891. class="rm" style="box-sizing: inherit; font-style: italic;">mousemove</em>. You&rsquo;ll
  2892. display your custom caret (whoa&hellip; you can control its style now) and text selection
  2893. (it&rsquo;s a simple<span>&nbsp;</span><em class="rm"
  2894. style="box-sizing: inherit; font-style: italic;">&lt;span&gt;</em>).</li>
  2895. <li class="fe ff de bk fg b fh rw fj rx fl ry fn rz fp sa fr sr ru rv"
  2896. data-selectable-paragraph="" id="9e21"
  2897. style="box-sizing: inherit; font-weight: 400; font-style: normal; color: rgba(0, 0, 0, 0.84); line-height: 1.58; letter-spacing: -0.004em; font-family: Georgia, Cambria, &quot;Times New Roman&quot;, Times, serif; margin-bottom: -0.46em; margin-left: 30px; padding-left: 0px; list-style-type: decimal; font-size: 21px; margin-top: 1.05em;">
  2898. You need to handle typing. Let&rsquo;s listen to the keyboard events and insert given
  2899. character into the editor.</li>
  2900. <li class="fe ff de bk fg b fh rw fj rx fl ry fn rz fp sa fr sr ru rv"
  2901. data-selectable-paragraph="" id="f390"
  2902. style="box-sizing: inherit; font-weight: 400; font-style: normal; color: rgba(0, 0, 0, 0.84); line-height: 1.58; letter-spacing: -0.004em; font-family: Georgia, Cambria, &quot;Times New Roman&quot;, Times, serif; margin-bottom: -0.46em; margin-left: 30px; padding-left: 0px; list-style-type: decimal; font-size: 21px; margin-top: 1.05em;">
  2903. You need to handle navigation using the<span>&nbsp;</span><em class="rm"
  2904. style="box-sizing: inherit; font-style: italic;">Arrow</em><span>&nbsp;</span>keys. Left
  2905. and right seem easy, up and down a bit trickier but if you have point 1, you&rsquo;ll do
  2906. this too. Wait, there&rsquo;s the<span>&nbsp;</span><em class="rm"
  2907. style="box-sizing: inherit; font-style: italic;">Alt</em><span>&nbsp;</span>modifier
  2908. which makes the<span>&nbsp;</span><em class="rm"
  2909. style="box-sizing: inherit; font-style: italic;">Left</em><span>&nbsp;</span>and<span>&nbsp;</span><em
  2910. class="rm" style="box-sizing: inherit; font-style: italic;">Right
  2911. Arrow</em><span>&nbsp;</span>keys jump entire words. But of course you&rsquo;ll look for
  2912. spaces in the text and that&rsquo;s it &mdash; told you, it&rsquo;s trivial!</li>
  2913. <li class="fe ff de bk fg b fh rw fj rx fl ry fn rz fp sa fr sr ru rv"
  2914. data-selectable-paragraph="" id="ec90"
  2915. style="box-sizing: inherit; font-weight: 400; font-style: normal; color: rgba(0, 0, 0, 0.84); line-height: 1.58; letter-spacing: -0.004em; font-family: Georgia, Cambria, &quot;Times New Roman&quot;, Times, serif; margin-bottom: -0.46em; margin-left: 30px; padding-left: 0px; list-style-type: decimal; font-size: 21px; margin-top: 1.05em;">
  2916. Then you need to do something with pasting. You see that with the Clipboard API you can
  2917. listen to the paste event on the document and retrieve the data from the data transfer. You
  2918. can also use the old<span>&nbsp;</span><a class="at cg fs ft fu fv"
  2919. href="http://docs.ckeditor.com/#!/guide/dev_clipboard-section-paste-bin"
  2920. rel="noopener nofollow"
  2921. style="box-sizing: inherit; color: inherit; text-decoration: none; -webkit-tap-highlight-color: transparent; background-repeat: repeat-x; background-image: url(&quot;data:image/svg+xml;utf8,&lt;svg preserveAspectRatio=\&quot;none\&quot; viewBox=\&quot;0 0 1 1\&quot; xmlns=\&quot;http://www.w3.org/2000/svg\&quot;&gt;&lt;line x1=\&quot;0\&quot; y1=\&quot;0\&quot; x2=\&quot;1\&quot; y2=\&quot;1\&quot; stroke=\&quot;rgba(0, 0, 0, 0.84)\&quot; /&gt;&lt;/svg&gt;&quot;); background-size: 1px 1px; background-position: 0px calc(1em + 1px);"
  2922. target="_blank">paste bin mechanism</a>.</li>
  2923. </ol>
  2924. <p class="fe ff de bk fg b fh fi fj fk fl fm fn fo fp fq fr ez" data-selectable-paragraph=""
  2925. id="5fe0"
  2926. style="box-sizing: inherit; margin: 2em 0px -0.46em; font-weight: 400; font-style: normal; color: rgba(0, 0, 0, 0.84); word-break: break-word; line-height: 1.58; letter-spacing: -0.004em; font-family: Georgia, Cambria, &quot;Times New Roman&quot;, Times, serif; font-size: 21px;">
  2927. The world is beautiful again. You&rsquo;re surrounded by well known APIs or your own code which
  2928. you can finally control. Say bye to that terrible feeling of being hopeless. You use the
  2929. Selection API and ranges only for a direct interaction with the browser, but internally you
  2930. implemented different mechanisms, more appropriate for text editing. No need to work on that
  2931. ambiguous DOM. Only text, styles, indexes and translation to DOM. Applying bold is now a simple
  2932. algorithm &mdash; add the style to selected letters and your automatic translation will update
  2933. the DOM.</p>
  2934. <p class="fe ff de bk fg b fh fi fj fk fl fm fn fo fp fq fr ez" data-selectable-paragraph=""
  2935. id="b7d3"
  2936. style="box-sizing: inherit; margin: 2em 0px -0.46em; font-weight: 400; font-style: normal; color: rgba(0, 0, 0, 0.84); word-break: break-word; line-height: 1.58; letter-spacing: -0.004em; font-family: Georgia, Cambria, &quot;Times New Roman&quot;, Times, serif; font-size: 21px;">
  2937. The food in the fridge is scarce, so you publish your project on<span>&nbsp;</span><a
  2938. class="at cg fs ft fu fv" href="http://github.com/" rel="noopener nofollow"
  2939. style="box-sizing: inherit; color: inherit; text-decoration: none; -webkit-tap-highlight-color: transparent; background-repeat: repeat-x; background-image: url(&quot;data:image/svg+xml;utf8,&lt;svg preserveAspectRatio=\&quot;none\&quot; viewBox=\&quot;0 0 1 1\&quot; xmlns=\&quot;http://www.w3.org/2000/svg\&quot;&gt;&lt;line x1=\&quot;0\&quot; y1=\&quot;0\&quot; x2=\&quot;1\&quot; y2=\&quot;1\&quot; stroke=\&quot;rgba(0, 0, 0, 0.84)\&quot; /&gt;&lt;/svg&gt;&quot;); background-size: 1px 1px; background-position: 0px calc(1em + 1px);"
  2940. target="_blank">GitHub</a>. You start receiving first bug reports, but no worries, no
  2941. software is perfect from day one.</p>
  2942. <blockquote class="ss st su"
  2943. style="box-sizing: inherit; margin: 0px 0px 0px -20px; box-shadow: rgba(0, 0, 0, 0.84) 3px 0px 0px 0px inset; padding-left: 23px;">
  2944. <p class="fe ff de rm fg b fh fi fj fk fl fm fn fo fp fq fr ez" data-selectable-paragraph=""
  2945. id="c90a"
  2946. style="box-sizing: inherit; margin: 2em 0px -0.46em; font-weight: 400; color: rgba(0, 0, 0, 0.84); word-break: break-word; line-height: 1.58; letter-spacing: -0.004em; font-family: Georgia, Cambria, &quot;Times New Roman&quot;, Times, serif; font-style: italic; font-size: 21px;">
  2947. <strong class="fg sv"
  2948. style="box-sizing: inherit; font-family: Georgia, Cambria, &quot;Times New Roman&quot;, Times, serif; font-weight: 700;">How
  2949. Do I Type Polish Characters?</strong></p>
  2950. <p class="fe ff de rm fg b fh fi fj fk fl fm fn fo fp fq fr ez" data-selectable-paragraph=""
  2951. id="50de"
  2952. style="box-sizing: inherit; margin: 2em 0px -0.46em; font-weight: 400; color: rgba(0, 0, 0, 0.84); word-break: break-word; line-height: 1.58; letter-spacing: -0.004em; font-family: Georgia, Cambria, &quot;Times New Roman&quot;, Times, serif; font-style: italic; font-size: 21px;">
  2953. When I press<span>&nbsp;</span><em class="bk"
  2954. style="box-sizing: inherit; font-style: normal;">Alt+L</em><span>&nbsp;</span>I expect
  2955. that &lsquo;ł&rsquo; is inserted, but your editor inserts &lsquo;l&rsquo;.</p>
  2956. </blockquote>
  2957. <p class="fe ff de bk fg b fh fi fj fk fl fm fn fo fp fq fr ez" data-selectable-paragraph=""
  2958. id="aab3"
  2959. style="box-sizing: inherit; margin: 2em 0px -0.46em; font-weight: 400; font-style: normal; color: rgba(0, 0, 0, 0.84); word-break: break-word; line-height: 1.58; letter-spacing: -0.004em; font-family: Georgia, Cambria, &quot;Times New Roman&quot;, Times, serif; font-size: 21px;">
  2960. Right, let&rsquo;s see what you can do. You don&rsquo;t know the keyboard layout, so you
  2961. can&rsquo;t simply check for the<span>&nbsp;</span><em class="rm"
  2962. style="box-sizing: inherit; font-style: italic;">Alt</em><span>&nbsp;</span>modifier.
  2963. Besides, there&rsquo;re too many languages. OK, there&rsquo;s<span>&nbsp;</span><a
  2964. class="at cg fs ft fu fv"
  2965. href="https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent/key"
  2966. rel="noopener nofollow"
  2967. style="box-sizing: inherit; color: inherit; text-decoration: none; -webkit-tap-highlight-color: transparent; background-repeat: repeat-x; background-image: url(&quot;data:image/svg+xml;utf8,&lt;svg preserveAspectRatio=\&quot;none\&quot; viewBox=\&quot;0 0 1 1\&quot; xmlns=\&quot;http://www.w3.org/2000/svg\&quot;&gt;&lt;line x1=\&quot;0\&quot; y1=\&quot;0\&quot; x2=\&quot;1\&quot; y2=\&quot;1\&quot; stroke=\&quot;rgba(0, 0, 0, 0.84)\&quot; /&gt;&lt;/svg&gt;&quot;); background-size: 1px 1px; background-position: 0px calc(1em + 1px);"
  2968. target="_blank"><em class="rm"
  2969. style="box-sizing: inherit; font-style: italic;">KeyboardEvent.key</em></a><span>&nbsp;</span>from<span>&nbsp;</span><a
  2970. class="at cg fs ft fu fv" href="https://w3c.github.io/uievents/" rel="noopener nofollow"
  2971. style="box-sizing: inherit; color: inherit; text-decoration: none; -webkit-tap-highlight-color: transparent; background-repeat: repeat-x; background-image: url(&quot;data:image/svg+xml;utf8,&lt;svg preserveAspectRatio=\&quot;none\&quot; viewBox=\&quot;0 0 1 1\&quot; xmlns=\&quot;http://www.w3.org/2000/svg\&quot;&gt;&lt;line x1=\&quot;0\&quot; y1=\&quot;0\&quot; x2=\&quot;1\&quot; y2=\&quot;1\&quot; stroke=\&quot;rgba(0, 0, 0, 0.84)\&quot; /&gt;&lt;/svg&gt;&quot;); background-size: 1px 1px; background-position: 0px calc(1em + 1px);"
  2972. target="_blank">DOM level 3</a><span>&nbsp;</span>but so far it only works in IEs and
  2973. Firefox.<span>&nbsp;</span><a class="at cg fs ft fu fv"
  2974. href="https://code.google.com/p/chromium/issues/detail?id=263724" rel="noopener nofollow"
  2975. style="box-sizing: inherit; color: inherit; text-decoration: none; -webkit-tap-highlight-color: transparent; background-repeat: repeat-x; background-image: url(&quot;data:image/svg+xml;utf8,&lt;svg preserveAspectRatio=\&quot;none\&quot; viewBox=\&quot;0 0 1 1\&quot; xmlns=\&quot;http://www.w3.org/2000/svg\&quot;&gt;&lt;line x1=\&quot;0\&quot; y1=\&quot;0\&quot; x2=\&quot;1\&quot; y2=\&quot;1\&quot; stroke=\&quot;rgba(0, 0, 0, 0.84)\&quot; /&gt;&lt;/svg&gt;&quot;); background-size: 1px 1px; background-position: 0px calc(1em + 1px);"
  2976. target="_blank">Blink will support</a><span>&nbsp;</span>it soon, too, so you can wait.
  2977. There&rsquo;s a high chance that all major browsers will support it within a reasonable time.
  2978. </p>
  2979. <blockquote class="ss st su"
  2980. style="box-sizing: inherit; margin: 0px 0px 0px -20px; box-shadow: rgba(0, 0, 0, 0.84) 3px 0px 0px 0px inset; padding-left: 23px;">
  2981. <p class="fe ff de rm fg b fh fi fj fk fl fm fn fo fp fq fr ez" data-selectable-paragraph=""
  2982. id="6129"
  2983. style="box-sizing: inherit; margin: 2em 0px -0.46em; font-weight: 400; color: rgba(0, 0, 0, 0.84); word-break: break-word; line-height: 1.58; letter-spacing: -0.004em; font-family: Georgia, Cambria, &quot;Times New Roman&quot;, Times, serif; font-style: italic; font-size: 21px;">
  2984. <strong class="fg sv"
  2985. style="box-sizing: inherit; font-family: Georgia, Cambria, &quot;Times New Roman&quot;, Times, serif; font-weight: 700;">How
  2986. Do I Type Accents?</strong></p>
  2987. <p class="fe ff de rm fg b fh fi fj fk fl fm fn fo fp fq fr ez" data-selectable-paragraph=""
  2988. id="2495"
  2989. style="box-sizing: inherit; margin: 2em 0px -0.46em; font-weight: 400; color: rgba(0, 0, 0, 0.84); word-break: break-word; line-height: 1.58; letter-spacing: -0.004em; font-family: Georgia, Cambria, &quot;Times New Roman&quot;, Times, serif; font-style: italic; font-size: 21px;">
  2990. I have a Spanish keyboard layout. When I press &lsquo;`&rsquo; and then a letter (e.g. `u`)
  2991. I expect to first see the &lsquo;tick&rsquo; and then letter &lsquo;&ugrave;&rsquo; in the
  2992. same place.</p>
  2993. </blockquote>
  2994. <p class="fe ff de bk fg b fh fi fj fk fl fm fn fo fp fq fr ez" data-selectable-paragraph=""
  2995. id="4a53"
  2996. style="box-sizing: inherit; margin: 2em 0px -0.46em; font-weight: 400; font-style: normal; color: rgba(0, 0, 0, 0.84); word-break: break-word; line-height: 1.58; letter-spacing: -0.004em; font-family: Georgia, Cambria, &quot;Times New Roman&quot;, Times, serif; font-size: 21px;">
  2997. Wait, what? Does he say that two keys are transformed into one letter? That&rsquo;s
  2998. crazy&hellip; you can handle these special cases somehow (if you can find out what keyboard
  2999. layout is in use), but let&rsquo;s hope that there aren&rsquo;t many languages which work this
  3000. way.</p>
  3001. <blockquote class="ss st su"
  3002. style="box-sizing: inherit; margin: 0px 0px 0px -20px; box-shadow: rgba(0, 0, 0, 0.84) 3px 0px 0px 0px inset; padding-left: 23px;">
  3003. <p class="fe ff de rm fg b fh fi fj fk fl fm fn fo fp fq fr ez" data-selectable-paragraph=""
  3004. id="abb9"
  3005. style="box-sizing: inherit; margin: 2em 0px -0.46em; font-weight: 400; color: rgba(0, 0, 0, 0.84); word-break: break-word; line-height: 1.58; letter-spacing: -0.004em; font-family: Georgia, Cambria, &quot;Times New Roman&quot;, Times, serif; font-style: italic; font-size: 21px;">
  3006. <strong class="fg sv"
  3007. style="box-sizing: inherit; font-family: Georgia, Cambria, &quot;Times New Roman&quot;, Times, serif; font-weight: 700;">How
  3008. Do I Type Hiragana Characters?</strong></p>
  3009. <p class="fe ff de rm fg b fh fi fj fk fl fm fn fo fp fq fr ez" data-selectable-paragraph=""
  3010. id="f7a1"
  3011. style="box-sizing: inherit; margin: 2em 0px -0.46em; font-weight: 400; color: rgba(0, 0, 0, 0.84); word-break: break-word; line-height: 1.58; letter-spacing: -0.004em; font-family: Georgia, Cambria, &quot;Times New Roman&quot;, Times, serif; font-style: italic; font-size: 21px;">
  3012. When I start typing this popup should appear and the word I&rsquo;m currently typing should
  3013. be underlined. It&rsquo;s the so-called composition.</p>
  3014. </blockquote>
  3015. <figure class="rn ro rp rq rr gz cl cm paragraph-image"
  3016. style="box-sizing: inherit; margin: 56px auto 0px; clear: both;">
  3017. <div class="sx sy gl sz ak"
  3018. style="box-sizing: inherit; width: 680px; position: relative; transition: transform 300ms cubic-bezier(0.2, 0, 0.2, 1) 0s; cursor: zoom-in; z-index: auto;">
  3019. <div class="cl cm sw"
  3020. style="box-sizing: inherit; margin-left: auto; margin-right: auto; max-width: 2008px;">
  3021. <div class="qd r gl qe"
  3022. style="box-sizing: inherit; display: block; position: relative; margin: auto; background-color: rgba(0, 0, 0, 0.05);">
  3023. <div class="ta r"
  3024. style="box-sizing: inherit; display: block; padding-bottom: 171.352px;">
  3025. <div class="fw qa dh t u hw ak cz qb qc"
  3026. style="box-sizing: inherit; top: 0px; left: 0px; width: 680px; overflow: hidden; position: absolute; opacity: 0; height: 171.352px; transition: opacity 100ms ease 400ms; will-change: transform; transform: translateZ(0px);">
  3027. <img class="dh t u hw ak qg qh as tw" height="506" role="presentation"
  3028. src="https://example.test/max/60/1*yhycdntbbkwkR0pd6cT8yA.png?q=20"
  3029. style="box-sizing: inherit; vertical-align: middle; top: 0px; left: 0px; width: 680px; visibility: hidden; position: absolute; height: 171.352px; filter: blur(20px); transform: scale(1.1); transition: visibility 0ms ease 400ms;"
  3030. width="2008" /></div>
  3031. <img class="iz tt dh t u hw ak hu" height="506" role="presentation"
  3032. src="https://example.test/max/4016/1*yhycdntbbkwkR0pd6cT8yA.png"
  3033. style="box-sizing: inherit; vertical-align: middle; top: 0px; left: 0px; width: 680px; position: absolute; background: rgb(255, 255, 255); height: 171.352px; opacity: 1; transition: opacity 400ms ease 0ms;"
  3034. width="2008" />
  3035. </div>
  3036. </div>
  3037. </div>
  3038. </div>
  3039. </figure>
  3040. <p class="fe ff de bk fg b fh fi fj fk fl fm fn fo fp fq fr ez" data-selectable-paragraph=""
  3041. id="e6e0"
  3042. style="box-sizing: inherit; margin: 2em 0px -0.46em; font-weight: 400; font-style: normal; color: rgba(0, 0, 0, 0.84); word-break: break-word; line-height: 1.58; letter-spacing: -0.004em; font-family: Georgia, Cambria, &quot;Times New Roman&quot;, Times, serif; font-size: 21px;">
  3043. Right,<span>&nbsp;</span><a class="at cg fs ft fu fv"
  3044. href="https://developer.mozilla.org/en-US/docs/Web/Events/compositionstart"
  3045. rel="noopener nofollow"
  3046. style="box-sizing: inherit; color: inherit; text-decoration: none; -webkit-tap-highlight-color: transparent; background-repeat: repeat-x; background-image: url(&quot;data:image/svg+xml;utf8,&lt;svg preserveAspectRatio=\&quot;none\&quot; viewBox=\&quot;0 0 1 1\&quot; xmlns=\&quot;http://www.w3.org/2000/svg\&quot;&gt;&lt;line x1=\&quot;0\&quot; y1=\&quot;0\&quot; x2=\&quot;1\&quot; y2=\&quot;1\&quot; stroke=\&quot;rgba(0, 0, 0, 0.84)\&quot; /&gt;&lt;/svg&gt;&quot;); background-size: 1px 1px; background-position: 0px calc(1em + 1px);"
  3047. target="_blank">composition events</a>. You&rsquo;re sure you can do something with them (if
  3048. only the browser would fire them). What&rsquo;s worse, you find out that
  3049. the<span>&nbsp;</span><a class="at cg fs ft fu fv"
  3050. href="https://en.wikipedia.org/wiki/Input_method" rel="noopener nofollow"
  3051. style="box-sizing: inherit; color: inherit; text-decoration: none; -webkit-tap-highlight-color: transparent; background-repeat: repeat-x; background-image: url(&quot;data:image/svg+xml;utf8,&lt;svg preserveAspectRatio=\&quot;none\&quot; viewBox=\&quot;0 0 1 1\&quot; xmlns=\&quot;http://www.w3.org/2000/svg\&quot;&gt;&lt;line x1=\&quot;0\&quot; y1=\&quot;0\&quot; x2=\&quot;1\&quot; y2=\&quot;1\&quot; stroke=\&quot;rgba(0, 0, 0, 0.84)\&quot; /&gt;&lt;/svg&gt;&quot;); background-size: 1px 1px; background-position: 0px calc(1em + 1px);"
  3052. target="_blank">Input Method Engine</a><span>&nbsp;</span>works differently in every OS and
  3053. is often integrated with the OS (e.g. it learns new words and implements smart autocompletion).
  3054. You&rsquo;re beginning to feel hopeless once again. But then a brilliant idea comes to your mind
  3055. &mdash; you can use a hidden textarea from which you&rsquo;ll read the input. If you position it
  3056. close to the caret you&rsquo;ll even have the popup. You only lose contextual suggestions.
  3057. There&rsquo;s also some work on<span>&nbsp;</span><a class="at cg fs ft fu fv"
  3058. href="http://www.w3.org/TR/ime-api/" rel="noopener nofollow"
  3059. style="box-sizing: inherit; color: inherit; text-decoration: none; -webkit-tap-highlight-color: transparent; background-repeat: repeat-x; background-image: url(&quot;data:image/svg+xml;utf8,&lt;svg preserveAspectRatio=\&quot;none\&quot; viewBox=\&quot;0 0 1 1\&quot; xmlns=\&quot;http://www.w3.org/2000/svg\&quot;&gt;&lt;line x1=\&quot;0\&quot; y1=\&quot;0\&quot; x2=\&quot;1\&quot; y2=\&quot;1\&quot; stroke=\&quot;rgba(0, 0, 0, 0.84)\&quot; /&gt;&lt;/svg&gt;&quot;); background-size: 1px 1px; background-position: 0px calc(1em + 1px);"
  3060. target="_blank">opening the IME API</a>. One day you&rsquo;ll remove all the hacks!</p>
  3061. <blockquote class="ss st su"
  3062. style="box-sizing: inherit; margin: 0px 0px 0px -20px; box-shadow: rgba(0, 0, 0, 0.84) 3px 0px 0px 0px inset; padding-left: 23px;">
  3063. <p class="fe ff de rm fg b fh fi fj fk fl fm fn fo fp fq fr ez" data-selectable-paragraph=""
  3064. id="fece"
  3065. style="box-sizing: inherit; margin: 2em 0px -0.46em; font-weight: 400; color: rgba(0, 0, 0, 0.84); word-break: break-word; line-height: 1.58; letter-spacing: -0.004em; font-family: Georgia, Cambria, &quot;Times New Roman&quot;, Times, serif; font-style: italic; font-size: 21px;">
  3066. <strong class="fg sv"
  3067. style="box-sizing: inherit; font-family: Georgia, Cambria, &quot;Times New Roman&quot;, Times, serif; font-weight: 700;">How
  3068. Do I Type Using My iPad?</strong></p>
  3069. <p class="fe ff de rm fg b fh fi fj fk fl fm fn fo fp fq fr ez" data-selectable-paragraph=""
  3070. id="1009"
  3071. style="box-sizing: inherit; margin: 2em 0px -0.46em; font-weight: 400; color: rgba(0, 0, 0, 0.84); word-break: break-word; line-height: 1.58; letter-spacing: -0.004em; font-family: Georgia, Cambria, &quot;Times New Roman&quot;, Times, serif; font-style: italic; font-size: 21px;">
  3072. When I tap the editor, the keyboard does not appear.</p>
  3073. </blockquote>
  3074. <p class="fe ff de bk fg b fh fi fj fk fl fm fn fo fp fq fr ez" data-selectable-paragraph=""
  3075. id="598a"
  3076. style="box-sizing: inherit; margin: 2em 0px -0.46em; font-weight: 400; font-style: normal; color: rgba(0, 0, 0, 0.84); word-break: break-word; line-height: 1.58; letter-spacing: -0.004em; font-family: Georgia, Cambria, &quot;Times New Roman&quot;, Times, serif; font-size: 21px;">
  3077. No focus in an editable field = no keyboard. Surely the trick with a hidden textarea will work.
  3078. Will it? How do you paste now?</p>
  3079. <blockquote class="ss st su"
  3080. style="box-sizing: inherit; margin: 0px 0px 0px -20px; box-shadow: rgba(0, 0, 0, 0.84) 3px 0px 0px 0px inset; padding-left: 23px;">
  3081. <p class="fe ff de rm fg b fh fi fj fk fl fm fn fo fp fq fr ez" data-selectable-paragraph=""
  3082. id="39b6"
  3083. style="box-sizing: inherit; margin: 2em 0px -0.46em; font-weight: 400; color: rgba(0, 0, 0, 0.84); word-break: break-word; line-height: 1.58; letter-spacing: -0.004em; font-family: Georgia, Cambria, &quot;Times New Roman&quot;, Times, serif; font-style: italic; font-size: 21px;">
  3084. <strong class="fg sv"
  3085. style="box-sizing: inherit; font-family: Georgia, Cambria, &quot;Times New Roman&quot;, Times, serif; font-weight: 700;">Alt+Left/Right
  3086. Arrow Should Jump Over One Word</strong></p>
  3087. <p class="fe ff de rm fg b fh fi fj fk fl fm fn fo fp fq fr ez" data-selectable-paragraph=""
  3088. id="6269"
  3089. style="box-sizing: inherit; margin: 2em 0px -0.46em; font-weight: 400; color: rgba(0, 0, 0, 0.84); word-break: break-word; line-height: 1.58; letter-spacing: -0.004em; font-family: Georgia, Cambria, &quot;Times New Roman&quot;, Times, serif; font-style: italic; font-size: 21px;">
  3090. This text &lsquo;ພາສາຈີນແມ່ນພາສາໜຶ່ງທີ່ເວົ້າໃນປະເທດຈີນ.&rsquo; contains many words, but your
  3091. editor handles it as one word.</p>
  3092. </blockquote>
  3093. <p class="fe ff de bk fg b fh fi fj fk fl fm fn fo fp fq fr ez" data-selectable-paragraph=""
  3094. id="c890"
  3095. style="box-sizing: inherit; margin: 2em 0px -0.46em; font-weight: 400; font-style: normal; color: rgba(0, 0, 0, 0.84); word-break: break-word; line-height: 1.58; letter-spacing: -0.004em; font-family: Georgia, Cambria, &quot;Times New Roman&quot;, Times, serif; font-size: 21px;">
  3096. But where are the spaces?!</p>
  3097. <blockquote class="ss st su"
  3098. style="box-sizing: inherit; margin: 0px 0px 0px -20px; box-shadow: rgba(0, 0, 0, 0.84) 3px 0px 0px 0px inset; padding-left: 23px;">
  3099. <p class="fe ff de rm fg b fh fi fj fk fl fm fn fo fp fq fr ez" data-selectable-paragraph=""
  3100. id="a8f2"
  3101. style="box-sizing: inherit; margin: 2em 0px -0.46em; font-weight: 400; color: rgba(0, 0, 0, 0.84); word-break: break-word; line-height: 1.58; letter-spacing: -0.004em; font-family: Georgia, Cambria, &quot;Times New Roman&quot;, Times, serif; font-style: italic; font-size: 21px;">
  3102. <strong class="fg sv"
  3103. style="box-sizing: inherit; font-family: Georgia, Cambria, &quot;Times New Roman&quot;, Times, serif; font-weight: 700;">Undoing
  3104. by Shaking Does Not Work on iPhone</strong></p>
  3105. </blockquote>
  3106. <p class="fe ff de bk fg b fh fi fj fk fl fm fn fo fp fq fr ez" data-selectable-paragraph=""
  3107. id="fb28"
  3108. style="box-sizing: inherit; margin: 2em 0px -0.46em; font-weight: 400; font-style: normal; color: rgba(0, 0, 0, 0.84); word-break: break-word; line-height: 1.58; letter-spacing: -0.004em; font-family: Georgia, Cambria, &quot;Times New Roman&quot;, Times, serif; font-size: 21px;">
  3109. Right, it&rsquo;s bound to<span>&nbsp;</span><em class="rm"
  3110. style="box-sizing: inherit; font-style: italic;">Ctrl+Z</em>. Time to use the accelerometer.
  3111. </p>
  3112. <blockquote class="ss st su"
  3113. style="box-sizing: inherit; margin: 0px 0px 0px -20px; box-shadow: rgba(0, 0, 0, 0.84) 3px 0px 0px 0px inset; padding-left: 23px;">
  3114. <p class="fe ff de rm fg b fh fi fj fk fl fm fn fo fp fq fr ez" data-selectable-paragraph=""
  3115. id="5018"
  3116. style="box-sizing: inherit; margin: 2em 0px -0.46em; font-weight: 400; color: rgba(0, 0, 0, 0.84); word-break: break-word; line-height: 1.58; letter-spacing: -0.004em; font-family: Georgia, Cambria, &quot;Times New Roman&quot;, Times, serif; font-style: italic; font-size: 21px;">
  3117. <strong class="fg sv"
  3118. style="box-sizing: inherit; font-family: Georgia, Cambria, &quot;Times New Roman&quot;, Times, serif; font-weight: 700;">Keyboard
  3119. Is Hidden When I Do a Selection on iPhone/iPad</strong></p>
  3120. </blockquote>
  3121. <p class="fe ff de bk fg b fh fi fj fk fl fm fn fo fp fq fr ez" data-selectable-paragraph=""
  3122. id="3f69"
  3123. style="box-sizing: inherit; margin: 2em 0px -0.46em; font-weight: 400; font-style: normal; color: rgba(0, 0, 0, 0.84); word-break: break-word; line-height: 1.58; letter-spacing: -0.004em; font-family: Georgia, Cambria, &quot;Times New Roman&quot;, Times, serif; font-size: 21px;">
  3124. Right. Focus moves from the hidden textarea to the document&hellip;</p>
  3125. <blockquote class="ss st su"
  3126. style="box-sizing: inherit; margin: 0px 0px 0px -20px; box-shadow: rgba(0, 0, 0, 0.84) 3px 0px 0px 0px inset; padding-left: 23px;">
  3127. <p class="fe ff de rm fg b fh fi fj fk fl fm fn fo fp fq fr ez" data-selectable-paragraph=""
  3128. id="0b27"
  3129. style="box-sizing: inherit; margin: 2em 0px -0.46em; font-weight: 400; color: rgba(0, 0, 0, 0.84); word-break: break-word; line-height: 1.58; letter-spacing: -0.004em; font-family: Georgia, Cambria, &quot;Times New Roman&quot;, Times, serif; font-style: italic; font-size: 21px;">
  3130. <strong class="fg sv"
  3131. style="box-sizing: inherit; font-family: Georgia, Cambria, &quot;Times New Roman&quot;, Times, serif; font-weight: 700;">Spell
  3132. Checking Doesn&rsquo;t Work</strong></p>
  3133. </blockquote>
  3134. <p class="fe ff de bk fg b fh fi fj fk fl fm fn fo fp fq fr ez" data-selectable-paragraph=""
  3135. id="8634"
  3136. style="box-sizing: inherit; margin: 2em 0px -0.46em; font-weight: 400; font-style: normal; color: rgba(0, 0, 0, 0.84); word-break: break-word; line-height: 1.58; letter-spacing: -0.004em; font-family: Georgia, Cambria, &quot;Times New Roman&quot;, Times, serif; font-size: 21px;">
  3137. The horror! The horror!</p>
  3138. <blockquote class="ss st su"
  3139. style="box-sizing: inherit; margin: 0px 0px 0px -20px; box-shadow: rgba(0, 0, 0, 0.84) 3px 0px 0px 0px inset; padding-left: 23px;">
  3140. <p class="fe ff de rm fg b fh fi fj fk fl fm fn fo fp fq fr ez" data-selectable-paragraph=""
  3141. id="e568"
  3142. style="box-sizing: inherit; margin: 2em 0px -0.46em; font-weight: 400; color: rgba(0, 0, 0, 0.84); word-break: break-word; line-height: 1.58; letter-spacing: -0.004em; font-family: Georgia, Cambria, &quot;Times New Roman&quot;, Times, serif; font-style: italic; font-size: 21px;">
  3143. <strong class="fg sv"
  3144. style="box-sizing: inherit; font-family: Georgia, Cambria, &quot;Times New Roman&quot;, Times, serif; font-weight: 700;">I
  3145. Can&rsquo;t Use Your Editor with a Keyboard and a Screen Reader</strong></p>
  3146. <p class="fe ff de rm fg b fh fi fj fk fl fm fn fo fp fq fr ez" data-selectable-paragraph=""
  3147. id="6e09"
  3148. style="box-sizing: inherit; margin: 2em 0px -0.46em; font-weight: 400; color: rgba(0, 0, 0, 0.84); word-break: break-word; line-height: 1.58; letter-spacing: -0.004em; font-family: Georgia, Cambria, &quot;Times New Roman&quot;, Times, serif; font-style: italic; font-size: 21px;">
  3149. Your editor isn&rsquo;t accessible. Normally when I tab into an editor, my screen reader
  3150. notifies me about it. Then, when I navigate through the text it reads the surrounding words.
  3151. It also reads what I type. Nothing like this happens in your editor. BTW. Did you
  3152. see<span>&nbsp;</span><a class="at cg fs ft fu fv"
  3153. href="http://www.w3.org/TR/2dcontext/#best-practices" rel="noopener nofollow"
  3154. style="box-sizing: inherit; color: inherit; text-decoration: none; -webkit-tap-highlight-color: transparent; background-repeat: repeat-x; background-image: url(&quot;data:image/svg+xml;utf8,&lt;svg preserveAspectRatio=\&quot;none\&quot; viewBox=\&quot;0 0 1 1\&quot; xmlns=\&quot;http://www.w3.org/2000/svg\&quot;&gt;&lt;line x1=\&quot;0\&quot; y1=\&quot;0\&quot; x2=\&quot;1\&quot; y2=\&quot;1\&quot; stroke=\&quot;rgba(0, 0, 0, 0.84)\&quot; /&gt;&lt;/svg&gt;&quot;); background-size: 1px 1px; background-position: 0px calc(1em + 1px);"
  3155. target="_blank">http://www.w3.org/TR/2dcontext/#best-practices</a>?</p>
  3156. </blockquote>
  3157. <p class="fe ff de bk fg b fh fi fj fk fl fm fn fo fp fq fr ez" data-selectable-paragraph=""
  3158. id="fcfb"
  3159. style="box-sizing: inherit; margin: 2em 0px -0.46em; font-weight: 400; font-style: normal; color: rgba(0, 0, 0, 0.84); word-break: break-word; line-height: 1.58; letter-spacing: -0.004em; font-family: Georgia, Cambria, &quot;Times New Roman&quot;, Times, serif; font-size: 21px;">
  3160. No, you didn&rsquo;t. And you should have.</p>
  3161. </div>
  3162. </div>
  3163. </section>
  3164. <hr class="re dz ip rf rg jc rh ri rj rk rl"
  3165. style="box-sizing: inherit; font-weight: 300; font-size: 28px; text-align: center; font-family: Georgia, Cambria, &quot;Times New Roman&quot;, Times, serif; border: none; margin-top: 30px;" />
  3166. <section class="ez fa fb fc fd" style="box-sizing: inherit; word-break: break-word; overflow-wrap: break-word;">
  3167. <div class="n p" style="box-sizing: inherit; display: flex; justify-content: center;">
  3168. <div class="ac ae af ag ah dn aj ak"
  3169. style="box-sizing: inherit; min-width: 0px; width: 680px; max-width: 680px; margin: 0px 64px;">
  3170. <h1 class="sb sc de bk bj io qo sd qq se sf sg sh si sj sk sl" data-selectable-paragraph=""
  3171. id="741f"
  3172. style="box-sizing: inherit; margin: 1.25em 0px -0.28em; font-family: &quot;Lucida Grande&quot;, &quot;Lucida Sans Unicode&quot;, &quot;Lucida Sans&quot;, Geneva, Arial, sans-serif; font-style: normal; color: rgba(0, 0, 0, 0.84); font-weight: 600; line-height: 1.12; letter-spacing: -0.022em; font-size: 34px;">
  3173. Back to Square One (and a Half)</h1>
  3174. <p class="fe ff de bk fg b fh sm fj sn fl so fn sp fp sq fr ez" data-selectable-paragraph=""
  3175. id="a4eb"
  3176. style="box-sizing: inherit; margin: 0.86em 0px -0.46em; font-weight: 400; font-style: normal; color: rgba(0, 0, 0, 0.84); word-break: break-word; line-height: 1.58; letter-spacing: -0.004em; font-family: Georgia, Cambria, &quot;Times New Roman&quot;, Times, serif; font-size: 21px;">
  3177. I think the lesson learned is that contentEditable may be terrible, but it is already here.
  3178. I&rsquo;m sure that for all the issues that I mentioned there will be native APIs one day, but
  3179. believe me &mdash; that day is not yet to come. Standardising such complex features is an
  3180. extremely tough job, because what you see is still the tip of the iceberg. Even though I&rsquo;m
  3181. working with contentEditable for nearly four years (that&rsquo;s nothing comparing to Frederico
  3182. Knabben&rsquo;s 13 :D) I still find W3C&rsquo;s<span>&nbsp;</span><a class="at cg fs ft fu fv"
  3183. href="https://lists.w3.org/Archives/Public/public-webapps/" rel="noopener nofollow"
  3184. style="box-sizing: inherit; color: inherit; text-decoration: none; -webkit-tap-highlight-color: transparent; background-repeat: repeat-x; background-image: url(&quot;data:image/svg+xml;utf8,&lt;svg preserveAspectRatio=\&quot;none\&quot; viewBox=\&quot;0 0 1 1\&quot; xmlns=\&quot;http://www.w3.org/2000/svg\&quot;&gt;&lt;line x1=\&quot;0\&quot; y1=\&quot;0\&quot; x2=\&quot;1\&quot; y2=\&quot;1\&quot; stroke=\&quot;rgba(0, 0, 0, 0.84)\&quot; /&gt;&lt;/svg&gt;&quot;); background-size: 1px 1px; background-position: 0px calc(1em + 1px);"
  3185. target="_blank">public-web-apps</a><span>&nbsp;</span>and<span>&nbsp;</span><a
  3186. class="at cg fs ft fu fv" href="https://lists.w3.org/Archives/Public/public-editing-tf/"
  3187. rel="noopener nofollow"
  3188. style="box-sizing: inherit; color: inherit; text-decoration: none; -webkit-tap-highlight-color: transparent; background-repeat: repeat-x; background-image: url(&quot;data:image/svg+xml;utf8,&lt;svg preserveAspectRatio=\&quot;none\&quot; viewBox=\&quot;0 0 1 1\&quot; xmlns=\&quot;http://www.w3.org/2000/svg\&quot;&gt;&lt;line x1=\&quot;0\&quot; y1=\&quot;0\&quot; x2=\&quot;1\&quot; y2=\&quot;1\&quot; stroke=\&quot;rgba(0, 0, 0, 0.84)\&quot; /&gt;&lt;/svg&gt;&quot;); background-size: 1px 1px; background-position: 0px calc(1em + 1px);"
  3189. target="_blank">public-editing-tf</a><span>&nbsp;</span>mailing lists eye-opening. Moreover,
  3190. there are many use cases for editing in the browsers and even WYSIWYG text editors differ among
  3191. themselves so it would be unfair to lock browsers just for one use case.</p>
  3192. </div>
  3193. </div>
  3194. </section>
  3195. <hr class="re dz ip rf rg jc rh ri rj rk rl"
  3196. style="box-sizing: inherit; font-weight: 300; font-size: 28px; text-align: center; font-family: Georgia, Cambria, &quot;Times New Roman&quot;, Times, serif; border: none; margin-top: 30px;" />
  3197. <section class="ez fa fb fc fd" style="box-sizing: inherit; word-break: break-word; overflow-wrap: break-word;">
  3198. <div class="n p" style="box-sizing: inherit; display: flex; justify-content: center;">
  3199. <div class="ac ae af ag ah dn aj ak"
  3200. style="box-sizing: inherit; min-width: 0px; width: 680px; max-width: 680px; margin: 0px 64px;">
  3201. <h1 class="sb sc de bk bj io qo sd qq se sf sg sh si sj sk sl" data-selectable-paragraph=""
  3202. id="3eec"
  3203. style="box-sizing: inherit; margin: 1.25em 0px -0.28em; font-family: &quot;Lucida Grande&quot;, &quot;Lucida Sans Unicode&quot;, &quot;Lucida Sans&quot;, Geneva, Arial, sans-serif; font-style: normal; color: rgba(0, 0, 0, 0.84); font-weight: 600; line-height: 1.12; letter-spacing: -0.022em; font-size: 34px;">
  3204. The Editing Task Force</h1>
  3205. <p class="fe ff de bk fg b fh sm fj sn fl so fn sp fp sq fr ez" data-selectable-paragraph=""
  3206. id="bec6"
  3207. style="box-sizing: inherit; margin: 0.86em 0px -0.46em; font-weight: 400; font-style: normal; color: rgba(0, 0, 0, 0.84); word-break: break-word; line-height: 1.58; letter-spacing: -0.004em; font-family: Georgia, Cambria, &quot;Times New Roman&quot;, Times, serif; font-size: 21px;">
  3208. Talking about standards &mdash; contentEditable needs one, because we need contentEditable.
  3209. Years will pass before there will be any chance of implementing a full featured, stable and
  3210. usable WYSIWYG editor without contentEditable. Therefore, the<span>&nbsp;</span><a
  3211. class="at cg fs ft fu fv" href="http://www.w3.org/wiki/Editing_Taskforce"
  3212. rel="noopener nofollow"
  3213. style="box-sizing: inherit; color: inherit; text-decoration: none; -webkit-tap-highlight-color: transparent; background-repeat: repeat-x; background-image: url(&quot;data:image/svg+xml;utf8,&lt;svg preserveAspectRatio=\&quot;none\&quot; viewBox=\&quot;0 0 1 1\&quot; xmlns=\&quot;http://www.w3.org/2000/svg\&quot;&gt;&lt;line x1=\&quot;0\&quot; y1=\&quot;0\&quot; x2=\&quot;1\&quot; y2=\&quot;1\&quot; stroke=\&quot;rgba(0, 0, 0, 0.84)\&quot; /&gt;&lt;/svg&gt;&quot;); background-size: 1px 1px; background-position: 0px calc(1em + 1px);"
  3214. target="_blank">W3C Editing Task Force</a><span>&nbsp;</span>was created last year (which I
  3215. and Frederico Knabben joined) where some tough discussions started on what to do with the
  3216. current situation. I will write a separate post about this effort as it looks really promising.
  3217. </p>
  3218. <p class="fe ff de bk fg b fh fi fj fk fl fm fn fo fp fq fr ez" data-selectable-paragraph=""
  3219. id="aba0"
  3220. style="box-sizing: inherit; margin: 2em 0px -0.46em; font-weight: 400; font-style: normal; color: rgba(0, 0, 0, 0.84); word-break: break-word; line-height: 1.58; letter-spacing: -0.004em; font-family: Georgia, Cambria, &quot;Times New Roman&quot;, Times, serif; font-size: 21px;">
  3221. (Edit: You can read more about contentEditable standardization in<span>&nbsp;</span><a
  3222. class="at cg fs ft fu fv"
  3223. href="https://foobar.test/example/fixing-contenteditable-1a9a5073c35d"
  3224. rel="noopener"
  3225. style="box-sizing: inherit; color: inherit; text-decoration: none; -webkit-tap-highlight-color: transparent; background-repeat: repeat-x; background-image: url(&quot;data:image/svg+xml;utf8,&lt;svg preserveAspectRatio=\&quot;none\&quot; viewBox=\&quot;0 0 1 1\&quot; xmlns=\&quot;http://www.w3.org/2000/svg\&quot;&gt;&lt;line x1=\&quot;0\&quot; y1=\&quot;0\&quot; x2=\&quot;1\&quot; y2=\&quot;1\&quot; stroke=\&quot;rgba(0, 0, 0, 0.84)\&quot; /&gt;&lt;/svg&gt;&quot;); background-size: 1px 1px; background-position: 0px calc(1em + 1px);"
  3226. target="_blank">&rdquo;Fixing ContentEditable&rdquo;</a>.)</p>
  3227. </div>
  3228. </div>
  3229. </section>
  3230. <hr class="re dz ip rf rg jc rh ri rj rk rl"
  3231. style="box-sizing: inherit; font-weight: 300; font-size: 28px; text-align: center; font-family: Georgia, Cambria, &quot;Times New Roman&quot;, Times, serif; border: none; margin-top: 30px;" />
  3232. <section class="ez fa fb fc fd" style="box-sizing: inherit; word-break: break-word; overflow-wrap: break-word;">
  3233. <div class="n p" style="box-sizing: inherit; display: flex; justify-content: center;">
  3234. <div class="ac ae af ag ah dn aj ak"
  3235. style="box-sizing: inherit; min-width: 0px; width: 680px; max-width: 680px; margin: 0px 64px;">
  3236. <h1 class="sb sc de bk bj io qo sd qq se sf sg sh si sj sk sl" data-selectable-paragraph=""
  3237. id="74d1"
  3238. style="box-sizing: inherit; margin: 1.25em 0px -0.28em; font-family: &quot;Lucida Grande&quot;, &quot;Lucida Sans Unicode&quot;, &quot;Lucida Sans&quot;, Geneva, Arial, sans-serif; font-style: normal; color: rgba(0, 0, 0, 0.84); font-weight: 600; line-height: 1.12; letter-spacing: -0.022em; font-size: 34px;">
  3239. ContentEditable &mdash; the Good Parts</h1>
  3240. <p class="fe ff de bk fg b fh sm fj sn fl so fn sp fp sq fr ez" data-selectable-paragraph=""
  3241. id="8c4a"
  3242. style="box-sizing: inherit; margin: 0.86em 0px -0.46em; font-weight: 400; font-style: normal; color: rgba(0, 0, 0, 0.84); word-break: break-word; line-height: 1.58; letter-spacing: -0.004em; font-family: Georgia, Cambria, &quot;Times New Roman&quot;, Times, serif; font-size: 21px;">
  3243. ContentEditable is like JavaScript, only Douglas Crockford hasn&rsquo;t written a book about it
  3244. yet. But (like JavaScript) it also has its good parts (yeah, I know &mdash; the good/bad ratio
  3245. is debatable). It&rsquo;s amazing that adding one attribute to an HTML element enables typing,
  3246. selection, keyboard navigation, spell checking, drag and drop, pasting, undo manager. That all
  3247. of this is integrated with the OS, that such editor can be used with a screen reader or on a
  3248. touchscreen device and that it&rsquo;s well<span>&nbsp;</span><a class="at cg fs ft fu fv"
  3249. href="https://en.wikipedia.org/wiki/Internationalization_and_localization"
  3250. rel="noopener nofollow"
  3251. style="box-sizing: inherit; color: inherit; text-decoration: none; -webkit-tap-highlight-color: transparent; background-repeat: repeat-x; background-image: url(&quot;data:image/svg+xml;utf8,&lt;svg preserveAspectRatio=\&quot;none\&quot; viewBox=\&quot;0 0 1 1\&quot; xmlns=\&quot;http://www.w3.org/2000/svg\&quot;&gt;&lt;line x1=\&quot;0\&quot; y1=\&quot;0\&quot; x2=\&quot;1\&quot; y2=\&quot;1\&quot; stroke=\&quot;rgba(0, 0, 0, 0.84)\&quot; /&gt;&lt;/svg&gt;&quot;); background-size: 1px 1px; background-position: 0px calc(1em + 1px);"
  3252. target="_blank">internationalised</a>. Let&rsquo;s focus on these good parts and forget the
  3253. bad ones.</p>
  3254. <p class="fe ff de bk fg b fh fi fj fk fl fm fn fo fp fq fr ez" data-selectable-paragraph=""
  3255. id="a3ef"
  3256. style="box-sizing: inherit; margin: 2em 0px -0.46em; font-weight: 400; font-style: normal; color: rgba(0, 0, 0, 0.84); word-break: break-word; line-height: 1.58; letter-spacing: -0.004em; font-family: Georgia, Cambria, &quot;Times New Roman&quot;, Times, serif; font-size: 21px;">
  3257. Over the past years, while working on CKEditor I noticed that we were gradually replacing native
  3258. features with our own implementations. It started with a custom behavior of
  3259. the<span>&nbsp;</span><em class="rm"
  3260. style="box-sizing: inherit; font-style: italic;">Enter</em><span>&nbsp;</span>key, commands
  3261. (from the<span>&nbsp;</span><em class="rm"
  3262. style="box-sizing: inherit; font-style: italic;">execCommand()</em><span>&nbsp;</span>API,
  3263. to ability to apply, remove and check state of a specific style like<span>&nbsp;</span><em
  3264. class="rm" style="box-sizing: inherit; font-style: italic;">bold</em>), undo manager and
  3265. intercepted pasting so the pasted content can be filtered out. Then some improvements to the
  3266. selection system were added (such as locking it when the editor is blurred, which allows the
  3267. implementation of modals) together with enhanced navigation in tables and completely custom list
  3268. editing. Since version 4.0, CKEditor has its custom &ldquo;insert HTML into selection&rdquo;
  3269. mechanism and a<span>&nbsp;</span><a class="at cg fs ft fu fv"
  3270. href="http://sdk.ckeditor.com/samples/magicline.html" rel="noopener nofollow"
  3271. style="box-sizing: inherit; color: inherit; text-decoration: none; -webkit-tap-highlight-color: transparent; background-repeat: repeat-x; background-image: url(&quot;data:image/svg+xml;utf8,&lt;svg preserveAspectRatio=\&quot;none\&quot; viewBox=\&quot;0 0 1 1\&quot; xmlns=\&quot;http://www.w3.org/2000/svg\&quot;&gt;&lt;line x1=\&quot;0\&quot; y1=\&quot;0\&quot; x2=\&quot;1\&quot; y2=\&quot;1\&quot; stroke=\&quot;rgba(0, 0, 0, 0.84)\&quot; /&gt;&lt;/svg&gt;&quot;); background-size: 1px 1px; background-position: 0px calc(1em + 1px);"
  3272. target="_blank">feature allowing reaching non-editable places</a>. CKEditor 4.1 introduced
  3273. highly customisable<span>&nbsp;</span><a class="at cg fs ft fu fv"
  3274. href="http://docs.ckeditor.com/#!/guide/dev_acf" rel="noopener nofollow"
  3275. style="box-sizing: inherit; color: inherit; text-decoration: none; -webkit-tap-highlight-color: transparent; background-repeat: repeat-x; background-image: url(&quot;data:image/svg+xml;utf8,&lt;svg preserveAspectRatio=\&quot;none\&quot; viewBox=\&quot;0 0 1 1\&quot; xmlns=\&quot;http://www.w3.org/2000/svg\&quot;&gt;&lt;line x1=\&quot;0\&quot; y1=\&quot;0\&quot; x2=\&quot;1\&quot; y2=\&quot;1\&quot; stroke=\&quot;rgba(0, 0, 0, 0.84)\&quot; /&gt;&lt;/svg&gt;&quot;); background-size: 1px 1px; background-position: 0px calc(1em + 1px);"
  3276. target="_blank">content filtering</a><span>&nbsp;</span>(no more mess on paste). CKEditor
  3277. 4.3 brought support for<span>&nbsp;</span><a class="at cg fs ft fu fv"
  3278. href="http://sdk.ckeditor.com/samples/simplebox.html" rel="noopener nofollow"
  3279. style="box-sizing: inherit; color: inherit; text-decoration: none; -webkit-tap-highlight-color: transparent; background-repeat: repeat-x; background-image: url(&quot;data:image/svg+xml;utf8,&lt;svg preserveAspectRatio=\&quot;none\&quot; viewBox=\&quot;0 0 1 1\&quot; xmlns=\&quot;http://www.w3.org/2000/svg\&quot;&gt;&lt;line x1=\&quot;0\&quot; y1=\&quot;0\&quot; x2=\&quot;1\&quot; y2=\&quot;1\&quot; stroke=\&quot;rgba(0, 0, 0, 0.84)\&quot; /&gt;&lt;/svg&gt;&quot;); background-size: 1px 1px; background-position: 0px calc(1em + 1px);"
  3280. target="_blank">non-editable islands with editable islands
  3281. inside</a><span>&nbsp;</span>which required overriding many native systems (selection,
  3282. keyboard, focus, clipboard). Somewhere in the meantime we implemented
  3283. custom<span>&nbsp;</span><em class="rm"
  3284. style="box-sizing: inherit; font-style: italic;">Backspace</em><span>&nbsp;</span>and<span>&nbsp;</span><em
  3285. class="rm"
  3286. style="box-sizing: inherit; font-style: italic;">Delete</em><span>&nbsp;</span>support to
  3287. workaround<span>&nbsp;</span><a class="at cg fs ft fu fv"
  3288. href="http://code.google.com/p/chromium/issues/detail?id=226941" rel="noopener nofollow"
  3289. style="box-sizing: inherit; color: inherit; text-decoration: none; -webkit-tap-highlight-color: transparent; background-repeat: repeat-x; background-image: url(&quot;data:image/svg+xml;utf8,&lt;svg preserveAspectRatio=\&quot;none\&quot; viewBox=\&quot;0 0 1 1\&quot; xmlns=\&quot;http://www.w3.org/2000/svg\&quot;&gt;&lt;line x1=\&quot;0\&quot; y1=\&quot;0\&quot; x2=\&quot;1\&quot; y2=\&quot;1\&quot; stroke=\&quot;rgba(0, 0, 0, 0.84)\&quot; /&gt;&lt;/svg&gt;&quot;); background-size: 1px 1px; background-position: 0px calc(1em + 1px);"
  3290. target="_blank">Blink&rsquo;s</a><span>&nbsp;</span>and<span>&nbsp;</span><a
  3291. class="at cg fs ft fu fv" href="https://bugs.webkit.org/show_bug.cgi?id=114791"
  3292. rel="noopener nofollow"
  3293. style="box-sizing: inherit; color: inherit; text-decoration: none; -webkit-tap-highlight-color: transparent; background-repeat: repeat-x; background-image: url(&quot;data:image/svg+xml;utf8,&lt;svg preserveAspectRatio=\&quot;none\&quot; viewBox=\&quot;0 0 1 1\&quot; xmlns=\&quot;http://www.w3.org/2000/svg\&quot;&gt;&lt;line x1=\&quot;0\&quot; y1=\&quot;0\&quot; x2=\&quot;1\&quot; y2=\&quot;1\&quot; stroke=\&quot;rgba(0, 0, 0, 0.84)\&quot; /&gt;&lt;/svg&gt;&quot;); background-size: 1px 1px; background-position: 0px calc(1em + 1px);"
  3294. target="_blank">WebKit&rsquo;s</a><span>&nbsp;</span>broken implementations. Finally, just a
  3295. few weeks ago we made a final takeover of the clipboard, which means that in some browsers copy,
  3296. cut and paste operations are fully handled by CKEditor.</p>
  3297. <p class="fe ff de bk fg b fh fi fj fk fl fm fn fo fp fq fr ez" data-selectable-paragraph=""
  3298. id="f149"
  3299. style="box-sizing: inherit; margin: 2em 0px -0.46em; font-weight: 400; font-style: normal; color: rgba(0, 0, 0, 0.84); word-break: break-word; line-height: 1.58; letter-spacing: -0.004em; font-family: Georgia, Cambria, &quot;Times New Roman&quot;, Times, serif; font-size: 21px;">
  3300. It means that today CKEditor does not let the browser do anything to the content except handling
  3301. typing, some deleting and that&rsquo;s basically it. At the same time, it still uses the native
  3302. selection system, keyboard navigation and other APIs such as those related to clipboard or focus
  3303. management.</p>
  3304. <p class="fe ff de bk fg b fh fi fj fk fl fm fn fo fp fq fr ez" data-selectable-paragraph=""
  3305. id="16e6"
  3306. style="box-sizing: inherit; margin: 2em 0px -0.46em; font-weight: 400; font-style: normal; color: rgba(0, 0, 0, 0.84); word-break: break-word; line-height: 1.58; letter-spacing: -0.004em; font-family: Georgia, Cambria, &quot;Times New Roman&quot;, Times, serif; font-size: 21px;">
  3307. With<span>&nbsp;</span><a class="at cg fs ft fu fv" href="https://ckeditor.com/ckeditor-5/"
  3308. rel="noopener nofollow"
  3309. style="box-sizing: inherit; color: inherit; text-decoration: none; -webkit-tap-highlight-color: transparent; background-repeat: repeat-x; background-image: url(&quot;data:image/svg+xml;utf8,&lt;svg preserveAspectRatio=\&quot;none\&quot; viewBox=\&quot;0 0 1 1\&quot; xmlns=\&quot;http://www.w3.org/2000/svg\&quot;&gt;&lt;line x1=\&quot;0\&quot; y1=\&quot;0\&quot; x2=\&quot;1\&quot; y2=\&quot;1\&quot; stroke=\&quot;rgba(0, 0, 0, 0.84)\&quot; /&gt;&lt;/svg&gt;&quot;); background-size: 1px 1px; background-position: 0px calc(1em + 1px);"
  3310. target="_blank">CKEditor 5</a><span>&nbsp;</span>we are planning to conclude this process by
  3311. letting the browser insert text only, but with CKEditor&rsquo;s control (edit: read more
  3312. in<span>&nbsp;</span><a class="at cg fs ft fu fv"
  3313. href="https://foobar.test/example/ckeditor-5-the-future-of-rich-text-editing-2b9300f9df2c"
  3314. rel="noopener"
  3315. style="box-sizing: inherit; color: inherit; text-decoration: none; -webkit-tap-highlight-color: transparent; background-repeat: repeat-x; background-image: url(&quot;data:image/svg+xml;utf8,&lt;svg preserveAspectRatio=\&quot;none\&quot; viewBox=\&quot;0 0 1 1\&quot; xmlns=\&quot;http://www.w3.org/2000/svg\&quot;&gt;&lt;line x1=\&quot;0\&quot; y1=\&quot;0\&quot; x2=\&quot;1\&quot; y2=\&quot;1\&quot; stroke=\&quot;rgba(0, 0, 0, 0.84)\&quot; /&gt;&lt;/svg&gt;&quot;); background-size: 1px 1px; background-position: 0px calc(1em + 1px);"
  3316. target="_blank">&ldquo;CKEditor 5: The Future of Rich Text Editing&rdquo;</a>). Ironically,
  3317. we plan to base all the editing algorithms on a custom data model as we agree that DOM is not
  3318. the perfect tool for this job. Of course, we are reaching the moment where we may face
  3319. internationalisation issues (like the support for<span>&nbsp;</span><em class="rm"
  3320. style="box-sizing: inherit; font-style: italic;">Alt+Backspace</em>) but we are aware of
  3321. this. What&rsquo;s more, this is the piece of functionality which may be opened by the browsers
  3322. as one of the first ones, thanks to the work done by the Editing Task Force. I hope to write
  3323. more about this in the near future (edit: read more in<span>&nbsp;</span><a
  3324. class="at cg fs ft fu fv"
  3325. href="https://foobar.test/example/fixing-contenteditable-1a9a5073c35d"
  3326. rel="noopener"
  3327. style="box-sizing: inherit; color: inherit; text-decoration: none; -webkit-tap-highlight-color: transparent; background-repeat: repeat-x; background-image: url(&quot;data:image/svg+xml;utf8,&lt;svg preserveAspectRatio=\&quot;none\&quot; viewBox=\&quot;0 0 1 1\&quot; xmlns=\&quot;http://www.w3.org/2000/svg\&quot;&gt;&lt;line x1=\&quot;0\&quot; y1=\&quot;0\&quot; x2=\&quot;1\&quot; y2=\&quot;1\&quot; stroke=\&quot;rgba(0, 0, 0, 0.84)\&quot; /&gt;&lt;/svg&gt;&quot;); background-size: 1px 1px; background-position: 0px calc(1em + 1px);"
  3328. target="_blank">&rdquo;Fixing ContentEditable&rdquo;</a>).</p>
  3329. </div>
  3330. </div>
  3331. </section>
  3332. <hr class="re dz ip rf rg jc rh ri rj rk rl"
  3333. style="box-sizing: inherit; font-weight: 300; font-size: 28px; text-align: center; font-family: Georgia, Cambria, &quot;Times New Roman&quot;, Times, serif; border: none; margin-top: 30px;" />
  3334. <section class="ez fa fb fc fd" style="box-sizing: inherit; word-break: break-word; overflow-wrap: break-word;">
  3335. <div class="n p" style="box-sizing: inherit; display: flex; justify-content: center;">
  3336. <div class="ac ae af ag ah dn aj ak"
  3337. style="box-sizing: inherit; min-width: 0px; width: 680px; max-width: 680px; margin: 0px 64px;">
  3338. <h1 class="sb sc de bk bj io qo sd qq se sf sg sh si sj sk sl" data-selectable-paragraph=""
  3339. id="b6c8"
  3340. style="box-sizing: inherit; margin: 1.25em 0px -0.28em; font-family: &quot;Lucida Grande&quot;, &quot;Lucida Sans Unicode&quot;, &quot;Lucida Sans&quot;, Geneva, Arial, sans-serif; font-style: normal; color: rgba(0, 0, 0, 0.84); font-weight: 600; line-height: 1.12; letter-spacing: -0.022em; font-size: 34px;">
  3341. <strong class="az" style="box-sizing: inherit; font-weight: inherit;">Editing Framework</strong>
  3342. </h1>
  3343. <p class="fe ff de bk fg b fh sm fj sn fl so fn sp fp sq fr ez" data-selectable-paragraph=""
  3344. id="403c"
  3345. style="box-sizing: inherit; margin: 0.86em 0px -0.46em; font-weight: 400; font-style: normal; color: rgba(0, 0, 0, 0.84); word-break: break-word; line-height: 1.58; letter-spacing: -0.004em; font-family: Georgia, Cambria, &quot;Times New Roman&quot;, Times, serif; font-size: 21px;">
  3346. All this sounds nice, but the amount of work needed to reach such state is still huge. Even with
  3347. the know-how it does not seem to be a project which can be approached by a single developer or
  3348. even a medium-sized company. Therefore, we believe that an editing framework, which will allow
  3349. other developers to build their customised solutions on top of it, needs to be implemented. This
  3350. is one of the goals that we defined for CKEditor 5, however projects like<span>&nbsp;</span><a
  3351. class="at cg fs ft fu fv" href="http://alloyeditor.com/" rel="noopener nofollow"
  3352. style="box-sizing: inherit; color: inherit; text-decoration: none; -webkit-tap-highlight-color: transparent; background-repeat: repeat-x; background-image: url(&quot;data:image/svg+xml;utf8,&lt;svg preserveAspectRatio=\&quot;none\&quot; viewBox=\&quot;0 0 1 1\&quot; xmlns=\&quot;http://www.w3.org/2000/svg\&quot;&gt;&lt;line x1=\&quot;0\&quot; y1=\&quot;0\&quot; x2=\&quot;1\&quot; y2=\&quot;1\&quot; stroke=\&quot;rgba(0, 0, 0, 0.84)\&quot; /&gt;&lt;/svg&gt;&quot;); background-size: 1px 1px; background-position: 0px calc(1em + 1px);"
  3353. target="_blank">Alloy Editor</a><span>&nbsp;</span>prove that this is doable even with
  3354. CKEditor 4. Only if it wasn&rsquo;t for developers starting with a clean contentEditable as soon
  3355. as they find one of the existing editors slightly disappointing, we could have been in a
  3356. different place today ;).</p>
  3357. </div>
  3358. </div>
  3359. </section>
  3360. </div>
  3361. </article>
  3362. <div
  3363. style="box-sizing: inherit; color: rgba(0, 0, 0, 0.8); font-family: BlinkMacSystemFont, &quot;Segoe UI&quot;, Roboto, Oxygen, Ubuntu, Cantarell, &quot;Open Sans&quot;, &quot;Helvetica Neue&quot;, sans-serif; font-size: medium; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 400; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial;">
  3364. <div class="gy gz n co p"
  3365. style="box-sizing: inherit; display: flex; justify-content: center; flex-direction: column; margin-top: 40px; clear: both;">
  3366. <div class="n p" style="box-sizing: inherit; display: flex; justify-content: center;">
  3367. <div class="ac ae af ag ah dn aj ak"
  3368. style="box-sizing: inherit; min-width: 0px; width: 680px; max-width: 680px; margin: 0px 64px;">
  3369. <div class="n ha" style="box-sizing: inherit; display: flex; flex-wrap: wrap;">&nbsp;</div>
  3370. <div class="n o ha" style="box-sizing: inherit; display: flex; align-items: center; flex-wrap: wrap;">
  3371. &nbsp;</div>
  3372. <div class="hb r" style="box-sizing: inherit; display: block; margin-top: 25px;">
  3373. <ul class="ba bb" style="box-sizing: inherit; margin: 0px; padding: 0px; list-style: none none;">
  3374. <li class="cf ps th ti"
  3375. style="box-sizing: inherit; display: inline-block; list-style-type: none; margin-right: 8px; margin-bottom: 8px;">
  3376. <a class="tj tk cg bo r tl tm a b eo" href="https://example.test/tag/web-development"
  3377. style="box-sizing: inherit; color: rgba(0, 0, 0, 0.54); text-decoration: none; -webkit-tap-highlight-color: transparent; font-family: BlinkMacSystemFont, &quot;Segoe UI&quot;, Roboto, Oxygen, Ubuntu, Cantarell, &quot;Open Sans&quot;, &quot;Helvetica Neue&quot;, sans-serif; font-weight: 400; display: block; font-size: 15px; border-radius: 3px; padding: 5px 10px; background: rgba(0, 0, 0, 0.05); line-height: 22px;">Web
  3378. Development</a></li>
  3379. <li class="cf ps th ti"
  3380. style="box-sizing: inherit; display: inline-block; list-style-type: none; margin-right: 8px; margin-bottom: 8px;">
  3381. <a class="tj tk cg bo r tl tm a b eo" href="https://example.test/tag/accessibility"
  3382. style="box-sizing: inherit; color: rgba(0, 0, 0, 0.54); text-decoration: none; -webkit-tap-highlight-color: transparent; font-family: BlinkMacSystemFont, &quot;Segoe UI&quot;, Roboto, Oxygen, Ubuntu, Cantarell, &quot;Open Sans&quot;, &quot;Helvetica Neue&quot;, sans-serif; font-weight: 400; display: block; font-size: 15px; border-radius: 3px; padding: 5px 10px; background: rgba(0, 0, 0, 0.05); line-height: 22px;">Accessibility</a>
  3383. </li>
  3384. <li class="cf ps th ti"
  3385. style="box-sizing: inherit; display: inline-block; list-style-type: none; margin-right: 8px; margin-bottom: 8px;">
  3386. <a class="tj tk cg bo r tl tm a b eo" href="https://example.test/tag/javascript"
  3387. style="box-sizing: inherit; color: rgba(0, 0, 0, 0.54); text-decoration: none; -webkit-tap-highlight-color: transparent; font-family: BlinkMacSystemFont, &quot;Segoe UI&quot;, Roboto, Oxygen, Ubuntu, Cantarell, &quot;Open Sans&quot;, &quot;Helvetica Neue&quot;, sans-serif; font-weight: 400; display: block; font-size: 15px; border-radius: 3px; padding: 5px 10px; background: rgba(0, 0, 0, 0.05); line-height: 22px;">JavaScript</a>
  3388. </li>
  3389. </ul>
  3390. </div>
  3391. <div class="hc n dp ab"
  3392. style="box-sizing: inherit; display: flex; justify-content: space-between; margin-top: 15px;">
  3393. <div class="n o" style="box-sizing: inherit; display: flex; align-items: center;">
  3394. <div class="hd r gl"
  3395. style="box-sizing: inherit; display: block; position: relative; margin-right: 16px;">
  3396. <div class="c cr dt n o he gl hf hg tn hi hj hk hl hm hn ho hp hq hr pn"
  3397. style="box-sizing: inherit; background-color: rgb(255, 255, 255); display: flex; align-items: center; border: 1px solid rgba(0, 0, 0, 0.1); border-radius: 50%; position: relative; height: 60px; width: 60px; transition: border-color 150ms ease 0s;">
  3398. <div class="ba gm gn go gp gq ht kt o hu dt n p hv u hw dh t ak pj tg pl hx"
  3399. style="box-sizing: inherit; display: flex; align-items: center; justify-content: center; top: 0px; left: 0px; width: 58px; padding: 0px; position: absolute; border-radius: 50%; outline: 0px; border: 0px; user-select: none; cursor: pointer; background: rgb(255, 255, 255); z-index: 2; height: 58px; fill: rgb(2, 184, 117); transition: fill 200ms ease 0s;">
  3400. <a class="at au av aw ax ay az ba bb bc bd be bf bg bh bi"
  3401. href="https://example.test/"
  3402. rel="noopener"
  3403. style="box-sizing: inherit; color: inherit; text-decoration: none; -webkit-tap-highlight-color: transparent; fill: inherit; font-size: inherit; border: inherit; font-family: inherit; letter-spacing: inherit; font-weight: inherit; padding: 0px; margin: 0px;"><svg
  3404. height="33" viewbox="0 0 33 33" width="33">
  3405. <path
  3406. d="M28.86 17.34l-3.64-6.4c-.3-.43-.71-.73-1.16-.8a1.12 1.12 0 0 0-.9.21c-.62.5-.73 1.18-.32 2.06l1.22 2.6 1.4 2.45c2.23 4.09 1.51 8-2.15 11.66a9.6 9.6 0 0 1-.8.71 6.53 6.53 0 0 0 4.3-2.1c3.82-3.82 3.57-7.87 2.05-10.39zm-6.25 11.08c3.35-3.35 4-6.78 1.98-10.47L21.2 12c-.3-.43-.71-.72-1.16-.8a1.12 1.12 0 0 0-.9.22c-.62.49-.74 1.18-.32 2.06l1.72 3.63a.5.5 0 0 1-.81.57l-8.91-8.9a1.33 1.33 0 0 0-1.89 1.88l5.3 5.3a.5.5 0 0 1-.71.7l-5.3-5.3-1.49-1.49c-.5-.5-1.38-.5-1.88 0a1.34 1.34 0 0 0 0 1.89l1.49 1.5 5.3 5.28a.5.5 0 0 1-.36.86.5.5 0 0 1-.36-.15l-5.29-5.29a1.34 1.34 0 0 0-1.88 0 1.34 1.34 0 0 0 0 1.89l2.23 2.23L9.3 21.4a.5.5 0 0 1-.36.85.5.5 0 0 1-.35-.14l-3.32-3.33a1.33 1.33 0 0 0-1.89 0 1.32 1.32 0 0 0-.39.95c0 .35.14.69.4.94l6.39 6.4c3.53 3.53 8.86 5.3 12.82 1.35zM12.73 9.26l5.68 5.68-.49-1.04c-.52-1.1-.43-2.13.22-2.89l-3.3-3.3a1.34 1.34 0 0 0-1.88 0 1.33 1.33 0 0 0-.4.94c0 .22.07.42.17.61zm14.79 19.18a7.46 7.46 0 0 1-6.41 2.31 7.92 7.92 0 0 1-3.67.9c-3.05 0-6.12-1.63-8.36-3.88l-6.4-6.4A2.31 2.31 0 0 1 2 19.72a2.33 2.33 0 0 1 1.92-2.3l-.87-.87a2.34 2.34 0 0 1 0-3.3 2.33 2.33 0 0 1 1.24-.64l-.14-.14a2.34 2.34 0 0 1 0-3.3 2.39 2.39 0 0 1 3.3 0l.14.14a2.33 2.33 0 0 1 3.95-1.24l.09.09c.09-.42.29-.83.62-1.16a2.34 2.34 0 0 1 3.3 0l3.38 3.39a2.17 2.17 0 0 1 1.27-.17c.54.08 1.03.35 1.45.76.1-.55.41-1.03.9-1.42a2.12 2.12 0 0 1 1.67-.4 2.8 2.8 0 0 1 1.85 1.25l3.65 6.43c1.7 2.83 2.03 7.37-2.2 11.6zM13.22.48l-1.92.89 2.37 2.83-.45-3.72zm8.48.88L19.78.5l-.44 3.7 2.36-2.84zM16.5 3.3L15.48 0h2.04L16.5 3.3z"
  3407. fill-rule="evenodd"></path>
  3408. </svg></a></div>
  3409. </div>
  3410. </div>
  3411. <div class="gw r" style="box-sizing: inherit; display: block; margin-top: 5px;">
  3412. <div class="gx" style="box-sizing: inherit;">
  3413. <h4 class="bj dz ea bl de"
  3414. style="box-sizing: inherit; margin: 0px; font-family: &quot;Lucida Grande&quot;, &quot;Lucida Sans Unicode&quot;, &quot;Lucida Sans&quot;, Geneva, Arial, sans-serif; line-height: 20px; color: rgba(0, 0, 0, 0.84); font-weight: 300; font-size: 16px;">
  3415. <button class="at au av aw ax ay az ba bb bc bd be bf bg bh bi"
  3416. style="box-sizing: inherit; -webkit-tap-highlight-color: transparent; background: transparent; overflow: visible; margin: 0px; color: inherit; fill: inherit; font-size: inherit; border: inherit; font-family: inherit; letter-spacing: inherit; font-weight: inherit; padding: 0px; text-align: left;">1.4K
  3417. claps</button></h4>
  3418. </div>
  3419. </div>
  3420. </div>
  3421. <div class="n o" style="box-sizing: inherit; display: flex; align-items: center;">
  3422. <div class="ex r ar"
  3423. style="box-sizing: inherit; display: block; flex: 0 0 auto; padding-right: 8px;"><a
  3424. class="at au av aw ax ay az ba bb bc bd be bf bg bh bi"
  3425. href="https://example.test/p/12345/share/twitter?source=post_actions_footer---------------------------"
  3426. rel="noopener nofollow"
  3427. style="box-sizing: inherit; color: inherit; text-decoration: none; -webkit-tap-highlight-color: transparent; fill: inherit; font-size: inherit; border: inherit; font-family: inherit; letter-spacing: inherit; font-weight: inherit; padding: 0px; margin: 0px;"
  3428. target="_blank"><svg class="q" height="29" width="29">
  3429. <path
  3430. d="M22.05 7.54a4.47 4.47 0 0 0-3.3-1.46 4.53 4.53 0 0 0-4.53 4.53c0 .35.04.7.08 1.05A12.9 12.9 0 0 1 5 6.89a5.1 5.1 0 0 0-.65 2.26c.03 1.6.83 2.99 2.02 3.79a4.3 4.3 0 0 1-2.02-.57v.08a4.55 4.55 0 0 0 3.63 4.44c-.4.08-.8.13-1.21.16l-.81-.08a4.54 4.54 0 0 0 4.2 3.15 9.56 9.56 0 0 1-5.66 1.94l-1.05-.08c2 1.27 4.38 2.02 6.94 2.02 8.3 0 12.86-6.9 12.84-12.85.02-.24 0-.43 0-.65a8.68 8.68 0 0 0 2.26-2.34c-.82.38-1.7.62-2.6.72a4.37 4.37 0 0 0 1.95-2.51c-.84.53-1.81.9-2.83 1.13z">
  3431. </path>
  3432. </svg></a></div>
  3433. <div class="ex r ar"
  3434. style="box-sizing: inherit; display: block; flex: 0 0 auto; padding-right: 8px;"><a
  3435. class="at au av aw ax ay az ba bb bc bd be bf bg bh bi"
  3436. href="https://example.test/p/12345/share/facebook?source=post_actions_footer---------------------------"
  3437. rel="noopener nofollow"
  3438. style="box-sizing: inherit; color: inherit; text-decoration: none; -webkit-tap-highlight-color: transparent; fill: inherit; font-size: inherit; border: inherit; font-family: inherit; letter-spacing: inherit; font-weight: inherit; padding: 0px; margin: 0px;"
  3439. target="_blank"><svg class="q" height="29" width="29">
  3440. <path
  3441. d="M23.2 5H5.8a.8.8 0 0 0-.8.8V23.2c0 .44.35.8.8.8h9.3v-7.13h-2.38V13.9h2.38v-2.38c0-2.45 1.55-3.66 3.74-3.66 1.05 0 1.95.08 2.2.11v2.57h-1.5c-1.2 0-1.48.57-1.48 1.4v1.96h2.97l-.6 2.97h-2.37l.05 7.12h5.1a.8.8 0 0 0 .79-.8V5.8a.8.8 0 0 0-.8-.79">
  3442. </path>
  3443. </svg></a></div>
  3444. <div class="ex r ar"
  3445. style="box-sizing: inherit; display: block; flex: 0 0 auto; padding-right: 8px;"><a
  3446. class="at au av aw ax ay az ba bb bc bd be bf bg bh bi"
  3447. href="https://example.test/foo?x=y&amp;source=post_actions_footer--------------------------bookmark_sidebar-"
  3448. rel="noopener"
  3449. style="box-sizing: inherit; color: inherit; text-decoration: none; -webkit-tap-highlight-color: transparent; fill: inherit; font-size: inherit; border: inherit; font-family: inherit; letter-spacing: inherit; font-weight: inherit; padding: 0px; margin: 0px;"><svg
  3450. height="25" viewbox="0 0 25 25" width="25">
  3451. <path
  3452. d="M19 6a2 2 0 0 0-2-2H8a2 2 0 0 0-2 2v14.66h.01c.01.1.05.2.12.28a.5.5 0 0 0 .7.03l5.67-4.12 5.66 4.13a.5.5 0 0 0 .71-.03.5.5 0 0 0 .12-.29H19V6zm-6.84 9.97L7 19.64V6a1 1 0 0 1 1-1h9a1 1 0 0 1 1 1v13.64l-5.16-3.67a.49.49 0 0 0-.68 0z"
  3453. fill-rule="evenodd"></path>
  3454. </svg></a></div>
  3455. <div aria-hidden="true" class="cf" style="box-sizing: inherit; display: inline-block;">
  3456. <div aria-hidden="true" class="cf" style="box-sizing: inherit; display: inline-block;">
  3457. <div class="r ar" style="box-sizing: inherit; display: block; flex: 0 0 auto;"><button
  3458. class="at au av aw ax ay az ba bb bc bd be bf bg bh bi"
  3459. style="box-sizing: inherit; -webkit-tap-highlight-color: transparent; background: transparent; overflow: visible; margin: 0px; color: inherit; fill: inherit; font-size: inherit; border: inherit; font-family: inherit; letter-spacing: inherit; font-weight: inherit; padding: 0px;"><svg
  3460. class="q" height="25" viewbox="-480.5 272.5 21 21" width="25">
  3461. <path
  3462. d="M-463 284.6c.9 0 1.6-.7 1.6-1.6s-.7-1.6-1.6-1.6-1.6.7-1.6 1.6.7 1.6 1.6 1.6zm0 .9c-1.4 0-2.5-1.1-2.5-2.5s1.1-2.5 2.5-2.5 2.5 1.1 2.5 2.5-1.1 2.5-2.5 2.5zm-7-.9c.9 0 1.6-.7 1.6-1.6s-.7-1.6-1.6-1.6-1.6.7-1.6 1.6.7 1.6 1.6 1.6zm0 .9c-1.4 0-2.5-1.1-2.5-2.5s1.1-2.5 2.5-2.5 2.5 1.1 2.5 2.5-1.1 2.5-2.5 2.5zm-7-.9c.9 0 1.6-.7 1.6-1.6s-.7-1.6-1.6-1.6-1.6.7-1.6 1.6.7 1.6 1.6 1.6zm0 .9c-1.4 0-2.5-1.1-2.5-2.5s1.1-2.5 2.5-2.5 2.5 1.1 2.5 2.5-1.1 2.5-2.5 2.5z">
  3463. </path>
  3464. </svg></button></div>
  3465. </div>
  3466. </div>
  3467. </div>
  3468. </div>
  3469. <div class="hy hz ia hb r ab"
  3470. style="box-sizing: inherit; display: block; margin-top: 25px; padding-top: 32px; border-top: 1px solid rgba(0, 0, 0, 0.1); margin-bottom: 25px;">
  3471. <div class="ib ic r gl"
  3472. style="box-sizing: inherit; display: block; position: relative; margin-bottom: 32px; min-height: 80px;">
  3473. <div class="r dh if ig" style="box-sizing: inherit; display: block; position: absolute;"><span
  3474. class="r id an ie" style="box-sizing: inherit; display: block;"><a
  3475. href="https://example.test/@reinmarpl?source=follow_footer--------------------------follow_footer-"
  3476. rel="noopener"
  3477. style="box-sizing: inherit; color: inherit; text-decoration: none; -webkit-tap-highlight-color: transparent;"><img
  3478. alt="Piotrek Koszuliński" class="r dt ih ii" height="80"
  3479. src="https://example.test/fit/c/160/160/1*eTpp1WMpoogzN8gYIt1XCw.jpeg"
  3480. style="box-sizing: inherit; vertical-align: middle; display: block; border-radius: 50%; height: 80px; width: 80px;"
  3481. width="80" /></a> </span></div>
  3482. <div class="ij r ik" style="box-sizing: inherit; display: block; padding-left: 102px;">
  3483. <p class="bj dz eo bl bo il im"
  3484. style="box-sizing: inherit; margin: 0px; font-family: &quot;Lucida Grande&quot;, &quot;Lucida Sans Unicode&quot;, &quot;Lucida Sans&quot;, Geneva, Arial, sans-serif; line-height: 20px; color: rgba(0, 0, 0, 0.54); font-weight: 300; font-size: 15px; text-transform: uppercase; letter-spacing: 0.05em;">
  3485. <span class="r id an ie" style="box-sizing: inherit; display: block;"><span class="r"
  3486. style="box-sizing: inherit; display: block;">WRITTEN BY</span></span></p>
  3487. </div>
  3488. <div class="ij in n ik"
  3489. style="box-sizing: inherit; display: flex; padding-left: 102px; margin-bottom: 6px;">
  3490. <div class="ak n o dp"
  3491. style="box-sizing: inherit; display: flex; align-items: center; width: 578px; justify-content: space-between;">
  3492. <h2 class="bj io ip iq de"
  3493. style="box-sizing: inherit; margin: 0px; font-family: &quot;Lucida Grande&quot;, &quot;Lucida Sans Unicode&quot;, &quot;Lucida Sans&quot;, Geneva, Arial, sans-serif; color: rgba(0, 0, 0, 0.84); font-weight: 600; font-size: 28px; line-height: 36px;">
  3494. <span class="r id an ie" style="box-sizing: inherit; display: block;"><span
  3495. class="r" style="box-sizing: inherit; display: block;"><a
  3496. class="at au av aw ax ay az ba bb bc bd be bf bg bh bi"
  3497. href="https://example.test/@reinmarpl?source=follow_footer--------------------------follow_footer-"
  3498. rel="noopener"
  3499. style="box-sizing: inherit; color: inherit; text-decoration: none; -webkit-tap-highlight-color: transparent; fill: inherit; font-size: inherit; border: inherit; font-family: inherit; letter-spacing: inherit; font-weight: inherit; padding: 0px; margin: 0px;">Piotrek
  3500. Koszuliński</a></span></span></h2>
  3501. <div class="r g" style="box-sizing: inherit; display: block;"><span class="r id an ie"
  3502. style="box-sizing: inherit; display: block;"><span class="r"
  3503. style="box-sizing: inherit; display: block;"><button
  3504. class="ir by pi pj pm pk pl pn bc cb bj b bk bl bm bn cc cd ce cf cg bf"
  3505. style="box-sizing: border-box; -webkit-tap-highlight-color: transparent; background: 0px center; overflow: visible; margin: 0px; font-weight: 400; font-family: &quot;Lucida Grande&quot;, &quot;Lucida Sans Unicode&quot;, &quot;Lucida Sans&quot;, Geneva, Arial, sans-serif; font-style: normal; line-height: 20px; font-size: 15.8px; letter-spacing: 0px; border-radius: 4px; border-width: 1px; border-style: solid; display: inline-block; text-decoration: none; padding: 4px 12px; color: rgb(28, 153, 99); fill: rgb(2, 184, 117); border-color: rgb(2, 184, 117);">Follow</button>
  3506. </span></span></div>
  3507. </div>
  3508. </div>
  3509. <div class="ij is r ik aq"
  3510. style="box-sizing: inherit; display: block; padding-left: 102px; max-width: 555px;">
  3511. <div class="it r" style="box-sizing: inherit; display: block; max-width: 450px;">
  3512. <h4 class="bj dz iu iv bo"
  3513. style="box-sizing: inherit; margin: 0px; font-family: &quot;Lucida Grande&quot;, &quot;Lucida Sans Unicode&quot;, &quot;Lucida Sans&quot;, Geneva, Arial, sans-serif; color: rgba(0, 0, 0, 0.54); font-weight: 300; font-size: 18px; line-height: 24px;">
  3514. @CKEditor 5 project lead. Software architect. JavaScript developer. Taming
  3515. contentEditable since 2012.</h4>
  3516. </div>
  3517. </div>
  3518. </div>
  3519. <div class="hy r" style="box-sizing: inherit; display: block; padding-top: 32px;">&nbsp;</div>
  3520. <div class="ib ic r gl"
  3521. style="box-sizing: inherit; display: block; position: relative; margin-bottom: 32px; min-height: 80px;">
  3522. <div class="r dh if ig" style="box-sizing: inherit; display: block; position: absolute;"><span
  3523. class="r id an ie" style="box-sizing: inherit; display: block;"><a
  3524. href="https://foobar.test/example?source=follow_footer--------------------------follow_footer-"
  3525. rel="noopener"
  3526. style="box-sizing: inherit; color: inherit; text-decoration: none; -webkit-tap-highlight-color: transparent;"><img
  3527. alt="Content Uneditable" class="cb ii ih" height="80"
  3528. src="https://example.test/fit/c/160/160/1*A6RgIIA4_CEbA70tXdOs1A.png"
  3529. style="box-sizing: inherit; vertical-align: middle; border-radius: 4px; height: 80px; width: 80px;"
  3530. width="80" /></a> </span></div>
  3531. <div class="ij in n ik"
  3532. style="box-sizing: inherit; display: flex; padding-left: 102px; margin-bottom: 6px;">
  3533. <div class="ak n o dp"
  3534. style="box-sizing: inherit; display: flex; align-items: center; width: 578px; justify-content: space-between;">
  3535. <h2 class="bj io ip iq de"
  3536. style="box-sizing: inherit; margin: 0px; font-family: &quot;Lucida Grande&quot;, &quot;Lucida Sans Unicode&quot;, &quot;Lucida Sans&quot;, Geneva, Arial, sans-serif; color: rgba(0, 0, 0, 0.84); font-weight: 600; font-size: 28px; line-height: 36px;">
  3537. <span class="r id an ie" style="box-sizing: inherit; display: block;"><span
  3538. class="r" style="box-sizing: inherit; display: block;"><a
  3539. class="at au av aw ax ay az ba bb bc bd be bf bg bh bi"
  3540. href="https://foobar.test/example?source=follow_footer--------------------------follow_footer-"
  3541. rel="noopener"
  3542. style="box-sizing: inherit; color: inherit; text-decoration: none; -webkit-tap-highlight-color: transparent; fill: inherit; font-size: inherit; border: inherit; font-family: inherit; letter-spacing: inherit; font-weight: inherit; padding: 0px; margin: 0px;">Content
  3543. Uneditable</a></span></span></h2>
  3544. <div class="r g" style="box-sizing: inherit; display: block;">
  3545. <div aria-hidden="true" class="cf"
  3546. style="box-sizing: inherit; display: inline-block;"><span class="r id an ie"
  3547. style="box-sizing: inherit; display: block;"><span class="r"
  3548. style="box-sizing: inherit; display: block;"><button
  3549. class="ir by pi pj pm pk pl pn bc cb bj b bk bl bm bn cc cd ce cf cg bf"
  3550. style="box-sizing: border-box; -webkit-tap-highlight-color: transparent; background: 0px center; overflow: visible; margin: 0px; font-weight: 400; font-family: &quot;Lucida Grande&quot;, &quot;Lucida Sans Unicode&quot;, &quot;Lucida Sans&quot;, Geneva, Arial, sans-serif; font-style: normal; line-height: 20px; font-size: 15.8px; letter-spacing: 0px; border-radius: 4px; border-width: 1px; border-style: solid; display: inline-block; text-decoration: none; padding: 4px 12px; color: rgb(28, 153, 99); fill: rgb(2, 184, 117); border-color: rgb(2, 184, 117);">Follow</button>
  3551. </span></span></div>
  3552. </div>
  3553. </div>
  3554. </div>
  3555. <div class="ij to r ik aq"
  3556. style="box-sizing: inherit; display: block; padding-left: 102px; max-width: 550px;">
  3557. <div class="it r" style="box-sizing: inherit; display: block; max-width: 450px;">
  3558. <h4 class="bj dz iu iv bo"
  3559. style="box-sizing: inherit; margin: 0px; font-family: &quot;Lucida Grande&quot;, &quot;Lucida Sans Unicode&quot;, &quot;Lucida Sans&quot;, Geneva, Arial, sans-serif; color: rgba(0, 0, 0, 0.54); font-weight: 300; font-size: 18px; line-height: 24px;">
  3560. All your content are belong to us. Curated by CKSource.</h4>
  3561. </div>
  3562. </div>
  3563. </div>
  3564. </div>
  3565. <div class="ix hz r ab"
  3566. style="box-sizing: inherit; display: block; border-top: 1px solid rgba(0, 0, 0, 0.1); padding-top: 25px;">
  3567. <div class="ja tp cb r jc aq"
  3568. style="box-sizing: inherit; display: block; border-radius: 4px; padding: 20px; text-align: center; border: 1px solid rgb(2, 184, 117);">
  3569. <a class="at au av aw ax ay az ba bb bc bd be bf bg bh bi"
  3570. href="https://example.test/p/12345/responses/show?source=follow_footer--------------------------follow_footer-"
  3571. rel="noopener"
  3572. style="box-sizing: inherit; color: inherit; text-decoration: none; -webkit-tap-highlight-color: transparent; fill: inherit; font-size: inherit; border: inherit; font-family: inherit; letter-spacing: inherit; font-weight: inherit; padding: 0px; margin: 0px;"><span
  3573. class="iy iz gp"
  3574. style="box-sizing: inherit; cursor: pointer; color: rgba(0, 0, 0, 0.76); opacity: 1;"><span
  3575. class="pi" style="box-sizing: inherit; color: rgb(28, 153, 99);">See responses
  3576. (18)</span></span></a></div>
  3577. </div>
  3578. </div>
  3579. </div>
  3580. <div class="jd r je ab"
  3581. style="box-sizing: inherit; display: block; margin-top: 64px; background-color: rgba(0, 0, 0, 0.02);">
  3582. <div class="n p" style="box-sizing: inherit; display: flex; justify-content: center;">
  3583. <div class="ac ae af ag ah ai aj ak"
  3584. style="box-sizing: inherit; max-width: 1192px; min-width: 0px; width: 935px; margin: 0px 64px;">
  3585. <div class="kv r kw" style="box-sizing: inherit; display: block; margin: 32px 0px;">
  3586. <div class="kp kx ib r"
  3587. style="box-sizing: inherit; display: block; margin-bottom: 32px; padding-bottom: 8px; border-bottom: 1px solid rgba(0, 0, 0, 0.1);">
  3588. <h2 class="bj io ky kz de"
  3589. style="box-sizing: inherit; margin: 0px; font-family: &quot;Lucida Grande&quot;, &quot;Lucida Sans Unicode&quot;, &quot;Lucida Sans&quot;, Geneva, Arial, sans-serif; color: rgba(0, 0, 0, 0.84); font-weight: 600; font-size: 22px; line-height: 28px;">
  3590. Lorem ipsum</h2>
  3591. </div>
  3592. <div class="la n lb ha lc ld le lf lg lh li lj lk ll lm ln lo lp lq"
  3593. style="box-sizing: inherit; display: flex; flex-flow: row wrap; align-items: flex-start; width: calc(100% + 32px); margin-left: -16px; margin-right: -16px;">
  3594. <div class="lr ls lt lu lv lw lx ly lz ma mb mc md me mf mg mh mi mj mk ml"
  3595. style="box-sizing: inherit; flex-grow: 0; padding-left: 16px; padding-right: 16px; flex-basis: 33.3333%; max-width: 33.3333%;">
  3596. <div class="ak hw" style="box-sizing: inherit; width: 290.328px; height: 392.961px;">
  3597. <div class="r mm" style="box-sizing: inherit; display: block;">
  3598. <div class="mn mo lc ld le mp mq lf lg lh mr ms li lj lk mt mu ll lm ln mv mw lo lp lq n ha"
  3599. style="box-sizing: inherit; display: flex; flex-flow: row wrap; width: calc(100% + 32px); margin-left: -16px; margin-right: -16px; align-items: flex-start;">
  3600. <div class="lr ls lt lu lv lw mx my lz ma mz na md me nb nc mh mi nd ne ml"
  3601. style="box-sizing: inherit; flex-grow: 0; padding-left: 16px; padding-right: 16px; flex-basis: 100%; max-width: 100%;">
  3602. <div class="nf r ng f"
  3603. style="box-sizing: inherit; display: block; margin-bottom: 12px;">
  3604. <h4 class="bj dz ea bl bo"
  3605. style="box-sizing: inherit; margin: 0px; font-family: &quot;Lucida Grande&quot;, &quot;Lucida Sans Unicode&quot;, &quot;Lucida Sans&quot;, Geneva, Arial, sans-serif; line-height: 20px; color: rgba(0, 0, 0, 0.54); font-weight: 300; font-size: 16px;">
  3606. Related reads</h4>
  3607. </div>
  3608. <div class="nh r ni kw"
  3609. style="box-sizing: inherit; display: block; margin-bottom: 16px;">
  3610. <div class="nj gl"
  3611. style="box-sizing: inherit; position: relative; padding-bottom: 192.961px;">
  3612. <div class="hw dh ak"
  3613. style="box-sizing: inherit; width: 290.328px; position: absolute; height: 192.961px;">
  3614. <div class="ty r nl nm hw ak nn no"
  3615. style="box-sizing: inherit; display: block; width: 290.328px; height: 192.961px; background-origin: border-box; background-size: cover; background-position: 50% 50%; max-width: 100%; background-image: url(&quot;https://example.test/max/656/1*Nubb8PFT2fttcXpAOm2d7w.png&quot;);">
  3616. &nbsp;</div>
  3617. </div>
  3618. </div>
  3619. </div>
  3620. </div>
  3621. <div class="lr ls lt lu lv lw mx my lz ma mz na md me nb nc mh mi nd ne ml"
  3622. style="box-sizing: inherit; flex-grow: 0; padding-left: 16px; padding-right: 16px; flex-basis: 100%; max-width: 100%;">
  3623. <div class="nh r"
  3624. style="box-sizing: inherit; display: block; margin-bottom: 16px;">
  3625. <h3 class="de q nr ns bk nt nu nv"
  3626. style="box-sizing: inherit; margin: 0px; fill: rgba(0, 0, 0, 0.84); font-style: normal; color: rgba(0, 0, 0, 0.84); font-family: Georgia, Cambria, &quot;Times New Roman&quot;, Times, serif; font-weight: 500; font-size: 24px; line-height: 32px; letter-spacing: 0em;">
  3627. <a href="https://example.test/@ibrahimbutt/if-youve-ever-configured-webpack-parcel-will-blow-your-mind-b615468cee78?source=post_recirc---------0------------------"
  3628. rel="noopener"
  3629. style="box-sizing: inherit; color: inherit; text-decoration: none; -webkit-tap-highlight-color: transparent;">If
  3630. you&rsquo;ve ever configured Webpack, Parcel will blow your
  3631. mind!</a></h3>
  3632. </div>
  3633. <div class="n o dp"
  3634. style="box-sizing: inherit; display: flex; align-items: center; justify-content: space-between;">
  3635. <div class="nw r nx"
  3636. style="box-sizing: inherit; display: block; margin-right: 10px; flex: 0 1 auto;">
  3637. <div class="o n"
  3638. style="box-sizing: inherit; display: flex; align-items: center;">
  3639. <div style="box-sizing: inherit;"><a
  3640. href="https://example.test/@ibrahimbutt?source=post_recirc---------0------------------"
  3641. rel="noopener"
  3642. style="box-sizing: inherit; color: inherit; text-decoration: none; -webkit-tap-highlight-color: transparent;"><img
  3643. alt="Ibrahim Butt" class="r dt nz ny"
  3644. height="40"
  3645. src="https://example.test/fit/c/80/80/1*L_oQhOVpJJ5ciPsqUhjMpQ.jpeg"
  3646. style="box-sizing: inherit; vertical-align: middle; display: block; border-radius: 50%; width: 40px; height: 40px;"
  3647. width="40" /></a></div>
  3648. <div class="dw ak r"
  3649. style="box-sizing: inherit; display: block; width: 122.945px; margin-left: 12px;">
  3650. <div class="n"
  3651. style="box-sizing: inherit; display: flex;">
  3652. <div style="box-sizing: inherit; flex: 1 1 0%;">
  3653. <div class="ch n o dy"
  3654. style="box-sizing: inherit; display: flex; align-items: center; margin-bottom: 0px;">
  3655. <span class="bj b bk bl bm bn r de q"
  3656. style="box-sizing: inherit; font-weight: 400; fill: rgba(0, 0, 0, 0.84); display: block; font-family: &quot;Lucida Grande&quot;, &quot;Lucida Sans Unicode&quot;, &quot;Lucida Sans&quot;, Geneva, Arial, sans-serif; font-style: normal; line-height: 20px; font-size: 15.8px; letter-spacing: 0px; color: rgba(0, 0, 0, 0.84);"><span
  3657. class="bj dz ea bl cz da db cy dc dd de"
  3658. style="box-sizing: inherit; font-family: &quot;Lucida Grande&quot;, &quot;Lucida Sans Unicode&quot;, &quot;Lucida Sans&quot;, Geneva, Arial, sans-serif; line-height: 20px; display: -webkit-box; overflow: hidden; max-height: 20px; text-overflow: ellipsis; -webkit-line-clamp: 1; -webkit-box-orient: vertical; color: rgba(0, 0, 0, 0.84); font-weight: 300; font-size: 16px;"><a
  3659. class="at au av aw ax ay az ba bb bc eb bf bg bh bi"
  3660. href="https://example.test/@ibrahimbutt?source=post_recirc---------0------------------"
  3661. rel="noopener"
  3662. style="box-sizing: inherit; color: inherit; text-decoration: none; -webkit-tap-highlight-color: transparent; fill: inherit; font-size: inherit; border: inherit; font-family: inherit; letter-spacing: inherit; font-weight: inherit; padding: 0px; margin: 0px;">Ibrahim
  3663. Butt</a></span></span></div>
  3664. </div>
  3665. </div>
  3666. <div style="box-sizing: inherit;"><span
  3667. class="bj b bk bl bm bn r bo bp"
  3668. style="box-sizing: inherit; font-weight: 400; display: block; font-family: &quot;Lucida Grande&quot;, &quot;Lucida Sans Unicode&quot;, &quot;Lucida Sans&quot;, Geneva, Arial, sans-serif; font-style: normal; line-height: 20px; font-size: 15.8px; letter-spacing: 0px; color: rgba(0, 0, 0, 0.54); fill: rgba(0, 0, 0, 0.54);"><span
  3669. class="bj dz ea bl cz da db cy dc dd bo"
  3670. style="box-sizing: inherit; font-family: &quot;Lucida Grande&quot;, &quot;Lucida Sans Unicode&quot;, &quot;Lucida Sans&quot;, Geneva, Arial, sans-serif; line-height: 20px; color: rgba(0, 0, 0, 0.54); display: -webkit-box; overflow: hidden; max-height: 20px; text-overflow: ellipsis; -webkit-line-clamp: 1; -webkit-box-orient: vertical; font-weight: 300; font-size: 16px;"><a
  3671. class="at au av aw ax ay az ba bb bc eb bf bg bh bi"
  3672. href="https://example.test/@ibrahimbutt/if-youve-ever-configured-webpack-parcel-will-blow-your-mind-b615468cee78?source=post_recirc---------0------------------"
  3673. rel="noopener"
  3674. style="box-sizing: inherit; color: inherit; text-decoration: none; -webkit-tap-highlight-color: transparent; fill: inherit; font-size: inherit; border: inherit; font-family: inherit; letter-spacing: inherit; font-weight: inherit; padding: 0px; margin: 0px;">Mar
  3675. 16,
  3676. 2018</a><span>&nbsp;</span>&middot;<span>&nbsp;</span>5min
  3677. read<span
  3678. style="box-sizing: inherit; padding-left: 4px;"><svg
  3679. class="star-15px_svg__svgIcon-use"
  3680. height="15"
  3681. style="margin-top: -2px;"
  3682. viewbox="0 0 15 15" width="15">
  3683. <path
  3684. d="M7.44 2.32c.03-.1.09-.1.12 0l1.2 3.53a.29.29 0 0 0 .26.2h3.88c.11 0 .13.04.04.1L9.8 8.33a.27.27 0 0 0-.1.29l1.2 3.53c.03.1-.01.13-.1.07l-3.14-2.18a.3.3 0 0 0-.32 0L4.2 12.22c-.1.06-.14.03-.1-.07l1.2-3.53a.27.27 0 0 0-.1-.3L2.06 6.16c-.1-.06-.07-.12.03-.12h3.89a.29.29 0 0 0 .26-.19l1.2-3.52z">
  3685. </path>
  3686. </svg></span></span></span></div>
  3687. </div>
  3688. </div>
  3689. </div>
  3690. <div class="n o"
  3691. style="box-sizing: inherit; display: flex; align-items: center;">
  3692. <div class="n o"
  3693. style="box-sizing: inherit; display: flex; align-items: center;">
  3694. <div class="gk r gl"
  3695. style="box-sizing: inherit; display: block; margin-right: 5px; position: relative;">
  3696. <div class="ba gm gn go gp gq gr kt gt gu gv"
  3697. style="box-sizing: inherit; padding: 0px; outline: 0px; border: 0px; user-select: none; cursor: pointer; fill: rgba(0, 0, 0, 0.76);">
  3698. <a class="at au av aw ax ay az ba bb bc bd be bf bg bh bi"
  3699. href="https://example.test/foo?x=y&amp;source=post_recirc-----b615468cee78----0-----------------clap_preview-"
  3700. rel="noopener"
  3701. style="box-sizing: inherit; color: inherit; text-decoration: none; -webkit-tap-highlight-color: transparent; fill: inherit; font-size: inherit; border: inherit; font-family: inherit; letter-spacing: inherit; font-weight: inherit; padding: 0px; margin: 0px;"><svg
  3702. height="25" viewbox="0 0 25 25" width="25">
  3703. <g fill-rule="evenodd">
  3704. <path
  3705. d="M11.74 0l.76 2.97.76-2.97zM14.81 3.78l1.84-2.56-1.42-.47zM8.38 1.22l1.84 2.56L9.8.75zM20.38 21.62a5.11 5.11 0 0 1-3.16 1.61l.49-.45c2.88-2.89 3.45-5.98 1.69-9.21l-1.1-1.94-.96-2.02c-.31-.67-.23-1.18.25-1.55a.84.84 0 0 1 .66-.16c.34.05.66.28.88.6l2.85 5.02c1.18 1.97 1.38 5.12-1.6 8.1M7.1 21.1l-5.02-5.02a1 1 0 0 1 .7-1.7 1 1 0 0 1 .72.3l2.6 2.6a.44.44 0 0 0 .63-.62L4.1 14.04l-1.75-1.75a1 1 0 1 1 1.41-1.41l4.15 4.15a.44.44 0 0 0 .63 0 .44.44 0 0 0 0-.62L4.4 10.26 3.22 9.08a1 1 0 0 1 0-1.4 1.02 1.02 0 0 1 1.41 0l1.18 1.16L9.96 13a.44.44 0 0 0 .62 0 .44.44 0 0 0 0-.63L6.43 8.22a.99.99 0 0 1-.3-.7.99.99 0 0 1 .3-.7 1 1 0 0 1 1.41 0l7 6.98a.44.44 0 0 0 .7-.5l-1.35-2.85c-.31-.68-.23-1.19.25-1.56a.85.85 0 0 1 .66-.16c.34.06.66.28.88.6L18.63 14c1.57 2.88 1.07 5.54-1.55 8.16a5.62 5.62 0 0 1-5.06 1.65 9.35 9.35 0 0 1-4.93-2.72zM11 5.98l2.56 2.56c-.5.6-.56 1.41-.15 2.28l.26.56-4.25-4.25a.98.98 0 0 1-.12-.45 1 1 0 0 1 .29-.7 1.02 1.02 0 0 1 1.41 0zm8.89 2.06c-.38-.56-.9-.92-1.49-1.01a1.74 1.74 0 0 0-1.34.33c-.38.29-.61.65-.71 1.06a2.1 2.1 0 0 0-1.1-.56 1.78 1.78 0 0 0-.99.13l-2.64-2.64a1.88 1.88 0 0 0-2.65 0 1.86 1.86 0 0 0-.48.85 1.89 1.89 0 0 0-2.67-.01 1.87 1.87 0 0 0-.5.9c-.76-.75-2-.75-2.7-.04a1.88 1.88 0 0 0 0 2.66c-.3.12-.61.29-.87.55a1.88 1.88 0 0 0 0 2.66l.62.62a1.88 1.88 0 0 0-.9 3.16l5.01 5.02c1.6 1.6 3.52 2.64 5.4 2.96a7.16 7.16 0 0 0 1.18.1c1.03 0 2-.25 2.9-.7A5.9 5.9 0 0 0 21 22.24c3.34-3.34 3.08-6.93 1.74-9.17l-2.87-5.04z">
  3706. </path>
  3707. </g>
  3708. </svg></a></div>
  3709. </div>
  3710. <div class="gw r"
  3711. style="box-sizing: inherit; display: block; margin-top: 5px;">
  3712. <div class="gx" style="box-sizing: inherit;">
  3713. <h4 class="bj dz ea bl bo"
  3714. style="box-sizing: inherit; margin: 0px; font-family: &quot;Lucida Grande&quot;, &quot;Lucida Sans Unicode&quot;, &quot;Lucida Sans&quot;, Geneva, Arial, sans-serif; line-height: 20px; color: rgba(0, 0, 0, 0.54); font-weight: 300; font-size: 16px;">
  3715. 2.9K</h4>
  3716. </div>
  3717. </div>
  3718. </div>
  3719. <div class="oe dw nw of og r"
  3720. style="box-sizing: inherit; display: block; margin-left: 12px; margin-right: 10px; border-right: 1px solid rgba(0, 0, 0, 0.1); height: 20px; width: 1px;">
  3721. &nbsp;</div>
  3722. <div style="box-sizing: inherit;">
  3723. <div aria-describedby="22" aria-hidden="true"
  3724. aria-labelledby="22" class="cf" role="tooltip"
  3725. style="box-sizing: inherit; display: inline-block;"><a
  3726. class="at au av aw ax ay az ba bb bc bd be bf bg bh bi"
  3727. href="https://example.test/foo?x=y&amp;source=post_recirc---------0-----------------bookmark_sidebar-"
  3728. rel="noopener"
  3729. style="box-sizing: inherit; color: inherit; text-decoration: none; -webkit-tap-highlight-color: transparent; fill: inherit; font-size: inherit; border: inherit; font-family: inherit; letter-spacing: inherit; font-weight: inherit; padding: 0px; margin: 0px;"><svg
  3730. height="25" viewbox="0 0 25 25" width="25">
  3731. <path
  3732. d="M19 6a2 2 0 0 0-2-2H8a2 2 0 0 0-2 2v14.66h.01c.01.1.05.2.12.28a.5.5 0 0 0 .7.03l5.67-4.12 5.66 4.13a.5.5 0 0 0 .71-.03.5.5 0 0 0 .12-.29H19V6zm-6.84 9.97L7 19.64V6a1 1 0 0 1 1-1h9a1 1 0 0 1 1 1v13.64l-5.16-3.67a.49.49 0 0 0-.68 0z"
  3733. fill-rule="evenodd"></path>
  3734. </svg></a></div>
  3735. </div>
  3736. </div>
  3737. </div>
  3738. </div>
  3739. </div>
  3740. </div>
  3741. </div>
  3742. </div>
  3743. <div class="lr ls lt lu lv lw lx ly lz ma mb mc md me mf mg mh mi mj mk ml"
  3744. style="box-sizing: inherit; flex-grow: 0; padding-left: 16px; padding-right: 16px; flex-basis: 33.3333%; max-width: 33.3333%;">
  3745. <div class="ak hw" style="box-sizing: inherit; width: 290.328px; height: 424.961px;">
  3746. <div class="r mm" style="box-sizing: inherit; display: block;">
  3747. <div class="mn mo lc ld le mp mq lf lg lh mr ms li lj lk mt mu ll lm ln mv mw lo lp lq n ha"
  3748. style="box-sizing: inherit; display: flex; flex-flow: row wrap; width: calc(100% + 32px); margin-left: -16px; margin-right: -16px; align-items: flex-start;">
  3749. <div class="lr ls lt lu lv lw mx my lz ma mz na md me nb nc mh mi nd ne ml"
  3750. style="box-sizing: inherit; flex-grow: 0; padding-left: 16px; padding-right: 16px; flex-basis: 100%; max-width: 100%;">
  3751. <div class="nf r ng f"
  3752. style="box-sizing: inherit; display: block; margin-bottom: 12px;">
  3753. <h4 class="bj dz ea bl bo"
  3754. style="box-sizing: inherit; margin: 0px; font-family: &quot;Lucida Grande&quot;, &quot;Lucida Sans Unicode&quot;, &quot;Lucida Sans&quot;, Geneva, Arial, sans-serif; line-height: 20px; color: rgba(0, 0, 0, 0.54); font-weight: 300; font-size: 16px;">
  3755. Related reads</h4>
  3756. </div>
  3757. <div class="nh r ni kw"
  3758. style="box-sizing: inherit; display: block; margin-bottom: 16px;">
  3759. <div class="nj gl"
  3760. style="box-sizing: inherit; position: relative; padding-bottom: 192.961px;">
  3761. <div class="hw dh ak"
  3762. style="box-sizing: inherit; width: 290.328px; position: absolute; height: 192.961px;">
  3763. <div class="tz r nl nm hw ak nn no"
  3764. style="box-sizing: inherit; display: block; width: 290.328px; height: 192.961px; background-origin: border-box; background-size: cover; background-position: 50% 50%; max-width: 100%; background-image: url(&quot;https://example.test/max/656/1*L0WSeQSNj3Q6kzNv5rN4bg.png&quot;);">
  3765. &nbsp;</div>
  3766. </div>
  3767. </div>
  3768. </div>
  3769. </div>
  3770. <div class="lr ls lt lu lv lw mx my lz ma mz na md me nb nc mh mi nd ne ml"
  3771. style="box-sizing: inherit; flex-grow: 0; padding-left: 16px; padding-right: 16px; flex-basis: 100%; max-width: 100%;">
  3772. <div class="nh r"
  3773. style="box-sizing: inherit; display: block; margin-bottom: 16px;">
  3774. <h3 class="de q nr ns bk nt nu nv"
  3775. style="box-sizing: inherit; margin: 0px; fill: rgba(0, 0, 0, 0.84); font-style: normal; color: rgba(0, 0, 0, 0.84); font-family: Georgia, Cambria, &quot;Times New Roman&quot;, Times, serif; font-weight: 500; font-size: 24px; line-height: 32px; letter-spacing: 0em;">
  3776. <a href="https://example.test/@webmaxru/workbox-4-implementing-refresh-to-update-version-flow-using-the-workbox-window-module-41284967e79c?source=post_recirc---------1------------------"
  3777. rel="noopener"
  3778. style="box-sizing: inherit; color: inherit; text-decoration: none; -webkit-tap-highlight-color: transparent;">Workbox
  3779. 4: Implementing refresh-to-update-version flow using the
  3780. workbox-window module</a></h3>
  3781. </div>
  3782. <div class="n o dp"
  3783. style="box-sizing: inherit; display: flex; align-items: center; justify-content: space-between;">
  3784. <div class="nw r nx"
  3785. style="box-sizing: inherit; display: block; margin-right: 10px; flex: 0 1 auto;">
  3786. <div class="o n"
  3787. style="box-sizing: inherit; display: flex; align-items: center;">
  3788. <div style="box-sizing: inherit;"><a
  3789. href="https://example.test/@webmaxru?source=post_recirc---------1------------------"
  3790. rel="noopener"
  3791. style="box-sizing: inherit; color: inherit; text-decoration: none; -webkit-tap-highlight-color: transparent;"><img
  3792. alt="Maxim Salnikov" class="r dt nz ny"
  3793. height="40"
  3794. src="https://example.test/fit/c/80/80/2*KZp0bFcD5m_mc-PIsjcXiA.jpeg"
  3795. style="box-sizing: inherit; vertical-align: middle; display: block; border-radius: 50%; width: 40px; height: 40px;"
  3796. width="40" /></a></div>
  3797. <div class="dw ak r"
  3798. style="box-sizing: inherit; display: block; width: 129.297px; margin-left: 12px;">
  3799. <div class="n"
  3800. style="box-sizing: inherit; display: flex;">
  3801. <div style="box-sizing: inherit; flex: 1 1 0%;">
  3802. <div class="ch n o dy"
  3803. style="box-sizing: inherit; display: flex; align-items: center; margin-bottom: 0px;">
  3804. <span class="bj b bk bl bm bn r de q"
  3805. style="box-sizing: inherit; font-weight: 400; fill: rgba(0, 0, 0, 0.84); display: block; font-family: &quot;Lucida Grande&quot;, &quot;Lucida Sans Unicode&quot;, &quot;Lucida Sans&quot;, Geneva, Arial, sans-serif; font-style: normal; line-height: 20px; font-size: 15.8px; letter-spacing: 0px; color: rgba(0, 0, 0, 0.84);"><span
  3806. class="bj dz ea bl cz da db cy dc dd de"
  3807. style="box-sizing: inherit; font-family: &quot;Lucida Grande&quot;, &quot;Lucida Sans Unicode&quot;, &quot;Lucida Sans&quot;, Geneva, Arial, sans-serif; line-height: 20px; display: -webkit-box; overflow: hidden; max-height: 20px; text-overflow: ellipsis; -webkit-line-clamp: 1; -webkit-box-orient: vertical; color: rgba(0, 0, 0, 0.84); font-weight: 300; font-size: 16px;"><a
  3808. class="at au av aw ax ay az ba bb bc eb bf bg bh bi"
  3809. href="https://example.test/@webmaxru?source=post_recirc---------1------------------"
  3810. rel="noopener"
  3811. style="box-sizing: inherit; color: inherit; text-decoration: none; -webkit-tap-highlight-color: transparent; fill: inherit; font-size: inherit; border: inherit; font-family: inherit; letter-spacing: inherit; font-weight: inherit; padding: 0px; margin: 0px;">Maxim
  3812. Salnikov</a></span></span></div>
  3813. </div>
  3814. </div>
  3815. <div style="box-sizing: inherit;"><span
  3816. class="bj b bk bl bm bn r bo bp"
  3817. style="box-sizing: inherit; font-weight: 400; display: block; font-family: &quot;Lucida Grande&quot;, &quot;Lucida Sans Unicode&quot;, &quot;Lucida Sans&quot;, Geneva, Arial, sans-serif; font-style: normal; line-height: 20px; font-size: 15.8px; letter-spacing: 0px; color: rgba(0, 0, 0, 0.54); fill: rgba(0, 0, 0, 0.54);"><span
  3818. class="bj dz ea bl cz da db cy dc dd bo"
  3819. style="box-sizing: inherit; font-family: &quot;Lucida Grande&quot;, &quot;Lucida Sans Unicode&quot;, &quot;Lucida Sans&quot;, Geneva, Arial, sans-serif; line-height: 20px; color: rgba(0, 0, 0, 0.54); display: -webkit-box; overflow: hidden; max-height: 20px; text-overflow: ellipsis; -webkit-line-clamp: 1; -webkit-box-orient: vertical; font-weight: 300; font-size: 16px;"><a
  3820. class="at au av aw ax ay az ba bb bc eb bf bg bh bi"
  3821. href="https://example.test/@webmaxru/workbox-4-implementing-refresh-to-update-version-flow-using-the-workbox-window-module-41284967e79c?source=post_recirc---------1------------------"
  3822. rel="noopener"
  3823. style="box-sizing: inherit; color: inherit; text-decoration: none; -webkit-tap-highlight-color: transparent; fill: inherit; font-size: inherit; border: inherit; font-family: inherit; letter-spacing: inherit; font-weight: inherit; padding: 0px; margin: 0px;">Feb
  3824. 28,
  3825. 2019</a><span>&nbsp;</span>&middot;<span>&nbsp;</span>8<span>&nbsp;</span>min
  3826. read</span></span></div>
  3827. </div>
  3828. </div>
  3829. </div>
  3830. <div class="n o"
  3831. style="box-sizing: inherit; display: flex; align-items: center;">
  3832. <div class="n o"
  3833. style="box-sizing: inherit; display: flex; align-items: center;">
  3834. <div class="gk r gl"
  3835. style="box-sizing: inherit; display: block; margin-right: 5px; position: relative;">
  3836. <div class="ba gm gn go gp gq gr kt gt gu gv"
  3837. style="box-sizing: inherit; padding: 0px; outline: 0px; border: 0px; user-select: none; cursor: pointer; fill: rgba(0, 0, 0, 0.76);">
  3838. <a class="at au av aw ax ay az ba bb bc bd be bf bg bh bi"
  3839. href="https://example.test/foo?x=y&amp;source=post_recirc-----41284967e79c----1-----------------clap_preview-"
  3840. rel="noopener"
  3841. style="box-sizing: inherit; color: inherit; text-decoration: none; -webkit-tap-highlight-color: transparent; fill: inherit; font-size: inherit; border: inherit; font-family: inherit; letter-spacing: inherit; font-weight: inherit; padding: 0px; margin: 0px;"><svg
  3842. height="25" viewbox="0 0 25 25" width="25">
  3843. <g fill-rule="evenodd">
  3844. <path
  3845. d="M11.74 0l.76 2.97.76-2.97zM14.81 3.78l1.84-2.56-1.42-.47zM8.38 1.22l1.84 2.56L9.8.75zM20.38 21.62a5.11 5.11 0 0 1-3.16 1.61l.49-.45c2.88-2.89 3.45-5.98 1.69-9.21l-1.1-1.94-.96-2.02c-.31-.67-.23-1.18.25-1.55a.84.84 0 0 1 .66-.16c.34.05.66.28.88.6l2.85 5.02c1.18 1.97 1.38 5.12-1.6 8.1M7.1 21.1l-5.02-5.02a1 1 0 0 1 .7-1.7 1 1 0 0 1 .72.3l2.6 2.6a.44.44 0 0 0 .63-.62L4.1 14.04l-1.75-1.75a1 1 0 1 1 1.41-1.41l4.15 4.15a.44.44 0 0 0 .63 0 .44.44 0 0 0 0-.62L4.4 10.26 3.22 9.08a1 1 0 0 1 0-1.4 1.02 1.02 0 0 1 1.41 0l1.18 1.16L9.96 13a.44.44 0 0 0 .62 0 .44.44 0 0 0 0-.63L6.43 8.22a.99.99 0 0 1-.3-.7.99.99 0 0 1 .3-.7 1 1 0 0 1 1.41 0l7 6.98a.44.44 0 0 0 .7-.5l-1.35-2.85c-.31-.68-.23-1.19.25-1.56a.85.85 0 0 1 .66-.16c.34.06.66.28.88.6L18.63 14c1.57 2.88 1.07 5.54-1.55 8.16a5.62 5.62 0 0 1-5.06 1.65 9.35 9.35 0 0 1-4.93-2.72zM11 5.98l2.56 2.56c-.5.6-.56 1.41-.15 2.28l.26.56-4.25-4.25a.98.98 0 0 1-.12-.45 1 1 0 0 1 .29-.7 1.02 1.02 0 0 1 1.41 0zm8.89 2.06c-.38-.56-.9-.92-1.49-1.01a1.74 1.74 0 0 0-1.34.33c-.38.29-.61.65-.71 1.06a2.1 2.1 0 0 0-1.1-.56 1.78 1.78 0 0 0-.99.13l-2.64-2.64a1.88 1.88 0 0 0-2.65 0 1.86 1.86 0 0 0-.48.85 1.89 1.89 0 0 0-2.67-.01 1.87 1.87 0 0 0-.5.9c-.76-.75-2-.75-2.7-.04a1.88 1.88 0 0 0 0 2.66c-.3.12-.61.29-.87.55a1.88 1.88 0 0 0 0 2.66l.62.62a1.88 1.88 0 0 0-.9 3.16l5.01 5.02c1.6 1.6 3.52 2.64 5.4 2.96a7.16 7.16 0 0 0 1.18.1c1.03 0 2-.25 2.9-.7A5.9 5.9 0 0 0 21 22.24c3.34-3.34 3.08-6.93 1.74-9.17l-2.87-5.04z">
  3846. </path>
  3847. </g>
  3848. </svg></a></div>
  3849. </div>
  3850. <div class="gw r"
  3851. style="box-sizing: inherit; display: block; margin-top: 5px;">
  3852. <div class="gx" style="box-sizing: inherit;">
  3853. <h4 class="bj dz ea bl bo"
  3854. style="box-sizing: inherit; margin: 0px; font-family: &quot;Lucida Grande&quot;, &quot;Lucida Sans Unicode&quot;, &quot;Lucida Sans&quot;, Geneva, Arial, sans-serif; line-height: 20px; color: rgba(0, 0, 0, 0.54); font-weight: 300; font-size: 16px;">
  3855. 637</h4>
  3856. </div>
  3857. </div>
  3858. </div>
  3859. <div class="oe dw nw of og r"
  3860. style="box-sizing: inherit; display: block; margin-left: 12px; margin-right: 10px; border-right: 1px solid rgba(0, 0, 0, 0.1); height: 20px; width: 1px;">
  3861. &nbsp;</div>
  3862. <div style="box-sizing: inherit;">
  3863. <div aria-describedby="23" aria-hidden="true"
  3864. aria-labelledby="23" class="cf" role="tooltip"
  3865. style="box-sizing: inherit; display: inline-block;"><a
  3866. class="at au av aw ax ay az ba bb bc bd be bf bg bh bi"
  3867. href="https://example.test/foo?x=y&amp;source=post_recirc---------1-----------------bookmark_sidebar-"
  3868. rel="noopener"
  3869. style="box-sizing: inherit; color: inherit; text-decoration: none; -webkit-tap-highlight-color: transparent; fill: inherit; font-size: inherit; border: inherit; font-family: inherit; letter-spacing: inherit; font-weight: inherit; padding: 0px; margin: 0px;"><svg
  3870. height="25" viewbox="0 0 25 25" width="25">
  3871. <path
  3872. d="M19 6a2 2 0 0 0-2-2H8a2 2 0 0 0-2 2v14.66h.01c.01.1.05.2.12.28a.5.5 0 0 0 .7.03l5.67-4.12 5.66 4.13a.5.5 0 0 0 .71-.03.5.5 0 0 0 .12-.29H19V6zm-6.84 9.97L7 19.64V6a1 1 0 0 1 1-1h9a1 1 0 0 1 1 1v13.64l-5.16-3.67a.49.49 0 0 0-.68 0z"
  3873. fill-rule="evenodd"></path>
  3874. </svg></a></div>
  3875. </div>
  3876. </div>
  3877. </div>
  3878. </div>
  3879. </div>
  3880. </div>
  3881. </div>
  3882. </div>
  3883. <div class="lr ls lt lu lv lw lx ly lz ma mb mc md me mf mg mh mi mj mk ml"
  3884. style="box-sizing: inherit; flex-grow: 0; padding-left: 16px; padding-right: 16px; flex-basis: 33.3333%; max-width: 33.3333%;">
  3885. <div class="ak hw" style="box-sizing: inherit; width: 290.328px; height: 360.961px;">
  3886. <div class="r mm" style="box-sizing: inherit; display: block;">
  3887. <div class="mn mo lc ld le mp mq lf lg lh mr ms li lj lk mt mu ll lm ln mv mw lo lp lq n ha"
  3888. style="box-sizing: inherit; display: flex; flex-flow: row wrap; width: calc(100% + 32px); margin-left: -16px; margin-right: -16px; align-items: flex-start;">
  3889. <div class="lr ls lt lu lv lw mx my lz ma mz na md me nb nc mh mi nd ne ml"
  3890. style="box-sizing: inherit; flex-grow: 0; padding-left: 16px; padding-right: 16px; flex-basis: 100%; max-width: 100%;">
  3891. <div class="nf r ng f"
  3892. style="box-sizing: inherit; display: block; margin-bottom: 12px;">
  3893. <h4 class="bj dz ea bl bo"
  3894. style="box-sizing: inherit; margin: 0px; font-family: &quot;Lucida Grande&quot;, &quot;Lucida Sans Unicode&quot;, &quot;Lucida Sans&quot;, Geneva, Arial, sans-serif; line-height: 20px; color: rgba(0, 0, 0, 0.54); font-weight: 300; font-size: 16px;">
  3895. Related reads</h4>
  3896. </div>
  3897. <div class="nh r ni kw"
  3898. style="box-sizing: inherit; display: block; margin-bottom: 16px;">
  3899. <div class="nj gl"
  3900. style="box-sizing: inherit; position: relative; padding-bottom: 192.961px;">
  3901. <div class="hw dh ak"
  3902. style="box-sizing: inherit; width: 290.328px; position: absolute; height: 192.961px;">
  3903. <div class="ua r nl nm hw ak nn no"
  3904. style="box-sizing: inherit; display: block; width: 290.328px; height: 192.961px; background-origin: border-box; background-size: cover; background-position: 50% 50%; max-width: 100%; background-image: url(&quot;https://example.test/max/656/1*ecznyij282qt1QzClNgaWA.png&quot;);">
  3905. &nbsp;</div>
  3906. </div>
  3907. </div>
  3908. </div>
  3909. </div>
  3910. <div class="lr ls lt lu lv lw mx my lz ma mz na md me nb nc mh mi nd ne ml"
  3911. style="box-sizing: inherit; flex-grow: 0; padding-left: 16px; padding-right: 16px; flex-basis: 100%; max-width: 100%;">
  3912. <div class="nh r"
  3913. style="box-sizing: inherit; display: block; margin-bottom: 16px;">
  3914. <h3 class="de q nr ns bk nt nu nv"
  3915. style="box-sizing: inherit; margin: 0px; fill: rgba(0, 0, 0, 0.84); font-style: normal; color: rgba(0, 0, 0, 0.84); font-family: Georgia, Cambria, &quot;Times New Roman&quot;, Times, serif; font-weight: 500; font-size: 24px; line-height: 32px; letter-spacing: 0em;">
  3916. <a href="https://example.test/@ajmeyghani/javascript-bundlers-a-comparison-e63f01f2a364?source=post_recirc---------2------------------"
  3917. rel="noopener"
  3918. style="box-sizing: inherit; color: inherit; text-decoration: none; -webkit-tap-highlight-color: transparent;">JavaScript
  3919. Bundlers, a Comparison</a></h3>
  3920. </div>
  3921. <div class="n o dp"
  3922. style="box-sizing: inherit; display: flex; align-items: center; justify-content: space-between;">
  3923. <div class="nw r nx"
  3924. style="box-sizing: inherit; display: block; margin-right: 10px; flex: 0 1 auto;">
  3925. <div class="o n"
  3926. style="box-sizing: inherit; display: flex; align-items: center;">
  3927. <div style="box-sizing: inherit;">
  3928. <div class="gl ny nz"
  3929. style="box-sizing: inherit; position: relative; width: 40px; height: 40px;">
  3930. <div class="bs n lb o p dh oa ob oc fz od dl"
  3931. style="box-sizing: inherit; display: flex; align-items: center; justify-content: center; fill: rgb(3, 168, 124); position: absolute; pointer-events: none; left: 20px; flex-direction: row; width: calc(100% + 25px); height: calc(100% + 25px); top: 20px; transform: translateX(-50%) translateY(-50%);">
  3932. <a href="https://example.test/@ajmeyghani?source=post_recirc---------2------------------"
  3933. rel="noopener"
  3934. style="box-sizing: inherit; color: inherit; text-decoration: none; -webkit-tap-highlight-color: transparent;"><svg
  3935. height="49" viewbox="0 0 49 49"
  3936. width="49">
  3937. <path clip-rule="evenodd"
  3938. d="M24.5 1.1c-9.39 0-17.53 5.55-21.51 13.66L2 14.28C6.15 5.82 14.66 0 24.5 0S42.85 5.82 47 14.28l-.99.48C42.03 6.65 33.9 1.1 24.5 1.1zM2.99 34.24C6.97 42.35 15.1 47.9 24.5 47.9c9.39 0 17.53-5.55 21.51-13.66l.99.48C42.85 43.18 34.34 49 24.5 49S6.15 43.18 2 34.72l.99-.48z"
  3939. fill-rule="evenodd"> </path>
  3940. </svg></a></div>
  3941. <a href="https://example.test/@ajmeyghani?source=post_recirc---------2------------------"
  3942. rel="noopener"
  3943. style="box-sizing: inherit; color: inherit; text-decoration: none; -webkit-tap-highlight-color: transparent;"><img
  3944. alt="AJ Meyghani" class="r dt nz ny"
  3945. height="40"
  3946. src="https://example.test/fit/c/80/80/1*Z_ZlnjqI3w89H8AnkchYCA.png"
  3947. style="box-sizing: inherit; vertical-align: middle; display: block; border-radius: 50%; width: 40px; height: 40px;"
  3948. width="40" /> </a>
  3949. </div>
  3950. </div>
  3951. <div class="dw ak r"
  3952. style="box-sizing: inherit; display: block; width: 124.664px; margin-left: 12px;">
  3953. <div class="n"
  3954. style="box-sizing: inherit; display: flex;">
  3955. <div style="box-sizing: inherit; flex: 1 1 0%;">
  3956. <div class="ch n o dy"
  3957. style="box-sizing: inherit; display: flex; align-items: center; margin-bottom: 0px;">
  3958. <span class="bj b bk bl bm bn r de q"
  3959. style="box-sizing: inherit; font-weight: 400; fill: rgba(0, 0, 0, 0.84); display: block; font-family: &quot;Lucida Grande&quot;, &quot;Lucida Sans Unicode&quot;, &quot;Lucida Sans&quot;, Geneva, Arial, sans-serif; font-style: normal; line-height: 20px; font-size: 15.8px; letter-spacing: 0px; color: rgba(0, 0, 0, 0.84);"><span
  3960. class="bj dz ea bl cz da db cy dc dd de"
  3961. style="box-sizing: inherit; font-family: &quot;Lucida Grande&quot;, &quot;Lucida Sans Unicode&quot;, &quot;Lucida Sans&quot;, Geneva, Arial, sans-serif; line-height: 20px; display: -webkit-box; overflow: hidden; max-height: 20px; text-overflow: ellipsis; -webkit-line-clamp: 1; -webkit-box-orient: vertical; color: rgba(0, 0, 0, 0.84); font-weight: 300; font-size: 16px;"><a
  3962. class="at au av aw ax ay az ba bb bc eb bf bg bh bi"
  3963. href="https://example.test/@ajmeyghani?source=post_recirc---------2------------------"
  3964. rel="noopener"
  3965. style="box-sizing: inherit; color: inherit; text-decoration: none; -webkit-tap-highlight-color: transparent; fill: inherit; font-size: inherit; border: inherit; font-family: inherit; letter-spacing: inherit; font-weight: inherit; padding: 0px; margin: 0px;">AJ
  3966. Meyghani</a></span></span></div>
  3967. </div>
  3968. </div>
  3969. <div style="box-sizing: inherit;"><span
  3970. class="bj b bk bl bm bn r bo bp"
  3971. style="box-sizing: inherit; font-weight: 400; display: block; font-family: &quot;Lucida Grande&quot;, &quot;Lucida Sans Unicode&quot;, &quot;Lucida Sans&quot;, Geneva, Arial, sans-serif; font-style: normal; line-height: 20px; font-size: 15.8px; letter-spacing: 0px; color: rgba(0, 0, 0, 0.54); fill: rgba(0, 0, 0, 0.54);"><span
  3972. class="bj dz ea bl cz da db cy dc dd bo"
  3973. style="box-sizing: inherit; font-family: &quot;Lucida Grande&quot;, &quot;Lucida Sans Unicode&quot;, &quot;Lucida Sans&quot;, Geneva, Arial, sans-serif; line-height: 20px; color: rgba(0, 0, 0, 0.54); display: -webkit-box; overflow: hidden; max-height: 20px; text-overflow: ellipsis; -webkit-line-clamp: 1; -webkit-box-orient: vertical; font-weight: 300; font-size: 16px;"><a
  3974. class="at au av aw ax ay az ba bb bc eb bf bg bh bi"
  3975. href="https://example.test/@ajmeyghani/javascript-bundlers-a-comparison-e63f01f2a364?source=post_recirc---------2------------------"
  3976. rel="noopener"
  3977. style="box-sizing: inherit; color: inherit; text-decoration: none; -webkit-tap-highlight-color: transparent; fill: inherit; font-size: inherit; border: inherit; font-family: inherit; letter-spacing: inherit; font-weight: inherit; padding: 0px; margin: 0px;">Oct
  3978. 28,
  3979. 2018</a><span>&nbsp;</span>&middot;<span>&nbsp;</span>27min
  3980. read<span
  3981. style="box-sizing: inherit; padding-left: 4px;"><svg
  3982. class="star-15px_svg__svgIcon-use"
  3983. height="15"
  3984. style="margin-top: -2px;"
  3985. viewbox="0 0 15 15" width="15">
  3986. <path
  3987. d="M7.44 2.32c.03-.1.09-.1.12 0l1.2 3.53a.29.29 0 0 0 .26.2h3.88c.11 0 .13.04.04.1L9.8 8.33a.27.27 0 0 0-.1.29l1.2 3.53c.03.1-.01.13-.1.07l-3.14-2.18a.3.3 0 0 0-.32 0L4.2 12.22c-.1.06-.14.03-.1-.07l1.2-3.53a.27.27 0 0 0-.1-.3L2.06 6.16c-.1-.06-.07-.12.03-.12h3.89a.29.29 0 0 0 .26-.19l1.2-3.52z">
  3988. </path>
  3989. </svg></span></span></span></div>
  3990. </div>
  3991. </div>
  3992. </div>
  3993. <div class="n o"
  3994. style="box-sizing: inherit; display: flex; align-items: center;">
  3995. <div class="n o"
  3996. style="box-sizing: inherit; display: flex; align-items: center;">
  3997. <div class="gk r gl"
  3998. style="box-sizing: inherit; display: block; margin-right: 5px; position: relative;">
  3999. <div class="ba gm gn go gp gq gr kt gt gu gv"
  4000. style="box-sizing: inherit; padding: 0px; outline: 0px; border: 0px; user-select: none; cursor: pointer; fill: rgba(0, 0, 0, 0.76);">
  4001. <a class="at au av aw ax ay az ba bb bc bd be bf bg bh bi"
  4002. href="https://example.test/foo?x=y&amp;source=post_recirc-----e63f01f2a364----2-----------------clap_preview-"
  4003. rel="noopener"
  4004. style="box-sizing: inherit; color: inherit; text-decoration: none; -webkit-tap-highlight-color: transparent; fill: inherit; font-size: inherit; border: inherit; font-family: inherit; letter-spacing: inherit; font-weight: inherit; padding: 0px; margin: 0px;"><svg
  4005. height="25" viewbox="0 0 25 25" width="25">
  4006. <g fill-rule="evenodd">
  4007. <path
  4008. d="M11.74 0l.76 2.97.76-2.97zM14.81 3.78l1.84-2.56-1.42-.47zM8.38 1.22l1.84 2.56L9.8.75zM20.38 21.62a5.11 5.11 0 0 1-3.16 1.61l.49-.45c2.88-2.89 3.45-5.98 1.69-9.21l-1.1-1.94-.96-2.02c-.31-.67-.23-1.18.25-1.55a.84.84 0 0 1 .66-.16c.34.05.66.28.88.6l2.85 5.02c1.18 1.97 1.38 5.12-1.6 8.1M7.1 21.1l-5.02-5.02a1 1 0 0 1 .7-1.7 1 1 0 0 1 .72.3l2.6 2.6a.44.44 0 0 0 .63-.62L4.1 14.04l-1.75-1.75a1 1 0 1 1 1.41-1.41l4.15 4.15a.44.44 0 0 0 .63 0 .44.44 0 0 0 0-.62L4.4 10.26 3.22 9.08a1 1 0 0 1 0-1.4 1.02 1.02 0 0 1 1.41 0l1.18 1.16L9.96 13a.44.44 0 0 0 .62 0 .44.44 0 0 0 0-.63L6.43 8.22a.99.99 0 0 1-.3-.7.99.99 0 0 1 .3-.7 1 1 0 0 1 1.41 0l7 6.98a.44.44 0 0 0 .7-.5l-1.35-2.85c-.31-.68-.23-1.19.25-1.56a.85.85 0 0 1 .66-.16c.34.06.66.28.88.6L18.63 14c1.57 2.88 1.07 5.54-1.55 8.16a5.62 5.62 0 0 1-5.06 1.65 9.35 9.35 0 0 1-4.93-2.72zM11 5.98l2.56 2.56c-.5.6-.56 1.41-.15 2.28l.26.56-4.25-4.25a.98.98 0 0 1-.12-.45 1 1 0 0 1 .29-.7 1.02 1.02 0 0 1 1.41 0zm8.89 2.06c-.38-.56-.9-.92-1.49-1.01a1.74 1.74 0 0 0-1.34.33c-.38.29-.61.65-.71 1.06a2.1 2.1 0 0 0-1.1-.56 1.78 1.78 0 0 0-.99.13l-2.64-2.64a1.88 1.88 0 0 0-2.65 0 1.86 1.86 0 0 0-.48.85 1.89 1.89 0 0 0-2.67-.01 1.87 1.87 0 0 0-.5.9c-.76-.75-2-.75-2.7-.04a1.88 1.88 0 0 0 0 2.66c-.3.12-.61.29-.87.55a1.88 1.88 0 0 0 0 2.66l.62.62a1.88 1.88 0 0 0-.9 3.16l5.01 5.02c1.6 1.6 3.52 2.64 5.4 2.96a7.16 7.16 0 0 0 1.18.1c1.03 0 2-.25 2.9-.7A5.9 5.9 0 0 0 21 22.24c3.34-3.34 3.08-6.93 1.74-9.17l-2.87-5.04z">
  4009. </path>
  4010. </g>
  4011. </svg></a></div>
  4012. </div>
  4013. <div class="gw r"
  4014. style="box-sizing: inherit; display: block; margin-top: 5px;">
  4015. <div class="gx" style="box-sizing: inherit;">
  4016. <h4 class="bj dz ea bl bo"
  4017. style="box-sizing: inherit; margin: 0px; font-family: &quot;Lucida Grande&quot;, &quot;Lucida Sans Unicode&quot;, &quot;Lucida Sans&quot;, Geneva, Arial, sans-serif; line-height: 20px; color: rgba(0, 0, 0, 0.54); font-weight: 300; font-size: 16px;">
  4018. 1.5K</h4>
  4019. </div>
  4020. </div>
  4021. </div>
  4022. <div class="oe dw nw of og r"
  4023. style="box-sizing: inherit; display: block; margin-left: 12px; margin-right: 10px; border-right: 1px solid rgba(0, 0, 0, 0.1); height: 20px; width: 1px;">
  4024. &nbsp;</div>
  4025. <div style="box-sizing: inherit;">
  4026. <div aria-describedby="24" aria-hidden="true"
  4027. aria-labelledby="24" class="cf" role="tooltip"
  4028. style="box-sizing: inherit; display: inline-block;"><a
  4029. class="at au av aw ax ay az ba bb bc bd be bf bg bh bi"
  4030. href="https://example.test/foo?x=y&amp;source=post_recirc---------2-----------------bookmark_sidebar-"
  4031. rel="noopener"
  4032. style="box-sizing: inherit; color: inherit; text-decoration: none; -webkit-tap-highlight-color: transparent; fill: inherit; font-size: inherit; border: inherit; font-family: inherit; letter-spacing: inherit; font-weight: inherit; padding: 0px; margin: 0px;"><svg
  4033. height="25" viewbox="0 0 25 25" width="25">
  4034. <path
  4035. d="M19 6a2 2 0 0 0-2-2H8a2 2 0 0 0-2 2v14.66h.01c.01.1.05.2.12.28a.5.5 0 0 0 .7.03l5.67-4.12 5.66 4.13a.5.5 0 0 0 .71-.03.5.5 0 0 0 .12-.29H19V6zm-6.84 9.97L7 19.64V6a1 1 0 0 1 1-1h9a1 1 0 0 1 1 1v13.64l-5.16-3.67a.49.49 0 0 0-.68 0z"
  4036. fill-rule="evenodd"></path>
  4037. </svg></a></div>
  4038. </div>
  4039. </div>
  4040. </div>
  4041. </div>
  4042. </div>
  4043. </div>
  4044. </div>
  4045. </div>
  4046. </div>
  4047. </div>
  4048. </div>
  4049. </div>
  4050. </div>
  4051. </div>
  4052. </div>
  4053. <div class="jf r jg jh"
  4054. style="box-sizing: inherit; display: block; padding: 60px 0px; background-color: rgba(0, 0, 0, 0.9); color: rgba(0, 0, 0, 0.8); font-family: BlinkMacSystemFont, &quot;Segoe UI&quot;, Roboto, Oxygen, Ubuntu, Cantarell, &quot;Open Sans&quot;, &quot;Helvetica Neue&quot;, sans-serif; font-size: medium; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 400; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial;">
  4055. <section class="cl cm ak ce r ji jj jk jl jm jn jo jp jq jr js jt ju jv jw"
  4056. style="box-sizing: border-box; display: block; width: 1063px; margin-left: auto; margin-right: auto; padding-left: 64px; padding-right: 64px; max-width: 1320px;">
  4057. <div class="jx jy ib n dp g"
  4058. style="box-sizing: inherit; display: flex; justify-content: space-between; margin-bottom: 32px; padding-bottom: 48px; border-bottom: 1px solid rgba(255, 255, 255, 0.54);">
  4059. <div class="jz n dp"
  4060. style="box-sizing: inherit; display: flex; justify-content: space-between; margin: 0px -12px;">
  4061. <div class="ka r kb" style="box-sizing: inherit; display: block; margin: 0px 12px; flex: 1 1 0px;">
  4062. <div class="kc r" style="box-sizing: inherit; display: block; padding-bottom: 12px;">
  4063. <h4 class="kh ki kj bj io bk iv kk kl r"
  4064. style="box-sizing: inherit; margin: 0px; display: block; font-family: &quot;Lucida Grande&quot;, &quot;Lucida Sans Unicode&quot;, &quot;Lucida Sans&quot;, Geneva, Arial, sans-serif; font-style: normal; font-weight: 600; line-height: 24px; color: rgba(255, 255, 255, 0.98); fill: rgba(255, 255, 255, 0.98); text-align: inherit; font-size: 21.6px; letter-spacing: -0.32px;">
  4065. <a class="at au av aw ax ay az ba bb bc kd ke bf bg kf kg"
  4066. href="https://example.test/about?autoplay=1&amp;source=post_page-----12345----------------------"
  4067. rel="noopener"
  4068. style="box-sizing: inherit; color: inherit; text-decoration: none; -webkit-tap-highlight-color: transparent; fill: inherit; font-size: inherit; border: inherit; font-family: inherit; letter-spacing: inherit; font-weight: inherit; padding: 0px; margin: 0px;">Discover<span>&nbsp;</span></a>
  4069. </h4>
  4070. </div>
  4071. <span class="bj b bk bl bm bn r km kn"
  4072. style="box-sizing: inherit; font-weight: 400; display: block; font-family: &quot;Lucida Grande&quot;, &quot;Lucida Sans Unicode&quot;, &quot;Lucida Sans&quot;, Geneva, Arial, sans-serif; font-style: normal; line-height: 20px; font-size: 15.8px; letter-spacing: 0px; color: rgba(255, 255, 255, 0.7); fill: rgba(255, 255, 255, 0.7);">Welcome
  4073. lorem ipsum. Lorem ipsum - with no ads in sight.<span>&nbsp;</span><a
  4074. class="at au av aw ax ay az ba bb bc bf bg kf kg ko"
  4075. href="https://example.test/about?autoplay=1&amp;source=post_page-----12345----------------------"
  4076. rel="noopener"
  4077. style="box-sizing: inherit; color: inherit; text-decoration: underline; -webkit-tap-highlight-color: transparent; fill: inherit; font-size: inherit; border: inherit; font-family: inherit; letter-spacing: inherit; font-weight: inherit; padding: 0px; margin: 0px;">Watch</a></span>
  4078. </div>
  4079. <div class="ka r kb" style="box-sizing: inherit; display: block; margin: 0px 12px; flex: 1 1 0px;">
  4080. <div class="kp r" style="box-sizing: inherit; display: block; padding-bottom: 8px;">
  4081. <h4 class="kh ki kj bj io bk iv kk kl r"
  4082. style="box-sizing: inherit; margin: 0px; display: block; font-family: &quot;Lucida Grande&quot;, &quot;Lucida Sans Unicode&quot;, &quot;Lucida Sans&quot;, Geneva, Arial, sans-serif; font-style: normal; font-weight: 600; line-height: 24px; color: rgba(255, 255, 255, 0.98); fill: rgba(255, 255, 255, 0.98); text-align: inherit; font-size: 21.6px; letter-spacing: -0.32px;">
  4083. </h4>
  4084. </div>
  4085. <span class="bj b bk bl bm bn r km kn"
  4086. style="box-sizing: inherit; font-weight: 400; display: block; font-family: &quot;Lucida Grande&quot;, &quot;Lucida Sans Unicode&quot;, &quot;Lucida Sans&quot;, Geneva, Arial, sans-serif; font-style: normal; line-height: 20px; font-size: 15.8px; letter-spacing: 0px; color: rgba(255, 255, 255, 0.7); fill: rgba(255, 255, 255, 0.7);">Follow
  4087. all the topics you care about, and we&rsquo;ll deliver the best stories for you to your homepage
  4088. and inbox.<span>&nbsp;</span><a class="at au av aw ax ay az ba bb bc bf bg kf kg ko"
  4089. href="https://example.test/topics?source=post_page-----12345----------------------"
  4090. rel="noopener"
  4091. style="box-sizing: inherit; color: inherit; text-decoration: underline; -webkit-tap-highlight-color: transparent; fill: inherit; font-size: inherit; border: inherit; font-family: inherit; letter-spacing: inherit; font-weight: inherit; padding: 0px; margin: 0px;">Explore</a></span>
  4092. </div>
  4093. <div class="ka r kb" style="box-sizing: inherit; display: block; margin: 0px 12px; flex: 1 1 0px;">
  4094. <div class="kc r" style="box-sizing: inherit; display: block; padding-bottom: 12px;">
  4095. <h4 class="kh ki kj bj io bk iv kk kl r"
  4096. style="box-sizing: inherit; margin: 0px; display: block; font-family: &quot;Lucida Grande&quot;, &quot;Lucida Sans Unicode&quot;, &quot;Lucida Sans&quot;, Geneva, Arial, sans-serif; font-style: normal; font-weight: 600; line-height: 24px; color: rgba(255, 255, 255, 0.98); fill: rgba(255, 255, 255, 0.98); text-align: inherit; font-size: 21.6px; letter-spacing: -0.32px;">
  4097. <a class="at au av aw ax ay az ba bb bc kd ke bf bg kf kg"
  4098. href="https://example.test/membership?source=post_page-----12345----------------------"
  4099. rel="noopener"
  4100. style="box-sizing: inherit; color: inherit; text-decoration: none; -webkit-tap-highlight-color: transparent; fill: inherit; font-size: inherit; border: inherit; font-family: inherit; letter-spacing: inherit; font-weight: inherit; padding: 0px; margin: 0px;">Become
  4101. a member</a></h4>
  4102. </div>
  4103. </div>
  4104. </div>
  4105. </div>
  4106. <div class="n o dp"
  4107. style="box-sizing: inherit; display: flex; align-items: center; justify-content: space-between;"><a
  4108. class="at au av aw ax ay az ba bb bc kd ke bf bg kf kg"
  4109. href="https://example.test/?source=post_page-----12345----------------------" rel="noopener"
  4110. style="box-sizing: inherit; color: inherit; text-decoration: none; -webkit-tap-highlight-color: transparent; fill: inherit; font-size: inherit; border: inherit; font-family: inherit; letter-spacing: inherit; font-weight: inherit; padding: 0px; margin: 0px;"><svg
  4111. class="ki" height="22" viewbox="0 0 111.5 22" width="112">
  4112. <path
  4113. d="M56.3 19.5c0 .4 0 .5.3.7l1.5 1.4v.1h-6.5V19c-.7 1.8-2.4 3-4.3 3-3.3 0-5.8-2.6-5.8-7.5 0-4.5 2.6-7.6 6.3-7.6 1.6-.1 3.1.8 3.8 2.4V3.2c0-.3-.1-.6-.3-.7l-1.4-1.4V1l6.5-.8v19.3zm-4.8-.8V9.5c-.5-.6-1.2-.9-1.9-.9-1.6 0-3.1 1.4-3.1 5.7 0 4 1.3 5.4 3 5.4.8.1 1.6-.3 2-1zm9.1 3.1V9.4c0-.3-.1-.6-.3-.7l-1.4-1.5v-.1h6.5v12.5c0 .4 0 .5.3.7l1.4 1.4v.1h-6.5zm-.2-19.2C60.4 1.2 61.5 0 63 0c1.4 0 2.6 1.2 2.6 2.6S64.4 5.3 63 5.3a2.6 2.6 0 0 1-2.6-2.7zm22.5 16.9c0 .4 0 .5.3.7l1.5 1.4v.1h-6.5v-3.2c-.6 2-2.4 3.4-4.5 3.4-2.9 0-4.4-2.1-4.4-6.2 0-1.9 0-4.1.1-6.5 0-.3-.1-.5-.3-.7L67.7 7v.1H74v8c0 2.6.4 4.4 2 4.4.9-.1 1.7-.6 2.1-1.3V9.5c0-.3-.1-.6-.3-.7l-1.4-1.5v-.2h6.5v12.4zm22 2.3c0-.5.1-6.5.1-7.9 0-2.6-.4-4.5-2.2-4.5-.9 0-1.8.5-2.3 1.3.2.8.3 1.7.3 2.5 0 1.8-.1 4.2-.1 6.5 0 .3.1.5.3.7l1.5 1.4v.1H96c0-.4.1-6.5.1-7.9 0-2.7-.4-4.5-2.2-4.5-.9 0-1.7.5-2.2 1.3v9c0 .4 0 .5.3.7l1.4 1.4v.1h-6.5V9.5c0-.3-.1-.6-.3-.7l-1.4-1.5v-.2h6.5v3.1a4.6 4.6 0 0 1 4.6-3.4c2.2 0 3.6 1.2 4.2 3.5.7-2.1 2.7-3.6 4.9-3.5 2.9 0 4.5 2.2 4.5 6.2 0 1.9-.1 4.2-.1 6.5-.1.3.1.6.3.7l1.4 1.4v.1h-6.6zm-81.4-2l1.9 1.9v.1h-9.8v-.1l2-1.9c.2-.2.3-.4.3-.7V7.3c0-.5 0-1.2.1-1.8L11.4 22h-.1L4.5 6.8c-.1-.4-.2-.4-.3-.6v10c-.1.7 0 1.3.3 1.9l2.7 3.6v.1H0v-.1L2.7 18c.3-.6.4-1.3.3-1.9v-11c0-.5-.1-1.1-.5-1.5L.7 1.1V1h7l5.8 12.9L18.6 1h6.8v.1l-1.9 2.2c-.2.2-.3.5-.3.7v15.2c0 .2.1.5.3.6zm7.6-5.9c0 3.8 1.9 5.3 4.2 5.3 1.9.1 3.6-1 4.4-2.7h.1c-.8 3.7-3.1 5.5-6.5 5.5-3.7 0-7.2-2.2-7.2-7.4 0-5.5 3.5-7.6 7.3-7.6 3.1 0 6.4 1.5 6.4 6.2v.8h-8.7zm0-.8h4.3v-.8c0-3.9-.8-4.9-2-4.9-1.4.1-2.3 1.6-2.3 5.7z">
  4114. </path>
  4115. </svg></a><span class="bj b bk bl bm bn r km kn"
  4116. style="box-sizing: inherit; font-weight: 400; display: block; font-family: &quot;Lucida Grande&quot;, &quot;Lucida Sans Unicode&quot;, &quot;Lucida Sans&quot;, Geneva, Arial, sans-serif; font-style: normal; line-height: 20px; font-size: 15.8px; letter-spacing: 0px; color: rgba(255, 255, 255, 0.7); fill: rgba(255, 255, 255, 0.7);">
  4117. </span>
  4118. <div class="kq kr n dp ks an"
  4119. style="box-sizing: inherit; display: flex; justify-content: space-between; padding-top: 8px; width: 200px;">
  4120. <span class="bj b bk bl bm bn r km kn"
  4121. style="box-sizing: inherit; font-weight: 400; display: block; font-family: &quot;Lucida Grande&quot;, &quot;Lucida Sans Unicode&quot;, &quot;Lucida Sans&quot;, Geneva, Arial, sans-serif; font-style: normal; line-height: 20px; font-size: 15.8px; letter-spacing: 0px; color: rgba(255, 255, 255, 0.7); fill: rgba(255, 255, 255, 0.7);"><a
  4122. class="at au av aw ax ay az ba bb bc eb bf bg kf kg"
  4123. href="https://example.test/about?autoplay=1&amp;source=post_page-----12345----------------------"
  4124. rel="noopener"
  4125. style="box-sizing: inherit; color: inherit; text-decoration: none; -webkit-tap-highlight-color: transparent; fill: inherit; font-size: inherit; border: inherit; font-family: inherit; letter-spacing: inherit; font-weight: inherit; padding: 0px; margin: 0px;">About</a><a
  4126. class="at au av aw ax ay az ba bb bc eb bf bg kf kg"
  4127. href="https://example.test/?source=post_page-----12345----------------------"
  4128. rel="noopener"
  4129. style="box-sizing: inherit; color: inherit; text-decoration: none; -webkit-tap-highlight-color: transparent; fill: inherit; font-size: inherit; border: inherit; font-family: inherit; letter-spacing: inherit; font-weight: inherit; padding: 0px; margin: 0px;">Help</a><a
  4130. class="at au av aw ax ay az ba bb bc eb bf bg kf kg"
  4131. href="https://example.test/policy/9db0094a1e0f?source=post_page-----12345----------------------"
  4132. rel="noopener"
  4133. style="box-sizing: inherit; color: inherit; text-decoration: none; -webkit-tap-highlight-color: transparent; fill: inherit; font-size: inherit; border: inherit; font-family: inherit; letter-spacing: inherit; font-weight: inherit; padding: 0px; margin: 0px;">Legal</a>
  4134. </span></div>
  4135. <span class="bj b bk bl bm bn r km kn"
  4136. style="box-sizing: inherit; font-weight: 400; display: block; font-family: &quot;Lucida Grande&quot;, &quot;Lucida Sans Unicode&quot;, &quot;Lucida Sans&quot;, Geneva, Arial, sans-serif; font-style: normal; line-height: 20px; font-size: 15.8px; letter-spacing: 0px; color: rgba(255, 255, 255, 0.7); fill: rgba(255, 255, 255, 0.7);">
  4137. </span>
  4138. </div>
  4139. </section>
  4140. </div>
  4141. <p>&nbsp;</p>
  4142. <div class="noprint" id="mw-head-base"
  4143. style="margin-top: -5em; margin-left: 11em; height: 5em; color: rgb(0, 0, 0); font-family: sans-serif; font-size: 16px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 400; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial;">
  4144. &nbsp;</div>
  4145. <p>&nbsp;</p>
  4146. <div class="mw-body" id="content" role="main"
  4147. style="background-color: rgb(255, 255, 255); color: rgb(34, 34, 34); padding: 1.25em 1.5em 1.5em; direction: ltr; margin-left: 11em; border-width: 1px 0px 1px 1px; border-style: solid; border-color: rgb(167, 215, 249); border-image: initial; margin-top: -1px; font-family: sans-serif; font-size: 16px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 400; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial;">
  4148. <a id="top" style="text-decoration: none; color: rgb(6, 69, 173); background: none; cursor: pointer;"></a>
  4149. <div class="mw-body-content" id="siteNotice"
  4150. style="position: relative; font-size: 0.8em; line-height: 1.6; z-index: 0; text-align: center; margin: 0px;">
  4151. <div id="centralNotice">&nbsp;</div>
  4152. </div>
  4153. <div class="mw-indicators mw-body-content"
  4154. style="position: relative; font-size: 0.875em; line-height: 1.6; z-index: 1; float: right; padding-top: 0.4em;">
  4155. &nbsp;</div>
  4156. <h1 class="firstHeading" id="firstHeading" lang="en"
  4157. style="color: rgb(0, 0, 0); background: none; font-weight: normal; margin: 0px 0px 0.25em; overflow: visible; padding: 0px; border-bottom: 1px solid rgb(162, 169, 177); font-size: 1.8em; font-family: &quot;Linux Libertine&quot;, Georgia, Times, serif; line-height: 1.3;">
  4158. CKEditor</h1>
  4159. <div class="mw-body-content" id="bodyContent"
  4160. style="position: relative; font-size: 0.875em; line-height: 1.6; z-index: 0;">
  4161. <div class="noprint" id="siteSub" style="display: block; font-size: 12.88px;">From Wikipedia, the free
  4162. encyclopedia</div>
  4163. <div id="contentSub"
  4164. style="font-size: 11.76px; line-height: 1.2em; margin: 0px 0px 1.4em 1em; color: rgb(84, 89, 93); width: auto;">
  4165. &nbsp;</div>
  4166. <div id="jump-to-nav">&nbsp;</div>
  4167. <a class="mw-jump-link" href="https://en.wikipedia.org/wiki/CKEditor#mw-head"
  4168. style="text-decoration: none; color: rgb(11, 0, 128); background: none; display: block; clip: rect(1px, 1px, 1px, 1px); width: 1px; height: 1px; margin: -1px; border: 0px; padding: 0px; overflow: hidden; position: absolute !important;">Jump
  4169. to navigation</a><a class="mw-jump-link" href="https://en.wikipedia.org/wiki/CKEditor#p-search"
  4170. style="text-decoration: none; color: rgb(11, 0, 128); background: none; display: block; clip: rect(1px, 1px, 1px, 1px); width: 1px; height: 1px; margin: -1px; border: 0px; padding: 0px; overflow: hidden; position: absolute !important;">Jump
  4171. to search</a>
  4172. <div class="mw-content-ltr" dir="ltr" id="mw-content-text" lang="en" style="direction: ltr;">
  4173. <div class="mw-parser-output">
  4174. <table class="box-More_citations_needed plainlinks metadata ambox ambox-content ambox-Refimprove"
  4175. role="presentation"
  4176. style="font-size: 14px; margin: 0px 83.7969px; border-width: 1px 1px 1px 10px; border-style: solid; border-color: rgb(162, 169, 177) rgb(162, 169, 177) rgb(162, 169, 177) rgb(242, 133, 0); border-image: initial; background-color: rgb(251, 251, 251); box-sizing: border-box;">
  4177. <tbody>
  4178. <tr>
  4179. <td class="mbox-image"
  4180. style="border: none; padding: 2px 0px 2px 0.5em; text-align: center;">
  4181. <div style="width: 52px;"><a class="image"
  4182. href="https://en.wikipedia.org/wiki/File:Question_book-new.svg"
  4183. style="text-decoration: none; color: rgb(11, 0, 128); background: none;"><img
  4184. alt="" data-file-height="399" data-file-width="512" decoding="async"
  4185. height="39"
  4186. src="https://upload.wikimedia.org/wikipedia/en/thumb/9/99/Question_book-new.svg/50px-Question_book-new.svg.png"
  4187. srcset="//upload.wikimedia.org/wikipedia/en/thumb/9/99/Question_book-new.svg/75px-Question_book-new.svg.png 1.5x, //upload.wikimedia.org/wikipedia/en/thumb/9/99/Question_book-new.svg/100px-Question_book-new.svg.png 2x"
  4188. style="border: 0px; vertical-align: middle;" width="50" /></a></div>
  4189. </td>
  4190. <td class="mbox-text" style="border: none; padding: 0.25em 0.5em; width: 580px;">
  4191. <div class="mbox-text-span">This article<span>&nbsp;</span><b>needs additional citations
  4192. for<span>&nbsp;</span><a
  4193. href="https://en.wikipedia.org/wiki/Wikipedia:Verifiability"
  4194. style="text-decoration: none; color: rgb(11, 0, 128); background: none;"
  4195. title="Wikipedia:Verifiability">verification</a></b>.<span
  4196. class="hide-when-compact"><span>&nbsp;</span>Please help<span>&nbsp;</span><a
  4197. class="external text"
  4198. href="https://en.wikipedia.org/w/index.php?title=CKEditor&amp;action=edit"
  4199. style="text-decoration: none; color: rgb(102, 51, 102); background: none !important; padding: 0px !important;">improve
  4200. this article</a><span>&nbsp;</span>by<span>&nbsp;</span><a
  4201. href="https://en.wikipedia.org/wiki/Help:Introduction_to_referencing_with_Wiki_Markup/1"
  4202. style="text-decoration: none; color: rgb(11, 0, 128); background: none;"
  4203. title="Help:Introduction to referencing with Wiki Markup/1">adding citations
  4204. to reliable sources</a>. Unsourced material may be challenged and
  4205. removed.<br />
  4206. <small style="font-size: 11.9px;"><span class="plainlinks"><i>Find
  4207. sources:</i>&nbsp;<a class="external text"
  4208. href="https://www.google.com/search?as_eq=wikipedia&amp;q=%22CKEditor%22"
  4209. rel="nofollow"
  4210. style="text-decoration: none; color: rgb(102, 51, 102); background: none !important; padding: 0px !important;">&quot;CKEditor&quot;</a>&nbsp;&ndash;&nbsp;<a
  4211. class="external text"
  4212. href="https://www.google.com/search?tbm=nws&amp;q=%22CKEditor%22+-wikipedia"
  4213. rel="nofollow"
  4214. style="text-decoration: none; color: rgb(102, 51, 102); background: none !important; padding: 0px !important;">news</a>&nbsp;<b>&middot;</b><span>&nbsp;</span><a
  4215. class="external text"
  4216. href="https://www.google.com/search?&amp;q=%22CKEditor%22+site:news.google.com/newspapers&amp;source=newspapers"
  4217. rel="nofollow"
  4218. style="text-decoration: none; color: rgb(102, 51, 102); background: none !important; padding: 0px !important;">newspapers</a>&nbsp;<b>&middot;</b><span>&nbsp;</span><a
  4219. class="external text"
  4220. href="https://www.google.com/search?tbs=bks:1&amp;q=%22CKEditor%22+-wikipedia"
  4221. rel="nofollow"
  4222. style="text-decoration: none; color: rgb(102, 51, 102); background: none !important; padding: 0px !important;">books</a>&nbsp;<b>&middot;</b><span>&nbsp;</span><a
  4223. class="external text"
  4224. href="https://scholar.google.com/scholar?q=%22CKEditor%22"
  4225. rel="nofollow"
  4226. style="text-decoration: none; color: rgb(102, 51, 102); background: none !important; padding: 0px !important;">scholar</a>&nbsp;<b>&middot;</b><span>&nbsp;</span><a
  4227. class="external text"
  4228. href="https://www.jstor.org/action/doBasicSearch?Query=%22CKEditor%22&amp;acc=on&amp;wc=on"
  4229. rel="nofollow"
  4230. style="text-decoration: none; color: rgb(102, 51, 102); background: none !important; padding: 0px !important;">JSTOR</a></span></small></span><span>&nbsp;</span><small
  4231. class="date-container" style="font-size: 11.9px;"><i>(<span class="date">March
  4232. 2018</span>)</i></small><small class="hide-when-compact"
  4233. style="font-size: 11.9px;"><i><span>&nbsp;</span>(<a
  4234. href="https://en.wikipedia.org/wiki/Help:Maintenance_template_removal"
  4235. style="text-decoration: none; color: rgb(11, 0, 128); background: none;"
  4236. title="Help:Maintenance template removal">Learn how and when to remove
  4237. this template message</a>)</i></small></div>
  4238. </td>
  4239. </tr>
  4240. </tbody>
  4241. </table>
  4242. <table class="infobox vevent"
  4243. style="font-size: 12.32px; border: 1px solid rgb(162, 169, 177); border-spacing: 3px; background-color: rgb(248, 249, 250); color: black; margin: 0.5em 0px 0.5em 1em; padding: 0.2em; float: right; clear: right; line-height: 1.5em; width: 22em;">
  4244. <caption class="summary"
  4245. style="font-size: 15.4px; font-weight: bold; padding: 0.2em; text-align: center;">CKEditor
  4246. </caption>
  4247. <tbody>
  4248. <tr>
  4249. <td colspan="2" style="vertical-align: top; text-align: center;"><a class="image"
  4250. href="https://en.wikipedia.org/wiki/File:CKEditor_4_and_CKEditor_5_logos.png"
  4251. style="text-decoration: none; color: rgb(11, 0, 128); background: none;"
  4252. title="CKEditor 4 &amp; CKEditor 5 logos"><img
  4253. alt="CKEditor 4 &amp; CKEditor 5 logos" data-file-height="190"
  4254. data-file-width="526" decoding="async" height="64"
  4255. src="https://upload.wikimedia.org/wikipedia/en/thumb/a/ab/CKEditor_4_and_CKEditor_5_logos.png/178px-CKEditor_4_and_CKEditor_5_logos.png"
  4256. srcset="//upload.wikimedia.org/wikipedia/en/thumb/a/ab/CKEditor_4_and_CKEditor_5_logos.png/266px-CKEditor_4_and_CKEditor_5_logos.png 1.5x, //upload.wikimedia.org/wikipedia/en/thumb/a/ab/CKEditor_4_and_CKEditor_5_logos.png/355px-CKEditor_4_and_CKEditor_5_logos.png 2x"
  4257. style="border: 0px; vertical-align: middle;" width="178" /></a>
  4258. <div>CKEditor 4 &amp; CKEditor 5 logos</div>
  4259. </td>
  4260. </tr>
  4261. <tr>
  4262. <td colspan="2" style="vertical-align: top; text-align: center;"><a class="image"
  4263. href="https://en.wikipedia.org/wiki/File:CKEditor_4_Article_Editor_screenshot.png"
  4264. style="text-decoration: none; color: rgb(11, 0, 128); background: none;"
  4265. title="CKEditor 4 article editor screenshot"><img
  4266. alt="CKEditor 4 article editor screenshot" data-file-height="604"
  4267. data-file-width="1017" decoding="async" height="178"
  4268. src="https://upload.wikimedia.org/wikipedia/en/thumb/6/66/CKEditor_4_Article_Editor_screenshot.png/300px-CKEditor_4_Article_Editor_screenshot.png"
  4269. srcset="//upload.wikimedia.org/wikipedia/en/thumb/6/66/CKEditor_4_Article_Editor_screenshot.png/450px-CKEditor_4_Article_Editor_screenshot.png 1.5x, //upload.wikimedia.org/wikipedia/en/thumb/6/66/CKEditor_4_Article_Editor_screenshot.png/600px-CKEditor_4_Article_Editor_screenshot.png 2x"
  4270. style="border: 0px; vertical-align: middle;" width="300" /></a>
  4271. <div>CKEditor 4 article editor screenshot</div>
  4272. </td>
  4273. </tr>
  4274. <tr>
  4275. <th scope="row" style="vertical-align: top; text-align: left; white-space: nowrap;"><a
  4276. class="mw-redirect" href="https://en.wikipedia.org/wiki/Software_developer"
  4277. style="text-decoration: none; color: rgb(11, 0, 128); background: none;"
  4278. title="Software developer">Original author(s)</a></th>
  4279. <td style="vertical-align: top; text-align: left;">Frederico Caldeira Knabben</td>
  4280. </tr>
  4281. <tr>
  4282. <th scope="row" style="vertical-align: top; text-align: left; white-space: nowrap;"><a
  4283. class="mw-redirect" href="https://en.wikipedia.org/wiki/Software_developer"
  4284. style="text-decoration: none; color: rgb(11, 0, 128); background: none;"
  4285. title="Software developer">Developer(s)</a></th>
  4286. <td style="vertical-align: top; text-align: left;">CKSource</td>
  4287. </tr>
  4288. <tr>
  4289. <th colspan="2" style="vertical-align: top; text-align: center;"><a
  4290. href="https://en.wikipedia.org/wiki/Software_release_life_cycle"
  4291. style="text-decoration: none; color: rgb(11, 0, 128); background: none;"
  4292. title="Software release life cycle">Stable release(s)</a></th>
  4293. </tr>
  4294. <tr>
  4295. <td colspan="2" style="vertical-align: top; text-align: center;">
  4296. <div style="margin: 0px;">
  4297. <table
  4298. style="font-size: 12.32px; padding: 0px; border: none; margin: -3px; width: auto; min-width: 100%; clear: none; float: none; background-color: transparent;">
  4299. <tbody>
  4300. <tr>
  4301. <th scope="row" style="vertical-align: top; text-align: left;">CKEditor
  4302. 4</th>
  4303. <td style="vertical-align: top; text-align: left;">4.13.0 /
  4304. September&nbsp;26, 2019<span class="noprint">; 3 months ago</span>
  4305. </td>
  4306. </tr>
  4307. <tr>
  4308. <th scope="row" style="vertical-align: top; text-align: left;">CKEditor
  4309. 5</th>
  4310. <td style="vertical-align: top; text-align: left;">15.0.0 /
  4311. October&nbsp;23, 2019<span class="noprint">; 2 months ago</span>
  4312. </td>
  4313. </tr>
  4314. </tbody>
  4315. </table>
  4316. </div>
  4317. </td>
  4318. </tr>
  4319. <tr>
  4320. <th scope="row" style="vertical-align: top; text-align: left; white-space: nowrap;"><a
  4321. href="https://en.wikipedia.org/wiki/Repository_(version_control)"
  4322. style="text-decoration: none; color: rgb(11, 0, 128); background: none;"
  4323. title="Repository (version control)">Repository</a></th>
  4324. <td style="vertical-align: top; text-align: left;"><a class="external text"
  4325. href="https://github.com/ckeditor/ckeditor4" rel="nofollow"
  4326. style="text-decoration: none; color: rgb(102, 51, 102); background: linear-gradient(transparent, transparent) right center no-repeat, url(&quot;/w/skins/Vector/images/external-link-ltr-icon.svg?b4b84&quot;); padding-right: 13px;">CKEditor
  4327. 4 GitHub repo<span>&nbsp;</span></a><a class="external text"
  4328. href="https://github.com/ckeditor/ckeditor5" rel="nofollow"
  4329. style="text-decoration: none; color: rgb(102, 51, 102); background: linear-gradient(transparent, transparent) right center no-repeat, url(&quot;/w/skins/Vector/images/external-link-ltr-icon.svg?b4b84&quot;); padding-right: 13px;">CKEditor
  4330. 5 GitHub repo</a></td>
  4331. </tr>
  4332. <tr>
  4333. <th scope="row" style="vertical-align: top; text-align: left; white-space: nowrap;">Written
  4334. in</th>
  4335. <td style="vertical-align: top; text-align: left;"><a
  4336. href="https://en.wikipedia.org/wiki/JavaScript"
  4337. style="text-decoration: none; color: rgb(11, 0, 128); background: none;"
  4338. title="JavaScript">JavaScript</a></td>
  4339. </tr>
  4340. <tr>
  4341. <th scope="row" style="vertical-align: top; text-align: left; white-space: nowrap;"><a
  4342. href="https://en.wikipedia.org/wiki/Software_categories#Categorization_approaches"
  4343. style="text-decoration: none; color: rgb(11, 0, 128); background: none;"
  4344. title="Software categories">Type</a></th>
  4345. <td style="vertical-align: top; text-align: left;"><a
  4346. href="https://en.wikipedia.org/wiki/HTML_editor"
  4347. style="text-decoration: none; color: rgb(11, 0, 128); background: none;"
  4348. title="HTML editor">HTML editor</a>,<span>&nbsp;</span><a
  4349. href="https://en.wikipedia.org/wiki/Online_rich-text_editor"
  4350. style="text-decoration: none; color: rgb(11, 0, 128); background: none;"
  4351. title="Online rich-text editor">online rich-text editor</a></td>
  4352. </tr>
  4353. <tr>
  4354. <th scope="row" style="vertical-align: top; text-align: left; white-space: nowrap;"><a
  4355. href="https://en.wikipedia.org/wiki/Software_license"
  4356. style="text-decoration: none; color: rgb(11, 0, 128); background: none;"
  4357. title="Software license">License</a></th>
  4358. <td style="vertical-align: top; text-align: left;"><a
  4359. href="https://en.wikipedia.org/wiki/GNU_General_Public_License"
  4360. style="text-decoration: none; color: rgb(11, 0, 128); background: none;"
  4361. title="GNU General Public License">GPL</a>,<span>&nbsp;</span><a
  4362. href="https://en.wikipedia.org/wiki/GNU_Lesser_General_Public_License"
  4363. style="text-decoration: none; color: rgb(11, 0, 128); background: none;"
  4364. title="GNU Lesser General Public License">LGPL</a>,<span>&nbsp;</span><a
  4365. href="https://en.wikipedia.org/wiki/Mozilla_Public_License"
  4366. style="text-decoration: none; color: rgb(11, 0, 128); background: none;"
  4367. title="Mozilla Public License">MPL</a><span>&nbsp;</span>and<span>&nbsp;</span><a
  4368. href="https://en.wikipedia.org/wiki/Commercial_software"
  4369. style="text-decoration: none; color: rgb(11, 0, 128); background: none;"
  4370. title="Commercial software">commercial</a><sup class="reference" id="cite_ref-1"
  4371. style="line-height: 1; unicode-bidi: isolate; white-space: nowrap; font-weight: normal; font-style: normal; font-size: 9.856px;"><a
  4372. href="https://en.wikipedia.org/wiki/CKEditor#cite_note-1"
  4373. style="text-decoration: none; color: rgb(11, 0, 128); background: none;">[1]</a></sup>
  4374. </td>
  4375. </tr>
  4376. <tr>
  4377. <th scope="row" style="vertical-align: top; text-align: left; white-space: nowrap;">Website
  4378. </th>
  4379. <td style="vertical-align: top; text-align: left;"><span class="url"><a
  4380. class="external text" href="http://ckeditor.com/" rel="nofollow"
  4381. style="text-decoration: none; color: rgb(102, 51, 102); background: linear-gradient(transparent, transparent) right center no-repeat, url(&quot;/w/skins/Vector/images/external-link-ltr-icon.svg?b4b84&quot;); padding-right: 13px;">ckeditor<wbr
  4382. style="display: inline-block;" />.com</a></span></td>
  4383. </tr>
  4384. </tbody>
  4385. </table>
  4386. <p style="margin: 0.5em 0px;"><b>CKEditor</b><span>&nbsp;</span>(<span
  4387. style="font-family:Trebuchet MS,Helvetica,sans-serif;"><span style="font-size:22px; color:#27ae60; background-color:#dddddd;">formerly known
  4388. as&nbsp;<b><span
  4389. style="background-color:#dddddd;">FCKeditor</span></b><></span>) is
  4390. a<span>&nbsp;</span><a href="https://en.wikipedia.org/wiki/WYSIWYG"
  4391. style="text-decoration: none; color: rgb(11, 0, 128); background: none;"
  4392. title="WYSIWYG">WYSIWYG</a><span>&nbsp;</span><a
  4393. href="https://en.wikipedia.org/wiki/Online_rich-text_editor"
  4394. style="text-decoration: none; color: rgb(11, 0, 128); background: none;"
  4395. title="Online rich-text editor">rich text editor</a><span>&nbsp;</span>which enables writing
  4396. content directly inside of web pages or online <em><span style="font-size:8px; color:#8e44ad;">applications.<sup class="reference" id="cite_ref-2"
  4397. style="line-height: 1; unicode-bidi: isolate; white-space: nowrap; font-weight: normal; font-style: normal; font-size: 11.2px;"><a
  4398. href="https://en.wikipedia.org/wiki/CKEditor#cite_note-2"
  4399. style="text-decoration: none; color: rgb(11, 0, 128); background: none;"><span
  4400. style="color:#8e44ad;">[2]</span></a></sup><sup class="reference"
  4401. id="cite_ref-3"
  4402. style="line-height: 1; unicode-bidi: isolate; white-space: nowrap; font-weight: normal; font-style: normal; font-size: 11.2px;"><a
  4403. href="https://en.wikipedia.org/wiki/CKEditor#cite_note-3"
  4404. style="text-decoration: none; color: rgb(11, 0, 128); background: none;"><span
  4405. style="color:#8e44ad;">[3]</span></a></sup><sup class="reference"
  4406. id="cite_ref-4"
  4407. style="line-height: 1; unicode-bidi: isolate; white-space: nowrap; font-weight: normal; font-style: normal; font-size: 11.2px;"><a
  4408. href="https://en.wikipedia.org/wiki/CKEditor#cite_note-4"
  4409. style="text-decoration: none; color: rgb(11, 0, 128); background: none;"><span
  4410. style="color:#8e44ad;">[4]</span></a></sup><sup class="reference"
  4411. id="cite_ref-5"
  4412. style="line-height: 1; unicode-bidi: isolate; white-space: nowrap; font-weight: normal; font-style: normal; font-size: 11.2px;"><a
  4413. href="https://en.wikipedia.org/wiki/CKEditor#cite_note-5"
  4414. style="text-decoration: none; color: rgb(11, 0, 128); background: none;"><span
  4415. style="color:#8e44ad;">[5]</span></a></sup><span
  4416. style="color:#8e44ad;">&nbsp;Its core code is written in&nbsp;</span><a
  4417. href="https://en.wikipedia.org/wiki/JavaScript"
  4418. style="text-decoration: none; color: rgb(11, 0, 128); background: none;"
  4419. title="JavaScript"><span style="color:#8e44ad;">JavaScript</span></a><span
  4420. style="color:#8e44ad;">&nbsp;and it</span></span></em> is developed by CKSource.
  4421. CKEditor is available under open source and commercial licenses.</p>
  4422. <div class="toc" id="toc"
  4423. style="border: 1px solid rgb(162, 169, 177); background-color: rgb(248, 249, 250); padding: 7px; font-size: 13.3px; display: table;">
  4424. <input class="toctogglecheckbox" id="toctogglecheckbox" role="button"
  4425. style="direction: ltr; position: absolute; opacity: 0; z-index: -1; display: none;"
  4426. type="checkbox" />
  4427. <div class="toctitle" dir="ltr" lang="en" style="direction: ltr; text-align: center;">
  4428. <h2
  4429. style="color: rgb(0, 0, 0); background: none; font-weight: bold; margin: 1em 0px 0.25em; overflow: hidden; padding: 0px; border: 0px; font-size: 13.3px; display: inline; font-family: sans-serif; line-height: 1.3;">
  4430. Contents</h2>
  4431. </div>
  4432. <ul
  4433. style="margin: 0.3em 0px; padding: 0px; list-style-image: none; list-style-type: none; text-align: left;">
  4434. <li class="toclevel-1 tocsection-1" style="margin-bottom: 0.1em;"><a
  4435. href="https://en.wikipedia.org/wiki/CKEditor#History"
  4436. style="text-decoration: none; color: rgb(11, 0, 128); background: none;"><span
  4437. class="tocnumber"
  4438. style="display: table-cell; text-decoration: inherit; padding-left: 0px; padding-right: 0.5em; color: rgb(34, 34, 34);">1</span><span
  4439. class="toctext"
  4440. style="display: table-cell; text-decoration: inherit;">History</span></a>
  4441. <ul
  4442. style="margin: 0px 0px 0px 2em; padding: 0px; list-style-image: none; list-style-type: none; text-align: left;">
  4443. <li class="toclevel-2 tocsection-2" style="margin-bottom: 0.1em;"><a
  4444. href="https://en.wikipedia.org/wiki/CKEditor#FCKeditor_and_CKEditor_3"
  4445. style="text-decoration: none; color: rgb(11, 0, 128); background: none;"><span
  4446. class="tocnumber"
  4447. style="display: table-cell; text-decoration: inherit; padding-left: 0px; padding-right: 0.5em;"><span
  4448. style="color:#27ae60;">1.1</span></span><span
  4449. style="color:#27ae60;"><span class="toctext"
  4450. style="display: table-cell; text-decoration: inherit;">FCKeditor and
  4451. CKEditor 3</span></span></a></li>
  4452. <li class="toclevel-2 tocsection-3" style="margin-bottom: 0.1em;"><a
  4453. href="https://en.wikipedia.org/wiki/CKEditor#CKEditor_4"
  4454. style="text-decoration: none; color: rgb(11, 0, 128); background: none;"><span
  4455. style="color:#27ae60;"><span class="tocnumber"
  4456. style="display: table-cell; text-decoration: inherit; padding-left: 0px; padding-right: 0.5em;">1.2</span><span
  4457. class="toctext"
  4458. style="display: table-cell; text-decoration: inherit;">CKEditor
  4459. 4</span></span></a></li>
  4460. <li class="toclevel-2 tocsection-4" style="margin-bottom: 0.1em;"><a
  4461. href="https://en.wikipedia.org/wiki/CKEditor#CKEditor_5"
  4462. style="text-decoration: none; color: rgb(11, 0, 128); background: none;"><span
  4463. style="color:#27ae60;"><span class="tocnumber"
  4464. style="display: table-cell; text-decoration: inherit; padding-left: 0px; padding-right: 0.5em;">1.3</span><span
  4465. class="toctext"
  4466. style="display: table-cell; text-decoration: inherit;">CKEditor
  4467. 5</span></span></a></li>
  4468. <li class="toclevel-2 tocsection-5" style="margin-bottom: 0.1em;"><a
  4469. href="https://en.wikipedia.org/wiki/CKEditor#CKEditor_Ecosystem"
  4470. style="text-decoration: none; color: rgb(11, 0, 128); background: none;"><span
  4471. style="color:#27ae60;"><span class="tocnumber"
  4472. style="display: table-cell; text-decoration: inherit; padding-left: 0px; padding-right: 0.5em;">1.4</span><span
  4473. class="toctext"
  4474. style="display: table-cell; text-decoration: inherit;">CKEditor
  4475. Ecosystem</span></span></a></li>
  4476. </ul>
  4477. </li>
  4478. <li class="toclevel-1 tocsection-6" style="margin-bottom: 0.1em;"><a
  4479. href="https://en.wikipedia.org/wiki/CKEditor#Features"
  4480. style="text-decoration: none; color: rgb(11, 0, 128); background: none;"><span
  4481. class="tocnumber"
  4482. style="display: table-cell; text-decoration: inherit; padding-left: 0px; padding-right: 0.5em; color: rgb(34, 34, 34);">2</span><span
  4483. class="toctext"
  4484. style="display: table-cell; text-decoration: inherit;">Features</span></a>
  4485. <ul
  4486. style="margin: 0px 0px 0px 2em; padding: 0px; list-style-image: none; list-style-type: none; text-align: left;">
  4487. <li class="toclevel-2 tocsection-7" style="margin-bottom: 0.1em;"><a
  4488. href="https://en.wikipedia.org/wiki/CKEditor#Real-time_collaborative_editing"
  4489. style="text-decoration: none; color: rgb(11, 0, 128); background: none;"><span
  4490. class="tocnumber"
  4491. style="display: table-cell; text-decoration: inherit; padding-left: 0px; padding-right: 0.5em; color: rgb(34, 34, 34);">2.1</span><span
  4492. class="toctext"
  4493. style="display: table-cell; text-decoration: inherit;">Real-time
  4494. collaborative editing</span></a></li>
  4495. </ul>
  4496. </li>
  4497. <li class="toclevel-1 tocsection-8" style="margin-bottom: 0.1em;"><a
  4498. href="https://en.wikipedia.org/wiki/CKEditor#Browser_compatibility"
  4499. style="text-decoration: none; color: rgb(11, 0, 128); background: none;"><span
  4500. class="tocnumber"
  4501. style="display: table-cell; text-decoration: inherit; padding-left: 0px; padding-right: 0.5em; color: rgb(34, 34, 34);">3</span><span
  4502. class="toctext" style="display: table-cell; text-decoration: inherit;">Browser
  4503. compatibility</span></a></li>
  4504. <li class="toclevel-1 tocsection-9" style="margin-bottom: 0.1em;"><a
  4505. href="https://en.wikipedia.org/wiki/CKEditor#References"
  4506. style="text-decoration: none; color: rgb(11, 0, 128); background: none;"><span
  4507. class="tocnumber"
  4508. style="display: table-cell; text-decoration: inherit; padding-left: 0px; padding-right: 0.5em; color: rgb(34, 34, 34);">4</span><span
  4509. class="toctext"
  4510. style="display: table-cell; text-decoration: inherit;">References</span></a></li>
  4511. <li class="toclevel-1 tocsection-10" style="margin-bottom: 0.1em;"><a
  4512. href="https://en.wikipedia.org/wiki/CKEditor#External_links"
  4513. style="text-decoration: none; color: rgb(11, 0, 128); background: none;"><span
  4514. class="tocnumber"
  4515. style="display: table-cell; text-decoration: inherit; padding-left: 0px; padding-right: 0.5em; color: rgb(34, 34, 34);">5</span><span
  4516. class="toctext" style="display: table-cell; text-decoration: inherit;">External
  4517. links</span></a></li>
  4518. </ul>
  4519. </div>
  4520. <h2
  4521. style="color: rgb(0, 0, 0); background: none; font-weight: normal; margin: 1em 0px 0.25em; overflow: hidden; padding: 0px; border-bottom: 1px solid rgb(162, 169, 177); font-size: 1.5em; font-family: &quot;Linux Libertine&quot;, Georgia, Times, serif; line-height: 1.3;">
  4522. <span class="mw-headline" id="History">History</span><span class="mw-editsection"
  4523. style="user-select: none; font-size: small; font-weight: normal; margin-left: 1em; vertical-align: baseline; line-height: 1em; font-family: sans-serif; white-space: nowrap; unicode-bidi: isolate;"><span
  4524. class="mw-editsection-bracket"
  4525. style="margin-right: 0.25em; color: rgb(84, 89, 93);">[</span><a
  4526. href="https://en.wikipedia.org/w/index.php?title=CKEditor&amp;action=edit&amp;section=1"
  4527. style="text-decoration: none; color: rgb(11, 0, 128); background: none;"
  4528. title="Edit section: History">edit</a><span class="mw-editsection-bracket"
  4529. style="margin-left: 0.25em; color: rgb(84, 89, 93);">]</span></span></h2>
  4530. <h3
  4531. style="color: rgb(0, 0, 0); background: none; font-weight: bold; margin: 0.3em 0px 0px; overflow: hidden; padding-top: 0.5em; padding-bottom: 0px; border-bottom: 0px; font-size: 1.2em; line-height: 1.6;">
  4532. <span class="mw-headline" id="FCKeditor_and_CKEditor_3">FCKeditor and CKEditor 3</span><span
  4533. class="mw-editsection"
  4534. style="user-select: none; font-size: small; font-weight: normal; margin-left: 1em; vertical-align: baseline; line-height: 1em; font-family: sans-serif; white-space: nowrap; unicode-bidi: isolate;"><span
  4535. class="mw-editsection-bracket"
  4536. style="margin-right: 0.25em; color: rgb(84, 89, 93);">[</span><a
  4537. href="https://en.wikipedia.org/w/index.php?title=CKEditor&amp;action=edit&amp;section=2"
  4538. style="text-decoration: none; color: rgb(11, 0, 128); background: none;"
  4539. title="Edit section: FCKeditor and CKEditor 3">edit</a><span class="mw-editsection-bracket"
  4540. style="margin-left: 0.25em; color: rgb(84, 89, 93);">]</span></span></h3>
  4541. <p style="margin: 0.5em 0px;">The first version of CKEditor, under the name FCKeditor, was released in
  4542. March 2003 by Frederico Caldeira Knabben, the creator of the editor and the
  4543. project&#39;s<span>&nbsp;</span><a class="mw-redirect"
  4544. href="https://en.wikipedia.org/wiki/Benevolent_Dictator_for_Life"
  4545. style="text-decoration: none; color: rgb(11, 0, 128); background: none;"
  4546. title="Benevolent Dictator for Life">Benevolent Dictator for Life</a>. After reaching more than
  4547. 3 million downloads, FCKeditor was completely reviewed and redesigned into CKEditor 3, with special
  4548. attention given to performance, accessibility and a new UI.<sup
  4549. class="noprint Inline-Template Template-Fact"
  4550. style="line-height: 1; font-size: 11.2px; white-space: nowrap;">[<i><a
  4551. href="https://en.wikipedia.org/wiki/Wikipedia:Citation_needed"
  4552. style="text-decoration: none; color: rgb(11, 0, 128); background: none;"
  4553. title="Wikipedia:Citation needed"><span
  4554. title="This claim needs references to reliable sources. (July 2018)">citation
  4555. needed</span></a></i>]</sup></p>
  4556. <h3
  4557. style="color: rgb(0, 0, 0); background: none; font-weight: bold; margin: 0.3em 0px 0px; overflow: hidden; padding-top: 0.5em; padding-bottom: 0px; border-bottom: 0px; font-size: 1.2em; line-height: 1.6;">
  4558. <span class="mw-headline" id="CKEditor_4">CKEditor 4</span><span class="mw-editsection"
  4559. style="user-select: none; font-size: small; font-weight: normal; margin-left: 1em; vertical-align: baseline; line-height: 1em; font-family: sans-serif; white-space: nowrap; unicode-bidi: isolate;"><span
  4560. class="mw-editsection-bracket"
  4561. style="margin-right: 0.25em; color: rgb(84, 89, 93);">[</span><a
  4562. href="https://en.wikipedia.org/w/index.php?title=CKEditor&amp;action=edit&amp;section=3"
  4563. style="text-decoration: none; color: rgb(11, 0, 128); background: none;"
  4564. title="Edit section: CKEditor 4">edit</a><span class="mw-editsection-bracket"
  4565. style="margin-left: 0.25em; color: rgb(84, 89, 93);">]</span></span></h3>
  4566. <p style="margin: 0.5em 0px;">In December 2<span
  4567. style="font-family:Courier New,Courier,monospace;"><span style="background-color:#2ecc71;">012,
  4568. CKEditor 4 was released with an Inline Editing solution, reformatted source code, enhanced
  4569. DOM and&nbsp;</span><a href="https://en.wikipedia.org/wiki/Cascading_Style_Sheets"
  4570. style="text-decoration: none; color: rgb(11, 0, 128); background: none;"
  4571. title="Cascading Style Sheets"><span style="background-color:#2ecc71;">CSS</span></a><span
  4572. style="background-color:#2ecc71;">&nbsp;performance. The server-side
  4573. implementations</span></span> were removed.</p>
  4574. <h3
  4575. style="color: rgb(0, 0, 0); background: none; font-weight: bold; margin: 0.3em 0px 0px; overflow: hidden; padding-top: 0.5em; padding-bottom: 0px; border-bottom: 0px; font-size: 1.2em; line-height: 1.6;">
  4576. <span class="mw-headline" id="CKEditor_5">CKEditor 5</span><span class="mw-editsection"
  4577. style="user-select: none; font-size: small; font-weight: normal; margin-left: 1em; vertical-align: baseline; line-height: 1em; font-family: sans-serif; white-space: nowrap; unicode-bidi: isolate;"><span
  4578. class="mw-editsection-bracket"
  4579. style="margin-right: 0.25em; color: rgb(84, 89, 93);">[</span><a
  4580. href="https://en.wikipedia.org/w/index.php?title=CKEditor&amp;action=edit&amp;section=4"
  4581. style="text-decoration: none; color: rgb(11, 0, 128); background: none;"
  4582. title="Edit section: CKEditor 5">edit</a><span class="mw-editsection-bracket"
  4583. style="margin-left: 0.25em; color: rgb(84, 89, 93);">]</span></span></h3>
  4584. <p style="margin: 0.5em 0px;">After five years, in 2018, CKEditor 5 first stable version was introduced.
  4585. With its code rewritten from scratch, CKEditor 5 has a custo<em><u><s>m data model and architecture.
  4586. The editor implements<span>&nbsp;</span><a
  4587. href="https://en.wikipedia.org/wiki/Operational_transformation"
  4588. style="text-decoration: none; color: rgb(11, 0, 128); background: none;"
  4589. title="Operational transformation">Operational
  4590. Transformation</a><span>&nbsp;</span>for the tree-structured model as
  4591. </s></u></em>well as many other mechanisms which were required to create a real-time
  4592. collaborative UX.<sup class="reference" id="cite_ref-6"
  4593. style="line-height: 1; unicode-bidi: isolate; white-space: nowrap; font-weight: normal; font-style: normal; font-size: 11.2px;"><a
  4594. href="https://en.wikipedia.org/wiki/CKEditor#cite_note-6"
  4595. style="text-decoration: none; color: rgb(11, 0, 128); background: none;">[6]</a></sup></p>
  4596. <p style="margin: 0.5em 0px;">CKEditor 5 is a JavaScript framework offering a rich API<sup
  4597. class="noprint Inline-Template"
  4598. style="line-height: 1; font-size: 11.2px; margin-left: 0.1em; white-space: nowrap;">[<i><a
  4599. href="https://en.wikipedia.org/wiki/Wikipedia:Please_clarify"
  4600. style="text-decoration: none; color: rgb(11, 0, 128); background: none;"
  4601. title="Wikipedia:Please clarify"><span
  4602. title="The text near this tag may need clarification or removal of jargon. (July 2018)">clarification
  4603. needed</span></a></i>]</sup><span>&nbsp;</span>to develop any
  4604. editing<span>&nbsp;</span><a href="https://en.wikipedia.org/wiki/Solution"
  4605. style="text-decoration: none; color: rgb(11, 0, 128); background: none;"
  4606. title="Solution">solution</a>. CKEditor 5 also offers builds, which are ready-to-use editors;
  4607. there are currently 5 builds available to download: Classic, Inline, Balloon, Balloon block and
  4608. Document<sup class="reference" id="cite_ref-7"
  4609. style="line-height: 1; unicode-bidi: isolate; white-space: nowrap; font-weight: normal; font-style: normal; font-size: 11.2px;"><a
  4610. href="https://en.wikipedia.org/wiki/CKEditor#cite_note-7"
  4611. style="text-decoration: none; color: rgb(11, 0, 128); background: none;">[7]</a></sup>.</p>
  4612. <h3
  4613. style="color: rgb(0, 0, 0); background: none; font-weight: bold; margin: 0.3em 0px 0px; overflow: hidden; padding-top: 0.5em; padding-bottom: 0px; border-bottom: 0px; font-size: 1.2em; line-height: 1.6;">
  4614. <span class="mw-headline" id="CKEditor_Ecosystem">CKEditor Ecosystem</span><span
  4615. class="mw-editsection"
  4616. style="user-select: none; font-size: small; font-weight: normal; margin-left: 1em; vertical-align: baseline; line-height: 1em; font-family: sans-serif; white-space: nowrap; unicode-bidi: isolate;"><span
  4617. class="mw-editsection-bracket"
  4618. style="margin-right: 0.25em; color: rgb(84, 89, 93);">[</span><a
  4619. href="https://en.wikipedia.org/w/index.php?title=CKEditor&amp;action=edit&amp;section=5"
  4620. style="text-decoration: none; color: rgb(11, 0, 128); background: none;"
  4621. title="Edit section: CKEditor Ecosystem">edit</a><span class="mw-editsection-bracket"
  4622. style="margin-left: 0.25em; color: rgb(84, 89, 93);">]</span></span></h3>
  4623. <p style="margin: 0.5em 0px;">In October 2017, CKSource launched the CKEditor Ecosystem, which consists
  4624. of different products, these include:</p>
  4625. <ul
  4626. style="margin: 0.3em 0px 0px 1.6em; padding: 0px; list-style-image: url(&quot;/w/skins/Vector/images/bullet-icon.svg?872f1&quot;);">
  4627. <li style="margin-bottom: 0.1em;"><b>CKEditor 5
  4628. Builds</b><span>&nbsp;</span>and<span>&nbsp;</span><b>CKEditor 5 Framework</b>.</li>
  4629. <li style="margin-bottom: 0.1em;"><b>CKEditor Cloud Services</b>, which support collaboration and
  4630. uploading images.</li>
  4631. <li style="margin-bottom: 0.1em;"><b>Letters</b>, a software component which makes real-time
  4632. collaborative editing possible inside any application.<sup
  4633. class="noprint Inline-Template Template-Fact"
  4634. style="line-height: 1; font-size: 11.2px; white-space: nowrap;">[<i><a
  4635. href="https://en.wikipedia.org/wiki/Wikipedia:Citation_needed"
  4636. style="text-decoration: none; color: rgb(11, 0, 128); background: none;"
  4637. title="Wikipedia:Citation needed"><span
  4638. title="This claim needs references to reliable sources. (July 2018)">citation
  4639. needed</span></a></i>]</sup></li>
  4640. </ul>
  4641. <h2
  4642. style="color: rgb(0, 0, 0); background: none; font-weight: normal; margin: 1em 0px 0.25em; overflow: hidden; padding: 0px; border-bottom: 1px solid rgb(162, 169, 177); font-size: 1.5em; font-family: &quot;Linux Libertine&quot;, Georgia, Times, serif; line-height: 1.3;">
  4643. <span class="mw-headline" id="Features">Features</span><span class="mw-editsection"
  4644. style="user-select: none; font-size: small; font-weight: normal; margin-left: 1em; vertical-align: baseline; line-height: 1em; font-family: sans-serif; white-space: nowrap; unicode-bidi: isolate;"><span
  4645. class="mw-editsection-bracket"
  4646. style="margin-right: 0.25em; color: rgb(84, 89, 93);">[</span><a
  4647. href="https://en.wikipedia.org/w/index.php?title=CKEditor&amp;action=edit&amp;section=6"
  4648. style="text-decoration: none; color: rgb(11, 0, 128); background: none;"
  4649. title="Edit section: Features">edit</a><span class="mw-editsection-bracket"
  4650. style="margin-left: 0.25em; color: rgb(84, 89, 93);">]</span></span></h2>
  4651. <p style="margin: 0.5em 0px;">CKEditor 4 has features found in<span>&nbsp;</span><a
  4652. href="https://en.wikipedia.org/wiki/Desktop_computer"
  4653. style="text-decoration: none; color: rgb(11, 0, 128); background: none;"
  4654. title="Desktop computer">desktop</a><span>&nbsp;</span>word processors such as styles formatting
  4655. (bold, italic, underline, bulleted and numbered lists), tables, block quoting, web resource linking,
  4656. safe undo function, image inserting, paste from<span>&nbsp;</span><a class="mw-redirect"
  4657. href="https://en.wikipedia.org/wiki/MS_Word"
  4658. style="text-decoration: none; color: rgb(11, 0, 128); background: none;"
  4659. title="MS Word">Word</a><span>&nbsp;</span>and other common HTML formatting tools. Also CKEditor
  4660. 4 has built-in<span>&nbsp;</span><a href="https://en.wikipedia.org/wiki/Spell_checker"
  4661. style="text-decoration: none; color: rgb(11, 0, 128); background: none;"
  4662. title="Spell checker">spell checker</a><span>&nbsp;</span>functionality provided
  4663. as<span>&nbsp;</span><a href="https://en.wikipedia.org/wiki/Plug-in_(computing)"
  4664. style="text-decoration: none; color: rgb(11, 0, 128); background: none;"
  4665. title="Plug-in (computing)">plug-ins</a><span>&nbsp;</span>by<span>&nbsp;</span><a
  4666. href="https://en.wikipedia.org/wiki/WebSpellChecker_Software"
  4667. style="text-decoration: none; color: rgb(11, 0, 128); background: none;"
  4668. title="WebSpellChecker Software">WebSpellChecker LLC</a>. By default, it is available for free
  4669. with a banner ad.<a href="https://en.wikipedia.org/wiki/CKEditor#cite_note-6"
  4670. style="text-decoration: none; color: rgb(11, 0, 128); background: none;"
  4671. title="CKEditor">[6]</a><span>&nbsp;</span>It checks the spelling of the text and marks all
  4672. errors with a red wavy line and allows the user to choose one of the correct suggestions.</p>
  4673. <p style="margin: 0.5em 0px;">There are currently many plugins available with CKEditor 4 to serve
  4674. different needs,
  4675. e.g.<span>&nbsp;</span><b>CKFinder</b><span>&nbsp;</span>and<span>&nbsp;</span><b>Accessibility
  4676. Checker</b><span>&nbsp;</span>(the CKSource&#39;s plugins). CKFinder is a file manager for
  4677. including files and images within content created with the editors. It is compatible with both
  4678. CKEditor 4 and 5 and is available under commercial license.</p>
  4679. <p style="margin: 0.5em 0px;">Accessibility Checker is available under both Open Source and commercial
  4680. licenses.</p>
  4681. <h3
  4682. style="color: rgb(0, 0, 0); background: none; font-weight: bold; margin: 0.3em 0px 0px; overflow: hidden; padding-top: 0.5em; padding-bottom: 0px; border-bottom: 0px; font-size: 1.2em; line-height: 1.6;">
  4683. <span class="mw-headline" id="Real-time_collaborative_editing">Real-time collaborative
  4684. editing</span><span class="mw-editsection"
  4685. style="user-select: none; font-size: small; font-weight: normal; margin-left: 1em; vertical-align: baseline; line-height: 1em; font-family: sans-serif; white-space: nowrap; unicode-bidi: isolate;"><span
  4686. class="mw-editsection-bracket"
  4687. style="margin-right: 0.25em; color: rgb(84, 89, 93);">[</span><a
  4688. href="https://en.wikipedia.org/w/index.php?title=CKEditor&amp;action=edit&amp;section=7"
  4689. style="text-decoration: none; color: rgb(11, 0, 128); background: none;"
  4690. title="Edit section: Real-time collaborative editing">edit</a><span
  4691. class="mw-editsection-bracket"
  4692. style="margin-left: 0.25em; color: rgb(84, 89, 93);">]</span></span></h3>
  4693. <p style="margin: 0.5em 0px;">CKEditor 5&#39;s architecture and custom data model makes it possible to
  4694. enable<span>&nbsp;</span><a class="mw-redirect"
  4695. href="https://en.wikipedia.org/wiki/Real-time_collaborative_editing"
  4696. style="text-decoration: none; color: rgb(11, 0, 128); background: none;"
  4697. title="Real-time collaborative editing">real-time collaborative editing</a>.</p>
  4698. <p style="margin: 0.5em 0px;">A custom collaborative<span>&nbsp;</span><a
  4699. href="https://en.wikipedia.org/wiki/Solution"
  4700. style="text-decoration: none; color: rgb(11, 0, 128); background: none;"
  4701. title="Solution">solution</a><span>&nbsp;</span>can be built by using the CKEditor 5 Framework
  4702. components and real-time collaborative editing can be enabled by connecting to the CKEditor Cloud
  4703. Services.</p>
  4704. <p style="margin: 0.5em 0px;">A ready to use, drop-in component based on CKEditor 5 (Letters) offers a
  4705. complete solution for real-time collaborative writing.<sup class="reference" id="cite_ref-8"
  4706. style="line-height: 1; unicode-bidi: isolate; white-space: nowrap; font-weight: normal; font-style: normal; font-size: 11.2px;"><a
  4707. href="https://en.wikipedia.org/wiki/CKEditor#cite_note-8"
  4708. style="text-decoration: none; color: rgb(11, 0, 128); background: none;">[8]</a></sup></p>
  4709. </div>
  4710. </div>
  4711. </div>
  4712. </div>