File: gallery.html

package info (click to toggle)
drawing 1.0.2-1
  • links: PTS, VCS
  • area: main
  • in suites: bookworm, forky, sid, trixie
  • size: 17,676 kB
  • sloc: python: 8,539; xml: 275; sh: 147; makefile: 13
file content (189 lines) | stat: -rw-r--r-- 7,318 bytes parent folder | download
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
<!doctype html>
<html>
  <head>
    <title>Drawing - screenshots gallery</title>
    <meta charset="utf-8" />
    <meta name="viewport" content="initial-scale=1.0,width=device-width" />
    <meta name="description"
          content="Drawing is a simple image editor for Linux, inspired by Paint" />
    <link rel="stylesheet" href="example.css" />
    <link rel="icon" type="image/png" href="favicon.png" />
  </head>

  <body>
    <header>
      <div class="header-box">
        <div class="responsive-row">
          <div class="col66">
            <h1>Drawing</h1>
            <p>Simple image editor for Linux</p>
            <hr />
            <div class="responsive-row">
              <div class="col33">
                <a class="nav-item primary-nav-item" href="./index.html">Website homepage</a>
              </div>
              <div class="col33">
                <a class="nav-item" href="https://github.com/maoschanz/drawing">Source code (GPL3)</a>
              </div>
              <div class="col33">
                <a class="nav-item" href="https://paypal.me/maoschannz">Paypal donations</a>
              </div>
            </div>
          </div>
          <div class="col33">
            <img class="header-icon"
              src="https://raw.githubusercontent.com/maoschanz/drawing/master/data/icons/hicolor/128x128/apps/com.github.maoschanz.drawing.png"
               alt="icon" />
          </div>
        </div>
      </div>
    </header>
    <main>
      <h3>Screenshots gallery</h3>
      <hr />

      <h2>GNOME and Budgie</h2><!-- **************************************** -->

      <div class="responsive-row">
        <div class="col50">
          <img alt="screenshot" class="zoomable-img-100"
               src="screenshots/1.0/gnome_menu.png" />
          <p>The primary menu opened (version 1.0.0)</p>
        </div>
        <div class="col50">
          <img alt="screenshot" class="zoomable-img-100"
               src="screenshots/1.0/gnome_selection.png" />
          <p>The "selection" tool and its menu (version 1.0.0)</p>
        </div>
      </div>

      <div class="responsive-row">
        <div class="col50">
          <img alt="screenshot" class="zoomable-img-100"
               src="screenshots/1.0/gnome_new.png" />
          <p>The "new image" menu opened while the canvas is being scaled up (version 1.0.0)</p>
        </div>
        <div class="col50">
          <img alt="screenshot" class="zoomable-img-100"
               src="screenshots/1.0/gnome_tools_preview.png" />
          <p>The thumbnail preview, showing various shapes (version 1.0.0)</p>
        </div>
      </div>

      <div class="responsive-row">
        <div class="col50">
          <img alt="screenshot" class="zoomable-img-100"
               src="screenshots/0.8/gnome_zoom_preview.png" />
          <p>Zooming on the image (version 0.8.0)</p>
        </div>
        <div class="col50">
          <img alt="screenshot" class="zoomable-img-100"
               src="screenshots/0.8/gnome_saturate.png" />
          <p>Change the saturation (version 0.8.0)</p>
        </div>
      </div>

      <div class="responsive-row">
        <div class="col50">
          <img alt="screenshot" class="zoomable-img-100"
               src="screenshots/0.8/gnome_colors.png" />
          <p>Select a color (version 0.8.0)</p>
        </div>
        <div class="col50">
          <img alt="screenshot" class="zoomable-img-100"
               src="screenshots/1.0/gnome_text.png" />
          <p>Add text to a picture (version 1.0.0)</p>
        </div>
      </div>

      <h2>Traditional-looking environments</h2><!-- ************************ -->

      <div class="responsive-row">
        <div class="col50">
          <img alt="screenshot" class="zoomable-img-100"
               src="screenshots/0.6/plasma_global.png" />
          <p>Integration with KDE Plasma global menu-bar (version 0.6.1)</p>
        </div>
        <div class="col50">
          <img alt="screenshot" class="zoomable-img-100"
               src="screenshots/0.4/cinnamon.png" />
          <p>Both the menubar and the toolbar (version 0.4.8)</p>
        </div>
      </div>
      <p>It's also possible to use only the toolbar, or only the menubar. The
      user interface you will get by default depends on your desktop
      environment, but you can change that in the app preferences.</p>
      <div class="responsive-row">
        <div class="col50">
          <img alt="screenshot" class="zoomable-img-100"
               src="screenshots/0.4/mate_scale.png" />
          <p>Scaling the picture, with the menubar and the toolbar with colorful
          icons (version 0.4.7)</p>
        </div>
        <div class="col50">
          <img alt="screenshot" class="zoomable-img-100"
               src="screenshots/0.6/cinnamon_scale.png" />
          <p>Toolbar only, scaling the picture on Cinnamon (version 0.6.0)</p>
        </div>
      </div>

      <h2>elementaryOS</h2><!-- ******************************************** -->

      <div class="responsive-row">
        <div class="col50">
          <img alt="screenshot" class="zoomable-img-100"
               src="screenshots/0.6/elementary_save_as.png" />
          <p>The elementaryOS design guidelines (version 0.6.0)</p>
        </div>
        <div class="col50">
          <img alt="screenshot" class="zoomable-img-100"
               src="screenshots/0.8/elementary_labels.png" />
          <p>Using the primary menu to show the tools names (version 0.8.0)</p>
        </div>
      </div>

      <h2>Linux smartphones</h2><!-- *************************************** -->
      <div class="responsive-row">
        <div class="col33">
          <p>With the default "GNOME" layout, the window can fit in the narrow
          screen of a smartphone such as Purism's Librem 5 or the PinePhone.</p>
          <hr />
          <p>Here is a <a href="https://puri.sm/posts/app-showcase-drawing/">
          video showcase</a> of a few features (from version 0.6.5), using the
          Librem 5.</p>
        </div>
        <div class="col33">
          <img alt="screenshot" class="zoomable-img-100"
               src="screenshots/1.0/librem_menu.png" />
          <p>When features can't fit in the headerbar, they are available from
          the primary menu (version 1.0.0)</p>
        </div>
        <div class="col33">
          <img alt="screenshot" class="zoomable-img-100"
               src="screenshots/1.0/librem_options.png" />
          <p>Pencil options menu in a window resized to fit a Librem 5 screen.
          (version 1.0.0)</p>
        </div>
      </div>
      <!-- end of the page-->
    </main>
    
    <header>
      <!--it's a footer but it has ths same css as the header so here we are-->
      <div class="header-box">
        <div class="responsive-row">
          <div class="col33">
            <a class="nav-item primary-nav-item" href="./index.html">Website homepage</a>
          </div>
          <div class="col33">
            <a class="nav-item" href="https://github.com/maoschanz/drawing">Source code (GPL3)</a>
          </div>
          <div class="col33">
            <a class="nav-item" href="https://paypal.me/maoschannz">Paypal donations</a>
          </div>
        </div>
      </div>
    </header>

  </body>
</html>