murday1983 murday1983 - 1 month ago 10
AngularJS Question

Add A Tick To Button When Selected In Angular 2 App

I am complety new to

Angular 2
and im after do a custom button display when selected. For questions i have 2 buttons for the answer which only one is allowed to be selected (i have all this working) but what id like to do is add a tick in from of the selected buttons value.

I know it will need to be done in
CSS
which is fine but i dont know how to do it.

I tried the below but it doesnt seem to work

.md-fab.md-primary.md-grey-ajb-red-theme.md-button, .md-raised.md-primary.md-grey-ajb-red-theme.md-button
{
font-family:'Glyphicons Halflings';
content:"\e089";
}


Below is an example of what i want. When the button not selected or un-selected the button should just say 'Yes' and obviously have a different colour

enter image description here

Answer

Try this:

.md-fab.md-primary.md-grey-ajb-red-theme.md-button, .md-raised.md-primary.md-grey-ajb-red-theme.md-button
{
    position: relative;
    text-align: center;
}

.md-fab.md-primary.md-grey-ajb-red-theme.md-button:before, .md-raised.md-primary.md-grey-ajb-red-theme.md-button:before
{
    content:"\e089";
    display: block;
    font-family:'Glyphicons Halflings';
    font-size: 20px;
    position: absolute;
    top: 7px; // adjust as per your need
    left: 110px; // adjust as per your need
}