ungleich-public/public-health-ch
6
1
Fork 0
Code Issues Pull requests 1 Projects Releases Wiki Activity

Rebuilt CSS

Browse source
This commit is contained in:
Oleg Lavrovsky 2017-02-14 20:57:32 +01:00
commit f7c5bf8ba9
16 changed files with 592 additions and 297 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
.gitignore vendored
View file

@ -1,6 +1,7 @@
*.pyc *.pyc
.sass-cache .sass-cache
.DS_Store .DS_Store
*.min.css
*.swp *.swp
*.sqlite3 *.sqlite3
/env/ /env/

165
config.codekit3
View file

@ -7,7 +7,7 @@
"uuidString": "0F980939-F438-4FD0-A285-8ECBB562D22C" "uuidString": "0F980939-F438-4FD0-A285-8ECBB562D22C"
} }
], ],
"creatorBuild": "25479", "creatorBuild": "25504",
"files": { "files": {
"\/.bowerrc": { "\/.bowerrc": {
"ft": 8192, "ft": 8192,
@ -27,48 +27,18 @@
"oAP": "\/.gitignore", "oAP": "\/.gitignore",
"oF": 0 "oF": 0
}, },
"\/.vagrant\/machines\/default\/virtualbox\/action_provision": {
"ft": 8192,
"oA": 2,
"oAP": "\/.vagrant\/machines\/default\/virtualbox\/action_provision",
"oF": 0
},
"\/.vagrant\/machines\/default\/virtualbox\/action_set_name": {
"ft": 8192,
"oA": 2,
"oAP": "\/.vagrant\/machines\/default\/virtualbox\/action_set_name",
"oF": 0
},
"\/.vagrant\/machines\/default\/virtualbox\/creator_uid": {
"ft": 8192,
"oA": 2,
"oAP": "\/.vagrant\/machines\/default\/virtualbox\/creator_uid",
"oF": 0
},
"\/.vagrant\/machines\/default\/virtualbox\/id": {
"ft": 8192,
"oA": 2,
"oAP": "\/.vagrant\/machines\/default\/virtualbox\/id",
"oF": 0
},
"\/.vagrant\/machines\/default\/virtualbox\/index_uuid": {
"ft": 8192,
"oA": 2,
"oAP": "\/.vagrant\/machines\/default\/virtualbox\/index_uuid",
"oF": 0
},
"\/.vagrant\/machines\/default\/virtualbox\/synced_folders": {
"ft": 8192,
"oA": 2,
"oAP": "\/.vagrant\/machines\/default\/virtualbox\/synced_folders",
"oF": 0
},
"\/bin\/post_compile": { "\/bin\/post_compile": {
"ft": 8192, "ft": 8192,
"oA": 2, "oA": 2,
"oAP": "\/bin\/post_compile", "oAP": "\/bin\/post_compile",
"oF": 0 "oF": 0
}, },
"\/bitbucket-pipelines.yml": {
"ft": 8192,
"oA": 2,
"oAP": "\/bitbucket-pipelines.yml",
"oF": 0
},
"\/bower.json": { "\/bower.json": {
"ft": 524288, "ft": 524288,
"oA": 1, "oA": 1,
@ -160,42 +130,12 @@
"oAP": "\/publichealth\/__init__.py", "oAP": "\/publichealth\/__init__.py",
"oF": 0 "oF": 0
}, },
"\/publichealth\/__pycache__\/__init__.cpython-34.pyc": {
"ft": 8192,
"oA": 1,
"oAP": "\/publichealth\/__pycache__\/__init__.cpython-34.pyc",
"oF": 0
},
"\/publichealth\/__pycache__\/urls.cpython-34.pyc": {
"ft": 8192,
"oA": 2,
"oAP": "\/publichealth\/__pycache__\/urls.cpython-34.pyc",
"oF": 0
},
"\/publichealth\/home\/__init__.py": { "\/publichealth\/home\/__init__.py": {
"ft": 8192, "ft": 8192,
"oA": 1, "oA": 1,
"oAP": "\/publichealth\/home\/__init__.py", "oAP": "\/publichealth\/home\/__init__.py",
"oF": 0 "oF": 0
}, },
"\/publichealth\/home\/__pycache__\/__init__.cpython-34.pyc": {
"ft": 8192,
"oA": 1,
"oAP": "\/publichealth\/home\/__pycache__\/__init__.cpython-34.pyc",
"oF": 0
},
"\/publichealth\/home\/__pycache__\/models.cpython-34.pyc": {
"ft": 8192,
"oA": 2,
"oAP": "\/publichealth\/home\/__pycache__\/models.cpython-34.pyc",
"oF": 0
},
"\/publichealth\/home\/__pycache__\/util.cpython-34.pyc": {
"ft": 8192,
"oA": 2,
"oAP": "\/publichealth\/home\/__pycache__\/util.cpython-34.pyc",
"oF": 0
},
"\/publichealth\/home\/migrations\/0001_initial.py": { "\/publichealth\/home\/migrations\/0001_initial.py": {
"ft": 8192, "ft": 8192,
"oA": 2, "oA": 2,
@ -220,30 +160,6 @@
"oAP": "\/publichealth\/home\/migrations\/__init__.py", "oAP": "\/publichealth\/home\/migrations\/__init__.py",
"oF": 0 "oF": 0
}, },
"\/publichealth\/home\/migrations\/__pycache__\/0001_initial.cpython-34.pyc": {
"ft": 8192,
"oA": 2,
"oAP": "\/publichealth\/home\/migrations\/__pycache__\/0001_initial.cpython-34.pyc",
"oF": 0
},
"\/publichealth\/home\/migrations\/__pycache__\/0002_create_homepage.cpython-34.pyc": {
"ft": 8192,
"oA": 2,
"oAP": "\/publichealth\/home\/migrations\/__pycache__\/0002_create_homepage.cpython-34.pyc",
"oF": 0
},
"\/publichealth\/home\/migrations\/__pycache__\/0003_auto_20161209_0655.cpython-34.pyc": {
"ft": 8192,
"oA": 2,
"oAP": "\/publichealth\/home\/migrations\/__pycache__\/0003_auto_20161209_0655.cpython-34.pyc",
"oF": 0
},
"\/publichealth\/home\/migrations\/__pycache__\/__init__.cpython-34.pyc": {
"ft": 8192,
"oA": 1,
"oAP": "\/publichealth\/home\/migrations\/__pycache__\/__init__.cpython-34.pyc",
"oF": 0
},
"\/publichealth\/home\/models.py": { "\/publichealth\/home\/models.py": {
"ft": 8192, "ft": 8192,
"oA": 2, "oA": 2,
@ -274,18 +190,6 @@
"oAP": "\/publichealth\/search\/__init__.py", "oAP": "\/publichealth\/search\/__init__.py",
"oF": 0 "oF": 0
}, },
"\/publichealth\/search\/__pycache__\/__init__.cpython-34.pyc": {
"ft": 8192,
"oA": 1,
"oAP": "\/publichealth\/search\/__pycache__\/__init__.cpython-34.pyc",
"oF": 0
},
"\/publichealth\/search\/__pycache__\/views.cpython-34.pyc": {
"ft": 8192,
"oA": 2,
"oAP": "\/publichealth\/search\/__pycache__\/views.cpython-34.pyc",
"oF": 0
},
"\/publichealth\/search\/templates\/search\/search.html": { "\/publichealth\/search\/templates\/search\/search.html": {
"ft": 8192, "ft": 8192,
"oA": 2, "oA": 2,
@ -310,24 +214,6 @@
"oAP": "\/publichealth\/settings\/__init__.py", "oAP": "\/publichealth\/settings\/__init__.py",
"oF": 0 "oF": 0
}, },
"\/publichealth\/settings\/__pycache__\/__init__.cpython-34.pyc": {
"ft": 8192,
"oA": 1,
"oAP": "\/publichealth\/settings\/__pycache__\/__init__.cpython-34.pyc",
"oF": 0
},
"\/publichealth\/settings\/__pycache__\/base.cpython-34.pyc": {
"ft": 8192,
"oA": 2,
"oAP": "\/publichealth\/settings\/__pycache__\/base.cpython-34.pyc",
"oF": 0
},
"\/publichealth\/settings\/__pycache__\/dev.cpython-34.pyc": {
"ft": 8192,
"oA": 2,
"oAP": "\/publichealth\/settings\/__pycache__\/dev.cpython-34.pyc",
"oF": 0
},
"\/publichealth\/settings\/base.py": { "\/publichealth\/settings\/base.py": {
"ft": 8192, "ft": 8192,
"oA": 2, "oA": 2,
@ -385,6 +271,19 @@
"oS": 0, "oS": 0,
"uL": 1 "uL": 1
}, },
"\/publichealth\/static\/css\/modules\/_mixins.scss": {
"aP": 0,
"bl": 0,
"dP": 10,
"dS": 0,
"ft": 4,
"ma": 0,
"oA": 1,
"oAP": "\/publichealth\/static\/css\/css\/_mixins.css",
"oF": 0,
"oS": 0,
"uL": 1
},
"\/publichealth\/static\/css\/modules\/_modules.scss": { "\/publichealth\/static\/css\/modules\/_modules.scss": {
"aP": 0, "aP": 0,
"bl": 0, "bl": 0,
@ -3307,6 +3206,22 @@
"oF": 0, "oF": 0,
"opt": 0 "opt": 0
}, },
"\/publichealth\/static\/mockup\/images\/thumb_news_1.jpg": {
"ft": 16384,
"iS": 173465,
"oA": 0,
"oAP": "\/publichealth\/static\/mockup\/images\/thumb_news_1.jpg",
"oF": 0,
"opt": 1
},
"\/publichealth\/static\/mockup\/images\/thumb_news_2.jpg": {
"ft": 16384,
"iS": 72163,
"oA": 0,
"oAP": "\/publichealth\/static\/mockup\/images\/thumb_news_2.jpg",
"oF": 0,
"opt": 1
},
"\/publichealth\/static\/mockup\/index.html": { "\/publichealth\/static\/mockup\/index.html": {
"ft": 8192, "ft": 8192,
"oA": 2, "oA": 2,
@ -4062,6 +3977,10 @@
"active": 0, "active": 0,
"optionString": "" "optionString": ""
}, },
"no-await-in-loop": {
"active": 0,
"optionString": ""
},
"no-bitwise": { "no-bitwise": {
"active": 0, "active": 0,
"optionString": "{'allow': ['~'], 'int32Hint': true}" "optionString": "{'allow': ['~'], 'int32Hint': true}"
@ -4602,6 +4521,10 @@
"active": 0, "active": 0,
"optionString": "{'destructuring': 'any', 'ignoreReadBeforeAssign': false}" "optionString": "{'destructuring': 'any', 'ignoreReadBeforeAssign': false}"
}, },
"prefer-destructuring": {
"active": 0,
"optionString": "{'array': true, 'object': true}, {'enforceForRenamedProperties': false}"
},
"prefer-numeric-literals": { "prefer-numeric-literals": {
"active": 0, "active": 0,
"optionString": "" "optionString": ""

2
publichealth/static/css/main.scss
View file

@ -10,7 +10,7 @@
body { body {
margin-top: 64px; margin-top: 104px;
} }
section { section {

93
publichealth/static/css/modules/_banner.scss
View file

@ -1,13 +1,96 @@
/* Page header */ // Carousel
$banner-height: 700px; #myCarousel {
// display: none;
background: $gray-lighter;
.item {
background-color: lighten($brand-primary, 10%);
min-height: 300px;
img {
height: 300px;
background-size: cover;
background-position: center;
width: 100%;
}
h3 {
text-transform: uppercase;
font-weight: 300;
}
p {
line-height: 1.2;
width: 80%;
margin: 0 auto;
}
.btn {
margin-top: 20px;
}
}
.nav-thumbs {
@mixin max-screen($max) { list-style: none;
@media only screen and (max-width: $max) { display: flex;
@content; margin: 0;
padding: 0;
text-align: center;
li {
float: left;
width: 25%;
&.active {
background-color: $brand-primary;
a {
color: white;
}
}
.glyphicon {
display: block;
}
}
.title {
text-transform: uppercase;
font-weight: 300;
text-decoration: none;
width: 100%;
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
small {
font-weight: 500;
text-transform: none;
display: block;
font-size: .7em;
width: 100%;
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
}
}
&.nav-justified > li > a {
border-radius: 0px;
}
}
@include max-screen($screen-xs-max) {
.nav-thumbs {
.title {
font-size: .7em;
}
}
} }
} }
/* Page header */
$banner-height: 700px;
#carousel-banner {
display: none;
}
#banner, #carousel-banner { #banner, #carousel-banner {
padding-top: 0 !important; padding-top: 0 !important;
padding-bottom: 0em; padding-bottom: 0em;

6
publichealth/static/css/modules/_footer.scss
View file

@ -1,16 +1,16 @@
footer#footer { footer#footer {
padding: 6em 0; padding: 6em 0;
background-color: $brand-secondary; background-color: $brand-primary;
color: white; color: white;
a { a {
color: lighten($brand-primary, 10%); color: lighten($brand-secondary, 10%);
} }
} }
.copyright { .copyright {
background-color: darken($brand-secondary, 15%); background-color: darken($brand-primary, 15%);
color: white; color: white;
text-align: center; text-align: center;
font-size: 70%; font-size: 70%;

7
publichealth/static/css/modules/_mixins.scss Normal file
View file

@ -0,0 +1,7 @@
// max-screen
@mixin max-screen($max) {
@media only screen and (max-width: $max) {
@content;
}
}

1
publichealth/static/css/modules/_modules.scss
View file

@ -1,3 +1,4 @@
@import "mixins";
@import "navbar"; @import "navbar";
@import "banner"; @import "banner";
@import "footer"; @import "footer";

47
publichealth/static/css/modules/_navbar.scss
View file

@ -1,24 +1,49 @@
.navbar-default { .navbar-pre {
&.navbar-pre { background-color: $brand-primary;
background-color: $brand-primary; height: 40px;
.navbar-text, li a { .nav {
margin: 5px 15px; text-align: right;
a {
color: white; color: white;
font-size: 70%; padding: 10px;
line-height: 40px;
vertical-align: middle;
} }
li { .contact-nav {
margin: 0 5px; margin-right: 1em;
padding: 0; a {
margin: 0 5px;
font-size: .7em;
&.link {
text-transform: uppercase;
}
}
}
.language-nav {
text-transform: uppercase;
a { a {
margin: 0; margin: 0;
padding: 0 10px; &.active, &:hover {
background-color: white;
color: $brand-primary;
}
}
}
@include max-screen($screen-xs-max) {
.contact-nav a {
font-size: .9em;
padding: 10px 5px;
} }
} }
} }
}
.navbar-default {
&.navbar-main { &.navbar-main {
top: 35px; top: 40px;
} }
.navbar-header { .navbar-header {
.navbar-brand { .navbar-brand {

68
publichealth/static/css/modules/_news.scss
View file

@ -3,38 +3,74 @@
#news { #news {
.panel-default { .panel-default {
position: relative;
font-size: 90%; font-size: 90%;
transition: transform .6s; padding-top: 75%; /* 1:1 Aspect Ratio */
position: relative; /* If you want text inside of it */
overflow: hidden;
background: lighten($brand-primary, 10%);
&:hover { img {
transform: scale(1.05); position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
} }
.panel-header img {
max-width: 100%;
}
.panel-body { .panel-body {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
padding: 0;
transform: translateY(60%);
background-color: rgba($brand-primary, .8);
transition: transform .65s;
h3, p {
color: white;
}
h3 {
padding: 15px;
font-size: 1.2em;
margin: 0;
height: 40%;
display: table;
span {
display: table-cell;
vertical-align: bottom;
}
}
p, a {
font-size: .8em;
}
p {
padding: 0 15px;
line-height: 1.2;
margin: 0;
}
a { a {
position: relative; margin: 10px 0 0 15px;
font-size: 80%; text-align: center;
z-index: 2;
} }
} }
.panel-footer { &:hover .panel-body {
font-size: 80%; transform: rotateY(0);
text-transform: uppercase;
color: lighten($text-color, 10%);
} }
// expand link over the thumbnail
a.fill { a.fill {
position: absolute; position: absolute;
top: 0; top: 0;
left: 0; left: 0;
width: 100%; width: 100%;
height: 100%; height: 100%;
z-index: 1; font-size: 0;
} }
} }
} }

4
publichealth/static/css/paper/_variables.scss
View file

@ -14,8 +14,8 @@ $gray: #666 !default;
$gray-light: #bbb !default; $gray-light: #bbb !default;
$gray-lighter: lighten($gray-base, 93.5%) !default; // #eee $gray-lighter: lighten($gray-base, 93.5%) !default; // #eee
$brand-primary: #968BDE !default; $brand-primary: #2643A9 !default;
$brand-secondary: #2643A9 !default; $brand-secondary: #968BDE !default;
$brand-success: #4CAF50 !default; $brand-success: #4CAF50 !default;
$brand-info: #9C27B0 !default; $brand-info: #9C27B0 !default;
$brand-warning: #ff9800 !default; $brand-warning: #ff9800 !default;

1
publichealth/static/js/min/main-min.js vendored Normal file
View file

@ -0,0 +1 @@
$(document).ready(function(){$("#myCarousel").carousel({interval:4e3});var a=!1;$("#myCarousel").on("click",".nav a",function(){a=!0,$(".nav li").removeClass("active"),$(this).parent().addClass("active")}).on("slid.bs.carousel",function(e){if(!a){var i=$(".nav").children().length-1,n=$(".nav li.active");n.removeClass("active").next().addClass("active");var s=parseInt(n.data("slide-to"));i==s&&$(".nav li").first().addClass("active")}a=!1})});

334
publichealth/static/mockup/assets/css/main.css
View file

@ -1411,11 +1411,11 @@ textarea {
} }
a { a {
color: #968BDE; color: #2643A9;
text-decoration: none; text-decoration: none;
} }
a:hover, a:focus { a:hover, a:focus {
color: #604fcd; color: #182a6b;
text-decoration: underline; text-decoration: underline;
} }
a:focus { a:focus {
@ -1640,12 +1640,12 @@ mark,
} }
.text-primary { .text-primary {
color: #968BDE; color: #2643A9;
} }
a.text-primary:hover, a.text-primary:hover,
a.text-primary:focus { a.text-primary:focus {
color: #7263d3; color: #1d327f;
} }
.text-success { .text-success {
@ -1689,12 +1689,12 @@ a.text-danger:focus {
} }
.bg-primary { .bg-primary {
background-color: #968BDE; background-color: #2643A9;
} }
a.bg-primary:hover, a.bg-primary:hover,
a.bg-primary:focus { a.bg-primary:focus {
background-color: #7263d3; background-color: #1d327f;
} }
.bg-success { .bg-success {
@ -3735,38 +3735,38 @@ a.btn.disabled, fieldset[disabled] a.btn {
.btn-primary { .btn-primary {
color: #fff; color: #fff;
background-color: #968BDE; background-color: #2643A9;
border-color: transparent; border-color: transparent;
} }
.btn-primary:focus, .btn-primary.focus { .btn-primary:focus, .btn-primary.focus {
color: #fff; color: #fff;
background-color: #7263d3; background-color: #1d327f;
border-color: transparent; border-color: transparent;
} }
.btn-primary:hover { .btn-primary:hover {
color: #fff; color: #fff;
background-color: #7263d3; background-color: #1d327f;
border-color: transparent; border-color: transparent;
} }
.btn-primary:active, .btn-primary.active, .open > .btn-primary.dropdown-toggle { .btn-primary:active, .btn-primary.active, .open > .btn-primary.dropdown-toggle {
color: #fff; color: #fff;
background-color: #7263d3; background-color: #1d327f;
border-color: transparent; border-color: transparent;
} }
.btn-primary:active:hover, .btn-primary:active:focus, .btn-primary:active.focus, .btn-primary.active:hover, .btn-primary.active:focus, .btn-primary.active.focus, .open > .btn-primary.dropdown-toggle:hover, .open > .btn-primary.dropdown-toggle:focus, .open > .btn-primary.dropdown-toggle.focus { .btn-primary:active:hover, .btn-primary:active:focus, .btn-primary:active.focus, .btn-primary.active:hover, .btn-primary.active:focus, .btn-primary.active.focus, .open > .btn-primary.dropdown-toggle:hover, .open > .btn-primary.dropdown-toggle:focus, .open > .btn-primary.dropdown-toggle.focus {
color: #fff; color: #fff;
background-color: #5948cb; background-color: #162762;
border-color: transparent; border-color: transparent;
} }
.btn-primary:active, .btn-primary.active, .open > .btn-primary.dropdown-toggle { .btn-primary:active, .btn-primary.active, .open > .btn-primary.dropdown-toggle {
background-image: none; background-image: none;
} }
.btn-primary.disabled:hover, .btn-primary.disabled:focus, .btn-primary.disabled.focus, .btn-primary[disabled]:hover, .btn-primary[disabled]:focus, .btn-primary[disabled].focus, fieldset[disabled] .btn-primary:hover, fieldset[disabled] .btn-primary:focus, fieldset[disabled] .btn-primary.focus { .btn-primary.disabled:hover, .btn-primary.disabled:focus, .btn-primary.disabled.focus, .btn-primary[disabled]:hover, .btn-primary[disabled]:focus, .btn-primary[disabled].focus, fieldset[disabled] .btn-primary:hover, fieldset[disabled] .btn-primary:focus, fieldset[disabled] .btn-primary.focus {
background-color: #968BDE; background-color: #2643A9;
border-color: transparent; border-color: transparent;
} }
.btn-primary .badge { .btn-primary .badge {
color: #968BDE; color: #2643A9;
background-color: #fff; background-color: #fff;
} }
@ -3919,7 +3919,7 @@ a.btn.disabled, fieldset[disabled] a.btn {
} }
.btn-link { .btn-link {
color: #968BDE; color: #2643A9;
font-weight: normal; font-weight: normal;
border-radius: 0; border-radius: 0;
} }
@ -3932,7 +3932,7 @@ a.btn.disabled, fieldset[disabled] a.btn {
border-color: transparent; border-color: transparent;
} }
.btn-link:hover, .btn-link:focus { .btn-link:hover, .btn-link:focus {
color: #604fcd; color: #182a6b;
text-decoration: underline; text-decoration: underline;
background-color: transparent; background-color: transparent;
} }
@ -4086,7 +4086,7 @@ tbody.collapse.in {
color: #fff; color: #fff;
text-decoration: none; text-decoration: none;
outline: 0; outline: 0;
background-color: #968BDE; background-color: #2643A9;
} }
.dropdown-menu > .disabled > a, .dropdown-menu > .disabled > a:hover, .dropdown-menu > .disabled > a:focus { .dropdown-menu > .disabled > a, .dropdown-menu > .disabled > a:hover, .dropdown-menu > .disabled > a:focus {
@ -4529,7 +4529,7 @@ tbody.collapse.in {
} }
.nav .open > a, .nav .open > a:hover, .nav .open > a:focus { .nav .open > a, .nav .open > a:hover, .nav .open > a:focus {
background-color: #eeeeee; background-color: #eeeeee;
border-color: #968BDE; border-color: #2643A9;
} }
.nav .nav-divider { .nav .nav-divider {
height: 1px; height: 1px;
@ -4576,7 +4576,7 @@ tbody.collapse.in {
} }
.nav-pills > li.active > a, .nav-pills > li.active > a:hover, .nav-pills > li.active > a:focus { .nav-pills > li.active > a, .nav-pills > li.active > a:hover, .nav-pills > li.active > a:focus {
color: #fff; color: #fff;
background-color: #968BDE; background-color: #2643A9;
} }
.nav-stacked > li { .nav-stacked > li {
@ -5092,11 +5092,11 @@ tbody.collapse.in {
} }
.navbar-inverse { .navbar-inverse {
background-color: #968BDE; background-color: #2643A9;
border-color: transparent; border-color: transparent;
} }
.navbar-inverse .navbar-brand { .navbar-inverse .navbar-brand {
color: white; color: #859ae3;
} }
.navbar-inverse .navbar-brand:hover, .navbar-inverse .navbar-brand:focus { .navbar-inverse .navbar-brand:hover, .navbar-inverse .navbar-brand:focus {
color: #fff; color: #fff;
@ -5106,7 +5106,7 @@ tbody.collapse.in {
color: #bbb; color: #bbb;
} }
.navbar-inverse .navbar-nav > li > a { .navbar-inverse .navbar-nav > li > a {
color: white; color: #859ae3;
} }
.navbar-inverse .navbar-nav > li > a:hover, .navbar-inverse .navbar-nav > li > a:focus { .navbar-inverse .navbar-nav > li > a:hover, .navbar-inverse .navbar-nav > li > a:focus {
color: #fff; color: #fff;
@ -5114,7 +5114,7 @@ tbody.collapse.in {
} }
.navbar-inverse .navbar-nav > .active > a, .navbar-inverse .navbar-nav > .active > a:hover, .navbar-inverse .navbar-nav > .active > a:focus { .navbar-inverse .navbar-nav > .active > a, .navbar-inverse .navbar-nav > .active > a:hover, .navbar-inverse .navbar-nav > .active > a:focus {
color: #fff; color: #fff;
background-color: #7263d3; background-color: #1d327f;
} }
.navbar-inverse .navbar-nav > .disabled > a, .navbar-inverse .navbar-nav > .disabled > a:hover, .navbar-inverse .navbar-nav > .disabled > a:focus { .navbar-inverse .navbar-nav > .disabled > a, .navbar-inverse .navbar-nav > .disabled > a:hover, .navbar-inverse .navbar-nav > .disabled > a:focus {
color: #444; color: #444;
@ -5131,10 +5131,10 @@ tbody.collapse.in {
} }
.navbar-inverse .navbar-collapse, .navbar-inverse .navbar-collapse,
.navbar-inverse .navbar-form { .navbar-inverse .navbar-form {
border-color: #7d6fd6; border-color: #1f378c;
} }
.navbar-inverse .navbar-nav > .open > a, .navbar-inverse .navbar-nav > .open > a:hover, .navbar-inverse .navbar-nav > .open > a:focus { .navbar-inverse .navbar-nav > .open > a, .navbar-inverse .navbar-nav > .open > a:hover, .navbar-inverse .navbar-nav > .open > a:focus {
background-color: #7263d3; background-color: #1d327f;
color: #fff; color: #fff;
} }
@media (max-width: 767px) { @media (max-width: 767px) {
@ -5145,7 +5145,7 @@ tbody.collapse.in {
background-color: transparent; background-color: transparent;
} }
.navbar-inverse .navbar-nav .open .dropdown-menu > li > a { .navbar-inverse .navbar-nav .open .dropdown-menu > li > a {
color: white; color: #859ae3;
} }
.navbar-inverse .navbar-nav .open .dropdown-menu > li > a:hover, .navbar-inverse .navbar-nav .open .dropdown-menu > li > a:focus { .navbar-inverse .navbar-nav .open .dropdown-menu > li > a:hover, .navbar-inverse .navbar-nav .open .dropdown-menu > li > a:focus {
color: #fff; color: #fff;
@ -5153,7 +5153,7 @@ tbody.collapse.in {
} }
.navbar-inverse .navbar-nav .open .dropdown-menu > .active > a, .navbar-inverse .navbar-nav .open .dropdown-menu > .active > a:hover, .navbar-inverse .navbar-nav .open .dropdown-menu > .active > a:focus { .navbar-inverse .navbar-nav .open .dropdown-menu > .active > a, .navbar-inverse .navbar-nav .open .dropdown-menu > .active > a:hover, .navbar-inverse .navbar-nav .open .dropdown-menu > .active > a:focus {
color: #fff; color: #fff;
background-color: #7263d3; background-color: #1d327f;
} }
.navbar-inverse .navbar-nav .open .dropdown-menu > .disabled > a, .navbar-inverse .navbar-nav .open .dropdown-menu > .disabled > a:hover, .navbar-inverse .navbar-nav .open .dropdown-menu > .disabled > a:focus { .navbar-inverse .navbar-nav .open .dropdown-menu > .disabled > a, .navbar-inverse .navbar-nav .open .dropdown-menu > .disabled > a:hover, .navbar-inverse .navbar-nav .open .dropdown-menu > .disabled > a:focus {
color: #444; color: #444;
@ -5161,13 +5161,13 @@ tbody.collapse.in {
} }
} }
.navbar-inverse .navbar-link { .navbar-inverse .navbar-link {
color: white; color: #859ae3;
} }
.navbar-inverse .navbar-link:hover { .navbar-inverse .navbar-link:hover {
color: #fff; color: #fff;
} }
.navbar-inverse .btn-link { .navbar-inverse .btn-link {
color: white; color: #859ae3;
} }
.navbar-inverse .btn-link:hover, .navbar-inverse .btn-link:focus { .navbar-inverse .btn-link:hover, .navbar-inverse .btn-link:focus {
color: #fff; color: #fff;
@ -5211,7 +5211,7 @@ tbody.collapse.in {
padding: 6px 16px; padding: 6px 16px;
line-height: 1.846; line-height: 1.846;
text-decoration: none; text-decoration: none;
color: #968BDE; color: #2643A9;
background-color: #fff; background-color: #fff;
border: 1px solid #ddd; border: 1px solid #ddd;
margin-left: -1px; margin-left: -1px;
@ -5231,7 +5231,7 @@ tbody.collapse.in {
.pagination > li > span:hover, .pagination > li > span:hover,
.pagination > li > span:focus { .pagination > li > span:focus {
z-index: 2; z-index: 2;
color: #604fcd; color: #182a6b;
background-color: #eeeeee; background-color: #eeeeee;
border-color: #ddd; border-color: #ddd;
} }
@ -5241,8 +5241,8 @@ tbody.collapse.in {
.pagination > .active > span:focus { .pagination > .active > span:focus {
z-index: 3; z-index: 3;
color: #fff; color: #fff;
background-color: #968BDE; background-color: #2643A9;
border-color: #968BDE; border-color: #2643A9;
cursor: default; cursor: default;
} }
.pagination > .disabled > span, .pagination > .disabled > span,
@ -5371,10 +5371,10 @@ a.label:hover, a.label:focus {
} }
.label-primary { .label-primary {
background-color: #968BDE; background-color: #2643A9;
} }
.label-primary[href]:hover, .label-primary[href]:focus { .label-primary[href]:hover, .label-primary[href]:focus {
background-color: #7263d3; background-color: #1d327f;
} }
.label-success { .label-success {
@ -5431,7 +5431,7 @@ a.label:hover, a.label:focus {
padding: 1px 5px; padding: 1px 5px;
} }
.list-group-item.active > .badge, .nav-pills > .active > a > .badge { .list-group-item.active > .badge, .nav-pills > .active > a > .badge {
color: #968BDE; color: #2643A9;
background-color: #fff; background-color: #fff;
} }
.list-group-item > .badge { .list-group-item > .badge {
@ -5520,7 +5520,7 @@ a.badge:hover, a.badge:focus {
a.thumbnail:hover, a.thumbnail:hover,
a.thumbnail:focus, a.thumbnail:focus,
a.thumbnail.active { a.thumbnail.active {
border-color: #968BDE; border-color: #2643A9;
} }
.alert { .alert {
@ -5638,7 +5638,7 @@ a.thumbnail.active {
line-height: 36px; line-height: 36px;
color: #fff; color: #fff;
text-align: center; text-align: center;
background-color: #968BDE; background-color: #2643A9;
-webkit-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15); -webkit-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);
box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15); box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);
-webkit-transition: width 0.6s ease; -webkit-transition: width 0.6s ease;
@ -5814,8 +5814,8 @@ button.list-group-item {
.list-group-item.active, .list-group-item.active:hover, .list-group-item.active:focus { .list-group-item.active, .list-group-item.active:hover, .list-group-item.active:focus {
z-index: 2; z-index: 2;
color: #fff; color: #fff;
background-color: #968BDE; background-color: #2643A9;
border-color: #968BDE; border-color: #2643A9;
} }
.list-group-item.active .list-group-item-heading, .list-group-item.active .list-group-item-heading,
.list-group-item.active .list-group-item-heading > small, .list-group-item.active .list-group-item-heading > small,
@ -5827,7 +5827,7 @@ button.list-group-item {
color: inherit; color: inherit;
} }
.list-group-item.active .list-group-item-text, .list-group-item.active:hover .list-group-item-text, .list-group-item.active:focus .list-group-item-text { .list-group-item.active .list-group-item-text, .list-group-item.active:hover .list-group-item-text, .list-group-item.active:focus .list-group-item-text {
color: white; color: #aebced;
} }
.list-group-item-success { .list-group-item-success {
@ -6224,22 +6224,22 @@ button.list-group-item-danger.active:focus {
} }
.panel-primary { .panel-primary {
border-color: #968BDE; border-color: #2643A9;
} }
.panel-primary > .panel-heading { .panel-primary > .panel-heading {
color: #fff; color: #fff;
background-color: #968BDE; background-color: #2643A9;
border-color: #968BDE; border-color: #2643A9;
} }
.panel-primary > .panel-heading + .panel-collapse > .panel-body { .panel-primary > .panel-heading + .panel-collapse > .panel-body {
border-top-color: #968BDE; border-top-color: #2643A9;
} }
.panel-primary > .panel-heading .badge { .panel-primary > .panel-heading .badge {
color: #968BDE; color: #2643A9;
background-color: #fff; background-color: #fff;
} }
.panel-primary > .panel-footer + .panel-collapse > .panel-body { .panel-primary > .panel-footer + .panel-collapse > .panel-body {
border-bottom-color: #968BDE; border-bottom-color: #2643A9;
} }
.panel-success { .panel-success {
@ -7346,21 +7346,21 @@ button.close {
.navbar-inverse .navbar-form input[type=text], .navbar-inverse .navbar-form input[type=text],
.navbar-inverse .navbar-form input[type=password] { .navbar-inverse .navbar-form input[type=password] {
color: #fff; color: #fff;
-webkit-box-shadow: inset 0 -1px 0 white; -webkit-box-shadow: inset 0 -1px 0 #859ae3;
box-shadow: inset 0 -1px 0 white; box-shadow: inset 0 -1px 0 #859ae3;
} }
.navbar-inverse .navbar-form input[type=text]::-moz-placeholder, .navbar-inverse .navbar-form input[type=text]::-moz-placeholder,
.navbar-inverse .navbar-form input[type=password]::-moz-placeholder { .navbar-inverse .navbar-form input[type=password]::-moz-placeholder {
color: white; color: #859ae3;
opacity: 1; opacity: 1;
} }
.navbar-inverse .navbar-form input[type=text]:-ms-input-placeholder, .navbar-inverse .navbar-form input[type=text]:-ms-input-placeholder,
.navbar-inverse .navbar-form input[type=password]:-ms-input-placeholder { .navbar-inverse .navbar-form input[type=password]:-ms-input-placeholder {
color: white; color: #859ae3;
} }
.navbar-inverse .navbar-form input[type=text]::-webkit-input-placeholder, .navbar-inverse .navbar-form input[type=text]::-webkit-input-placeholder,
.navbar-inverse .navbar-form input[type=password]::-webkit-input-placeholder { .navbar-inverse .navbar-form input[type=password]::-webkit-input-placeholder {
color: white; color: #859ae3;
} }
.navbar-inverse .navbar-form input[type=text]:focus, .navbar-inverse .navbar-form input[type=text]:focus,
.navbar-inverse .navbar-form input[type=password]:focus { .navbar-inverse .navbar-form input[type=password]:focus {
@ -7393,15 +7393,15 @@ button.close {
background-position: 50%; background-position: 50%;
} }
.btn-primary:focus { .btn-primary:focus {
background-color: #968BDE; background-color: #2643A9;
} }
.btn-primary:hover, .btn-primary:active:hover { .btn-primary:hover, .btn-primary:active:hover {
background-color: #8073d7; background-color: #203990;
} }
.btn-primary:active { .btn-primary:active {
background-color: #6b5bd0; background-color: #1b2f77;
background-image: -webkit-radial-gradient(circle, #6b5bd0 10%, #968BDE 11%); background-image: -webkit-radial-gradient(circle, #1b2f77 10%, #2643A9 11%);
background-image: radial-gradient(circle, #6b5bd0 10%, #968BDE 11%); background-image: radial-gradient(circle, #1b2f77 10%, #2643A9 11%);
background-repeat: no-repeat; background-repeat: no-repeat;
background-size: 1000% 1000%; background-size: 1000% 1000%;
-webkit-box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.4); -webkit-box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.4);
@ -7613,8 +7613,8 @@ input[type=number]:focus,
[type=email].form-control:focus, [type=email].form-control:focus,
[type=tel].form-control:focus, [type=tel].form-control:focus,
[contenteditable].form-control:focus { [contenteditable].form-control:focus {
-webkit-box-shadow: inset 0 -2px 0 #968BDE; -webkit-box-shadow: inset 0 -2px 0 #2643A9;
box-shadow: inset 0 -2px 0 #968BDE; box-shadow: inset 0 -2px 0 #2643A9;
} }
textarea[disabled], textarea[readonly], textarea[disabled], textarea[readonly],
textarea.form-control[disabled], textarea.form-control[disabled],
@ -7768,8 +7768,8 @@ select.form-control.input-lg,
} }
select:focus, select:focus,
select.form-control:focus { select.form-control:focus {
-webkit-box-shadow: inset 0 -2px 0 #968BDE; -webkit-box-shadow: inset 0 -2px 0 #2643A9;
box-shadow: inset 0 -2px 0 #968BDE; box-shadow: inset 0 -2px 0 #2643A9;
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABoAAAAaCAMAAACelLz8AAAAJ1BMVEUhISEhISEhISEhISEhISEhISEhISEhISEhISEhISEhISEhISEhISF8S9ewAAAADHRSTlMAAgMJC0uWpKa6wMxMdjkoAAAANUlEQVR4AeXJyQEAERAAsNl7Hf3X6xt0QL6JpZWq30pdvdadme+0PMdzvHm8YThHcT1H7K0BtOMDniZhWOgAAAAASUVORK5CYII=); background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABoAAAAaCAMAAACelLz8AAAAJ1BMVEUhISEhISEhISEhISEhISEhISEhISEhISEhISEhISEhISEhISEhISF8S9ewAAAADHRSTlMAAgMJC0uWpKa6wMxMdjkoAAAANUlEQVR4AeXJyQEAERAAsNl7Hf3X6xt0QL6JpZWq30pdvdadme+0PMdzvHm8YThHcT1H7K0BtOMDniZhWOgAAAAASUVORK5CYII=);
} }
select[multiple], select[multiple],
@ -7832,7 +7832,7 @@ input[type="radio"]:before,
position: absolute; position: absolute;
left: 0; left: 0;
top: -3px; top: -3px;
background-color: #968BDE; background-color: #2643A9;
-webkit-transform: scale(0); -webkit-transform: scale(0);
-ms-transform: scale(0); -ms-transform: scale(0);
-o-transform: scale(0); -o-transform: scale(0);
@ -7861,7 +7861,7 @@ input[type="radio"]:disabled:checked:before,
input[type="radio"]:checked:after, input[type="radio"]:checked:after,
.radio input[type="radio"]:checked:after, .radio input[type="radio"]:checked:after,
.radio-inline input[type="radio"]:checked:after { .radio-inline input[type="radio"]:checked:after {
border-color: #968BDE; border-color: #2643A9;
} }
input[type="radio"]:disabled:after, input[type="radio"]:disabled:checked:after, input[type="radio"]:disabled:after, input[type="radio"]:disabled:checked:after,
.radio input[type="radio"]:disabled:after, .radio input[type="radio"]:disabled:after,
@ -7889,7 +7889,7 @@ input[type="checkbox"]:focus,
input[type="checkbox"]:focus:after, input[type="checkbox"]:focus:after,
.checkbox input[type="checkbox"]:focus:after, .checkbox input[type="checkbox"]:focus:after,
.checkbox-inline input[type="checkbox"]:focus:after { .checkbox-inline input[type="checkbox"]:focus:after {
border-color: #968BDE; border-color: #2643A9;
} }
input[type="checkbox"]:after, input[type="checkbox"]:after,
.checkbox input[type="checkbox"]:after, .checkbox input[type="checkbox"]:after,
@ -7927,8 +7927,8 @@ input[type="checkbox"]:checked:before,
input[type="checkbox"]:checked:after, input[type="checkbox"]:checked:after,
.checkbox input[type="checkbox"]:checked:after, .checkbox input[type="checkbox"]:checked:after,
.checkbox-inline input[type="checkbox"]:checked:after { .checkbox-inline input[type="checkbox"]:checked:after {
background-color: #968BDE; background-color: #2643A9;
border-color: #968BDE; border-color: #2643A9;
} }
input[type="checkbox"]:disabled:after, input[type="checkbox"]:disabled:after,
.checkbox input[type="checkbox"]:disabled:after, .checkbox input[type="checkbox"]:disabled:after,
@ -8004,19 +8004,19 @@ input[type="checkbox"]:disabled:checked:after,
.nav-tabs > li > a:hover, .nav-tabs > li > a:hover,
.nav-tabs > li > a:focus:hover { .nav-tabs > li > a:focus:hover {
background-color: transparent; background-color: transparent;
-webkit-box-shadow: inset 0 -2px 0 #968BDE; -webkit-box-shadow: inset 0 -2px 0 #2643A9;
box-shadow: inset 0 -2px 0 #968BDE; box-shadow: inset 0 -2px 0 #2643A9;
color: #968BDE; color: #2643A9;
} }
.nav-tabs > li.active > a, .nav-tabs > li.active > a:focus { .nav-tabs > li.active > a, .nav-tabs > li.active > a:focus {
border: none; border: none;
-webkit-box-shadow: inset 0 -2px 0 #968BDE; -webkit-box-shadow: inset 0 -2px 0 #2643A9;
box-shadow: inset 0 -2px 0 #968BDE; box-shadow: inset 0 -2px 0 #2643A9;
color: #968BDE; color: #2643A9;
} }
.nav-tabs > li.active > a:hover, .nav-tabs > li.active > a:focus:hover { .nav-tabs > li.active > a:hover, .nav-tabs > li.active > a:focus:hover {
border: none; border: none;
color: #968BDE; color: #2643A9;
} }
.nav-tabs > li.disabled > a { .nav-tabs > li.disabled > a {
-webkit-box-shadow: inset 0 -1px 0 #ddd; -webkit-box-shadow: inset 0 -1px 0 #ddd;
@ -8089,7 +8089,7 @@ input[type="checkbox"]:disabled:checked:after,
left: 0; left: 0;
right: 0; right: 0;
z-index: -1; z-index: -1;
background-color: white; background-color: #99abe8;
} }
.progress-bar-success:last-child.progress-bar:before { .progress-bar-success:last-child.progress-bar:before {
background-color: #c7e7c8; background-color: #c7e7c8;
@ -8153,24 +8153,48 @@ input[type="checkbox"]:disabled:checked:after,
color: inherit; color: inherit;
} }
.navbar-default.navbar-pre { .navbar-pre {
background-color: #968BDE; background-color: #2643A9;
height: 40px;
} }
.navbar-default.navbar-pre .navbar-text, .navbar-default.navbar-pre li a { .navbar-pre .nav {
margin: 5px 15px; text-align: right;
}
.navbar-pre .nav a {
color: white; color: white;
font-size: 70%; padding: 10px;
line-height: 40px;
vertical-align: middle;
} }
.navbar-default.navbar-pre li { .navbar-pre .nav .contact-nav {
margin: 0 5px; margin-right: 1em;
padding: 0;
} }
.navbar-default.navbar-pre li a { .navbar-pre .nav .contact-nav a {
margin: 0 5px;
font-size: .7em;
}
.navbar-pre .nav .contact-nav a.link {
text-transform: uppercase;
}
.navbar-pre .nav .language-nav {
text-transform: uppercase;
}
.navbar-pre .nav .language-nav a {
margin: 0; margin: 0;
padding: 0 10px;
} }
.navbar-pre .nav .language-nav a.active, .navbar-pre .nav .language-nav a:hover {
background-color: white;
color: #2643A9;
}
@media only screen and (max-width: 767px) {
.navbar-pre .nav .contact-nav a {
font-size: .9em;
padding: 10px 5px;
}
}
.navbar-default.navbar-main { .navbar-default.navbar-main {
top: 35px; top: 40px;
} }
.navbar-default .navbar-header .navbar-brand { .navbar-default .navbar-header .navbar-brand {
text-transform: uppercase; text-transform: uppercase;
@ -8184,7 +8208,84 @@ input[type="checkbox"]:disabled:checked:after,
margin-right: .5em; margin-right: .5em;
} }
#myCarousel {
background: #eeeeee;
}
#myCarousel .item {
background-color: #3155d1;
min-height: 300px;
}
#myCarousel .item img {
height: 300px;
background-size: cover;
background-position: center;
width: 100%;
}
#myCarousel .item h3 {
text-transform: uppercase;
font-weight: 300;
}
#myCarousel .item p {
line-height: 1.2;
width: 80%;
margin: 0 auto;
}
#myCarousel .item .btn {
margin-top: 20px;
}
#myCarousel .nav-thumbs {
list-style: none;
display: flex;
margin: 0;
padding: 0;
text-align: center;
}
#myCarousel .nav-thumbs li {
float: left;
width: 25%;
}
#myCarousel .nav-thumbs li.active {
background-color: #2643A9;
}
#myCarousel .nav-thumbs li.active a {
color: white;
}
#myCarousel .nav-thumbs li .glyphicon {
display: block;
}
#myCarousel .nav-thumbs .title {
text-transform: uppercase;
font-weight: 300;
text-decoration: none;
width: 100%;
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
}
#myCarousel .nav-thumbs .title small {
font-weight: 500;
text-transform: none;
display: block;
font-size: .7em;
width: 100%;
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
}
#myCarousel .nav-thumbs.nav-justified > li > a {
border-radius: 0px;
}
@media only screen and (max-width: 767px) {
#myCarousel .nav-thumbs .title {
font-size: .7em;
}
}
/* Page header */ /* Page header */
#carousel-banner {
display: none;
}
#banner, #carousel-banner { #banner, #carousel-banner {
padding-top: 0 !important; padding-top: 0 !important;
padding-bottom: 0em; padding-bottom: 0em;
@ -8315,25 +8416,60 @@ footer#footer a {
} }
#news .panel-default { #news .panel-default {
position: relative;
font-size: 90%; font-size: 90%;
transition: transform .6s; padding-top: 75%;
/* 1:1 Aspect Ratio */
position: relative;
/* If you want text inside of it */
overflow: hidden;
background: #3155d1;
} }
#news .panel-default:hover { #news .panel-default img {
transform: scale(1.05); position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
} }
#news .panel-default .panel-header img { #news .panel-default .panel-body {
max-width: 100%; position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
padding: 0;
transform: translateY(60%);
background-color: rgba(38, 67, 169, 0.8);
transition: transform .65s;
}
#news .panel-default .panel-body h3, #news .panel-default .panel-body p {
color: white;
}
#news .panel-default .panel-body h3 {
padding: 15px;
font-size: 1.2em;
margin: 0;
height: 40%;
display: table;
}
#news .panel-default .panel-body h3 span {
display: table-cell;
vertical-align: bottom;
}
#news .panel-default .panel-body p, #news .panel-default .panel-body a {
font-size: .8em;
}
#news .panel-default .panel-body p {
padding: 0 15px;
line-height: 1.2;
margin: 0;
} }
#news .panel-default .panel-body a { #news .panel-default .panel-body a {
position: relative; margin: 10px 0 0 15px;
font-size: 80%; text-align: center;
z-index: 2;
} }
#news .panel-default .panel-footer { #news .panel-default:hover .panel-body {
font-size: 80%; transform: rotateY(0);
text-transform: uppercase;
color: gray;
} }
#news .panel-default a.fill { #news .panel-default a.fill {
position: absolute; position: absolute;
@ -8341,7 +8477,7 @@ footer#footer a {
left: 0; left: 0;
width: 100%; width: 100%;
height: 100%; height: 100%;
z-index: 1; font-size: 0;
} }
#news-details { #news-details {
@ -8378,7 +8514,7 @@ footer#footer a {
} }
body { body {
margin-top: 64px; margin-top: 104px;
} }
section { section {

BIN
publichealth/static/mockup/images/thumb_news_1.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 101 KiB

BIN
publichealth/static/mockup/images/thumb_news_2.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 51 KiB

138
publichealth/static/mockup/index.html
View file

@ -12,17 +12,19 @@
<body> <body>
<!-- Header --> <!-- Header -->
<nav class="navbar navbar-default navbar-pre navbar-fixed-top"> <nav class="navbar-pre navbar-fixed-top">
<div class="container"> <div class="container">
<div class="navbar-collapse"> <div class="nav">
<ul class="nav navbar-nav navbar-right"> <span class="contact-nav">
<li><a href="#">Kontakt</a></li> <a class="link" href="#">Kontakt</a>
<p class="navbar-text"><span class="glyphicon glyphicon-earphone" aria-hidden="true"></span> +41 31 389 92 86</p> <a href="#"><span class="glyphicon glyphicon-earphone" aria-hidden="true"></span> <span class="hidden-xs">+41 31 389 92 86</span></a>
<p class="navbar-text"><span class="glyphicon glyphicon-envelope" aria-hidden="true"></span> info@public-health.ch</p> <a href="#"><span class="glyphicon glyphicon-envelope" aria-hidden="true"></span> <span class="hidden-xs">info@public-health.ch</span></a>
<li class="active"><a href="#">De</a></li> </span>
<li><a href="#">Fr</a></li> <span class="language-nav">
</ul> <a class="active "href="#">De</a>
</div> <a href="#">Fr</a>
</span>
</div>
</div> </div>
</nav> </nav>
<nav class="navbar navbar-default navbar-main navbar-fixed-top"> <nav class="navbar navbar-default navbar-main navbar-fixed-top">
@ -70,6 +72,62 @@
<!-- /.container --> <!-- /.container -->
</nav> </nav>
<div id="myCarousel" class="carousel slide" data-ride="carousel">
<!-- Wrapper for slides -->
<div class="carousel-inner">
<div class="item active">
<image style="background-image:url(images/banner_0.jpg)" />
<div class="carousel-caption">
<h3>
Swiss Public Health Conference</h3>
<p class="hidden-xs">Die Swiss Public Health Conference 2016 ist erfolgreich zu Ende gegangen. Wir bedanken uns bei Ihnen an dieser Stelle für Ihre engagierte Teilnahme und die vielen angeregten Gespräche während der Konferenz.</p>
<a href="#" class="btn btn-default">Mehr Infos</a>
</div>
</div>
<!-- End Item -->
<div class="item">
<div class="carousel-caption">
<h3>Projekte & Aktivitäten</h3>
<p class="hidden-xs">Public Health Schweiz will Prävention und Gesundheitsförderung stärken. Durch unsere Aktionen und Stellungsnahmen treten wir für dieses Ziel ein und stehen damit immer im Zentrum der Aktualität:</p>
<a href="#" class="btn btn-default">Mehr Infos</a>
</div>
</div>
<!-- End Item -->
<div class="item">
<div class="carousel-caption">
<h3>
Über uns</h3>
<p class="hidden-xs">Public Health Schweiz ist der Fachverband der Public-Health-Fachleute. Er vertritt die Anliegen seiner Mitglieder und unterstützt die Entscheidungsträgerinnen und Entscheidungsträger fachlich</p>
<a href="#" class="btn btn-default">Mehr Infos</a>
</div>
</div>
<!-- End Item -->
<div class="item">
<image style="background-image:url(images/banner_4.jpg)" />
<div class="carousel-caption">
<h3>
Mitgliedschaft</h3>
<p class="hidden-xs">Werden Sie jetzt Mitglied von Public Health Schweiz und profitieren Sie von vielen Vorteilen und Vergünstigungen. Als Mitglied tragen Sie zudem dazu bei, dass sich Public Health Schweiz weiterhin für die Anliegen der Public-Health-Fachleute einsetzen kann.</p>
<a href="#" class="btn btn-default">Mehr Infos</a>
</div>
</div>
<!-- End Item -->
</div>
<!-- End Carousel Inner -->
<div class="container">
<ul class="nav nav-thumbs">
<li data-target="#myCarousel" data-slide-to="0" class="active"><a href="#"><span class="glyphicon glyphicon-calendar" aria-hidden="true"></span>&nbsp;<span class="title">Aktuell<small class="hidden-xs">Swiss Public Health Conference</small></span></a></li>
<li data-target="#myCarousel" data-slide-to="1"><a href="#"><span class="glyphicon glyphicon-flag" aria-hidden="true"></span>&nbsp;<span class="title">Projekte<small class="hidden-xs">Prävention und Gesundheitsförderung</small></span></a></li>
<li data-target="#myCarousel" data-slide-to="2"><a href="#"><span class="glyphicon glyphicon-info-sign" aria-hidden="true"></span>&nbsp;<span class="title">Über uns<small class="hidden-xs">Informationen zu Public Health</small></span></a></li>
<li data-target="#myCarousel" data-slide-to="3"><a href="#"><span class="glyphicon glyphicon-user" aria-hidden="true"></span>&nbsp;<span class="title">Mitgliedschaft<small class="hidden-xs">Werden Sie jetzt Mitglied</small></span></a></li>
</ul>
</div>
</div>
<!-- End Carousel -->
<!-- Banner --> <!-- Banner -->
<div id="carousel-banner" class="slide"> <div id="carousel-banner" class="slide">
@ -124,40 +182,36 @@
<section id="news"> <section id="news">
<div class="container"> <div class="container">
<h2>News</h2>
<div class="row"> <div class="row">
<div class="col-sm-4"> <div class="col-md-4 col-sm-6 col-xs-12">
<div class="panel panel-default"> <div class="panel panel-default">
<div class="panel-header"> <img src="images/thumb_news_1.jpg" alt="">
<img src="images/news_1.jpg" alt="">
</div>
<div class="panel-body"> <div class="panel-body">
<p>Ehrenmitgliedschaften</p> <h3><span>Ehrenmitgliedschaften</span></h3>
<p><a href="/news-details.html" class="btn btn-primary btn-xs">Mehr erfahren</a></p> <p>Nicole Probst-Hensch, Professorin für Pharmakologie und Epidemiologie am Schweizerischen Tropen- und Public Health Institut der Universität Basel, wurde die Ehrenmitgliedschaft von Public Health Schweiz verliehen.</p>
</div> <a href="/news-details.html" class="btn btn-default btn-xs">Mehr erfahren</a>
<div class="panel-footer">
<span class="glyphicon glyphicon-tags" aria-hidden="true"></span> Kategorie 1, Kategorie 2
</div> </div>
<a href="/news-details.html" class="fill"></a> <a href="/news-details.html" class="fill"></a>
</div> </div>
</div> </div>
<div class="col-sm-4"> <div class="col-md-4 col-sm-6 col-xs-12">
<div class="panel panel-default"> <div class="panel panel-default">
<div class="panel-header"> <img src="images/thumb_news_2.jpg" alt="">
<img src="images/banner_0.jpg" alt="">
</div>
<div class="panel-body"> <div class="panel-body">
<p>Parlamentarische Gruppe nichtübertragbare Krankheiten NCD gegründet</p>
<p><a href="#" class="btn btn-primary btn-xs">Mehr erfahren</a></p> <h3><span>Parlamentarische Gruppe nichtübertragbare Krankheiten NCD gegründet</span></h3>
<a href="/news-details.html" class="btn btn-default btn-xs">Mehr erfahren</a>
</div> </div>
<a href="/news-details.html" class="fill"></a> <a href="/news-details.html" class="fill"></a>
</div> </div>
</div> </div>
<div class="col-sm-4"> <div class="col-md-4 col-sm-6 col-xs-12">
<div class="panel panel-default"> <div class="panel panel-default">
<div class="img-crop"></div>
<div class="panel-body"> <div class="panel-body">
<p>Wirksamer Schutz der Kinder und Jugendlichen vor Tabakkonsum rückt in weite Ferne</p> <h3><span>Wirksamer Schutz der Kinder und Jugendlichen vor Tabakkonsum rückt in weite Ferne<span></h3>
<p><a href="#" class="btn btn-primary btn-xs">Mehr erfahren</a></p> <a href="/news-details.html" class="btn btn-default btn-xs">Mehr erfahren</a>
</div> </div>
<a href="/news-details.html" class="fill"></a> <a href="/news-details.html" class="fill"></a>
</div> </div>
@ -284,6 +338,32 @@
<script src="assets/slick/slick.min.js"></script> <script src="assets/slick/slick.min.js"></script>
<script> <script>
$(document).ready( function() {
$('#myCarousel').carousel({
interval: 10000
});
var clickEvent = false;
$('#myCarousel').on('click', '.nav a', function() {
clickEvent = true;
$('.nav li').removeClass('active');
$(this).parent().addClass('active');
}).on('slid.bs.carousel', function(e) {
if(!clickEvent) {
var count = $('.nav').children().length -1;
var current = $('.nav li.active');
current.removeClass('active').next().addClass('active');
var id = parseInt(current.data('slide-to'));
if(count == id) {
$('.nav li').first().addClass('active');
}
}
clickEvent = false;
});
});
$('.carousel-inner.slick').slick({ $('.carousel-inner.slick').slick({
autoplay: true, autoplay: true,
autoplaySpeed: '10000', autoplaySpeed: '10000',

22
publichealth/static/mockup/news-details.html
View file

@ -12,17 +12,19 @@
<body> <body>
<!-- Header --> <!-- Header -->
<nav class="navbar navbar-default navbar-pre navbar-fixed-top"> <nav class="navbar-pre navbar-fixed-top">
<div class="container"> <div class="container">
<div class="navbar-collapse"> <div class="nav">
<ul class="nav navbar-nav navbar-right"> <span class="contact-nav">
<li><a href="#">Kontakt</a></li> <a class="link" href="#">Kontakt</a>
<p class="navbar-text"><span class="glyphicon glyphicon-earphone" aria-hidden="true"></span> +41 31 389 92 86</p> <a href="#"><span class="glyphicon glyphicon-earphone" aria-hidden="true"></span> <span class="hidden-xs">+41 31 389 92 86</span></a>
<p class="navbar-text"><span class="glyphicon glyphicon-envelope" aria-hidden="true"></span> info@public-health.ch</p> <a href="#"><span class="glyphicon glyphicon-envelope" aria-hidden="true"></span> <span class="hidden-xs">info@public-health.ch</span></a>
<li class="active"><a href="#">De</a></li> </span>
<li><a href="#">Fr</a></li> <span class="language-nav">
</ul> <a class="active "href="#">De</a>
</div> <a href="#">Fr</a>
</span>
</div>
</div> </div>
</nav> </nav>
<nav class="navbar navbar-default navbar-main navbar-fixed-top"> <nav class="navbar navbar-default navbar-main navbar-fixed-top">