Chrome Developer tools: Capture dynamic styles / state – active, hover, focus, visited

14/04/2017 by

Tech Grafitti!

  • In chrome, press F12 to open the developer tool
  • Click Elements (other items in the main menu will be Network, Sources, Timelines, Profiles, Resources, Audits, Console)
  • Click Styles, so the path is Elements -> Styles (other items in the sub-menu will be Computed, Event Listeners, DOM Breakpoints, Properties)
  • On the extreme right of the developer tools inside Elements -> Styles there are three icons in the filter section (+, pin, diamond)
  • Click the middle Pin icon, Force element state section will appear with check boxes as :active, :hover, :focus, :visited
  • Play with these options to show styles specific to these dynamic CSS styles

View original post

CSS adding word break

14/04/2017 by

Tech Grafitti!

Problem: Sometimes when you design your webpage, your content might be overlapping with the content in another columns

Additional complexity: if you are using CSS flex box – flex-wrap: wrap will only wrap the sections, individual contents cannot be reliably targetted with this.

Precondition: width of the content that needs to be word wrapped must be set using either percentage, em or pixels


  1. Use – word-break: break-all;
    1. break-all will break individual alphabets of the words and everything will wrap around
  2. Use – word-wrap: break-word;
    1. break-word will break the word when the max width will read. Alphabets wil not be wrapped
  3. Use – tex-overflow: ellipsis
    1. Used like: white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    2. This will not wrap words but put ellipsis (…) when the maximum width is reached

View original post

CSS Override defaults: -webkit-focus-ring-color

14/04/2017 by

Tech Grafitti!

Browsers and operating systems have become smarter and more developer and user friendly these days.

In the context of front end UI development, you might have seen the glossy border and outlines in the input fields turning blue (on windows) when you focus on it. This is default behaviour and uses the -webkit-focus-ring-color on the CSS3 focus pseudo class.

:focus {
outline: -webkit-focus-ring-color auto 5px;

This -webkit-focus-ring-color is computed as outline-color: rgb(77, 144, 254)  or (#4d90fe) on my windows 8 browser. But depending on the operating systems or browsers used, this may be computed differently (mac-either graphite or blue).

You should be able to override this default focus color by simple overriding the on focus style for the inputs in question.

SCSS styles:

input[type=”text”], input[type=”email”], input[type=”password”] {
&:focus {
outline: none;
border-color: grey;
box-shadow: 0 0 3px grey;

or add a solid line by overriding css outline attribute:

View original post 41 more words


13/04/2017 by

Source: Home

Data Publication: Sharing, Crediting, and Re-Using Research Data

12/04/2017 by

Source: Data Publication: Sharing, Crediting, and Re-Using Research Data

Data Publication: Sharing, Crediting, and Re-Using Research Data

12/04/2017 by

Data Pub

In the most basic terms- Data Publishing is the process of making research data publicly available for re-use. But even in this simple statement there are many misconceptions about what Data Publications are and why they are necessary for the future of scholarly communications.

Let’s break down a commonly accepted definition of “research data publishing”. A Data Publication has three core features: 1 – data that are publicly accessible and are preserved for an indefinite amount of time, 2 – descriptive information about the data (metadata), and 3 –  a citation for the data (giving credit to the data). Why are these elements essential? These three features make research data reusable and reproducible- the goal of a Data Publication.

Data are publicly accessible and preserved indefinitely

There are many ways for researchers to make their data publicly available, be it within Supporting Information files of a journal article or within…

View original post 886 more words

Embargoing the Term “Embargoes” Indefinitely

12/04/2017 by

Data Pub

I’m two months into a position that lends part of its time to overseeing Dash, a Data Publication platform for the University of California. On my first day I was told that a big priority for Dash was to build out an embargo feature. Coming to the California Digital Library (CDL) from PLOS, an OA publisher with an OA Data Policy, I couldn’t understand why I would be leading endeavors to embargo data and not open it up- so I met this embargo directive with apprehension.

I began to acquaint myself with the campuses and a couple of weeks ago while at UCSF I presented the prototype for what this “embargo” feature would look like and I questioned why researchers wanted to close data on an open data platform. This is where it gets fun.

“Our researchers really just want a feature to keep their data private…

View original post 471 more words

United States Secret Service Reports Steps to Strengthen FOIA Program

22/03/2017 by

Source: United States Secret Service Reports Steps to Strengthen FOIA Program

An island rises from the Bay

20/03/2017 by

U.S. Fish and Wildlife Service Northeast Region

Today we are hearing from Peter McGowan, environmental contaminants biologist at Chesapeake Bay Field Office.

In the 1600s Poplar Island measured about 2,000 acres. In 1874, roughly 1,140 acres remained. When I visited in 1994, less than 10 acres had lasted.

1847 map of Poplar Island (right) that was used as the design footprint for the restoration’s project construction outline.

Poplar Island was a rapidly eroding island complex in Chesapeake Bay, a few miles south of Annapolis, Maryland. The island lost substantial land (13 feet/year) due to erosion, subsidence, and sea level rise over the past 400 years. This is a common theme for Bay islands to this day. I found myself on one of the few remnants of the island as part of a team with USFWS, U.S. Geological Survey, and The University of Maryland working to identify possible stations to monitor the upcoming Poplar Island restoration project –…

View original post 358 more words

Introducing Similarity Search at Flickr

17/03/2017 by

Source: Introducing Similarity Search at Flickr