Commit 93f902cc authored by Olga Brani's avatar Olga Brani
Browse files

Update theme

- Change font
- Style changes
parent 98e2fe38
......@@ -6,15 +6,15 @@
/* cloudbar header */
div.cloudbar { background:#000; color:#fff; line-height:35px; width:100%; font-size:13px; font-family:Antic,Arial,sans-serif;}
div.cloudbar { background:#000; color:#fff; line-height:35px; width:100%; font-size:13px; font-family: 'Didact Gothic', Verdana, sans-serif;}
.cloudbar .wrapper { width:auto; padding:0;}
.cloudbar a { color:#fff; text-decoration:none;}
.cloudbar .profile { float:right; background:#01A1AE; min-width:190px; padding:0; text-align:right; }
.cloudbar .profile:hover { background:#41b9c2; }
.cloudbar .profile { float:right; background:#3582AC; min-width:190px; padding:0; text-align:right; }
.cloudbar .profile:hover { background:#5A97B8; }
.cloudbar .profile a { text-decoration:none; color:#fff; display:block; width:100%;}
.cloudbar .profile ul { position:absolute; right:0; top:35px; padding:0; margin:0; width:190px; display:none; z-index:9; background:#fff;}
.cloudbar .profile ul li { list-style:none outside; line-height:35px; padding:0 20px;}
.cloudbar .profile ul li:hover a { color:#01A1AE;}
.cloudbar .profile ul li:hover a { color:#3582AC;}
.cloudbar .profile .user a { padding-right:20px; width:auto; }
.cloudbar .profile .user a span { padding:0 20px; background:url(../images/arrow-lt.png) no-repeat right center;}
.cloudbar .profile .full a span { background-image:url(../images/arrow-down.png); }
......
......@@ -29,7 +29,7 @@ $(document).ready(function(){
$("head").append(css);
// load fonts
var font_url = 'https://fonts.googleapis.com/css?family=Antic';
var font_url = 'http://fonts.googleapis.com/css?family=Didact+Gothic&subset=latin,greek,greek-ext';
var css_font = $("<link />");
css_font.attr({rel:'stylesheet', type:'text/css', href:font_url});
$("head").append(css_font);
......@@ -111,22 +111,21 @@ $(document).ready(function(){
// ie fix
user.hover(function(){$(this).addClass("hover")}, function(){$(this).removeClass("hover")});
/*$('.cloudbar .profile ul').mouseover(function(){
$(this).parents('.profile').css('backgroundColor','#000');
});
$('.cloudbar .profile ul').mouseout(function(){
$(this).parents('.profile').css('backgroundColor','#01A1AE');
});*/
$('.cloudbar .profile .full>a').live('click', function(e){
e.preventDefault();
$('html').live('click', function(e){
$('.cloudbar .profile .full>a').removeClass('open');
$('.cloudbar .profile .full>a').siblings('ul').hide();
});
$('.cloudbar .profile .full>a').live('click', function(e){
e.stopPropagation();
e.preventDefault();
equalWidths ( $('.cloudbar .profile ul'), $('.cloudbar .profile'));
$(this).siblings('ul').toggle();
$(this).toggleClass('open');
});
});
});
......
......@@ -29,7 +29,7 @@ a img, :link img, :visited img { border:none; }
a span { cursor:pointer; }
abbr[title], dfn[title] { border-bottom:1px dotted; cursor:help; }
address { font-style:italic; margin:0 0 1.5em 0; }
body { background:white; color:#222; font-family: Antic, Arial, sans-serif; font-size:81.3%; line-height:1.5; text-align:left; letter-spacing:1px;}
body { background:white; color:#222; font-family: 'Didact Gothic', Verdana, sans-serif; font-style:normal; font-size:81.3%; line-height:1.5; text-align:left; letter-spacing:1px;}
code, kbd, pre, samp { font-family:monospace, sans-serif; }
del { text-decoration:line-through; }
dl { margin:1em 0; }
......@@ -48,7 +48,7 @@ hr { border:0; border-top:1px solid; display:block; height:1px; margi
img { border:0; vertical-align:middle; }
ins { text-decoration:none; }
p { margin-bottom:1em; }
pre { overflow:auto; line-height:24px; }
pre { overflow:auto; }
strong, b { font-weight:bold; font-style:inherit; }
sub, sup { font-size:75%; line-height:0; position:relative; vertical-align:baseline; }
sub { bottom:-0.25em; }
......
/* generic form styles */
input, textarea, .form-widget { background-color: #ffffff; color: #000;border-color: #000000; }
#forms .input, #forms input { font-family: 'Antic', sans-serif; font-size: 14px; font-weight: normal; line-height: 22px; letter-spacing: 1px; border: 1px solid #808080; height: 21px; display: inline-block; margin-bottom: -1px; padding: 0.8em; padding-left: 1.5em; z-index: 2; }
#forms .input, #forms input { font-family: 'Didact Gothic', Verdana, sans-serif; font-size: 14px; font-weight: normal; line-height: 22px; letter-spacing: 1px; border: 1px solid #808080; height: 21px; display: inline-block; margin-bottom: -1px; padding: 0.8em; padding-left: 1.5em; z-index: 2; }
#forms .input:focus,
#forms input:focus { position: relative; border: 1px solid #000; z-index: 100; }
#forms .input:focus label,
#forms input:focus label { z-index: 300; }
form.withlabels label { width: 224px; display: block; float: left; padding-top: 1em; }
form.withlabels input[type=text],
form.withlabels input[type=password] { width: 224px; }
form.withlabels input[type=password] { width: 240px; }
form.withlabels input[type=text].long,
form.withlabels input[type=password].long,
form.withlabels textarea.long { width: 224px; }
......@@ -21,7 +21,7 @@ form .form-row { min-height: 30px; position: relative;}
form .form-row.submit { margin: 22px 0 ;}
form .form-row .extra-link { color: #808080; text-decoration: none; border: none; margin-top:15px; line-height:98%; display:inline-block; padding-top:15px; float: right; position:absolute; right:0; top:0; }
form .form-row .extra-link:hover { border-bottom:1px solid #808080;}
form .form-row label { font-size: 1.1em; }
form .form-row label { font-size: 1.077em; }
form.innerlabels label { position: absolute; bottom: 11px; left: 1.5em; color: #808080 ; }
form.innerlabels p { margin:0; position: relative;}
form.innerlabels p.p15px { font-size:1.154em;}
......@@ -32,8 +32,8 @@ form.innerlabels a:hover { }
form textarea,
form input.text,
form input[type="text"],
form input[type="password"] { color:#808080; font-family: 'Antic', sans-serif; font-weight: normal; line-height: 22px; letter-spacing: 1px;border: 1px solid #808080; height: 21px; display: inline-block; margin-bottom: -1px; padding: 0.8em; padding-left: 1.5em; z-index: 2; width:300px; }
form select { font-family: 'Antic', sans-serif; font-weight: normal; line-height: 22px; letter-spacing: 1px; border: 1px solid #808080; display:block; margin-bottom: -1px; padding: 0.8em; padding-left: 1.5em; z-index: 2; width:331px; }
form input[type="password"] { color:#808080; font-family: 'Didact Gothic', Verdana, sans-serif; font-weight: normal; line-height: 22px; letter-spacing: 1px;border: 1px solid #808080; height: 21px; display: inline-block; margin-bottom: -1px; padding: 0.8em; padding-left: 1.5em; z-index: 2; width:300px; }
form select { font-family: 'Didact Gothic', Verdana, sans-serif; font-weight: normal; line-height: 22px; letter-spacing: 1px; border: 1px solid #808080; display:block; margin-bottom: -1px; padding: 0.8em; padding-left: 1.5em; z-index: 2; width:331px; }
form textarea:focus,
form input.text:focus,
form input[type="text"]:focus,
......@@ -43,11 +43,13 @@ form input.text:focus label,
form input[type="text"]:focus label,
form input[type="password"]:focus label { z-index: 300;}
form input.submit,
form input[type="submit"] {font-family: 'Antic', sans-serif;font-size: 14px; font-weight: normal; line-height: 22px; letter-spacing:1px; background-color: #f89a1c;color: #ffffff; border: none; padding: 10px 22px;font-size: 1em; margin:15px 0 0 223px; height:43px; }
form input[type="submit"],
a.submit { font-family: 'Didact Gothic', Verdana, sans-serif; font-size: 14px; font-weight: normal; line-height: 22px; letter-spacing:1px; background-color: #f89a1c;color: #ffffff; border: none; padding: 10px 22px;font-size: 1em; margin:15px 0 0 223px; height:43px; }
form.innerlabels input.submit,
form.innerlabels input[type="submit"] {margin-left:0;}
form input.submit:hover,
form input[type="submit"]:hover { background-color:#3582ac;border-color:#3582ac;}
form input[type="submit"]:hover,
a.submit:hover { background-color:#3582AC;border-color:#3582ac; text-decoration:none;}
form input.submit.back,
form input[type="submit"].back { text-decoration: none; bottom: 0; float: right; z-index: 500; }
form input.submit.back.right,
......@@ -85,7 +87,7 @@ form.innerlabels .with-checkbox .checkbox-label { left:2.5em; top:17px; }
form.withlabels .with-checkbox .checkbox-widget { position:absolute; left:224px; top:0; }
form .extra-img { display:block; width:21px; height:21px; overflow:hidden; position:absolute; }
form.withlabels .extra-img { left:440px; bottom:12px; }
form.withlabels .extra-img { left:460px; bottom:12px; }
form.innerlabels .extra-img { bottom:10px; left:290px }
form .with-checkbox .extra-img { top:20px; }
form .with-errors .extra-img { background:url(../images/symbols.png) no-repeat -58px -3px; z-index:101;}
......@@ -134,6 +136,7 @@ input[type="submit"]:focus { box-shadow: 0 0 0 1px #FFFFFF inset; border:1p
form input.text,
form input[type="text"],
form input[type="password"] { width:90%; }
form.withlabels select { width:90%; }
form.innerlabels .extra-img,
form.innerlabels .with-errors .extra-img { left:90%; }
form.innerlabels { width:auto; }
......@@ -148,4 +151,28 @@ input[type="submit"]:focus { box-shadow: 0 0 0 1px #FFFFFF inset; border:1p
@media screen and ( width : 320px) {
#okeanos_recaptcha { width:259px }
}
\ No newline at end of file
}
p+ form { margin:2em 0; }
.full-dotted legend { padding-top:40px; }
form .form-row .radios label { width:auto; float:none; display:inline-block; }
form .form-row .radios input[type="radio"] { margin-right:165px; vertical-align:middle; }
form.withfieldset textarea { width: 224px; }
form.withfieldset select { width: 256px; background:#fff;}
form+p:first-child, form legend + p { margin-bottom:2em; }
/* dropkick select extra styles */
.form-row .dk_container { border-radius:0; margin-bottom:0; border: 1px solid #808080; height: 21px; letter-spacing: 1px; line-height: 22px; margin-bottom: -1px; width:254px; padding:0.8em 0; font-weight:normal; font-family: 'Didact Gothic', Verdana, sans-serif; font-size:1em; background:transparent; color:#808080;}
.form-row .dk_toggle { border-radius:0; padding:7px 0; border:0 none; text-indent:1.5em; text-decoration:none;background-image:url(../images/arrow_02.jpg); background-position:90% 5px;}
.form-row .dk_toggle:hover { text-decoration:none; }
.form-row .dk_open { background:transparent; box-shadow: none; }
.form-row .dk_open .dk_toggle { background-color:transparent; border:0 none; color:#000; box-shadow: none;}
.form-row .dk_focus .dk_toggle { background-color:transparent; border:0 none; color:#000; box-shadow: none;}
.1form-row .dk_options { display:block; }
.form-row .dk_options { box-shadow:none; border-radius:0; z-index:3; margin:6px -1px 0; width:auto; left:0;}
.form-row .dk_options a { font-weight:normal;color:#808080 }
.form-row .dk_options_inner { padding:0; margin:0; box-shadow:none; text-shadow:none; border-radius:0; border:1px solid #8C8C8E ;}
.form-row .dk-options_inner li { list-style:none outside; }
.form-row .dk_options a:hover,
.form-row .dk_option_current a { text-shadow:none; background-color: #E7E7E3;}
\ No newline at end of file
......@@ -10,4 +10,7 @@
.documentation img { max-width:100%; }
/* forms */
form input.submit, form input[type="submit"] { margin:0; }
form .form-row .extra-link { padding-top:0; }
\ No newline at end of file
form .form-row .extra-link { padding-top:0; }
.faq .two-cols .rt { width:auto; }
.faq .two-cols .lt { width:auto; }
dl.alt-style { width:auto; }
......@@ -66,6 +66,7 @@ img.right { margin:0 0 1em 1em; float:right;}
.container .extra ul.options { font-size:1em; margin:0 ; padding:15px; }
.landing h2, .landing a:hover { color:#01A1AE;}
.faq h2, .faq a:hover, .faq .current a { color:#EF4F54; border:0 none;}
.faq .current a { text-decoration:underline }
.question h2 { color:#EF4F54 }
.content .backlink { margin:1em 0; }
.faq h3 { color:#4085a6; margin:0;}
......@@ -87,7 +88,7 @@ img.right { margin:0 0 1em 1em; float:right;}
.article p.info { margin-top:20px; padding-top:10px; font-size:0.769em; color:#808080; }
.article h2, .posts h2 { color:#ef4f53; }
.posts h2 a, .posts h2 a:hover { border:0 none;color:#ef4f53;}
.posts p.date, .article p.date { margin:0; font-size:1.231em; color:#01a1ae; }
.posts p.date, .article p.date { margin:0; font-size:1.077em; color:#3582AC; }
p.info a { color:#808080; border-bottom:0 none; }
p.info a:hover { color:#000; border-bottom:0 none;}
.bg-wrap { background-position:right top; background-repeat:no-repeat;}
......@@ -95,14 +96,13 @@ p.info a:hover { color:#000; border-bottom:0 no
.bg-wrap.open .extra { display:block;}
.bg-wrap .extra .hide-extra { display:block; text-align:right; border:0 none; height:16px; overflow:hidden;}
.bg-wrap .extra .hide-extra img { margin-top:0; vertical-align:top; display:inline; }
.bg-wrap .extra .hide-extra:hover img { margin-top:-16px;}
.cyclades .bg-wrap .extra .hide-extra:hover img { margin-top:-32px;}
.pithos h2, .pithos a:hover,
.pithos .extra .options li h3 { color:#F89A1C; }
.bg-wrap .extra .hide-extra:hover img { margin-top:-32px;}
.pithos h2,
.pithos .extra .options li h3 { color:#BC742B; }
.cyclades h2,
.cyclades .extra .options li h3 { color:#4085A6; }
.cyclades .extra .options li h3 { color:#00A1B0; }
a.btn_01 { display:block; text-align:center; background:#F6921E; color:#000; padding:10px; text-decoration:none; border:0 none;}
a.btn_01:hover { background:#01A1AE; color:#000; text-decoration:none;}
a.btn_01:hover { background:#3582AC; color:#000; text-decoration:none;}
a.btn_01 em { font-style:normal; display:block; }
a.btn_01 span { color:#fff; }
.lt .box-more { text-align:center; padding:5px 10px; }
......@@ -165,6 +165,7 @@ a.videolink:hover { background:url(../images/video_image.png)
.resources .list .resource-cat-2.resource { border-color: #FF6F00 }
.resources .list .resource-cat-2.resource .title { color: #FF6F00 }
.resources .list .resource-cat-2.resource .description { background-color: #FF6F00 }
.resources .list .resource-cat-2.resource .description p{ line-height:130%; }
table { width:80%; color:#B3B3B3;}
table th, table td { padding:5px 5px 5px 0; }1234
......@@ -188,7 +189,7 @@ a.button:hover { background-color: #F89A1C; border:0 none; color:#fff;}
/*pagination*/
.pagination .next-prev { float:left; }
.pagination .nums { text-align:right;}
.pagination .nums span { color:#F89A1C;}
.pagination .nums span { color:#000;}
.two-cols .lt .clients-wrapper p { padding:0; }
......@@ -198,10 +199,10 @@ a.button:hover { background-color: #F89A1C; border:0 none; color:#fff;}
.container ul.options li a:hover { text-decoration: none; }
.container ul.options li a.red { color:#F24E53 }
.container ul.options li a.red:hover { border-bottom:1px solid #F24E53; }
.container ul.options li a.grey { color:#aaa }
.container ul.options li a.grey:hover { border-bottom:1px solid #aaa; }
.container ul.options li a.blue { color:#00A2B1 }
.container ul.options li a.blue:hover { border-bottom:1px solid #00A2B1; }
.container ul.options li a.grey { color:#F89A1C }
.container ul.options li a.grey:hover { border-bottom:1px solid #F89A1C; }
.container ul.options li a.blue { color:#3582AC }
.container ul.options li a.blue:hover { border-bottom:1px solid #3582AC; }
/* homepage clouds animation */
#animation { width:94%; height:120px; padding:0 3%; background:url(../images/okeanos_landing.png) no-repeat; max-width:375px; }
......@@ -236,7 +237,7 @@ dl.alt-style dt:nth-child(2n) { background:black; }
/* new faq-userguide styles */
.faq .two-cols .lt { width:460px; }
.faq .two-cols .rt { width:340px; }
.faq .two-cols .rt { width:340px; text-align:center; }
.lt-small .rt { width:520px; }
.lt-small .lt { width:280px; }
.unequal-dotted { background:url(../images/double-dots-unequal.jpg) no-repeat top center; padding: 30px 0 0 ; margin-top:30px;}
......@@ -244,18 +245,29 @@ dl.alt-style dt:nth-child(2n) { background:black; }
.tirkouaz h2,
.tirkouaz h2 a,
.tirkouaz h3,
.tirkouaz a:hover { color:#00A1B0; }
.tirkouaz a:hover,
.tirkouaz li.current a { color:#00A1B0; }
.yellow h2,
.yellow h2 a,
.yellow h3,
.yellow a:hover { color:#F6921E; }
.yellow a:hover,
.yellow li.current a { color:#F6921E; }
.purple h2,
.purple h2 a,
.purple h3,
.purple a:hover { color:#7B499C; }
.purple a:hover,
.purple li.current a { color:#7B499C; }
.blue h2,
.blue h2 a,
.blue h3,
.blue a:hover,
.blue li.current a { color:#3582AC; }
.brown h2,
.brown h2 a,
.brown h3,
.brown a:hover,
.brown li.current a { color:#BC742B; }
.details ul li a,
.details ul li a:hover,
.question .content a:hover { color:#F6921E }
.details .extra-menu { background: url(../images/dots.jpg) repeat-x center top ;padding-top:20px; margin-top:20px; }
.details .faq-category h2 { font-size:1em; }
......
......@@ -13,6 +13,26 @@ function setContainerMinHeight( applicableDiv){
}
//equal heights
(function($) {
$.fn.equalHeights = function(minHeight, maxHeight) {
tallest = (minHeight) ? minHeight : 0;
this.each(function() {
if($(this).height() > tallest) {
tallest = $(this).height();
}
});
if((maxHeight) && tallest > maxHeight) tallest = maxHeight;
return this.each(function() {
$(this).height(tallest);
});
}
})(jQuery);
// fix for iPhone - iPad orientation bug
var metas = document.getElementsByTagName('meta');
function resetViewport() {
......@@ -38,8 +58,10 @@ function gestureStart() {
}
}
}
document.addEventListener("gesturestart", gestureStart, false);
if (navigator.userAgent.match(/iPhone/i)) {
document.addEventListener("gesturestart", gestureStart, false);
}
//end of fix
$(document).ready(function() {
......@@ -88,7 +110,7 @@ $(document).ready(function() {
//todo
});
});
//$('select').dropkick();
//$('.dropkick-select').dropkick();
......@@ -136,7 +158,7 @@ $(document).ready(function() {
});
$(this).siblings('p').find('img').animate({
width: '60%'
});
}, 600);
},
function () {
......@@ -146,33 +168,24 @@ $(document).ready(function() {
});
$(this).siblings('p').find('img').animate({
width: '65%'
});
},600);
}
);
/*$('#animation a').hover(
function () {
var src = $(this).find('img').attr('src').replace('.png', '_top.png')
$(this).find('img').attr("src", src);
$(this).animate({
top: '+=-10'
}, 600, function() {
// action to do when animation is finished
});
}, 600);
$(this).siblings('p').find('img').animate({
width: '60%'
});
},
function () {
$(this).animate({
top: '0'
}, 600, function() {
var src = $(this).find('img').attr('src').replace('_top.png', '.png')
$(this).find('img').attr("src", src);
});
$(this).animate({top: '0'}, 600);
$(this).siblings('p').find('img').animate({
width: '65%'
});
......@@ -180,10 +193,42 @@ $(document).ready(function() {
);*/
if ($('.widjets'.length > 0)) {
$('.widjets li div').equalHeights();
}
$(function() {
if($("#from").length > 0 ){
$( "#from" ).datepicker({
defaultDate: "+0",
dateFormat: "dd-mm-yy",
onSelect: function( selectedDate ) {
$( "#to" ).datepicker( "option", "minDate", selectedDate );
}
});
$( "#to" ).datepicker({
defaultDate: "+1w",
dateFormat: "dd-mm-yy",
onSelect: function( selectedDate ) {
$( "#from" ).datepicker( "option", "maxDate", selectedDate );
}
});
}
});
});
$(window).resize(function() {
setContainerMinHeight('.container .wrapper');
if ($('.widjets').length > 0) {
$('.widjets li div').equalHeights();
}
});
......@@ -27,7 +27,7 @@
{% block page.css %}
<link href="https://fonts.googleapis.com/css?family=Antic" rel="stylesheet" type="text/css">
<link href='http://fonts.googleapis.com/css?family=Didact+Gothic&subset=latin' rel='stylesheet' type='text/css'>
<link rel="stylesheet" type="text/css" href="{{ IM_STATIC_URL }}css/global.css">
<link rel="stylesheet" type="text/css" href="{{ IM_STATIC_URL }}css/print.css" media="print">
<!--[if lte IE 7]>
......@@ -36,17 +36,19 @@
<link rel="stylesheet" media="screen and (max-width: 960px)" href="{{ IM_STATIC_URL }}css/max960.css"/>
<link rel="stylesheet" media="screen and (max-width: 768px)" href="{{ IM_STATIC_URL }}css/max768.css"/>
<link rel="stylesheet" media="screen and (max-width: 480px)" href="{{ IM_STATIC_URL }}css/max480.css"/>
<link rel="stylesheet" type="text/css" href="{{ IM_STATIC_URL }}css/jquery-ui-1.8.21.custom.css"/>
{% endblock page.css %}
{% block headjs %}
<script src="{{ IM_STATIC_URL }}js/jquery-1.7.1.min.js"></script>
<script src="{{ IM_STATIC_URL }}js/jquery.dropkick-1.0.0.js"></script>
<script src="{{ IM_STATIC_URL }}js/os.js"></script>
<script src="{{ IM_STATIC_URL }}js/modernizr-2.0.6.js"></script>
<script src="{{ IM_STATIC_URL }}js/jquery.js"></script>
<script src="{{ IM_STATIC_URL }}js/jquery.infieldlabel.js"></script>
<script src="{{ IM_STATIC_URL }}js/forms.js"></script>
<script src="{{ IM_STATIC_URL }}js/common.js"></script>
<script src="{{ IM_STATIC_URL }}js/forms.js"></script>
<script src="{{ IM_STATIC_URL }}js/common.js"></script>
{% endblock headjs %}
{% block endhead %}{% endblock endhead %}
......
{% extends "im/account_base.html" %}
{% block page.body %}
<div class="full bottom-bordered">
<div class="full bottom-bordered clearfix">
<div class="lt-div">
<p>Invite someone else</p>
</div>
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment