Difference between revisions of "User:Samburkeottawa"

From wiki
Jump to navigation Jump to search
Line 4: Line 4:
  
  
−
         <div class="alert fade alert-simple alert-primary>
+
    <section>
−
           [[File:Student.png|33px|link=|class=start-icon faa-bounce animated]]
+
  <div class="square_box box_three"></div>
−
           <strong class="font__weight-semibold">Well done!</strong> You successfully read this important notice.
+
  <div class="square_box box_four"></div>
 +
  <div class="container mt-5">
 +
    <div class="row">
 +
 
 +
      <div class="col-sm-12">
 +
         <div class="alert fade alert-simple alert-success alert-dismissible text-left font__family-montserrat font__size-16 font__weight-light brk-library-rendered rendered show">
 +
           <button type="button" class="close font__size-18" data-dismiss="alert">
 +
<span aria-hidden="true"><a href="https://www.youtube.com/watch?v=_XiOcsj3oNI&t=50s" target="_blank">
 +
                    <i class="fa fa-times greencross"></i>
 +
                    </a></span>
 +
<span class="sr-only">Close</span>
 +
</button>
 +
          <i class="start-icon far fa-check-circle faa-tada animated"></i>
 +
           <strong class="font__weight-semibold">Well done!</strong> You successfullyread this important.
 +
        </div>
 +
      </div>
 +
 
 +
      <div class="col-sm-12">
 +
        <div class="alert fade alert-simple alert-info alert-dismissible text-left font__family-montserrat font__size-16 font__weight-light brk-library-rendered rendered show" role="alert" data-brk-library="component__alert">
 +
          <button type="button" class="close font__size-18" data-dismiss="alert">
 +
<span aria-hidden="true">
 +
<i class="fa fa-times blue-cross"></i>
 +
</span>
 +
<span class="sr-only">Close</span>
 +
</button>
 +
          <i class="start-icon  fa fa-info-circle faa-shake animated"></i>
 +
          <strong class="font__weight-semibold">Heads up!</strong> This alert needs your attention, but it's not super important.
 +
        </div>
 +
 
 +
      </div>
 +
 
 +
      <div class="col-sm-12">
 +
        <div class="alert fade alert-simple alert-warning alert-dismissible text-left font__family-montserrat font__size-16 font__weight-light brk-library-rendered rendered show" role="alert" data-brk-library="component__alert">
 +
          <button type="button" class="close font__size-18" data-dismiss="alert">
 +
<span aria-hidden="true">
 +
<i class="fa fa-times warning"></i>
 +
</span>
 +
<span class="sr-only">Close</span>
 +
</button>
 +
          <i class="start-icon fa fa-exclamation-triangle faa-flash animated"></i>
 +
          <strong class="font__weight-semibold">Warning!</strong> Better check yourself, you're not looking too good.
 
         </div>
 
         </div>
 +
      </div>
  
 +
      <div class="col-sm-12">
 +
        <div class="alert fade alert-simple alert-danger alert-dismissible text-left font__family-montserrat font__size-16 font__weight-light brk-library-rendered rendered show" role="alert" data-brk-library="component__alert">
 +
          <button type="button" class="close font__size-18" data-dismiss="alert">
 +
<span aria-hidden="true">
 +
<i class="fa fa-times danger "></i>
 +
</span>
 +
<span class="sr-only">Close</span>
 +
</button>
 +
          <i class="start-icon far fa-times-circle faa-pulse animated"></i>
 +
          <strong class="font__weight-semibold">Oh snap!</strong> Change a few things up and try submitting again.
 +
        </div>
 +
      </div>
 +
 +
      <div class="col-sm-12">
 +
        <div class="alert fade alert-simple alert-primary alert-dismissible text-left font__family-montserrat font__size-16 font__weight-light brk-library-rendered rendered show" role="alert" data-brk-library="component__alert">
 +
          <button type="button" class="close font__size-18" data-dismiss="alert">
 +
<span  aria-hidden="true"><i class="fa fa-times alertprimary"></i></span>
 +
<span class="sr-only">Close</span>
 +
</button>
 +
          <i class="start-icon fa fa-thumbs-up faa-bounce animated"></i>
 +
          <strong class="font__weight-semibold">Well done!</strong> You successfullyread this important.
 +
        </div>
 +
 +
      </div>
 +
 +
    </div>
 +
  </div>
 +
