diff --git a/app/javascript/styles/overrides/_navbar.scss b/app/javascript/styles/overrides/_navbar.scss index f5959ff0..e00e0e81 100644 --- a/app/javascript/styles/overrides/_navbar.scss +++ b/app/javascript/styles/overrides/_navbar.scss @@ -6,6 +6,14 @@ &:focus { color: RGB(var(--primary-text)); } + + /* svg-logo! \o/ */ + svg { + height: $navbar-brand-font-size; + path { + fill: RGB(var(--primary-text)); + } + } } .navbar-nav { @@ -47,4 +55,4 @@ color: RGB(var(--primary-text)); } } -} \ No newline at end of file +} diff --git a/app/views/navigation/_desktop.haml b/app/views/navigation/_desktop.haml index 9fdb0a0e..4678d684 100644 --- a/app/views/navigation/_desktop.haml +++ b/app/views/navigation/_desktop.haml @@ -1,7 +1,10 @@ %nav.navbar.navbar-themed.navbar-expand-lg.bg-primary.fixed-top.d-lg-block.d-none.d-print-none{ role: :navigation } .container{ class: ios_web_app? ? 'ios-web-app' : '' } - %a.navbar-brand{ href: '/' } - = APP_CONFIG['site_name'] + %a.navbar-brand{ href: '/', title: APP_CONFIG["site_name"] } + - if APP_CONFIG["use_svg_logo"] + = render inline: Rails.application.config.justask_svg_logo + - else + = APP_CONFIG["site_name"] %ul.nav.navbar-nav.mr-auto = nav_entry t("navigation.timeline"), root_path, icon: 'home' = nav_entry t("navigation.inbox"), '/inbox', icon: 'inbox', badge: inbox_count diff --git a/app/views/navigation/_guest.haml b/app/views/navigation/_guest.haml index d34f9455..282fbcab 100644 --- a/app/views/navigation/_guest.haml +++ b/app/views/navigation/_guest.haml @@ -1,6 +1,10 @@ %nav.navbar.navbar-themed.navbar-expand-lg.bg-primary.fixed-top{ role: :navigation } .container{ class: ios_web_app? ? 'ios-web-app' : '' } - %a.navbar-brand{ href: '/' }= APP_CONFIG['site_name'] + %a.navbar-brand{ href: '/', title: APP_CONFIG["site_name"] } + - if APP_CONFIG["use_svg_logo"] + = render inline: Rails.application.config.justask_svg_logo + - else + = APP_CONFIG["site_name"] %button.navbar-toggler{ data: { target: '#j2-main-navbar-collapse', toggle: :collapse }, type: :button } %span.sr-only= t("navigation.toggle") %span.navbar-toggler-icon diff --git a/config/initializers/svg_logo.rb b/config/initializers/svg_logo.rb new file mode 100644 index 00000000..166695e5 --- /dev/null +++ b/config/initializers/svg_logo.rb @@ -0,0 +1,20 @@ +# frozen_string_literal: true + +return unless APP_CONFIG[:use_svg_logo] + +begin + logo_path = Rails.public_path.join("logo.svg") + # we are only interested in the first element which should be the node --> extract it and transform some attributes + logo_svg = File.read(logo_path) + svg_doc = Nokogiri::XML(logo_svg) + svg_node = svg_doc.first_element_child + # remove some attributes that might interfere with the rest of the layout + %w[id name class width height].each do |attr| + svg_node.remove_attribute attr + end + + Rails.application.config.justask_svg_logo = svg_node.to_xml +rescue => e + warn "use_svg_logo is enabled, but the SVG could not be read due to: #{e.message} (#{e.class.name}). Disabling SVG logo." + APP_CONFIG[:use_svg_logo] = false +end diff --git a/config/justask.yml.example b/config/justask.yml.example index b5e33f98..f4803e0c 100644 --- a/config/justask.yml.example +++ b/config/justask.yml.example @@ -1,6 +1,9 @@ # The site name, shown everywhere. site_name: "justask" +# Use the SVG logo from `/public/logo.svg` +use_svg_logo: false + hostname: "justask.rrerr.net" https: true diff --git a/public/logo.svg b/public/logo.svg new file mode 100644 index 00000000..b313d988 --- /dev/null +++ b/public/logo.svg @@ -0,0 +1 @@ + \ No newline at end of file