Fixes and Clouds animation
authorOlga Brani <olgabrani@grnet.gr>
Fri, 15 Jun 2012 14:36:20 +0000 (17:36 +0300)
committerOlga Brani <olgabrani@grnet.gr>
Fri, 15 Jun 2012 14:36:20 +0000 (17:36 +0300)
cloudcms/static/cloudcms/css/forms.css
cloudcms/static/cloudcms/css/max768.css
cloudcms/static/cloudcms/css/modules.css
cloudcms/static/cloudcms/images/cloud_01_top.png [new file with mode: 0644]
cloudcms/static/cloudcms/images/cloud_02_top.png [new file with mode: 0644]
cloudcms/static/cloudcms/images/cloud_03_top.png [new file with mode: 0644]
cloudcms/static/cloudcms/js/common.js
cloudcms/static/cloudcms/js/os.js
cloudcms/templates/cms/footer.html

index be8ccc5..b818358 100644 (file)
@@ -110,7 +110,7 @@ form .with-hidden                                                   { display:none; }
 #okeanos_recaptcha label.recaptcha_only_if_image,\r
 #okeanos_recaptcha label.recaptcha_only_if_audio{ position:absolute; top:auto; bottom:11px; }\r
 #okeanos_recaptcha a.recaptcha_audio_cant_hear_link { margin-left:20px;  }\r
-#okeanos_recaptcha #recaptcha_response_field   { width:220px; float:left; border-left:0 none;   }\r
+#okeanos_recaptcha #recaptcha_response_field   { width:220px; float:left; margin-left:-1px;  }\r
 #okeanos_recaptcha .img                                                        { width:23px; float:left; height:23px; overflow:hidden; margin:8px; }\r
 #okeanos_recaptcha .img a                                              { display:block; width:100%; height:100%; background:url(../images/refresh_lg.png) no-repeat top left; text-indent:-100px }\r
 #okeanos_recaptcha .img-refresh        a                               { background:url(../images/refresh_lg.png); }\r
@@ -119,12 +119,29 @@ form .with-hidden                                                 { display:none; }
 #okeanos_recaptcha .img-audio a:hover                  { background:url(../images/sound_g.png); }\r
 #okeanos_recaptcha .actions-wrap                               { border-top:1px solid #808080 }\r
 \r
