Difference between revisions of "Studio 65"

From wiki
Jump to navigation Jump to search
(Created page with "<html> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1, use...")
 
 
(One intermediate revision by the same user not shown)
Line 1: Line 1:
 
<html>
 
<html>
  
<head>
+
<style>
    <meta charset="utf-8">
 
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
 
    <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
 
    <!-- The above 3 meta tags *must* come first in the head;
 
    any other head content must come *after* these tags -->
 
    <title>TBS Experimental Gov</title>
 
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
 
    <link rel="stylesheet" href="styles_v2.css">
 
    <link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet" integrity="sha384-wvfXpqpZZVQGK6TAh5PVlGOfQNHSoD2xbE+QkPxCAFlNEevoEH3Sl0sibVcOQVnN" crossorigin="anonymous">
 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
 
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/masonry/4.2.0/masonry.pkgd.js"></script>
 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.isotope/3.0.4/isotope.pkgd.js"></script>
 
</head>
 
  
<body>
 
  
    <section class="super-body">
 
  
        <nav class="navbar navbar-inverse navbar-fixed-top">
 
            <div class="container">
 
                <div class="navbar-header">
 
                    <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
 
                        <span class="sr-only">Toggle navigation</span>
 
                        <span class="icon-bar"></span>
 
                        <span class="icon-bar"></span>
 
                        <span class="icon-bar"></span>
 
                      </button>
 
                    <a class="navbar-brand" href="Experimentation_FR">
 
                            <img class="logo" src="http://www.gcpedia.gc.ca/gcwiki/images/9/92/Gc-exp-logo.svg" type="image/svg">
 
                    </a>
 
                </div>
 
  
                <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
