diff --git a/assets/stylesheets/pages/_mdn.scss b/assets/stylesheets/pages/_mdn.scss index d2b9b643..fb2cce38 100644 --- a/assets/stylesheets/pages/_mdn.scss +++ b/assets/stylesheets/pages/_mdn.scss @@ -30,6 +30,7 @@ .notice, .warning, .overheadIndicator, + .blockIndicator, .syntaxbox, // CSS, JavaScript .twopartsyntaxbox, // CSS .inheritsbox, // JavaScript @@ -104,4 +105,28 @@ .cleared { clear: both; } // CSS/box-shadow code > strong { font-weight: normal; } + + // Compatibility tablees + + .bc-github-link { + float: right; + font-size: .75rem; + } + + .bc-supports-yes, .bc-supports-yes + dd, .bc-supports-yes + dd + dd { background: var(--noteGreenBackground); } + .bc-supports-partial, .bc-supports-partial + dd, .bc-supports-partial + dd + dd { background: var(--noteOrangeBackground); } + .bc-supports-no, .bc-supports-no + dd, .bc-supports-no + dd + dd { background: var(--noteRedBackground); } + + .bc-table { + min-width: 100%; + + dl { + margin: .25rem 0 0; + padding: .25rem 0 0; + font-size: .75rem; + border-top: 1px solid var(--boxBorder); + } + + dd { margin: 0; } + } } diff --git a/lib/docs/filters/css/entries.rb b/lib/docs/filters/css/entries.rb index 41150417..0727a6b8 100644 --- a/lib/docs/filters/css/entries.rb +++ b/lib/docs/filters/css/entries.rb @@ -6,13 +6,16 @@ module Docs 'CSS_Background_and_Borders' => 'Backgrounds & Borders', 'CSS_Columns' => 'Multi-column Layout', 'CSS_Flexible_Box_Layout' => 'Flexible Box Layout', + 'CSS_Fonts' => 'Fonts', 'CSS_Grid_Layout' => 'Grid Layout', 'CSS_Images' => 'Images', 'CSS_Lists_and_Counters' => 'Lists', 'CSS_Transforms' => 'Transforms', 'Media_Queries' => 'Media Queries', + 'filter-function' => 'Filter Effects', 'transform-function' => 'Transforms', '@media' => 'Media Queries', + 'overscroll' => 'Overscroll', 'text-size-adjust' => 'Miscellaneous', 'resolved_value' => 'Miscellaneous', 'touch-action' => 'Miscellaneous', @@ -42,7 +45,7 @@ module Docs end def get_type - if slug.include?('-webkit') || slug.include?('-moz') + if slug.include?('-webkit') || slug.include?('-moz') || slug.include?('-ms') 'Extensions' elsif type = TYPE_BY_PATH[slug.split('/').first] type @@ -66,19 +69,22 @@ module Docs 'Pseudo-Elements' elsif name.start_with?(':') 'Selectors' + elsif name.start_with?('display-') + 'Display' else 'Miscellaneous' end end STATUSES = { - 'spec-Living' => 0, - 'spec-REC' => 1, - 'spec-CR' => 2, - 'spec-PR' => 3, - 'spec-LC' => 4, - 'spec-WD' => 5, - 'spec-ED' => 6 + 'spec-Living' => 0, + 'spec-REC' => 1, + 'spec-CR' => 2, + 'spec-PR' => 3, + 'spec-LC' => 4, + 'spec-WD' => 5, + 'spec-ED' => 6, + 'spec-Obsolete' => 7 } PRIORITY_STATUSES = %w(spec-REC spec-CR) @@ -86,6 +92,7 @@ module Docs def get_spec return unless table = at_css('#Specifications + table') || css('.standard-table').last + specs = table.css('tbody tr').to_a # [link, span] specs.map! { |node| [node.at_css('> td:nth-child(1) > a'), node.at_css('> td:nth-child(2) > span')] } @@ -110,8 +117,8 @@ module Docs 'shape' => [ %w(rect() Syntax) ], 'timing-function' => [ - %w(cubic-bezier() The_cubic-bezier()_class_of_timing-functions), - %w(steps() The_steps()_class_of_timing-functions), + %w(cubic-bezier()), + %w(steps()), %w(linear linear), %w(ease ease), %w(ease-in ease-in), diff --git a/lib/docs/filters/dom/clean_html.rb b/lib/docs/filters/dom/clean_html.rb index 12610c1f..d6704468 100644 --- a/lib/docs/filters/dom/clean_html.rb +++ b/lib/docs/filters/dom/clean_html.rb @@ -30,7 +30,7 @@ module Docs end # Remove
wrapping .overheadIndicator - css('div > .overheadIndicator:first-child:last-child').each do |node| + css('div > .overheadIndicator:first-child:last-child', 'div > .blockIndicator:first-child:last-child').each do |node| node.parent.replace(node) end diff --git a/lib/docs/filters/dom/entries.rb b/lib/docs/filters/dom/entries.rb index 6f7e2f61..f65871e1 100644 --- a/lib/docs/filters/dom/entries.rb +++ b/lib/docs/filters/dom/entries.rb @@ -6,6 +6,7 @@ module Docs 'EXT_' => 'WebGL', 'OES_' => 'WebGL', 'WEBGL_' => 'WebGL', + 'Sensor API' => 'Sensors', 'Ambient Light' => 'Ambient Light', 'Audio' => 'Audio', 'Battery Status' => 'Battery Status', @@ -22,10 +23,12 @@ module Docs 'Encrypted Media Extensions' => 'Encrypted Media', 'Fetch' => 'Fetch', 'File API' => 'File', + 'Fullscreen' => 'Fullscreen', 'Geolocation' => 'Geolocation', 'Geometry' => 'Geometry', 'High Resolution Time' => 'Performance', 'Intersection' => 'Intersection Observer', + 'Keyboard' => 'Keyboard', 'Media Capabilities' => 'Media', 'Media Capture' => 'Media', 'Media Session' => 'Media', @@ -35,6 +38,7 @@ module Docs 'MIDI' => 'Audio', 'Navigation Timing' => 'Performance', 'Network Information' => 'Network Information', + 'Orientation Sensor' => 'Sensors', 'Payment' => 'Payments', 'Performance Timeline' => 'Performance', 'Pointer Events' => 'Pointer Events', @@ -53,11 +57,13 @@ module Docs 'Web App Manifest' => 'Web App Manifest', 'Budget' => 'Budget', 'Web Authentication' => 'Authentication', + 'Web Locks' => 'Locks', 'Web Workers' => 'Web Workers', 'WebGL' => 'WebGL', 'WebRTC' => 'WebRTC', 'WebUSB' => 'WebUSB', - 'WebVR' => 'WebVR' } + 'WebVR' => 'WebVR', + 'WebVTT' => 'WebVTT' } TYPE_BY_NAME_STARTS_WITH = { 'AbortController' => 'Fetch', @@ -89,10 +95,12 @@ module Docs 'Fetch' => 'Fetch', 'File' => 'File', 'GlobalEventHandlers' => 'GlobalEventHandlers', + 'HMDVR' => 'WebVR', 'history' => 'History', 'HTML Drag' => 'Drag & Drop', 'HTML' => 'Elements', 'IDB' => 'IndexedDB', + 'Keyboard' => 'Keyboard', 'location' => 'Location', 'navigator' => 'Navigator', 'MediaKeySession' => 'Encrypted Media', @@ -122,6 +130,7 @@ module Docs 'StyleSheet' => 'CSS', 'Stylesheet' => 'CSS', 'SVG' => 'SVG', + 'TextTrack' => 'WebVTT', 'TimeRanges' => 'Media', 'timing' => 'Performance', 'Timing' => 'Performance', @@ -160,6 +169,7 @@ module Docs 'timing' => 'Performance', 'Timing' => 'Performance', 'udio' => 'Audio', + 'VRDevice' => 'WebVR', 'WebGL' => 'WebGL', 'WEBGL' => 'WebGL', 'WebRTC' => 'WebRTC', @@ -239,7 +249,7 @@ module Docs def include_default_entry? return true if type == 'Console' - return true unless node = doc.at_css('.overheadIndicator') + return true unless node = doc.at_css('.overheadIndicator, .blockIndicator') node = node.parent while node.parent != doc return true if node.previous_element.try(:name).in?(%w(h2 h3)) content = node.content diff --git a/lib/docs/filters/html/entries.rb b/lib/docs/filters/html/entries.rb index 11a0e03b..4fbb5303 100644 --- a/lib/docs/filters/html/entries.rb +++ b/lib/docs/filters/html/entries.rb @@ -28,7 +28,7 @@ module Docs def include_default_entry? return false if %w(Element/Heading_Elements).include?(slug) - (node = doc.at_css '.overheadIndicator').nil? || node.content.exclude?('not on a standards track') + (node = doc.at_css '.overheadIndicator, .blockIndicator').nil? || node.content.exclude?('not on a standards track') end def additional_entries diff --git a/lib/docs/filters/javascript/clean_html.rb b/lib/docs/filters/javascript/clean_html.rb index 5f7ebcb3..eeb23ba8 100644 --- a/lib/docs/filters/javascript/clean_html.rb +++ b/lib/docs/filters/javascript/clean_html.rb @@ -11,12 +11,12 @@ module Docs def other # Remove "style" attribute - css('.inheritsbox', '.overheadIndicator').each do |node| + css('.inheritsbox', '.overheadIndicator', '.blockIndicator').each do |node| node.remove_attribute 'style' end # Remove
wrapping .overheadIndicator - css('div > .overheadIndicator:first-child:last-child').each do |node| + css('div > .overheadIndicator:first-child:last-child', 'div > .blockIndicator:first-child:last-child').each do |node| node.parent.replace(node) end end diff --git a/lib/docs/filters/javascript/entries.rb b/lib/docs/filters/javascript/entries.rb index 40654087..06e4bbff 100644 --- a/lib/docs/filters/javascript/entries.rb +++ b/lib/docs/filters/javascript/entries.rb @@ -88,7 +88,7 @@ module Docs end def include_default_entry? - node = doc.at_css '.overheadIndicator, .warning' + node = doc.at_css '.blockIndicator, .warning' # Can't use :first-child because #doc is a DocumentFragment return true unless node && node.parent == doc && !node.previous_element diff --git a/lib/docs/filters/mdn/clean_html.rb b/lib/docs/filters/mdn/clean_html.rb index ee151462..540be3e1 100644 --- a/lib/docs/filters/mdn/clean_html.rb +++ b/lib/docs/filters/mdn/clean_html.rb @@ -14,6 +14,8 @@ module Docs '#Quick_Links', 'hr'] + BROWSER_UNNECESSARY_CLASS_REGEX = /\s*bc-browser[\w_-]+/ + def call css(*REMOVE_NODES).remove @@ -61,6 +63,94 @@ module Docs node.previous_element << node end + # New compatibility tables + + css('.bc-data #Legend + dl', '.bc-data #Legend', '.bc-data #Legend_2 + dl', '.bc-data #Legend_2', '.bc-browser-name').remove + + css('abbr.only-icon[title="Full support"]', + 'abbr.only-icon[title="Partial support"]', + 'abbr.only-icon[title="No support"]', + 'abbr.only-icon[title="See implementation notes"]').remove + + css('.bc-data .ic-altname', '.bc-data .ic-deprecated', '.bc-data .ic-non-standard', '.bc-data .ic-experimental').each do |node| + node.parent.remove + end + + css('abbr.only-icon').each do |node| + node.replace(node.content) + end + + css('.bc-table .bc-platforms td', '.bc-table .bc-browsers td').each do |node| + node.name = 'th' + end + + css('.bc-data').each do |node| + link = node.at_css('.bc-github-link') + prev = node.previous_element + prev = prev.previous_element until prev.name == 'h2' + prev.add_child(link) + + node.before(node.children).remove + end + + css('.bc-table').each do |node| + desktop_table = node + + mobile_table = node.dup + desktop_table.after(mobile_table) + + if desktop_table.at_css('.bc-platform-server') + server_table = node.dup + mobile_table.after(server_table) + end + + desktop_columns = desktop_table.at_css('th.bc-platform-desktop')['colspan'].to_i + mobile_columns = desktop_table.at_css('th.bc-platform-mobile')['colspan'].to_i + + desktop_table.css('.bc-platform-mobile').remove + desktop_table.css('.bc-platform-server').remove + desktop_table.css('.bc-browsers th').to_a[(desktop_columns + 1)..-1].each(&:remove) + desktop_table.css('tr:not(.bc-platforms):not(.bc-browsers)').each do |line| + line.css('td').to_a[(desktop_columns)..-1].each(&:remove) + end + + mobile_table.css('.bc-platform-desktop').remove + mobile_table.css('.bc-platform-server').remove + mobile_table.css('.bc-browsers th').to_a[1..(desktop_columns)].each(&:remove) + mobile_table.css('.bc-browsers th').to_a[(mobile_columns + 1)..-1].each(&:remove) + mobile_table.css('tr:not(.bc-platforms):not(.bc-browsers)').each do |line| + line.css('td').to_a[0..(desktop_columns - 1)].each(&:remove) + line.css('td').to_a[(mobile_columns)..-1].each(&:remove) + end + + if server_table + server_table.css('.bc-platform-desktop').remove + server_table.css('.bc-platform-mobile').remove + server_table.css('.bc-browsers th').to_a[1..(desktop_columns + mobile_columns)].each(&:remove) + server_table.css('tr:not(.bc-platforms):not(.bc-browsers)').each do |line| + line.css('td').to_a[0..(desktop_columns + mobile_columns - 1)].each(&:remove) + end + end + end + + # Reduce page size to make the offline bundle smaller. + css('.bc-supports-unknown').remove_attr('class') + css('td[class*="bc-platform"], th[class*="bc-platform"]').remove_attr('class') + css('td[class*="bc-browser"], th[class*="bc-browser"]').each do |node| + class_name = node['class'] + class_name.remove!(BROWSER_UNNECESSARY_CLASS_REGEX) + + if class_name.present? + node['class'] = class_name + else + node.remove_attribute('class') + end + end + + css('abbr[title*="Compatibility unknown"]').each do |node| + node.before(node.children).remove + end + doc end end