</section>
  
 
{{#css:
 
{{#css:
 +
  
 
.alert>.start-icon {
 
.alert>.start-icon {
Line 20: Line 90:
 
.alert>.start-icon {
 
.alert>.start-icon {
 
     margin-right: 5px;
 
     margin-right: 5px;
 +
}
 +
 +
.greencross
 +
{
 +
  font-size:18px;
 +
      color: #25ff0b;
 +
    text-shadow: none;
 
}
 
}
  
Line 28: Line 105:
 
     box-shadow: 0px 0px 2px #259c08;
 
     box-shadow: 0px 0px 2px #259c08;
 
     color: #0ad406;
 
     color: #0ad406;
−
   text-shadow: 1px 1px #00040a;
+
   text-shadow: 2px 1px #00040a;
 
   transition:0.5s;
 
   transition:0.5s;
 
   cursor:pointer;
 
   cursor:pointer;
 
}
 
}
−
 
 
.alert-success:hover{
 
.alert-success:hover{
 
   background-color: rgba(7, 149, 66, 0.35);
 
   background-color: rgba(7, 149, 66, 0.35);
 
   transition:0.5s;
 
   transition:0.5s;
 
}
 
}
−
 
 
.alert-simple.alert-info
 
.alert-simple.alert-info
 
{
 
{
Line 53: Line 128:
 
   background-color: rgba(7, 73, 149, 0.35);
 
   background-color: rgba(7, 73, 149, 0.35);
 
   transition:0.5s;
 
   transition:0.5s;
 +
}
 +
 +
.blue-cross
 +
{
 +
  font-size: 18px;
 +
    color: #0bd2ff;
 +
    text-shadow: none;
 +
}
 +
 +
.alert-simple.alert-warning
 +
{
 +
      border: 1px solid rgba(241, 142, 6, 0.81);
 +
    background-color: rgba(220, 128, 1, 0.16);
 +
    box-shadow: 0px 0px 2px #ffb103;
 +
    color: #ffb103;
 +
    text-shadow: 2px 1px #00040a;
 +
  transition:0.5s;
 +
  cursor:pointer;
 +
}
 +
 +
.alert-warning:hover{
 +
  background-color: rgba(220, 128, 1, 0.33);
 +
  transition:0.5s;
 +
}
 +
 +
.warning
 +
{
 +
      font-size: 18px;
 +
    color: #ffb40b;
 +
    text-shadow: none;
 +
}
 +
 +
.alert-simple.alert-danger
 +
{
 +
  border: 1px solid rgba(241, 6, 6, 0.81);
 +
    background-color: rgba(220, 17, 1, 0.16);
 +
    box-shadow: 0px 0px 2px #ff0303;
 +
    color: #ff0303;
 +
    text-shadow: 2px 1px #00040a;
 +
  transition:0.5s;
 +
  cursor:pointer;
 +
}
 +
 +
.alert-danger:hover
 +
{
 +
    background-color: rgba(220, 17, 1, 0.33);
 +
  transition:0.5s;
 +
}
 +
 +
.danger
 +
{
 +
      font-size: 18px;
 +
    color: #ff0303;
 +
    text-shadow: none;
 
}
 
}
  
Line 76: Line 205:
 
     color: #03d0ff;
 
     color: #03d0ff;
 
     text-shadow: none;
 
     text-shadow: none;
 +
}
 +
 +
.square_box {
 +
    position: absolute;
 +
    -webkit-transform: rotate(45deg);
 +
    -ms-transform: rotate(45deg);
 +
    transform: rotate(45deg);
 +
    border-top-left-radius: 45px;
 +
    opacity: 0.302;
 +
}
 +
 +
.square_box.box_three {
 +
    background-image: -moz-linear-gradient(-90deg, #290a59 0%, #3d57f4 100%);
 +
    background-image: -webkit-linear-gradient(-90deg, #290a59 0%, #3d57f4 100%);
 +
    background-image: -ms-linear-gradient(-90deg, #290a59 0%, #3d57f4 100%);
 +
    opacity: 0.059;
 +
    left: -80px;
 +
    top: -60px;
 +
    width: 500px;
 +
    height: 500px;
 +
    border-radius: 45px;
 +
}
 +
 +
.square_box.box_four {
 +
    background-image: -moz-linear-gradient(-90deg, #290a59 0%, #3d57f4 100%);
 +
    background-image: -webkit-linear-gradient(-90deg, #290a59 0%, #3d57f4 100%);
 +
    background-image: -ms-linear-gradient(-90deg, #290a59 0%, #3d57f4 100%);
 +
    opacity: 0.059;
 +
    left: 150px;
 +
    top: -25px;
 +
    width: 550px;
 +
    height: 550px;
 +
    border-radius: 45px;
 
}
 
}
  
Line 127: Line 289:
 
   }
 
   }
 
}
 
}
−
 
  
  
 
}}
 
}}

Revision as of 08:46, 30 July 2020

Test.


   <section>

         <button type="button" class="close font__size-18" data-dismiss="alert">


                   
                   </a>

Close </button> 

         
         Well done! You successfullyread this important.

</section>


Retrieved from "https://wiki.gccollab.ca/index.php?title=User:Samburkeottawa&oldid=30342"