+
.navigationBar {
                    <!-- Begin MailChimp Signup Form -->
 
                    <form class="navbar-form navbar-left" action="//twitter.us16.list-manage.com/subscribe/post?u=1be51ad6596702f823a797a96&amp;id=2ec8dfa411" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
 
                        <div class="input-group input-mailchimp">
 
                            <input class="form-control" type="email" value="" name="EMAIL" class="email" id="mce-EMAIL" placeholder="Abonnez-vous à notre liste d’envoi" required>
 
                            <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
 
                            <div style="position: absolute; left: -5000px;" aria-hidden="true"><input type="text" name="b_1be51ad6596702f823a797a96_2ec8dfa411" tabindex="-1" value=""></div>
 
                            <span class="input-group-btn">
 
                            <button type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="btn btn-default">Inscription</button>
 
                            </span>
 
                        </div>
 
                    </form>
 
                    <!--End mc_embed_signup-->
 
                      <ul class="nav navbar-nav navbar-right">
 
                        <li><a href="http://www.gcpedia.gc.ca/wiki/Experimentation_FR">Accueil</a></li>
 
                        <li class="dropdown">
 
                            <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Commencez ici<span class="caret"></span></a>
 
                            <ul class="dropdown-menu">
 
                                <li><a href="http://www.gcpedia.gc.ca/wiki/Experimentation_Why_experiment_December_2016_Directive_FR">Directives relatives à l’expérimentation</a></li>
 
                                <li><a href="http://www.gcpedia.gc.ca/wiki/Experimentation_Guidance_and_Tools_Understanding_experimental_government_FR">Comprendre le gouvernement expérimental</a></li>
 
                                <li><a href="http://www.gcpedia.gc.ca/wiki/Experimentation_GoC_at_a_glance_FR" target="_blank">Aperçu du GC</a></li>
 
                                <li><a href="http://www.gcpedia.gc.ca/wiki/Nouveaux_Instruments_et_Approches_de_la_Politique"target="_blank">Nouveaux Instruments et Approches de la Politique</a></li>
 
                            </ul>
 
                        </li>
 
                        <li class="dropdown">
 
                      <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Contactez-nous<span class="caret"></span></a>
 
                            <ul class="dropdown-menu">
 
                                <li><a href="http://www.gcpedia.gc.ca/wiki/Experimentation_About_us_FR">À propos</a></li>
 
                                <li><a href="http://www.gcpedia.gc.ca/wiki/Experimentation_Connect_Get_in_touch_FR">Contactez-nous</a></li>
 
                            </ul>
 
                        </li>
 
                        <li><a href="http://www.gcpedia.gc.ca/wiki/Experimentation">EN</a></li>
 
                    </ul>
 
                </div>
 
            </div>
 
        </nav>
 
  
        <!-- content -->
+
        <section class="index">
+
            <div class="container">
+
text-align: left;
                <h5 class="filter-subtitle"><img src="http://www.gcpedia.gc.ca/gcwiki/images/3/31/Tbs-gcexp-filter.svg"> Sélectionnez un filtre:</h5>
+
background-color:#333;
                <div class="btn-group button-group filter-button-group">
+
font-size:16px;
                    <button class="btn btn-default  button is-checked" data-filter="*">Tous</button>
+
font-family: Arial
                    <button class="btn btn-default  button" data-filter=".events">Événements</button>
+
                    <button class="btn btn-default  button" data-filter=".guidance">Orientation</button>
 
                    <button class="btn btn-default  button" data-filter=".resources">Ressources</button>
 
                </div>
 
  
                <div class="grid">
 
                    <div class="grid-sizer"></div>
 
                    <!-- tile 1 -->
 
                    <a href="http://www.gcpedia.gc.ca/wiki/Experimentation_Update_log_FR" class="grid-item grid-item--width2 tools tile-1">
 
                        <span class="text-center">
 
                          <img src="http://www.gcpedia.gc.ca/gcwiki/images/f/f8/Tbs-gcexp-examples.svg">
 
                            <h3>Journal de mise à jour de l'expérimentation</h3>
 
                        </span>
 
                    </a>
 
                    <!-- tile 2 -->
 
                    <a href="http://www.gcpedia.gc.ca/wiki/Experimentation_Guidance_and_Tools_Research_methods_FR" class="grid-item grid-item--height2 guidance tile-2">
 
                        <span class="text-center">
 
                          <img src="http://www.gcpedia.gc.ca/gcwiki/images/2/29/Tbs-gcexp-research-methods.svg">
 
                        <h3>Méthodes de recherche</h3>
 
                        </span>
 
                    </a>
 
                    <!-- tile 3 -->
 
                    <a href="http://www.gcpedia.gc.ca/wiki/Experimentation_Guidance_and_Tools_FAQs_FR" class="grid-item guidance tile-3">
 
                        <span class="text-center">
 
                          <img src="http://www.gcpedia.gc.ca/gcwiki/images/e/e5/Tbs-gcexp-faq.svg">
 
                        <h3>FAQ</h3>
 
                        </span>
 
                    </a>
 
                    <!-- tile 4 -->
 
                    <a href="http://www.gcpedia.gc.ca/wiki/Experimentation_Guidance_and_Tools_Case_studies_FR" class="grid-item resources tile-4">
 
                        <span class="text-center">
 
                          <img src="http://www.gcpedia.gc.ca/gcwiki/images/e/e4/Tbs-gcexp-practitioner-fingerprint.svg">
 
                        <h3>Aperçu des ministères et études de cas</br></h3>
 
                        </span>
 
                    </a>
 
                    <!-- tile 5 -->
 
                    <a href="http://www.gcpedia.gc.ca/wiki/Experimentation_Guidance_and_Tools_Understanding_experimental_government_FR" class="grid-item guidance tile-5">
 
                        <span class="text-center">
 
                          <img src="http://www.gcpedia.gc.ca/gcwiki/images/f/fa/Tbs-gcexp-experimental-government.svg">
 
                        <h3>Comprendre le gouvernement expérimental</h3>
 
                        </span>
 
                    </a>
 
                    <!-- tile 6 -->
 
                    <a href="http://www.gcpedia.gc.ca/wiki/Experimentation_Connect_Events_and_Activities_FR" class="grid-item events tile-6">
 
                        <span class="text-center">
 
                          <img src="http://www.gcpedia.gc.ca/gcwiki/images/5/5a/Tbs-gcexp-event.svg">
 
                        <h3>Évènements, activités & opportunités de partenariat</h3>
 
                        </span>
 
                    </a>
 
                    <!-- tile 7 -->
 
                    <a href="http://www.gcpedia.gc.ca/wiki/Experimentation_Experimentation_Works_Cohort1_FR" class="grid-item tools tools tile-7">
 
                        <span class="text-center">
 
                          <img src="http://www.gcpedia.gc.ca/gcwiki/images/a/a2/240px-Beaker.svg-iloveimg-resized.png">
 
                        <h3>L’expérimentation à l’œuvre (nouveau!)</h3>
 
                        </span>
 
                    </a>
 
                    <!-- tile 8 -->
 
                    <a href="http://www.gcpedia.gc.ca/wiki/Experimentation_Community_ADM_Committee_FR" class="grid-item resources tile-8">
 
                        <span class="text-center">
 
                          <img src="http://www.gcpedia.gc.ca/gcwiki/images/6/69/Tbs-gcexp-adm-committee.svg">
 
                        <h3>Comité des SMA sur l’expérimentation</h3>
 
                        </span>
 
                    </a>
 
                    <!-- tile 9 -->
 
                    <a href="http://www.gcpedia.gc.ca/wiki/Experimentation_Why_experiment_December_2016_Directive_FR" class="grid-item grid-item--width3 guidance tile-8">
 
                        <span class="text-center">
 
                          <img src="http://www.gcpedia.gc.ca/gcwiki/images/0/0d/Tbs-gcexp-directive.svg">
 
                        <h3>Directives relatives à l’expérimentation</h3>
 
                        </span>
 
                    </a>
 
                    <!-- tile 10 -->
 
                    <a href="http://www.gcpedia.gc.ca/wiki/Experimentation_Guidance_and_Tools_Further_reading_FR" class="grid-item grid-item--height2 guidance tile-10">
 
                        <span class="text-center">
 
                          <img src="http://www.gcpedia.gc.ca/gcwiki/images/e/e0/Tbs-gcexp-further-reading.svg">
 
                        <h3>Lectures supplémentaires suggérées</h3>
 
                        </span>
 
                    </a>
 
                    <!-- tile 11 -->
 
                    <a href="http://www.gcpedia.gc.ca/wiki/Experimentation_Why_experiment_March_2017_Generic_Terms_and_Conditions_FR" class="grid-item grid-item--width3 guidance tile-9">
 
                        <span class="text-center">
 
                          <img src="http://www.gcpedia.gc.ca/gcwiki/images/7/78/Tbs-gcexp-transfers.svg">
 
                        <h3>Les modalités génériques – Paiements de transfert novateurs</h3>
 
                        </span>
 
                    </a>
 
                </div>
 
  
            </div>
 
        </section>
 
  
    <script>
+
padding:0;
        $(document).ready(function() {
+
margin: 0;
            // init Isotope
+
list-style-type: none;
            var $grid = $('.grid');
+
list-style:none;
            $grid.isotope({
+
width: 97%;
                // options
+
}
                itemSelector: '.grid-item'
 
            });
 
            // filter items on button click
 
            $('.filter-button-group').on('click', 'button', function() {
 
                var filterValue = $(this).attr('data-filter');
 
                $grid.isotope({
 
                    filter: filterValue
 
                });
 
            });
 
  
            $('.grid').masonry({
 
                // options...
 
                // set itemSelector so .grid-sizer is not used in layout
 
                itemSelector: '.grid-item',
 
                // use element for option
 
                columnWidth: '.grid-sizer',
 
                percentPosition: true
 
            });
 
        });
 
  
    </script>
 
  
