HTML
JavaScript

<!DOCTYPE html>
<html lang="en" >

<head>
  <meta charset="UTF-8">
  <title>A Pen by  Александр Евгеньевич Киселёв</title>
  <meta name="viewport" content="width=device-width, initial-scale=1">

  
  <link rel='stylesheet prefetch' href='https://angular-material-calendar.bradb.net/css/angular-material-min.css'>
<link rel='stylesheet prefetch' href='https://raw.githubusercontent.com/jsmodules/angular-material-calendar/master/angular-material-calendar.min.css'>

      <link rel="stylesheet" href="css/style.css">

  
</head>

<body>

  <html lang="en" ng-app="StarterApp">
  <head>
    <link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/angular_material/0.9.4/angular-material.min.css">
    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=RobotoDraft:300,400,500,700,400italic">
    <meta name="viewport" content="initial-scale=1" />
  </head>
  <body layout="column" ng-controller="AppCtrl">
    <md-toolbar layout="row">
      <div class="md-toolbar-tools">
        <md-button ng-click="toggleSidenav('left')" hide-gt-sm class="md-icon-button">
          <md-icon aria-label="Menu" md-svg-icon="https://s3-us-west-2.amazonaws.com/s.cdpn.io/68133/menu.svg"></md-icon>
        </md-button>
        <h1>Hello World</h1>
      </div>
    </md-toolbar>
    <div layout="row" flex>
        <md-sidenav layout="column" class="md-sidenav-left md-whiteframe-z2" md-component-id="left" md-is-locked-open="$mdMedia('gt-sm')">
          
        </md-sidenav>
        <div layout="column" flex id="content">
            <md-content layout="column" flex class="md-padding">
            
            </md-content>
        </div>
    </div>
    
    <!-- Angular Material Dependencies -->
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular.min.js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular-animate.min.js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular-aria.min.js"></script>

    <script src="https://ajax.googleapis.com/ajax/libs/angular_material/0.9.4/angular-material.min.js"></script>
    <script src="
    https://cdn.rawgit.com/bradberger/angular-material-calendar/master/dist/angular-material-calendar.js"></script>
  </body>
</html>
  
  

    <script  src="js/index.js"></script>




</body>

</html>


/*Downloaded from https://www.codeseek.co/keesik/a-pen-by-andx410andx43bandx435andx43aandx441andx430andx43dandx434andx440-andx415andx432andx433andx435andx43dandx44candx435andx432andx438andx447-andx41aandx438andx441andx435andx43bandx451andx432-aNePVK */
angular.module("materialExample").controller("calendarCtrl", function($scope, $filter) {
    $scope.selectedDate = null;
    $scope.firstDayOfWeek = 0;
    $scope.setDirection = function(direction) {
      $scope.direction = direction;
    };
    $scope.dayClick = function(date) {
      $scope.msg = "You clicked " + $filter("date")(date, "MMM d, y h:mm:ss a Z");
    };
    $scope.prevMonth = function(data) {
      $scope.msg = "You clicked (prev) month " + data.month + ", " + data.year;
    };
    $scope.nextMonth = function(data) {
      $scope.msg = "You clicked (next) month " + data.month + ", " + data.year;
    };
    $scope.setDayContent = function(date) {
      // You would inject any HTML you wanted for
      // that particular date here.
        return "<p></p>";
    };
});

Comments

More from Александр Евгеньевич Киселёв

A Pen by Александр Евгеньевич Киселёв

Technologies

Comments

More from Александр Евгеньевич Киселёв

A Pen by Александр Евгеньевич Киселёв

A Pen by Александр Евгеньевич Киселёв

Fibbonacci

A Pen by Александр Евгеньевич Киселёв

You Might Also Like

A Pen by Gabriel Berrios

Gradient Animation

tornado test

Angular Material (Jade)

Universal Nav Template Responsive Demo

A Pen by Ingo Joseph

A Pen by Isaac Gierard

A Pen by Aaron Olin