openproject/app/views/custom_styles/_inline_css.erb

<%#-- copyright
OpenProject is a project management system.
Copyright (C) 2012-2015 the OpenProject Foundation (OPF)

This program is free software; you can redistribute it and/or
modify it under the terms of the GNU General Public License version 3.

OpenProject is a fork of ChiliProject, which is a fork of Redmine. The copyright follows:
Copyright (C) 2006-2013 Jean-Philippe Lang
Copyright (C) 2010-2013 the ChiliProject Team

This program is free software; you can redistribute it and/or
modify it under the terms of the GNU General Public License
as published by the Free Software Foundation; either version 2
of the License, or (at your option) any later version.

This program is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
GNU General Public License for more details.

You should have received a copy of the GNU General Public License
along with this program; if not, write to the Free Software
Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.

See doc/COPYRIGHT.rdoc for more details.

++#%>

<style>
  <% if CustomStyle.current.logo.present? %>
    #logo .home-link {
      margin: 0px;
      width: 230px;
      height: 55px;
      background-image: url("<%= custom_style_logo_path(digest: CustomStyle.current.digest, filename: CustomStyle.current.logo_identifier) %>");
      background-repeat: no-repeat;
      background-position-x: 0px;
      background-position-y: 0px;
      background-size: cover;
    }
  <% end %>

  :root {
  <%  DesignColor.overwritten.each do |design_color| %>
    --<%= design_color.variable %>: <%= design_color.hexcode %>;

    <% if design_color.variable == "primary-color" %>
      --header-border-bottom-color:         <%= design_color.hexcode %>;
      --footer-bg-color:                    <%= design_color.hexcode %>;
      --drop-down-selected-bg-color:        <%= design_color.hexcode %>;
      --button--highlight-background-color: <%= design_color.hexcode %>;
      --slider-thumb-color:                 <%= design_color.hexcode %>;
    <% end %>

    <% if design_color.variable == "primary-color-dark" %>
      --button--highlight-background-hover-color: <%= design_color.hexcode %>;
      --header-item-bg-hover-color:               <%= design_color.hexcode %>;
      --main-menu-child-bg-hover-selected-color:  <%= design_color.hexcode %>;
      --main-menu-selected-hover-indicator-color: <%= design_color.hexcode %>;
      --main-menu-bg-hover-selected-background: url() no-repeat <%= design_color.hexcode %>;
      --content-link-color:                       <%= design_color.hexcode %>;
      --content-icon-color:                       <%= design_color.hexcode %>;
      --content-link-hover-active-color:          <%= design_color.hexcode %>;
    <% end %>

    <% if design_color.variable == "alternative-color" %>
        --button--alt-highlight-background-hover-color: <%= darken_color design_color.hexcode, 0.82 %>;
    <% end %>
  <% end %>
  }

</style>