Mudando a posição da foto do resumo da postagem.

[sm-silva]

Antes

---

Depois

---

Adicione o pacote [email protected] a seu projeto.

Navegue para /app/components/cards/PostSummary.jsx e adicone aos imports import MediaQuery from 'react-responsive';

E procure por

{thumb ? (
 <div className="articles__content-block articles__content-block--img">
<Link className="articles__link" to={post_url}>
{thumb}
</Link>
 </div>
) : null}

Adicione <MediaQuery query="(max-width: 800px)"> antes e adicione </MediaQuery> no final desse codigo.

---

Agora procure por

{reblogged_by}
{crossPostedBy}
{summary_header}

e adicione antes desses três elementos:

<MediaQuery query="(min-device-width: 801px)">
                {thumb ? (
                        <div className="articles__content-block articles__content-block--img">
                            <Link className="articles__link" to={post_url}>
                                {thumb}
                            </Link>
                        </div>
                    ) : null}
                </MediaQuery>

---

Editando CSS

Vá para app/assets/stylesheets/app.scss e adicione:

@media screen and (min-width: 51em){
  .articles__content-block.articles__content-block--img{
    float: left;
    margin-top: 15px;
  }
}

caso seja necessario, adicione tambem:

@media screen and (max-width: 50em) {
  body {
    font-size: 86%;
  }
  .articles__content-block.articles__content-block--img{
    float: none;
    margin-top: 0px;
  }
}

Indice de Posts

Comments

[hivebuzz]

Congratulations @sm-silva! You have completed the following achievement on the Hive blockchain and have been rewarded with new badge(s) :

You distributed more than 19000 upvotes. Your next target is to reach 20000 upvotes.

_{You can view your badges on your board and compare yourself to others in the Ranking
If you no longer want to receive notifications, reply to this comment with the word STOP}

Check out the last post from @hivebuzz:

Hive Tour Update - Governance

Support the HiveBuzz project. Vote for our proposal!