The brunch-materialistic-arrogantular from row1

difference between repo and demo?

In your demo located here

the grid tiles are styled like this:

<md-grid-tile ng-repeat="gridTitle in homeCtrl.grid" md-rowspan="2" md-colspan="2" md-colspan-sm="1" ng-click="$state.go('posts.detail', { id: gridTitle.id })" class="ng-scope ng-isolate-scope" role="listitem" tabindex="0" style="left: calc(((25% - 6px) + 8px) * 0); width: calc(((25% - 6px) * 2) + 8px); padding-top: calc(((25% - 6px) * 2) + 8px); margin-top: calc(((25% - 6px) + 8px) * 0);"><figure ng-transclude="">
    <img ng-src="http://placehold.it/150/30ac17" class="ng-scope" src="http://placehold.it/150/30ac17">
    <md-grid-tile-footer class="ng-scope"><figcaption ng-transclude="">
      <h3 class="ng-binding ng-scope">accusamus beatae ad</h3>
    </figcaption></md-grid-tile-footer>
  </figure></md-grid-tile>

I'm looking specifically at this code:

style="left: calc(((25% - 6px) + 8px) * 0); width: calc(((25% - 6px) * 2) + 8px); padding-top: calc(((25% - 6px) * 2) + 8px); margin-top: calc(((25% - 6px) + 8px) * 0);"

But in the code that's in the repo, the grid is then styled like this:

<md-grid-tile ng-repeat="gridTitle in homeCtrl.grid" md-rowspan="2" md-colspan="2" md-colspan-sm="2" ng-click="$state.go('posts.detail', { id: gridTitle.id })" class="ng-scope ng-isolate-scope" role="listitem" tabindex="0" style="left: calc(((12.5% - 7px) + 8px) * 0); width: calc(((12.5% - 7px) * 2) + 8px); padding-top: calc(((12.5% - 7px) * 2) + 8px); margin-top: calc(((12.5% - 7px) + 8px) * 0);"><figure ng-transclude="">
    <img ng-src="http://placehold.it/150/30ac17" class="ng-scope" src="http://placehold.it/150/30ac17">
    <md-grid-tile-footer class="ng-scope"><figcaption ng-transclude="">
      <h3 class="ng-binding ng-scope">accusamus beatae ad</h3>
    </figcaption></md-grid-tile-footer>
  </figure></md-grid-tile>

And I'm looking specifically at this code:

style="left: calc(((12.5% - 7px) + 8px) * 0); width: calc(((12.5% - 7px) * 2) + 8px); padding-top: calc(((12.5% - 7px) * 2) + 8px); margin-top: calc(((12.5% - 7px) + 8px) * 0);

So in your demo, the styling uses 25% and the repo I'm coding with uses 12%. I know since these are inline they are being generated by JS - but for some reason, I can't for the life of me, find where these are being set.

If you can point me in the right direction, it would solve a lot of my styling issues in relation to the grid.

Thanks,

Pete

row1 / brunch-materialistic-arrogantular Goto Github PK

brunch-materialistic-arrogantular's People

Contributors

Stargazers

Watchers

Forkers

brunch-materialistic-arrogantular's Issues

difference between repo and demo?

Recommend Projects

React

Vue.js

Typescript

TensorFlow

Django

Laravel

D3

Recommend Topics

javascript

web

server

Machine learning

Visualization

Game

Recommend Org

Facebook

Microsoft

Google

Alibaba

D3

Tencent

Jobs