</body>
+
.navigationBar li a:hover{
 +
 
 +
 
 +
 +
background-color: #111 !important;
 +
color: #fff;
 +
 +
 +
}
 +
 
 +
.navigationBar li a:focus {
 +
 
 +
 +
 +
background-color: #111 !important;
 +
 +
 +
 +
}
 +
 
 +
.navigationBar li {
 +
display:inline-block;
 +
}
 +
 
 +
.navigationBar li a {
 +
display:block;
 +
text-decoration: none;
 +
color: #FFF !important;
 +
padding: 20px;
 +
}
 +
 
 +
   
 +
</style>
 +
 
 +
<ul class="navigationBar">
 +
    <li><a href="#">Home</a></li>
 +
    <li><a href="#">Portfolio</a></li>
 +
    <li><a href="#">Event</a></li>
 +
    <li><a href="#">Gallery</a></li>
 +
    <li><a href="#">Contact</a></li>
 +
</ul>
  
 
</html>
 
</html>
{{tbs-exp-gov css}}
 

Latest revision as of 11:45, 3 June 2019

<html>

<style>



.navigationBar {


text-align: left; background-color:#333; font-size:16px; font-family: Arial



padding:0; margin: 0; list-style-type: none; list-style:none; width: 97%; }


.navigationBar li a:hover{


background-color: #111 !important; color: #fff;


}

.navigationBar li a:focus {


background-color: #111 !important;


}

.navigationBar li { display:inline-block; }

.navigationBar li a { display:block; text-decoration: none; color: #FFF !important; padding: 20px; }


</style>

</html>