phvaillant

View GitHub Profile

phvaillant / concept-angular-4.html

Created September 26, 2019 10:32

	<div class="row" ng-init="show=false">
	<div class="col-sm-4">
	<div ng-click="show=!show">
	Display/Hide something on click
	</div>
	</div>
	<div class="col-sm-8" ng-if="show==true">
	<p>
	{{1990-16-01}}: this is a non-formatted date.
	</p>

phvaillant / concept-angular-3.html

Last active September 27, 2019 10:08

	<ods-dataset-context context="nobel,nobelf" nobel-dataset="nobel-prize-laureates" nobel-domain="public" nobel-parameters="{'disjunctive.category':true}" nobelf-dataset="nobel-prize-laureates@public" nobelf-parameters="{'disjunctive.category':true,'refine.gender':'female'}">
	<div ods-aggregation="total, totalf"
	ods-aggregation-total-context="nobel"
	ods-aggregation-total-function="COUNT"
	ods-aggregation-totalf-context="nobelf"
	ods-aggregation-totalf-function="COUNT">
	There have been <strong>{{total}}</strong> laureates of the Nobel prize, but only <strong>{{totalf}}</strong>
	prizes have been awarded to women, which represents <strong>{{totalf/total*100 \| number:2}}%</strong> of the total.
	</div>
	</ods-dataset-context>

phvaillant / concept-angular-2.html

Created September 26, 2019 10:30

	<ods-dataset-context context="nobel" nobel-dataset="nobel-prize-laureates" nobel-domain="public" nobel-parameters="{'disjunctive.category':true}">
	<p>
	Display the filters applied to a dataset. It can be very useful when creating a page because it will help debug the code if necessary.
	</p>
	<ods-facets context="nobel">
	<h3>
	Category
	</h3>
	<ods-facet name="category"></ods-facet>
	</ods-facets>

phvaillant / concept-angular-1.html

Created September 26, 2019 10:28

	<p>Your text: <input ng-model="text"></p>
	<p>Below, the text that you entered:</p>
	<h3>{{text}}</h3>

phvaillant / concept-responsive-4.css

Created February 5, 2019 10:14

	.tallblue {
	background-color: lightblue;
	height: 300px;
	}

phvaillant / concept-responsive-4.html

Created February 5, 2019 10:13

	<div class="row">
	<div class="col-xs-12 col-sm-8 col-md-6 col-lg-4 tallblue">
	<ul>
	<li>I take the whole row if the screen is less than 768px wide</li>
	<li>I take 8 columns if the screen is less than 992px but more than 768px wide</li>
	<li>I take 6 columns if the screen is less than 1200px but more than 992px wide</li>
	<li>I take 4 row if the screen is more than 1200px wide</li>
	</ul>
	</div>
	</div>

phvaillant / concept-responsive-3.html

Created February 5, 2019 10:12

	<div class="row">
	<div class="col-lg-3 col-md-8 col-sm-6 blue">
	I take 3 columns on large screens, 8 on medium, 6 on small, and 12 on very small.
	</div>
	<div class="col-lg-9 col-md-4 col-sm-6 red">
	I take 9 columns on large screens, 4 on medium, 6 on small, and 12 on very small.
	</div>
	</div>

phvaillant / concept-responsive-2.css

Created February 5, 2019 10:11

	.red {
	background-color: salmon;
	height: 100px;
	}

	.blue {
	background-color: lightblue;
	height: 100px;
	}

phvaillant / concept-responsive-2.html

Created February 5, 2019 10:10

	<div class="row">
	<div class="col-xs-6 red">
	col-xs-6
	</div>
	<div class="col-xs-6 blue">
	col-xs-6
	</div>
	</div>
	<div class="row">
	<div class="fixedwidth orange">

phvaillant / concept-responsive.css

Created February 5, 2019 10:09

	.red {
	background-color: salmon;
	height: 100px;
	}

	.blue {
	background-color: lightblue;
	height: 100px;
	}

NewerOlder