I am unable to implement angular deckgrid

[mroker242]

I've tried using the template, not using it, moving the scripts on the bottom of the body and also in the head. I have added the depency. I have and object pretty much the same as the demo there. However nothing is showing up on the screen for title. The only error I'm getting in the console is angular-deckgrid: No CSS configuration found. Please help!

var myApp = angular.module('myApp',['akoenig.deckgrid']);

$scope.photos = [ {title: 'something here',src: "Images/ipsum/one.jpg"}, {title: 'another picture', src: "Images/ipsum/two.jpg"}, {title: 'another picture', src: "Images/ipsum/three.jpg"}, {title: 'another picture', src: "Images/ipsum/four.jpg"}, {title: 'another picture', src: "Images/ipsum/five.jpg"}, {title: 'another picture', src: "Images/ipsum/six.jpg"} ];

   <div ng-controller="mainController">
         <div deckgrid class="deckgrid" source="photos">
             <div class="a-card">
                <h1>{{card.title}}</h1>
               <img src="" data-ng-src="{{card.src}}">
             </div>
        </div>
   </div>

[Citrullin]

Read the Readme before you post an issue :) You have to add the CSS :D Like this:

@media screen and (max-width: 480px){ .deckgrid[deckgrid]::before { content: '1 .column.column-1-1'; }

.deckgrid .column-1-1 {
    width: 100%;
}

}

With content: '1 .column.column-1-1'; you can say how many columns do you want to have. This is what the first 1 means. The .column.column-1-1 is only CSS Selector for you CSS.

An Example with 3 Columns:

@media screen and (max-width: 800px){ .deckgrid[deckgrid]::before { content: '3 .column.column-1-3'; }

.deckgrid .column-1-3 {
    width: 33%;
}

}

[mroker242]

Yes, this was added.... still doesn't work. Thanks for your prompt response however.

[mroker242]

works now! Sorry for not pasting that css. Now I will have some major configuring to do! :):):)

[Citrullin]

You have to define this for every screen size :D

[mroker242]

Do you have any good sample css? I am using big pictures and it just doesn't look good :/

[Citrullin]

For big Picutures: No. Test it with Media Quries :) I think it is the best you can do :)

[mroker242]

ok, much thanks.