update theme and responsive layout « Support Forum | Kriesi.at

Support Forum » Angular

update theme and responsive layout

9 posts from 3 voices

Started 4 months ago by rita01
Latest reply from rita01
This topic is closed
This topic is not a support question

Tags:

rita01
Member

Hi,

I'm using angular, version 1.3, without responsive on/off option.
I have made a lot of customisations in quick css styling menu.

What if I upgrade to the last version and remove responsive layout please ? Is it safe ?

My css custom :

#header {
    margin-bottom: 25px;
}

#header .container {
    min-height: 50px;
    padding: 20px 0px;
    border-bottom: 1px solid;
    z-index: 100;
}

.hr {
    clear: both;
    display: block;
    overflow: hidden;
    width: 100%;
    height: 25px;
    line-height: 25px;
    position: relative;
    margin: 0px;
    padding: 26px 0px;
}

/*********Recherche auteurs sidebar****/

.input-text, input[type="text"], input[type="input"], input[type="password"], input[type="email"], textarea, select {
    border: 1px solid rgb(225, 225, 225);
    outline: medium none;
    font: 13px "HelveticaNeue","Helvetica Neue",Helvetica,Arial,sans-serif;
    color: rgb(119, 119, 119);
    margin: 0px 0px 4px;
    width: 210px;
    max-width: 100%;
    display: block;
    background: none repeat scroll 0% 0% rgb(255, 255, 255);
    padding: 3px 4px;
}

/*********COULEURS APERCUS LIVRES****/
.ajax_slide {
    color: rgb(50, 50, 50);
}

#top .portfolio-meta-list {
    list-style-type: none;
    font-weight: bold;
    font-size: 12px;
}

#top .portfolio-title, #top .portfolio-title a, #top .portfolio-title a:hover, .ajax-control a, .ajax_slide h1, .ajax_slide h2, .ajax_slide h3, .ajax_slide h4, .ajax_slide h5, .ajax_slide h6, .ajax_slide strong, .ajax_slide a {
    color: rgb(0, 0, 0);
    font-weight: normal;
}
#top .heading-color, strong, #top .main-color, .main_menu ul:first-child > li.current-menu-item > a, .main_menu ul:first-child > li.current_page_item > a, #top blockquote p, #top .main_menu .menu li a:hover, h1, h2, h3, h4, h5, h6, .js_active .tab.active_tab, #top #wrap_all .current_page_item > a, .first-quote, div .callout {
    color: rgb(36, 36, 36);
    font-weight: normal;
}

#top .callout {
padding: 5px 0px;
}

.template-blog .content {
    margin-top: 10px;
}

.title_container, #top .dynamic_el_1 .title_container {
    padding-bottom: 15px;
    margin-bottom: 15px;
    position: relative;
    clear: both;
}
/*********police widget menu perso sidebar****/
.widget_archive li a, .widget_categories li a, .widget_pages li a, .widget_links li a, .widget_meta li a, .widget_nav_menu li a{
font-size: 13px;
}

/*********separations menu perso sidebar****/
.widget_nav_menu a{
display: block;
padding: 0px 0px 0px 08px;
border-top-style: solid;
border-top-width: 0px;
}
.widget {
    clear: both;
    position: relative;
    overflow: hidden;
    padding: 15px 0px;
    float: none;
}

#top .news-content {
    padding: 3px 0px 3px;
    line-height: 18px;
    position: relative;
    overflow: hidden;
    font-size: 11px;
    display: block;
    clear: both;
    margin: 0px;
}
/********* titre portfolio item plus large ****/
.portfolio-size-4 .post-title.portfolio-title {
height: 32px;
}
#top .portfolio-title{
padding:10px;
margin:0;
font-family: Arial, "Georgia", "Times New Roman", Helvetica, sans-serif;
font-weight: normal;
font-style: bold;
text-transform: none;
letter-spacing: normal;
position: relative;
}
/********* tiré titre portfolios ****/
.title-span {
height: 0px;
width: 0px;
position: absolute;
top: 49%;
left: 11px;
}