+input.submit:focus,\r
+input[type="submit"]:focus                                             { border:1px solid #F89A1C; }                                           \r
 \r
 @media screen and (max-width : 591px)          { \r
-       form.withlabels .extra-img         { left:222px; }\r
-    form.withlabels span.info     { left:222px; }\r
-    form .extra-img                   { left:222px; }\r
-    \r
-    .form-error                               { margin-left:0!important; } \r
+       form.withlabels .extra-img                                      { left:222px; }\r
+    form.withlabels span.info                                  { left:222px; }\r
+    form .extra-img                                            { left:222px; }\r
+    .form-error                                                        { margin-left:0!important; } \r
+}\r
 \r
+\r
+@media screen and (max-width : 410px)          { \r
+       form.login                                                                      { width:auto; }\r
+       form textarea, \r
+       form input.text, \r
+       form input[type="text"], \r
+       form input[type="password"]                             { width:90%; }\r
+       form.innerlabels .extra-img,\r
+       form.innerlabels .with-errors .extra-img        { left:90%; }\r
+       form.innerlabels                                                        { width:auto; }\r
+       .container form.innerlabels.overflow-hidden     { overflow:visible;}\r
+       form span.info                                                          { display:none; }\r
+       #okeanos_recaptcha                                                      { width:inherit }\r
+       #okeanos_recaptcha #recaptcha_response_field    { width:55%; }\r
+       #okeanos_recaptcha #recaptcha_image     img             { width:80%; }\r
 }
\ No newline at end of file
index fdb733f..dd54922 100644 (file)
@@ -6,3 +6,4 @@
 .buttons-list .button                                                  { margin-left:0; }
 form input.submit, form input[type="submit"]   { margin:0; }
 .container .lt-div                                                             { float:none; width:auto; }
+.container ul.options                                                  { margin-bottom:30px; }
index 0702285..127dba8 100644 (file)
@@ -1,3 +1,4 @@
+body                                                                                   { min-width:32px; overflow-y: scroll;}\r
 .wrapper                                        { margin:0 auto; position:relative; width:820px; padding:36px 70px; }\r
 .container .wrapper,\r
 .footer .wrapper                                { border: 1px solid #808080; border-top:0 none;}\r
@@ -30,7 +31,6 @@ img.right                                                             { margin:0 0 1em 1em; float:right;}
 .top-msg .close:hover                           { color:#000;}\r
 \r
 /* container */\r
-.container                                                                             { border-top:35px solid #000; }\r
 .container .wrapper                             { padding-bottom:100px;}\r
 .mainlogo h1                                                                   { line-height:100%; font-size:1em; }\r
 .container .navigation                          { margin:20px 0 0; font-size:1.154em; height:95px;}\r
@@ -54,13 +54,13 @@ img.right                                                           { margin:0 0 1em 1em; float:right;}
 .container ul.options li h3                                            { font-size:1em; margin-bottom:0; }\r
 .container ul.options li a                                     { border:0 none;}\r
 .container ul.options li a:hover                               { text-decoration:underline;}\r
-.container .extra ul.options                                   { font-size:1em; margin:30px 0 0 ; padding:0 15px; }\r
+.container .extra ul.options                                   { font-size:1em; margin:0 ; padding:15px; }\r
 .landing h2, .landing a:hover                   { color:#01A1AE;}\r
 .faq h2, .faq a:hover, .faq .current a          { color:#EF4F54; border:0 none;}\r
 .content .question h2                                                  { color:#4085A6 }\r
 .content .backlink                                                             { margin:1em 0; }\r
 .content .question .backlink a                                 { border:0 none; color:#F89A1C }\r
-.content .question .backlink a:hover                   { text-decoration:underline; }\r
+.content .question .backlink a:hover                   { border-bottom:1px solid #F89A1C }\r
 .faq h3                                                                                        { color:#4085a6; margin:0;}\r
 .faq ul                                         { padding:0; margin:0; }\r
 .faq ul li                                      { list-style:none outside; padding:0; margin:0;  }\r
@@ -208,4 +208,7 @@ a.button:hover                                                                      { background-color: #F89A1C; border:0 none; color:#fff;}
 #animation div a                                { position:absolute; left:0; top:0; border:0 none; }\r
 #animation div a img                                                   { width:100%; }\r
 #animation p                                   { position:absolute; bottom:0; left:0; width:100%; text-align:center; }\r
-#animation p img                                { display:inline-block; width:65%; }
\ No newline at end of file
+#animation p img                                { display:inline-block; width:65%; }\r
+\r
+/* Weird bug in pages that contain captcha. An extra iframe appears in chrome :S*/\r
+.container +iframe                                                             { display:none; }
\ No newline at end of file
diff --git a/cloudcms/static/cloudcms/images/cloud_01_top.png b/cloudcms/static/cloudcms/images/cloud_01_top.png
new file mode 100644 (file)
index 0000000..f1bc09a
Binary files /dev/null and b/cloudcms/static/cloudcms/images/cloud_01_top.png differ
diff --git a/cloudcms/static/cloudcms/images/cloud_02_top.png b/cloudcms/static/cloudcms/images/cloud_02_top.png
new file mode 100644 (file)
index 0000000..8036def
Binary files /dev/null and b/cloudcms/static/cloudcms/images/cloud_02_top.png differ
diff --git a/cloudcms/static/cloudcms/images/cloud_03_top.png b/cloudcms/static/cloudcms/images/cloud_03_top.png
new file mode 100644 (file)
index 0000000..c4a8b8b
Binary files /dev/null and b/cloudcms/static/cloudcms/images/cloud_03_top.png differ
index d6874f7..b29d13f 100644 (file)
@@ -21,14 +21,11 @@ $(document).ready(function() {
        \r
     $('.show-extra').click(function(e) {\r
         e.preventDefault();\r
-        \r
-        $(this).parents('.bg-wrap').find('.extra').toggle('slow');\r
-        $('.hide-extra').toggle();    \r
+        $(this).parents('.bg-wrap').find('.extra').slideToggle(600);\r
     });\r
     $('.hide-extra').click(function(e) {\r
         e.preventDefault();\r
-        $(this).hide();\r
-        $(this).parents('.bg-wrap').find('.extra').hide('slow');\r
+        $(this).parents('.bg-wrap').find('.extra').slideUp(600);\r
     });\r
     \r
     $('.box-more p').click(function(e) {\r
@@ -68,52 +65,90 @@ $(document).ready(function() {
     \r
     $('.top-msg .success').parents('.top-msg').css(\r
        {\r
-               backgroundColor: '#00A2B1',\r
+               backgroundColor: '#77C596',\r
                color: '#fff'\r
        }\r
-    )\r
+    );\r
     \r
     $('.top-msg .error').parents('.top-msg').css(\r
        {\r
-               backgroundColor: '#C43F73',\r
+               backgroundColor: '#EF4F54',\r
                color: '#fff'\r
        }\r
-    )\r
+    );\r
     \r
     \r
     $('.top-msg .warning').parents('.top-msg').css(\r
        {\r
-               backgroundColor: '#F0A216',\r
+               backgroundColor: '#F6921E',\r
                color: '#fff'\r
        }\r
-    )\r
+    );\r
     \r
     $('.top-msg .info').parents('.top-msg').css(\r
        {\r
-               backgroundColor: '#75A23A',\r
+               backgroundColor: '#C3C3B9',\r
                color: '#fff'\r
        }\r
-    )\r
+    );\r
     \r
+    // clouds homepage animation\r
     $('#animation a').hover(\r
       function () {\r
+       \r
         $(this).animate({\r
-         top: '+=-10'   \r
+           top: '+=-10'   \r
+           }, 600, function() {\r
+               if ($(this).find('img').attr('src').indexOf("_top") == -1) {\r
+                       var src = $(this).find('img').attr('src').replace('.png', '_top.png')\r
+                       $(this).find('img').attr("src", src);\r
+               }\r
+\r
+               });\r
+        $(this).siblings('p').find('img').animate({\r
+          width: '60%'       \r
         });\r
+      }, \r
+      function () {\r
+\r
+        $(this).animate({top: '0'}, 600, function() {\r
+               var src = $(this).find('img').attr('src').replace('_top.png', '.png')\r
+                       $(this).find('img').attr("src", src);\r
+               });\r
+        $(this).siblings('p').find('img').animate({\r
+          width: '65%'       \r
+        });\r
+      }\r
+    );\r
+    \r
+    \r
+    /*$('#animation a').hover(\r
+      function () {\r
+       var src = $(this).find('img').attr('src').replace('.png', '_top.png')\r
+        $(this).find('img').attr("src", src);\r
+        $(this).animate({\r
+           top: '+=-10'   \r
+           }, 600, function() {\r
+                       // action to do when animation is finished\r
+               });\r
         $(this).siblings('p').find('img').animate({\r
           width: '60%'       \r
         });\r
       }, \r
       function () {\r
+       \r
         $(this).animate({\r
          top: '0'   \r
             \r
-        });\r
+        }, 600, function() {\r
+               var src = $(this).find('img').attr('src').replace('_top.png', '.png')\r
+               $(this).find('img').attr("src", src);\r
+               });\r
         $(this).siblings('p').find('img').animate({\r
           width: '65%'       \r
         });\r
       }\r
-    );\r
+    );*/\r
     \r
     \r
 });\r
index 5524c65..930d417 100644 (file)
@@ -97,20 +97,26 @@ var BrowserDetect = {
                        subString: "Win",\r
                        identity: "windows"\r
                },\r
+\r
+               {\r
+                       string: navigator.userAgent.toLowerCase(),\r
+                       subString: "android",\r
+                       identity: "Android"\r
+               },\r
                {\r
                        string: navigator.platform,\r
                        subString: "Mac",\r
                        identity: "MacOS"\r
                },\r
                {\r
-                          string: navigator.userAgent,\r
-                          subString: "iPhone",\r
-                          identity: "iPhone"\r
+                  string: navigator.userAgent,\r
+                  subString: "iPhone",\r
+                  identity: "iPhone"\r
            },\r
            {\r
-                          string: navigator.userAgent,\r
-                          subString: "iPad",\r
-                          identity: "iPad"\r
+                  string: navigator.userAgent,\r
+                  subString: "iPad",\r
+                  identity: "iPad"\r
            },\r
                {\r
                        string: navigator.platform,\r
index ef5f9cf..3d87acf 100644 (file)
        </ul>
        {% endfor %}
 </div>
+
 {% if APP.footer_bottom %}
-<p>
+
+
     {{ APP.footer_bottom|safe }}
-</p>
+
 {% endif %}