Skip to main content ↑ ↓
Start / community page Started by Jorin · · Read 24665 times 0 Members and 1 Guest are viewing this topic. previous topic - next topic

Re: Start / community page

Reply #45 –

Quote from: emanuele – So you mean you want to have a button that points for example to:
http://www.elkarte.net/community/index.php?topic=2846.0
and when inside that topic, the button should be highlighted?

Exactly.

Quote from: emanuele – Is there a live version to have a look to?

It is: http://forum-alternative-antriebe.de/start.php

Quote from: emanuele – Yep, that could be an interesting project!
Would a board do as a quick solution to start having this kind of informations written down?

I would start with moderated boards, as @Flavio93Zena mentioned, too.

Re: Start / community page

Reply #46 –

Quote from: Jorin –
Quote from: emanuele – So you mean you want to have a button that points for example to:
http://www.elkarte.net/community/index.php?topic=2846.0
and when inside that topic, the button should be highlighted?

Exactly.
I have to think about that one.
Bugs creator.
Features destroyer.
Template killer.

Re: Start / community page

Reply #47 –

Quote from: Jorin – On mobile devices my menu icons on my start page are too small (but their background seems to be okay). I think I need to add the CSS code for the mobile buttons into my start.css used for this page. I tried already but without success.

Any help with this?  O:-)

Re: Start / community page

Reply #48 –

Sorry, I've lost that one... :-[

Is it on one of the sites in your signature?
Bugs creator.
Features destroyer.
Template killer.

Re: Start / community page

Reply #50 –

Change /themes/default/css/_light/index_light.css
Code: (css) [Select]
[data-icon]::before {
    border: 3px solid #666;
    border-radius: 4px;
    color: #666;
    content: attr(data-icon);
    display: inline-block;
    font-family: "FontAwesome";
    font-size: 2em;
    height: 1.15em;
    line-height: 1.2em;
    margin: 2px;
    padding: 1px;
    text-align: center;
    width: 1.15em;
}
to
Code: (css) [Select]
[data-icon]::before {
    border: 3px solid #666;
    border-radius: 4px;
    color: #666;
    content: attr(data-icon);
    display: inline-block;
    font-family: "FontAwesome";
    font-size: 2em;
    line-height: 1em;
    margin: 2px;
    padding: 1px;
    text-align: center;
    width: 1.45em;
}

Re: Start / community page

Reply #51 –

Thanks, but now I have this in normal desktop view.

Re: Start / community page

Reply #52 –

That's crazy :o  I'll look at that in more detail today.
Regards Stephan

Re: Start / community page

Reply #53 –

I'd suggest to always try to use custom.css instead of editing the original files, both because it's easier on upgrades and because it's much easier to spot what you changed and where. ;)

Try with adding:
Code: [Select]
@media screen and (max-width: 50em) {
	[data-icon]:before {
		height: 1.55em;
		width: 1.55em;
	}
}
To your custom.css.
Bugs creator.
Features destroyer.
Template killer.

Re: Start / community page

Reply #54 –

Deactivate I the bootstrap.css,Is everything ok. I had this problem with my startpage also. I have removed the link to https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css and have downloaded the Bootstrap css. Then I looked out only the code I needed. This was corrected the error. Here's my startpage .css. Below comes the part of Bootstrap.

Code: (css) [Select]
.text-green {
    color: green;
    float: right;
    padding: 0 0 10px 10px;
    margin-top: -15px;
}
.text-orange {
    color: orange;
    float: right;
    padding: 0 0 10px 10px;
    margin-top: -15px;
}
.text-red {
    color: red;
    float: right;
    padding: 0 0 10px 10px;
    margin-top: -15px;
}
#contribs {
    padding: 1em 0;
}
.text-blue {
    color: #5dcbe7;
    text-shadow: 1px 1px 1px #777;
    float: right;
    padding: 0 0 10px 10px;
    margin-top: -05px;
}
.text-gold {
    color: #DAA520;
    float: right;
    padding: 0 0 10px 10px;
    margin-top: -05px;
}
.column {
    display: inline-table;
    width: 25%;
    margin-top: 1em;
    padding: 0 15px;
    color: #ffffff;
    font-size: .9em;
    white-space:nowrap;
    line-height: 1.5;
}
.column .fa {
    color: #222;
}
.fa-group {
    padding-top: 5px;
}
.fa-15x {
    font-size: 1.5em !important;
}
#news {
    display: none;
}
#ext {
    list-style: none;
    margin: 0;
    clear: both;
}
.column h4, .toppad h4 {
    color: #222;
    font-weight: bold;
    font-size: 1.5em;
    margin: 0 0 10px 0;
    border-bottom: 2px dotted #222;
}
.toppad {
    padding-top: 1em;
}
.column a:link, .column a:visited {
    color: #222;
    display: block;
}
#git_commits > ul  > li {
    margin: 5px 0;
}

