mirror of
https://github.com/Retrospring/retrospring.git
synced 2025-03-28 00:41:47 +01:00
CSS -> SCSS
This commit is contained in:
parent
3444fcc93e
commit
aec452cbd1
3 changed files with 115 additions and 44 deletions
|
@ -92,7 +92,15 @@ class UserController < ApplicationController
|
||||||
def data
|
def data
|
||||||
end
|
end
|
||||||
|
|
||||||
|
SCSS_STYLE = if Rails.env == 'production'
|
||||||
|
:compressed
|
||||||
|
else
|
||||||
|
:compact
|
||||||
|
end.freeze
|
||||||
|
|
||||||
def theme
|
def theme
|
||||||
render 'user/theme', formats: [:css], handlers: [:scss, :erb]
|
txt = render_to_string 'user/theme.css.scss', formats: [:erb]
|
||||||
|
sass = Sass::Engine.new txt, style: SCSS_STYLE, cache: false, load_paths: [], syntax: :scss
|
||||||
|
render body: sass.render.to_s, content_type: 'text/css'
|
||||||
end
|
end
|
||||||
end
|
end
|
||||||
|
|
|
@ -1,43 +0,0 @@
|
||||||
<% @primary_color ||= "#222" %>
|
|
||||||
<% @primary_border ||= "#151515" %>
|
|
||||||
<% @primary_text ||= "#eee" %>
|
|
||||||
<% @background_color ||= "#555" %>
|
|
||||||
body#version1 {
|
|
||||||
background-color: <%= @background_color %>;
|
|
||||||
}
|
|
||||||
|
|
||||||
body#version1 nav.navbar, body#version1 nav.navbar .dropdown-menu, body#version1 .j2-jumbo {
|
|
||||||
background-color: <%= @primary_color %>;
|
|
||||||
border-color: <%= @primary_border %>;
|
|
||||||
}
|
|
||||||
|
|
||||||
body#version1 nav.navbar * {
|
|
||||||
color: <%= @primary_text %>;
|
|
||||||
}
|
|
||||||
|
|
||||||
body#version1 .nav > li:not(.profile--image-dropdown):before {
|
|
||||||
background-color: <%= @primary_text %>;
|
|
||||||
}
|
|
||||||
|
|
||||||
body#version1 #profile--header.profile--no-header::before, body#version1 .userbox--no-header::before {
|
|
||||||
content: "";
|
|
||||||
position: absolute;
|
|
||||||
top: 0;
|
|
||||||
left: 0;
|
|
||||||
right: 0;
|
|
||||||
bottom: 0;
|
|
||||||
background: <%= @primary_border %>;
|
|
||||||
}
|
|
||||||
|
|
||||||
body#version1 .userbox--no-header, body#version1 .panel-body {
|
|
||||||
position: relative;
|
|
||||||
}
|
|
||||||
|
|
||||||
body#version1 #profile--header.profile--no-header img, body#version1 .userbox--no-header img {
|
|
||||||
opacity: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
body#version1 #debug {
|
|
||||||
background: white;
|
|
||||||
color: black;
|
|
||||||
}
|
|
106
app/views/user/theme.css.scss.erb
Normal file
106
app/views/user/theme.css.scss.erb
Normal file
|
@ -0,0 +1,106 @@
|
||||||
|
// PRIMARY COLOR
|
||||||
|
$primary_color: <%= @primary_color || "#222222" %>;
|
||||||
|
$primary_border: <%= @primary_border || "#151515" %>;
|
||||||
|
$primary_text: <%= @primary_text || "#eeeeee" %>;
|
||||||
|
|
||||||
|
// DANGER COLOR
|
||||||
|
$danger_color: <%= @danger_color || "#222222" %>;
|
||||||
|
$danger_border: <%= @danger_border || "#151515" %>;
|
||||||
|
$danger_text: <%= @danger_text || "#eeeeee" %>;
|
||||||
|
|
||||||
|
// SUCCESS COLOR
|
||||||
|
$success_color: <%= @success_color || "#222222" %>;
|
||||||
|
$success_border: <%= @success_border || "#151515" %>;
|
||||||
|
$success_text: <%= @success_text || "#eeeeee" %>;
|
||||||
|
|
||||||
|
// WARNING COLOR
|
||||||
|
$warning_color: <%= @warning_color || "#222222" %>;
|
||||||
|
$warning_border: <%= @warning_border || "#151515" %>;
|
||||||
|
$warning_text: <%= @warning_text || "#eeeeee" %>;
|
||||||
|
|
||||||
|
// INFO COLOR
|
||||||
|
$info_color: <%= @info_color || "#222222" %>;
|
||||||
|
$info_border: <%= @info_border || "#151515" %>;
|
||||||
|
$info_text: <%= @info_text || "#eeeeee" %>;
|
||||||
|
|
||||||
|
// COLOR COLOR (DEFAULT)
|
||||||
|
$color_color: <%= @color_color || "#222222" %>;
|
||||||
|
$color_border: <%= @color_border || "#151515" %>;
|
||||||
|
$color_text: <%= @color_text || "#eeeeee" %>;
|
||||||
|
|
||||||
|
|
||||||
|
// AUXILIARY COLOR
|
||||||
|
$link_color: <%= @link_color || "#111111" %>;
|
||||||
|
$background_color: <%= @background_color || "#555555" %>;
|
||||||
|
$background_text: <%= @background_text || "#eeeeee" %>;
|
||||||
|
$background_muted: <%= @background_muted || "#bbbbbb" %>;
|
||||||
|
|
||||||
|
body#version1 {
|
||||||
|
.links a {
|
||||||
|
&, :hover, :active {
|
||||||
|
color: $link_color;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
background-color: $background_color;
|
||||||
|
color: $background_text;
|
||||||
|
|
||||||
|
nav.navbar {
|
||||||
|
&, .dropdown-menu {
|
||||||
|
background-color: $primary_color;
|
||||||
|
border-color: $primary_border;
|
||||||
|
}
|
||||||
|
|
||||||
|
a {
|
||||||
|
&, :hover, :active {
|
||||||
|
color: $primary_text;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
> li:not(.profile--image-dropdown):before {
|
||||||
|
background-color: $primary_border;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.j2-jumbo {
|
||||||
|
background-color: $primary_color;
|
||||||
|
border-color: $primary_border;
|
||||||
|
}
|
||||||
|
|
||||||
|
#profile--header.profile--no-header:before, .userbox--no-header:before {
|
||||||
|
content: "";
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
bottom: 0;
|
||||||
|
background: $primary_border;
|
||||||
|
|
||||||
|
img {
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.userbox--no-header, .panel-body {
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn-primary {
|
||||||
|
background-color: $primary_color;
|
||||||
|
border-color: $primary_border;
|
||||||
|
color: $primary_text;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
background-color: $primary_border;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.text-muted {
|
||||||
|
color: $background_muted;
|
||||||
|
}
|
||||||
|
|
||||||
|
#debug {
|
||||||
|
background: white;
|
||||||
|
color: black;
|
||||||
|
}
|
||||||
|
}
|
Loading…
Reference in a new issue