The latest articles on Forem by yanchokraev (@yanchokraev). https://forem.com/yanchokraev https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F332721%2F8a3bb6e5-40e9-4649-ab4b-7685ffef4154.png https://forem.com/yanchokraev en yanchokraev Tue, 11 Feb 2020 14:24:03 +0000 https://forem.com/yanchokraev/introducing-grayshift-mn0 https://forem.com/yanchokraev/introducing-grayshift-mn0 <p>For the last several months, I've been developing websites with a toolkit called Grayshift. It's a lightweight front-end component library for developing fast and powerful web interfaces.</p> <p>It immediately makes any new design or development project that much easier to start, and also makes older projects easier to maintain.</p> <p>Grayshift is based on Bootstrap. It's built on a set of standards for developing such as Code Guide, Stylelint and others.</p> <p>There's a saying that goes: "If it ain't broke, don't fix it". That's why I kept many Bootstrap features and tried not to change too much unless it's explicitly necessary.</p> <p>You can check our full list of components here:</p> <p><a href="https://grayshift.io/components/">https://grayshift.io/components/</a></p> <p>Looking ahead, I plan on adding more to Grayshift with additional components, and such.</p> <h3> Free Themes </h3> <p>Quickly get a project started with any of our examples ranging from using parts of the toolkit to custom components and layouts.</p> <p><a href="https://grayshift.io/themes/">https://grayshift.io/themes/</a></p> <h3> Appearance </h3> <ul> <li>Auto (light or dark based on system settings)</li> <li>Light</li> <li>Dark</li> </ul> <p><a href="https://res.cloudinary.com/practicaldev/image/fetch/s--sfb5mv0o--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/e4tl04ppvqk5zete48ut.png" class="article-body-image-wrapper"><img src="https://res.cloudinary.com/practicaldev/image/fetch/s--sfb5mv0o--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/e4tl04ppvqk5zete48ut.png" alt="Alt Text"></a></p> <p><a href="https://res.cloudinary.com/practicaldev/image/fetch/s--Ii57FHp_--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/gzal8fh60obupulae39e.png" class="article-body-image-wrapper"><img src="https://res.cloudinary.com/practicaldev/image/fetch/s--Ii57FHp_--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/gzal8fh60obupulae39e.png" alt="Alt Text"></a></p> <p>Grayshift supports the latest, stable releases of all modern browsers and platforms.</p> <ul> <li>Chrome</li> <li>Firefox</li> <li>Safari</li> <li>Opera</li> </ul> <p>For now, <a href="https://grayshift.io">visit the Grayshift website</a> to find out more. You can <a href="https://github.com/gskit/gskit">download or fork it at GitHub</a>.</p> webdev showdev html css yanchokraev Sun, 09 Feb 2020 13:50:15 +0000 https://forem.com/yanchokraev/i-designed-some-free-bootstrap-themes-3hil https://forem.com/yanchokraev/i-designed-some-free-bootstrap-themes-3hil <p>Say hello to <a href="https://grayshift.io/themes/">Grayshift</a>, our very first collection of Bootstrap themes that are built entirely by our team and open-sourced for everyone to use.</p> <p>For a long time, I've wanted to give back to the community, but never quite found the time or ideal approach until earlier this year.</p> <p>To start, we're launching with five themes: blog, forum, chat, hosting, and project management.</p> <p>Our goal was to provide minimalist themes with consistent, flexible, and sustainable markup.</p> <p>Head to the <a href="https://grayshift.io/themes/">Grayshift themes site</a> to check them out.</p> <p>Here is some sneak peeks:</p> <p><a href="https://res.cloudinary.com/practicaldev/image/fetch/s--ScZuLef_--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/qowtifkk0jcr2h51wytw.jpg" class="article-body-image-wrapper"><img src="https://res.cloudinary.com/practicaldev/image/fetch/s--ScZuLef_--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/qowtifkk0jcr2h51wytw.jpg" alt="Alt Text"></a></p> <p><a href="https://res.cloudinary.com/practicaldev/image/fetch/s--QFAbL5du--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/yyl9f8eypezwogtrl2qt.png" class="article-body-image-wrapper"><img src="https://res.cloudinary.com/practicaldev/image/fetch/s--QFAbL5du--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/yyl9f8eypezwogtrl2qt.png" alt="Alt Text"></a></p> <h3> One more thing... </h3> <p>For all lovers of dark themes: You can enable dark mode straight from your system settings.</p> html css webdev design