/*!
 * Bootstrap v3.3.5 (http://getbootstrap.com)
 * Copyright 2011-2015 Twitter, Inc.
 * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
 */
/*! normalize.css v3.0.3 | MIT License | github.com/necolas/normalize.css */
h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6 {
  font-family: inherit;
  font-weight: 500;
  line-height: 1.1;
  color: inherit;
}
h2,
.h2 {
  font-size: 20px;
}
.container-fluid {
  padding-right: 15px;
  padding-left: 15px;
  margin-right: auto;
  margin-left: auto;
}
.clearfix:before,
.clearfix:after,
.container-fluid:before,
.container-fluid:after,
.row:before,
.row:after,
.panel-body:before,
.panel-body:after {
  display: table;
  content: " ";
}
.clearfix:after,
.container:after,
.container-fluid:after,
.row:after,
.pager:after,
.panel-body:after {
  clear: both;
}
.col-md-1, .col-md-4, .col-md-7, .col-md-8, .col-md-10 {
  position: relative;
  min-height: 1px;
  padding-right: 15px;
  padding-left: 15px;
}
.panel {
  margin-bottom: 20px;
  background-color: #fff;
  border: 1px solid transparent;
  border-radius: 4px;
  -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, .05);
          box-shadow: 0 1px 1px rgba(0, 0, 0, .05);
}
.panel-body {
  padding: 15px;
}
.panel-default {
    border-color: #ddd;
}
.well {
  min-height: 20px;
  padding: 19px;
  margin-bottom: 20px;
  background-color: #f5f5f5;
  border: 1px solid #e3e3e3;
  border-radius: 4px;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .05);
          box-shadow: inset 0 1px 1px rgba(0, 0, 0, .05);
}
.row {
  margin-right: -15px;
  margin-left: -15px;
}
.lead {
  margin-bottom: 20px;
  font-size: 16px;
  font-weight: 300;
  line-height: 1.4;
}
.img-thumbnail {
  display: inline-block;
  max-width: 100%;
  height: auto;
  padding: 4px;
  margin-right: 5px; 
  line-height: 1.42857143;
  background-color: #fff;
  border: 1px solid #ddd;
  border-radius: 4px;
  -webkit-transition: all .2s ease-in-out;
       -o-transition: all .2s ease-in-out;
          transition: all .2s ease-in-out;
}
/* This one does up to 540 screens. */
@media screen and (max-width: 33.750em) {
   .fa-15x {
    font-size: 1.0em;
    line-height: 0.75em;
    vertical-align: -15%;
    margin-top: 0.005em;
  }     
  h2, .h2 {
    font-size: 25px;
  }
  .column {
    font-size: 0.85em;
  }            
}
@media (min-width: 768px) {
  .lead {
    font-size: 21px;
  }
}
@media (min-width: 992px) {
  .col-md-1, .col-md-4, .col-md-7, .col-md-8, .col-md-10 {
    float: left;
  }
  .col-md-10 {
    width: 83.33333333%;
  }
  .col-md-8 {
    width: 66.66666667%;
  }
  .col-md-7 {
    width: 58.33333333%;
  }
  .col-md-4 {
    width: 33.33333333%;
  }
  .col-md-1 {
    width: 8.33333333%;
  }  
}













Regards Stephan

Re: Start / community page

Reply #55 –

Quote from: emanuele – Try with adding:
Code: [Select]
@media screen and (max-width: 50em) {
	[data-icon]:before {
		height: 1.55em;
		width: 1.55em;
	}
}
To your custom.css.

Great, thanks! Problem solved!  :)