JSFiddle - React, Tailwind, and code Playground

by crysfel

HTML

<div ng-app="MyApp" ng-controller="Controller">
    <div class="msg msg-error" ng-class="{'hidden':!error}">
        <p>Lo sentimos pero ha ocurrido un error.</p>
    </div>
    
    <button ng-click="toggleError()">Enviar</button>
</div>

CSS

.hidden{
    display:none;
}
.msg{
    padding:5px 20px;
    margin:10px 0;
}
.msg-error{
    color: #a94442;
    background-color: #f2dede;
    border-color: #ebccd1;
}

JavaScript

angular.module('MyApp',[])

.controller('Controller',function($scope){
    $scope.error = false;
    
    $scope.toggleError = function(){
        $scope.error = !$scope.error;
    }
});