Pages

Showing posts with label CSS. Show all posts
Showing posts with label CSS. Show all posts

Thursday, December 6, 2018

Hide Nintex form fields via Custom CSS


Add this name "nf-hide-calculatedcolumn" in the CSS class from calculated field.


Add in this CSS code from Custom CSS Section.

.nf-hide-calculatedcolumn 
{
visibility:hidden;
}


All of your CSS related control will be hidden.


Monday, March 19, 2018

Apply Custom CSS to Sharepoint List View Webpart Pages

Apply in the below code to Script Editor web part or Content Editor Webpart in your list view sharepoint pages.

Add Style Tag begin and end in the following code:

Method 1:


 /* ---------- Table Rows ----------*/
    /* Set background for every row */
    .ms-listviewtable > tbody > tr {
        background: white;
    }

    /* Set border for every row */
    .ms-listviewtable > tbody > tr td{
        border-bottom: 1px solid #AFAFAF !important; /* !important needed over override SharePoint inline style */
        border-left: 1px solid #AFAFAF !important;
        border-right: 1px solid #AFAFAF !important;
    }

    /* Set background for every alternating row */
    .ms-listviewtable > tbody > tr.ms-alternating {
        background: #E2E3E5;
    }

    /* ---------- Table Header Row ----------*/
    /* Remove background set in SharePoint's general data table style */
    .ms-listviewtable tr.ms-viewheadertr {
        background: transparent;
    }

    /* Modify background color */
    tr.ms-viewheadertr > th.ms-vh-icon, /* Input box and attachment icon */
    tr.ms-viewheadertr > th.ms-vh, /* Text */
    tr.ms-viewheadertr > th.ms-vh2,
    tr.ms-viewheadertr > th /* Text */ {
        background: #2E4C70;
    }

    /* Modify background color on hover */
    tr.ms-viewheadertr > th.ms-vh:hover,
    tr.ms-viewheadertr > th.ms-vh2:hover,
    tr.ms-viewheadertr > th  {
        background-color: #273C51;
        border-color: #273C51;
    }

    /* Modify font color */
    .ms-viewheadertr a,
    .ms-viewheadertr div {
        color: white;
    }

    /* Modify font color on hover */
    .ms-viewheadertr a:hover,
    .ms-viewheadertr div:hover {
        color: white;
    }
    tr.ms-viewheadertr > th.ms-vh-icon:last-child {
        display:none;
    }



Method 2:

/* Modify font color */
    .ms-viewheadertr a {
color:White;
    }
    .ms-viewheadertr div {
        color: Blue;
    }

    /* Modify font color on hover */
    .ms-viewheadertr a:hover{
color: White;
}
    .ms-viewheadertr div:hover {
        color: #F36F21;
    }
tr.ms-viewheadertr > th /* Text */ {
        background: #034EA2;
    }
 tr.ms-viewheadertr > th  {
        background-color: #034EA2;
        border-color: #034EA2;
    }

li[text="Alert me"] {display:none;}

Screens: