Share:

Little about my new framework - GoraiyaJS

GoraiyaJS will be web components based framework for front-end web designer. I am trying to include some basic and common component like Button, Label, TextInput, NumberInput, Checkbox, Radiobutton, and so on.

Here is the little example of button.  If you want to add default button using GoraiyaJS then below little HTML code you will write and rest  (CSS and JavaScript) GoraiyaJS will handle. See at last demo of Button. The CSS and JavaScript will built-in inside GoraiyaJS Framework. So, It will become standard for your every websites.

Program:

<span class='gjs-button'>
    Button
</span>

Program:

<!DOCTYPE html>
<html>
    <head>
        <link href='https://fonts.googleapis.com/css?family=Roboto' rel='stylesheet'/>
        <style>
            body{
                padding:20px;
                font-family:roboto;
            }
            .gjs-button::selection{
                background-color:transparent;
            }
            .gjs-button{
                color:rgb(70,70,70);
                background-color:rgb(240,240,240);
                border-radius:3px;
                padding:7px 14px;
                font-size:14px;
                font-weight:bold;
                cursor:default;
            }
            .gjs-button:hover{
                background-color:rgb(220,220,220);
            }
            .gjs-button:active{
                background-color:rgb(200,200,200);
                box-shadow:0px 0px 3px 0px rgb(200,200,200);
            }
        </style>
    </head>
    <body>
        
        <span class='gjs-button'>
            Button
        </span>
        
    </body>
</html>

Output:

Button

Comments

Post a Comment

Popular posts from this blog

Get Color From Pixel C# WPF | Saatody | Amit Padhiyar

Image
Today I will show you, How to get pixel color from particular UIElement. Here we need two main class(es). RenderTargetBitmap and CroppedBitmap. MainWindow.xaml <Window x:Class="Pixel.MainWindow" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" xmlns:local="clr-namespace:Pixel" mc:Ignorable="d" Title="MainWindow" Height="450" Width="800"> <Grid> <Grid.RowDefinitions> <RowDefinition Height="300"/> <RowDefinition Height="30"/> <RowDefinition Height="30"/> </Grid.RowDefinitions> <Border Name="Pi...
Read more

Basic Audio Operations With MP3 And Wave Files Using NAudio C#

In this post, I will discuss about DirectSoundOut, AudioFileReader, Mp3FileReader and WaveFileReader class(es) and its methods. Also, discuss about open, initilize, play, pause, stop and dispose the audio file. Of course! These are basic operations of audio file. The DirectSoundOut Class The DirectSoundOut class can initilize, play, pause, stop, dispose the audio files. It is alternate option of WaveOut and WaveOutEvent. See list of methods of DirectSoundOut class. Init() Play() Pause() Stop() Dispose() The AudioFileReader, Mp3FileReader and WaveFileReader Classes The AudioFileReader class can automatically decide if file is wave or mp4. When the WaveFileReader and Mp3FileReader can't. If you try to open wave file using Mp3FileReader then it will give you exception "System.FormatException: 'Not a WAVE file - no RIFF header'". And same, If you try to open mp3 file using WaveFileReader then it will give you exception "System.IO.InvalidDataEx...
Read more

Create Drag And Drop Operation Between DevExpress GridControl And Custom WPF UI | Saatody | Amit Padhiyar

 Today i will create Drag And Drop Operation. Actually, DevExpress GridControl support Drag and Drop in Views (TreeListView, TabelView, and CardView). But I am trying to drag GridControl row and drop on my custom UI. Here I will write about Drag and Drop with two clipboard operations. Drag Copy And Drop Drag Cut And Drop First set these two properties on GridControl And View (TreeListView, CardView, TableView). GridControl.AllowDrop = true; GridView.AllowDragDrop = true; GridView.AllowDrop = true; GridView.ShowDragDropHint = false; Due to ShowDragDropHint false, The hint will be disable and only cursor will change during DnD (Drag and Drop). First we create Drag Copy And Drop it is too simple to create drag and drop with copy data or element. We just prevent drag leave events using e.Handled = true. GridControl side coding GridControl.AllowDrop = true; GridView.AllowDragDrop = true; GridView.AllowDrop = true; GridView.ShowDragDropHint = false; GridView.StartRecordDrag += (sen...
Read more