/********* MAIN MENU ****/
.main_menu ul:first-child > li > a{
display:block;
background-color:#f8f8f8;
text-decoration: none;
margin-left:30px;
padding:3px 15px 3px 15px;
text-transform: uppercase;
border-bottom: 2px solid;
-moz-box-shadow: 0 4px 15px rgba(0,0,0,0.1);
-webkit-box-shadow: 0 4px 15px rgba(0,0,0,0.1);
box-shadow: 0 4px 15px rgba(0,0,0,0.1);
z-index: 1;
}
/*********SOUS MENU ****/
.main_menu .menu ul {
display: none;
left: 15px;
position: absolute;
top: 31px;
width: 192px;
z-index: 2;
cursor: pointer;
border-top: 2px solid;
-moz-box-shadow: 0 4px 15px rgba(0,0,0,0.1);
-webkit-box-shadow: 0 4px 15px rgba(0,0,0,0.1);
box-shadow: 0 4px 15px rgba(0,0,0,0.1);
}
/*********POLICE EN TETE TITRES ****/
.title_container h1,  #top .dynamic_el_1 .title_container h1{
margin:0;
font-weight: normal;
font-size: 35px;
padding:11px 340px 12px 0;
position: relative;
}
/*********aperçu livre avec sidebar****/* Base Grid */
    .container .one.unit                      	{ width: 50px;  }
    .container .two.units                     	{ width: 130px; }
    .container .three.units                   	{ width: 210px; }
    .container .four.units                    	{ width: 210px; }
    .container .five.units                    	{ width: 370px; }
    .container .six.units                     	{ width: 450px; }
    .container .seven.units                   	{ width: 530px; }
    .container .eight.units                   	{ width: 690px; }
    .container .nine.units                    	{ width: 690px; }
    .container .ten.units                     	{ width: 770px; }
    .container .eleven.units                  	{ width: 850px; }
    .container .twelve.units                  	{ width: 930px; margin-left:0}

/*********marge gauche sidebar****/
.inner_sidebar{
padding-left:5px;
}

/*********aperçu livre avec sidebar****/
.sidebar_right .ajax_slide  .portfolio-entry.one_third, .sidebar_left .ajax_slide  .portfolio-entry.one_third{
width:70%;
margin-left:20px;
margin-top:0px;
}

.sidebar_right .ajax_slide .flex_column.two_third, .sidebar_left .ajax_slide .flex_column.two_third{
width:26%
}

/* Columns for better content separation
============================= */

div .one_fifth			{	overflow: hidden; margin-left: 4%; width:16.5%; float:left;	position:relative; }
div .one_fourth			{	overflow: hidden; margin-left: 4%; width:22%;  float:left; 	position:relative; }
div .one_third			{	overflow: hidden; margin-left: 4%; width:51.5%; float:left; 	position:relative; }
div .two_fifth			{	overflow: hidden; margin-left: 4%; width:38.5%; float:left;	position:relative; }
div .one_half			{	overflow: hidden; margin-left: 4%; width:48%; float:left; 	position:relative; }
div .three_fifth		{	overflow: hidden; margin-left: 4%; width:57%; float:left; 	position:relative; }
div .two_third			{	overflow: hidden; margin-left: 4%; width:34.5%; float:left; 	position:relative; }
div .three_fourth		{	overflow: hidden; margin-left: 4%; width:74%; float:left; 	position:relative; }
div .four_fifth			{	overflow: hidden; margin-left: 4%; width:79%; float:left; 	position:relative; }
.msie7 .one_fourth		{ 	width:21.5%;  	}

/*********SEARCHBAR EN HAUT DE PAGE ****/
.social_container #searchform{
position: absolute;
right: 94px;
top: 3px;
z-index: 160;
}

#s {
    width: 160px;
    padding: 10px 40px 10px 10px;
    position: relative;
    margin: 0px;
}

/*********reduire images SINGLE PORTFOLIO****/
.single .slideshow.fade_slider,
.single .slideshow li img {
width: 200px!important;
}
.single .slideshow.fade_slider {
background: none!important;
}

