Skip to content

Instantly share code, notes, and snippets.

@QusaiFarraj
Created November 3, 2024 15:25
Show Gist options
  • Select an option

  • Save QusaiFarraj/46e43e6bc9238d532c1a16118e880342 to your computer and use it in GitHub Desktop.

Select an option

Save QusaiFarraj/46e43e6bc9238d532c1a16118e880342 to your computer and use it in GitHub Desktop.

Revisions

  1. QusaiFarraj created this gist Nov 3, 2024.
    187 changes: 187 additions & 0 deletions main.dart
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,187 @@
    import 'package:flutter/material.dart';

    void main() {
    runApp(MyApp());
    }

    class MyApp extends StatelessWidget {
    @override
    Widget build(BuildContext context) {
    return MaterialApp(
    debugShowCheckedModeBanner: false,
    theme: ThemeData(useMaterial3: true),
    home: HomePage(),
    );
    }
    }

    class HomePage extends StatelessWidget {
    @override
    Widget build(BuildContext context) {
    return Scaffold(
    body: Column(
    children: [
    Stack(
    children: [
    Image.network(
    'https://placehold.co/768x300?description=Sunrise%20over%20clouds',
    width: double.infinity,
    height: 300,
    fit: BoxFit.cover,
    ),
    Positioned(
    top: 40,
    left: 20,
    child: Row(
    children: [
    Icon(Icons.settings, color: Colors.white),
    SizedBox(width: 20),
    Icon(Icons.search, color: Colors.white),
    SizedBox(width: 20),
    Icon(Icons.bookmark, color: Colors.white),
    ],
    ),
    ),
    Positioned(
    top: 100,
    left: 0,
    right: 0,
    child: Center(
    child: Text(
    'وَأَدْخِلْنِي بِرَحْمَتِكَ فِي عِبَادِكَ الصَّالِحِينَ',
    style: TextStyle(
    color: Colors.white,
    fontSize: 18,
    fontWeight: FontWeight.bold,
    ),
    ),
    ),
    ),
    Positioned(
    top: 140,
    left: 0,
    right: 0,
    child: Center(
    child: Container(
    padding: EdgeInsets.all(8),
    decoration: BoxDecoration(
    color: Colors.white,
    borderRadius: BorderRadius.circular(8),
    ),
    child: Column(
    children: [
    Text(
    '1',
    style: TextStyle(
    fontSize: 24,
    fontWeight: FontWeight.bold,
    ),
    ),
    Text(
    'جمادى الأولى',
    style: TextStyle(fontSize: 16),
    ),
    ],
    ),
    ),
    ),
    ),
    Positioned(
    bottom: 20,
    left: 20,
    child: Text(
    'Sunrise 06:26',
    style: TextStyle(color: Colors.white, fontSize: 16),
    ),
    ),
    Positioned(
    bottom: 20,
    right: 20,
    child: Text(
    'Dhuhr 11:36',
    style: TextStyle(color: Colors.white, fontSize: 16),
    ),
    ),
    ],
    ),
    Container(
    color: Colors.grey[200],
    padding: EdgeInsets.symmetric(vertical: 10),
    child: Row(
    mainAxisAlignment: MainAxisAlignment.spaceAround,
    children: [
    Text('Various'),
    Text('Prayers'),
    Text('Qibla'),
    Text('Favorites'),
    Text('Counter'),
    ],
    ),
    ),
    Container(
    padding: EdgeInsets.all(16),
    child: Text(
    'Dhuhr in 2:27:29',
    style: TextStyle(
    color: Colors.brown,
    fontSize: 18,
    fontWeight: FontWeight.bold,
    ),
    ),
    ),
    Expanded(
    child: GridView.count(
    crossAxisCount: 2,
    padding: EdgeInsets.all(16),
    crossAxisSpacing: 10,
    mainAxisSpacing: 10,
    children: [
    buildButton('Quran', Colors.brown),
    buildButton('Names of Allah', Colors.red),
    buildButton('My Athkar', Colors.cyan),
    buildButton('Evening Athkar', Colors.redAccent),
    buildButton('Morning Athkar', Colors.blue),
    buildButton('After Prayers', Colors.blueAccent),
    buildButton('Prayers Athkar', Colors.brown),
    buildButton('Waking up Athkar', Colors.purple),
    buildButton('Sleep Athkar', Colors.purpleAccent),
    buildButton('Prophet Mohammed Du...', Colors.orangeAccent),
    buildButton('Dua\'a from the Quran', Colors.grey),
    buildButton('Al-Raqya From Sunna', Colors.teal),
    buildButton('Al-Raqya From Quran', Colors.orange),
    buildButton('More Athkar', Colors.pink),
    buildButton('Tasbeeh', Colors.blueAccent),
    ],
    ),
    ),
    Container(
    color: Colors.grey[300],
    padding: EdgeInsets.all(16),
    child: Row(
    mainAxisAlignment: MainAxisAlignment.spaceBetween,
    children: [
    Text('Comprehensive Athkar'),
    Text('Comprehensive athkar in one page'),
    ],
    ),
    ),
    ],
    ),
    );
    }

    Widget buildButton(String text, Color color) {
    return Container(
    decoration: BoxDecoration(
    border: Border.all(color: color),
    borderRadius: BorderRadius.circular(8),
    ),
    child: Center(
    child: Text(
    text,
    style: TextStyle(color: color, fontSize: 16),
    ),
    ),
    );
    }
    }