From 03e9a59cd1ac46ea1fcd9f3c9c2f448a32f86787 Mon Sep 17 00:00:00 2001 From: Oliver Falk Date: Sat, 1 Dec 2018 21:58:16 +0100 Subject: [PATCH] Allow user preferences again --- .../ivataraccount/templates/preferences.html | 20 +- ivatar/ivataraccount/views.py | 15 +- ivatar/static/css/falko.css | 338 ++++++++++++++++++ templates/_account_bar.html | 2 - templates/base.html | 1 - templates/base_home.html | 1 - 6 files changed, 367 insertions(+), 10 deletions(-) create mode 100644 ivatar/static/css/falko.css diff --git a/ivatar/ivataraccount/templates/preferences.html b/ivatar/ivataraccount/templates/preferences.html index e391abf..78d3be5 100644 --- a/ivatar/ivataraccount/templates/preferences.html +++ b/ivatar/ivataraccount/templates/preferences.html @@ -7,11 +7,21 @@ {% block content %}

{% trans 'Account settings' %}

-{% if has_password %} -

{% trans 'Change your password' %}

-{% else %} -

{% trans 'Set a password' %}

-{% endif %} +

+

{% csrf_token %} +
+ +
+ +
+
+

+ +
diff --git a/ivatar/ivataraccount/views.py b/ivatar/ivataraccount/views.py index 9452697..afe8977 100644 --- a/ivatar/ivataraccount/views.py +++ b/ivatar/ivataraccount/views.py @@ -722,8 +722,21 @@ class UserPreferenceView(FormView, UpdateView): form_class = UpdatePreferenceForm success_url = reverse_lazy('user_preference') + def post(self, request, *args, **kwargs): # pylint: disable=unused-argument + self.request.user.userpreference.theme = request.POST['theme'] + self.request.user.userpreference.save() + return HttpResponseRedirect(reverse_lazy('user_preference')) + + + def get(self, request, *args, **kwargs): + return render(self.request, self.template_name, { + 'THEMES': UserPreference.THEMES, + }) + + def get_object(self, queryset=None): - return self.request.user.userpreference + (obj, created) = UserPreference.objects.get_or_create(user=self.request.user) # pylint: disable=no-member,unused-variable + return obj @method_decorator(login_required, name='dispatch') diff --git a/ivatar/static/css/falko.css b/ivatar/static/css/falko.css new file mode 100644 index 0000000..1268223 --- /dev/null +++ b/ivatar/static/css/falko.css @@ -0,0 +1,338 @@ +/// Example theme using tortin with bg-hero:@lab-green; +body { + font-family: 'Source Sans Pro', Helvetica, Arial, sans-serif; + color: #525252; +} +.btn { + border-bottom-width: 3px; + box-sizing: border-box; + font-family: 'Montserrat', sans-serif; + text-transform: uppercase; + background: #3aa850; + overflow: hidden; + position: relative; + -webkit-transition: all 0.3s; + -moz-transition: all 0.3s; + -ms-transition: all 0.3s; + transition: all 0.3s; +} +.btn.btn-default { + color: #52c368; + border-color: #52c368; + background: none; +} +.btn.btn-primary { + border-color: #266f35; +} +.btn:hover, +.btn:active, +.btn:focus { + background: none; + border-color: #2d823e; + color: #2d823e; +} +.btn:hover:after, +.btn:active:after, +.btn:focus:after { + top: 50%; +} +.btn:after { + content: ''; + position: absolute; + z-index: -1; + width: 150%; + height: 200%; + top: -190%; + left: 50%; + background: #78d089; + -webkit-transform: translateX(-50%) translateY(-50%) skew(0, 5deg); + -moz-transform: translateX(-50%) translateY(-50%) skew(0, 5deg); + -ms-transform: translateX(-50%) translateY(-50%) skew(0, 5deg); + transform: translateX(-50%) translateY(-50%) skew(0, 5deg); + -webkit-transition: all 0.5s ease-out; + -moz-transition: all 0.5s ease-out; + -ms-transition: all 0.5s ease-out; + transition: all 0.5s ease-out; +} +.btn.btn-block:after { + height: 250%; + width: 200%; + -webkit-transform: translateX(-50%) translateY(-50%) skew(0, 2deg); + -moz-transform: translateX(-50%) translateY(-50%) skew(0, 2deg); + -ms-transform: translateX(-50%) translateY(-50%) skew(0, 2deg); + transform: translateX(-50%) translateY(-50%) skew(0, 2deg); +} +.hero { + background-color: #3aa850; + color: #fff; + padding: 90px 0 40px; +} +.hero h1 { + font-weight: 600; + font-size: 6em; + color: rgba(255, 255, 255, 0.5); +} +.hero h2 { + font-weight: 200; + font-size: 30px; + margin-bottom: 30px; +} +.hero small { + color: rgba(0, 0, 0, 0.4); +} +.hero .btn { + display: inline-block; +} +.hero .btn.btn-default { + color: #7fd390; + border-color: #7fd390; + background: none; +} +.hero .btn.btn-primary { + border-color: #fff; +} +.hero .btn:hover, +.hero .btn:active, +.hero .btn:focus { + border-color: #fff; + color: #205c2c; +} +.hero .btn:after { + background: rgba(255, 255, 255, 0.5); +} +.hero .container { + position: relative; + z-index: 10; +} +.social { + background-color: #3aa850; + padding: 30px 0 140px; +} +.social ul { + list-style: none; + padding: 0; + margin: 0; +} +.social ul li { + float: left; + margin-right: 15px; + width: 100px; +} +.clipper, +.clipper-footer { + background-color: #fff; + height: 110px; + width: 100%; + position: relative; + top: -40px; + -webkit-transform: skew(0, 2deg); + -moz-transform: skew(0, 2deg); + -ms-transform: skew(0, 2deg); + transform: skew(0, 2deg); + pointer-events: none; + z-index: 1; +} +.clipper-footer { + top: 0; +} +section.content { + position: relative; + top: -100px; + margin-bottom: -100px; + z-index: 10; +} +section.content h1, +section.content h2, +section.content h3, +section.content h4, +section.content h5, +section.content h6 { + color: #2d823e; +} +section.content h2 { + font-weight: 200; + font-size: 40px; +} +section.content section { + margin-bottom: 20px; + margin-top: 20px; +} +section.content .container > hr { + -webkit-transform: skew(0, 2deg); + -moz-transform: skew(0, 2deg); + -ms-transform: skew(0, 2deg); + transform: skew(0, 2deg); + margin-top: 80px; + margin-bottom: 40px; +} +footer { + background-color: #dddddd; + color: #888888; + padding: 100px 0 40px; + margin-top: -40px; +} +footer .pull-left { + margin-right: 20px; +} +footer .logo { + float: left; + display: inline-block; + margin-right: 5px; + margin-top: -8px; +} +footer .logo .circle { + stroke: #888888; + stroke-width: 7; + fill: none; +} +footer .logo .polygon { + fill: #888888; +} +@media (max-width: 768px) { + .hero { + padding: 50px 0 30px; + } + .hero h1 { + font-size: 4em; + } + .social { + padding: 30px 0 100px; + } + .btn { + margin-bottom: 5px; + } + section.content section { + margin-bottom: 50px; + } +} +.color { + display: inline-block; + border-radius: 50%; + height: 20px; + width: 20px; +} +.color.blue { + background-color: #36b7d7; +} +.color.green { + background-color: #3aa850; +} +.color.red { + background-color: #f7645e; +} +.color.black { + background-color: #525252; +} +.navbar-tortin { + border: 0; + background-color: #3aa850; + color: #FFFFFF; + border-radius: 0; +} +.form-control { + border-bottom-width: 3px; + box-sizing: border-box; + font-family: 'Montserrat', sans-serif; + overflow: hidden; + position: relative; + -webkit-transition: all 0.3s; + -moz-transition: all 0.3s; + -ms-transition: all 0.3s; + transition: all 0.3s; + border-color: #52c368; + background: none; +} +.form-control:focus { + border-color: #2d823e; + box-shadow: none; +} +.navbar-tortin .navbar-brand, +.navbar-tortin .navbar-text, +.navbar-tortin .navbar-nav > li > a, +.navbar-tortin .navbar-link, +.navbar-tortin .btn-link { + color: #FFFFFF; +} +.navbar-tortin .navbar-nav > .active > a, +.navbar-tortin .navbar-nav > .active > a:focus, +.navbar-tortin .navbar-nav > .active > a:hover, +.navbar-tortin .navbar-nav > li > a:focus, +.navbar-tortin .navbar-nav > li > a:hover, +.navbar-tortin .navbar-link:hover, +.navbar-tortin .btn-link:focus, +.navbar-tortin .btn-link:hover, +.navbar-tortin .navbar-nav > .open > a, +.navbar-tortin .navbar-nav > .open > a:focus, +.navbar-tortin .navbar-nav > .open > a:hover { + background-color: #2d823e; +} +.navbar-tortin .navbar-toggle { + border-color: #FFFFFF; +} +.navbar-tortin .navbar-toggle:hover { + background-color: #FFFFFF; +} +.navbar-tortin .navbar-toggle .icon-bar { + background-color: #FFFFFF; +} +.navbar-tortin .navbar-toggle:hover .icon-bar { + background-color: #3aa850; +} +.navbar-tortin .navbar-collapse, +.navbar-tortin .navbar-form { + border: 0; +} +@media (max-width: 767px) { + .navbar-tortin .navbar-nav .open .dropdown-menu > li > a { + color: #FFFFFF; + } + .navbar-tortin .navbar-nav .open .dropdown-menu > li > a:hover { + background-color: #2d823e; + } + .navbar-tortin .navbar-nav .open .dropdown-menu > .active > a, + .navbar-tortin .navbar-nav .open .dropdown-menu > .active > a:focus, + .navbar-tortin .navbar-nav .open .dropdown-menu > .active > a:hover { + background-color: #2d823e; + } +} +.panel-tortin { + border-color: #3aa850; + border-bottom-width: 3px; +} +.panel-tortin > .panel-heading { + color: #fff; + background-color: #3aa850; + border-color: #3aa850; + font-family: 'Montserrat', sans-serif; +} +.panel-tortin > .panel-heading + .panel-collapse > .panel-body { + border-top-color: #3aa850; +} +.panel-tortin > .panel-heading .badge { + color: #3aa850; + background-color: #fff; +} +.panel-tortin > .panel-footer + .panel-collapse > .panel-body { + border-bottom-color: #3aa850; +} +.alert.alert-danger { + background-color: #FFFFFF; + color: #f7645e; + border-color: #f7645e; + border-bottom-width: 3px; + box-sizing: border-box; + font-family: 'Montserrat', sans-serif; + overflow: hidden; + position: relative; +} +.input-group-addon { + border-bottom-width: 3px; + box-sizing: border-box; + font-family: 'Montserrat', sans-serif; + overflow: hidden; + position: relative; + border-color: #52c368; + background: none; + width: auto; + height: 36px; +} diff --git a/templates/_account_bar.html b/templates/_account_bar.html index b44b4ef..0e43024 100644 --- a/templates/_account_bar.html +++ b/templates/_account_bar.html @@ -12,9 +12,7 @@