Fix: isotope styles cleanup + role fixes (#307)

* Fix: isotope styles cleanup + role fixes

* Fix: remove unused styles

Author: lwasser

.gitignore

@@ -7,3 +7,5 @@ Gemfile.lock
 .DS_Store
 images/full-images/
 all_contribs.pickle
+.vale.ini
+styles/*

_data/contributors.yml

@@ -112,7 +112,7 @@
 - name: Carol Willing
   github_username: willingc
   github_image_id: 2680980
-  title:
+  title: Advisory Council
   sort:
   bio: Project Jupyter, nteract, and CPython core developer@python | @jupyter |
       @jupyterhub | @ipython | @nteract | @pysplash
@@ -127,6 +127,7 @@
   website: https://hachyderm.io/web/@willingc
   board: false
   contributor_type:
+    - leadership
     - code-contrib
     - guidebook-contrib
     - peer-review
@@ -142,7 +143,7 @@
 - name: Erin Robinson
   github_username: erinmr
   github_image_id: 2915555
-  title:
+  title: Advisory Council
   sort:
   bio:
   organization:
@@ -165,7 +166,7 @@
 - name: Chris Holdgraf
   github_username: choldgraf
   github_image_id: 1839645
-  title:
+  title: Advisory Council
   sort:
   bio: I work with Project Jupyter and other open communities to build tools and
       solve problems for scientific research and education.
@@ -193,7 +194,7 @@
 - name: Inessa Pawson
   github_username: InessaPawson
   github_image_id: 43481325
-  title:
+  title: Advisory Council
   sort:
   bio: NumPy Contributor Experience LeadOpen Source Program Manager at OpenTeams
       Incubator
@@ -218,7 +219,7 @@
 - name: Pradyun Gedam
   github_username: pradyunsg
   github_image_id: 3275593
-  title:
+  title: Advisory Council
   sort:
   bio: "@pypa member, @psf fellow, @toml-lang core, @sphinx-doc contributor. Past
       intern at @enthought and IITB.Don't email or tweet me for tech support."
@@ -233,6 +234,7 @@
   website: https://pradyunsg.me
   board: false
   contributor_type:
+    - leadership
     - guidebook-contrib
     - package-guide
   packages_editor:
@@ -243,7 +245,7 @@
 - name: Leonardo Uieda
   github_username: leouieda
   github_image_id: 290082
-  title:
+  title: Advisory Council
   sort:
   bio: Geophysicist investigating Earth's gravity & magnetic fields from global
       to microscopic scale 🛰️🔬🌎
@@ -258,6 +260,7 @@
   website: https://www.leouieda.com
   board: false
   contributor_type:
+    - leadership
   packages_editor:
   packages_submitted:
   packages_reviewed:
@@ -267,6 +270,7 @@
   github_username: xmnlab
   github_image_id: 5209757
   title:
+    - Advisory Council
     - Emeritus editor
   sort: 1
   bio: Open Source Developer
@@ -304,7 +308,9 @@
 - name: Filipe
   github_username: ocefpaf
   github_image_id: 950575
-  title: Editor
+  title:
+    - Advisory Council
+    - Editor
   sort: 2
   bio: Filipe Fernandes is a Physical oceanographer by training, turned research
       software engineer, and a software packager hobbyist.
@@ -336,7 +342,7 @@
 - name: Lindsey Heagy
   github_username: lheagy
   github_image_id: 6361812
-  title:
+  title: Advisory Council
   sort:
   bio: Asst. Prof at UBC EOAS. Researcher working on geophysical simulations and
       inversions (in @simpeg!) and data science.
@@ -360,7 +366,7 @@
 - name: Martin Fleischmann
   github_username: martinfleis
   github_image_id: 36797143
-  title:
+  title: Advisory Council
   sort:
   bio: Researcher in geographic data science. Member of @geopandas and @pysal development
       teams.
@@ -387,7 +393,7 @@
 - name: Yuvi Panda
   github_username: yuvipanda
   github_image_id: 30430
-  title:
+  title: Advisory Council
   sort:
   bio:
   organization: '@2i2c-org'
@@ -412,7 +418,7 @@
 - name: Chase Million
   github_username: cmillion
   github_image_id: 1483210
-  title:
+  title: Advisory Council
   sort:
   bio:
   organization:
@@ -426,6 +432,7 @@
   website:
   board: false
   contributor_type:
+    - leadership
   packages_editor:
   packages_submitted:
   packages_reviewed:

_pages/contributors.md

@@ -67,20 +67,19 @@ pyOpenSci has a diverse and vibrant community of pythonistas! To date,
 
 <div id="filters" class="button-group">
   <button class="button is-checked" data-filter="*">Show All</button>
-  <button class="button" data-filter=".leadership">Leadership/Advisory</button>
-  <button class="button" data-filter=".editor">Editors / Editorial Team</button>
+  <button class="button" data-filter=".leadership">Leadership</button>
+  <button class="button" data-filter=".editor">Editorial Team</button>
   <button class="button" data-filter=".reviewer">Reviewers</button>
   <button class="button" data-filter=".maintainer">Maintainers</button>
   <button class="button" data-filter=".peer-review-guide">Peer Review Guide</button>
   <button class="button" data-filter=".package-guide">Packaging Guide</button>
   <button class="button" data-filter=".metrics-contrib">Metrics</button>
   <button class="button" data-filter=".web-contrib">Website</button>
 
-  <!-- <button class="button" data-filter=":not(.transition)">not transition</button>
-  <button class="button" data-filter=".metal:not(.transition)">metal but not transition</button> -->
 </div>
 
 <div class="grid-isotope">
+ <div class="grid-sizer"></div>
 {% for aperson in ppl_sorted %}
   {% include people-grid.html %}
 {% endfor %}

_sass/minimal-mistakes/_pyos-isotope.scss

@@ -12,6 +12,8 @@ input[type="text"] {
   font-size: 20px;
 }
 
+
+
 /* ---- button ---- */
 
 .button {
@@ -73,12 +75,11 @@ input[type="text"] {
 /* ---- grid ---- */
 
 
-/* clear fix */
-// .grid:after {
-//   content: '';
-//   display: block;
-//   clear: both;
-// }
+/* Layout */
+.grid-sizer {
+  width: 22%;
+}
+
 
 /* ---- .element-item ---- */
 
@@ -90,64 +91,18 @@ input[type="text"] {
   position: relative;
   float: left;
   //height: 400px;
-  width: calc(30% - 13.3px);
+  width: calc(23% - 13.3px);
   margin: 5px;
   padding: 10px;
 }
 
-.grid-sizer {
-  width: 30%;
-}
 @media screen and (max-width:1199px) {
   .element-item {
-   width:calc( 50% - 10px);
+   width:calc(30% - 10px);
   }
  }
 
 .element-item > * {
   margin: 0;
   padding: 0;
 }
-
-.element-item .name {
-  position: absolute;
-  left: 10px;
-  top: 60px;
-  text-transform: none;
-  letter-spacing: 0;
-  font-size: 12px;
-  font-weight: normal;
-}
-
-.element-item .symbol {
-  position: absolute;
-  left: 10px;
-  top: 0px;
-  font-size: 42px;
-  font-weight: bold;
-  color: white;
-}
-
-.element-item .number {
-  position: absolute;
-  right: 8px;
-  top: 5px;
-}
-
-.element-item .weight {
-  position: absolute;
-  left: 10px;
-  top: 76px;
-  font-size: 12px;
-}
-
-.element-item.alkali          { background: #F00; background: hsl(   0, 100%, 50%); }
-.element-item.alkaline-earth  { background: #F80; background: hsl(  36, 100%, 50%); }
-.element-item.lanthanoid      { background: #FF0; background: hsl(  72, 100%, 50%); }
-.element-item.actinoid        { background: #0F0; background: hsl( 108, 100%, 50%); }
-.element-item.transition      { background: #0F8; background: hsl( 144, 100%, 50%); }
-.element-item.post-transition { background: #0FF; background: hsl( 180, 100%, 50%); }
-.element-item.metalloid       { background: #08F; background: hsl( 216, 100%, 50%); }
-.element-item.diatomic        { background: #00F; background: hsl( 252, 100%, 50%); }
-.element-item.halogen         { background: #F0F; background: hsl( 288, 100%, 50%); }
-.element-item.noble-gas       { background: #F08; background: hsl( 324, 100%, 50%); }

assets/js/dropdown.js

@@ -47,8 +47,8 @@ var $grid = $('.grid-isotope').imagesLoaded( function() {
     itemSelector: '.element-item',
     layoutMode: 'masonry',
     masonry: {
-      columnWidth: 80,
-      horizontalOrder: false,
+      columnWidth: 100,
+      horizontalOrder: true,
     },
     filter: function() {
       var $this = $(this);