Ruby on Rails: 다크 모드: TLDR

1734 단어 rubyrailscssdark
열을 옮기거나 현재 사용자를 가지거나 새 스타일시트를 추가할 필요가 없습니다.
다음은 내 웹 사이트에서 작동하는 방법입니다.

Live Demo - try to click yourself!

다음과 같은 이점을 제공합니다.

  • 설정bodyclass 및 선택theme에 대한 링크를 만듭니다.
  • # application.html.erb
    
    <body class="<%= cookies[:theme] %>">
    
      <% if cookies[:theme] == "light" %>
        <%= link_to "go dark", root_path(theme: "dark") %>
      <% else %>
        <%= link_to "go light", root_path(theme: "light") %>
      <% end %>
    
      <%= yield %>
    
    </body>
    
  • theme 중 지속cookies:
  • # application_controller.rb
    
    before_action :set_theme
    
    def set_theme
      if params[:theme].present?
        theme = params[:theme].to_sym
        # session[:theme] = theme
        cookies[:theme] = theme
        redirect_to(request.referrer || root_path)
      end
    end
    
  • css 파일을 업데이트합니다.
  • # application.scss
    
    body.light {
      color: black;
      background-color: white;
    }
    body.dark {
      color: white;
      background-color: black;
    }
    
    이렇게!현재 당신은 자신의 취향에 따라 맞춤형css을 제작할 수 있습니다.
    Originally posted here
    이렇게!🤠
    이 문장을 좋아합니까?따라오세요!이것은 정말 나에게 더 많은 재미있는 것을 발표하도록 격려할 것이다.

    좋은 웹페이지 즐겨찾기