/*********SIDEBAR POUR SINGLE PORTFOLIO****/

.single-portfolio .fullwidth .sidebar {
display: block;
}

/*********aligner slideshow à droite****/

#top.single-portfolio .slideshow_container {
float: right;
padding-right: 100px;
padding-bottom: 0px;
}

/*********réduire le bloc de description pour laisser monter le slideshow****/

#top .portfolio-meta-list {
float: left;
padding-right: 110px;
padding-bottom: 0px;
}

/********* baisse portfolio item catalog ****/
.ajax-control {
height: 42px;
right: 2px;
top: -41px;
}

/********* Réduire images pour page auteurs (archives) ****/

#top.archive .slideshow.fade_slider {
width: 70px !important;
height: 90px !important;
position: absolute;
}

/********* Décaler titre et exerpt des auteurs vers la droite ****/

.unit, .units {
    float: left;
    display: inline;
    margin-left: 30px;
}
/********* aligner titre auteurs à gauche****/

#top .offset-by-one {
    padding-left: 0px;
}
/********* Réduire espace entre les résumés d'auteurs ****/
.template-blog .post-entry {
    padding-bottom: 15px;
}

/********* Réduire espace entre titre et exerpt auteurs****/
#top .slideshow_container {
    position: relative;
    padding-bottom: 5px;
}
/********* Supprimer date****/

.date-container {
display: none;
}
/********* Masquer meta auteur de l'article****/
.blog-inner-meta {
display: none;
}

the website :

http://www.lacroiseedeschemins.ma

Thank you again for your support

Posted 4 months ago #

Devin
Moderator

Hi rita01,

I'm not really sure what you mean. When you update the theme you can save your custom.css file locally if you want to make sure nothing happens to it. Then after you've updated just re-upload the file to your server if it was overwritten somehow.

Otherwise, I don't see in the version.rtf any new addition or change with the responsive design in 1.5

Regards,

Devin

Posted 4 months ago #
rita01
Member

Thank you Devin for your answer,

Sorry for my english, I fear not to be able to explain you what I mean but no way, I will see :)

Regards

Posted 4 months ago #
Devin
Moderator

As long as you save a backup when updating you should be fine :)

Regards,

Devin

Posted 4 months ago #
rita01
Member

Hi Devin,

I have done many changes on php files too... but I applied it to the files of the new version and everything is ok after the update !

I have tried this custom to disable reponsive layout :

http://www.kriesi.at/support/topic/easy-way-of-disableremove-resposive-aspect-of-theme

It works very well but not on Ipad with safari, the zoom is ok but the screen still display the tablet layout. No problem with opera on Ipad an works fine with android on galaxy too.

Have you got an idea to disable responsive layout on safari with the Ipad ?

Thank you

Posted 3 months ago #
Devin
Moderator

What about the site responds differently? Is there a specific area that looks or acts differently that you can point on your site live?

Posted 3 months ago #
rita01
Member

Hi Devin,

No, I just would like to remove the responsive layout effect. I want the website to always been displayed as in pc sreen, full width.

Actually the website continue to be responsive when I reduce the window on the computer (mountain lion, safari / firefox) and he displays the tablet layout on the ipad.

I just want the website to be "fix" in all situations.

Thank you for your support again, and again, and again... And sorry for my poor english.

Posted 3 months ago #

Dude
Dude

Hi,
your website layout is fixed for me and it doesn't resize anymore. You also removed the media queries in layout.css which will remove the "responsive feature". I just noticed one issue - the menu disappears. To fix it add following code to css/custom.css:

.main_menu ul {
display: block !important;
}

and in js/avia.js remove following code:

// improves menu for mobile devices
	jQuery('.main_menu ul:eq(0)').mobileMenu({
	  switchWidth: 768,                   							//width (in px to switch at)
	  topOptionText: jQuery('.main_menu').data('selectname'),     	//first option text
	  indentString: '&nbsp;&nbsp;&nbsp;'  							//string for indenting nested items
	});

Posted 3 months ago #