To simplify theme selection and guarantee compatibility with our most recent features, we will be archiving older themes that have been superseded by newer versions or whose functionalities have been integrated into other themes. These new versions of the themes retain the overall aesthetic of the previous ones while incorporating our latest features.
Which themes are getting archived:
Signage
- Archived Classic
- Archived Square Photo
- Archived Tall Photo
- Archived News
- Archived Gem
- Archived Atmosphere
- Legacy Classic
- Legacy Waterfall (most similar to classic with autoscroll)
- Legacy Horizontal
Web Embed
- Archived Classic
- Archived Horizontal Slider
- Archived Square Photo
- Archived Tall Photo
- Archived News
- Legacy Classic
- Legacy Waterfall
- Legacy Horizontal
What does this mean for you:
Your existing personalization on an old theme will continue to function for now. However, if you decide to create a new personalization, the old versions will no longer be available for selection in the dropdown list.
Before switching from your current old theme to a different one, please be aware that you won't be able to revert to the archived or legacy theme afterward as it will disappear from the list once a new theme has been selected. To visualize how your TINT board would appear on a different or newer version of the theme, consider duplicating the personalization first.
To duplicate your personalization:
- Click on … next to the personalization that you would like to duplicate
- Click Duplicate
- This will bring up a popup box to name your new personalization
- Click on Create
- Your new personalization will feature in the list and all you have to do is edit the new one to your requirements.
Most commonly used CSS
This collection of CSS snippets represents the most commonly used CSS styles in our database. We will continue to add to this collection as new requests arise. If you have older CSS code from previous theme versions that you would like to migrate to the new version, please submit your request and we will investigate whether there is an equivalent CSS available for the new theme.
What CSS | Subject | Archived Classic | Classic |
Hiding the Add a Post button | Add a Public Post Button | .btn.public-add-post{display:none;} | .button { visibility: hidden;} |
Change an author image on a post (changes it all authors to the same image) | Author image |
.post-acct-img {content: url(INSERTURL); width: 24px; height: 24px;} |
.post-avatar--circle.false.loaded {content: url(INSERTURLHERE); } |
Change an author image on a popup (changes it all authors to the same image) | Author image | ._71n7_author_image { content: url(INSERTURL); } |
.post-avatar--popup-circle.false {content: url(INSERTURLHERE); } |
Removal of author image (grey man) on a post | Author image | .post-acct-img { visibility: hidden; } |
.post-avatar--circle.false.loaded { visibility: hidden; } |
Removal of author image (grey man) on a popup | Author image | ._71n7_author_image{ visibility: hidden; } |
.post-avatar--popup-circle{ visibility: hidden; } |
Changing the font/size of the Author Name on a popup | Author name | ._71n7_author_name {font-size: 20px; font-family: 'insertfont'!important; |
.post-author__author-name-popup { font-size: 20px; font-family: 'insertfont'!important;} |
Changing the font/size of the Author Username on a popup | Author Username | .author_username { font-size: 20px; font-family: 'insertfont'!important; } |
.post-author__username-popup { font-size: 12px; font-family: 'insertfont'!important;} |
Changing the font on the Click for More button | Click for More Button | .click-for-more.button { font-family: 'insertfont'!important; } |
.click-for-more.button { font-family: 'insertfont'!important; } |
Changing the language on the Click for More button | Click for More Button | .click-for-more:after { content: 'insertlabel'; } |
.click-for-more:after { content: 'insertlabel'; } |
Changing the color of Instagram logo | .post .post-type-icon i.fa-instagram { color: insertcolor; } | .fa-instagram {color: insertcolor; } | |
Removal of Instagram | .post .post-type-icon i.fa-instagram {visibility: hidden; } |
.fa-instagram {visibility: hidden; } |
|
Better look on Mobiles - Max | Mobile View | @media screen and (max-width : XXXpx) | @media screen and (max-width : XXXpx) |
Better look on Mobiles - Min | Mobile View | @media screen and (min-width : XXXpx) | @media screen and (min-width : XXXpx) |
Removal of the Navigation bar | Navigation bar | #collectionHolder { display: none;} |
.nav__list {display:none;} |
Removing clicks on pop-ups | Popup | ._71n7_title, ._71n7_author_timeago {pointer-events: none; } | N/A |
Rounding the corners on a post | Post look | .image img{border-radius:50px;} .post-image{border-radius:50px;} | .image img { border-top-left-radius: 50px; border-top-right-radius: 50px;} .classic-post { border-radius: 50px;} .post-image-wrapper>svg { top: 35px; right: 35px; } |
Change the color of the background of a post on Old Classic Theme | Post look | .post { background-color: #ffffff } |
N/A |
Changing the font/size of the Timestamp on a popup | Time Stamp | ._71n7_author_timeago {font-size: 20px; font-family: 'insertfont'!important; } |
.popup-post-time { font-size: 12px; font-family: 'GreatVibes-Regular.otf'!important;} |
What CSS | Subject | Archived Square Photo | Square Photo |
Hiding the Add a Post button | Add a Public Post Button | .btn.public-add-post{display:none;} | .add-post.button{display:none;} |
Change an author image on a popup (changes it all authors to the same image) | Author image | ._71n7_author_image { content: url(INSERTURLHERE); } |
.post-avatar--popup-circle.false {content: url(INSERTURLHERE); } |
Removal of author image (grey man) on a popup | Author image | ._71n7_author_image {display:none; } |
.post-avatar--popup-circle.false {display:none; } |
Changing the font/size of the Author Name on a popup | Author name | ._71n7_author_name {font-size: 20px; font-family: 'insertfont'!important; |
.post-author__author-name-popup { font-size: 20px; font-family: 'insertfont'!important;} |
Changing the font/size of the Author Username on a popup | Author Username | .author_username { font-size: 20px; font-family: 'insertfont'!important; } |
.post-author__username-popup { font-size: 12px; font-family: 'insertfont'!important;} |
Changing the font on the Click for More button | Click for More Button | .nextPost {font-size: 20px; font-family: 'insertfont'!important; } |
.click-for-more.button { font-family: 'insertfont'!important; } |
Changing the language on the Click for More button | Click for More Button | .nextPost {content: 'insertlabel'; } |
.click-for-more:after { content: 'insertlabel'; } |
Changing the color of Instagram logo | .fab.fa-instagram{color:black !important;} | .svg-inline--fa fa-instagram fa-w-14 fa-lg source-icon{color:'color';} | |
Removal of Instagram logo | .fab.fa-instagram{display:none;} | .svg-inline--fa fa-instagram fa-w-14 fa-lg source-icon{display:none;} | |
Better look on Mobiles - Max | Mobile View | @media screen and (max-width : XXXpx) | @media screen and (max-width : XXXpx) |
Better look on Mobiles - Min | Mobile View | @media screen and (min-width : XXXpx) | @media screen and (min-width : XXXpx) |
Removal of the Navigation bar | Navigation bar | #collectionHolder { display: none; } |
.nav{display:none;} |
Rounding the corners on a post | Post look | N/A | .square-photo-post__content{border-radius:50px;} |
Removal of the hover | Post look | .post-title color-namebar-buttons color-namebar-buttons-rgba font-secondary fontsize-secondary fontcolor_post{display:none;} | .post-title__title.post-title__title--line-clamp {display:none;} .square-photo-post__header-cover {background-color:transparent !important;} |
Changing the font/size of the Timestamp on a popup | Time Stamp | ._71n7_author_timeago {font-size: 20px; font-family: 'insertfont'!important; } |
.popup-post-time { font-size: 12px; font-family: 'insertfont'!important;} |
What CSS | Subject | Archived Tall Photo | Tall Photo |
Hiding the Add a Post button | Add a Public Post Button | .btn.public-add-post{display:none;} | .add-post.button{display:none;} |
Change an author image on a post (changes it all authors to the same image) | Author image |
.post-author-image {content: url(inserturl); }
|
.post-avatar--circle.false.loaded {content: url(inserturl); } |
Change an author image on a popup (changes it all authors to the same image) | Author image | ._71n7_author_image { content: url(inserturl); } |
.post-avatar--popup-circle.false {content: url(inserturl); } |
Removal of author image (grey man) on a post | Author image | .post-author-image { visibility: hidden; } |
.post-avatar--circle.false.loaded { visibility: hidden; } |
Removal of author image (grey man) on a popup | Author image | ._71n7_author_image {display:none; } |
.post-avatar--popup-circle{ visibility: hidden; } |
Changing the font/size of the Author Name on a popup | Author name | ._71n7_author_name {font-size: 20px; font-family: 'insertfont'!important; |
.post-author__author-name-popup { font-size: 20px; font-family: 'insertfont'!important;} |
Changing the font/size of the Author Username on a popup | Author Username | .author_username { font-size: 20px; font-family: 'insertfont'!important; } |
.post-author__username-popup { font-size: 12px; font-family: 'insertfont'!important;} |
Changing the font on the Click for More button | Click for More Button | .nextPost {font-size: 20px; font-family: 'insertfont'!important; } |
.click-for-more.button { font-family: 'insertfont'!important; } |
Changing the language on the Click for More button | Click for More Button | .nextPost {content: 'insertlabel'; } |
.click-for-more:after { content: 'insertlabel'; } |
Changing the color of Instagram logo | .fab.fa-instagram{color:black !important;} | .svg-inline--fa fa-instagram fa-w-14 fa-lg source-icon{color:'color';} | |
Removal of Instagram | .fab.fa-instagram{display:none;} | .svg-inline--fa fa-instagram fa-w-14 fa-lg source-icon{display:none;} | |
Better look on Mobiles - Max | Mobile View | @media screen and (max-width : XXXpx) | @media screen and (max-width : XXXpx) |
Better look on Mobiles - Min | Mobile View | @media screen and (min-width : XXXpx) | @media screen and (min-width : XXXpx) |
Removal of the Navigation bar | Navigation bar | #collectionHolder { display: none; } |
.nav{display:none;} |
Rounding the corners on a post | Post look | N/A | .image.theme-image.image--normal.image--loaded{ border-radius:50px;} |
Removal of Hover | Post look | N/A | .tall-photo-post__header-cover {background-color:transparent !important;} .tall-photo-post:hover .tall-photo-post__header .post-title {display:none;} .tall-photo-post__header-author {display:none;} |
Changing the font/size of the Timestamp on a popup | Time Stamp | ._71n7_author_timeago {font-size: 20px; font-family: 'insertfont!important; } |
.popup-post-time { font-size: 12px; font-family: 'insertfont'!important;} |
What CSS | Subject | Archived Horizontal Slider | Horizontal Slider |
Hiding the Add a Post button | Add a Public Post Button | .btn.public-add-post{display:none;} | .add-post.button{display:none;} |
Change arrow colors on the slider (hover) | Arrows | .theme-slider_v2 .post-list-container .next-post:hover, .theme-slider_v2 .post-list-container .previous-post:hover {background-color: blue; } |
.svg-inline--fa fa-angle-right {color:red;} |
Change arrow colors on the slider (actual arrows) | Arrows | .theme-slider_v2 .post-list-container .next-post, .theme-slider_v2 .post-list-container .previous-post {background-color: red; } |
.svg-inline--fa fa-angle-right fa-2x {color:red;} |
Change an author image on a post (changes it all authors to the same image) | Author image | .author-image-rounded{content: url(inserturl);} | .slide-avatar{content: url(inserturl);} |
Change an author image on a popup (changes it all authors to the same image) | Author image | ._71n7_author_image { content: url(inserturl); } |
.post-avatar--popup-circle.false {content: url(inserturl); } |
Removal of author image (grey man) on a post | Author image | .author-image-rounded{display:none;} | .slide-avatar{display:none;} |
Removal of author image (grey man) on a popup | Author image | ._71n7_author_image {display:none; } |
.post-avatar--popup-circle.false {display:none;} |
Changing the font/size of the Author Name on a popup | Author name | ._71n7_author_name {font-size: 20px; font-family: 'insertfont'!important; |
.post-author__author-name-popup { font-size: 20px; font-family: 'insertfont'!important;} |
Changing the font/size of the Author Username on a popup | Author Username | .author_username { font-size: 20px; font-family: 'insertfont'!important; } |
.post-author__username-popup { font-size: 12px; font-family: 'insertfont'!important;} |
Changing the color of Instagram logo | .fab.fa-instagram{color:red;} | .svg-inline--fa fa-instagram fa-w-14 fa-lg source-icon{color:'color';} | |
Removal of Instagram | .fab.fa-instagram{display:none;} | .svg-inline--fa fa-instagram fa-w-14 fa-lg source-icon{display:none;} | |
Better look on Mobiles - Max | Mobile View | @media screen and (max-width: XXXpx) | @media screen and (max-width: XXXpx) |
Better look on Mobiles - Min | Mobile View | @media screen and (min-width: XXXpx) | @media screen and (min-width: XXXpx) |
Rounding the corners on a post | Post look | .theme-slider_v2 .post{border-radius:50px;} | .slide-image{border-radius:50px;} |
How to make the image show above the text in the new Horizontal slider? | Post look | N/A | .slide-container__slide { flex-direction: column; } |
Changing the font/size of the Timestamp on a popup | Time Stamp | ._71n7_author_timeago {font-size: 20px; font-family: 'insertfont'!important; } |
.popup-post-time { font-size: 12px; font-family: 'insertfont'!important;} |
What CSS | Subject | News | Archived News |
Hiding the Add a Post button | Add a Public Post Button | .nav__add-post{display:none;} | .btn.public-add-post{display:none;} |
Change an author image on a post (changes it all authors to the same image) | Author image | .post-avatar--circle post-avatar--rect loaded{content: url(inserturl);} | .post-acct-img{content: url(inserturl);} |
Change an author image on a popup (changes it all authors to the same image) | Author image | . post-avatar--popup-circle false{content: url(inserturl);} | ._71n7_author_image { content: url(inserturl); } |
Removal of author image (grey man) on a post | Author image | .post-avatar--circle post-avatar--rect loaded{display:none;} | .post-acct-img{display:none;} |
Removal of author image (grey man) on a popup | Author image | . post-avatar--popup-circle false{display:none;} | ._71n7_author_image { display:none; } |
Changing the font/size of the Author Name on a popup | Author name | .post-author__author-name-popup { font-size: 20px; font-family: 'insertfont'!important;} |
._71n7_author_name {font-size: 20px; font-family: 'insertfont'!important; |
Changing the font/size of the Author Username on a popup | Author Username | .post-author__username-popup { font-size: 12px; font-family: 'insertfont'!important;} |
.author_username { font-size: 20px; font-family: 'insertfont'!important; } |
Changing the font on the Click for More button | Click for More Button | .click-for-more.button { font-family: 'insertfont'!important; } |
.nextPost {font-size: 20px; font-family: 'insertfont'!important; } |
Changing the language on the Click for More button | Click for More Button | .click-for-more:after { content: 'insertlabel'; } |
.nextPost {content: 'insertlabel'; } |
Changing the color of Instagram logo | .svg-inline--fa fa-instagram fa-w-14 fa-lg source-icon{color:'color';} | .fab.fa-instagram{color:black !important;} | |
Removal of Instagram logo | .svg-inline--fa fa-instagram fa-w-14 fa-lg source-icon{display:none;} | .fab.fa-instagram{display:none;} | |
Better look on Mobiles - Max | Mobile View | @media screen and (max-width: XXXpx) | @media screen and (max-width: XXXpx) |
Better look on Mobiles - Min | Mobile View | @media screen and (min-width: XXXpx) | @media screen and (min-width: XXXpx) |
Removal of the Navigation bar | Navigation bar | .nav{display:none;} | #collectionHolder { display: none; } |
Rounding the corners on a post | Post look | .news-post{border-radius:50px;} | .hypeTemplate_news.no-post-acct-img.tflex-content.v3-post.non-text-only{border-radius:50px;} |
Changing the font/size of the Timestamp on a popup | Time Stamp | .popup-post-time { font-size: 12px; font-family: 'insertfont'!important;} |
._71n7_author_timeago {font-size: 20px; font-family: 'insertfont'!important; } |
If you have any questions regarding Changes to Themes, please don’t hesitate to contact Technical Support at support@tintup.com.
Comments
Please sign in to leave a comment.