Skip to content

Instantly share code, notes, and snippets.

@Ratko-Solaja
Created December 3, 2016 13:15
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save Ratko-Solaja/40f064ee5103da0830d769be56dadb2b to your computer and use it in GitHub Desktop.
Save Ratko-Solaja/40f064ee5103da0830d769be56dadb2b to your computer and use it in GitHub Desktop.
Saved items styling.
/**
* Saved Items
*/
.toptal-saved-items {
overflow: hidden;
margin: 25px 0;
}
.toptal-saved-items .toptal-saved-item {
position: relative;
overflow: hidden;
padding: 0 30px 25px 0;
margin: 0 0 30px 0;
border-bottom: 1px solid #999;
}
.toptal-saved-items .toptal-saved-item:last-of-type {
margin: 0;
border-bottom: none;
}
.toptal-saved-items .toptal-saved-item a.toptal-save-button {
position: absolute;
top: 0;
right: 5px;
}
.toptal-saved-items .toptal-saved-item a.toptal-save-button span.toptal-save-text {
display: none;
}
.toptal-saved-items .toptal-saved-item .toptal-saved-dp-table {
display: table;
width: 100%;
}
.toptal-saved-items .toptal-saved-item .toptal-saved-dp-table .toptal-saved-dp-table-cell {
display: table-cell;
vertical-align: top;
}
.toptal-saved-items .toptal-saved-item .toptal-saved-dp-table .toptal-saved-dp-table-cell.cell-thumbnail {
width: 115px;
font-size: 0;
line-height: 0;
}
.toptal-saved-items .toptal-saved-item .toptal-saved-dp-table .toptal-saved-dp-table-cell.cell-thumbnail a {
display: inline-block;
max-width: 95px;
}
.toptal-saved-items .toptal-saved-item .toptal-saved-dp-table .toptal-saved-dp-table-cell.cell-content {
width: calc(100% - 115px);
}
.toptal-saved-items .toptal-saved-item .toptal-saved-dp-table.toptal-saved-no-thumbnail .toptal-saved-dp-table-cell.cell-content {
width: 100%;
}
@media only screen and (max-width: 580px) {
.toptal-saved-items .toptal-saved-item .toptal-saved-dp-table .toptal-saved-dp-table-cell.cell-thumbnail {
display: none;
}
.toptal-saved-items .toptal-saved-item .toptal-saved-dp-table .toptal-saved-dp-table-cell.cell-content {
width: 100%;
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment