use variables for background colors
This commit is contained in:
parent
770c000a93
commit
40b2e06c83
3 changed files with 34 additions and 6 deletions
|
@ -1,3 +1,10 @@
|
|||
:root {
|
||||
--bg-color-1: #6666ff;
|
||||
--bg-color-2: #0099ff;
|
||||
--bg-color-3: #ffff00;
|
||||
--bg-color-4: #ff3399;
|
||||
}
|
||||
|
||||
@keyframes background_animation {
|
||||
0%,100% {
|
||||
background-position: 0 0;
|
||||
|
@ -10,7 +17,7 @@
|
|||
}
|
||||
}
|
||||
body {
|
||||
background: linear-gradient(to right, #6666ff, #0099ff , #ffff00, #ff3399);
|
||||
background: linear-gradient(to right, var(--bg-color-1), var(--bg-color-2) , var(--bg-color-3), var(--bg-color-4));
|
||||
animation: background_animation 60s ease-in-out infinite;
|
||||
background-size: 400% 100%;
|
||||
color: #ddd;
|
||||
|
|
|
@ -2,10 +2,10 @@
|
|||
{% block main %}
|
||||
<style>
|
||||
:root {
|
||||
--film-color: {{ film.color }};
|
||||
}
|
||||
body {
|
||||
background: var(--film-color);
|
||||
--bg-color-1: {{ film.color_1 }};
|
||||
--bg-color-2: {{ film.color_2 }};
|
||||
--bg-color-3: {{ film.color_2 }};
|
||||
--bg-color-4: {{ film.color_4 }};
|
||||
}
|
||||
|
||||
</style>
|
||||
|
|
|
@ -37,13 +37,34 @@ class Film(models.Model):
|
|||
def duration(self):
|
||||
return ox.format_timecode(self.data['duration'])[:-4]
|
||||
|
||||
def color(self):
|
||||
def color_1(self):
|
||||
hue = self.data['hue']
|
||||
saturation = self.data['saturation'] * 100
|
||||
saturation = 70
|
||||
lightness = self.data['lightness'] * 100
|
||||
return "hsl({}, {}%, {}%)".format(hue, saturation, lightness)
|
||||
|
||||
def color_2(self):
|
||||
hue = self.data['hue']
|
||||
saturation = self.data['saturation'] * 100
|
||||
saturation = 70
|
||||
lightness = self.data['lightness'] * 50
|
||||
return "hsl({}, {}%, {}%)".format(hue, saturation, lightness)
|
||||
|
||||
def color_3(self):
|
||||
hue = self.data['hue']
|
||||
saturation = self.data['saturation'] * 100
|
||||
saturation = 70
|
||||
lightness = self.data['lightness'] * 110
|
||||
return "hsl({}, {}%, {}%)".format(hue, saturation, lightness)
|
||||
|
||||
def color_4(self):
|
||||
hue = self.data['hue']
|
||||
saturation = self.data['saturation'] * 100
|
||||
saturation = 70
|
||||
lightness = self.data['lightness'] * 80
|
||||
return "hsl({}, {}%, {}%)".format(hue, saturation, lightness)
|
||||
|
||||
def json(self):
|
||||
data = {}
|
||||
data['id'] = self.padma_id
|
||||
|
|
Loading…
Reference in a new issue